@media all {
    
    html * {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;}
    *,
    *:after,
    *:before {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;}

    
    @font-face {
        font-family: 'BlissPro-LightItalic';
        src: url('../fonts/BlissPro-LightItalic_gdi.eot');
        src: url('../fonts/BlissPro-LightItalic_gdi.eot?#iefix') format('embedded-opentype'),
             url('../fonts/BlissPro-LightItalic_gdi.woff') format('woff'),
             url('../fonts/BlissPro-LightItalic_gdi.ttf') format('truetype'),
             url('../fonts/BlissPro-LightItalic_gdi.svg#BlissPro-LightItalic') format('svg');
        font-weight: 300;
/*        font-style: italic;*/
        font-stretch: normal;
        unicode-range: U+0020-25CA;}
    
    @font-face {
        font-family: 'BlissPro-ExtraBold';
        src: url('../fonts/BlissPro-ExtraBold_gdi.eot');
        src: url('../fonts/BlissPro-ExtraBold_gdi.eot?#iefix') format('embedded-opentype'),
             url('../fonts/BlissPro-ExtraBold_gdi.woff') format('woff'),
             url('../fonts/BlissPro-ExtraBold_gdi.ttf') format('truetype'),
             url('../fonts/BlissPro-ExtraBold_gdi.svg#BlissPro-ExtraBold') format('svg');
        font-weight: 800;
        font-style: normal;
        font-stretch: normal;
        unicode-range: U+0020-25CA;}
    
    @font-face {
        font-family: 'BlissPro-Regular';
        src: url('../fonts/BlissPro_gdi.eot');
        src: url('../fonts/BlissPro_gdi.eot?#iefix') format('embedded-opentype'),
             url('../fonts/BlissPro_gdi.woff') format('woff'),
             url('../fonts/BlissPro_gdi.ttf') format('truetype'),
             url('../fonts/BlissPro_gdi.svg#BlissPro-Regular') format('svg');
        font-weight: 400;
        font-style: normal;
        font-stretch: normal;
        unicode-range: U+0020-25CA;}

    @font-face {
        font-family:'ALSRubl-Regular';
        src: url('../fonts/ALSRubl_gdi.eot');
        src: url('../fonts/ALSRubl_gdi.eot?#iefix') format('embedded-opentype'),
             url('../fonts/ALSRubl_gdi.woff') format('woff'),
             url('../fonts/ALSRubl_gdi.ttf') format('truetype'),
             url('../fonts/ALSRubl_gdi.svg#ALSRubl-Regular') format('svg');
        font-weight: 400;
        font-style: normal;
        font-stretch: normal;
        unicode-range: U+0020-0078;}    

    
/* `Grid >> 24 Columns
----------------------------------------------------------------------------------------------------*/

.ym-wrapper {
    width: 960px;
/*    max-width: 960px;*/
    margin: 0 auto;
    padding: 0 5px;}
    
[class*="ym-push-"],
[class*="ym-pull-"] {position: relative;}
    
.alpha {margin-left: 0 !important;}
.omega {margin-right: 0 !important;}

.marginR {margin-right: 10px;}
    
.ym-g960-1 {width: 30px;}
.ym-g960-2 {width: 70px;}
.ym-g960-3 {width: 110px;}
.ym-g960-4 {width: 150px;}
.ym-g960-5 {width: 190px;}
.ym-g960-6 {width: 230px;}
.ym-g960-7 {width: 270px;}
.ym-g960-8 {width: 310px;}
.ym-g960-9 {width: 350px;}
.ym-g960-10 {width: 390px;}
.ym-g960-11 {width: 430px;}
.ym-g960-12 {width: 470px;}
.ym-g960-13 {width: 510px;}
.ym-g960-14 {width: 550px;}
.ym-g960-15 {width: 590px;}
.ym-g960-16 {width: 630px;}
.ym-g960-17 {width: 670px;}
.ym-g960-18 {width: 710px;}
.ym-g960-19 {width: 750px;}
.ym-g960-20 {width: 790px;}
.ym-g960-21 {width: 830px;}
.ym-g960-22 {width: 870px;}
.ym-g960-23 {width: 910px;}
.ym-g960-24 {width: 950px;}

.ym-push-1 {left: 40px;}
.ym-push-2 {left: 80px;}
.ym-push-3 {left: 120px;}
.ym-push-4 {left: 160px;}
.ym-push-5 {left: 200px;}
.ym-push-6 {left: 240px;}
.ym-push-7 {left: 280px;}
.ym-push-8 {left: 320px;}
.ym-push-9 {left: 360px;}
.ym-push-10 {left: 400px;}
.ym-push-11 {left: 440px;}
.ym-push-12 {left: 480px;}
.ym-push-13 {left: 520px;}
.ym-push-14 {left: 560px;}
.ym-push-15 {left: 600px;}
.ym-push-16 {left: 640px;}
.ym-push-17 {left: 680px;}
.ym-push-18 {left: 720px;}
.ym-push-19 {left: 760px;}
.ym-push-20 {left: 800px;}
.ym-push-21 {left: 840px;}
.ym-push-22 {left: 880px;}
.ym-push-23 {left: 920px;}

.ym-pull-1 {left: -40px;}
.ym-pull-2 {left: -80px;}
.ym-pull-3 {left: -120px;}
.ym-pull-4 {left: -160px;}
.ym-pull-5 {left: -200px;}
.ym-pull-6 {left: -240px;}
.ym-pull-7 {left: -280px;}
.ym-pull-8 {left: -320px;}
.ym-pull-9 {left: -360px;}
.ym-pull-10 {left: -400px;}
.ym-pull-11 {left: -440px;}
.ym-pull-12 {left: -480px;}
.ym-pull-13 {left: -520px;}
.ym-pull-14 {left: -560px;}
.ym-pull-15 {left: -600px;}
.ym-pull-16 {left: -640px;}
.ym-pull-17 {left: -680px;}
.ym-pull-18 {left: -720px;}
.ym-pull-19 {left: -760px;}
.ym-pull-20 {left: -800px;}
.ym-pull-21 {left: -840px;}
.ym-pull-22 {left: -880px;}
.ym-pull-23 {left: -920px;}
    
    .rur {
        font-family: 'ALSRubl-Regular', Arial, Helvetica, sans-serif;
        font-style: normal;}
    
    .materialTypeIco {
        color: #ffffff;
        font-family: 'BlissPro-Regular', Arial, Helvetica, sans-serif;
        font-size: 148%;
        letter-spacing: 0.5px;
        text-align: center;
        width: 30px;
        height: 30px;
        line-height: 29px;
        border-radius: 7%;
        -moz-border-radius: 7%;
        -webkit-border-radius: 7%;}

    .materialTypeIco.Cu {background-color: #ffba5e;}
    .materialTypeIco.Cu:before {content: "Cu";}

    .materialTypeIco.Al {background-color: #5fbce8;}
    .materialTypeIco.Al:before {content: "Al";}

    .materialTypeIco.Zn {background-color: #afca0b;}
    
    .materialTypeIco.Zn:before {
        content: "Zn\00A0+";
        padding-left: 4px;}

    .materialTypeIco.Zn:after {
        content: "Ti";
        display: block;
        margin-top: -29px;
        margin-left: 47px;
        width: 30px;
        height: 30px;
        line-height: 29px;
        background-color: #afca0b;
        border-radius: 7%;
        -moz-border-radius: 7%;
        -webkit-border-radius: 7%;}
    
    
    
/* Верхнее меню
----------------------------------------------------------------------------------------------------*/

    header {
        margin: 0 auto;
        width: 100%;
        background-color: #ffffff;
        z-index: 1000;}
    
    header nav ul {
        margin: 0;
        padding: 0;
        width: 100%;
        display: block;
        list-style: none;}

    header nav li {
        float: left;
        font-size: 160%;
        margin: 7px 40px 0 0;}
    
    header nav li:last-child {margin-right: 0;}
    
    header nav a {
        color: #40b9a5;
        background-color: transparent;
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;}
    
    header nav a:hover,
    header nav a:focus {
        background-color: #40b9a5;
        color: #ffffff;}
    
    header.static {height: 186px;}

    header.static:before {
        height: 8px;
        background: url('../images/bgr_triangle_02.png') repeat-x top center;
        content: "";
        display: block;
        position: relative;
        top: 186px;
        z-index: 1000;}

    header.static .topLogo {margin-top: 10px;}
    
    header.static .topContacts {
        color: #636363;
        margin-top: 57px;}
    
    header.static .phone {
        font-size: 340%;
        font-family: 'BlissPro-ExtraBold', Arial, Helvetica, sans-serif;
        float: left;
        margin-right: 40px;}
    
    header.static .address {
        padding-top: 5px;
        font-size: 120%;
        line-height: 23px;}
    
    header.static .topMotto {
        font-family: 'BlissPro-LightItalic', Arial, Helvetica, sans-serif;
        font-size: 160%;
        color: #ff8300;
        margin: 10px 0 0 10px;}
    
    header.sticky {
/*        z-index: 3000;*/
        position: fixed;
        height: 70px;
        opacity: 0;
        top: -70px;
        padding-top: 7px;
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;}
    
    header.sticky .topLogo img {
        width: 50%;
        height: 50%;}
    
    header.sticky .topMenu {margin-top: 3px;}

    header.sticky.active {
        opacity: 0.95;
        top: 0px;}
    

    
    
/* Главная презентация (слайдер)
----------------------------------------------------------------------------------------------------*/
    
    .mainPresentation {height: 700px;}
    
    .mainPresentation .gallery-cell {
        width: 100%;
        height: 100%;
        margin-right: 50px;
        counter-increment: gallery-cell;
        background-size: cover;
        background-attachment: scroll;
        background-position: center;
        background-repeat: no-repeat;
        background-color: #ff8453;
        padding-top: 100px;}

    .mainPresentation .flickity-prev-next-button {
        width: 75px;
        height: 75px;
        opacity: 0.9;
        background: transparent;
        -webkit-transition: opacity 0.3s;
        -moz-transition: opacity 0.3s;
        -o-transition: opacity 0.3s;
        transition: opacity 0.3s;}

    .mainPresentation .flickity-prev-next-button:hover {opacity: 0.6;}
    .mainPresentation .flickity-prev-next-button .arrow {fill: #ffffff;}
    .mainPresentation .flickity-prev-next-button.no-svg {color: #ffffff;}
    
    .mainPresentation .flickity-page-dots .dot {
        opacity: 0.4;
        background: #003930;}
    
    .mainPresentation .flickity-page-dots .dot.is-selected {
        opacity: 1;
        background: #003930;}
    
    .mainPresentation .gallery-cell.intro {background-image: url('../images/img_main_01.jpg');}
    .mainPresentation .gallery-cell.Cu {background-image: url('../images/img_main_02_cu_3.jpg');}
    .mainPresentation .gallery-cell.Zn {background-image: url('../images/img_main_03_zn.jpg');}
    .mainPresentation .gallery-cell.Al {background-image: url('../images/img_main_04_al.jpg');}
    
    .mainPresentation h1 {
        font-size: 550%;
        text-transform: uppercase;
        font-family: 'BlissPro-ExtraBold', Arial, Helvetica, sans-serif;
        color: #fffde2;
        line-height: 104%;}
    
    .mainPresentation h1 span {
        color: #aa4f29;
        cursor: pointer;
        -webkit-box-shadow: inset 0px -5px 0px 0px #e57446;
        -moz-box-shadow: inset 0px -5px 0px 0px #e57446;
        box-shadow: inset 0px -5px 0px 0px #e57446;
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;}
    
    .mainPresentation h1 span.Cu:hover {
        color: #ffcc72;
        -webkit-box-shadow: inset 0px -5px 0px 0px #ffa054;
        -moz-box-shadow: inset 0px -5px 0px 0px #ffa054;
        box-shadow: inset 0px -5px 0px 0px #ffa054;}
 
    .mainPresentation h1 span.Zn:hover {
        color: #c2d744;
        -webkit-box-shadow: inset 0px -5px 0px 0px #d9b04d;
        -moz-box-shadow: inset 0px -5px 0px 0px #d9b04d;
        box-shadow: inset 0px -5px 0px 0px #d9b04d;}
    
    .mainPresentation h1 span.Al:hover {
        color: #85d0f3;
        -webkit-box-shadow: inset 0px -5px 0px 0px #ceab9f;
        -moz-box-shadow: inset 0px -5px 0px 0px #ceab9f;
        box-shadow: inset 0px -5px 0px 0px #ceab9f;}
    
    .mainPresentation .materialTypeIco {
        width: 50px;
        height: 50px;
        line-height: 48px;
        font-size: 42%;
        text-transform: none;
        position: relative;
        display: inline-block;
        top: -15px;
        left: 10px;}

    .mainPresentation .materialTypeIco.Zn:before {
        content: "Zn\00A0\00A0+";
        padding-left: 7px;}

    .mainPresentation .materialTypeIco.Zn:after {
        margin-top: -48px;
        margin-left: 90px;
        width: 50px;
        height: 50px;
        line-height: 48px;}
    
    .mainPresentation .mainPresDesc {
        padding: 20px;
        margin-bottom: 30px;
        color: #ffffff;}
    
    .mainPresentation .Cu .mainPresDesc {
        background: rgb(255, 186, 94) transparent;
        background: rgba(255, 186, 94, 0.6);
        filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99ffba5e, endColorstr=#99ffba5e);
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99ffba5e, endColorstr=#99ffba5e)";}

    .mainPresentation .Zn .mainPresDesc {
        background: rgb(175, 202, 11) transparent;
        background: rgba(175, 202, 11, 0.6);
        filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99afca0b, endColorstr=#99afca0b);
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99afca0b, endColorstr=#99afca0b)";}

    .mainPresentation .Al .mainPresDesc {
        background: rgb(95, 188, 232) transparent;
        background: rgba(95, 188, 232, 0.6);
        filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#995fbce8, endColorstr=#995fbce8);
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#995fbce8, endColorstr=#995fbce8)";}
    
    .mainPresentation .mainPresDesc p {margin: 0;}
    
    .mainPresentation .mainPresTagline {
        font-family: 'BlissPro-LightItalic', Arial, Helvetica, sans-serif;
        font-size: 220%;
        color: #fffde2;
        text-shadow: 1px 1px 0px rgba(63, 63, 63, 0.7);}
    
    .mainPresentation .intro .mainPresTagline {margin-top: 38px;}
    
    .mainPresentation .Cu .mainPresLogos,
    .mainPresentation .Zn .mainPresLogos {margin-top: -45px;}
    
    .mainPresentation .mainPresLogos {
        margin: 0 0 0 10px;
        padding-left: 10px;
        text-align: center;}

    .mainPresentation .mainPresLogos img {margin-bottom: 15px;}
    
    
    
    
/* Модельный ряд. Статья
----------------------------------------------------------------------------------------------------*/    
    
    .modelArticleWrapper {
        margin: -5px auto 0 auto;
        width: 100%;
/*        min-width: 960px;*/
        min-height: 300px;
        padding-bottom: 20px;
        background: #07937c;
        background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzA2Nzg2NSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwNzkzN2MiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
        background: -moz-linear-gradient(top,  #067865 0%, #07937c 300px);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#067865), color-stop(300px,#07937c));
        background: -webkit-linear-gradient(top,  #067865 0%,#07937c 300px);
        background: -o-linear-gradient(top,  #067865 0%,#07937c 300px);
        background: -ms-linear-gradient(top,  #067865 0%,#07937c 300px);
        background: linear-gradient(to bottom,  #067865 0%,#07937c 300px);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#067865', endColorstr='#07937c',GradientType=0 );}
    
    .modelArticleWrapper .jaggedBorderTop {
        position: absolute;
        width: 100%;
        height: 18px;
        margin-top: -8px;
        z-index: 200;}
    
    .modelArticleWrapper .jaggedBorderTop:after {
        height: 8px;
        background: url('../images/bgr_triangle_01.png') repeat-x bottom center;
        content: "";
        display: block;}
    
    .modelArticleWrapper .jaggedBorderTop span {
        position: absolute;
        display: block;
        top: 8px;
        width: 100%;
        height: 10px;
        background-color: #067865;}
    
    .priceTag {
        position: relative;
        float: right;
/*        clear: both;*/
        width: 174px; 
        height: 105px;
/*        left: 776px;*/
/*        right: -776px;*/
        background-color: #ffd85a;
        margin-top: -54px;
        z-index: 300;}

    .priceTag:before,
    .priceTag:after {
        content: "";
        position: absolute;
        width: 0;
        border-left: 87px solid transparent;
        border-right: 87px solid transparent;}

    .priceTag:before {
        bottom: 100%;
        border-bottom: 50px solid #ffd85a;}

    .priceTag:after {
        top: 100%;
        width: 0;
        border-top: 50px solid #ffd85a;}

    .priceTag .priceText {
        position: absolute;
        top: -10px;
        width: 100%;}
    
    .priceTag .priceText div {
        font-family: 'BlissPro-LightItalic', Arial, Helvetica, sans-serif;
        font-size: 200%;
        line-height: 120%;
        text-align: center;}
    
    .priceTag .priceText .mainPresPrice {
        font-family: 'BlissPro-ExtraBold', Arial, Helvetica, sans-serif;
        font-size: 280%;
        height: 52px;}

    .priceTag .priceText .mainPresPrice b {font-size: 95%; font-weight: 500;}
    
    .modelArticleWrapper h1,
    .advantagesWrapper h1,
    .fotoGalleryWrapper h1,
    .footerWrapper h1 {
        font-size: 450%;
        font-family: 'BlissPro-ExtraBold', Arial, Helvetica, sans-serif;
        color: #c7ffe7;
        line-height: 104%;
        margin-top: 7%;}
    
    .modelArticleWrapper p,
    .advantagesWrapper p {color: #c7ffe7;}
    
    .patinaStages div {float: left; margin-right: 8px;}
    .patinaStages div:last-child {margin-right: 0;}
    
    .patinaStages img {
        border: 3px solid #fff9ec;
        width: 46px;
        height: 46px;}
    
    .patinaStages span {
        display: block;
        text-align: center;
        line-height: 155%;
        color: #093730;
        font-size: 80%;
        font-family: 'BlissPro-ExtraBold', Arial, Helvetica, sans-serif;}
    
    
    
/* Модельный ряд. Область паттерна
----------------------------------------------------------------------------------------------------*/    
    
    .modelWrapper {
        margin: 0 auto;
        width: 100%;
/*        min-width: 960px;*/
        height: 348px;
/*         Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#07937c+0,07937c+13,1d9d85+22,4bb098+35,c8e5cc+64,f2f8de+77,fffde3+83,fffde3+100 */
        background: url('../images/bgr_gallery.png') #1d9d85;
        background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzA3OTM3YyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEzJSIgc3RvcC1jb2xvcj0iIzA3OTM3YyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjIyJSIgc3RvcC1jb2xvcj0iIzFkOWQ4NSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjM1JSIgc3RvcC1jb2xvcj0iIzRiYjA5OCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjY0JSIgc3RvcC1jb2xvcj0iI2M4ZTVjYyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9Ijc3JSIgc3RvcC1jb2xvcj0iI2YyZjhkZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjgzJSIgc3RvcC1jb2xvcj0iI2ZmZmRlMyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmZkZTMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
        background: -moz-linear-gradient(top,  #07937c 0%, #07937c 13%, #1d9d85 22%, #4bb098 35%, #c8e5cc 64%, #f2f8de 77%, #fffde3 83%, #fffde3 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#07937c), color-stop(13%,#07937c), color-stop(22%,#1d9d85), color-stop(35%,#4bb098), color-stop(64%,#c8e5cc), color-stop(77%,#f2f8de), color-stop(83%,#fffde3), color-stop(100%,#fffde3));
        background: -webkit-linear-gradient(top,  #07937c 0%,#07937c 13%,#1d9d85 22%,#4bb098 35%,#c8e5cc 64%,#f2f8de 77%,#fffde3 83%,#fffde3 100%);
        background: -o-linear-gradient(top,  #07937c 0%,#07937c 13%,#1d9d85 22%,#4bb098 35%,#c8e5cc 64%,#f2f8de 77%,#fffde3 83%,#fffde3 100%);
        background: -ms-linear-gradient(top,  #07937c 0%,#07937c 13%,#1d9d85 22%,#4bb098 35%,#c8e5cc 64%,#f2f8de 77%,#fffde3 83%,#fffde3 100%);
        background: linear-gradient(to bottom,  #07937c 0%,#07937c 13%,#1d9d85 22%,#4bb098 35%,#c8e5cc 64%,#f2f8de 77%,#fffde3 83%,#fffde3 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#07937c', endColorstr='#fffde3',GradientType=0 );}
    
    .modelWrapper .ym-wrapper {display: none;}
    
    .modelDetailedDesc {
        position: absolute;
        height: 73px;
        z-index: 100;
        margin-top: 20px;
        border-radius: 8px 8px 0 0;
        -moz-border-radius: 8px 8px 0 0;
        -webkit-border-radius: 8px 8px 0 0;                
        border-top: 1px solid #5ec4ac;
        border-right: 1px solid #5ec4ac;
        border-left: 1px solid #5ec4ac;
/*         Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#07937c+0,09937c+38,1f9e86+79,1e9d85+80,2da48c+100 */
        background: url('../images/bgr_detailed_desc.png') #07937c;
        background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzA3OTM3YyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjM4JSIgc3RvcC1jb2xvcj0iIzA5OTM3YyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9Ijc5JSIgc3RvcC1jb2xvcj0iIzFmOWU4NiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjgwJSIgc3RvcC1jb2xvcj0iIzFlOWQ4NSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMyZGE0OGMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
        background: -moz-linear-gradient(top,  #07937c 0%, #09937c 38%, #1f9e86 79%, #1e9d85 80%, #2da48c 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#07937c), color-stop(38%,#09937c), color-stop(79%,#1f9e86), color-stop(80%,#1e9d85), color-stop(100%,#2da48c));
        background: -webkit-linear-gradient(top,  #07937c 0%,#09937c 38%,#1f9e86 79%,#1e9d85 80%,#2da48c 100%);
        background: -o-linear-gradient(top,  #07937c 0%,#09937c 38%,#1f9e86 79%,#1e9d85 80%,#2da48c 100%);
        background: -ms-linear-gradient(top,  #07937c 0%,#09937c 38%,#1f9e86 79%,#1e9d85 80%,#2da48c 100%);
        background: linear-gradient(to bottom,  #07937c 0%,#09937c 38%,#1f9e86 79%,#1e9d85 80%,#2da48c 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#07937c', endColorstr='#2da48c',GradientType=0 );}
    
    .modelDetailedName,
    .modelDetailedPrice {
        display: none;
        height: 96px;}
    
    .modelDetailedName h2 {
        position: relative;
        top: 27px;
        display: inline-block;
        margin: 0 10px 0 -3px;
        float: left;}
    
    .modelDetailedName .materialTypeIco {
        position: relative;
        top: 29px;
        right: 1px;
        float: right;}

    .modelDetailedName .materialTypeIco.Zn {right: 48px;}
    
    .colorName {
        position: absolute;
        top: 69px;
        float: left;
        font-size: 13px;
        line-height: 17px;
        color: #c7ffe7;
        margin-left: -1px;}
    
    .modelDetailedPrice {
        font-family: 'BlissPro-LightItalic', Arial, Helvetica, sans-serif;
        padding: 29px 0 0 60px;}
        
    .modelDetailedPrice .priceHeader {
        position: absolute;
        margin-top: -27px;
        width: 100px;
        max-width: 100px;
        text-align: center;
        font-size: 15px;
        color: #c7ffe7;}

    .modelDetailedPrice .priceValue {
        float: left;
        line-height: 27px;
        height: 30px;
        width: 90px;
        min-width: 90px;
        max-width: 110px;
        text-align: center;}
    
    .modelDetailedPrice .priceBox {
        font-size: 20px;
        line-height: 30px;
        height: 30px;
        width: 90px;
        min-width: 90px;
        max-width: 110px;
        color: #fffde3;
        background-color: #067b68;}
    
    .modelDetailedPrice .priceBox:before {
        content: "";
        position: absolute;
        left: 54px;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 15px 6px 15px 0;
        border-color: transparent #067b67 transparent transparent;}
    
    .modelDetailedPrice .priceBox:after {
        content: "";
        position: absolute;
        right: 34px;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 15px 0 15px 6px;
        border-color: transparent transparent transparent #067b67;}
    
    .priceTable {display: none;}
    
    .galleryTegmentoPattern {
        width: 190px;
        height: 190px;
        top: 117px;
        overflow: hidden;}
    
    .galleryTegmentoPattern .modelPattern {
        border: 1px solid #686454;
        z-index: 10;
        overflow: hidden;}
    
    .galleryTegmentoPattern .modelPattern img {
        position: absolute;
        top: -2px;
        left: -1px;}
    
    .galleryTegmentoPattern .modelColor {z-index: 8;}
    
    .galleryTegmentoPattern [class*="model"] {
        position: absolute;
        display: none;
        width: 190px;
        height: 190px;}


    
/* Модельный ряд. Слайдер галереи моделей
----------------------------------------------------------------------------------------------------*/    
    
    .galleryTegmentoModel {
        height: 290px;
        top: 50px;}
    
    .galleryTegmentoModel .gallery-cell {
        width: 190px;
        height: 238px;
        margin-right: 50px;
        counter-increment: gallery-cell;}

    .modelName {
        position: absolute;
        z-index: 11;
        top: 11px;
        left: -34px;
        width: 100%;
        text-align: center;}
    
    .modelTexture {
        position: absolute;
        z-index: 10;
        top: 30px;}
    
    .modelSize {
        position: absolute;
        z-index: 9;
        top: 30px;
        display: none;}
    
    .modelShadow {
        position: absolute;
        z-index: 8;
        top: 215px;
        left: -2px;}
    
    .modelMask {
        position: absolute;
        z-index: 7;
        top: 30px;}
    
    .galleryTegmentoModel .modelColor {
        position: absolute;
        z-index: 6;
        top: 30px;
        width: 190px;
        height: 220px;}
    
    .galleryTegmentoModel .model4 .modelName {left: -38px;}
    .galleryTegmentoModel .model4 .modelShadow {left: -9px;}
    
    .galleryTegmentoModel .model6 .modelName {left: -25px;}
    
    .galleryTegmentoModel .model7 .modelName {left: -27px;}
    .galleryTegmentoModel .model7 .modelShadow {left: 5px;}
    
    .galleryTegmentoModel .model8 .modelName {left: -46px;}
    .galleryTegmentoModel .model8 .modelShadow {left: -13px;}
    
    
    .galleryTegmentoModel .flickity-prev-next-button.previous {
        top: 160px;
        left: -300px;}
    
    .galleryTegmentoModel .flickity-prev-next-button.next {
        top: 160px;
        left: 616px;}
    
    .galleryTegmentoModel .flickity-prev-next-button {
      width: 75px;
      height: 75px;
      background: transparent;}

    .galleryTegmentoModel .flickity-prev-next-button:hover {background: transparent;}
    .galleryTegmentoModel .flickity-prev-next-button .arrow {fill: #28a18a;}
    .galleryTegmentoModel .flickity-prev-next-button.no-svg {color: #28a18a;}

    .galleryTegmentoModel .flickity-page-dots {
        bottom: 0px;
        left: -140px;}
    
    .galleryTegmentoModel .flickity-page-dots .dot {
        opacity: 1;
        background: #a5ddcf;}
    
    .galleryTegmentoModel .flickity-page-dots .dot.is-selected {background: #28a18a;}    
    
    
    
/* Модельный ряд. Подбор цветов
----------------------------------------------------------------------------------------------------*/        
    
    .colorPickerWrapper {
        background-color: #fffde3;
        margin: 0 auto;
        width: 100%;
/*        min-width: 960px;*/
        padding-bottom: 30px;}

    .colorPickerWrapper:after {
        height: 8px;
        background: url('../images/bgr_triangle_03.png') repeat-x top center;
        content: "";
        display: block;
        position: relative;
        top: 38px;
        z-index: 900;}
    
    .colorPickerWrapper h2,
    .colorPickerWrapper h3,
    .colorPickerWrapper p {color: #716e66;}
    
    .dlPDF {
        text-align: center;
        margin-bottom: 20px;}
    
    .dlPDF a {
        color: #e51d17;
        font-size: 90%;
        line-height: 1.5em;
        text-decoration: underline;
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;}
    
    .dlPDF a:hover,
    .dlPDF a:focus {color: #ff5b56;}
    
    .colorPicker .color {
        width: 30px;
        height: 30px;
        float: left;
        margin-right: 5px;
        cursor: pointer;
        background-image: url('../images/img_color_picker_shine.png');}
    
    .colorPicker .color span {display: none;}
    
    .colorPicker p {font-family: 'BlissPro-LightItalic', Arial, Helvetica, sans-serif;}
    
    .colorPicker h3 {margin: 3px 0 30px 0;}
    .colorPicker .color:last-child {margin: 0px;}
    
    .colorPicker .is-selected {
        margin: -2px 3px 0 -2px;
        width: 34px;
        height: 34px;
        border: 1px solid #82807a;
        background-color: #ffffff;
        padding: 1px 0 0 1px;
        float: left;}

    .colorPicker .is-selected:last-child {margin: -2px 0 0 -2px;}
    
    .Zn1 {background-color: #bfc9ce;}
    .Zn2 {background-color: #8e9ba2;}
    .Zn3 {background-color: #5f5c52;}
    .Zn4 {background-color: #51514f;}
    .Zn5 {background-color: #272725;}
    
    .Cu1 {background-color: #f68d5e;}
    .Cu2 {background-color: #505050;}
    .Cu3 {background-color: #17afa0;}
    .Cu4 {background-color: #c5c3b7;}
    .Cu5 {background-color: #b18927;}
    .Cu6 {background-color: #b48665;}
    .Cu7 {background-color: #e4bc4f;}
    
    .Al1 {background-color: #dbae3b;}
    .Al2 {background-color: #868d90;}
    .Al3 {background-color: #424649;}
    .Al4 {background-color: #212025;}
    .Al5 {background-color: #353128;}
    .Al6 {background-color: #914631;}
    .Al7 {background-color: #c47c56;}
    .Al8 {background-color: #b3b3b3;}
    .Al9 {background-color: #bfd2b6;}
    

    
/* Преимущества черепицы
----------------------------------------------------------------------------------------------------*/        

    .advantagesWrapper {
        margin: 0 auto;
        width: 100%;
/*        min-width: 960px;*/
        padding-bottom: 30px;
        background: #07937c;
        background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzA2Nzg2NSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwNzkzN2MiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
        background: -moz-linear-gradient(top,  #067865 0%, #07937c 300px);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#067865), color-stop(300px,#07937c));
        background: -webkit-linear-gradient(top,  #067865 0%,#07937c 300px);
        background: -o-linear-gradient(top,  #067865 0%,#07937c 300px);
        background: -ms-linear-gradient(top,  #067865 0%,#07937c 300px);
        background: linear-gradient(to bottom,  #067865 0%,#07937c 300px);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#067865', endColorstr='#07937c',GradientType=0 );}

/*
    .advantagesWrapper:after {
        height: 8px;
        background: url('../images/bgr_triangle_04.png') repeat-x top center;
        content: "";
        display: block;
        position: relative;
        top: 38px;
        z-index: 1000;}
*/

    .advSeven {
        padding-top: 10px;
        font-size: 1600%;
        font-family: 'BlissPro-ExtraBold', Arial, Helvetica, sans-serif;
        color: #fffde3;
        text-align: center;
        text-shadow: 5px 6px 0px #895b3c;
        background: url('../images/bgr_crown.png') #ffd85a center 30px no-repeat;
        height: 255px;}

    .advSeven:after {
        content: "";
/*        position: relative;*/
/*        bottom: -13px;*/
        width: 0;
        border-left: 95px solid transparent;
        border-right: 95px solid transparent;
        margin-top: -22px;
        float: left;
        border-top: 20px solid #ffd85a;
        z-index: 1000;}
    
    .advContent {
        margin: 30px 0 0 0;
        height: 220px;}
    
    .advContent p {font-size: 150%;}
    .advContent div {display: none;}
    .advContent .active {display: block;}
    
    .advIcons {margin: 30px 0 0 0;}
    
    .advIcons div {
        width: 110px;
        height: 110px;
        margin-right: 30px;
        cursor: pointer;
        float: left;
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;}

    .advIcons div:last-child {margin-right: 0;}
    
    .advIcons .adv01 {background-image: url('../images/ico_adv_01.png'); background-size: cover;}
    .advIcons .adv02 {background-image: url('../images/ico_adv_02.png'); background-size: cover;}
    .advIcons .adv03 {background-image: url('../images/ico_adv_03.png'); background-size: cover;}
    .advIcons .adv04 {background-image: url('../images/ico_adv_04.png'); background-size: cover;}
    .advIcons .adv05 {background-image: url('../images/ico_adv_05.png'); background-size: cover;}
    .advIcons .adv06 {background-image: url('../images/ico_adv_06.png'); background-size: cover;}
    .advIcons .adv07 {background-image: url('../images/ico_adv_07.png'); background-size: cover;}
    
    .advIcons div:hover {
        background-color: #c7ffe7;
        opacity: 0.7;}
    
    .advIcons .active {background-color: #c7ffe7;}
    .advIcons .active:hover {opacity: 1;}


    
/* Фотогалерея
----------------------------------------------------------------------------------------------------*/        

    .fotoGalleryWrapper {
        margin: 0 auto;
        width: 100%;
/*        min-width: 960px;*/
        padding-bottom: 30px;
        height: auto;
        background: #fffde3;}

    .fotoGalleryWrapper:after {
        height: 8px;
        background: url('../images/bgr_triangle_03.png') repeat-x top center;
        content: "";
        display: block;
        position: relative;
        top: 38px;
        z-index: 900;}    
    
    .fotoGalleryHeader {
        height: 180px;
        text-align: center;
        background: #07937c;
        background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzA3OTM3YyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjQ1JSIgc3RvcC1jb2xvcj0iIzA3OTM3YyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjY0JSIgc3RvcC1jb2xvcj0iIzFkOWQ4NSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9Ijc0JSIgc3RvcC1jb2xvcj0iIzRiYjA5OCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9Ijg5JSIgc3RvcC1jb2xvcj0iI2M4ZTVjYyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmZkZTMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
        background: -moz-linear-gradient(top,  #07937c 0%, #07937c 45%, #1d9d85 64%, #4bb098 74%, #c8e5cc 89%, #fffde3 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#07937c), color-stop(45%,#07937c), color-stop(64%,#1d9d85), color-stop(74%,#4bb098), color-stop(89%,#c8e5cc), color-stop(100%,#fffde3));
        background: -webkit-linear-gradient(top,  #07937c 0%,#07937c 45%,#1d9d85 64%,#4bb098 74%,#c8e5cc 89%,#fffde3 100%);
        background: -o-linear-gradient(top,  #07937c 0%,#07937c 45%,#1d9d85 64%,#4bb098 74%,#c8e5cc 89%,#fffde3 100%);
        background: -ms-linear-gradient(top,  #07937c 0%,#07937c 45%,#1d9d85 64%,#4bb098 74%,#c8e5cc 89%,#fffde3 100%);
        background: linear-gradient(to bottom,  #07937c 0%,#07937c 45%,#1d9d85 64%,#4bb098 74%,#c8e5cc 89%,#fffde3 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#07937c', endColorstr='#fffde3',GradientType=0 );}

    .fotoGalleryHeader h1 {
        margin-top: 0;
        text-align: center;}
    
    .fotoGalleryHeader .matSelector {
        display: inline-block;
        padding-bottom: 10px;}
        
    .fotoGalleryHeader .matSelector div {
        text-align: left;
        font-size: 150%;
        display: inline;
        color: #005244;
        border-bottom: 1px dotted #005244;
        white-space: nowrap;
        cursor: pointer;
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;}
    
    .fotoGalleryHeader .matSelector div:hover {
        color: #73efd1;
        border-bottom: 1px dotted #73efd1;}
    
    .fotoGalleryHeader .matSelector span {
        display: inline;
        font-size: 120%;
        margin: 0 20px;
        color: #006a57;}
    
    .fotoGalleryHeader .matSelector .active {
        color: #ffd85a;
        border-bottom: 1px dotted #ffd85a;
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;}
    
    .fotoGallery {margin: 0 auto;}
    
    .fotoGallery img {
        width: 100%;
        display: block;}
    
    .fotoGalleryItem {
        float: left;
        width: 310px;
        margin-bottom: 10px;
        opacity: 1;
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;}
    
    .fotoGalleryItem:hover {
        opacity: 0.6;
        -webkit-transition: all 0.3s;
        -moz-transition: all 0.3s;
        -o-transition: all 0.3s;
        transition: all 0.3s;}
    

/* Footer
----------------------------------------------------------------------------------------------------*/        

    .footerWrapper {
        margin: 0 auto;
        width: 100%;
/*        min-width: 960px;*/
        background: #07937c;
        background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzA2Nzg2NSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwNzkzN2MiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
        background: -moz-linear-gradient(top,  #067865 0%, #07937c 300px);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#067865), color-stop(300px,#07937c));
        background: -webkit-linear-gradient(top,  #067865 0%,#07937c 300px);
        background: -o-linear-gradient(top,  #067865 0%,#07937c 300px);
        background: -ms-linear-gradient(top,  #067865 0%,#07937c 300px);
        background: linear-gradient(to bottom,  #067865 0%,#07937c 300px);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#067865', endColorstr='#07937c',GradientType=0 );}
    
    .footerWrapper p {color: #c7ffe7;}
    .footerWrapper h3 {color: #06463b;}
    .footerWrapper a {color: #c7ffe7; text-decoration: underline;}

}


@media screen {
  /* force vertical scrollbar */
  body {overflow-y: scroll;}
    
}


@media screen and (min-width: 768px) and (max-width: 1024px) {
    
    .ym-wrapper {width: 720px;}
    
    .linearize-level-1,
    .linearize-level-1 > [class*="ym-g"] {
        display: block;
        float: none;
        padding: 0;
        margin: 0;
        width: auto !important;}
    
    .linearize-level-1 > [class*="ym-g"] {overflow: hidden;}
    
    .linearize-level-1 h1 {font-size: 400%;}
    
    .galleryTegmentoModel {
        width: 430px;
        float: left;
        left: 90px;}
    
    .galleryTegmentoModel .flickity-prev-next-button.next {
        top: 160px;
        left: 376px;}
    
    .linearize-level-1 .montajInfo {
        float: left !important;
        width: 470px !important;
        margin-right: 10px;}
    
    .linearize-level-1 .dlPDF {
        width: 70px !important;
        float: left !important;
        margin-right: 20px;}
    
    .linearize-level-1 .advSeven {
        float: left !important;
        width: 190px !important;
        margin-right: 40px;
        overflow: visible !important;}
    
    .linearize-level-1 .advSeven:after {margin-top: -12px;}
    
    .linearize-level-1 .advIcons div {
        width: 75px;
        height: 75px;}
    
    .linearize-level-1 .advIcons {margin: 20px 0;}
    .linearize-level-1 .footerMap {padding-bottom: 40px;}
    
    header.sticky {
        height: 50px;
        top: -50px;}
    
    header.sticky .topLogo img {width: 35%;}
    
    header .topMenu {width: auto;}
    header.static .topMenu {margin: 3px 35px 0 0;}
    header.sticky .topMenu {margin: 7px 35px 0 0;}
    
    header nav li {
        font-size: 120%;
        margin: 0 30px 0 0;}
    
    header.static {height: 136px;}
    header.static:before {top: 136px;}
    header.static .topLogo img {width: 70%;}
    
    header.static .topContacts {
        width: auto;
        margin-top: 44px;}
    
    header.static .phone {
        font-size: 240%;
        margin-right: 40px;}
    
    header.static .address {
        float: left;
        padding-top: 0;
        font-size: 100%;
        line-height: 18px;}
    
    header.static .topMotto {
        width: auto;
        font-size: 120%;
        margin: 5px 0 0 5px;}

    .mainPresentation {height: 500px;}
    .mainPresentation .gallery-cell {padding-top: 50px;}
    .mainPresHeader {width: auto !important;}
    
    .mainPresentation h1 {
        font-size: 450%;
        line-height: 100%;}
    
    .mainPresentation .materialTypeIco {
        width: 42px;
        height: 42px;
        line-height: 39px;
        font-size: 38%;
        top: -14px;
        left: 7px;}

    .mainPresentation .materialTypeIco.Zn:after {
        margin-top: -39px;
        margin-left: 68px;
        width: 42px;
        height: 42px;
        line-height: 39px;}
    
    .mainPresentation .mainPresTagline {
        width: 400px !important;
        font-size: 160%;}
    
    .mainPresentation .intro .mainPresTagline {margin-top: 20px;}
    
    .mainPresentation .mainPresDesc {
        width: auto !important;
        padding: 12px;
        margin-bottom: 20px;}
    
    .mainPresentation .mainPresLogos {
        width: 110px;
        margin: 0;
        text-align: left;}
    
    .mainPresentation .Cu .mainPresLogos,
    .mainPresentation .Zn .mainPresLogos {margin-top: 0;}
    
    .mainPresLogos img {
        width: 100%;
        height: 100%;}
    
    .Zn .mainPresLogos .Rheinzink {
        width: 50px;
        height: 100%;}
    
    .Al .mainPresLogos .Alunova {
        width: 130%;
        height: 100%;}

}




@media screen and (max-width: 767px) {

    .ym-wrapper {width: 480px;}
    
    header,
    .mainPresentation,
    .modelArticleWrapper,
    .modelArticleWrapper .jaggedBorderTop,
    .modelWrapper,
    .colorPickerWrapper,
    .advantagesWrapper,
    .fotoGalleryWrapper,
    .footerWrapper {min-width: 520px;}
    
    .linearize-level-1,
    .linearize-level-1 > [class*="ym-g"] {
        display: block;
        float: none;
        padding: 0;
        margin: 0;
        width: auto !important;}
    
    .linearize-level-1 > [class*="ym-g"] {overflow: hidden;}
    
    .linearize-level-1 h1 {font-size: 320%;}
    
    .galleryTegmentoModel {
        width: 190px;
        float: left;
        left: 90px;}
    
    .galleryTegmentoModel .flickity-prev-next-button.next {
        top: 160px;
        left: 145px;}
    
    .colorPicker .ym-g960-4 {width: 140px; white-space: nowrap;}
    .colorPicker .ym-g960-9 {width: 320px; white-space: nowrap;}
    
    .linearize-level-1 .montajInfo {
        float: left !important;
        width: 470px !important;
        margin-right: 10px;}
    
    .linearize-level-1 .dlPDF {
        width: 70px !important;
        float: left !important;
        margin-right: 20px;}
    
    .linearize-level-1 .advSeven {
        font-size: 1400%;
        text-shadow: 4px 4px 0px #895b3c;
        background: url('../images/bgr_crown.png') #ffd85a center 18px no-repeat;
        float: left !important;
        width: 150px !important;
        height: 210px;
        margin-right: 40px;
        overflow: visible !important;}
    
    .linearize-level-1 .advSeven:after {
        margin-top: -24px;
        border-left: 75px solid transparent;
        border-right: 75px solid transparent;}
    
    .linearize-level-1 .advIcons div {
        width: 55px;
        height: 55px;
        margin-right: 10px;}
    
    .linearize-level-1 .advIcons {margin: 20px 0;}
    
    .linearize-level-1 .advContent {
        margin: 20px 0 0 0;
        height: 190px;}
    
    .linearize-level-1 .advContent h2 {font-size: 180%;}
    .linearize-level-1 .advContent p {font-size: 120%;}
    .linearize-level-1 .matSelector {font-size: 90%;}
    .linearize-level-1 .footerMap {padding-bottom: 30px;}
    
    header.sticky {
        height: 50px;
        top: -50px;}
    
    header.sticky .topLogo img {width: 57%;}
    
    header .topMenu {width: auto;}
    header.static .topMenu {margin: 0;}
    header.sticky .topMenu {margin: 8px 0 0 0;}
    
    header nav li {
        font-size: 100%;
        margin: 0 12px 0 0;}
    
    header.static {height: 110px;}
    header.static:before {top: 110px;}
    
    header .topLogo {width: 90px !important;}
    header.static .topLogo img {width: 85%;}
    
    header.static .topContacts {
        width: auto;
        margin-top: 35px;}
    
    header.static .phone {
        font-size: 160%;
        margin-right: 10px;}
    
    header.static .address {
        float: left;
        padding-top: 0;
        font-size: 80%;
        line-height: 15px;}
    
    header.static .topMotto {
        width: auto;
        font-size: 100%;
        margin: 2px 0 0 5px;}

    .mainPresentation {height: 425px;}
    
    .mainPresentation .gallery-cell {
        padding-top: 40px;
        margin-right: 20px;}
    
    .mainPresHeader {width: auto !important;}
    .mainPresentation .intro .mainPresHeader {width: 420px !important;}
    
    .mainPresentation h1 {
        font-size: 300%;
        line-height: 110%;}
    
    .mainPresentation .materialTypeIco {
        width: 29px;
        height: 29px;
        line-height: 29px;
        font-size: 38%;
        top: -9px;
        left: 5px;}

    .mainPresentation .materialTypeIco.Zn:before {padding-left: 5px;}
    
    .mainPresentation .materialTypeIco.Zn:after {
        margin-top: -29px;
        margin-left: 46px;
        width: 29px;
        height: 29px;
        line-height: 29px;}
    
    .mainPresentation .mainPresTagline {
        width: auto !important;
        font-size: 130%;}
    
    .mainPresentation .intro .mainPresTagline {margin-top: 20px;}
    
    .mainPresentation .mainPresDesc {
        width: auto !important;
        font-size: 90%;
        padding: 10px;
        margin-bottom: 15px;}
    
    .mainPresentation .mainPresDesc p {font-size: 98%;}
    
    .mainPresentation .mainPresLogos {
        padding: 0;
        width: 280px;
        margin: 13px 0 0 0 !important;}
    
    .mainPresLogos img {
        float: left;
        margin-right: 20px;
        height: 100%;}
    
    .Cu .mainPresLogos .GZO {width: 80px;}
    .Cu .mainPresLogos .KME {width: 80px; margin-top: 8px;}
    .Zn .mainPresLogos .Rheinzink {width: 30px;}
    .Zn .mainPresLogos .Vmzinc {width: 90px;}
    .Al .mainPresLogos .Alunova {width: 110px;}
    
    .priceTag {
        width: 144px; 
        height: 85px;
        margin-top: -45px;}

    .priceTag:before,
    .priceTag:after {
        border-left: 72px solid transparent;
        border-right: 72px solid transparent;}

    .priceTag:before {border-bottom: 37px solid #ffd85a;}
    .priceTag:after {border-top: 37px solid #ffd85a;}

    .priceTag .priceText {top: -5px;}
    
    .priceTag .priceText div {
        font-size: 170%;
        line-height: 110%;}
    
    .priceTag .priceText .mainPresPrice {
        font-size: 220%;
        height: 40px;}

}