/*
Theme Name: Skillz Landing
Author: Julian Chaniolleau
Description: ...
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

html *{
	-webkit-box-sizing: border-box;
	-moz-box-sizing:    border-box;
	box-sizing:         border-box;
} 

body{
	background: #fff;
	color: #000000;
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 20px;
	line-height: 24px;
	font-weight: 400;
	margin:0;
	padding:0;
	-webkit-font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
}
::selection{background-color:#000;color:#fff;}
::-moz-selection{background-color:#000;color:#fff;}



/*----------------------------------*/
/*			 TYPOGRAPHY				*/
/*----------------------------------*/
a{
	text-decoration:none;
	  -webkit-transition: all 0.2s ease-in-out;
		 -moz-transition: all 0.2s ease-in-out;
		   -o-transition: all 0.2s ease-in-out;
			  transition: all 0.2s ease-in-out;
}


h1 , h2 , h3 , h4 , h5 , h6 { color: inherit; font-family: 'Lato', 'Source Sans Pro', sans-serif; }
h1 strong, h2 strong, h3 strong, h4 strong, h5 strong, h6 strong{ font-weight: bold; }
h1 img, h2 img, h3 img, h4 img, h5 img, h6 img{ display: inline-block; }

h1{ font-size: 72px; line-height: 72px; margin-bottom: 40px; }
h2{ font-size: 36px; line-height: 40px; margin-bottom: 40px; }
h3{ font-size: 48px; line-height: 54px; margin-bottom: 30px; }
h4{ font-size: 36px; line-height: 48px; margin-bottom: 30px; }
h5{ font-size: 24px; line-height: 36px; margin-bottom: 20px; }
h6{ font-size: 18px; line-height: 24px; margin-bottom: 10px; }

strong { font-weight: bold; }
em     { font-style: italic; }
small  { font-size: 80%; line-height: 60%;}
sup{
	position: relative;
	font-size: 60%; line-height: 12px;
	top: -5px;
}

.biglines{ font-size: 36px; line-height: 48px; }
.biglines2{ font-size: 24px; line-height: 36px; }
.smallerTxt{ font-size: 85%; color: #919191; }
.upper{ text-transform: uppercase; }
.bold{ font-weight: bold; }

.gap-10, .gap-20, .gap-30, .gap-40, .gap-50, .gap-60, .gap-70, .gap-80, .gap-90, .gap-100{ display:block; width:100%; }
.gap-10{ height: 10px; }
.gap-20{ height: 20px; }
.gap-30{ height: 30px; }
.gap-40{ height: 40px; }
.gap-50{ height: 50px; }
.gap-60{ height: 60px; }
.gap-70{ height: 70px; }
.gap-80{ height: 80px; }
.gap-90{ height: 90px; }
.gap-100{ height: 100px; }

.max100{ width: 100%; max-width: 100px !important; margin-left: auto; margin-right: auto;}
.max200{ width: 100%; max-width: 200px !important; margin-left: auto; margin-right: auto;}
.max300{ width: 100%; max-width: 300px !important; margin-left: auto; margin-right: auto;}
.max400{ width: 100%; max-width: 400px !important; margin-left: auto; margin-right: auto;}
.max500{ width: 100%; max-width: 500px !important; margin-left: auto; margin-right: auto;}
.max600{ width: 100%; max-width: 600px !important; margin-left: auto; margin-right: auto;}
.max700{ width: 100%; max-width: 700px !important; margin-left: auto; margin-right: auto;}
.max800{ width: 100%; max-width: 800px !important; margin-left: auto; margin-right: auto;}
.max900{ width: 100%; max-width: 900px !important; margin-left: auto; margin-right: auto;}
.max1000{ width: 100%; max-width: 1000px !important; margin-left: auto; margin-right: auto;}
.max1100{ width: 100%; max-width: 1100px !important; margin-left: auto; margin-right: auto;}
.max1200{ width: 100%; max-width: 1200px !important; margin-left: auto; margin-right: auto;}
.max1280{ width: 100%; max-width: 1280px !important; margin-left: auto; margin-right: auto;}
.max1440{ width: 100%; max-width: 1440px !important; margin-left: auto; margin-right: auto;}
.max1600{ width: 100%; max-width: 1600px !important; margin-left: auto; margin-right: auto;}







/*----------------------------------*/
/*			   SECTIONS				*/
/*----------------------------------*/


.section{
	position: relative;
}
.section.fx_1:after{ background: url(https://97displaylive.blob.core.windows.net/aqua/Resources/landingpages/Skillz/assets/images/sep_1.jpg) repeat center center; }
.section.fx_2:after{ background: url(https://97displaylive.blob.core.windows.net/aqua/Resources/landingpages/Skillz/assets/images/sep_2.jpg) repeat center center; }
.section.fx_3:after{ background: url(https://97displaylive.blob.core.windows.net/aqua/Resources/landingpages/Skillz/assets/images/sep_3.jpg) repeat center center; }
.section.fx_4:after{ background: url(https://97displaylive.blob.core.windows.net/aqua/Resources/landingpages/Skillz/assets/images/sep_4.jpg) repeat center center; }
.section.fx_5:after{ background: none; }

.section.fx_1:after,
.section.fx_2:after,
.section.fx_3:after,
.section.fx_4:after,
.section.fx_5:after{
	content: '';
	position: absolute;
	top: 100%; left: 0; z-index: 2;
	width: 100%; height: 30px;
	margin-top: -15px;
}


.intro .content{
	margin: 0 auto;
	max-width: 1440px;
	width:100%;
}
.section .content{
	margin: 0 auto;
	max-width: 1280px;
	width:100%;
}
.section .content{ padding: 60px 40px; }
.intro .content{ padding:20px 40px; }

.type_1{
	background: #fff;
	color: #000;
}
.type_2{
	background: #6b6b6b;
	color: #fff;
}
.type_3{
	background: url(https://97displaylive.blob.core.windows.net/aqua/Resources/landingpages/Skillz/assets/images/bottom_grid.jpg) repeat center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	color: #fff;
}
.type_4{
	background: #000;
	color: #fff;
}
/*----------------------------------*/
/*				COLUMNS				*/
/*----------------------------------*/
.column{
	display: block; float: left;
	margin: 0 1% 30px 1%;
}
.col-1-1{ width: 98%; }
.col-1-2{ width: 48%; }
.col-1-3{ width: 31.33333336%; }
.col-2-3{ width: 64.66666667%; }

/*----------------------------------*/
/*				 INTRO				*/
/*----------------------------------*/
.intro{
	background-color: #fff;
	background-image: url(https://97displaylive.blob.core.windows.net/aqua/Resources/landingpages/Skillz/assets/images/intro.jpg);
	background-position: center top;
	background-repeat: no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	color: #fff;
	position: relative;
}
.intro .content{ position: relative; z-index: 2; }

.present{
	vertical-align: middle;
	font-family: 'Source Sans Pro', sans-serif; 
	font-size: 15px; text-transform: uppercase;
	text-shadow:rgba(0,0,0,0.3) 2px 2px 3px;
}
.header img{ margin: 0 30px 0 0;  float: left; vertical-align: middle;}
.present h1{
	font-size: 104px;
    line-height: 91px;
}

.ninja{
    float: right !important;
    width: 200px;
}

.framedVideo{
	background: #000;
	background: rgba(0,0,0,0.6);
	padding:14px;
}
/*----------------------------------*/
/*				 leadForm			*/
/*----------------------------------*/
.leadForm{
	background: #000;
	background: rgba(0,0,0,0.6);
	padding: 20px 40px;
}
.leadForm h2{ font-size: 30px; line-height: 34px; color: #fff; margin-bottom: 0; text-align: center; text-transform: uppercase; }
.leadForm h3{ font-size: 24px; line-height: 28px; color: #fff; text-align: center;}





/*----------------------------------*/
/*				 MAP				*/
/*----------------------------------*/
.damap{
	background: #fff;
	background: rgba(255,255,255,0.6);
	padding:14px;
}
.dalist{ padding: 40px 30px; }

.dalist h2{ font-size: 50px; line-height: 50px; }


.dalist li{ margin-bottom: 8px;  }
.dalist li a{ background: url(https://97displaylive.blob.core.windows.net/aqua/Resources/landingpages/Skillz/assets/images/dalist_0.png) no-repeat left center; color: #666666; line-height:24px; font-size:24px; padding-left: 32px; }
.dalist li a.active{ background: url(https://97displaylive.blob.core.windows.net/aqua/Resources/landingpages/Skillz/assets/images/dalist.png) no-repeat left center; color: #ffffff;  }

.footer{
	background: #fff;
	color: #999999;
	font-size: 12px;
	letter-spacing: 2px;
	padding:60px 20px;
	text-transform: uppercase;
	text-align: center;
}
.footer a{ color: #000; }




/*----------------------------------*/
/*				 LB	    			*/
/*----------------------------------*/
.openLB-core{
	position: fixed;
	top: 0; left: 0; z-index: 9999999;
	display: none;
	background: #000;
	background: rgba(0,0,0,0.9);
	width: 100%; height: 100%;
}
.openLB-core .container{
	display: block;
	opacity: 0;
	max-height: 100vh;
	overflow: hidden;
	overflow-y: auto;
	max-width: 1200px;
	width: 100%;
	position: absolute;
	top: 50%; left: 50%;
	padding: 30px;
	border-radius: 6px;
	background: #fff;
	color: #000000;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	  -webkit-transition: opacity 0.2s ease-in-out;
		 -moz-transition: opacity 0.2s ease-in-out;
		   -o-transition: opacity 0.2s ease-in-out;
			  transition: opacity 0.2s ease-in-out;
}
.openLB-core .close{
	display: block;
	position: absolute;
	top: 20px;
	right: 10px;
	z-index:99999990;
	font-size: 13px;
	text-transform: uppercase;

    background: #000; color: #fff; border: 1px solid #000;
    padding: 0 16px;
    line-height: 36px;
    border-radius: 4px;
    font-size: 14px; text-transform: uppercase;
    font-weight: bold;

}

.openLB-core .container.active{
	opacity: 1;
}


.openLB-core{ font-size: 15px; }
.openLB-core ul{
    margin: 0 0 30px 40px;
}
.openLB-core h4{ font-weight: bold; }
.openLB-core ul,.openLB-core ol{ margin-bottom: 30px; display: block; }
.openLB-core ul li,.openLB-core ol li{ color:#555; font-style: italic; font-size: 16px; }
.openLB-core ul li{ list-style: square; }
.openLB-core ol li{ list-style: decimal; list-style-position: inside; padding-left: 20px;}
.button{
    background: #000; color: #fff; border: 1px solid #000;
    padding: 0 16px;
    display: inline-block;
    line-height: 36px;
    border-radius: 4px;
    font-size: 14px; text-transform: uppercase;
    font-weight: bold;
}
.button:hover{background: #fff; color: #000; border: 1px solid #000;}