html, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    background: none repeat scroll 0 0 transparent;
    border: 0 none;
    margin: 0;
    outline: 0 none;
    padding: 0;
    vertical-align: baseline;
}
body {
    height: 100%;
	width: 100%;
	float: left;
	min-height:100vh;
	margin: 0;
	padding: 0;
    -webkit-text-size-adjust:none;
    -moz-text-size-adjust:none;
    -ms-text-size-adjust:none;
    -webkit-text-size-adjust:100%;
    -moz-text-size-adjust:100%;
    -ms-text-size-adjust:100%;
}
@font-face {
    font-family: ninabenderText;
    src: url("./Minipax-Regular.ttf") format("opentype");
}

@font-face {
    font-family: ninabenderTitle;
    font-weight: bold;
    src: url("./NimbusSanL-Reg.otf") format("opentype");
}
h1
{
    font-size: 3.5em;
    line-height: 1.1em;
}
p{
    font-size: 0.9em;
    line-height: 1.18em;
    padding: 0.2em 0;
}
a{
    color: black;
}
#page-container{
    margin: 0.5em 2vh;
    font-size: 2em;
    min-height: 96vh;
    display: flex;
    align-content: space-between;
    flex-direction: column;
}
.flex-item{
    align-self: flex-end;
    width: 100%;
}
#nina-bender-main-container{
    flex-grow: 1;
}
#nina-bender-main-content{

}
#nina-bender-text-container,
#gestaltung-text-container
{
    width: auto;
    max-width: 15em;
}
#nina-bender-heading-container{
    float:right;
    font-family: 'ninabenderTitle', sans-serif;
}
#nina-bender-heading-content,
#gestaltung-heading-content
{
    width: 50vw;
    max-width: 20em;
}
#nina-bender-text-container{
    font-family: 'ninabenderText', serif;
}
#nina-bender-text-content{
    
}
#gestaltung-main-container{
}
#gestaltung-main-content{
    
}
#gestaltung-heading-container{
    float:right;
    font-family: 'ninabenderTitle', sans-serif;    
}
#gestaltung-text-container{
    font-family: 'ninabenderText', serif;
}
#gestaltung-text-content{

}

/********************************************************************************/
/********************************************************************************/
/**************  				Mobile Phone				*********************/
/**************  					< 478					*********************/
/********************************************************************************/
/********************************************************************************/


@media screen and (max-width:478px) {
    #nina-bender-heading-container,
    #nina-bender-heading-content,
    #gestaltung-heading-container,
    #gestaltung-heading-content
    {
      width: 100%;
    }
    h1 {
        font-size: 1.7em;
        line-height: 1.1em;
        padding: 0.3em 0 0.2em;
    }
    p {
        font-size: 0.6em;
    }
    #nina-bender-main-container {
        flex-grow: 0;
        margin: 0 0 0.5em;
    }
}


/********************************************************************************/
/********************************************************************************/
/**************  	END ///		Mobile Phone	/// END		*********************/
/**************  					< 478					*********************/
/********************************************************************************/
/********************************************************************************/



/********************************************************************************/
/********************************************************************************/
/**************  				Tablet Portrait				*********************/
/**************  			478 <	    x 	<= 812			*********************/
/********************************************************************************/
/********************************************************************************/


@media screen and (min-width:479px) and (max-width:812px) {
    #nina-bender-heading-container,
    #nina-bender-heading-content,
    #gestaltung-heading-container,
    #gestaltung-heading-content
    {
      width: 100%;
    }
    h1 {
        font-size: 3em;
        line-height: 1.1em;
        padding: 0.3em 0 0.1em;
    }
    p {
        font-size: 0.7em;
    }
    #nina-bender-main-container {
        flex-grow: 0;
        margin: 0 0 1em;
    }
}


/********************************************************************************/
/********************************************************************************/
/**************  	END ///	Tablet Portrait		/// END		*********************/
/**************  			478 <	    x 	<= 812			*********************/
/********************************************************************************/
/********************************************************************************/



/********************************************************************************/
/********************************************************************************/
/**************  				Tablet Widescreen			*********************/
/**************  			813 <=    x 	< 1068			*********************/
/********************************************************************************/
/********************************************************************************/


@media screen and (min-width:813px) and (max-width:1067px) {
    h1 {
        font-size: 2.3em;
        line-height: 1.3em;
    }
    p {
        font-size: 0.7em;
    }
    #nina-bender-text-container, #gestaltung-text-container {
        width: auto;
        max-width: 12em;
    }
    #nina-bender-heading-content, #gestaltung-heading-content {
        max-width: 14em;
    }
}


/********************************************************************************/
/********************************************************************************/
/**************  	END ///	Tablet Widescreen	/// END		*********************/
/**************  			813 <=    x 	< 1068			*********************/
/********************************************************************************/
/********************************************************************************/



/********************************************************************************/
/********************************************************************************/
/**************  				STD Laptop					*********************/
/**************  			1068 <=    x 	<= 1440			*********************/
/********************************************************************************/
/********************************************************************************/


@media screen and (min-width:1068px) and (max-width:1440px) {
}


/********************************************************************************/
/********************************************************************************/
/**************  	END ///		STD Laptop		/// END		*********************/
/**************  			1068 <=    x 	<= 1440			*********************/
/********************************************************************************/
/********************************************************************************/



/********************************************************************************/
/********************************************************************************/
/**************  				STD Office Screen			*********************/
/**************  			1440 <    x 	<= 1680			*********************/
/********************************************************************************/
/********************************************************************************/


@media screen and (min-width:1441px) and (max-width:1680px) {
}

/********************************************************************************/
/********************************************************************************/
/**************  	END ///		STD Office Screen		/// END		*************/
/**************  			1440 <    x 	<= 1680			*********************/
/********************************************************************************/
/********************************************************************************/




/********************************************************************************/
/********************************************************************************/
/**************  				BIG Office Screen			*********************/
/**************  			 	< 1680						*********************/
/********************************************************************************/
/********************************************************************************/


@media screen and (min-width:1681px) {
}


/********************************************************************************/
/********************************************************************************/
/**************  	END ///		BIG Office Screen		/// END		*************/
/**************  			 	< 1680						*********************/
/********************************************************************************/
/********************************************************************************/