
/*-------------------------G R I D-----------------------------------*/

.about_parent {
	display: grid;
	grid-template-columns: repeat(2, 30vw);
	grid-template-rows: repeat(2, auto);
	grid-column-gap: 0px;
	grid-row-gap: 0px;
	background:none;
	width:60vw;
	position:absolute; 
	left:27vw; 
	top:30vw; 
	padding-bottom:0;
	z-index:50;
	}

.div1 { 	
	grid-area: 1 / 1 / 2 / 2;
	background-color:#fff;
	}
	
.div2 { 	/*Text/info*/
	grid-area: 1 / 2 / 2 / 3;
	background-color:#fff;
	padding-top:3vw;
	padding-bottom:1.5vw;
	padding-right:3vw;
	}

.div3 { 	/*Copyright*/
	grid-area: 2 / 1 / 3 / 3; 
	background-color:#ccc;
	height:5vw;
	padding-top:3vw;
	margin:0;
	padding-bottom:0;
	}

/*-------------------------T Y P O G R A P H Y-------------------------*/

.about_title {			/*Product grid titles: XF8, etc.*/
	font-family: 'Bungee';
	font-size:2.5vw;
	color:#333;
	letter-spacing:0.1vw;
	z-index:50;
	margin:0;
	padding-bottom:1vw;
	}
	
.about {	/*Content text*/
	font-size:1.3vw;
	font-weight:400;
	letter-spacing:0.1vw;
	color:#666;
	font-family: 'Titillium Web';
	line-height:150%;
	margin-top:0;
	}
	
.bold {	/*Content text*/
	font-weight:600;
	}
	
/*-------------------------M E D I A-----------------------------------*/

@media screen and (max-width: 1200px) and (min-width: 800px){

/*-------------------------G R I D-----------------------------------*/

.about_parent {
	grid-template-columns: repeat(2, 35vw);
	width:70vw;
	left:23vw; 
	top:34vw; 
	}

.div1 { 	
	grid-area: 1 / 1 / 2 / 2;
	background-color:#fff;
	}
	
.div2 { 	/*Text/info*/
	grid-area: 1 / 2 / 2 / 3;
	background-color:#fff;
	padding-top:3vw;
	padding-bottom:1.5vw;
	padding-right:3vw;
	}

.div3 { 	/*Copyright*/
	grid-area: 2 / 1 / 3 / 3; 
	background-color:#ccc;
	height:5vw;
	padding-top:3vw;
	margin:0;
	padding-bottom:0;
	}

/*------------T Y P O G R A P H Y-----------------*/

.about_title {			/*Product grid titles: XF8, etc.*/
	font-size:2.8vw;
	padding-bottom:2vw;
	}
	
.about {	/*Content text*/
	font-size:1.5vw;
	line-height:150%;
	}

}

/*Tablets, phones*/
@media screen and (max-width: 800px) {

/*-------G R I D---------*/

.about_parent {
	grid-template-columns: repeat(2, 45vw);
	grid-template-rows: repeat(2, auto);
	width:90vw;
	position:absolute; 
	left:5vw; 
	top:36vw;
	height:auto;
	}

.div1 { 	
	grid-area: 1 / 1 / 2 / 2;
	}
	
.div2 { 	/*Text/info*/
	grid-area: 1 / 2 / 2 / 3;
	background-color:#fff;
	padding-top:5vw;
	padding-bottom:2vw;
	padding-right:5vw;
	margin-left:-3.7vw;
	}

.div3 { 	/*Copyright*/
	height:7vw;
	padding-top:3vw;
	margin:0;
	padding-bottom:2vw;
	}

/*-------T Y P O G R A P H Y---------*/

.about_title {			
	font-size:3vw;
	margin:0;
	padding-bottom:3vw;
	}

.about {	/*Content text*/
	font-size:2.6vw;
	letter-spacing:0.1vw;
	line-height:150%;
	padding-left:-0.1vw;
	}
}

/*Portrait phones*/
@media screen and (max-width: 550px) and (orientation: portrait) {	

/*-------G R I D---------*/

.about_parent {
	grid-template-columns: repeat(2, 45vw);
	grid-template-rows: repeat(2, auto);
	width:90vw;
	position:absolute; 
	left:5vw; 
	top:72vw;
	height:auto;
	}

.div1 { 	
	display:none;
	}
	
.div2 { 	/*Text/info*/
	grid-area: 1 / 1 / 2 / 3;
	background-color:#fff;
	padding-top:8vw;
	padding-bottom:3vw;
	padding-right:8vw;
	padding-left:8vw;
	margin-left:0;
	}

.div3 { 	/*Copyright*/
	height:7vw;
	padding-top:3vw;
	margin:0;
	padding-bottom:3vw;
	}

/*-------T Y P O G R A P H Y---------*/

.about_title {			
	font-size:4vw;
	margin:0;
	padding-bottom:4vw;
	}

.about {	/*Content text*/
	font-size:3.3vw;
	letter-spacing:0.1vw;
	line-height:160%;
	padding-left:-0.1vw;
	}
}	
	
	
	
	