body {
    font-family: 'Roboto', sans-serif;
    margin: 0;
    padding: 0;
    font-size: 17px;
	font-weight: 300;
    line-height: 1.8;
    width: 100%;
	color: white;
	background: #040308;
}



h2 { 
	font-size: 34px;
	font-weight: 700;
}


a.tel_btn_black { color: black; }
a.tel_btn_white { color: white; }


a {
  color: white;
  text-decoration: none;
}

.header {
	width: 100%;
	height: 120px;
	display: block;
	margin: 0;
	padding: 0;
}

.logo {
	font-size: 26px;
	font-weight: 700;
	line-height: 1.1;
	display: flex;
	margin: auto 0; 
	width: 380px;
	height: 80px;
	float: left;
	position: relative;
}
.logo img{
	margin: -15px 30px 0 0;
}
.logo a {
	font-size: 26px;
	font-weight: 700;
	line-height: 1.1;
	display: flex;
	width: 380px;
	height: 80px;
	color: white;
	text-decoration: none;
}



.contacts_header {
	font-size: 16px;
	font-weight: 400;
	line-height: 1.4;
	display: table;
	margin: 55px 0 0 0;
	width: 380px;
	height: 80px;
	float: right;
	position: relative;
	text-align: right;
}


.logo_block {
	font-size: 34px;
	font-weight: 700;
	line-height: 1.1;
	display: flex;
	margin: 40px 0 40px 0;
	width: 380px;
}
.logo_block img{
	margin: -35px 30px 0 0;
}


.logo_ehl {
    margin: 20px 0 0 0;
	float: left;
}

.banner {  
	top: 160px;
    max-width: 1140px;
	height: 70%;
	margin: 0;
	padding: 0;
	display: flex;
	position: absolute;
	float: left;
}

.text_banner {
	font-size: 34px;
	font-weight: 700;
	margin: 40px;
	padding: 0;
	line-height: 1.4;
	bottom: 0;
	z-index: 9999;
	position: absolute;
	width: 320px;
}

.btn {
    background: #FFFFFF;
    font-size: 19px;
    font-weight: 700;
    text-decoration: none;
    color: #000000;
    padding: 15px 40px;
    margin: 0 40px;
    border-radius: 8px;
    z-index: 9999;
    position: absolute;
    bottom: 120px;
	opacity: 0;
}

.btn a{
	color: black;
	text-decoration: none;
}



.social {
	margin: 20px 10px 0;
	display: flex;
	float: left;
}

.center {
    max-width: 1140px;
	width: 100%;
	margin: 0 auto;
	padding: 0 20px;
	display: flex;
	justify-content: center;
}

.main {
    background: url(img/bg_1.jpg) center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	min-height: 768px;
	height: 100vh;
    margin: 0;
    padding: 0;
	display: flex;
}

.school_kid {
	color: black;
    background: url(img/bg_2.jpg) center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	min-height: 768px;
    height: 100vh;
    margin: 0;
    padding: 0;
	display: flex;
}

.school_old {
    background: url(img/bg_3.jpg) center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	min-height: 768px;
    height: 100vh;
    margin: 0;
    padding: 0;
	display: flex;
}

.club {
	top:0;
    background: url(img/bg_4.jpg) center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
	min-height: 768px;
    height: 100vh;
    margin: 0;
    padding: 0;
	display: flex;
}

.blok_left {
	width: 50%;
	float: left;
	margin: 40px;
	position: relative;
	display: block;
	justify-content: center;
}

//.blok_left a{
	color: black;
}

.blok_right {
	width: 50%;
	float: left;
	margin: 40px;
	position: relative;
	display: block;
	justify-content: center;
}

.footer {
	font-size: 14px;
    background-color: black;
    min-height: 100px;
	display: flex;
	text-align: center;
}

.footer a{
	text-decoration: underline;
}

.footer a:hover{
	text-decoration: none;
}

.footer_left{
    width: 50%;
    float: left;
    display: table;
    position: relative;
}

.footer_right{
    width: 50%;
    text-align: right;
}

.footer_right p{
	margin: 20px 0;
}


.banner_mobile { display: none;}

.btn_mob {
    background: #FFFFFF;
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
    color: #000000;
    padding: 15px 40px;
    margin: 0;
    border-radius: 8px;
	display: table;
}

.banner-1 {
	width: 320px;

	height: 160px;
    background: url(img/1.jpg) center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    margin: 10px 0;
    padding: 20px;
	display: table;
}
.banner-2 {
	width: 320px;

	height: 160px;
    background: url(img/2.jpg) center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    margin: 10px 0;
    padding: 20px;
	display: table;
}
.banner-3 {
	width: 320px;

	height: 160px;
    background: url(img/3.jpg) center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    margin: 10px 0;
    padding: 20px;
	display: table;
}

.banner_mobile h2 {
    font-size: 24px;
    font-weight: 700;
}




@media only screen and (max-width: 640px) {

.contacts_header { display: none; }

.banner_mobile { display: block; margin: 20px auto;}
	
	.banner {
		display: none;
	}

  .banner,
  .main,
  .school_kid,
  .school_old,
  .club,
  .footer
   {  
  	height: auto;
  }

  
  .center {
    width: 100%;
  	margin: 0 auto;
  	padding: 0 10px;
	display: block;
  }
  
  .blok_left {
  	width: 100%;
  	float: left;
  	margin: 20px 0;
	padding: 0;
  	position: relative;
  }

  .blok_right {
  	width: 100%;
  	float: left;
  	margin: 20px 0;
	padding: 0;
  	position: relative;
  }
  
  .grid figure {
	  display: none;
      position: relative;
      float: left;
      overflow: hidden;
      margin: 0;
	  padding: 0;
	  min-width: 355px;
	  width: 100%;
      height: 180px;
      background: #C1151B;
      text-align: center;
      cursor: pointer;
  }
  
  .footer_left{
      width: 100%;
      float: left;
      display: table;
      position: relative;
  }
  
  .footer_left .logo_ehl{
	  margin: 20px auto;
	  display: flex;
	  float: none;
  }
  
  .footer_right{
      width: 100%;
      text-align: center;
      display: table;
  }

  .footer_right p{
      margin: 0 auto 20px;
      text-align: center;
      display: table;
  }
  
  
  
  
}


@media only screen
and (min-device-width : 640px)
and (max-device-width : 1024px) {
    .banner,
    .main,
    .school_kid,
    .school_old,
    .club,
    .footer
     {  
    	height: auto;
    }

  
    .center {
      width: 100%;
    	margin: 0 auto;
    	padding: 0 10px;
  	display: block;
    }
  
    .blok_left {
    	width: 100%;
    	float: left;
    	margin: 20px 0;
  	padding: 0;
    	position: relative;
    }

    .blok_right {
    	width: 100%;
    	float: left;
    	margin: 20px 0;
  	padding: 0;
    	position: relative;
    }
  
    .banner .grid figure {
			position: relative;
		    float: left;
		    overflow: hidden;
		    margin: 10px;
		    min-width: 200px;
		    max-width: 250px;
		    max-height: 640px;
		    width: 30%;
		    background: #C1151B;
		    text-align: center;
		    cursor: pointer;
    }
	.banner figure.effect-lily h2 { font-size: 24px;     margin: 20px;}
	
	.banner .btn {
	    background: #FFFFFF;
	    font-size: 15px;
	    font-weight: 700;
	    text-decoration: none;
	    color: #000000;
	    padding: 10px 20px;
	    margin: 0 20px;
	    border-radius: 8px;
	    z-index: 9999;
	    position: absolute;
	    bottom: 100px;
	    opacity: 0;
	}
	
	


}