5 html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, el, 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;
   text-rendering:geometricPrecision ;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
   display: block;
}

body {
   line-height: 1;
}

ol, ul {
   list-style: none;
}

blockquote, q {
   quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
   content: '';
   content: none;
}

table {
   border-collapse: collapse;
   border-spacing: 0;
}

.wrapper {
   /*min-width: 320px;
   max-width: 1000px;
   width: 70%;*/
   margin: 0 auto;
}

.header {
   height: auto;
}

.header img {
   width: 100%;
   display: block;
}

.menu-row {
   text-align: center;
   background: linear-gradient(to bottom, #f64819, #d32e01);
   line-height: 40px;
}
.fb_iframe_widget{
   float: right;
   margin: 5px 10px 0px 0;
}
.fb_iframe_widget span{
  display: block!important;
}
.menu-row a {
   color: #fff;
   display: inline-block;
   font-weight: bold;
   margin-right: 20px;
}
.menu-row a:before {
       content: '';
    display: inline-block;
    margin-right: 5px;
    vertical-align: middle;
    margin-top: -4px;
    width: 15px;
    height: 15px;
    background: url(../img/heart.png) no-repeat center top/cover;
}

.menu-row a:last-of-type {
   margin-right: 0px;
}

.banner {
   height: auto;
   position: relative;
}

.banner img {
   width: 100%;
   display: block;
}

.banner-txt {
   position: absolute;
   right: 70px;
   top: 70px;
}

.banner h2 {
   color: #ffec4d;
   font-size: 48px;
   line-height: 1.4;
}

.banner p {
   color: #fff;
   font-size: 22px;
   line-height: 1.4;
}

.question {
   text-align: center;
   padding: 50px 0;
}

.question p {
   font-size: 36px;
}

.tabs {
   position: relative;
   min-height: 200px;
   clear: both;
   margin: 0;
}

.tab {
   float: left;
   width: 19%;
   margin-right: 1%;
}
.tab:last-of-type {

   margin-right: 0;
}

.tab label {
   background: #f4f8ff;
   padding: 20px 0;
   margin-left: -1px;
   position: relative;
   cursor: pointer;
   left: 1px;
   width: 100%;
   text-transform: uppercase;
   color:#08559b;
   text-align: center;
}
.tab label:hover {
   background: #e1edff;
   transition: 300ms;
}
.tab-icon{
   width: 61px;
    height: 59px;
    display: block;
    margin: 0 auto 20px;
    background: url(../img/icons.png) no-repeat;
}
.sun{
   background-position: -13px -25px;
}
.fitness{
       background-position: -15px -92px;
}
.trip{
       background-position: -15px -157px;
}
.nature{
      background-position: -11px -242px;
}
.animal{
      background-position: -6px -323px;
}
.tab [type=radio] {
   display: none;
}

.content {
   position: absolute;
   top: 136px;
   left: 0;
   opacity: 0;
   background: white;
   right: 0;
   bottom: 0;
   padding: 20px;
   display: none;
}

[type=radio]:checked~label {
   background: #08559b;
   color:#fff;
   
}
[type=radio]:checked~label:after {
   content:'';
   position: absolute;
   top:100%;
   left:50%;
   margin-left: -15px;
   border-top:15px solid #08559b;
   border-left:15px solid transparent;
   border-right:15px solid transparent;
  
}

[type=radio]:checked~label .tab-icon.sun {
   background-position:-101px -25px;
}
[type=radio]:checked~label .tab-icon.fitness {
   background-position:-103px -92px;
}
[type=radio]:checked~label .tab-icon.trip {
   background-position:-103px -157px;
}
[type=radio]:checked~label .tab-icon.nature {
   background-position:-99px -242px;
}
[type=radio]:checked~label .tab-icon.animal {
   background-position:-95px -323px;
}

[type=radio]:checked~label~.content {
   opacity: 1;
   display: block;
}

.girls-list{

}

.girl-item{
   text-align: center;
   display: inline-block;
   list-style: none;
   width: 30%;
   vertical-align: top;
   min-width: 200px;
   margin-bottom: 20px;
   margin-right: 10px;

}

.girl-item:nth-child(3n){
   text-align: center;
   display: inline-block;
   list-style: none;
   width: 30%;
   margin-right: 10px;

}
.girl-item a{
   width: 100%;
   position: relative;
   display: block;
   text-decoration: none;
}
.girl-img{
   width: 100%;
   display: block;
}
.ico360{
   position: absolute;
   width: 90% ;
   left: 5%;
   top: 50%;
}
.girl-btn{
   width: 100%;
   line-height: 50px;
   display: block;
   text-align: center;
   color:#fff;
   text-transform: uppercase;
   background: linear-gradient(to bottom, #b3e530, #96c41c);
}
.girl-btn:hover{
   text-decoration: none;
   color:#fff;
   background:  #96c41c;
}
.girl-play{
   position: absolute;
   width: 30%;
   opacity: 0;
   left: 35%;
   top: 40%;
}
.shadow{
   position: absolute;
   left: 0;right: 0;top: 0;bottom: 0;
   background:#000;
   opacity: 0;
}
.girl-item a:hover .shadow,.girl-item a:hover .girl-play{
   opacity: 0.5;
   transition: 300ms;
}
.girl-item a:hover .ico360{
   opacity: 0;
   transition: 300ms;
}
.more-girls{
   background: #f4f8ff;
   color:#08559b;
   position: relative;
   cursor: pointer;
}
.more-girls a{
   position: absolute;
   top: 0;bottom: 0;right: 0;left: 0;
}
.more-girls p{
   font-size: 20px;
   color:#08559b;
   line-height: 1.5;
}
.blue360{
   width: 40%;
   margin-left: 30%;
   display: block;
   margin-bottom: 20px;
   margin-top: 150px;
}

@media only screen and (max-width:768px){
   .banner-txt {
       right: 20px;
       top: 20px;
       text-align: right;
   }
   .banner h2 {
       font-size: 24px;
   }
   .banner p {
       font-size: 16px;
   }
}
@media only screen and (max-width:600px){
   .question{
      padding: 20px 0;
   }
   .question p {
       font-size: 20px;
       margin-bottom: 0!important;
   }
   .banner{
      display: none;
   }
   .tabs{
      margin:0 auto;
      text-align: center;
   }
   .tab label {

       font-size: 12px;
   }
   .tab-icon {
       transform: scale(0.5);
       margin: 0 auto;
   }
   .content{
      top: 145px;
   }
   .girls-list{
      margin:0 auto;
      padding: 0;
   }
   .wrapper{
      padding: 0;
   }
   .girl-item{
      display: block;
      margin: 0 auto 20px;
      width: 80%;
   }
   .girl-item:nth-child(3n) {
      display: block;
      margin: 0 auto 20px;
      width: 80%;
   }
   .more-girls{
      display: inline-block!important;
   }
}
