/* ------------ */
/* 1. Fonts */
/* ------------ */
@font-face {
   font-family: SamsungSharp;
   font-weight: 700;
   font-style: normal;
   src: local('SamsungSharpSans-Bold'),
   url(../fonts/SamsungSharpSans-Bold.ttf);
}
@font-face {
   font-family: SamsungSharp;
   font-weight: 500;
   font-style: normal;
   src: local('SamsungSharpSans-Regular'),
   url(../fonts/SamsungSharpSans-Regular.ttf);
}
@font-face {
   font-family: SamsungOne;
   font-weight: 300;
   font-style: normal;
   src: url(../fonts/SamsungOneCyrillic-300.ttf);
}
@font-face {
   font-family: SamsungOne;
   font-weight: 800;
   font-style: normal;
   src: url(../fonts/SamsungOneCyrillic-800.ttf);
}
@font-face {
   font-family: SamsungOneC;
   font-weight: 800;
   font-style: normal;
   src: url(../fonts/SamsungOneCyrillic-800C.ttf);
}
@font-face {
   font-family: RobotoBlack;
   font-style: normal;
   src: url(../fonts/RobotoBlack.ttf);
}

@import url('https://fonts.googleapis.com/css?family=Roboto&subset=cyrillic');

/* ------------ */
/* 1. Reset css */
/* ------------ */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, 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,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
   margin: 0;
   padding: 0;
   border: 0;
   font-size: 100%;
   font: inherit;
   vertical-align: baseline;
	line-height: normal;
}

/* ---------------------------------------------- */
/* 2. HTML5 display-role reset for older browsers */
/* ---------------------------------------------- */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
   display: block;
}
body {
   line-height: 1;
}
blockquote, q {
   quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
   content: '';
   content: none;
}
table {
   border-collapse: collapse;
   border-spacing: 0;
}

/* ---------------- */
/* 3. Global styles */
/* ---------------- */
body {
   background: url(../img/bg.jpg) center top no-repeat;
   background-size: 1500px;
   background-color: rgb(205, 201, 200);
}
header {
   text-align: center;
}
section {
   max-width: 1000px;
   margin: 350px auto 0 auto;
   background: white;
}
.button {
   display: inline-block;
   border: 1px solid black;
   font-size: 18px;
   font-family: SamsungOne, sans-serif;
   font-weight: 800;
   padding: 13px 35px 10px 35px;
   color: black;
   text-decoration: none;
   border-radius: 40px;
   margin: 10px;
   cursor: pointer;
}
.button:hover {
   color: white;
   background: #1428a0;
}
.button.active {
   background: #1428a0;
   border-color: #1428a0;
   color: white;
}

/* --------- */
/* 4. Header */
/* --------- */
header h1 {
   font-family: SamsungSharp, sans-serif;
   font-size: 35px;
   font-weight: 700;
   padding: 75px 0 45px 0;
   text-align: center;
}

/* --------- */
/* 5. Banner */
/* --------- */
.banner {
   background: url(../img/banner.png) center top no-repeat;
   background-size: 100% 100%;
   padding: 20px;
   margin: 50px 0 0 0;
}
.banner .inner {
   border: 3px solid white;
   padding: 35px;
   color: white;
   font-family: SamsungOneC, sans-serif;
   font-weight: 800;
   text-align: center;
}
.banner .inner p {
   font-size: 35px;
}
.banner .inner p.bold {
   font-size: 46px;
   margin: 25px 0;
}
.banner .inner a {
   background: rgb(240,143,92);
   display: inline-block;
   color: white;
   text-decoration: none;
   border: 1px solid white;
   border-radius: 40px;
   font-size: 25px;
   margin: 40px 0 0 0;
   padding: 20px 45px;
   cursor: pointer;
}
.banner .inner a:hover {
   opacity: 0.8;
}

/* ---------- */
/* 6. Content */
/* ---------- */
.content {
   padding: 45px 140px;
   font-family: RobotoBlack, sans-serif;
}
.content h2 {
   font-size: 35px;
   text-align: center;
   padding: 20px 0;
}
.content ol {
   padding: 0 20px;
}
.content ol li {
   margin: 20px 0;
   font-size: 22px;
   line-height: 25px;
}
.content ol li .part {
   margin: 0 0 40px 0;
}
.content ol li .sub_part {
   margin: 0 0 40px 0;
   font-family: SamsungOne, sans-serif;
   font-weight: 300;
   font-size: 19px;
}
.social a {
   display: inline-block;
   margin: 15px 5px 0 10px;
   cursor: pointer;
}
.social a img {
   max-width: 50px;
}
.social a:hover {
   opacity: 0.8;
}

/* -------- */
/* 7. Video */
/* -------- */
.video {
   width: 100%;
   position: relative;
   display: block;
   cursor: pointer;
}
.video img {
   width: 100%;
}
.video:before {
   content: "";
   display: block;
   position: absolute;
   width: 105px;
   height: 105px;
   background: url(../img/start.png) center top no-repeat;
   background-size: 100% 100%;
   left: 0;
   right: 0;
   top: 0;
   bottom: 0;
   margin: auto;
}
.video:hover {
   opacity: 0.8;
}

/* --------- */
/* 8. Models */
/* --------- */
.models {
   padding: 45px 40px;
}
.models .item {
   display: inline-block;
   width: 100%;
   text-align: right;
}
.models .item.left {
   text-align: left;
}
.models .item .text, .models .item .image {
   display: inline-block;
   float: left;
   box-sizing: border-box;
   width: 50%;
   padding: 20px;
}
.models .item .image img {
   max-width: 100%;
}
.models .item .text {
   padding: 250px 20px 20px 20px;
}
.models .item .text h3 {
   font-family: SamsungOne, sans-serif;
   font-weight: 800;
   font-size: 30px;
   line-height: 35px;
}
.models .item .text .button {
   margin: 30px 10px 20px 10px;
   padding: 15px 55px;
}

.models .item .text .button:hover {
   opacity: 0.8;
}

/* ----- */
/* Media */
/* ----- */

@media (max-width: 720px) {
   .banner {
      margin: 20px 0 0 0;
   }
   header h1 {
      font-size: 29px;
      line-height: 36px;
      padding: 35px 10px 5px 10px;
   }

   .banner .inner p {
      font-size: 25px;
      margin: 15px 0;
   }

   .banner .inner p.bold {
      font-size: 36px;
   }

   .banner .inner a {
      font-size: 17px;
      margin: 20px 0 0 0;
   }

   .content {
      padding: 15px 30px;
   }

   .content h2 {
      font-size: 30px;
   }

   .content ol li {
      font-size: 20px;
      line-height: 20px;
   }

   .social a {
      margin: 15px 0px 20px 0px;
   }

   .models {
      padding: 45px 20px;
   }

   .models .item .text {
      padding-top: 0;
   }

   .image img {
      max-width: 100%;
   }

   .models .item {
      text-align: center!important;
   }

   .models .item .text, .models .item .image {
      width: 100%;
   }

   video { height: auto!important; }
   body { background-size: auto 1600px; }

   section {
      margin: 200px auto 0 auto;
   }

   .models .item .text h3 {
      font-size: 25px;
   }

   .m-hide {
      display: none!important;
   }
}


@media screen and (max-width:720px)
{
.lazyload {width:100%;height:auto;}
}



@media (min-width: 721px) {
   .d-hide {
      display: none!important;
   }
}

@media (max-width: 400px) {
   .banner .inner p.bold {
      margin: 10px 0;
   }

   body {
      background-size: auto 1200px;
   }

   section {
      margin: 150px auto 0 auto;
   }
}

.review {
   font-family: SamsungOne, sans-serif;
}

.review h1 {
   font-weight: 700;
   font-size: 40px;
   line-height: 47px;
   text-align: center;
}

.review h3 {
   font-size: 35px;
   font-weight: 500;
   margin: 20px 0;
   text-align: center;
}


.review h4 {
   font-size: 20px;
   font-weight: 500;
   margin: 20px 0;
}


.review ul, ol {
   padding-left: 40px;
   font-family: 'Roboto', sans-serif;
}


table {
   font-family: 'Arial';
   margin: 25px auto;
   border-collapse: collapse;
   border: 1px solid #eee;
   border-bottom: 2px solid #00cccc;
   box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1), 0px 10px 20px rgba(0, 0, 0, 0.05), 0px 20px 20px rgba(0, 0, 0, 0.05), 0px 30px 20px rgba(0, 0, 0, 0.05);
}


table th, table td {
   color: #999;
   border: 1px solid #eee;
   padding: 12px 35px;
   border-collapse: collapse;
}
table th {
   background: #1428a0;
   color: #fff;
   text-transform: uppercase;
   font-size: 12px;
}
table th a { color:white; }
table th.last {
   border-right: none;
}

.review p {
   margin: 20px 0;
   text-indent: 1.5em;
   font-family: 'Roboto', sans-serif;
   line-height: 20px;
}

.review img {
   max-width: 100%;
}

@media (max-width: 500px) {
   table th, table td {
      padding: 12px 5px;
   }

   .review h1 {
      font-size: 30px;
      line-height: 33px;
   }

   .review h3 {
      font-size: 25px;
   }

}




._gallery {
    position: relative;
    display: inline-block;
}
._gallery:after {
    position: absolute;
    background: #958bd9 url(/js/fancy/img/zoom.png) no-repeat center center;
    background: rgba(149, 139, 217, .8) url(/js/fancy/img/zoom.png) no-repeat center center;
    width: 0px;
    height: 0px;
    left: 50%;
    top: 50%;
    overflow: hidden;
    margin: 10px 0 0 10px;
    border-radius: 50%;
    content: '';
    font-size: 40px;
    color: #ccc6f7;
    text-align: center;
    line-height: 55px;
    opacity: 0;
    -webkit-transition: all .15s ease-out;
    -moz-transition: all .15s ease-out;
    -ms-transition: all .15s ease-out;
    -o-transition: all .15s ease-out;
    transition: all .15s ease-out;
}
._gallery:hover:after {
    opacity: 1;
    margin: -30px 0 0 -30px;
    width: 80px;
    height: 80px;
}


figure {
    margin: 10px 0 10px 0;
    padding: 0;
    border:none;
    background: transparent;
    display: inline-block;
    vertical-align: top;
}

figure img {max-width:100%}