body, html {
	font-size:12px;
	font-family: "Google Sans", sans-serif;
	margin:0;
	padding:0;
	color:#000;
    height: 100%;
    min-width:1060px;
    
    background:url(i/background.jpg?v=3) center bottom;
    /*background:url(i/background-a.jpg?v=3) center center;*/
    background-size:cover;
    background-attachment: fixed;
}

html * {max-height:1000000px;}

a img { border:none; }

a { color:#3083bf; }

a:hover { text-decoration:none; }

.clr { clear:both; }

.under { text-decoration:underline; }

a span.under:hover { text-decoration:none; }

.nounder { text-decoration:none; }

.left { float:left; }

.right { float:right }

.wide { width:100%; }

.hide { display:none; }

.block { display:block; }

input[type='submit']::-moz-focus-inner{padding:0 0 0 0;border:0}

.grow-rotate {
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    display: inline-block;
    transform: translateZ(0px);
    -webkit-transform: translateZ(0);
    transition-duration: 0.3s;
    -webkit-transition-duration: 0.3s;
    transition-property: transform;
    -webkit-transition-property: transform;
}
.grow-rotate:hover {
    transform: scale(1.1) rotate(0deg);
    -webkit-transform: scale(1.1) rotate(0deg);
}

.rel(@zindex:50;@left:0;@top:0) {
    position:relative;
    z-index:@zindex;
    left: ~"@{left}px";
    top: ~"@{top}px";
}

.abs(@zindex:50;@left:0;@top:0) {
    position:absolute;
    z-index:@zindex;
    left: ~"@{left}px";
    top: ~"@{top}px";
}

.ipreload {
    position:absolute;
    left:-999px;
    top:-999px;
    opacity:0.01;
}

.trns {
    transition: all 0.15s ease-in;
}

input.input-error {
    background:#ffaaaa !important;
    border:1px solid #e59090 !important;
}

/* system-message begin */

#system-message
{
	background:#F88;
	margin-left:0;

	padding-right:20px;
	margin-top:0;

	-moz-box-shadow: 0px 0px 5px #888;
	-webkit-box-shadow: 0px 0px 5px #888;
	box-shadow: 0px 0px 5px #888;
}


#system-message dt
{
	color:#000;
	display:none;
}

#system-message dd
{
	margin-left:0px;
}

#system-message li
{
	list-style-type:none;
}

#system-message li
{
	margin-left:0;
	padding-left:0;
}

/* system-message end */

#wrapper-ext {
    width:1037px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    background:rgba(49,43,77,0.8);
    margin:0 auto;
    padding-bottom:35px;
    padding-top:56px;
    
    .rel(30;0;0);
}

#wrapper-int {
    width:961px;
    margin:0 auto;
    background:white;
    min-height:700px;
    border-radius: 10px;
}

#main-menu {
    .abs(35;56;14);

    a {
        color:white;
        font-size:17px;
        text-decoration: none;
        display:block;
        margin-right:25px;
        float:left;
        transition: all 0.1s ease-in;
        padding:2px 8px 3px 8px;
    }
    
    .common-link:hover {
        opacity:0.8;
    }
    
    .common-link.active {
        background:rgba(240,240,255,0.2);
        border-radius:4px;
        
        &:hover {opacity:1;}
    }
    
    .hamburger {
        .rel(45;0;0);
        padding-left:27px;
        background:url(i/ham.png) left 7px no-repeat;
    }
    
    .hamburger-hovered {
        background:url(i/hamblack.png) left 7px no-repeat;
        color:black;
    }
    
    .hoveroff {
        .rel(50;0;0);
    }
    
    .pricelist {
        color:#19d3a8;
        background:url(i/priceicon.png) left 2px no-repeat;
        padding-left:25px;
    }
    
    .second-level-menu {
        .abs(40;-27;-15);
        display:none;
        width:270px;
        height:542px;
        background:url(i/services.png) no-repeat;
        background-size: 100% 100%;
        padding-top:72px;
        font-size:12px;
        
        a {
            color:#00906f;
            float:none;
            margin-left:20px;
            font-size:16px;
            margin-top:3px;
            margin-bottom:10px;
            line-height:20px;
            text-decoration: underline;
            text-decoration-color:rgba(0,144,111,0.25);
            text-underline-offset:3px;

            &:hover {
                text-decoration-color:rgba(0,144,111,0);
            }            
        }
    }
    
    
}

#hat {
    height:90px;
    width:961px;
    .rel(32;0;0);

    .messengers {
        position: absolute;
        z-index: 50;
        left: 718px;
        top: 24px;
    }
    
    .logo {
        .abs(40;19;19);
        width:183px;
        height:50px;
        background:url(i/logo.svg) no-repeat;
        transform:translateY(0px);
        .trns;

        &:hover {
            transform:translateY(-2px);
        }
    }
    
    .decor-line {
        .abs(40;213;29);
        width:1px;
        height:31px;
        background:#c4c4c4;
    }
    
    .descr {
        .abs(40;225;36);
        font-size:12px;
        font-weight:bold;
        text-transform:uppercase;
        color:#a9a9a9;
        letter-spacing:1px;
    }
    
    .phone {
        font-size:21px;
        font-weight:bold;
        .abs(40;529;30);
        text-decoration: none;
        color:black;
    }
    
    .address {
        .abs(40;652;34);
        font-size:13px;
        color:#a9a9a9;
    }
    
    .order-link {
        position:absolute;
        z-index:40;
        right:-16px;
        top:26px;
        background:url(i/ribbon.png) no-repeat;
        transition:all 0.2s ease-in;
        width:112px;
        height:39px;
        display:block;
        color:white;
        font-size:16px;
        text-decoration:none;
        padding-left:26px;
        padding-top:7px;
        
        span {
            border-bottom:1px solid rgba(255,255,255,.3);
            line-height:16px;
            display:inline-block;
        }
        
        &:hover {
            background:url(i/ribbon_h.png);
        }
    }
}

.video-page {
    video {
        max-height: 60vh;
        background: #888;

    }
}

#video-news {
    width:961px;
    background:#f1f1f1;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    padding-bottom:35px;
    padding-top: 12px;
    
    .news-gradient-ext {
        width:1px; height:1px;
        position:relative;
    }
    .news-gradient {
        height:92px;
        width:518px;
        background:url(i/gradient.png) left bottom repeat-x;
        position:absolute;
        top:-92px;
        opacity:0.8;
    }
    
    h2 {
        font-size:24px;
        font-weight:400;
        margin-top:12px;
        margin-bottom:17px;
        text-align:left;
    }
    
    .video {
        float:left;
        margin-left:18px;
        width:372px;
        padding-right:35px;
        text-align:center;
    }
    
    .news {
        float:left;
        width:518px;
        text-align:center;
        
        ul {
            margin:-1px 0 0 0;
            padding:0;

        }
        
        li {
            display:block;
            width:466px;
            border:1px solid #d9d9d9;
            background:white;
            padding-left:19px;
            padding-right:31px;
            padding-top:13px;
            padding-bottom:23px;
            margin-bottom:9px;
            font-size:14px;
            line-height:17px;
            text-align:left;
            
            p {margin:0;}
        }
        
        .mod-articles-category-title  {
            font-size:19px;
            color:#00906f;
            line-height:24px;
            text-decoration: underline;
            text-decoration-color:rgba(0,144,111,0.25);
            text-underline-offset:3px;

            &:hover {
                text-decoration: none;
            }            
        }
        
        .mod-articles-category-date {
            color:#a3a3a3;
            font-size:16px;
            display: block;
            margin-top: 6px;
            margin-bottom: 9px;
        }
        
        .mod-articles-category-introtext {
            margin-top:6px;
        }
        
        .mod-articles-category-introtext-link {
            text-decoration:none;
            color:black;
        }
    }
    
    .see-all {
        text-align:center;
        font-size:16px;
        color:#00906f;
        margin-top:16px;
        display:inline-block;
        
        span {
            border-bottom:1px solid #b2e1d0;
            display:inline-block;
            line-height:15px;
        }
    }
    .news .see-all {
        margin-top:6px;
    }
}

#footer {
    height:76px;
    width:961px;
    margin:34px auto 0 auto;
    color:white;
    .rel(40);
    
    .messengers {
        position: absolute;
        z-index: 50;
        left: 191px;
        top: -9px;
        width: 120px;
    }

    .copyright {
        .abs(45;0;0);
        font-size:15px;
    }
    
    .contacts {
        .abs(45;278;0);
        font-size:14px;
        line-height:20px;
        
        .phone {
            font-size:21px;
            font-weight:700;
            color:white;
            text-decoration: none;
        }
    }
    
    .metrika {
        position:absolute;
        z-index:45;
        right:0;
        top:5px;
    }
    
    .share {
        .abs(45;502;-3);
        font-size:14px;
        
        .share42init {
            margin-top:6px;
        }
    }
}

.fancybox-wrap .form {
    width:450px;
    padding-bottom:15px;
    
    .form-heading {
        font-size:22px;
        color:#43338b;
        margin-top:0;
        text-align:center;
        margin-bottom:19px;
        font-family:Arial;
    }
    
    .form-description {
        text-align:center;
        font-size:14px;
        line-height:19px;
        margin-top:0;
        margin-bottom:20px;
        color:#666;
    }
    
    .form-label {
        clear:both;
        float:left;
        width:150px;
        text-align:right;
        padding-right:10px;
        line-height:22px;
        padding-left:20px;
        font-size:13px;
    }
    
    textarea {
        max-width:195px;
        min-width:195px;
        width:195px;
        margin-bottom:15px;
        padding:4px 5px;
        
        &:focus {
            box-shadow:0 0 10px -1px lightsteelblue;
        }
        
        min-height:100px;
        height:120px;
        max-height:130px;
    }
    
    input[type='file'] {
        width:215px;
        position:relative;
        top:5px;
        margin-bottom:10px;
    }
    
    input[type='text'], select {
        width:165px;
        margin-bottom:15px;
        padding:4px 5px;
        
        &:focus {
            box-shadow:0 0 10px -1px lightsteelblue;
        }
    }
    
    select { width:167px; }

    .redstar { color:crimson; }
    
    input[type='submit'] {
        margin-top:4px;
        background:url(i/button149.png);
        width:149px;
        height:34px;
        border:none;
        cursor:pointer;
        font-size:17px;
        font-weight:400;
        clear:both;
        color:white;
        padding-bottom:4px;
        margin-left:179px;
        transition:all 0.2s ease-in;
        font-family: Arial;
        border-radius:4px;
        
        &:hover {background:url(i/button149_h.png);}
    }
}

#tile {
    width:961px;
    height:360px;
    .rel(25);
    
    .controls {
        position:absolute;
        bottom:37px;
        left:267px;
        z-index: 100;
        
        li {
            font-size:0;
            color:transparent;
            width:11px;
            height:11px;
            background:white;
            border-radius:7px;
            float:left;
            margin:2px 13px 2px 2px;
            cursor:pointer;
        }
        
        li.current {
            background:transparent;
            border:2px solid white;
            border-radius:7px;
            margin:0 11px 0 0;
            cursor:default;
        }
    }
    
    .controls .prevBtn, .controls .nextBtn {    
        display:none;
    }
    
    #slider {
        float:left;
        width:706px;
        height:360px;
        .trns;
        opacity: 0;

        &.reveal {
            opacity: 1;
        }
        
        li {
            .rel(30);
        }
        
        .slider-bar {
            .abs(35,138,235);
            display:none;

            .left-part {
                float:left;
                background:url(i/leftpart.png);
                width:15px;
                height:38px;
            }
            .right-part {
                float:left;
                background:url(i/rightpart.png);
                width:13px;
                height:38px;
            }
            .center-part {
                float:left;
                height:38px;
                background:url(i/centerpart.png);
                padding-left:10px;
                padding-right:10px;
                line-height:36px;
                font-size:18px;
                color:white;
            }
        }
    }
    
    .banners {
        float:left;
        width:255px;
        
        .banner1 {
            width:255px;
            height:180px;
            background:url(i/banner1.jpg);
        }
        
        .banner2 {
            width:255px;
            height:180px;
            background:#2baa8d;
            display:block;
            .rel(50);
            transition:all 0.15s ease-in;
            
            &:hover {
                background:#3bba9d;
            }
            
            .banner-heading {
                .abs(55;24;37);
                font-size:16px;
                color:white;
                
                span {
                    border-bottom:1px solid rgba(255,255,255,.3);
                    display:inline-block;
                    line-height:19px;
                }
            }
            .banner-descr {
                .abs(55;24;67);
                font-size:14px;
                line-height:19px;
                color:black;
            }
        }
    }
}

#about-text {
    width:771px;
    padding-top:32px;
    padding-bottom:40px;
    padding-left:95px;
    padding-right:95px;
    .rel(32;0;0);
    
    h1 {
        margin-top:0;
        color:#cbcbcb;
        font-size:24px;
        font-style:italic;
        margin-bottom:-3px;
    }
    p {
        font-size:15px;
        line-height:19px;
    }
    .left-quote {
        .abs(45;54;71);
        
        background:url(i/leftquote.png);
        width:25px;
        height:25px;
    }
    .right-quote {
        position:absolute;
        z-index:45;
        right:54px;
        bottom:71px;
        
        background:url(i/rightquote.png);
        width:25px;
        height:25px;
    }
    
    .more-about-us {
        text-align:center;
        color:#a3a3a3;
        font-size:16px;
    }
    
    a {
        color:#00906f;
        border-bottom:1px solid #b2e1d0;
        text-decoration:none;
        display:inline-block;
        line-height:15px;
    }
    
}

#component {
    min-height:565px;
    padding-top:20px;
    padding-bottom:25px;
    padding-left:18px;
    padding-right:18px;
    width:925px;
    background:#f1f1f1;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;

    .contacts-page {
        .messengers {
            margin-top: -7px;
        }
    }

    a {
        text-decoration: none;
    }
    
    font-size:16px;
    

    .o-nas-logo {
        width: 80%;
        margin-left: 10%;
    }

    .item-page li {
        margin-bottom:4px;
        margin-top:2px;
    }
    
    .item-page > div > ymaps {
        margin-top:20px;
        outline:1px solid gainsboro;
    }
        
    a {color:#00906f;}
    
    .page-header h1, .page-header h2, .blog h2 {
        font-size: 26px;
        font-weight: 400;
        margin-top:0;
        margin-bottom:12px;
    }

    .item-page .styled-ul {
        list-style-type: disc;
        margin-left: 0;
        padding-left: 25px;
        margin-top: -8px;

        li::marker {
            color:#00906f;
        }
        li {
            margin-bottom: 3px;
        }
    }
    
    .breadcrumbs {
        margin-bottom:5px;

        .spacer {
            opacity: 0.4;
        }

        a {
            text-decoration: underline;
            text-decoration-color: rgba(0, 144, 111, 0.25);
            text-underline-offset: 3px;

            &:hover {
                text-decoration: none;
            }
        }
    }
    
    .item-page .article-info {
        
        dd {margin:0;}
        
        dl {margin-top:-5px;}
        
        time {
            color: #a3a3a3;
            font-size: 14px;
        }
        
    }
    .item-page img {
        max-width: 100%;
    }
    
    .items-leading > div {
        width:873px;
        border:1px solid #d9d9d9;
        background:white;
        padding-left:19px;
        padding-right:31px;
        padding-top:16px;
        padding-bottom:23px;
        margin-bottom:9px;
        font-size:16px;
        line-height:17px;
        text-align:left;
        
        h2 a {
            color: #00906f;
            font-size: 19px;
            line-height: 19px;
            text-decoration: underline;
            text-decoration-color:rgba(0,144,111,0.25);
            text-underline-offset:3px;

            &:hover {
                text-decoration: none;
            }

        }
        
        dd {margin:0;}
        dl {
            margin-top:-7px;
            margin-bottom:5px;
        }
        
        time {
            color: #a3a3a3;
            font-size: 14px;
            margin-bottom: 7px;
            display: block;
        }
        
        .introtext-link {
            text-decoration:none;
            color:black;
            
            p {margin:0;}
        }

        b {font-weight: 400;}
    }
    
    h2.subheading {
        font-size: 23px;
        font-weight: 400;
        margin-bottom: -8px;
    }
}

.popup-content {
    width:720px;
    font-size:15px;
    padding:10px 10px 20px 10px;
    
    h2.subheading {
        font-size: 23px;
        font-weight: 400;
        margin-top: 0px;
    }
    
    h2+p {margin-top:-10px;}
}

ymaps.ymaps-copyrights-legend {
    display:none;
}



.ourworks-photos {
    margin-bottom: 30px;
    margin-top: 15px;
}

.ourworks-photos .photo {
    float:left;
    margin-right:4px;
    margin-bottom:5px;
    font-size: 0;

    &:nth-child(3n) {
        margin-right: 0;
    }
    
    img {
        width:296px;
        border-radius:5px;
        margin-top:4px;
        margin-left:4px;
        
        &:hover {
            box-shadow:0 1px 3px -1px rgba(0,0,0,0.7);
        }
    }
    
    .fancybind {
        width:304px;
        height:304px;
        transition:all 0.15s ease-in;
        border-radius:5px;
        position:relative;
        top:-4px;
        left:-4px;
        display:block;

        &:hover {
            background:#6b6884;
        }
    }
}

.topline {
    width: 100%;
    text-align: center;
    background: orange;
    color:black;
    padding-top: 2px;
    padding-bottom: 5px;
    font-size: 16px;

    a {
        color:black;
    }
}

.messengers {
  display: inline-block;
  vertical-align: top;
  font-size: 0;

  .messenger {
    &:not(:last-child) {
      margin-right: -5px;
    }
    transform-origin:center center;
    position: relative;
    z-index: 35;

    img {
      width: 38px;
      border-radius: 50%;
      .trns;
    }
    .trns;

    &.wa {
      filter: ~"saturate(125%)";
    }
    &.tg {
      filter: ~"saturate(115%) hue-rotate(6deg)";
      z-index: 34;
    }
    &.max {
      z-index: 33;
    }
    
    &:hover {
      z-index: 36;
      img {
        transform:scale3d(1.07,1.07,1);
      }
    }
  }
}

.popup-contacts {
    padding-top: 10px;
    .phone {
        font-size: 21px;
        font-weight: bold;
        color:black;
        text-decoration: none;
    }
    + .messengers {
        margin-top: -10px;
        margin-bottom: -10px;
    }
}