// новый вид страницы


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


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

.pagesnew_h2_price
  position: relative
  color: #ee8007
  font-size: 42rem
  margin: 0rem 0 10rem
  padding: 0rem 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: 30rem
    text-align: center

.pagesnew_h1
  font-size: 35rem
  color: #f08400
  margin: 20rem 0 10rem
  font-family: Akzidenz-Grotesk Pro
  text-transform: uppercase
  text-shadow: 1rem 1rem 0rem #777
  @media screen and (max-width: 768px)
    margin: 15rem 0 0rem
.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: 10rem
    display: block
    padding-bottom: 0rem
    padding-top: 10rem

.slick_slider_gallary_top
  display: none !important

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

  &:before
    left: 50%
    top: 50%
    margin-top: -30.5rem
    margin-left: -27.5rem
    font-size: 54rem
    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: 54rem
    height: 55rem
    cursor: pointer
    border: none

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

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

.slick_slider_master_left
    left: -11rem
    top: 50%
    margin-top: -32.5rem
    font-size: 54rem
    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: 21rem
    height: 65rem
    cursor: pointer
    border: none

.slick_slider_master_right
    right: -11rem
    top: 50%
    margin-top: -32.5rem
    font-size: 54rem
    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: 21rem
    height: 65rem
    cursor: pointer
    border: none

.tabs
.tabs__caption
.tabs__content
.active


.pagesnew_tabs
  max-width: 100%
  margin: 19rem 0 30rem
  font-size: 20rem
.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: -1rem 0 0 -1rem
  justify-content: space-between
  li 
    padding: 4rem 22rem 2rem
    margin: 1rem 0 0 1rem
    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: 22rem
    @media screen and (max-width: 768px)
      &:last-child
        width: 100%
    &.pagesnew_active
      color: #f08400
      border: none
      background: #ececec
      text-decoration: none
.pagesnew_tabs__content
  display: none
  background: #FFF
  border: 7rem solid #ececec
  padding: 15rem 20rem
  @media screen and (max-width: 768px)
    padding: 15rem 0rem

.pagesnew_active
  display: block


.pagesnew_content_text
  font-size: 22rem
  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: 22rem
  font-family: Akzidenz-Grotesk Pro
  text-align: center
  line-height: 1.2
  font-weight: 400
  color: #121111
  margin-top: 30rem
  a
    color: #f08400
    text-decoration: none


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

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

.pagesnew_magazin_tovar
  width: 23.5%
  margin-right: 2%
  &:last-child
    margin-right: 0
  a
    color: #000
    font-size: 0rem
  @media screen and (max-width: 768px)
    width: 46.5%
    margin-right: 7%
    &:last-child
      margin-right: 0
    &:nth-child(2n)
      margin-right: 0
.pagesnew_magazin_tovar_img
  box-shadow: 8rem 9rem 11rem #b9b9b9
  margin-bottom: 10rem
  width: 200rem
  height: 200rem
  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: 18rem
  font-family: Akzidenz-Grotesk Pro
  padding: 0rem 5rem
  @media screen and (max-width: 768px)
    margin-bottom: 10rem


ul.pagesnew_tabs_preimuchestva
  li
    background: #fff
    min-height: 110rem
    line-height: 100rem
    padding: 15rem 20rem
    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: 22rem
  font-family: Akzidenz-Grotesk Pro
  line-height: 1.2
  font-weight: 400
  color: #121111
  width: 72%
  margin-left: 8%
  display: table
  height: 80rem
  span
    color: #d40544

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


// вкладка отзывы

.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

.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

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

.testimonial-heading-pages span a 
    color: #f08400

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

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

.testimonial-image-pages 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-p-pages 
    margin-left: 0
    vertical-align: top
    padding-top: 0px
    margin-left: 30px
    width: 70%

.testimonial-content-p-pages p 
    font-size: 17px
    margin-bottom: 10px

.testimonial-client-pages 
    margin-top: 0 !important
    text-align: right !important
    position: absolute !important
    right: 10px !important
    bottom: 5px !important

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

.testimonial-pages-otziv a
    color: #f08400









// старый вид страницы
.procedure
  position: relative
  padding: 0 40rem

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

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

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

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

    @media screen and (max-width: 768px)
      font-size: 33rem
      color: #ee8007
      margin: 10rem 0 10rem
      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: 20rem
    width: 40%
    margin-bottom: 20rem
    margin-left: 20rem


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

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

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

  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 0rem 0rem 3rem
      height: 2em
      width: 2em
      line-height: 2em
      font-size: 15rem
      color: #fff
      background: #FB8835
      border: .2em solid #fff
      -webkit-box-shadow: 0 8rem 5rem -7rem #888
      -moz-box-shadow: 0 8rem 5rem -7rem #888
      box-shadow: 0 8rem 5rem -7rem #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: 8rem 0rem 1rem
    left: -7rem

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

  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 0rem 0rem 3rem
      height: 2em
      width: 2em
      line-height: 2em
      font-size: 15rem
      color: #fff
      background: #FB8835
      border: .2em solid #fff
      -webkit-box-shadow: 0 8rem 5rem -7rem #888
      -moz-box-shadow: 0 8rem 5rem -7rem #888
      box-shadow: 0 8rem 5rem -7rem #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: 36rem
    margin: 25rem 0 10rem
    padding: 14rem 0 0
    font-family: Akzidenz-Grotesk Pro

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

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

    &::before
      content: ''
      position: absolute
      left: 0
      top: 0
      width: 135rem
      height: 6rem
      background-color: #ee8007
// галлерея на странице


.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;






// кнопка перейти в прайс

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

.button__price
    border-radius: 7px