
/* http://meyerweb.com/eric/tools/css/reset/ 
 * v2.0 | 20110126
 * License: none (public domain) */

=border-radius($radius)
  -webkit-border-radius: $radius
  -moz-border-radius: $radius
  -ms-border-radius: $radius
  border-radius: $radius

=box-sizing($border-box)
  box-sizing: $border-box
  -moz-box-sizing: $border-box
  -webkit-box-sizing: $border-box

=box-shadow($box-shadow)
  -o-box-shadow: $box-shadow
  -webkit-box-shadow: $box-shadow
  -moz-box-shadow: $box-shadow
  box-shadow: $box-shadow

=transition($transition)
  -webkit-transition: $transition
  -o-transition: $transition
  -moz-transition: $transition
  -ms-transition: $transition
  transition: $transition

//Пример .box 
// @include border-radius(10px) 
// @include box-sizing(border-box) 
// @include box-shadow(10px) 
// 

.noselect
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;

// обнуление стилей гуглхром
a:active, a:focus 
  outline: none;
input, textarea 
  outline: none;
input:active, textarea:active 
  outline: none;
  &:focus 
    outline: none;
textarea
  resize: none;
textarea
  resize: vertical;
textarea
  resize: horizontal;
button:active, button:focus
  outline: none !important;
button::-moz-focus-inner
  border: 0 !important;
input
  -webkit-appearance: none;  // remove shadow in iOS
  @include border-radius(0);  // remove border-radius in iOS

/////////////////////////

@font-face
  font-family: 'Candara-Regular'
  src: url("../fonts/Candara-Regular/Candara-Regular.ttf")

@font-face
  font-family: 'Candara-Bold'
  src: url("../fonts/Candara-Bold/Candara-Bold.ttf")

@font-face 
  font-family: 'Akzidenz-Grotesk Pro';
  src: url('../fonts/AkzidenzGroteskPro-Cn.eot');src: url('../fonts/AkzidenzGroteskPro-Cn.eot?#iefix') format('embedded-opentype'),url('../fonts/AkzidenzGroteskPro-Cn.woff') format('woff'),url('../fonts/AkzidenzGroteskPro-Cn.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;

@font-face
  font-family: 'revicons';
  src: url('../fonts/revicons/revicons.eot?5510888');src: url('../fonts/revicons/revicons.eot?5510888#iefix') format('embedded-opentype'),url('../fonts/revicons/revicons.woff?5510888') format('woff'),url('../fonts/revicons/revicons.ttf?5510888') format('truetype'),url('../fonts/revicons/revicons.svg?5510888#revicons') format('svg');
  font-weight: normal;
  font-style: normal;


a 
  cursor: pointer

*
  -webkit-box-sizing: border-box
  box-sizing: border-box
  outline: 0

body
  font-size: 16px
  line-height: 1.6
  font-family: "Candara-Regular"
  max-width: 1920px;
  margin: 0 auto;

  @media screen and (max-width: 1600px)
    width: 100%
    min-width: 1400px;

  @media screen and (max-width: 768px)
    min-width: 100%

.submit
  @media screen and (max-width: 768px)
    -webkit-appearance: none



.yButton
  @media screen and (max-width: 768px)
    display: none

.page-wrapper
  width: 100%
  display: block
  padding: 0
  margin: 0
  @media screen and (max-width: 768px)
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    flex-direction: column;

.wrapper, .advantages__item, .butik__present
  position: relative

.wrapper
  font-size: 0px;
  @media screen and (max-width: 768px)
    order: 4;

.wrapper::after, .advantages__item::after, .butik__present::after
  content: ""
  display: table
  clear: both

.clear
  clear: both

// .wrapper
//   @media screen and (max-width: 768px)
//     display: flex
//     flex-flow: column


.button_ajax
  margin: 20px 0;
  font-size: 24px;
  font-weight: 400;
  text-transform: uppercase;
  text-align: center;
  color: #fff;
  padding: 4px 35px;
  border: 3px solid #fb8835;
  background-image: url(../img/photos-bg.jpg);
  font-family: Akzidenz-Grotesk Pro;
  display: inline-block;
  width: 49%;
  box-sizing: border-box;
  cursor: pointer
  min-width: 350px;
  @media screen and (max-width: 768px)
    width: 100%
    min-width: 100%
    padding: 4px 0px;
    font-size: 22px




.half
  width: 50%

.spacer
  display: block
  width: 100%
  height: 2px

.content
  width: 50%
  display: inline-block

  @media screen and (max-width: 768px)
    width: 100%
    display: block
    margin-top: 0px

.toggle-mnu
  display: none !important

  @media screen and (max-width: 768px)
    display: inline-block!important

.sidebar
  width: 25%

  @media screen and (max-width: 768px)
    width: 100%
    display: block

.sidebar__left

  height: 100%
  display: block
  display: inline-block
  vertical-align: top

  
  @media screen and (max-width: 768px)
    display: none

.otziv_slider_slide
  display: none


.sidebar__right
  display: inline-block

  vertical-align: top

  @media screen and (max-width: 768px)
    display: none

.header
  background-color: #fff

.button
  background-color: #ee8007
  color: #fff
  text-transform: uppercase
  border: 0
  outline: 0
  display: inline-block
  padding: 11px 40px
  margin-left: -5px
  cursor: pointer
  text-decoration: none
  font-size: 16px

.button__price
  border-radius: 7px


.search-result
  h2
    display: none;
    margin: 0px;
    font-size: initial;
    font-family: sans-serif;
    padding: 0px;
    p
      display: none
  strong
    font-weight: 400 !important
  a 
    color: #000 !important
    text-decoration: none;

    u
      text-decoration: none !important
  ul
    display: none
  ol
    display: none
  p
    margin-bottom: 0px !important
    display: inline;
  img
    display: none
  video
    display: none
  iframe
    display: none


// отзывы

.django-ckeditor-widget
  display: block !important


.testimonial
  margin: 0 auto 30px!important;
  padding: 0!important;
  text-align: left!important;
  width: 100%!important;
  display: inline-block!important;
  vertical-align: top!important;
  margin-right: 2%!important;
  border: 1px solid #e6e6e6!important;
  max-height: 240px;
  overflow: hidden;
  box-sizing: border-box;
  @media screen and (max-width: 768px)
    max-height: 100% !important

.testimonial-pages-wrapper
  

.testimonial-pages
  margin: 0 auto 30px!important;
  padding: 0!important;
  text-align: left!important;
  width: 100%!important;
  display: inline-block!important;
  vertical-align: top!important;
  margin-right: 4%;
  border: 1px solid #e6e6e6!important;
  max-height: 240px;
  overflow: hidden;
  box-sizing: border-box;
  min-height: 240px;
  &:nth-child(2n)
    margin-right: 0px
  @media screen and (max-width: 768px)
    max-height: 100% !important


.testimonial-inner
  background-repeat: repeat!important;
  max-height: 225px;
  overflow: hidden;
  position: relative;
  border: none!important;
  padding: 20px;
  text-align: left;
  background-image: url(../img/main-bg.jpg);
  background-size: 100%;
  background-position: top;
  background-repeat: no-repeat;
  font-size: 16px
  @media screen and (max-width: 768px)
    max-height: 100%
  p
    display: inline; 

.testimonial-inner-pages
  background-repeat: repeat!important;
  max-height: 225px;
  overflow: hidden;
  position: relative;
  border: none!important;
  padding: 20px;
  text-align: left;
  background-image: url(../img/main-bg.jpg);
  background-size: 100%;
  background-position: top;
  background-repeat: no-repeat;
  font-size: 16px
  min-height: 240px;
  @media screen and (max-width: 768px)
    max-height: 100%
  p
    display: inline; 

.testimonial-heading
  background: url(../img/quotes.png) no-repeat scroll left center transparent;
  margin-top: 0;
  padding-left: 40px;
  text-align: left;

.testimonial-heading-pages
  background: url(../img/quotes.png) no-repeat scroll left center transparent;
  margin-top: 0;
  padding-left: 40px;
  text-align: left;
  span
    a
      color: #f08400

.testimonial-image
  max-width: 180px!important;
  float: left;
  margin-top: 13px;
  margin-right: 1em;
  margin-bottom: .25em;
  @media screen and (max-width: 768px)
    width: 100%
    float: none
    max-width: 100%!important;

  img
   background: none repeat scroll 0 0 #fff!important;
   border: 1px solid #efefef!important;
   padding: 6px!important;
   margin: 0 auto!important;
   width: auto!important;
   // height: 150px!important;
   float: left!important;
   margin-right: 2%!important;

   @media screen and (max-width: 768px)
    float: none !important
    margin-right: 0px !important
    width: 100% !important


.testimonial-image-pages
  max-width: 140px!important;
  width: 30%

  @media screen and (max-width: 768px)
    width: 100%
    float: none
    max-width: 100%!important;

  img
    background: none repeat scroll 0 0 #fff !important;
    border: 1px solid #efefef !important;
    padding: 6px !important;
    max-width: 100%;
    max-height: 150px;


.testimonial-content-pages
  display: flex
  padding-top: 20px

.testimonial-content-p
  margin-left: 0;
  vertical-align: top;
  padding-top: 20px;
  @media screen and (max-width: 768px)
    padding-top: 0px !important

.testimonial-content-p-pages
  margin-left: 0;
  vertical-align: top;
  padding-top: 0px;
  margin-left: 30px
  width: 70%
  p
    font-size: 17px;
    margin-bottom: 10px;
  @media screen and (max-width: 768px)
    padding-top: 0px !important

.testimonial-client
  margin-top: 0!important;
  text-align: right!important;
  position: absolute!important;
  right: 10px!important;
  bottom: 5px!important;
  @media screen and (max-width: 768px)
    position: relative !important
    margin-top: 15px !important;
    bottom: 0px !important;


.testimonial-client-pages
  margin-top: 0 !important;
  text-align: right !important;
  position: absolute !important;
  right: 10px !important;
  bottom: 5px !important;
  @media screen and (max-width: 768px)
    position: relative !important
    margin-top: 15px !important;
    bottom: 0px !important;


.testimonial-name
  font-weight: bold;

.testimonial-name-pages
  font-weight: bold;

.testimonial-pages-otziv
  text-align: center;
  color: #f08400;
  font-size: 31px;
  margin-top: -17px;
  font-family: Akzidenz-Grotesk Pro;
  a
    color: #f08400;


.otziv-detail-left
  display: inline-block;
  margin-left: 40px;    
  margin-bottom: 20px;
  width: 30%;
  @media screen and (max-width: 768px)
    width: 100%
    margin-left: 0px
    display: block


.otziv-detail-right
  display: inline-block;
  width: 60%;
  vertical-align: top;
  @media screen and (max-width: 768px)
    display: block;
    width: 100%;
    margin-left: 20px;
    margin-top: 20px !important;


.form-field
    margin-bottom: 1.5em;


.strong-form
  font-size: 16px

.strong-form label
    font-weight: 700;
    font-size: 16px

.strong-form label
    display: inline-block;
    float: none;

.strong-form .required.symbol:after
    content: '*';
    color: #FF0000;
    font-size: 1.5em;
    font-weight: 400;
    margin: 0 5px;
    position: relative;
    top: 5px;

.strong-form .form-field .after
    font-size: .9em;
    font-style: italic;

.strong-form .after
    display: block;


.strong-form textarea
    height: 16em;


.strong-form-inner
    padding: 20px;

.strong-form
    width: 600px!important;
    margin: 0 auto;




// поиск

.orig
  color: #000;
  font-size: 13px;
  line-height: 15px;
  border: 0;
  position: relative;
  z-index: 2;
  padding: 0!important;
  padding-top: 0!important;
  background: #fff;
  font-weight: 400;
  line-height: normal;
  flex-grow: 1;
  order: 5;
  -webkit-flex-grow: 1;
  -webkit-order: 5;
  margin-left: 3%;
  box-sizing: border-box;
  width: 74%;
  display: inline-block;
  height: 39px;

.promagnifier
  flex: 0 0 auto!important;
  order: 7;
  -webkit-flex: 0 0 auto;
  -webkit-order: 7;
  border: none!important;
  border-radius: 0!important;
  box-shadow: none!important;
  background-image: none!important;
  background-color: #ee8007;
  color: #fff;
  text-transform: uppercase;
  border: 0;
  outline: 0;
  display: inline-block;
  padding: 0 0px;
  margin-left: -5px;
  cursor: pointer;
  text-decoration: none;
  /* float: right; */
  /* display: table-cell; */
  display: inline-block;
  width: 20%;
  margin-left: 3%;
  height: 39px

.input-group-btn
  font-size: 0px

.input-group
  width: 100%;
  background: #fff;
  font-family: Candara-Regular;
  font-size: 0px


// Галереи


// .gallary-img-str
//   text-align: center!important;
//   margin: 0 auto!important;
//   font-size: 0px !important
//   a
//     display: inline-block!important;
//     vertical-align: middle!important;
//     text-align: -webkit-center!important;
//     margin-right: 1.5%!important;
//     margin-bottom: 12px!important;
//     padding: 0!important;
//     width: 23%!important;
//     // max-height: 150px;
//     // min-height: 150px;
//     // height: 100%!important;
//     border: none!important;
//     box-shadow: 0 1px 5px rgba(0,0,0,.5);
//     position: relative;
//     overflow: hidden;
//     @media screen and (max-width: 1640px)
//       width: 30% !important;
//       margin-right: 3%  !important;


//     &:before
//       content: "";
//       display: block;
//       position: absolute;
//       top: 0;
//       bottom: 0;
//       left: 0;
//       right: 0;
//       background: none no-repeat center center;
//       -moz-transition: all .3s linear;
//       -webkit-transition: all .3s linear;
//       -ms-transition: all .3s linear;
//       -o-transition: all .3s linear;
//       transition: all .3s linear;
//     &:hover
//       border: none!important;
//       box-shadow: 0 1px 5px rgba(0,0,0,.5);
//       &:before
//         background: rgba(0,0,0, 0.5) url(../img/zoom.png) no-repeat center center;
//         content: "";
//         display: block;
//         position: absolute;
//         top: 0;
//         bottom: 0;
//         left: 0;
//         right: 0;
//         -moz-transition: all .3s linear;
//         -webkit-transition: all .3s linear;
//         -ms-transition: all .3s linear;
//         -o-transition: all .3s linear;
//         transition: all .3s linear;

//   img
//     vertical-align: middle!important;
//     border-radius: 0;
//     display: block;
//     transition: none;
//     float: none!important;
//     margin: 0!important;
//     height: auto;
//     max-height: 150px;
//     min-width: 100%;      
// //////////////////////////////////////////////////////////


.gallary-img-str 
  text-align: center!important;
  margin: 0 auto!important;
  font-size: 0px !important
  a
    display: inline-block!important;
    vertical-align: middle!important;
    text-align: -webkit-center!important;
    margin-right: 10px!important;
    margin-bottom: 10px!important;
    padding: 0!important;
    width: 23%!important;
    // height: 100%!important;
    border: none!important;
    box-shadow: 0 1px 5px rgba(0,0,0,.5);
    position: relative;
    // max-width: 100%;
    overflow: hidden;
    cursor: pointer;
    &:before
      content: "";
      display: block;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      background: none no-repeat center center;
      -moz-transition: all .3s linear;
      -webkit-transition: all .3s linear;
      -ms-transition: all .3s linear;
      -o-transition: all .3s linear;
      transition: all .3s linear;
    &:hover
      &:before
        background: rgba(0,0,0, 0.5) url(../img/zoom.png) no-repeat center center;

    img
      vertical-align: middle!important;
      border-radius: 0;
      display: block;
      -webkit-transition: none;
      transition: none;
      max-width: 100%;
      // height: auto;
      float: none!important;
      
      width: auto;
      margin: 0!important;
      text-align: -webkit-center!important;









// //////////////////////////////////////////////////////////
.gallary-img
  text-align: center!important;
  margin: 0 auto!important;
  font-size: 0px !important
  a
    display: inline-block!important;
    vertical-align: middle!important;
    text-align: -webkit-center!important;
    margin-right: 1.5%!important;
    margin-bottom: 12px!important;
    padding: 0!important;
    width: 23%!important;
    // max-height: 150px;
    // min-height: 150px;
    // height: 100%!important;
    border: none!important;
    box-shadow: 0 1px 5px rgba(0,0,0,.5);
    position: relative;
    overflow: hidden;
    @media screen and (max-width: 1640px)
      width: 30% !important;
      margin-right: 3%  !important;


    &:before
      content: "";
      display: block;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      background: none no-repeat center center;
      -moz-transition: all .3s linear;
      -webkit-transition: all .3s linear;
      -ms-transition: all .3s linear;
      -o-transition: all .3s linear;
      transition: all .3s linear;
    &:hover
      border: none!important;
      box-shadow: 0 1px 5px rgba(0,0,0,.5);
      &:before
        background: rgba(0,0,0, 0.5) url(../img/zoom.png) no-repeat center center;
        content: "";
        display: block;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        -moz-transition: all .3s linear;
        -webkit-transition: all .3s linear;
        -ms-transition: all .3s linear;
        -o-transition: all .3s linear;
        transition: all .3s linear;

  img
    vertical-align: middle!important;
    border-radius: 0;
    display: block;
    transition: none;
    /* max-width: 100%; */
    float: none!important;
    /* width: 100%!important; */
    margin: 0!important;
    height: auto;
    max-height: 150px;
    min-width: 100%;
 


// Blog

h1.blog
  text-shadow: 1px 1px 0 #777;
  font-size: 43px;
  color: #ee8007;
  margin: 20px 0 10px;
  font-family: Akzidenz-Grotesk Pro;
  text-transform: uppercase;
  padding: 0px 40px
  @media screen and (max-width: 768px)
    font-size: 33px
    padding: 0px 20px
    margin: 5px 0 0px;
    text-align: center


.blog-desc
  font-size: 16px

.blog-wrapper-str
  padding: 0 40px 0px 40px;
  box-sizing: border-box

.blog-wrapper
  overflow: hidden;
  border-bottom: 2px solid #ccc;
  margin-bottom: 30px;
  /* background: #f9f9f9; */
  h2
    margin-left: 20px;
    margin-top: 19px;
    margin-bottom: 12px;
    a 
      font-size: 30px!important;
      line-height: 30px;
      text-decoration: none!important;
      /* margin-bottom: 5px; */
      text-transform: uppercase;
      color: #ee8007;
      cursor: pointer;
      font-family: Akzidenz-Grotesk Pro;
  p
    padding: 0px 20px 10px;

.blog-img
  font-size: 0;
  text-align: center;
  margin: 0 auto;
  img
    box-sizing: border-box;
    // max-width: 100%;
    /* display: inline-block!important; */
    /* vertical-align: middle!important; */
    /* text-align: -webkit-center!important; */
    /* margin-right: 1.5%!important; */
    /* margin-bottom: 12px!important; */
    padding: 0!important;
    /* width: 23%!important; */
    border: none!important;
    box-shadow: 0 1px 5px rgba(0,0,0,.5);
    position: relative;
    /* overflow: hidden; */
    text-align: center;
    margin: 0 auto;
    max-height: 400px;
    max-width: 100%;

.category_vib
  font-size: 16px;
  padding-top: 5px;
  border: 1px solid #ccc;
  padding: 5px;
  text-align: center;
  background-image: url(../img/main-bg.jpg);
  background-size: contain;
  margin-top: 17px

.category_vib ul
    text-align: center;
    padding: 10px 20px 0;
.category_vib li
    display: inline-block;
    background: #6b3d31;
    padding: 5px 10px 4px;
    margin-bottom: 10px;
    /* width: 20%; */
    margin-right: 15px;

.category_vib a
    color: #fffff;
    // font-weight: 600;
    color: #fff;
    /* text-decoration: none; */
    text-transform: uppercase;
    font-size: 16px


.blog-detail
  position: relative;
  padding: 0 40px;
  p
    font-size: 17px;
    margin-bottom: 10px;
  img
    margin-top: 0px;
    margin-left: 1%;
  ol,ul
    list-style: none;
    counter-reset: a;
    padding: 8px 0 1px;
    left: -7px;
    li
      position: relative;
      display: block;
      padding: .4em .2em .4em 3em;
      margin: .5em 0;
      background: #eee;
      text-decoration: none;
      overflow: hidden;
      transition: all .3s ease-out;
      left: -5px;
      font-size: 16px;
      &:before
        content: counter(a);
        counter-increment: a;
        top: 50%;
        margin: -1.3em 0 0 3px;
        height: 2em;
        width: 2em;
        line-height: 2em;
        font-size: 15px;
        color: #fff;
        background: #fb8835;
        border: .2em solid #fff;
        box-shadow: 0 8px 5px -7px #888;
        text-align: center;
        font-weight: 700;
        border-radius: 2em;
        position: absolute;
        left: 0;
        transition: all .3s ease-out;




.sertificat-table
  @media screen and (max-width: 768px)
    font-size: 0px
  br
    display: none
  margin-bottom: 10px
  img
    float: none;
    display: inline-block;
    width: 30%;
    vertical-align: top;
    margin-top: 10px;
    margin-right: 10px;
    border: 6px solid #664042;
    @media screen and (max-width: 768px)
      width: 48%
      margin-right: 2%





.top-line-wrapper
  font-size: 0px


.top-line__logo
  max-width: 388px;
  width: 20%;
  height: 182px;
  font-size: 22px;
  display: inline-block;
  vertical-align: top;
  text-align: right;

  @media screen and (max-width: 1640px)
    width: 20%;
    max-width: inherit;


  @media screen and (max-width: 768px)
    text-align: center
    font-size: 18px
    width: 100%;
    height: auto;
    order: 1;
    margin-top: 12px

  img
    vertical-align: middle


.top-line__logo a
  color: #ee8007
  text-decoration: none


.top-line__foto
  display: inline-block;
  width: 1244px;
  width: 65%;
  //max-width: 1238px;
  background-image: url(../img/top-line-foto.jpg);
  height: 182px;

  @media screen and (max-width: 1640px)
    width: 60%;


  @media screen and (max-width: 768px)
    width: 100%
    order: 0
    margin-top: 0px


.top-line__information
  display: inline-block;
  vertical-align: top;
  text-align: center;
  //max-width: 286px;
  width: 15%;
  height: 182px;
  background-color: #6b3d31;
  font-size: 18px;

  @media screen and (max-width: 1640px)
    width: 20%;
    max-width: inherit;

  @media screen and (max-width: 768px)
    width: 100%;
    order: 2;
    margin-top: 0px;
    height: 100%;


.top-line-location
  display: inline-block;
  vertical-align: middle;
  /* padding: 0; */
  // background-image: url(../img/location.png);
  background-position: 0;
  background-repeat: no-repeat;
  color: #fff;
  font-family: Akzidenz-Grotesk Pro;
  font-size: 30px;
  font-weight: 400;
  width: 100%;
  font-variant: small-caps;
  line-height: 1.4;
  letter-spacing: 2px;
  padding-left: 38px;

  span 
    text-transform: uppercase;
    font-size: 20px;
    letter-spacing: 2px;
    margin-left: -30px

    @media screen and (max-width: 1640px)
      font-size: 20px

  

  @media screen and (max-width: 1640px)
    padding-right: 0px
    padding-top: 7px
    padding-bottom: 0px


  @media screen and (max-width: 768px)
    background-position: 0% center
    width: 100%
    order: 3
    display: none

  a
    color: #fff
    text-decoration: none
    -webkit-transition: all .3s ease
    -o-transition: all .3s ease
    transition: all .3s ease
    vertical-align: middle
    line-height: 1

    &:hover
      color: #fff

    &:before
      width: 35px;
      height: 45px;
      background: url(../img/css_sprite.png) -523px -100px;
      content: "";
      position: absolute;
      margin-left: -45px;
      margin-top: 7px;

    @media screen and (max-width: 750px)
      font-size: 22px
      line-height: 1


.strong-form-inner
  @media screen and (max-width: 768px)
    padding: 0px



.soc-header-1
  width: 31px; height: 32px;
  background: url('../img/css_sprite.png') -523px -230px;
  display: inline-block
  margin-right: 7px

.soc-header-2
  width: 31px; height: 31px;
  background: url('../img/css_sprite.png') -523px -262px;
  display: inline-block
  margin-right: 7px

.soc-header-3
  width: 31px; height: 32px;
  background: url('../img/css_sprite.png') -523px -197px;
  display: inline-block
  margin-right: 7px

.soc-header-4
  width: 32px; height: 32px;
  background: url('../img/css_sprite.png') -523px -165px;
  display: inline-block

.soc-footer-1
  width: 30px; height: 30px;
  background: url('../img/css_sprite.png') -501px -295px;
  display: inline-block

.soc-footer-2
  width: 30px; height: 30px;
  background: url('../img/css_sprite.png') -418px -200px;
  display: inline-block

.soc-footer-3
  width: 28px; height: 28px;
  background: url('../img/css_sprite.png') -358px -230px;
  display: inline-block

.soc-footer-4
  width: 30px; height: 30px;
  background: url('../img/css_sprite.png') -300px -59px;
  display: inline-block

.soc-footer-5
  width: 30px; height: 30px;
  background: url('../img/css_sprite.png') -358px -200px;
  display: inline-block

.soc-footer-6
  width: 30px; height: 30px;
  background: url('../img/css_sprite.png') -300px -119px;
  display: inline-block

.soc-footer-7
  width: 30px; height: 30px;
  background: url('../img/css_sprite.png') -300px -89px;
  display: inline-block

.soc-footer-8
  width: 30px; height: 30px;
  background: url('../img/css_sprite.png') -388px -200px;
  display: inline-block

.soc-header-1:hover, .soc-header-2:hover, .soc-header-3:hover, .soc-header-4:hover, .soc-footer-1:hover, .soc-footer-2:hover, .soc-footer-3:hover, .soc-footer-4:hover, .soc-footer-5:hover, .soc-footer-6:hover, .soc-footer-7:hover, .soc-footer-8:hover
  opacity: 0.7

table.soc
  margin: 0px
  @media screen and (max-width: 768px)
    width: 160px
  td
    border: none
    padding: 0px 2px


.header-telefon a 
  color: #000

.header-lozung
  color: #a1856c;
  font-family: Akzidenz-Grotesk Pro;
  font-size: 22px;
  font-weight: 400;
  line-height: 30px;
  font-variant: small-caps;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 3px;

  @media screen and (max-width: 1640px)
    font-size: 17px
  @media screen and (max-width: 768px)
    font-size: 17px;
    background: #6b3d31;
    color: #fff;
    display: none

.vremya
  color: #6b3d31;
  font-family: "Akzidenz-Grotesk Pro";
  font-weight: 400;
  line-height: 30px;
  font-size: 32px;
  margin-top: 10px;
  letter-spacing: 4px;
  
  font-variant: small-caps;
  text-align: center
  span 
    text-transform: uppercase;

  @media screen and (max-width: 1640px)
    font-size: 30px

  @media screen and (max-width: 768px)
    display: none


.vremya br
  @media screen and (max-width: 768px)
    display: none

.subdescription-mt
  @media screen and (max-width: 768px)
    margin-top: -50px

.phone
  @media screen and (max-width: 1640px)
    margin-left: 10px
    display: table-cell
    vertical-align: middle

.full-product-images
  @media screen and (max-width: 768px)
    text-align: center

.dn 
  @media screen and (max-width: 768px)
    display: none


.logo-header
  width: 100%;
  height: 59px;
  background: url(../img/logo2.png) 0 0;
  margin: 10px auto 0px;
  background-size: 98%;
  background-repeat: no-repeat;
  background-position: center;

  @media screen and (max-width: 1640px)
    background: url('../img/logo2small.png') -0 -0;
    width: 250px; 
    height: 59px;
  @media screen and (max-width: 768px)
    margin: 0 auto;

.icon-tel
  width: 43px;
  height: 43px;
  background: url(../img/css_sprite.png) -458px -295px;
  display: inline-block;
  vertical-align: middle;
  margin-right: 10px;
  margin-top: 12px;

  @media screen and (max-width: 1640px)
    width: 43px;
    height: 43px;
    background: url(../img/css_sprite.png) -458px -295px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
    margin-top: 8px;
  @media screen and (max-width: 768px)
    margin-top: 6px
    display: none


.top-line__phones
  @media screen and (max-width: 768px)
    position: relative;
    height: 33px;

.phones__container
  padding: 5px 0 5px 0px
  margin-top: 15px;

  @media screen and (max-width: 1640px)
    position: relative



  @media screen and (max-width: 768px)
    padding: 5px 0;
    margin-top: 0;
    width: 100%;
    right: 0;
    position: absolute;

  @media screen and (max-width: 480px)
    background-position-x: 0%

  @media screen and (max-width: 320px)
    background-position-x: 10%



.phone__inner_wrapper
  display: inline-block;
  vertical-align: top;
  margin-top: 12px;
  text-align: left;

  @media screen and (max-width: 1640px)
    display: inline-block;
    vertical-align: top;
    margin-top: -1px;
    text-align: left;
  @media screen and (max-width: 768px)
    display: block
    text-align: center
    br
      display: none

.phone__inner
  color: #fff;
  font-family: Akzidenz-Grotesk Pro;
  font-size: 29px;
  font-weight: 400;
  font-variant: small-caps;
  line-height: 6px;
  line-height: 32px;
  /* margin-bottom: -10px; */
  line-height: 0;
  /* margin-top: 17px; */
  letter-spacing: 2px;

  @media screen and (max-width: 1640px)
    color: #fff;
    font-family: Akzidenz-Grotesk Pro;
    font-size: 29px;
    font-weight: 400;
    font-variant: small-caps;
    line-height: 6px;
    line-height: 32px;
    line-height: 1;
    letter-spacing: 2px;


  @media screen and (max-width: 768px)
    display: inline-block
    padding-left: 2%
    font-size: 22px
  a
    color: #fff
    text-decoration: none
    -webkit-transition: all .3s ease
    -o-transition: all .3s ease
    transition: all .3s ease
    &:hover
      color: #fff

.logo__img
  height: auto
  vertical-align: middle


  @media screen and (max-width: 768px)
    vertical-align: top
    width: 100%
    max-width: 358px

.social-list__item
  display: inline-block
  padding-right: 7px

.social-list__item--last
  padding-right: 0


















.main-navigation__wrapper
  text-align: center
  position: relative
  height: 79px;
  background-color: #efefef;
  font-size: 0px
  @media screen and (max-width: 768px)
    height: 100%

.main-navigation-left
  width: 20%;
  display: inline-block;
  font-size: 16px;
  margin-right: 5%;

  @media screen and (max-width: 1640px)
    width: 20%;
    display: inline-block;
    font-size: 16px;
    margin-right: 0;
    margin-left: 0%;

  a 
    text-decoration: none

  @media screen and (max-width: 768px)
    display: block
    width: 100%
    order: 0;
    top: 0px
    right: 0px
    background: rgba(0,0,0, 0.3);
    position: absolute


.main-navigation-right
  width: 75%
  display: inline-block
  font-size: 16px
  vertical-align: top;
  
  @media screen and (max-width: 1640px)
    width: 80%;
    display: inline-block;
    font-size: 16px;
    vertical-align: top;
    /* margin-left: 2%; */
  @media screen and (max-width: 768px)
    width: 100%;
    margin-top: -46px;
    text-align: left;
    padding-left: 0px;
    margin-bottom: -12px;


.main-navigation-left-knopka
  margin: 0 auto
  width: 250px;
  height: 59px;
  background-color: #6b3d31;
  color: #fff
  font-family: "Akzidenz-Grotesk Pro";
  font-size: 28px;
  font-weight: 400;
  line-height: 59px;
  text-transform: uppercase;
  text-align: left
  box-sizing: border-box;
  margin-top: 10px
  padding-left: 32px
  text-decoration: none

  div
    &:after
      content: ''
      width: 35px
      height: 41px
      background-image: url("../img/tic.png")
      position: absolute;
      margin-top: 10px;
      margin-left: 10px;
      @media screen and (max-width: 768px)
        margin-left: 7px
        margin-top: 1px
        width: 30px
        height: 35px
        background-size: contain;

  @media screen and (max-width: 1640px)
    margin: 0 auto;
    width: 236px;
    height: 59px;
    background-color: #6b3d31;
    color: #fff;
    font-family: Akzidenz-Grotesk Pro;
    font-size: 28px;
    font-weight: 400;
    line-height: 59px;
    text-transform: uppercase;
    text-align: left;
    box-sizing: border-box;
    margin-top: 10px;
    padding-left: 27px;
    text-decoration: none;

  @media screen and (max-width: 768px)
    width: 100%;
    text-align: center;
    padding: 0px;
    margin: 0px;
    border-bottom: 3px solid #ee8007;
    height: 44px; 
    line-height: 44px
    background: none
    font-size: 25px


.nav-burger__checkbox
  display: none;

.nav-burger__checkbox:checked + .nav-burger
  background-image: url("../img/icon-cross.svg");

.nav-burger__checkbox:checked ~ .main-navigation__list2
  display: block;

.nav-burger
  display: none
  @media screen and (max-width: 768px)
    width: 100%;
    height: 46px;
    margin-top: 0px;
    margin-right: 0;
    padding: 10px 0px 10px 10px;
    display: block
    background: rgba(0,0,0, 0.3);
    position: relative;
    &:before
      margin-top: -8px;
      content: "Меню";
      position: absolute;
      color: #fff;
      /* left: 57px; */
      font-size: 27px;
      /* top: 0px; */
      /* left: 8px; */
      right: 45px;
      text-shadow: 1px 1px 5px #000;
    span
      position: absolute;
      display: block;
      width: 27px;
      height: 2px;
      background-color: #fff;
      transition: all .3s;
      -webkit-backface-visibility: hidden;
      backface-visibility: hidden;
      border-radius: 2px;
      right: 7px;
      top: 13px;
      /* text-shadow: 1px 1px 5px #000; */
      box-shadow: 1px 1px 5px #000;
      &:after
        width: 100%;
        height: 2px;
        background-color: #fff;
        transition: all .3s;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        border-radius: 2px;
        top: 18px;
        content: "";
        position: absolute;
        left: 0;
        box-shadow: 1px 1px 5px #000;
      &:before
        width: 100%;
        height: 2px;
        background-color: #fff;
        transition: all .3s;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        border-radius: 2px;
        top: 9px;
        content: "";
        position: absolute;
        left: 0;
        box-shadow: 1px 1px 5px #000;


.nav-burger__checkbox:checked + .nav-burger
  display: none
  @media screen and (max-width: 768px)
    display: block
    span
      background-color: transparent;
      transition: all .3s;
      &:after
        -webkit-transform: rotate(-45deg) translate(6px,-7px);
        transform: rotate(-45deg) translate(6px,-7px);
        transition: all .3s;
      &:before
        -webkit-transform: rotate(45deg) translate(-1px);
        transform: rotate(45deg) translate(-1px);
        transition: all .3s;






.main-navigation__list2 li
  &:nth-child(5n)
    background: #fe8726
    a
      color: #fff 

.main-navigation__list2
  position: relative
  text-align: center
  width: 100%;
  display: flex ;
  justify-content: space-between;
  align-items: center;
  width: 100%



  @media screen and (max-width: 768px)
    width: 100%;
    margin: 11px 0px 0 0px;
    position: relative;
    z-index: 10;
    display: none
    font-size: 0px
    // width: 100%;
    // margin: 3px 0px 0 -14px;
    // position: absolute;
    // z-index: 4;
    // background: #efefef;
    // display: none;
    // border-bottom: 5px solid #6b3d31;

.main-navigation__item2
  padding: 0 5px

  @media screen and (max-width: 768px)
    display: block
    text-align-last: 
    border-bottom: 1px solid #777


.menu-item
  flex-grow: 1;
  @media screen and (max-width: 768px)
    width: 50%;
    display: inline-block;
    text-align: center;

.akciya.menu-item a 
  color: #fff

.main-navigation__link2
  position: relative
  display: block
  text-decoration: none
  -webkit-transition: all .3s ease
  -o-transition: all .3s ease
  transition: all .3s ease
  
  color: #45281a;
  font-family: "Akzidenz-Grotesk Pro";
  font-size: 28px;
  font-weight: 400;
  line-height: 79px;
  text-transform: uppercase;

  @media screen and (max-width: 1600px)
    font-size: 25px

  @media screen and (max-width: 768px)
    margin-left: 0px
    text-align: center;
    font-size: 26px
    line-height: 53px

  &:hover
    color: #ee8007


.main-navigation__link2--first::before
  @media screen and (max-width: 768px)
    content: ''
    
ul.main-navigation__list2 li:first-child a:before
  content: none

  @media screen and (max-width: 768px)
    content: ''



.rev_slider_wrapper 
  @media screen and (max-width: 1640px)
    width: 100%;
    max-height: 260px !important;



// слайдер

.slider-wrapper
  max-height: 347px
  @media screen and (max-width: 1640px)
    max-height: 260px
  @media screen and (max-width: 1640px)
    max-height: 100%
    height: 100%

.bg-ikg-slick
  background-color: rgba(0, 0, 0, 0); 
  background-repeat: no-repeat; 
  background-size: cover; 
  background-position: center center;
  width: 100%;
  height: 347px;
  opacity: 1; 
  visibility: inherit; 
  z-index: 20;

  @media screen and (max-width: 1640px)
    max-height: 260px
    height: 260px
    
  @media screen and (max-width: 800px)
    max-height: 100%
    height: 100%
     


#pjax-container
  order: 5

.action
  background-size: cover
  background-position: center center
  text-align: center
  color: #fff
  font-size: 27px
  border: 7px solid #fe8726;
  overflow: hidden 
  position: relative
  max-height: 362px
  @media screen and (max-width: 1640px)
    max-height: 260px
  @media screen and (max-width: 800px)
    order: 4;
    border: none




// табы в галлереи


.text 
  max-width: 700px;
  margin: 0 0 30px;
  background: #FFF;
  border: 2px solid #7DCA86;
  border-radius: 5px;
  padding: 7px 15px;
  box-sizing: border-box;

.tabs_wrapper
  margin-left: 40px;
  color: #000;
  text-decoration: none;
  display: block;
  margin: 20px 40px 15px;
  font-family: Candara-Bold,sans-serif;
  font-size: 25px;


.tabs__caption 
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  list-style: none;
  position: relative;
  margin: -1px 0 20px -1px;
  background: #efefef!important;

.tabs__caption li:last-child:before 
  content: '';
  position: absolute;
  bottom: -5px;
  left: 0;
  right: -2px;
  z-index: -1;
  height: 5px;
  background: #7DCA86;

.tabs__caption:after 
  content: '';
  display: table;
  clear: both;

.tabs__caption li 
  color: #999!important;
  font-size: 18px!important;
  line-height: 19px!important;
  text-transform: inherit!important;
  margin: 1px 12px 0 0!important;
  padding: 10px 12px 10px!important;
  white-space: nowrap!important;
  float: left!important;
  -webkit-user-select: none!important;
  -moz-user-select: none!important;
  -ms-user-select: none!important;
  user-select: none!important;

.tabs__caption li:not(.active) 
  cursor: pointer;


.tabs__caption .active 
  color: #000!important;
  font-size: 20px!important;
  line-height: 19px!important;
  text-transform: inherit!important;
  margin: 1px 12px 0 0!important;
  padding: 10px 12px 10px!important;
  white-space: nowrap!important;
  float: left!important;
  -webkit-user-select: none!important;
  background: #ee8007
  -moz-user-select: none!important;
  -ms-user-select: none!important;
  user-select: none!important;

.tabs__caption .active:after 
  content: '';
  position: absolute;
  bottom: -5px;
  left: 0;
  right: 0;
  height: 5px;
  background: #FFF;
  @media screen and (max-width: 650px) 
    display: none

.tabs__content 
  display: none;


.tabs__content.active 
  display: block;
  background: none
  color: #000
  &:hover
    color: #000


// табы для раздела фотографий



.tabs_wrapper_photos
  margin-left: 40px;
  color: #000;
  text-decoration: none;
  display: block;
  margin: 20px 40px 15px;
  font-family: Candara-Bold,sans-serif;
  font-size: 25px;
  overflow: hidden;
  @media screen and (max-width: 800px)
    margin: 20px 20px 15px;



.tabs__caption_photos
  list-style: none;
  position: relative;
  margin: 0px auto 20px ;
  max-width: 800px;
  @media screen and (max-width: 800px)
    max-width: 100%;

.tabs__caption_photos li:last-child:before 
  content: '';
  position: absolute;
  bottom: -5px;
  left: 0;
  right: -2px;
  z-index: -1;
  height: 5px;


.tabs__caption_photos:after 
  content: '';
  display: table;
  clear: both;

.tabs__caption_photos li 
  text-transform: inherit!important;
  margin: 1px 0px 22px 0!important;
  padding: 0 76px!important;
  -webkit-user-select: none!important;
  -moz-user-select: none!important;
  -ms-user-select: none!important;
  user-select: none!important;
  background: none !important ;
  padding: 0 0px!important;
  position: relative

.tabs__content_photos
  border: 2px solid #ebebeb
  border-top: none
  padding: 20px 20px 10px;


.tabs__caption_photos .active > .bg_li
  background-image: url(../img/photos-bg-active.jpg);
  border-bottom: 4px solid #ebebeb;

.bg_li
  color: #fff;
  font-size: 28px;
  line-height: 77px;
  text-transform: inherit;
  margin: 0px 0px 0px 0;
  padding: 0px 0 0 76px;
  white-space: nowrap;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  height: 74px;
  border-bottom: 4px solid #594233;
  background-image: url(../img/photos-bg.jpg);
  /* font-family: Cuprum; */
  font-weight: 400;
  font-family: Candara-Regular;
  @media screen and (max-width: 800px)
    font-size: 5vw;



.gallary-img-photos
  display: inline-block;
  vertical-align: top;
  width: 23.5%;
  margin-right: 2%;
  margin-bottom: 12px;
  box-shadow: 0 1px 5px rgba(0,0,0,.5);
  position: relative;
  overflow: hidden;
  font-size: 0px;
  &:nth-child(4n)
    margin-right: 0;
  img
    max-height: 200px;
    height: 180px;
    max-width: 100%;
  @media screen and (max-width: 1600px)
    img
      max-height: 200px;
      height: 140px;
      max-width: 100%;
  @media screen and (max-width: 800px)
    width: 48%;
    margin-right: 4%;
    &:nth-child(4n)
      margin-right: 0;
    &:nth-child(2n)
      margin-right: 0;
    img
      max-height: 250px;
      height: auto;
      max-width: 100%;





.bg_li_nogtevoi
  &:after
    background-image: url(../img/photos1.png);
    content: '';
    position: absolute;
    left: 21px;
    top: 6px;
    width: 35px;
    height: 58px;

.bg_li_parihmaher
  &:after
    background-image: url(../img/photos2.png);
    content: '';
    position: absolute;
    left: 17px;
    top: 13px;
    width: 45px;
    height: 45px;

.bg_li_kosmetic
  &:after
    background-image: url(../img/photos3.png);
    content: '';
    position: absolute;
    left: 18px;
    top: 12px;
    width: 42px;
    height: 47px;

.bg_li_salon
  &:after
    background-image: url(../img/photos4.png);
    content: '';
    position: absolute;
    left: 18px;
    top: 8px;
    width: 44px;
    height: 57px;






.tabs__caption_photos li:not(.active) 
  cursor: pointer;


// .tabs__caption_photos .active 
//   color: #000!important;
//   font-size: 20px!important;
//   line-height: 19px!important;
//   text-transform: inherit!important;
//   margin: 1px 12px 0 0!important;
//   padding: 10px 12px 10px!important;
//   white-space: nowrap!important;
//   float: left!important;
//   -webkit-user-select: none!important;
//   background: #ee8007
//   -moz-user-select: none!important;
//   -ms-user-select: none!important;
//   user-select: none!important;

.tabs__caption_photos .active:after 
  content: '';
  position: absolute;
  bottom: -5px;
  left: 0;
  right: 0;
  height: 5px;
  background: #FFF;
  @media screen and (max-width: 650px) 
    display: none

.tabs__content_photos 
  display: none;


.tabs__content_photos.active 
  display: block;
  background: none
  color: #000
  &:hover
    color: #000


// конец табов
.vertical .tabs__caption 
  float: left;
  display: block;

.vertical .tabs__caption li 
  float: none;
  border-width: 2px 0 2px 2px;
  border-radius: 5px 0 0 5px;

.vertical .tabs__caption li:last-child:before 
  display: none;

.vertical .tabs__caption .active:after 
  left: auto;
  top: 0;
  right: -2px;
  bottom: 0;
  width: 2px;
  height: auto;

.vertical .tabs__content 
  overflow: hidden;


@media screen and (max-width: 650px) 

  .tabs__caption li 
    -webkit-flex: 1 0 auto;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    width: 100%;
    text-align: center;
    border-bottom: 1px solid #ccc;
    box-sizing: border-box;
    margin: 1px 0px 0 0!important;

  
  .vertical .tabs__caption 
    float: none;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  
  .vertical .tabs__caption li 
    border-width: 2px 2px 0;
    border-radius: 5px 5px 0 0;
  
  .vertical .tabs__caption li:last-child:before 
    display: block;
  
  .vertical .tabs__caption .active:after 
    top: auto;
    bottom: -5px;
    left: 0;
    right: 0;
    width: auto;
    height: 5px;
    background: #FFF;
  




// отзывы

.testimonial_wrapper
    padding: 20px;
    text-align: left;
    border: 1px solid #E6E6E6;
    width: 100%
    >.slick-slider
        height: 200px
        overflow: hidden
        @media screen and (max-width: 1640px) 
          height: 187px


.testimonial_heading
    background: url(../img/quotes.png) no-repeat scroll left center transparent;
    margin-top: 0;
    padding-left: 40px;
    text-align: left;
    margin-bottom: 5px
    box-sizing: border-box
.testimonial_content
    box-sizing: border-box;
.testimonial_image
    margin-top: .25em;
    margin-right: 1em;
    margin-bottom: 0.25em;
    float: left;
    max-width: 100%;
.vremennoe_logo
    background-image: url(../img/nakleika.jpg);
    width: 180px;
    height: 130px;
    border: 1px solid #e6e6e6;
    background-size: contain;
    @media screen and (max-width: 1640px)
      width: 133px
      height: 98px
.testimonial_client
    margin-top: 0px;
    text-align: right;
.testimonial_name
  font-weight: bold;
  margin-right: 5px

.testimonial_heading
  a 
    color: #ee8007
    font-weight: 600

.product-label
  position: absolute;
  z-index: 100;
  cursor: pointer;
  left: auto;
  top: auto;



.slick-prev
  /* left: 0px; */
  left: 25px !important;
  cursor: pointer !important;
  min-width: 70px !important;
  min-height: 70px !important;
  position: absolute !important;
  display: block !important;
  z-index: 100 !important;
  border-radius: 35px !important;
  overflow: hidden !important;
  background: rgba(0,0,0,0.20) !important;

.slick-prev:before
  content: "\e824" !important;


.slick-next
  right: 25px !important;
  cursor: pointer !important;
  min-width: 70px !important;
  min-height: 70px !important;
  position: absolute !important;
  display: block !important;
  z-index: 100 !important;
  border-radius: 35px !important;
  overflow: hidden !important;
  background: rgba(0,0,0,0.20) !important;

.slick-next:before, .slick-prev:before
  font-family: slick !important;
  font-size: 20px !important;
  line-height: 1 !important;
  opacity: .75 !important;
  color: #fff !important;
  -webkit-font-smoothing: antialiased !important;
  font-family: "revicons" !important;
  -moz-osx-font-smoothing: grayscale !important;


.slick-next:before
  content: "\e825"!important;

.slider-progress
    width: 100%;
    height: 5px;
    /* background: #eee; */
    position: absolute;
    top: 0px;

.slider-progress .progress
  width: 0%;
  height: 5px;
  background: rgba(0,0,0,0.15)

.slick-dotted.slick-slider
  margin-bottom: 0px !important

.slider-wrapper
  .slick-slide
    line-height: 0
.slick-dots 
  position: absolute !important;
  bottom: 0px !important;
  display: block !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
  text-align: center !important;

.slick-dots 
  li 
    button
      font-size: 0px !important;
      line-height: 0 !important;
      display: block !important;
      padding: 5px 0px !important;
      color: transparent !important;
      border: 0 !important;
      outline: none !important;
      background: #fff !important;
      border: 2px solid #ccc !important;
      border-radius: 50px;
      -moz-border-radius: 50px;
      -webkit-border-radius: 50px;
      -khtml-border-radius: 50px;
      text-indent: -9999px


.slick-dots 
  li.slick-active 
    button
      background: #ee8007 !important;
      border: none !important;
      &:before
        opacity: 0 !important;
        color: #000 !important;
        font-size: 0 !important;









// 
#ajaxsearchpro1_1 .probox .proinput input.orig, #ajaxsearchpro1_2 .probox .proinput input.orig, div.ajaxsearchpro[id*="ajaxsearchpro1_"] .probox .proinput input.orig
  font-weight: normal
  font-family: 'Open Sans'
  color: rgb(0, 0, 0)
  font-size: 12px
  line-height: 15px
  text-shadow: 0px 0px 0px rgba(255, 255, 255, 0)
  line-height: normal
  border: 0
  margin: 0px 0 0 0px !important
  position: relative
  z-index: 2
  padding: 0 !important
  padding-top: 0px !important
  width: 100%
  background: transparent !important
  height: 39px!important



#ajaxsearchpro1_1 .probox .proinput input.autocomplete, #ajaxsearchpro1_2 .probox .proinput input.autocomplete, div.ajaxsearchpro[id*="ajaxsearchpro1_"] .probox .proinput input.autocomplete
  font-weight: normal
  font-family: 'Open Sans'
  color: rgb(0, 0, 0)
  font-size: 12px
  line-height: 15px
  text-shadow: 0px 0px 0px rgba(255, 255, 255, 0)
  line-height: normal
  opacity: 0.45
  height: 40px
  display: block
  position: relative
  z-index: 1
  padding: 0 !important
  margin: 0px 0 0 0px !important
  margin-top: -40px !important
  width: 100%
  background: transparent !important

#ajaxsearchpro1_1 .probox .promagnifier .innericon svg, #ajaxsearchpro1_2 .probox .promagnifier .innericon svg, div.ajaxsearchpro[id*="ajaxsearchpro1_"] .probox .promagnifier .innericon svg
  fill: #fff !important

#ajaxsearchpro1_1 .probox .promagnifier, #ajaxsearchpro1_2 .probox .promagnifier, div.ajaxsearchpro[id*="ajaxsearchpro1_"] .probox .promagnifier
  background-color: #ee8007
  color: #fff
  text-transform: uppercase
  border: 0
  outline: 0
  display: inline-block
  padding: 0px 20px
  margin-left: -5px
  cursor: pointer
  text-decoration: none

  @media screen and (max-width: 1640px)
    padding: 0px

  @media screen and (max-width: 768px)
    width: auto
    height: 35px
    flex: 0 0 auto
    order: 7
    -webkit-flex: 0 0 auto
    -webkit-order: 7
    z-index: 1

#ajaxsearchpro1_1 .probox .promagnifier div.innericon, #ajaxsearchpro1_2 .probox .promagnifier div.innericon, div.ajaxsearchpro[id*="ajaxsearchpro1_"] .probox .promagnifier div.innericon
  width: 35px
  height: 39px !important
  float: right

#ajaxsearchpro1_1 .probox .promagnifier div.asp_text_button, #ajaxsearchpro1_2 .probox .promagnifier div.asp_text_button, div.ajaxsearchpro[id*="ajaxsearchpro1_"] .probox .promagnifier div.asp_text_button
  width: auto
  height: 39px !important
  float: right
  margin: 0
  padding: 0 10px 0 2px
  font-weight: normal
  font-family: 'Open Sans'
  color: #fff !important
  font-size: 15px
  line-height: normal
  text-shadow: 0px 0px 0px rgba(255, 255, 255, 0)
  line-height: 39px !important

#ajaxsearchpro1_1 .probox .promagnifier, #ajaxsearchpro1_2 .probox .promagnifier, div.ajaxsearchpro[id*="ajaxsearchpro1_"] .probox .promagnifier
  width: auto !important
  height: 39px !important
  flex: 0 0 auto !important
  order: 7
  -webkit-flex: 0 0 auto
  -webkit-order: 7
  border: none !important
  border-radius: 0px !important
  box-shadow: none !important
  background-image: none !important

#ajaxsearchpro1_1 .probox, #ajaxsearchpro1_2 .probox, div.ajaxsearchpro[id*="ajaxsearchpro1_"] .probox
  margin: 0px !important
  height: 39px !important
  background: none !important
  border: none !important
  border-radius: 0px !important
  box-shadow: none !important

#ajaxsearchpro1_1, #ajaxsearchpro1_2, div.ajaxsearchpro[id*="ajaxsearchpro1_"]
  width: 100% !important
  margin: 0 auto !important
  height: 39px !important
  border-radius: 0px !important
  background: #d1eaff
  background-image: -webkit-linear-gradient(185deg, rgba(253, 253, 253, 1), rgba(250, 250, 250, 1))
  background-image: -moz-linear-gradient(185deg, rgba(253, 253, 253, 1), rgba(250, 250, 250, 1))
  background-image: -o-linear-gradient(185deg, rgba(253, 253, 253, 1), rgba(250, 250, 250, 1))
  background-image: -ms-linear-gradient(185deg, rgba(253, 253, 253, 1) 0%, rgba(250, 250, 250, 1) 100%)
  background-image: linear-gradient(185deg, rgba(253, 253, 253, 1), rgba(250, 250, 250, 1))
  overflow: hidden
  border: 0px none rgb(0, 0, 0)
  box-shadow: none !important

  @media screen and (max-width: 768px)
    width: 100% !important

.services-search #ajaxsearchpro1_1, #ajaxsearchpro1_2, div.ajaxsearchpro[id*="ajaxsearchpro1_"]
  width: 100% !important
  
  @media screen and (max-width: 1640px)
    width: 100% !important

@media screen and (max-width: 1800px)
  #ajaxsearchpro1_1
    width: 100% !important

  #ajaxsearchpro1_2, div.ajaxsearchpro[id*="ajaxsearchpro1_"]
    width: 100% !important

@media screen and (max-width: 1640px)
  #ajaxsearchpro1_1, #ajaxsearchpro1_2, div.ajaxsearchpro[id*="ajaxsearchpro1_"]
    width: 95% !important


.asp_text_button
  @media screen and (max-width: 768px)
    display: none





.toggle-mnu
  width: 50px;
  height: 46px;
  margin-top: -3px;
  margin-right: 0;
  border: 3px solid #fff;
  padding: 10px;
  margin-left: 12px

  span
    &:after, &:before
      content: ""
      position: absolute
      left: 0
      top: 9px

    &:after
      top: 18px
      width: 100%
      height: 2px
      background-color: #fff
      -webkit-transition: all 0.3s
      -o-transition: all 0.3s
      transition: all 0.3s
      -webkit-backface-visibility: hidden
      backface-visibility: hidden
      border-radius: 2px
    position: relative
    display: block
    width: 100%
    height: 2px
    background-color: #fff
    -webkit-transition: all 0.3s
    -o-transition: all 0.3s
    transition: all 0.3s
    -webkit-backface-visibility: hidden
    backface-visibility: hidden
    border-radius: 2px

    &:before
      width: 100%
      height: 2px
      background-color: #fff
      -webkit-transition: all 0.3s
      -o-transition: all 0.3s
      transition: all 0.3s
      -webkit-backface-visibility: hidden
      backface-visibility: hidden
      border-radius: 2px

  &.on span
    background-color: transparent

    &:before
      -webkit-transform: rotate(45deg) translate(-1px, 0px)
      -ms-transform: rotate(45deg) translate(-1px, 0px)
      transform: rotate(45deg) translate(-1px, 0px)

    &:after
      -webkit-transform: rotate(-45deg) translate(6px, -7px)
      -ms-transform: rotate(-45deg) translate(6px, -7px)
      transform: rotate(-45deg) translate(6px, -7px)


.video-o-salone
  color: #fb8835;
  font-family: "Akzidenz-Grotesk Pro";
  font-size: 30px;
  font-weight: 400;
  line-height: 28px;
  text-transform: uppercase;
  margin-top: 50px
  text-align: center
  margin-bottom: 15px


.video
  background-image: url("../img/video-bg.jpg")
  background-color: #ee8007
  background-size: cover
  background-position: center
  background-repeat: no-repeat
  display: block
  text-align: center
  padding: 90px 0
  position: relative
  // margin-top: 40px
  // margin-bottom: -9px



  @media screen and (max-width: 768px)
    height: 100%
    min-height: 100%
    padding: 56px 0px

  iframe
    @media screen and (max-width: 768px)
      height: 178px
  a 
    @media screen and (max-width: 768px)
      width: 70px
      height: 70px 
      margin-top: 0px


.play-button-wrapper
  background-color: rgba(0,0,0,.5);
  padding: 30px 0px 30px 5px;
  border-radius: 50%;
  width: 90px;
  height: 90px;
  display: inline-block;

.play-button
  display: inline-block
  width: 24px; height: 31px;
  background:  url('../img/css_sprite.png') -300px -159px;

  img
    margin: 29px

    @media screen and (max-width: 768px)
      margin: 20px





.main-content
  background-size: 100%
  background-position: center top
  background-repeat: no-repeat

  @media screen and (max-width: 768px)
    background-repeat: repeat

.quick-search
  padding: 15px 10px 35px
  display: block
  background-color: rgba(74, 74, 74, 0.7)

  @media screen and (max-width: 1640px)
    display: block
    background-color: rgba(74, 74, 74, 0.7)
    box-sizing: border-box
    -webkit-box-sizing: border-box
    box-sizing: border-box

  @media screen and (max-width: 768px)
    padding: 15px 10px 30px

  @media screen and (max-width: 320px)
    margin-top: 15px

.quick-search__title
  text-align: center
  color: #ff8428
  font-size: 26px
  padding-bottom: 10px

.quick-search__form
  text-align: center

.quick-search__input
  color: #969595
  background-color: #fff
  padding: 10px 8px
  width: 60%
  outline: 0

.salon-txt
  display: inline-block
  vertical-align: top
  line-height: 55px
  padding: 0 5px

.salon-description
  padding: 30px 0 0px
  text-align: center
  font-size: 18px
  @media screen and (max-width: 768px) 
    padding: 7px 0px 0px

  p
    margin-bottom: 15px
    padding: 0 25px

.salon-description__title
  color: #ee8007
  font-size: 23px
  margin-bottom: 15px
  @media screen and (max-width: 768px)
    display: none

.salon-description__name
  color: #000
  font-size: 40px
  text-transform: uppercase
  display: inline-block
  line-height: 50px
  font-family: "Candara-Bold", sans-serif;

.salon-description__strong
  font-family: "Candara-Bold", sans-serif;

.advantages
  position: relative
  margin-top: 1px

.advantages__item
  position: relative

.advantages__img
  left: 0
  top: 0
  width: 50%
  height: 100%
  position: absolute
  background-size: cover
  background-position: center
  background-image: url("../img/advantages-1.jpg");

  @media screen and (max-width: 768px)
    width: 100%
    position: relative
    height: 283px

.advantages__img--paried
  right: 0
  left: 50%

  @media screen and (max-width: 768px)
    left: 0
    height: 283px
    position: relative

.advantages__description
  width: 50%
  background-color: rgba(255, 121, 22, 0.8)
  padding: 54px 30px 54px
  color: #fff

  @media screen and (max-width: 768px)
    width: 100%

.advantages__notparied
  float: right

.advantages__paried
  float: left

.subdescription
  text-align: center
  font-size: 18px
  padding: 25px 70px

  @media screen and (max-width: 768px)
    padding: 25px 5% 

.subdescription__title a
  color: #e67d03
  font-size: 28px
  padding: 5px 0

.subdescription2
  text-align: center
  font-size: 18px
  padding: 0px 30px 25px

  @media screen and (max-width: 768px)
    display: none

.lubov   
  color: #e67d03
  font-size: 28px
  padding: 5px 0
  text-align: center;
  padding: 10px 0px; 

.glav-text-skr
  h2
    position: relative
    color: #1f1f1f
    font-size: 36px
    margin: 25px 0 10px
    padding: 14px 0 0
    text-align: left
    font-family: Akzidenz-Grotesk Pro;

    &::before
      content: ''
      position: absolute
      left: 0
      top: 0
      width: 165px
      height: 10px
      background-color: #ee8007
  p
    text-align: left

  a 
    color: #000
    &:hover
      color: #ee8007

h1.glav-index
  font-size: 35px
  color: #ee8007

.glav-text-skr
  strong
    font-weight: 600

  ul
    list-style: none
    counter-reset: li
    padding: 8px 0px 1px
    left: -7px

    li
      position: relative
      display: block
      padding: .4em .2em .4em 3em
      margin: .5em 0
      background: #eee
      text-decoration: none
      overflow: hidden
      transition: all .3s ease-out
      text-align: left

      &:before
        content: counter(li)
        counter-increment: li
        position: absolute
        top: 50%
        margin: -1.3em 0px 0px 3px
        height: 2em
        width: 2em
        line-height: 2em
        font-size: 15px
        color: #fff
        background: #FB8835
        border: .2em solid #fff
        -webkit-box-shadow: 0 8px 5px -7px #888
        -moz-box-shadow: 0 8px 5px -7px #888
        box-shadow: 0 8px 5px -7px #888
        text-align: center
        font-weight: bold
        border-radius: 2em
        position: absolute
        left: 0
        transition: all .3s ease-out

.partners
  margin: 0 0px 0px

  @media screen and (max-width: 768px)
    display: none

.partners__title
  font-size: 20px;
  text-align: center;
  height: 39px
  
  /* margin-top: -20px; */
  /* padding-bottom: 20px; */

  span
    display: inline-block;
    color: #45281a;
    font-family: "Akzidenz-Grotesk Pro";
    font-size: 34px;
    font-weight: 400;
    text-transform: uppercase;

.partners__wrapper
  text-align: center;
  /* margin-top: -20px; */
  overflow: hidden;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: #f5f5f5;
  height: 105px;

  @media screen and (max-width: 1640px)
    flex-wrap: wrap;


.partners__item
  display: inline-block
  vertical-align: middle
  padding: 0 10px


.partners-img
  height: 72px;
  width: 16%

.prtner1
  width: 100px;
  height: 95px;
  margin: 0px 15px
  background: url('../img/css_sprite.png') -300px -259px;
  background-repeat: no-repeat;
.prtner2
  width: 100px;
  height: 95px;
  margin: 0px 15px
  background: url('../img/css_sprite.png') -200px -259px;
  background-repeat: no-repeat;
.prtner3
  width: 100px;
  height: 95px;
  margin: 0px 15px
  background: url('../img/css_sprite.png') -0 -59px;
  background-repeat: no-repeat;
.prtner4
  width: 100px;
  height: 95px;
  margin: 0px 15px
  background: url('../img/css_sprite.png') -100px -259px;
  background-repeat: no-repeat;
.prtner5
  width: 100px;
  height: 95px;
  margin: 0px 15px
  background: url('../img/css_sprite.png') -0 -259px;
  background-repeat: no-repeat;
.prtner6
  width: 100px;
  height: 95px;
  margin: 0px 15px
  background: url('../img/css_sprite.png') -358px -100px;
  background-repeat: no-repeat;
.prtner7
  width: 100px;
  height: 95px;
  margin: 0px 15px
  background: url('../img/css_sprite.png') -458px -0;
  background-repeat: no-repeat;
.prtner8
  width: 100px;
  height: 95px;
  margin: 0px 15px
  background: url('../img/css_sprite.png') -200px -159px;
  background-repeat: no-repeat;
.prtner9
  width: 100px;
  height: 95px;
  margin: 0px 15px
  background: url('../img/css_sprite.png') -100px -159px;
  background-repeat: no-repeat;
.prtner10
  width: 100px;
  height: 95px;
  margin: 0px 15px
  background: url('../img/css_sprite.png') -0 -159px;
  background-repeat: no-repeat;
.prtner11
  width: 100px;
  height: 95px;
  margin: 0px 15px
  background: url('../img/css_sprite.png') -200px -59px;
  background-repeat: no-repeat;
.prtner12
  width: 100px;
  height: 95px;
  margin: 0px 15px
  background: url('../img/css_sprite.png') -100px -59px;
  background-repeat: no-repeat;
.prtner13
  width: 100px;
  height: 95px;
  margin: 0px 15px
  background: url('../img/css_sprite.png') -358px -0;
  background-repeat: no-repeat;




.home .service__top
  padding: 277px 0 61px
  height: auto

  @media screen and (max-width: 768px)
    padding: 80px 0 60px

.service
  background-image: url(../img/main-bg.jpg);
  background-size: contain

.service__top
  position: relative
  color: #fff
  padding: 104px 0 63px
  height: 243px
  text-align: center
  font-size: 23px
  line-height: 1
  background-color: #ee8007


  &::before
    content: ''
    position: absolute
    left: 0
    top: 0
    width: 100%
    height: 100%
    background-image: url("../img/service-topbg.jpg")
    opacity: .08

.service__top--accent
  font-size: 55px
  display: block


.service__title
  padding: 50px 0
  color: #fff
  text-align: center
  font-size: 32px
  background-size: cover
  background-position: center center
  background-repeat: no-repeat

  @media screen and (max-width: 1640px)
    padding: 50px 0
    color: #fff
    text-align: center
    font-size: 23px
    background-size: cover
    background-position: center center
    background-repeat: no-repeat
  @media screen and (max-width: 768px)
    padding: 25px 0;


.service__title2
  padding: 50px 0
  color: #fff
  text-align: center
  font-size: 25px
  background-size: cover
  background-position: center center
  background-repeat: no-repeat



.service__cosmetology
  background-image: url("../img/cosmetology-service.jpg")

.service__nail
  background-image: url("../img/nail-service.jpg")

.service__tonsorial
  background-image: url("../img/tonsorial-service.jpg")

.service__solyari
  background-image: url("../img/solyari.jpg")

.service__list
  display: inline-block
  text-align: left
  margin: 15px 10px

  a.active
    background: none
    color: #6b3d31;
    font-weight: 600



.service__link
  color: #000
  text-decoration: none
  display: block
  font-size: 17px
  line-height: 1.45
  -webkit-transition: all .3s ease
  -o-transition: all .3s ease
  transition: all .3s ease
  position: relative
  padding-left: 14px

  &:hover
    font-weight: 600;
    color: #6b3d31;


  &::before
    content: ''
    position: absolute
    left: 0
    top: 50%
    width: 6px
    height: 6px
    margin-top: -3px
    background-color: #fe8726
    border-radius: 50%





.action__title, .action__offer
  font-size: 65px
  line-height: 1

.foogallery-default
  &.spacing-width-10 a
    display: inline-block !important
    vertical-align: middle !important
    padding: 0 10px !important
    width: 16% !important
    text-align: -webkit-center !important
    margin: 0 auto !important
    height: 80px

  &.alignment-center
    text-align: center !important
    margin: 0 auto !important

  a img
    vertical-align: middle !important

.butik
  padding: 150px 20px
  text-align: center
  font-size: 32px
  background-image: url("../img/butik.jpg")
  background-size: cover
  background-position: center center




.butik__offer a
  background-color: rgba(0, 0, 0, 0.4)
  display: inline-block
  padding: 25px 50px
  color: #fff
  text-decoration: none
  -webkit-transition: all .3s ease
  -o-transition: all .3s ease
  transition: all .3s ease

  &:hover
    background-color: rgba(0, 0, 0, 0.3)

.home .job
  padding: 65px 0 47px
  padding-left: 50px

.job
  padding: 58px 0
  text-align: left
  padding-left: 50px
  color: #fff
  font-size: 20px
  background-image: url("../img/job.jpg")
  background-size: cover
  background-position: center center

.job__title
  text-align: center
  font-family: "Candara-Bold"
  font-size: 27px
  text-transform: uppercase

.job__subtitle
  text-align: center

.vacancy
  margin-top: 30px
  font-size: 20px
  font-weight: bold
  color: #ff8428
  font-family: "Candara-Bold", sans-serif;

.container
  max-width: 1000px
  margin: 0 auto

.services-search
  margin-top: 13px
  margin-right: 0px
  display: inline-block
  border: 1px solid #ccc !important
  float: right

  @media screen and (max-width: 1800px)
    float: none
    display: block
    text-align: center
    margin: 20px 0px
  @media screen and (max-width: 1640px)
    float: none
    display: block
    text-align: center
    margin: 20px 0px

.services-search__input
  padding: 8px 15px 9px
  font-size: 14px
  outline: 0

.fancybox-is-open .fancybox-bg
  opacity: .67
  width: 100%
  transition-timing-function: cubic-bezier(0.22, 0.61, 0.36, 1)
  height: 100%

.page-navigation
  width: 100%
  display: inline-block
  vertical-align: top

  @media only screen and (max-width: 1800px)
    width: 100%
  @media screen and (max-width: 1640px)
    width: 100%
  @media screen and (max-width: 768px)
    width: 100%

.page-navigation-tovar
  margin: 0px 0px 0px
  display: inline-block
  vertical-align: top

.page-presentation
  background-position: center center
  background-size: cover
  background-repeat: no-repeat
  height: 207px
  margin-top: 36px

  @media screen and (max-width: 768px)
    margin-top: 0px

  @media screen and (max-width: 320px)
    margin-top: 0px

.page-uslugi
  background-image: url("../img/presentation-uslugi.jpg")

.page-action
  background-image: url("../img/presentation-action.jpg")

.page-butik
  background-image: url("../img/presentation-butik.jpg")

.page-gallery
  background-image: url("../img/presentation-gallery.jpg")

.page-contacts
  background-image: url("../img/presentation-contacts.jpg")

.page-prices
  background-image: url("../img/presentation-prices.jpg")

.page-services
  background-image: url("../img/presentation-services.jpg")

.page-raznoe
  background-image: url("../img/presentation-raznoe.jpg")

.presentation__item
  display: inline-block
  color: #fff
  margin: 60px 0
  padding: 25px 90px

.presentation__item--large
  margin: 40px 0

.presentation-uslugi
  background-color: rgba(0, 0, 0, 0.29)
  padding: 14px 90px 13px

  @media screen and (max-width: 480px)
    padding-left: 40px
    padding-right: 40px

.presentation-action
  background-color: #ee5700

.presentation-butik
  background-color: #79088f

  @media screen and (max-width: 768px)
    padding: 25px 40px
    width: 100%
    opacity: 0.8

.presentation-gallery
  background-color: #ee6293

.presentation-contacts
  background-color: rgba(0, 107, 163, 0.7)

.presentation-prices
  background-color: #af2b39

.presentation-services
  background-color: rgba(0, 158, 224, 0.72)

.presentation__title
  font-size: 30px
  line-height: 1.2

.presentation__title--large
  font-size: 50px

.presentation__subtitle
  font-size: 26px

.page-navigation ul, .page-navigation-tovar ul
  padding: 10px 0 0 0px
  font-size: 16px
  li
    display: inline-block
    color: #414141
    a
      color: #414040
      font-size: 14px 
      text-decoration: underline
      @media screen and (max-width: 768px)
        font-size: 14px

.woocommerce-breadcrumb
  font-size: 14px

.page-navigation ul 
  @media screen and (max-width: 768px)
    padding: 10px 0px 0

.wpmslider-pager-item
  .active
    background: none !important

  a:before
    color: #ee8007 !important
    font-size: 20px !important
    margin-right: 10px

.price
  display: block
  text-align: center
  padding: 25px 45px 20px
  margin-bottom: 20px

  @media screen and (max-width: 768px)
    display: block
    text-align: center
    padding: 25px 45px 20px
    margin-bottom: 20px

.present-image
  float: right
  margin-top: 50px
  width: 32%
  margin-left: 20px

  @media screen and (max-width: 1640px)
    display: none

  img
    max-width: 100%
    height: auto


.tovar-preview
  @media screen and (max-width: 768px)
    background-image: url(../img/tovar-bg.jpg)
    background-size: cover
    background-position: center center
    background-repeat: no-repeat
    position: relative
    margin: 30px 0px
    padding: 40px 20px


.procedure2
  position: relative
  padding: 10px 40px 0px;

  @media screen and (max-width: 1640px)
    padding: 0 30px

  @media screen and (max-width: 768px)
    position: relative
    padding: 0px 10px 0px;

.procedure
  position: relative
  padding: 0 40px

  @media screen and (max-width: 1640px)
    padding: 0 30px

  @media screen and (max-width: 768px)
    position: relative
    padding:  0 15px
    margin-top: 0px

  p
    font-size: 17px
    margin-bottom: 10px

  h1
    font-size: 43px;
    color: #ee8007;
    margin: 20px 0 10px;
    font-family: Akzidenz-Grotesk Pro;
    text-transform: uppercase;

    @media screen and (max-width: 768px)
      font-size: 33px;
      color: #ee8007;
      margin: 10px 0 10px;
      font-family: Akzidenz-Grotesk Pro;
      text-transform: uppercase;
      text-align: center;



  strong
    font-weight: 600
    width: 65%

  a
    color: #ee8007

  img
    max-width: 100%
    height: auto
    float: right
    margin-top: 20px
    width: 40%
    margin-bottom: 20px
    margin-left: 20px


    @media screen and (max-width: 768px)
      float: none 
      margin: 0px
      width: 100%

  ul
    list-style: none
    counter-reset: li
    padding: 8px 0px 1px
    left: -7px

  li
    position: relative
    margin: 0 0 10px 0
    padding: 3px 2px 0 17px
    left: -5px

  ul li
    position: relative
    display: block
    padding: .4em .2em .4em 3em
    *padding: .2em
    margin: .5em 0
    background: #eee
    text-decoration: none
    overflow: hidden
    transition: all .3s ease-out

    &:before
      content: counter(li)
      counter-increment: li
      position: absolute
      top: 50%
      margin: -1.3em 0px 0px 3px
      height: 2em
      width: 2em
      line-height: 2em
      font-size: 15px
      color: #fff
      background: #FB8835
      border: .2em solid #fff
      -webkit-box-shadow: 0 8px 5px -7px #888
      -moz-box-shadow: 0 8px 5px -7px #888
      box-shadow: 0 8px 5px -7px #888
      text-align: center
      font-weight: bold
      border-radius: 2em
      position: absolute
      left: 0
      transition: all .3s ease-out

    &:hover
      background: #ddd

      &:before
        transform: rotate(360deg)

    a:hover
      color: #444

  ol
    list-style: none
    counter-reset: li
    padding: 8px 0px 1px
    left: -7px

  li
    position: relative
    margin: 0 0 10px 0
    padding: 3px 2px 0 17px
    left: -5px
    font-size: 16px

  ol li
    position: relative
    display: block
    padding: .4em .2em .4em 3em
    *padding: .2em
    margin: .5em 0
    background: #eee
    text-decoration: none
    overflow: hidden
    transition: all .3s ease-out

    &:before
      content: counter(li)
      counter-increment: li
      position: absolute
      top: 50%
      margin: -1.3em 0px 0px 3px
      height: 2em
      width: 2em
      line-height: 2em
      font-size: 15px
      color: #fff
      background: #FB8835
      border: .2em solid #fff
      -webkit-box-shadow: 0 8px 5px -7px #888
      -moz-box-shadow: 0 8px 5px -7px #888
      box-shadow: 0 8px 5px -7px #888
      text-align: center
      font-weight: bold
      border-radius: 2em
      position: absolute
      left: 0
      transition: all .3s ease-out

    &:hover
      background: #ddd

      &:before
        transform: rotate(360deg)

    a:hover
      color: #444

  h2
    position: relative;
    color: #1f1f1f;
    font-size: 36px;
    margin: 25px 0 10px;
    padding: 14px 0 0;
    font-family: Akzidenz-Grotesk Pro;

    @media screen and (max-width: 768px)
      position: relative
      color: #1f1f1f
      font-size: 27px
      margin: 25px 0 10px
      padding: 14px 0 0 

    &::before
      content: ''
      position: absolute
      left: 0
      top: 0
      width: 165px
      height: 10px
      background-color: #ee8007
  h3
    position: relative
    color: #1f1f1f
    font-size: 24px
    margin: 25px 0 10px
    padding: 14px 0 0

    &::before
      content: ''
      position: absolute
      left: 0
      top: 0
      width: 135px
      height: 6px
      background-color: #ee8007
// 



.procedure-pages
  position: relative
  padding: 0 0px

  @media screen and (max-width: 1640px)
    padding: 0 0px

  @media screen and (max-width: 768px)
    position: relative
    padding:  0 15px
    margin-top: 0px

  p
    font-size: 17px
    margin-bottom: 10px

  h1
    font-size: 43px;
    color: #ee8007;
    margin: 20px 0 10px;
    font-family: Akzidenz-Grotesk Pro;
    text-transform: uppercase;

    @media screen and (max-width: 768px)
      font-size: 33px;
      color: #ee8007;
      margin: 10px 0 10px;
      font-family: Akzidenz-Grotesk Pro;
      text-transform: uppercase;
      text-align: center;
 


  strong
    font-weight: 600
    width: 65%

  a
    color: #ee8007

  img
    max-width: 100%
    width: 100% !important;
    height: auto !important;


    @media screen and (max-width: 768px)
      float: none 
      margin: 0px
      width: 100%

  ul
    list-style: none
    counter-reset: li
    padding: 8px 0px 1px
    left: -7px

  li
    position: relative
    margin: 0 0 10px 0
    padding: 3px 2px 0 17px
    left: -5px

  ul li
    position: relative
    display: block
    padding: .4em .2em .4em 3em
    *padding: .2em
    margin: .5em 0
    background: #eee
    text-decoration: none
    overflow: hidden
    transition: all .3s ease-out

    &:before
      content: counter(li)
      counter-increment: li
      position: absolute
      top: 50%
      margin: -1.3em 0px 0px 3px
      height: 2em
      width: 2em
      line-height: 2em
      font-size: 15px
      color: #fff
      background: #FB8835
      border: .2em solid #fff
      -webkit-box-shadow: 0 8px 5px -7px #888
      -moz-box-shadow: 0 8px 5px -7px #888
      box-shadow: 0 8px 5px -7px #888
      text-align: center
      font-weight: bold
      border-radius: 2em
      position: absolute
      left: 0
      transition: all .3s ease-out

    &:hover
      background: #ddd

      &:before
        transform: rotate(360deg)

    a:hover
      color: #444

  ol
    list-style: none
    counter-reset: li
    padding: 8px 0px 1px
    left: -7px

  li
    position: relative
    margin: 0 0 10px 0
    padding: 3px 2px 0 17px
    left: -5px
    font-size: 16px

  ol li
    position: relative
    display: block
    padding: .4em .2em .4em 3em
    *padding: .2em
    margin: .5em 0
    background: #eee
    text-decoration: none
    overflow: hidden
    transition: all .3s ease-out

    &:before
      content: counter(li)
      counter-increment: li
      position: absolute
      top: 50%
      margin: -1.3em 0px 0px 3px
      height: 2em
      width: 2em
      line-height: 2em
      font-size: 15px
      color: #fff
      background: #FB8835
      border: .2em solid #fff
      -webkit-box-shadow: 0 8px 5px -7px #888
      -moz-box-shadow: 0 8px 5px -7px #888
      box-shadow: 0 8px 5px -7px #888
      text-align: center
      font-weight: bold
      border-radius: 2em
      position: absolute
      left: 0
      transition: all .3s ease-out

    &:hover
      background: #ddd

      &:before
        transform: rotate(360deg)

    a:hover
      color: #444

  h2
    position: relative;
    color: #1f1f1f;
    font-size: 36px;
    margin: 25px 0 10px;
    padding: 14px 0 0;
    font-family: Akzidenz-Grotesk Pro;

    @media screen and (max-width: 768px)
      position: relative
      color: #1f1f1f
      font-size: 27px
      margin: 25px 0 10px
      padding: 14px 0 0 

    &::before
      content: ''
      position: absolute
      left: 0
      top: 0
      width: 165px
      height: 10px
      background-color: #ee8007
  h3
    position: relative
    color: #1f1f1f
    font-size: 24px
    margin: 25px 0 10px
    padding: 14px 0 0

    &::before
      content: ''
      position: absolute
      left: 0
      top: 0
      width: 135px
      height: 6px
      background-color: #ee8007



// 

.responsive-tabs
  ul
    &.responsive-tabs__list
      font-size: 18px
      line-height: 18px
      padding: 0 !important
      background: #ccc !important
      width: 100% !important
      height: 42px !important
      display: block !important
      background-color: #efefef !important
      margin: 20px 0px 15px !important
      font-family: "Candara-Bold", sans-serif !important; 
      font-size: 25px !important

      @media screen and (max-width: 768px)
        height: 100% !important

    li 
      @media screen and (max-width: 768px)
        display: block !important
        float: none !important

    li:before
      display: none !important

  h2
    @media screen and (max-width: 768px)
      display: none !important


  .responsive-tabs__list__item--active
    background: #ee8007 !important;
    border-color: #ddd !important;
    color: #000 !important;
    padding-bottom: 11px !important;
    margin-top: 0 !important;
    position: relative !important;
    top: 1px !important;
    left: 0px !important;
    font-size: 22px !important;

    &:hover
      background: #ee8007 !important;
      border-color: #ddd !important;
      color: #000 !important;
      padding-bottom: 11px !important;
      margin-top: 0 !important;
      position: relative !important;
      top: 1px !important;
      left: 0px !important;
      font-size: 22px !important;

  .responsive-tabs__panel
    background: #fff
    border: none !important
    -webkit-border-radius: 0px
    -moz-border-radius: 0px
    border-radius: 0px
    -webkit-border-top-left-radius: 0px
    -moz-border-radius-topleft: 0px
    border-top-left-radius: 0px
    clear: left
    margin-bottom: 0
    padding: 0 !important
    word-wrap: break-word

#foogallery-gallery-290 a img
  border: none !important
  border-radius: none !important

.foogallery-default
  &.border-style-square-white a
    border: none !important
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5)
    -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5)
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.5)

    &:hover
      border: none !important
      -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5)
      -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5)
      box-shadow: 0 1px 5px rgba(0, 0, 0, 0.5)
  img
    max-width: 100%
    float: none !important
    margin-top: 0px !important
    margin-right: 0px !important
    width: 100% !important
    margin-bottom: 0px !important
    margin-left: 0px !important

  &.spacing-width-10 a
    margin-right: 10px !important
    margin-bottom: 10px !important
    display: inline-block !important
    vertical-align: middle !important
    padding: 0 0px !important
    width: 23% !important
    text-align: -webkit-center !important
    height: 100% !important

.partners__wrapper .foogallery-default
  &.spacing-width-10 a
    margin: 10px !important
    display: inline-block !important
    vertical-align: middle !important
    padding: 0 10px !important
    width: 16% !important
    text-align: -webkit-center !important
    margin: 0 auto !important
    height: 80px !important
  img
    max-width: 100%
    float: none !important
    margin-top: 0px !important
    margin-right: 0px !important
    width: auto !important
    margin-bottom: 0px !important
    margin-left: 0px !important

.butik_description a
  text-decoration: none
  color: #000
  text-transform: uppercase
  font-size: 23px

.action__item
  background-position: center center
  background-size: cover
  background-repeat: no-repeat
  text-align: center
  margin: 25px 50px
  padding: 30px 60px
  border-radius: 6px

.action__propose
  background: #330f2b
  color: #fff
  padding: 0px
  font-size: 28px

.action__descr
  background: #330f2b
  padding: 2px
  min-height: 30px
  margin: 15px 0
  color: #fff
  font-size: 16px

.action-1
  background-image: url("../img/action/cartoon-1.jpg")

.action-2
  background-image: url("../img/action/cartoon-2.jpg")

.action-3
  background-image: url("../img/action/cartoon-3.jpg")

.action-4
  background-image: url("../img/action/cartoon-4.jpg")

.button__more
  background-color: #5d4042
  border: 1px solid #ee8007
  padding: 5px 15px
  border-radius: 2px

.butik__nav
  float: right
  margin-top: 10px
  margin-right: 45px

.butik__nav--bottom
  margin-top: 0px

.butik__nav
  .nav__item
    display: inline-block

  .nav__link
    display: block
    padding: 0 14px
    font-size: 22px
    color: #000
    text-decoration: none

  .nav__item--active a
    background-color: #e0e0e0
    border-radius: 10em
    display: block
    text-align: center

.wp-pagenavi
  font-size: 16px
  a
    padding: 0 14px
    font-size: 22px
    color: #000
    text-decoration: none

  span.current
    background-color: #e0e0e0
    border-radius: 10em
    padding: 6px 14px 8px
    text-align: center
    font-size: 22px
    vertical-align: top

.discount
  position: absolute
  top: 0
  right: 15%
  width: 65px
  height: 65px
  background-image: url("../img/butik/discount.png")
  background-size: cover
  background-position: center center
  background-repeat: no-repeat
  line-height: 65px
  font-size: 25px
  color: #fff
  font-family: "Candara-Bold", sans-serif;

.hit-sales
  position: absolute
  top: 0
  right: 15%
  width: 65px
  height: 65px
  img
    max-width: 100%
    height: auto

.butik__wallpaper
  position: relative
  min-height: 210px;
  /* display: table; */
  position: relative;

.butik__present
  position: relative
  padding: 10px 0 0
  margin: 0 30px

.butik__item
  text-align: center
  padding: 0 5px
  width: 25%
  display: inline-block
  vertical-align: top
  font-size: 17px


  @media screen and (max-width: 480px)
    width: 100%

.butik__price
  color: #ee8007
  font-size: 32px
  margin-top: 5px

.butik__more a
  color: #302f2f
  text-decoration: none

#container2
  display: table
  width: 96%
  margin: 0px 2%

.magazine .butik__item
  padding: 30px 5px 10px
  height: 100% !important
  clear: both
  vertical-align: top
  display: inline-block

  @media screen and (max-width: 768px)
    clear: inherit
    display: block

.item-name
  font-size: 29px

.tovar-preview
  background-image: url("../img/tovar-bg.jpg")
  background-size: cover
  background-position: center center
  background-repeat: no-repeat
  padding: 40px
  position: relative
  margin: 30px

  .tovar-number
    position: absolute
    top: 0
    right: 0
    background-color: #ee8007
    color: #fff
    font-size: 18px
    padding: 15px 30px

  .hit-sales
    margin-top: 30px
    margin-right: -20px

  .discount
    text-align: center
    margin-right: -20px
    margin-top: 110px

.big-tovar__wallpaper
  position: relative
  padding: 85px
  display: inline-block
  background-color: #fff
  float: left
  width: 50%
  @media screen and (max-width: 1640px)
    position: relative;
    padding: 40px 0px;
    display: inline-block;
    background-color: #fff;
    float: left;
    width: 50%;
    text-align: center;
    margin-right: 20px;  


  @media screen and (max-width: 768px)
    width: 100%
    margin-top: 18px
    padding: 20px 0px
    background: none

.tovar-description
  float: right
  width: 50%
  padding: 30px 30px 0
  @media screen and (max-width: 1640px)
    float: none
    width: 100%
    padding: 30px 0px 0


  @media screen and (max-width: 768px)
    padding-top: 0px

  .tovar-price
    color: #ee8007
    font-size: 45px
    margin-top: 10px
    @media screen and (max-width: 1640px)
      text-align: right


.tovar-name
  font-size: 23px
  a
    color: #ee8007
  strong
    font-family: "Candara-Bold", sans-serif;

.tovar-class
  margin-top: 20px
  font-size: 22px
  strong
    font-family: "Candara-Bold", sans-serif;

.tovar-category
  font-size: 20px
  margin-top: 20px
  strong
    font-family: "Candara-Bold", sans-serif;

.tovar-about
  font-size: 18px
  margin-top: 20px

.same-tovars
  text-align: center
  display: block
  text-transform: uppercase
  font-family: "Candara-Bold", sans-serif;
  font-size: 18px
  margin-bottom: 25px
  position: relative
  border-top: 1px solid #777

  @media screen and (max-width: 768px)
    margin-bottom: 40px

  span
    position: absolute
    margin-top: -15px
    left: 50%
    -webkit-transform: translateX(-50%)
    -ms-transform: translateX(-50%)
    transform: translateX(-50%)
    background-color: #fff
    display: inline-block
    padding: 0 15px

    @media screen and (max-width: 768px)
      position: absolute
      margin-top: -12px
      left: 50%
      width: 65%
      -webkit-transform: translateX(-50%)
      -ms-transform: translateX(-50%)
      transform: translateX(-50%)
      background-color: #fff
      display: inline-block
      padding: 0 15px


div#fancybox-title-inside
  color: #333333
  font-size: 20px
  font-weight: 600

.tablepress .odd td
  background-color: #f9f9f9;

.tablepress .even td
  background-color: #fff;

table
  &#tablepress-7 td.column-1
    width: 250px
    @media screen and (max-width: 1680px)
      width: 180px

    @media screen and (max-width: 768px)
      width: 100px


table#tablepress-7 td
  width: auto;

table#tablepress-6 td
  width: auto
  text-align: left
  &.column-2
    vertical-align: top!important
  @media screen and (max-width: 768px)
    display: inline-block
    width: 100% !important

table#tablepress-6 td.column-1
  width: 250px;
  @media screen and (max-width: 1680px)
    width: 180px

  &#tablepress-6 td

    &.column-1
      width: 30%

    &.column-2
      width: 70%
      text-align: left
      vertical-align: top !important
      line-height: 1.3

      img
        float: none
        display: inline-block
        width: 30%
        vertical-align: top
        margin-top: 10px
        margin-right: 10px
        border: 6px solid #664042


table.tablepress img 
  margin-left: 0px




table.tablepress
  @media screen and (max-width: 320px)
    width: 100%
    font-size: 16px
    margin-top: 0px
  td 
    @media screen and (max-width: 320px)
      font-size: 16px
  thead th 
    @media screen and (max-width: 320px)
      padding: 9px 20px 7px
      font-weight: 400
      color: #fff
      text-align: center
      background: #fff
      background-image: url('../img/upper.jpg')
      background-repeat: repeat-x
      font-weight: 700
      vertical-align: middle
  border: 1px solid #ddd
  tr td a 
    @media screen and (max-width: 320px)
      color: #664042
      cursor: pointer
      font-weight: 600
      text-decoration: underline
      
    &:hover
      @media screen and (max-width: 320px)
        color: #FF9500

  td .colspan 
    @media screen and (max-width: 320px)
      background-image: url('../img/upper.jpg')
      background-repeat: repeat-x
      color: #FFF
      text-align: center
      padding: 9px 20px 7px
      font-weight: 600
      text-transform: uppercase
      margin: -5px -20px


.tablepress tbody td 
  @media screen and (max-width: 320px)
    border: 1px solid #ddd

table.tablepress td
  @media screen and (max-width: 320px)
    text-align: center
    vertical-align: middle !important
    padding: 5px 20px



  &.column-1
    @media screen and (max-width: 320px)
      color: #664042
      font-weight: 700
      text-align: left    

table.tablepress td
  @media screen and (max-width: 768px)
    padding: 5px 5px !important

table
  @media screen and (max-width: 768px)
    &#tablepress-3
      margin-left: -12px

table
  @media screen and (max-width: 768px)
    // &#tablepress-1 td.column-4, &#tablepress-2 td.column-4, &#tablepress-3 td.column-5
    //   display: none
    &.tablepress
      td
        padding: 5px
        font-size: 12px
        width: inherit

        .colspan
          background-image: url(../img/upper.jpg)
          background-repeat: repeat-x
          color: #FFF
          text-align: center
          padding: 10px 0px
          font-weight: 600
          text-transform: uppercase
          margin: -5px -5px

      thead th
        padding: 2%
        font-size: 12px
        font-weight: 400
        color: #fff
        text-align: center
        background: #fff
        background-image: url(../img/upper.jpg)
        background-repeat: repeat-x
        font-weight: 700
        vertical-align: middle


.otziv-clients
  color: #fb8835;
  font-family: "Akzidenz-Grotesk Pro";
  font-size: 30px;
  font-weight: 400;
  line-height: 28px;
  text-transform: uppercase;
  text-align: center
  margin-top: 50px
  margin-bottom: 15px


.otziv-all .strong-view.default
  
  img
    background: none repeat scroll 0 0 #fff !important;
    border: 1px solid #efefef !important;
    padding: 6px !important;
    margin: 0 auto !important;
    width: auto !important;
    height: 150px !important;
    float: left !important;
    margin-right: 8%!important;

  .testimonial-image
    max-width: 180px!important;
    float: left;
    /* display: inline-block; */
    margin-top: 13px;
    margin-right: 1em;
    margin-bottom: .25em;


  .testimonial
    margin: 0 auto 30px!important;
    padding: 0!important;
    text-align: left!important;
    width: 100%!important;
    display: inline-block!important;
    vertical-align: top!important;
    margin-right: 2%!important;
    border: 1px solid #e6e6e6!important;
    max-height: 240px;
    overflow: hidden;

    @media screen and (max-width: 1350px)
      margin: 0px auto 30px !important
      padding: 0 !important
      text-align: left !important
      width: 100% !important
      display: inline-block !important
      vertical-align: top !important
      margin-right: 2% !important
      border: 1px solid #E6E6E6 !important

    @media screen and (max-width: 768px)
      max-height: 100%

.strong-view.default .testimonial-content p:last-of-type
  @media screen and (max-width: 768px)
    padding-bottom: 0px;

.simplePagerList
  margin: 20px auto
  text-align: center
  clear: both !important

.simplePagerContainer
  img
    float: none
    height: inherit
    max-width: inherit
    width: 100% !important
  ul li
    background: none
    margin: 0px
    padding: 0px
    overflow: inherit
    position: relative
    left: 0
    display: block

    &:before
      display: none


.strong-view.default .testimonial-client 
  margin-top: 0em !important;
  text-align: right !important;
  position: absolute !important;
  right: 10px !important;
  bottom: 5px !important;

  @media screen and (max-width: 768px)
    position: relative!important
    margin-top: 15px !important

.testimonial-content-p
  margin-left: 0;
  /* width: 70%; */
  /* display: inline-block; */
  vertical-align: top;
  padding-top: 20px;

  @media screen and (max-width: 1640px)
    margin-left: 0;
    vertical-align: top;
    /* margin-top: 20px; */
  

.testimonial-success
  p
    font-size: 22px
    padding: 10px 0px 8px
    color: #fff
  text-align: center
  background: #64d684

.strong-view.default .testimonial-inner
  border: none !important
  padding: 20px
  text-align: left
  background-image: url(../img/main-bg.jpg)
  background-size: 100%
  background-position: center top
  background-repeat: no-repeat

.otziv-all
  .strong-view.default .testimonial-inner
    background-repeat: repeat !important
    max-height: 225px;
    overflow: hidden;
    position: relative;

    @media screen and (max-width: 768px)
      height: auto
      max-height: 100%
      padding-bottom: 10px

  h3
    font-size: 22px !important

.strong-view ul.simplePagerNav li a
  margin: 0 0.2em
  padding: 0.1em 0.3em
  outline: none
  text-decoration: none
  font-size: 25px
  transition: background 0.2s ease
  padding: 8px 15px !important

  @media screen and (max-width: 768px)
    display: inline-block !important
    list-style: none
    margin: 0
    padding: 0 

/*навигация отзывы */

.otziv-all .strong-view
  ul.page-numbers li
    display: inline
    list-style: none
    margin: 0
    padding: 0
    background: none !important

    a
      margin: 0 0.2em
      padding: 0.1em 0.3em
      outline: none
      text-decoration: none
      font-size: 25px
      transition: background 0.2s ease
      padding: 8px 15px !important

    span.current
      background: #999
      color: #FFF
      font-size: 25px
      padding: 8px 15px !important
      margin: 0 0.2em

    &:before
      display: none

  &.default img
    background: none repeat scroll 0 0 #FFFFFF
    border: 1px solid #EFEFEF
    padding: 6px
    margin: 0 auto
    width: 100%
    float: left
    margin-right: 2% !important



.otziv-right
  background-size: 100%
  background-position: center top
  background-repeat: repeat
  font-size: 16px
  // height: 266px
  // overflow: hidden

// .testimonial_wrapper
//   height: 204px

//   @media screen and (max-width: 1640px) 
//     height: 173px

.otziv-right-text
  text-align: center
  font-size: 20px
  padding-bottom: 15px
  margin-top: 6px
  span
    font-size: 26px
  a
    color: #ee8007

.strong-form
  width: 600px !important
  
  @media screen and (max-width: 768px)
    width: 100% !important

  input
    &[type="text"], &[type="email"], &[type="url"], &[type="file"]
      box-sizing: border-box
      display: block
      float: none
      width: 100%
      padding: 10px !important

  select, textarea
    box-sizing: border-box
    display: block
    float: none
    width: 100%
    padding: 10px !important

.tab
  cursor: pointer
  padding: 4px 10px

.tabs
  margin-left: 40px
  color: #000
  display: block
  text-decoration: none
  display: block
  background-color: #efefef
  margin: 20px 40px 15px
  font-family: "Candara-Bold", sans-serif;
  font-size: 25px

.active_central
  background-color: none;
  font-weight: 600
  color: #6b3d31;
  font-size: 18px
  &:hover
    color: #6b3d31

.active
  background-color: #6b3d31;
  color: #fff;
  &:hover
    color: #fff
  ul
    text-align: left
    li
      display: inline-block
      text-transform: uppercase
      a
        color: #000
        display: block
        text-decoration: none
        padding: 2px 10px


.block-item-price1
  width: 100%;


.block-item-price2
  width: 100%;


.block-item-price3
  width: 100%;


.block-item-price4
  width: 100%;
 


.category_box
  font-size: 34px;
  text-align: center;
  margin-top: 40px;

img.attachment-shop_catalog.size-shop_catalog.wp-post-image
  width: auto;
  max-width: 100%;
  /* max-height: 100%; */
  /* height: auto; */
  /* min-height: 250px; */
  vertical-align: middle;
  display: block;
  /* position: absolute; */
  /* top: 10%; */
  /* bottom: -3%; */
  position: absolute;
  margin: auto;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  max-height: 100%;




.gallery
  margin: 0 35px

.gallery__item
  width: 50%
  float: left
  padding: 5px

  @media screen and (max-width: 480px)
    width: 100%

  .gallery__subitem
    width: 50%
    float: left
    &:nth-child(odd)
      padding-right: 5px
    &:nth-child(even)
      padding-left: 5px
  img
    max-width: 100%
    height: auto

.contacts
  margin: 0 40px


  @media screen and (max-width: 768px)
    margin: 0 10px 10px;
    margin-top: 40px;
    overflow: hidden;

.contacts__title
  font-size: 26px
  color: #ee8007
  position: relative



  @media screen and (max-width: 768px)
    float: none
    margin-top: 0px
    font-size: 26px
    color: #ee8007
    position: relative
    text-align: center

  .working-time
    float: right
    font-size: 17px
    color: #414040
    margin-top: -48px



    @media screen and (max-width: 768px)
      float: none
      margin-top: 0px

  strong
    font-family: "Candara-Bold", sans-serif;
    font-size: 37px
    color: #000

.contact-address
  width: 70%
  float: left
  font-family: "Candara-Bold", sans-serif;
  color: #242424
  font-size: 20px
  padding-left: 40px


  &:before
    width: 35px;
    height: 45px;
    background: url(../img/css_sprite.png) -523px -100px;
    content: "";
    position: absolute;
    margin-left: -45px;
    margin-top: 7px;

  @media screen and (max-width: 1640px)
    width: 100%
    float: none
    font-family: "Candara-Bold", sans-serif;
    color: #242424
    font-size: 20px
    padding-left: 40px


  @media screen and (max-width: 768px)
    width: 100%

.contacts-phones
  width: 30%
  float: right
  font-family: "Candara-Bold", sans-serif;
  color: #242424
  font-size: 22px
  padding-left: 50px
  background-image: url("../img/phone.png")
  background-position: left center
  background-repeat: no-repeat

  &:before
    width: 43px;
    height: 43px;
    background: url(../img/css_sprite.png) -458px -295px;
    display: inline-block;
    vertical-align: middle;
    margin-right: -5px;
    content: "";
    position: absolute;
    margin: 10px -50px;
  
  @media screen and (max-width: 1640px)
    border-top: 1px solid #ccc
    width: 100%
    float: none
    height: 70px
    font-family: "Candara-Bold", sans-serif;
    color: #242424
    font-size: 22px
    padding-left: 50px
    background-image: url(../img/phone.png)
    background-position: left center
    background-repeat: no-repeat
    vertical-align: middle
    display: table

  @media screen and (max-width: 768px)
    width: 100%

.contacts-subtitle
  color: #ee8007
  font-size: 21px
  font-family: "Candara-Bold", sans-serif;
  margin-top: 20px

.contacts-method
  font-size: 18px
  font-family: "Candara-Bold", sans-serif;
  margin-top: 15px

.method-description
  font-size: 18px
  margin-top: 5px

.method-descripton
  font-size: 16px

.contacts-map
  margin: 20px 0px


  img
    max-width: 100%

.prices
  margin: 0 0px

  @media screen and (max-width: 768px)
    margin: 0px 0px 0px


.price-item
  width: 45%;
  padding: 0;
  margin-right: 20px;
  display: inline-block;
  margin-bottom: 20px

  @media screen and (max-width: 768px)
    padding: 0;
    margin-bottom: 10px;
    width: 48%;
    margin: 0% 1% 15px;

  @media screen and (max-width: 480px)
    width: 100%

  img
    max-width: 100%
    height: auto
    float: none !important
    margin: 0px !important
    width: auto !important
    &:hover
      -webkit-transform: scale(1.2);
      -ms-transform: scale(1.2);
      transform: scale(0.9);
      z-index: 999;
      position: relative;
      -webkit-transition: all 0.3s ease;
      -moz-transition: all 0.3s ease;
      -o-transition: all 0.3s ease;
      transition: all 0.3s ease;

.partners__prices
  margin-top: 600px

  @media screen and (max-width: 768px)
    margin-top: 30px

.partners__uslugy
  margin-top: 300px

  @media screen and (max-width: 768px)
    margin-top: 30px

.prices__title
  display: block
  margin: 20px 0 30px
  text-align: center
  text-transform: uppercase
  font-family: "Candara-Bold", sans-serif;
  font-size: 22px

.prices__subtitle
  text-align: center
  text-transform: uppercase
  font-size: 16px
  margin-top: -15px

.table-subtitle
  background-image: url("../img/upper.jpg")
  text-align: center
  color: #fff
  font-family: "Candara-Bold", sans-serif;
  font-size: 20px
  padding: 5px 0

table
  width: 80%
  margin: 20px auto

  @media screen and (max-width: 480px)
    width: 425px

  td
    border: 1px solid #dddddd
    text-align: center
    padding: 5px 5px
    color: #664042
    font-size: 18px
    vertical-align: middle

.row:nth-child(even)
  background-color: #f9f9f9

.table__link
  color: #664042
  font-family: "Cardana-Bold", sans-serif;
  -webkit-transition: all .3s ease
  -o-transition: all .3s ease
  transition: all .3s ease

  &:hover
    color: #ee8007

.name-service
  text-align: left
  padding-left: 20px
  width: 50%
  font-family: "Candara-Bold", sans-serif;

.time-service, .cost-service
  width: 10%

.link-service
  width: 30%

.services-desript
  font-size: 18px
  margin: 0 30px 30px

  @media screen and (max-width: 768px)
    display: none

  p
    margin-top: 25px

.akciya-wrapper
  font-size: 0px

.akciya-desc img
  display: none

// .akciya-desc h1
//   display: none

.akciya-desc p
  overflow: hidden
  margin: 0px
  display: block
  text-align: left !important;

.akciya-desc p strong
  font-weight: 400

.akciya-desc p+p+p 
  display: none

  @media screen and (max-width: 768px)
    overflow: hidden
    height: auto

.akciya li
  background: none !important
  left: 0px !important
  display: inline-block !important
  vertical-align: top
  overflow: hidden
  margin-right: 2% !important
  margin-bottom: 2% !important
  width: 49%
  border: 1px solid #ccc
  padding: 0px !important;
  padding-bottom: 10px !important


  @media screen and (max-width: 768px)
    width: 100%
    margin: 10px auto !important
    border: none
    border-bottom: 3px solid #ccc
    height: auto

  &:nth-child(2n)
    background: none !important
    left: 0px !important
    display: inline-block !important
    vertical-align: top
    overflow: hidden
    margin-right: 0% !important
    margin-bottom: 2% !important
    width: 49%
    border: 1px solid #ccc
    padding-bottom: 10px !important



    @media screen and (max-width: 768px)
      width: 100%
      border: none
      border-bottom: 3px solid #ccc

  &:nth-child(2n)
    @media screen and (max-width: 1400px)
      margin-right: 0% !important

  &:before
    display: none !important

  &:nth-child(2),  &:nth-child(8), &:nth-child(11)
    margin-right: 0% !important


.ssilka
  text-align: center;
  padding: 10px 10px 7px;
  background: #ee8007;
  font-size: 20px;
  color: #fff;
  display: table;
  margin: 0 auto;

  a 
    color: #fff
    text-decoration: none


.akciya-img

  @media screen and (max-width: 768px)
    background-size: cover !important

  img
    width: 100% !important
    float: none !important
    margin-top: 0px !important
    margin-bottom: 0px
    margin-left: 0px !important

.akciya-desc
  overflow: hidden
  margin-bottom: 8px
  color: #8a8a8a
  padding: 0px 20px
  line-height: 1.5
  font-size: 15px !important
  display: table-cell

  .ssilka
    display: none


  h2
    position: relative
    color: #1f1f1f
    font-size: 26px
    margin: 0px 0 10px
    padding: 14px 0 0
    overflow: hidden
    vertical-align: middle
    text-align: center

    a
      display: block
      border: 0px !important
      font-size: 20px !important
      line-height: 30px
      /* color: #1670b5 !important;*/
      text-decoration: none !important
      margin-bottom: 8px
      /*height: 66px;*/
      vertical-align: middle
      display: table-cell
      text-transform: uppercase
      color: #ee8007;
      font-family: Akzidenz-Grotesk Pro;

      @media screen and (max-width: 768px)
        height: auto


    &:before
      background: none

.full-akciya
  text-align: center

  img
    max-width: 100%
    height: auto
    float: none !important;
    margin-top: 10px !important;
    width: auto !important;
    margin-bottom: 10px !important;
    margin-left: 0px !important;
    text-align: center


.full-akciya-content
  img
    max-width: 100%
    height: auto
    float: none !important;
    margin-top: 0px !important;
    width: auto !important;
    margin-bottom: 0px !important;
    margin-left: 0px !important;
    text-align: center


.display-uslugi .active
  background: none !important;

.display-mobile
  display: none

  @media screen and (max-width: 768px)
    display: block

  .active
    @media screen and (max-width: 768px)
      background: none !important;  

.tab.vertical
  border-top: none
  >
    dd
      background: #fff
      display: none
      width: 100%
      z-index: 2
      margin: 0
      border: 1px solid #AAA

      ul li
        display: block !important

        a
          font-size: 18px
          text-decoration: underline

          

      > div.tab-content
        padding: 5px 10px

    dt
      padding: 5px 0px
      cursor: pointer

      @media screen and (max-width: 768px)
        width: 100%
        display: inline-block
        margin-right: 0%
        margin-left: 0%
        border-bottom: 3px solid #ee8007
        padding-bottom: 0px
        opacity: 1

      &:hover
        @media screen and (max-width: 768px)
          opacity: 0.8

      &.active
        + dd
          display: block
          margin-top: -5px
        z-index: 3
        cursor: auto
  margin-bottom: 20px
  zoom: 1
  width: 100%

.display-uslugi
  .tab.vertical > dd
    ul
      li
        a
          font-size: 16px
          color: #000
          padding-left: 15px
        padding: .4em 0em .4em 1em
      width: 96%
      margin: 2% 2.5%
      font-size: 15px
      @media screen and (max-width: 768px)
        width: 100%
      li ul 
        margin: 0px
        width: 99%
        background: none
        li 
          margin: 0px 0 10px 0px;
          width: 100%;
          background: #fff;
    background: #fff
    width: 99%
    z-index: 2
    margin: 0
    border: 1px solid #AAA
    margin-top: -6px
    border-top: 0px
    margin-left: 0.5%
    float: left

    @media screen and (max-width: 768px)
      font-size: 14px
      color: #000
      left: 0
      width: 100%
      margin: 2% 0%
      font-size: 15px
      background: #fff
      width: 99%
      z-index: 2
      margin: 0
      border: 1px solid #AAA
      margin-top: -6px
      border-top: 0px
      margin-left: 0.5%
      float: left

  .tab-content > ul li:before
    display: none
  .tab.vertical
    > dt
      width: 49%
      display: inline-block
      margin-right: 0.5%
      margin-left: 0.5%
      border-bottom: 7px solid #ee8007
      padding-bottom: 0px
      opacity: 1
      @media screen and (max-width: 768px)
        width: 99%
        border-bottom: 3px solid #ee8007

      &:hover
        opacity: 0.8

      &:nth-child(2n)
        margin-right: 0px
    padding: 4px 0px
    font-size: 0px
    margin-bottom: 0px
    margin-top: 15px
    @media screen and (max-width: 768px)
      margin-top: 0px


.footer
  background-image: url("../img/footer-bg.jpg")
  background-size: cover
  background-position: center center
  background-repeat: no-repeat
  padding: 50px 0 10px
  @media screen and (max-width: 768px)
    order: 10;

.footer__nav
  float: left
  width: 25%
  padding: 0 15px

  @media screen and (max-width: 768px)
    width: 50%

  li
    border-bottom: 1px solid #777
    text-align: center




  ul#menu-nizhnee-menyu-levoe li:before nth-child
    background-image: url(/wp-content/themes/fifa/img/footer-icon/home.png)
    width: 16px
    height: 20px

  a
    color: #fff
    font-size: 16px
    text-decoration: none
    display: inline-block
    padding: 10px 0 8px

    img
      vertical-align: middle


ul.left-colomn1 
  li:before
    content: ''
    position: absolute;
    margin: 12px -20px;

  li:nth-child(1):before
    width: 16px; height: 20px;
    background: url('../img/css_sprite.png') -523px -145px;
  li:nth-child(2):before
    width: 17px; height: 12px;
    background: url('../img/css_sprite.png') -501px -325px;
    margin: 14px -20px;
  li:nth-child(3):before
    width: 17px; height: 15px;
    background: url('../img/css_sprite.png') -539px -145px;
  li:nth-child(4):before
    width: 16px; height: 15px;
    background: url('../img/css_sprite.png') -531px -295px;

ul.left-colomn2 
  li:before
    width: 16px
    height: 20px
    content: ''
    position: absolute;
    margin: 12px -20px;

  li:nth-child(1):before
    width: 16px; height: 14px;
    background: url('../img/css_sprite.png') -474px -338px;
  li:nth-child(2):before
    width: 16px; height: 14px;
    background: url('../img/css_sprite.png') -458px -338px;
  li:nth-child(3):before
    width: 16px; height: 14px;
    background: url('../img/css_sprite.png') -531px -310px;


.footer-contacts
  float: left
  width: 34%
  text-align: center
  font-size: 18px

  @media screen and (max-width: 768px)
    width: 100%
    margin-top: 20px

.contact__title
  color: #fff
  margin-top: 3px

.footer-phone, .footer-address
  color: #ee8007
  text-decoration: none
  -webkit-transition: all .3s ease
  -o-transition: all .3s ease
  transition: all .3s ease

.footer-phone:hover, .footer-address:hover
  color: #fab161

.contact__item
  color: #ee8007

.footer-social
  text-align: center
  width: 16%
  float: left

  @media screen and (max-width: 768px)
    width: 100%

  a
    padding: 5px 3px

  .social__title
    color: #fff
    font-size: 18px
    padding-bottom: 5px

.bottom-footer
  text-align: center
  font-size: 18px
  margin-top: 30px
  color: #b1b1b1
  padding-bottom: 10px

  a
    white-space: nowrap
    color: #fff
    text-decoration: none
    padding-left: 10px
    font-family: "Candara-Bold", sans-serif;
    font-size: 20px


table.tablepress 
    width: 100%;
    font-size: 16px;
    margin-top: 0;
    border: 1px solid #ddd;



table.tablepress td 
    text-align: center;
    vertical-align: middle!important;
    padding: 5px 20px;


.tablepress tbody td
    border: 1px solid #ddd;


table.tablepress td 
    font-size: 16px;


table.tablepress thead th 
    padding: 9px 20px 7px;
    font-weight: 400;
    color: #fff;
    text-align: center;
    background: #fff;
    background-image: url(../img/upper.jpg);
    background-repeat: repeat-x;
    font-weight: 700;
    vertical-align: middle;

table.tablepress td.column-1 
    color: #664042;
    font-weight: 700;
    text-align: left;

table.tablepress td .colspan
    background-image: url(../img/upper.jpg);
    background-repeat: repeat-x;
    color: #fff;
    text-align: center;
    padding: 9px 20px 7px;
    font-weight: 600;
    text-transform: uppercase;
    margin: -5px -20px;
    a 
      color: #fff

    @media screen and (max-width: 768px) 
      margin: -5px -5px;
      background-repeat: repeat;




table.tablepress tr td a 
    color: #664042;
    cursor: pointer;
    font-weight: 600;
    text-decoration: underline;

.vremennoe-logo
  background-image: url(/wp-content/uploads/2017/06/наклейки-6-9мм.jpg)
  width: 180px
  height: 130px
  border: 1px solid #E6E6E6;
  background-size: contain;






// Не работаем в определенный день

// .super-content
//   background: #fe8726;
//   color: #fff;
//   font-size: 34px;
//   text-align: center;
//   position: absolute
//   top: 0
//   width: 100%
//   @media screen and (max-width: 768px)
//     top: auto
//     position: relative

//   @media screen and (max-width: 768px)
//     font-size: 16px
    

// .header
//   margin-top: 54px
//   @media screen and (max-width: 768px)
//     margin-top: 0px



  //.......................... Новый год ........................//


// .lenta__wrapper
//   background-image: url(../img/ng/gar.png);
//   width: 100%;
//   height: 77px;
//   position: absolute;
//   background-position: 0px -22px;
//   background-size: 550px;

.main-navigation-left-knopka
  background: url(../img/ng/xMelamine-wood-002.png);
  @media screen and (max-width: 768px)
    background: none

.top-line__information
  background: url(../img/ng/xMelamine-wood-002.png);
  @media screen and (max-width: 768px) 
    order: 3

.top-line-location 
  z-index: 50;
  position: relative;
  text-shadow: 1px 2px #000;

.top-line__logo
    font-size: 22px;
    display: inline-block;
    vertical-align: top;
    text-align: right;
    position: relative;

.main-content
  position: relative

.procedure2
  z-index: 1;

.procedure
   z-index: 1;

.salon-description 
    z-index: 2;
    position: relative;

.procedure h1 
  text-shadow: 1px 1px 0px #777;

// галлерея мастеров

.gallery_masters_wrapper
  display: flex
  flex-wrap: wrap

.masters_block_wrapper
  margin: 0 40px
  font-size: 32px
  position: relative;


.gallery_masters_all
  width: 31.33%;
  margin-right: 3%;
  margin-bottom: 20px
  &:nth-child(3n)
    margin-right: 0
.gallery_masters_all_thumb
  text-align: center
  position: relative
  line-height: 0
  a
    font-size: 0
  img
    width: auto
    max-width: 100%
    max-height: 350px
    @media screen and (max-width: 1640px)
      max-height: 260px

.gallery_masters_all
  &:hover> .master_block_kratko
    background: #fcc566;
    background: -moz-linear-gradient(left, #fcc566 0%, #fcc566 100%);
    background: -webkit-linear-gradient(left, #fcc566 0%, #fcc566 100%);
    background: linear-gradient(to right, #fcc566 0%, #fcc566 100%);
    border: 3px solid #895438;
    border-bottom: 0;
    border-top: 0;
    z-index: 9;
    position: relative;
    margin-bottom: -3px;
    padding: 10px 10px 10px;
    .master_block_name
      color: #fff
      font-size: 0.7em

.gallery_masters_all
  &:hover> .colio-content 
    display: block;
    background: #fff;
    left: 0;
    width: 100%;
    z-index: 7;
    font-size: 28px;
    border: 3px solid #895438;
    padding: 20px 25px 0px;
    color: #895438;
    overflow: hidden
    &:before
      position: absolute;
      content: "";
      bottom: -136px;
      right: 0;
      width: 100%;
      z-index: 1;
      height: 50%;
      max-height: 270px;
      background: #f67f4b;
      background: -moz-linear-gradient(left, #f67f4b 0%, #e54937 100%);
      background: -webkit-linear-gradient(left, #f67f4b 0%, #e54937 100%);
      background: linear-gradient(to right, #f67f4b 0%, #e54937 100%);
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f67f4b', endColorstr='#e54937',GradientType=1 );
      -o-transform: skewY(-17deg);
      -ms-transform: skewY(-17deg);
      -moz-transform: skewY(-17deg);
      -webkit-transform: skewY(-17deg);
      transform: skewY(-17deg);
    &:after
      position: absolute;
      content: "";
      top: -135px;
      left: 0;
      width: 100%;
      z-index: 1;
      height: 50%;
      max-height: 270px;
      background: #fcc566;
      -o-transform: skewY(-17deg);
      -ms-transform: skewY(-17deg);
      -moz-transform: skewY(-17deg);
      -webkit-transform: skewY(-17deg);
      transform: skewY(-17deg);

.master_block_id
  display: inline-block
  vertical-align: top
  width: 32%
  margin-right: 2%
  margin-bottom: 20px;
  &:nth-child(3n)
    margin-right: 0px
.master_block_glav_avatar
  position: relative
  text-align: center;
  height: 185px;
  overflow: hidden;
  display: table;
  margin: 0 auto;
  img
    width: auto
    max-height: 190px ;
    max-width: 100%;
    margin: 0 auto;
    vertical-align: middle;
    max-height: 350px;
    text-align: center;
    @media screen and (max-width: 1500px) 
      max-height: 132px
.master_block_krug
  position: absolute;
  width: 61px;
  height: 61px;
  background: rgba(0,0,0,.59);
  border-radius: 30.5px;
  bottom: 17px;
  right: 50%;
  margin-right: -31px;
  @media screen and (max-width: 1500px) 
    width: 45px;
    height: 45px;
    margin-right: -23px;  
.master_block_strelka
  position: absolute
  width: 36px
  height: 36px
  background: url(../img/master-strelka.png);
  background-repeat: no-repeat
  background-position: 0px 0;
  top: 18%;
  left: 19%;
  @media screen and (max-width: 1500px) 
    width: 27px
    height: 27px
    background-size: cover;

.master_block_name
  color: #fe8826;
  font-family: "Akzidenz-Grotesk Pro";
  font-size: 0.9em;
  font-weight: 400;
  text-transform: uppercase;
  text-align: center;
  margin: 0px 0 0px;
  line-height: 1;
  @media screen and (max-width: 1500px) 
    font-size: 0.8em;
.master_block_speciya
  color: #cc2445;
  font-family: "Akzidenz-Grotesk Pro";
  font-size: 0.9em;
  font-weight: 400;
  text-align: center;
  line-height: 0.8;
  text-transform: lowercase
  @media screen and (max-width: 1500px) 
    font-size: 0.7em;


.masters_zakrito
  border: none !important
  background: none !important
  &:after
    display: none;
  &:before
    display: none;


.master_block_kratko
  padding-top: 10px;

.colio-active-item > .master_block_kratko
  background: #fcc566;
  background: -moz-linear-gradient(left, #fcc566 0%, #fcc566 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(left, #fcc566 0%,#fcc566 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right, #fcc566 0%,#fcc566 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  position: relative;
  border: 3px solid #895438;
  border-bottom: 0;
  border-top: 0;
  z-index: 5;
  padding-bottom: 13px;
  .master_block_name
    color: #fff
    padding-top: 5px;
    margin-top: 0px;


//////////////////////////////


.colio
  position: relative;
  height: 0;
  clear: both;
  overflow: hidden;


.colio-container
  padding: 50px 0px 0px;
  height: 100%;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;


.colio-content
  display: none;
  overflow: hidden;
  position: absolute


.colio-close,
.colio-prev,
.colio-next
  outline: none;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  z-index: 5;


.colio-no-prev,
.colio-no-next
  cursor: default;
  opacity: 0.2;


.colio-close
  position: absolute;
  top: 3px;
  right: 20px;
  font-size: 24px;
  /* color: #fff; */
  color: #895438;
  font-family: Akzidenz-Grotesk Pro;


.colio-navigation
  position: absolute;
  top: 3px;
  left: 26px;
  z-index: 5;
  font-size: 18px;
  font-size: 24px;
  /* color: #fff; */
  color: #895438;
  font-family: Akzidenz-Grotesk Pro;


.colio-navigation a
  margin-right: 20px;
  font-size: 24px;
  /* color: #fff; */
  color: #895438;
  font-family: Akzidenz-Grotesk Pro;  



.colio-placement-inside,
.colio-placement-before
  margin-bottom: 20px;


.colio-placement-after
  margin-top: 20px;
  margin-bottom: 20px;











// .master_block_wrapper_hidden_content
//   width: 100%;
//   left: 0;
//   background: #fff;
//   z-index: 2;
//   font-size: 28px;
//   border: 3px solid #895438;
//   padding: 0px 25px 12px;
//   color: #895438;
//   &:after
//     position: absolute;
//     content: "";
//     top: 0;
//     left: 0;
//     width: 100%;
//     z-index: 1;
//     height: 382px;
//     background: #fcc566; /* Old browsers */
//     background: -moz-linear-gradient(left, #fcc566 0%, #fca45b 100%); /* FF3.6-15 */
//     background: -webkit-linear-gradient(left, #fcc566 0%,#fca45b 100%); /* Chrome10-25,Safari5.1-6 */
//     background: linear-gradient(to right, #fcc566 0%,#fca45b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
//     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcc566', endColorstr='#fca45b',GradientType=1 ); /* IE6-9 */
//   &:before
//     position: absolute;
//     content: "";
//     bottom: 0;
//     right: 0;
//     width: 100%;
//     z-index: 1;
//     height: 382px;
//     background: #f67f4b; /* Old browsers */
//     background: -moz-linear-gradient(left, #f67f4b 0%, #e54937 100%); /* FF3.6-15 */
//     background: -webkit-linear-gradient(left, #f67f4b 0%,#e54937 100%); /* Chrome10-25,Safari5.1-6 */
//     background: linear-gradient(to right, #f67f4b 0%,#e54937 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
//     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f67f4b', endColorstr='#e54937',GradientType=1 ); /* IE6-9 */


.master_block_zagolovok
  color: #895438;
  font-family: Candara-Regular;
  font-size: 24px;
  font-weight: 700;
  text-transform: uppercase;
  z-index: 7;
  position: relative;
  @media screen and (max-width: 800px)
    font-size: 16px; 
.master_block_text
  color: #895438;
  font-family: "Akzidenz-Grotesk Pro";
  font-size: 21px;
  font-weight: 400;
  z-index: 7;
  position: relative;
  @media screen and (max-width: 800px)
    font-size: 18px; 

.master_block_sertificat_table_block
  width: 19%;
  vertical-align: top;
  display: inline-block;
  margin-top: 10px;
  margin-right: 1%;
  border: 3px solid #664042;
  overflow: hidden;
  max-height: 106px;
  min-height: 106px;
  text-align: center;
  @media screen and (max-width: 1600px)
    max-height: 78px;
    min-height: 74px;
  @media screen and (max-width: 800px)
    width: 48%;
    margin-right: 2%;

.master_block_sertificat_table
  font-size: 0;
  margin-bottom: 10px;
  z-index: 4;
  position: relative;
  img
    max-width: 100%;


.master_block_wrapper_hidden_content
    font-size: 28px;
    z-index: 5;
    position: relative;


.master_block_wrapper_hidden_content > .colio
  margin-top: -29px;

.colio
  background: #fff;
  z-index: 1;

  font-size: 28px;
  border: 3px solid #895438;
  padding: 0px 25px 12px;
  color: #895438;
  &:after
    position: absolute;
    content: "";
    top: -135px;
    left: 0;
    width: 100%;
    z-index: 1;
    height: 50%;
    max-height: 270px;
    background: #fcc566; /* Old browsers */
    // background: -moz-linear-gradient(left, #fcc566 0%, #fca45b 100%); /* FF3.6-15 */
    // background: -webkit-linear-gradient(left, #fcc566 0%,#fca45b 100%); /* Chrome10-25,Safari5.1-6 */
    // background: linear-gradient(to right, #fcc566 0%,#fca45b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    // filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcc566', endColorstr='#fca45b',GradientType=1 ); /* IE6-9 */
    -o-transform: skewY(-17deg);
    -ms-transform: skewY(-17deg);
    -moz-transform: skewY(-17deg);
    -webkit-transform: skewY(-17deg);
    transform: skewY(-17deg);
  &:before
    position: absolute;
    content: "";
    bottom: -136px;
    right: 0;
    width: 100%;
    z-index: 1;
    height: 50%;
    max-height: 270px;
    background: #f67f4b; /* Old browsers */
    background: -moz-linear-gradient(left, #f67f4b 0%, #e54937 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #f67f4b 0%,#e54937 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, #f67f4b 0%,#e54937 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f67f4b', endColorstr='#e54937',GradientType=1 ); /* IE6-9 */
    -o-transform: skewY(-17deg);
    -ms-transform: skewY(-17deg);
    -moz-transform: skewY(-17deg);
    -webkit-transform: skewY(-17deg);
    transform: skewY(-17deg);

  @media screen and (max-width: 800px)
    width: 90% !important;
    left: 5% !important;
    right: 5% !important;

/* скрываем чекбоксы и блоки с содержанием */

.hide 
  display: none; 

.hide + label ~ div
  display: none;

/* оформляем текст label */
// .hide + label 
//   border-bottom: 1px dotted green;
//   padding: 0;
//   color: green;
//   cursor: pointer;
//   display: inline-block; 

/* вид текста label при активном переключателе */
.hide:checked ~ label > div
  font-size: 50px !important;

/* когда чекбокс активен показываем блоки с содержанием  */
.hide:checked + div +div
  display: block; 

.hide:checked ~ .master_block_kratko
  background: #ccc ;

  // background: #efefef;
  // -moz-box-shadow: inset 3px 3px 10px #7d8e8f;
  // -webkit-box-shadow: inset 3px 3px 10px #7d8e8f;
  // box-shadow: inset 3px 3px 10px #7d8e8f;
  // padding: 10px; 



  //.......................... Страница услуг новая ........................//

.pagesnew_wrapper
  font-size: 18px
  position: relative;
  padding: 0 40px;
  z-index: 1;
  @media screen and (max-width: 800px)
    padding: 0 10px;


.pagesnew_h2
  position: relative;
  color: #1f1f1f;
  font-size: 36px;
  margin: 25px 0 10px;
  padding: 14px 0 0;
  font-family: Akzidenz-Grotesk Pro;
  &:before
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 165px;
    height: 10px;
    background-color: #ee8007;
  @media screen and (max-width: 800px)
    position: relative;
    color: #1f1f1f;
    font-size: 27px;
    margin: 25px 0 10px;
    padding: 14px 0 0;
    line-height: initial 

.pagesnew_h2_price
  position: relative;
  color: #ee8007;
  font-size: 42px;
  margin: 0px 0 10px;
  padding: 0px 0 0;
  font-family: Akzidenz-Grotesk Pro;
  text-decoration: underline;
  font-weight: 400
  text-align: center
  a
    color: #ee8007;
  @media screen and (max-width: 1640px)
    font-size: 30px
    text-align: center

.pagesnew_h1
  font-size: 35px;
  color: #f08400;
  margin: 20px 0 10px;
  font-family: Akzidenz-Grotesk Pro;
  text-transform: uppercase;
  text-shadow: 1px 1px 0px #777;
  @media screen and (max-width: 800px)
    margin: 15px 0 0px
.pagesnew_gallary_wrapper
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  flex-wrap: wrap;

.pagesnew_gallary_block
  img
    width: 100%
  a 
    padding: 10px;
    display: block;
    padding-bottom: 0px
    padding-top: 10px

.slick_slider_gallary_top
  display: none !important

.slick_slider_gallary_bottom
  position: absolute;
  height: 77px;
  background: rgba(255, 255, 255, 0.5);
  border: none;
  width: 100%;
  bottom: 0px;
  cursor: pointer;

  &:before
    left: 50%;
    top: 50%;
    margin-top: -30.5px;
    margin-left: -27.5px;
    font-size: 54px;
    content: "";
    text-indent: 0;
    position: absolute;
    box-sizing: border-box;
    background: url(../img/uslugi/strn.png) center center no-repeat;
    position: absolute;
    z-index: 99;
    width: 54px;
    height: 55px;
    cursor: pointer;
    border: none;

  @media screen and (max-width: 800px)
    height: 60px;
    &:before
      margin-top: -22.5px;
      margin-left: -21.5px;
      width: 43px;
      height: 39px;
      background-size: contain;

.pagesnew_slider_master_wrapper
.pagesnew_slider_master_block
  padding: 10px 10px
.pagesnew_slider_master_block_wrap
  padding: 10px 0px
  background: #ececec
  display: flex
  @media screen and (max-width: 800px)
    flex-wrap: wrap
.pagesnew_slider_master_block_left
  width: 45%
  @media screen and (max-width: 800px)
    width: 100%
    order: 6
.pagesnew_slider_master_name
    padding: 4px 25px 2px;
    margin: 20px 0px 5px;
    color: #f08400;
    text-align: center;
    font-size: 26px;
    font-family: Akzidenz-Grotesk Pro;
    text-transform: uppercase
    line-height: 1.3;
    @media screen and (max-width: 1640px)
      padding: 4px 10px 2px
      font-size: 20px
    @media screen and (max-width: 800px)
      margin-top: 0px
.pagesnew_slider_master_prof
  color: #d40544
  font-size: 28px
  text-align: center
  font-family: Akzidenz-Grotesk Pro;
  line-height: 1.1;
  @media screen and (max-width: 1640px)
    font-size: 20px
  @media screen and (max-width: 800px)
    padding: 0px 15px
.pagesnew_slider_master_block_right
  width: 55%
  @media screen and (max-width: 800px)
    width: 100%
    order: 4
.pagesnew_slider_master_block_img
  width: 200px
  height: 200px
  margin-top: -30px
  margin-bottom: 15px
  box-shadow: 8px 9px 11px #b9b9b9;
  img
    width: 100%
  @media screen and (max-width: 1640px)
    width: 100%
    height: auto
    box-shadow: 4px 9px 12px #b9b9b9;

.slick_slider_master_left
    left: -11px;
    top: 50%;
    margin-top: -32.5px
    font-size: 54px;
    content: "";
    text-indent: 0;
    position: absolute;
    box-sizing: border-box;
    background: url(../img/uslugi/strl.png) center center no-repeat;
    position: absolute;
    z-index: 99;
    width: 21px;
    height: 65px;
    cursor: pointer;
    border: none

.slick_slider_master_right
    right: -11px;
    top: 50%;
    margin-top: -32.5px
    font-size: 54px;
    content: "";
    text-indent: 0;
    position: absolute;
    box-sizing: border-box;
    background: url(../img/uslugi/strr.png) center center no-repeat;
    position: absolute;
    z-index: 99;
    width: 21px;
    height: 65px;
    cursor: pointer;
    border: none

.tabs
.tabs__caption
.tabs__content
.active


.pagesnew_tabs
  max-width: 100%;
  margin: 19px 0 30px;
  font-size: 20px;
.pagesnew_tabs__caption
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  list-style: none;
  position: relative;
  margin: -1px 0 0 -1px;
  justify-content: space-between;
  li 
    padding: 4px 22px 2px;
    margin: 1px 0 0 1px;
    color: #f08400;
    text-decoration: underline;
    position: relative;
    text-align: center;
    font-size: 1.2em;
    font-family: Akzidenz-Grotesk Pro;
    width: auto;
    @media screen and (max-width: 1640px)
      font-size: 22px
    @media screen and (max-width: 800px)
      &:last-child
        width: 100%
    &.pagesnew_active
      color: #f08400;
      border: none;
      background: #ececec;
      text-decoration: none;
.pagesnew_tabs__content
  display: none;
  background: #FFF;
  border: 7px solid #ececec;
  padding: 15px 20px;
  @media screen and (max-width: 800px)
    padding: 15px 0px

.pagesnew_active
  display: block;


.pagesnew_content_text
  font-size: 22px
  font-family: Akzidenz-Grotesk Pro;
  line-height: 1.2;
  font-weight: 400
  color: #121111
  a
    color: #f08400;
    text-decoration: none
.pagesnew_content_text_center
  font-size: 22px
  font-family: Akzidenz-Grotesk Pro;
  text-align: center;
  line-height: 1.2;
  font-weight: 400
  color: #121111
  margin-top: 30px
  a
    color: #f08400;
    text-decoration: none


.pagesnew_content_poxozh_uslugi
  display: flex;
  flex-wrap: wrap
  margin-bottom: 20px
  margin-top: 40px
  @media screen and (max-width: 800px)
    margin-top: 30px
  a
    width: 23.5%;
    margin-right: 2%;
    text-decoration: none;
    &:last-child
      margin-right: 0px
    @media screen and (max-width: 800px)
      width: 46.5%
      margin-right: 6%;
      margin-bottom: 15px
      &:last-child
        margin-right: 0px
      &:nth-child(2n)
        margin-right: 0px
.pagesnew_content_usluga
  width: 100%
  height: 200px
  line-height: 200px
  background-size: cover
  &:hover
    opacity: 0.8
  @media screen and (max-width: 1640px)
    height: auto
    background-size: cover
    line-height: 150px

.pagesnew_content_usluga_text
  text-align: center;
  color: #000;
  text-transform: uppercase;
  font-size: 20px;
  font-family: Akzidenz-Grotesk Pro;
  padding: 0px 10px;
  background: rgba(255,255,255, 0.7);
  line-height: 35px;
  vertical-align: middle;
  display: inline-block;
  width: 100%;
  @media screen and (max-width: 1640px)
    font-size: 20px
.pagesnew_magazin_wrapper
  display: flex;
  flex-wrap: wrap
  margin-bottom: 20px;

.pagesnew_magazin_tovar
  width: 23.5%;
  margin-right: 2%;
  &:last-child
    margin-right: 0;
  a
    color: #000
    font-size: 0px
  @media screen and (max-width: 800px)
    width: 46.5%
    margin-right: 7%;
    &:last-child
      margin-right: 0;
    &:nth-child(2n)
      margin-right: 0;
.pagesnew_magazin_tovar_img
  box-shadow: 8px 9px 11px #b9b9b9;
  margin-bottom: 10px;
  width: 200px;
  height: 200px;
  overflow: hidden;
  @media screen and (max-width: 1640px)
    width: 100%
    height: auto
  img
    width: 100%;
    height: 100%;
    @media screen and (max-width: 1640px)
      min-height: 100%
.pagesnew_magazin_name
  text-align: center;
  color: #000;
  text-transform: uppercase;
  font-size: 18px;
  font-family: Akzidenz-Grotesk Pro;
  padding: 0px 5px;
  @media screen and (max-width: 800px)
    margin-bottom: 10px


ul.pagesnew_tabs_preimuchestva
  li
    background: #fff;
    min-height: 110px;
    line-height: 100px;
    padding: 15px 20px;
    display: flex;
    &:nth-child(2n)
      background: #efefef
.pagesnew_tabs_preimuchestva_img
  width: 20%;
  /* height: 100%; */
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
.pagesnew_tabs_preimuchestva_text
  font-size: 22px;
  font-family: Akzidenz-Grotesk Pro;
  line-height: 1.2;
  font-weight: 400;
  color: #121111;
  width: 72%;
  margin-left: 8%;
  display: table
  height: 80px;
  span
    color: #d40544;

.pagesnew_tabs_preimuchestva_text_table
  display: table-cell
  vertical-align: middle




// ////////////////// доп


.fancybox-bg 
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: hsla(0,0%,20%,.8) !important;
  opacity: 0;
  transition-timing-function: cubic-bezier(.55,.06,.68,.19) !important;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;



.fancybox-caption-wrap 
  padding: 90px 30px 30px!important;
  background: linear-gradient(180deg,transparent,rgba(0,0,0,.1) 20%,rgba(0,0,0,.2) 40%,rgba(0,0,0,.6) 80%,rgba(0,0,0,.8))!important;



.fancybox-caption 
  padding: 60px 0;
  border-top: none!important;
  text-align: center!important;
  font-size: 35px!important;
  text-shadow: 1px 3px 5px #000!important; 



  //.......................... День рождение 2018 Gatsby........................//



// .logo-header
//   background: url(../img/den_krasoti_2018/logo_text.png) 0 0;
//   background-repeat: no-repeat;
//   background-position: center;
//   @media screen and (max-width: 800px)
//     background-size: contain;
//     background-position: 0px 42%;
// .top-line__logo
//   background: url(../img/den_krasoti_2018/verh_ugol.jpg);
//   background-size: inherit;
//   background-repeat: no-repeat;
//   background-position: 0 -59px;
// .header-lozung
//   color: #fff
// .vremya
//   color: #fff
// .top-line__information
//   background: url(../img/den_krasoti_2018/fon_spravo.png),url(../img/ng/xMelamine-wood-002.png);
//   background-repeat: no-repeat, repeat;
//   background-size: contain;
// .main-navigation-left-knopka
//   background: url(../img/den_krasoti_2018/online_zapis.jpg);
//   background-size: contain;
//   background-repeat: no-repeat;

//   margin: 0 auto;
//   width: 263px;
//   height: 70px;
//   background-color: #6b3d31;
//   color: #fff;
//   font-family: "Akzidenz-Grotesk Pro";
//   font-size: 28px;
//   font-weight: 400;
//   line-height: 59px;
//   text-transform: uppercase;
//   text-align: left;
//   box-sizing: border-box;
//   margin-top: 5px;
//   padding-left: 0;
//   text-decoration: none;

// .tab.vertical > dt.active + dd
//   @media screen and (max-width: 800px)
//     background: url(../img/den_krasoti_2018/confeti_fon.png);
//     background-size: auto;
//     background-repeat: no-repeat;

//   div
//     font-size: 0
//     &:after
//       display: none

// .main-navigation-left-knopka
//   div
//     font-size: 0
//     &:after
//       display: none
// .active
//   position: relative
//   &:after
//     position: absolute;
//     content: '';
//     width: 70px;
//     height: 22px;
//     bottom: 0;
//     left: 50%;
//     margin-left: -35px;
//     background: url(../img/den_krasoti_2018/machine.png);
//     background-size: contain;
//     background-repeat: no-repeat;

// .service__solyari
//   background: url(../img/den_krasoti_2018/fon_servici.jpg);
//   background-size: auto;
//   background-repeat: no-repeat;
//   text-shadow: 2px 0 2px #000

// .service__cosmetology
//   background: url(../img/den_krasoti_2018/fon_servici.jpg);
//   background-size: auto;
//   background-repeat: no-repeat;
//   text-shadow: 2px 0 2px #000
// .service__tonsorial
//   background: url(../img/den_krasoti_2018/fon_servici.jpg);
//   background-size: auto;
//   background-repeat: no-repeat;
//   text-shadow: 2px 0 2px #000
// .service__nail
//   background: url(../img/den_krasoti_2018/fon_servici.jpg);
//   background-size: auto;
//   background-repeat: no-repeat;
//   text-shadow: 2px 0 2px #000

// .service__item
//   background: url(../img/den_krasoti_2018/confeti_fon.png);
//   background-size: auto;
//   background-repeat: no-repeat;

// .service__link 
//   font-size: 23px; 


  //.......................... День рождение ........................//


// .action
//   border-top: 0px

// .tp-bannertimer
//   display: none

// .lenta__wrapper
//   background-image: url(../img/dr/lenta.png);
//   width: 100%
//   height: 8px


// .header-shariki-left
//   position: absolute
//   background-image: url(../img/dr/shariki.png);
//   width: 178px
//   height: 125px
//   top: -27px;
//   left: -24px;
//   z-index: 3

//   @media screen and (max-width: 768px)
//     display: none

// .header-shariki-right
//   position: absolute
//   background-image: url(../img/dr/shariki.png);
//   width: 178px
//   height: 125px
//   top: -27px;
//   right: -24px;
//   transform: scale(-1, 1)

//   @media screen and (max-width: 768px)
//     z-index: 10
//     top: -30px


// .header-denr
//   position: absolute
//   background-image: url(../img/dr/denr.png);
//   width: 402px
//   height: 79px
//   margin-left: -201px;
//   left: 50%

//   @media screen and (max-width: 768px)
//     width: 100%
//     margin-left: 0px
//     left: 0%



// .konfeti
//   position: absolute
//   background-image: url(../img/dr/konfeti3.png);
//   background-size: cover;
//   top: 0px;
//   left: 0%;
//   width: 100%;
//   height: 100%;

// .konfeti-morkov
//     background-image: url(../img/dr/konfeti3.png);
//     background-size: cover;
//     z-index: 2;
//     position: absolute
//     top: 0px;
//     left: 0%;
//     width: 100%;
//     height: 100%;

// .konfeti-shariki
//   position: absolute
//   background-image: url(../img/dr/shariki.png);
//   width: 178px
//   height: 125px
//   z-index: 10
//   top: -36px;
//   left: -38px;

// .perevyazka
//   position: absolute
//   background-image: url(../img/dr/perevyazka.png);
//   width: 111px
//   height: 134px
//   z-index: 10
//   top: 0px;
//   left: 51%;

//   @media screen and (max-width: 1640px)
//     left: 50%
//   @media screen and (max-width: 768px)
//     display: none


// .dr-konfeti
//   position: relative;
//   z-index: 5;


// .dr-konfeti-prazdnik
//   position: relative;
//   z-index: 5;

//   &:after
//     content: ''
//     position: absolute
//     width: 93px
//     height: 104px
//     z-index: 10;
//     background-image: url(../img/dr/xlopushka.png);
//     transform: scale(-1, 1)
//     margin-left: -15px;
//     top: -31px;


//   &:before
//     content: ''
//     position: absolute
//     width: 93px
//     height: 104px
//     z-index: 10;
//     background-image: url(../img/dr/xlopushka.png);
//     margin-left: -75px;
//     top: -31px;

// .service__item
//   position: relative
//   z-index: 2

// .service__cosmetology
//   z-index: 1

// .service__title
//   position: relative;

// .main-navigation-right
//   position: relative

// .top-line__foto
//   position: relative

// .display-mobile
//   @media screen and (max-width: 768px)
//     overflow: hidden

// .top-line-wrapper
//   @media screen and (max-width: 768px)
//     overflow: hidden