/*
    Template:       airi
    Theme Name:     Airi Child
    Theme URI:      http://themeforest.net/user/LA-Studio/portfolio?ref=LA-Studio
    Author:         LA Studio
    Author URI:     http://themeforest.net/user/LA-Studio?ref=LA-Studio
    Description:    Clean, Minimal WooCommerce Theme
    Version:        1.0
    Tags:           one-column, two-columns, three-columns, four-columns, left-sidebar, right-sidebar, custom-background, custom-colors, custom-header, custom-menu, featured-image-header, featured-images, flexible-header, full-width-template, post-formats, sticky-post, theme-options, translation-ready
    License: 		GNU General Public License
	License URI: 	licence/GPL.txt
    Text Domain:    airi-child
    Domain Path:    /languages/
*/
body{font-size:28px!important;}
.site-branding{display:none!important;}
.is-sticky .site-header-inner{background:none!important;}
.staffs{display:block; width:100%;}
.staff{display:inline-block; width:30%; margin:3%; text-align:center; font-size:13px; font-weight:600; line-height:30px;}
.staff img{border:2px solid #fff; border-radius:300px; box-shadow: 0px 0px 13px rgba(255, 255, 255, 0.4); display:block;}
.brand img{max-width:85%;}
.about-wave-bg{position:absolute; right:0;}

.headline{font-size:110px!important; font-weight:600;}
.headline-shine{font-size:110px!important; font-weight:600; text-shadow: 0px 0px 15px rgba(255, 255, 255, 0.9);}
.headline-shine-2{font-size:140px!important; line-height:145px; font-weight:600; text-shadow: 0px 0px 25px rgba(255, 255, 255, 0.9);}
.headline-hashtag{font-size:60px!important; font-weight:600;}
.face-img{display:none;}
.face-bottom-gradient{background-image: url("img/face-bottom-gradient.png"), url("img/stars-bg.png"); background-repeat: no-repeat, no-repeat;  background-position: bottom center, top right -500px; background-size: 100%,auto;}
.leading-bottom-gradient{background-image: url("img/leading-bottom-gradient.png"); background-repeat: no-repeat;  background-position: center bottom; background-size: 100%;}
.dashboard-top-gradient{background-image: url("img/dashboard-top-gradient.png"); background-repeat: no-repeat;  background-position: center top; background-size: 100%;}
.illuminance-top-gradient{background-image: url("img/illuminance-left-bg.png"),url("img/illuminance-top-gradient.png"); background-repeat: no-repeat, no-repeat;  background-position: left bottom, center top; background-size:auto, 100%;}
.research-right-bg{background-image: url("img/research-dot-bg.png"); background-repeat: no-repeat;  background-position: top right; }
.map-bg{background-image: url("img/pink-bg.png"),url("img/white-stars-bg.png"); background-repeat: no-repeat, no-repeat;  background-position: top right -50px, center left; background-size:auto, auto;}

.feature{padding:0 120px; text-align:center;font-size:25px!important;}
.feature img{max-height:150px; max-width:375px;}

.finger{position:absolute; margin-top:-400px;}

.client-logo{text-align:center;}
.client-logo img{max-height:180px;filter: grayscale(1);}
.client-logo img:hover{filter: grayscale(0);}

.client-category-headline h4{font-weight:600; color:#000!important;font-size:30px!important;}

.contact, .domain, .address{text-align:center;font-size:24px!important;}
.contact a, .domain a{font-weight:600;}
.contact a{padding:0 50px;}
.contact a + a{border-left: 1px solid #fff;}
.copyright{font-size:18px!important; text-align:center;}

#aboutlpc-btn{right:-190px;position:absolute; cursor:pointer;}
#products-btn{float:right; cursor:pointer;}

.white-gradient{background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 100%);}

.overlay-menu {
  height: 0%;
  width: 100%;
  position: fixed;
  z-index: 99;
  top: 0;
  left: 0;
  background: rgb(10,84,177);
background: linear-gradient(90deg, rgba(10,84,177,1) 0%, rgba(98,215,209,1) 50%, rgba(45,94,164,1) 75%, rgba(102,52,151,1) 100%);
  overflow-y: hidden;
  transition: 0.5s;
}

.overlay-bg {
  height: 100%;
  width: 100%;
  background-image: url("img/menu-flare.png"),url("img/box.png"),url("img/home-slider-numbers-bg.png"); background-repeat: no-repeat, no-repeat, no-repeat;  background-position: bottom 10% left 25%, bottom 30% center, bottom right; background-size:auto, auto, 90%;
}

.overlay-content {
  position: absolute;
  bottom: 10%;
  left: 5%;
  margin-top: 30px;
}

.overlay-menu a {
  padding: 10px;
  text-decoration: none;
  font-size: 80px;
  line-height:110px;
  display: block;
  transition: 0.3s;
  text-transform:uppercase;
  font-weight:600;
}

/* Faux outline for older browsers */
.outline {
    color: white; /* Unfortunately you can't use transparent here … */
    text-shadow:
     -1px -1px 0 #fff,  
    1px -1px 0 #fff,
    -1px 1px 0 #fff,
     1px 1px 0 #fff
}

/* Real outline for modern browsers */
@supports((text-stroke: 1px white) or (-webkit-text-stroke: 1px white)) {
    .outline {
        color: transparent;
        -webkit-text-stroke: 1px white;
    text-stroke: 1px white;
        text-shadow: none;
    }
}

.outline:hover, .outline:focus {
  color: #fff;
  text-shadow: 0px 0px 25px rgba(255, 255, 255, 0.9);
}

.overlay-menu .closebtn {
  position: absolute;
  top: 20px;
  right: 45px;
  font-size: 60px;
}

@media screen and (max-height: 450px) {
  .overlay-menu {overflow-y: auto;}
  .overlay-menu a {font-size: 20px}
  .overlay-menu .closebtn {
  font-size: 40px;
  top: 15px;
  right: 35px;
  }
}

#dialog {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 1;
  background-color: #444;
  color: #fff;
}
#dialog2 {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 1;
  background-color: #fff;
  color: #000;
}
#dialog.show, #dialog2.show {  
  flex-wrap: nowrap;
}
#close {
  background: rgba(255, 255, 255, 0.5);
  border: none;
  color: #000;
  display: block;
  font-size: 0.7em;
  padding: 0.4em 0.7em;
  position:absolute!important;
  z-index:2;
  right:0;
}
#close:hover {
  background: rgba(255, 255, 255, 0.9);
  cursor: pointer;
}
#close {
  position: relative;
}



.box-1 {height: 140px; width: 140px; position:absolute; left:600px; margin-top:-100px;}
.box-2 {height: 250px; width: 298px; position:absolute; left:850px; z-index:2;}
.polygon-1 {height: 350px; width: 501px; position:absolute; left:1000px; z-index:1;}
.polygon-2 {height: 400px; width: 573px; position:absolute; left:950px;}
.bg-1 {	height: 345px; width: 250px; position:absolute; left:-130px;}
.box-3 {height: 257px;width: 300px; position:absolute; left:-140px;}
.ball-1 {height: 140px;	width: 140px; position:absolute; left:500px;}
.ball-2 {height: 450px;	width: 450px; position:absolute; left:100px;}
.sidelight{ position:absolute; width:1141px; height:300px;}
.ball-3 {height: 450px;	width: 450px; position:absolute; left:500px; margin-top:-1000px;}
.hand {height: 868px; width: 700px; position:absolute; z-index:2;}
.ball-4 {height: 200px;	width: 200px; position:absolute; left:-90px;}
.ball-5 {height: 193px;	width: 200px; position:absolute; right:100px;}
.box-4 {height: 214px;width: 250px; position:absolute; right:549px; z-index:1;}
.fiber{position:absolute; right:-300px; opacity:0.7; margin-top:1300px;}


.cf:before,
.cf:after {
  display: table;
  content: ' ';
}

.cf:after {
  clear: both;
}

.cf {
  *zoom: 1;
}

.site-content {
  text-align: left;
  width: 100%; 
  margin-left: auto;
  margin-right: auto;
}

.courses {
  margin-top: 30px;
  margin-bottom: 20px;
}

.course-item {
  width: 66%;
  height:800px;
  padding-right: 1%;
  padding-left: 1%;
  margin-bottom: 30px;
  /* ensuring proper layout*/
  float: left;
}

.button--previous, .button--next{position:absolute; max-width:52px; max-height:80px; top:46%; z-index:2;cursor:pointer;}
.button--previous{left:60px;}
.button--next{right:60px;}

.flickity-enabled{position:relative}.flickity-enabled:focus{outline:0}.flickity-viewport{overflow:hidden;position:relative;height:100%}.flickity-slider{position:absolute;width:100%;height:100%}.flickity-enabled.is-draggable{-webkit-tap-highlight-color:transparent;tap-highlight-color:transparent;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.flickity-enabled.is-draggable .flickity-viewport{cursor:move;cursor:-webkit-grab;cursor:grab}.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down{cursor:-webkit-grabbing;cursor:grabbing}.flickity-prev-next-button{position:absolute;top:50%;width:44px;height:44px;border:none;border-radius:50%;background:#fff;background:hsla(0,0%,100%,.75);cursor:pointer;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%)}.flickity-prev-next-button:hover{background:#fff}.flickity-prev-next-button:focus{outline:0;box-shadow:0 0 0 5px #09F}.flickity-prev-next-button:active{filter:alpha(opacity=60);opacity:.6}.flickity-prev-next-button.previous{left:10px}.flickity-prev-next-button.next{right:10px}.flickity-rtl .flickity-prev-next-button.previous{left:auto;right:10px}.flickity-rtl .flickity-prev-next-button.next{right:auto;left:10px}.flickity-prev-next-button:disabled{filter:alpha(opacity=30);opacity:.3;cursor:auto}.flickity-prev-next-button svg{position:absolute;left:20%;top:20%;width:60%;height:60%}.flickity-prev-next-button .arrow{fill:#333}.flickity-prev-next-button.no-svg{color:#333;font-size:26px}.flickity-page-dots{position:absolute;width:100%;bottom:-25px;padding:0;margin:0;list-style:none;text-align:center;line-height:1}.flickity-rtl .flickity-page-dots{direction:rtl}.flickity-page-dots .dot{display:inline-block;width:10px;height:10px;margin:0 8px;background:#333;border-radius:50%;filter:alpha(opacity=25);opacity:.25;cursor:pointer}.flickity-page-dots .dot.is-selected{filter:alpha(opacity=100);opacity:1}


@media (max-width: 1600px) {
	body{font-size:24px!important;}

.headline{font-size:90px!important;}
.headline-shine{font-size:90px!important;}
.headline-shine-2{font-size:110px!important;line-height:115px;}
.headline-hashtag{font-size:50px!important;}
.overlay-menu a { font-size: 70px; line-height:90px;}
.feature{padding:0 60px;font-size:22px!important;}
.feature img{max-height:auto; max-width:100%;}
.client-logo img{max-height:140px;}
.course-item {height:600px;}
.contact, .domain, .address{font-size:20px!important;}
.copyright{font-size:14px!important;}
}

@media (max-width: 1200px) {
	body{font-size:20px!important;}
	.headline{font-size:70px!important;}
	.headline-shine{font-size:70px!important;}
	.headline-shine-2{font-size:70px!important; line-height:80px;}
	.headline-hashtag{font-size:32px!important;}
	.about-top-padding{height:20px!important;}
	.about-wave-bg{width:50%;}
	.staff{width:38%; margin:5% 4.5%;}
	.face-bottom-gradient{background-position: bottom center, top right -700px;}
	.map-bg{background-position: center right, center left; background-size:100%, 50%;}
	.feature{font-size:18px!important;}
	#aboutlpc-btn{right:-110px;}
	
	.box-1 {height: 100px; width: 100px; left:450px;}
	.box-2 {height: 200px; width: 238px; left:530px; margin-top:-350px;}
	.polygon-1 {height: 300px; width: 429px; left:650px; margin-top:300px;}
	.polygon-2 {height: 330px; width: 473px;left:600px; margin-top:650px;}
	.bg-1 {	left:-160px;}
	.ball-4 {height: 150px;	width: 150px;left:-80px; margin-top:750px;}
	.ball-5 {height: 145px;	width: 150px; right:50px; margin-top:800px;}
	.box-3 {height: 171px;width: 200px; left:-100px; margin-top:-800px;}
	.ball-1 {height: 100px;	width: 100px; left:400px; margin-top:180px;}
	.ball-2 {height: 250px;	width: 250px; left:150px; margin-top:-350px;}
	.ball-3 {height: 350px;	width: 350px; left:350px; margin-top:-150px;}
	.box-4 {height: 171px;width: 200px; right:350px; margin-top:800px;}
	.hand {left:-200px; margin-top:-900px;}
	.fiber{right:-550px; margin-top:200px;}
	
	.course-item { height:460px!important;}
	.button--previous, .button--next{top:42%;}
}

@media (max-width: 992px) {
	body{font-size:18px!important;}
	.headline{font-size:50px!important;}
	.headline-shine{font-size:50px!important;}
	.headline-shine-2{font-size:50px!important; line-height:60px;}
	.headline-hashtag{font-size:26px!important;}
	.about-wave-bg{margin-top:50px; width:60%;}
	.staff{width:40%; font-size:12px;}
	.face-bottom-gradient{background-position: bottom center, top right -850px;}
	.map-bg{background-position: center right -150px, center left;}
	.feature{padding:0 30px; font-size:18px!important;}
	
	#aboutlpc-btn{right:-90px;}
	
	.box-1 {left:330px; margin-top:20px;}
	.box-2 {left:430px; margin-top:-600px;}
	.polygon-1 {left:500px; margin-top:700px;}
	.polygon-2 {left:500px; margin-top:1500px;}
	.ball-1 {left:300px; margin-top:330px;}
	.ball-2 {left:50px; margin-top:-600px;}
	.ball-3 {height: 300px;	width: 300px; left:250px; margin-top:600px;}
	.sidelight{ width:791px; height:200px; margin-left:250px;}
	.ball-4 {margin-top:1600px;}
	.ball-5 {right:50px; margin-top:1750px;}
	.box-3 {left:-100px; margin-top:-1700px;}
	.box-4 {right:300px; margin-top:1400px;}
	.hand {height: 682px; width: 550px; left:-200px; margin-top:-1450px;}
	.fiber{right:-600px; margin-top:-900px;}
	.hand-top-padding{height:300px!important;}
	.course-item { height:340px!important;}
	.button--previous, .button--next{top:39%;}
	.copyright{font-size:10px!important;}
}

@media (max-width: 480px) {
	
	.headline{font-size:50px!important;padding:0 30px;}
	.headline-shine{font-size:55px!important;padding:0 30px;}
	.headline-shine-2{font-size:60px!important; line-height:75px; padding:0 30px;}
	.headline-hashtag{font-size:24px!important;padding:0 30px;}
	.about-top-padding{height:0!important;}
	.about-wave-bg{margin-top:450px; width:90%;}
	.staff{font-size:11px; vertical-align:top;}
	.map-bg{background-position: center right, center left; background-size:90%, 70%;}
	.padding-lr{padding:0 30px;}
	.face-img{display:block;}
	.face-img img{width:75%;}
	.face-bottom-gradient{background-position: bottom center, bottom right -1200px; background-size: 100%,auto;}
	.research-right-bg{background-position: top right; background-size:70%;}
	.illuminance-top-gradient{background-position: left center, center top; background-size:80%, 100%;}
	.feature{padding:0 60px;}
	.innovation{padding-left:30px;}
	
	#aboutlpc-btn{right:-70px; margin-top:170px; z-index:1;}
	
	.box-1 {height: 80px; width: 80px; left:320px; margin-top:0;}
	.box-2 {height: 125px; width: 148px;left:250px; margin-top:0px;}
	.polygon-1 {height: 175px; width: 250px;left:250px; margin-top:100px;}
	.polygon-2 {height: 200px; width: 287px; left:200px; margin-top:550px;}
	.bg-1 {	height: 173px; width: 125px; left:-60px;}
	.ball-1 {height: 60px;	width: 60px; left:200px; margin-top:200px; z-index:1;}
	.ball-2 {height: 150px;	width: 150px; left:100px; margin-top:-550px; z-index:1;}
	.ball-3 {height: 200px;	width: 200px; left:100px; margin-top:-150px;}
	.sidelight{margin-left:-250px; width:761px; height:200px;}
	.hand {height: 350px; width: 282px; left:-50px; margin-top:-500px}
	.box-4 {height: 107px;width: 120px; right:100px; margin-top:450px;}
	.fiber{right:-220px; height: 214px; width: 400px; margin-top:800px;}
	.ball-4 {height: 100px;	width: 100px;left:-50px; margin-top:500px;}
	.box-3 {height: 86px;width: 100px; left:-30px; margin-top:-500px;}
	.ball-5 {height: 66px;	width: 70px; right:30px; margin-top:600px;}
	
	
	.course-item { height:150px!important;}
	.button--previous, .button--next{max-width:26px; max-height:40px;top:40%;}
	.button--previous{left:30px;}
	.button--next{right:30px;}
	
	.copyright{padding:0 30px;}
}