// @font-face{ // font-family:PTSansCaption; // src:url(../fonts/PTSansCaption.eot) format('eot'); // src:local('☺'), // url(../fonts/PTSansCaption.woff) format('woff'), // url(../fonts/PTSansCaption.ttf) format('truetype'), // url(../fonts/PTSansCaption.svg) format('svg'); // font-weight:normal; // font-style:normal; // } // variables @colP:#808080; @colA:#2574b6; @colH:#333; @colPlac:@colP; @fs:16px; @ff:arial, helvetica, sans-serif; // mixins .br(@r){ -moz-border-radius:@r; -webkit-border-radius:@r; -o-border-radius:@r; border-radius:@r; } .bs(@s){ -moz-box-shadow:@s; -webkit-box-shadow:@s; -o-box-shadow:@s; box-shadow:@s; } .t(@s){ -moz-transition:@s; -webkit-transition:@s; -o-transition:@s; transition:@s; } .lg(@from,@col1,@col2){ background-color:@col2; background-image: -o-linear-gradient(@from,@col1,@col2); background-image: -moz-linear-gradient(@from,@col1,@col2); background-image: -webkit-linear-gradient(@from,@col1,@col2); background-image: -ms-linear-gradient(@from,@col1,@col2); background-image: linear-gradient(@from,@col1,@col2); } @highdpi: ~"(-webkit-min-device-pixel-ratio: 1.5), (min--moz-device-pixel-ratio: 1.5), (-o-min-device-pixel-ratio: 3/2), (min-resolution: 1.5dppx)"; .bg(@path, @w: auto, @h: auto) { background-image: url(@path); @at2x_path: ~`@{path}.replace(/\.\w+$/, function(match) { return "@2x" + match; })`; @media @highdpi { background-image: url("@{at2x_path}"); background-size: @w @h; } } /* all */ *{ margin:0; padding:0; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; box-sizing:border-box; &:after, &:before{ -moz-box-sizing:border-box; -webkit-box-sizing:border-box; -o-box-sizing:border-box; box-sizing:border-box; } } html{ overflow-x:auto; -webkit-tap-highlight-color:rgba(0,0,0,0); } body{ font-family:@ff; color:@colP; font-size:@fs; -webkit-font-smoothing:subpixel-antialiased; background:#fff; overflow:hidden; min-width:1200px; line-height:1.3; } a{ color:@colA; text-decoration:none; &:focus, &:active{ outline:none; } } b, strong{ font-weight:700; } small{ font-size:80%; } sub, sup{ font-size:75%; line-height:0; position:relative; vertical-align:baseline; } sup{ top:-0.5em; } sub{ bottom:-0.25em; } h1,h2,h3,h4,h5,h6{ font-weight:400; } input, button, select, textarea{ color:inherit; font:inherit; margin:0; &:focus{ outline:none; } } input{ padding-top:0; padding-bottom:0; } ::-moz-placeholder{ font-family:@ff; font-size:@fs; overflow:visible; color:@colPlac; } :-ms-input-placeholder{ font-family:@ff; font-size:@fs; overflow:visible; color:@colPlac; } ::-webkit-input-placeholder{ font-family:@ff; font-size:@fs; overflow:visible; color:@colPlac; } table{ border-collapse:collapse; border-spacing:0; background-color:transparent; } button, input[type="submit"], input[type="reset"], input[type="button"]{ cursor:pointer; -webkit-appearance:button; } button[disabled], input[disabled]{ cursor:default; } img{ border:0; max-width:100%; } ul{ list-style:none; } .container{ width:1200px; margin:0 auto; position:relative; } .row, .clearfix{ &:after{ display:table; line-height:0; content:''; clear:both; } } /* header */ .header{ position:relative; background:#000; &.active{ // .head, // .header-desc{ // background:rgba(0,0,0,0); // .t(0) // } } } .main-img{ width:1400px; position:relative; img{ display:block; } margin-left:-100px; } .main-img-map-wrapp{ position:absolute; left:0; right:0; top:0; bottom:0; } .main-img-map{ display:block; width:100%; height:100%; z-index:5; position:relative; } .man-1{ top:228px; left:46px; .man-info{ margin-left:-50px; } width:217px; height:532px; } .man-2{ top:195px; left:206px; .man-info{ margin-left:30px; } width:125px; height:355px; } .man-3{ top:246px; left:243px; width:175px; height:298px; } .man-4{ top:223px; left:401px; width:130px; height:330px; } .man-5{ top:231px; left:520px; width:143px; height:326px; } .man-6{ top:193px; left:647px; width:154px; height:376px; } .man-7{ top:173px; left:771px; .man-info{ margin-left:10px; } width:143px; height:398px; } .man-8{ top:285px; left:803px; width:170px; height:296px; } .man-9{ top:192px; left:923px; width:139px; height:389px; } .man-10{ top:224px; left:1022px; width:167px; height:364px; } .man-11{ top:189px; left:1166px; width:158px; height:492px; } .man{ position:absolute; z-index:2; &.active{ z-index:4; .man-info{ opacity:1; -webkit-transform:translateX(0); -moz-transform:translateX(0); -o-transform:translateX(0); transform:translateX(0); } } } .main-img-shade{ position:absolute; left:0; top:0; right:0; bottom:0; // background:rgba(0,0,0,.5); opacity:0; .t(.2s); z-index:3; &.active{ opacity:1; } } .man-info{ position:absolute; width:320px; padding:20px; background:#e4e4e4; .br(3px); top:-65px; font-size:14px; opacity:0; .t(.2s); display:none; &:before{ content:''; position:absolute; width:29px; height:32px; top:100px; background:url(../img/man-info.png); } } .man-info-right{ left:100%; -webkit-transform:translateX(20px); -moz-transform:translateX(20px); -o-transform:translateX(20px); transform:translateX(20px); &:before{ left:-29px; } } .man-info-left{ right:100%; -webkit-transform:translateX(-20px); -moz-transform:translateX(-20px); -o-transform:translateX(-20px); transform:translateX(-20px); &:before{ right:-29px; background-position:0 -32px; } } .man-info-name{ font-size:15px; font-weight:700; text-transform:uppercase; color:@colH; } .man-info-desc{ color:#a9a8a8; padding-bottom:5px; border-bottom:dashed 1px @colP; margin-bottom:10px; } .head{ background:rgba(0,0,0,.5); padding:25px; position:absolute; left:0; right:0; z-index:10; .t(.2s); } .logo{ display:inline-block; float:left; width:200px; height:50px; .bg('../img/logo.png',200px, 100px); &:hover{ background-position:0 -50px; } } .menu-top{ display:inline-block; float:left; margin-top:13px; width:555px; text-align:center; color:#fff; font-size:15px; font-weight:700; text-transform:uppercase; li{ display:inline-block; vertical-align:middle; &:hover, &.active{ color:@colA; } } a{ color:inherit; display:block; padding:10px 10px; .t(.2s); } } .head-tel{ display:inline-block; float:right; color:#fff; } .tel{ font-size:24px; font-weight:700; line-height:1.1; } .head-tels{ display:inline-block; float:left; color:#fff; // margin-top:8px; .title{ font-size:14px; margin-bottom:3px; } } .head-tel-block{ display:inline-block; float:left; margin-right:30px; &:last-child{ margin-right:0; } a{ color:inherit; font-size:14px; &:hover{ text-decoration:underline; } } } .heade-recall{ font-size:14px; .modal-btn{ color:inherit; text-decoration:underline; &:hover{ text-decoration:none; } } } .header-desc{ position:absolute; left:0; right:0; bottom:0; z-index:10; background:rgba(0,0,0,.5); padding:55px 0; color:#fff; .t(.2s); overflow:hidden; } .main-title{ font-size:40px; font-weight:700; text-align:center; line-height:1; span{ position:relative; display:inline-block; padding:0 24px; &:before, &:after{ content:''; position:absolute; width:2000px; height:1px; top:50%; margin-top:-1px; background:#fff; } &:before{ right:100%; } &:after{ left:100%; } } } .main-title-desc{ font-size:25px; text-align:center; } /* services */ .services{ background:#fff; background-size:cover; background-attachment:fixed; padding:40px 0 40px; position:relative; // border-top:solid 1px #ccc; .section-title{ margin-bottom:40px; } // &:before{ // content:''; // position:absolute; // left:0; // right:0; // top:0; // bottom:120px; // background:rgba(255,255,255,.9); // } .container{ z-index:1; } } .services-content{ margin-top:40px; } .services-wrapp{ display:table; width:100%; margin:0 -40px; } .services-row{ display:table-row; } .services-col{ padding:20px 40px; display:table-cell; vertical-align:top; border-right:dashed 1px #e4e4e4; width:50%; position:relative; &:last-child{ border-right:0; } &:before{ content:''; position:absolute; left:40px; right:40px; bottom:20px; border-top:dashed 1px #e4e4e4; } } .services-block{ position:relative; padding-left:100px; &:last-child{ .services-block-text{ // border-bottom:0; } } } [class^="services-icon-"]{ display:inline-block; width:71px; height:70px; position:absolute; left:0; top:-5px; .bg('../img/services-icons.png',71px,840px); } .services-icon-2{ background-position:0 -70px; } .services-icon-3{ background-position:0 -140px; } .services-icon-4{ background-position:0 -210px; } .services-icon-5{ background-position:0 -280px; } .services-icon-6{ background-position:0 -350px; } .services-icon-7{ background-position:0 -420px; } .services-icon-8{ background-position:0 -490px; } .services-icon-9{ background-position:0 -560px; } .services-icon-10{ background-position:0 -630px; } .services-icon-11{ background-position:0 -700px; } .services-icon-12{ background-position:0 -770px; } .asvdc-services-icon{ position:absolute; left:0; top:0; } .services-block-title{ font-size:20px; color:@colA; margin-bottom:10px; text-transform:uppercase; font-weight:700; } .services-block-text{ padding-bottom:23px; color:#000; text-align:justify; } /* scheme */ .scheme{ padding:70px 0 75px; background:url(../img/scheme.jpg) center center no-repeat; background-size:cover; background-attachment:fixed; position:relative; &:before{ content:''; position:absolute; top:0; left:0; right:0; bottom:0; background:rgba(255,255,255,.9); } .container{ z-index:1; } } .section-title{ font-size:30px; color:@colH; text-transform:uppercase; text-align:center; font-weight:700; line-height:1.2; } .section-title-desc{ text-align:center; font-size:20px; } .scheme-wrapp{ padding-top:100px; position:relative; &:before{ content:''; position:absolute; border-left:dashed 1px @colA; left:50%; top:100px; bottom:11%; } } .scheme-block{ display:inline-block; width:50%; margin-top:-40px; padding-top:20px; position:relative; } .scheme-block-num{ position:absolute; width:48px; height:48px; line-height:48px; text-align:center; color:#fff; .br(50%); background:@colA; font-size:30px; font-weight:700; border:solid 2px #fff; top:5px; &:before{ content:''; position:absolute; top:-3px; left:-3px; right:-3px; bottom:-3px; border:solid 1px @colA; .br(50%); } &:after{ content:''; position:absolute; width:54px; height:62px; top:50%; margin-top:-31px; background:url(../img/scheme-block-num.png); } } .scheme-block-left{ float:left; padding-right:76px; text-align:right; } .scheme-block-right{ float:right; padding-left:76px; } .scheme-block-num-left{ right:-24px; &:after{ left:-43px; } } .scheme-block-num-right{ left:-24px; &:after{ right:-43px; background-position:0 -62px; } } .scheme-block-title{ color:@colA; text-transform:uppercase; font-weight:700; font-size:20px; margin-bottom:10px; span{ position:relative; top:-2px; } } /* why */ .why{ padding:85px 0; background:url(../img/scheme.jpg); background-position:center center; background-repeat:no-repeat; background-size:cover; position:relative; &:before{ content:''; position:absolute; left:0; right:0; top:0; bottom:0; background:rgba(0,0,0,.75); } &>.container{ z-index:1; } .section-title{ margin-bottom:60px; color:#fff; } } .why-wrapp{ display:table; width:100%; &+&{ border-top:solid 1px #ccc; } } .why-row{ display:table-row; } .why-cell{ display:table-cell; vertical-align:middle; width:33.3333%; padding:25px; text-align:center; color:#fff; border-right:solid 1px #ccc; &:last-child{ border-right:0; } } [class^="why-icon-"]{ display:inline-block; width:91px; height:86px; margin-bottom:15px; .bg('../img/why-icons.png',91px,516px); } .why-icon-2{ background-position:0 -86px; } .why-icon-3{ background-position:0 -172px; } .why-icon-4{ background-position:0 -258px; } .why-icon-5{ background-position:0 -344px; } .why-icon-6{ background-position:0 -430px; } .why-text-top{ font-size:18px; font-weight:700; text-transform:uppercase; } .why-text-center{ font-size:30px; font-weight:700; text-transform:uppercase; line-height:1; margin:2px 0 4px; } /* form */ .form-block{ position:relative; padding-bottom:10px; } .alert{ position:absolute; height:20px; padding:0 10px; background:red; color:#fff; font-size:12px; line-height:20px; top:0; right:0; font-style:normal; .br(4px); .t(all .3s); opacity:0; z-index:-2; white-space:nowrap; &:after{ content:''; position:absolute; width:0; height:0; border-top:solid 8px red; border-left:solid 5px transparent; border-right:solid 5px transparent; bottom:-8px; right:20px; } &.active{ opacity:1; z-index:2; top:-19px; } } .send{ text-align:center; -webkit-transform:translateZ(0); background:#3e3e3e; line-height:1; color:#fff; p{ margin:10px 0 25px; font-weight:700; font-size:18px; } } .input{ display:block; width:100%; height:35px; background:#fff; padding:0 10px; border:0; } .submit{ text-transform:uppercase; color:#fff; width:100%; border:0; background:@colA; .t(.2s); height:35px; display:block; &:hover{ background:darken(@colA,15%); } } /* modal */ .modal{ display:none; max-width:360px; min-width:300px; padding:25px 20px; background:#3e3e3e; } .modal-wrapp{ .fancybox-skin{ .br(0); .bs(none); } .fancybox-close{ width:11px; height:11px; background:url(../img/close.png); top:6px; right:6px; } .fancybox-ok{ width:130px; height:35px; position:static; display:inline-block; color:#fff; background:@colA; line-height:35px; font-size:20px; text-transform:uppercase; .t(.2s); &:hover{ background:darken(@colA,15%); } } } .modal-title{ text-align:center; font-weight:700; margin-bottom:24px; text-transform:uppercase; color:#fff; font-size:20px; } /* clients */ .clients{ padding:60px 0; background:#efefef; .section-title{ margin-bottom:85px; } } .clients-row{ margin-bottom:20px; } .clients-block{ display:table-cell; vertical-align:middle; width:1%; opacity:.2; .t(.3s); &:hover{ opacity:1; } img{ display:block; max-width:200px; margin:auto; } } /* footer */ .footer{ background:@colH; padding:60px 0; } .footer-content-wrapp{ margin:0 -40px; } .footer-content{ display:table; float:left; margin:0 -40px; } .footer-content-cell{ display:table-cell; vertical-align:top; padding:0 40px; border-right:solid 1px #4d4d4d; &:last-child{ border-right:0; } .head-tels{ margin-top:0; margin-right:20px; } } .footer-content-row{ display:table-row; } .footer-logo{ margin:-20px 0 30px; .logo{ float:none; } } .footer-info{ font-size:12px; text-transform:uppercase; } .menu-footer{ color:#fff; font-size:16px; font-weight:700; text-transform:uppercase; a{ color:inherit; .t(.2s); &:hover{ color:@colA; } } li+li{ margin-top:5px; } } .footer-address{ // margin-top:30px; // font-size:14px; p+p{ margin-top:4px; } a{ color:inherit; &:hover{ text-decoration:underline; } } } .footer-contacts{ display:inline-block; float:right; // text-align:right; } .footer-tel{ color:#fff; margin-bottom:27px; padding-bottom:5px; } .social-links{ display:inline-block; float:right; } [class^="social-icon-"]{ display:inline-block; float:left; width:30px; height:30px; margin-left:4px; .br(2px); .bs(1px 1px 5px rgba(0,0,0,.6)); .bg('../img/social-icons.png',198px,30px); .t(.2s); &:hover{ .bs(-1px -1px 5px rgba(0,0,0,.6)); opacity:.8; } } .social-icon-2{ background-position:-33px 0; } .social-icon-3{ background-position:-67px 0; } .social-icon-4{ background-position:-101px 0; } .social-icon-5{ background-position:-135px 0; } .social-icon-6{ background-position:-168px 0; } /* */ .services-btn-wrapp{ text-align:center; margin-top:50px; } .services-btn{ display:inline-block; // width:400px; width:100%; height:53px; line-height:50px; background:orange; .br(4px); color:#fff; text-transform:uppercase; font-weight:700; border-bottom:solid 3px darken(orange,10%); .t(.2s); &:hover{ background:lighten(orange,10%); } &:active{ line-height:53px; border-bottom-width:0; } } .wrapper{ width:1400px; margin:auto; margin-left:-100px; } /* calc */ .calc{ padding:70px 0; background:#efefef; .section-title{ margin-bottom:10px; } .section-title-desc{ margin-bottom:50px; } } .calc-form{ width:1124px; margin:auto; background:#fff; .bs(0 0 50px rgba(0,0,0,.07)); display:table; .br(5px); } .calc-form-row{ display:table-row; } .calc-form-body{ display:table-cell; vertical-align:middle; width:705px; padding:33px 58px 45px 38px; } .calc-block{ font-size:0; margin-bottom:30px; &:last-child{ margin-bottom:0; } .title{ display:inline-block; vertical-align:middle; width:180px; font-size:16px; color:#808080; padding-right:5px; span{ font-size:14px; } } } .calc-slider{ display:inline-block; vertical-align:middle; width:320px; position:relative; } .range-slider, .range-slider-departure, .range-slider_asvdc{ height:12px; .lg(top,#cbcbcb,#e6e6e6); .br(5px); position:relative; z-index:2; } .ui-slider .ui-slider-handle{ width:30px; display:inline-block; height:30px; border:solid 2px #fff; .br(50%); .lg(top,#42a0fc,#3283d3); .bs(0 2px 5px rgba(0,0,0,.2)); cursor:pointer; top:50%; margin-top:-15px; outline:none!important; margin-left:-15px; &:before{ content:''; position:absolute; width:18px; height:12px; left:50%; top:50%; margin-top:-6px; margin-left:-9px; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAMCAYAAABvEu28AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyJpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYxIDY0LjE0MDk0OSwgMjAxMC8xMi8wNy0xMDo1NzowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNS4xIFdpbmRvd3MiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MEJGNEQxODM2RTgxMTFFNUJBMDE5NzEzQTcwRjhBRTkiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MEJGNEQxODQ2RTgxMTFFNUJBMDE5NzEzQTcwRjhBRTkiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDowQkY0RDE4MTZFODExMUU1QkEwMTk3MTNBNzBGOEFFOSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDowQkY0RDE4MjZFODExMUU1QkEwMTk3MTNBNzBGOEFFOSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PsSzWw4AAAExSURBVHjajNLNK4VBFMfxuTcpNlbyH5BSom5hoRTKS1kpcqUoyoa8FHVjZUFWxEos3HJTlA1LK5GFP0FElEIsWEj5nvo9NU3Pg1Ofnppn5syZM5NqyJ26mGhHN/ZwrrEqDOIa2+GCtIuPRnSiwhsrQzNaUfyfRAvI4R333vgD7tCPXZT4i4qCJMuYwRXG9I3Cks4hpWSlyOItrGgds7jAUJAkCqtoGjvq4SHKo4p60YMBnGAcNy45HrWhVTKJI6vMKhpBnyZt4Nb9Hc/YxBPq0JRWcxfxoSZ2qQ+/RY2ehh3rAMeW6BJLmNdR93XcpMiggHpsqZ8vfrPXMIVPVTYcU1kL8qjW5YziO+4d2Q4TaqRN7PD+1arySqxoXuI7ctrxC2149cat0jNd+Wq46EeAAQD6yT+qsRCmCQAAAABJRU5ErkJggg=='); } } .ui-slider .ui-slider-range{ .lg(left,#3e89d3,#cb2f95); .br(5px); } .calc-input-wrapp{ display:inline-block; vertical-align:middle; text-align:right; width:100px; position:relative; } .calc-input, .calc-input-asvdc{ width:60px; height:33px; display:inline-block; border:solid 2px #e6e6e6; .br(5px); background:#efefef; text-align:center; padding:0 5px; color:#808080; font-size:17px; } .calc-slider-info{ position:absolute; top:100%; margin-top:15px; left:0; right:0; font-size:12px; color:#808080; span{ display:inline-block; text-align:center; position:absolute; -webkit-transform:translateX(-50%); &:before{ content:''; position:absolute; width:1px; height:17px; left:50%; top:-18px; background:#f2f2f2; margin-left:-1px; } } } .calc-form-result{ display:table-cell; vertical-align:middle; border-left:solid 2px #d6d6d6; .lg(left,#f1f1f1,#fdfdfd); padding:37px; } .result{ text-align:19px; color:#808080; text-align:center; padding-bottom:18px; border-bottom:dashed 1px #e3e3e3; margin-bottom:30px; span{ font-size:39px; color:#333; } } .form-calc-inputs{ width:316px; margin:0 auto; } .form-calc-inputs-title{ text-align:center; margin-bottom:18px; font-size:20px; color:#333; } .input-calc{ width:100%; height:55px; border:solid 1px #ccc; .br(5px); background:#fff; padding:0 20px; color:#333; font-size:19px; } .input-calc::-moz-placeholder{ font-size:19px; color:#c9c9c9; } .input-calc:-ms-input-placeholder{ font-size:19px; color:#c9c9c9; } .input-calc::-webkit-input-placeholder{ font-size:19px; color:#c9c9c9; } .submit-calc{ height:55px; .br(5px); .lg(top,#4ba6ff,#3e8ad4); font-size:19px; color:#fff; text-transform:none; &:hover{ .lg(bottom,#4ba6ff,#3e8ad4); } } .result-title{ font-size:20px; color:#333; } // .form-var-1{ // .var-1{ // display:block; // } // .var-2{ // display:none; // } // } // .form-var-2{ // .var-2{ // display:block; // } // .var-1{ // display:none; // } // } .form-block-calc{ padding-bottom:12px; // display:none; // &.active{ // display:block; // } } .hidden{ display:none; } /* landing */ .main-img-landing{ background:url(../img/main-landing.jpg) center top no-repeat; background-size:cover; .container{ min-height:760px; } } .land-body{ max-width:940px; padding-top:130px; margin:auto; } .land-body-title{ display:inline-block; float:left; width:500px; color:#fff; padding-top:40px; .title{ font-size:62px; font-weight:700; margin-bottom:40px; line-height:1.2; } .title-desc{ font-size:30px; } } .land-calc-wrapp{ display:inline-block; float:right; width:375px; background:#fff; .br(3px); .bs(0 10px 30px rgba(0,0,0,.5)); overflow:hidden; } .land-calc-header{ padding:23px 20px 20px; background:#3e88d2; font-size:18px; text-align:center; color:#fff; } .land-calc-body{ padding:25px 60px 35px; } .land-calc-inputs{ padding-bottom:15px; border-bottom:solid 1px #c8c8c8; margin-bottom:18px; } .land-calc-input-block{ margin-bottom:18px; .title{ display:inline-block; float:left; line-height:31px; font-size:17px; color:#808080; } } .land-calc-input{ display:inline-block; float:right; width:56px; height:31px; .br(3px); background:#efefef; border:solid 1px #e3e3e3; color:#808080; font-size:18px; padding:0 5px; text-align:center; } #landing-modal{ display:none; padding:30px; background:#fdfdfd; width:420px; } .land-calc-price{ text-align:center; margin-bottom:30px; font-size:20px; color:#808080; span{ display:inline-block; vertical-align:baseline; } } .land-calc-result{ font-size:35px; font-weight:700; } .land-calc-btn{ font-size:17px; width:100%; height:54px; .br(3px 3px 5px 5px); border:0; border-bottom:solid 3px #b56823; background:#f38f1e; .t(.2s); color:#fff; &:hover{ background:lighten(#f38f1e,5%); } &:active{ border-bottom-width:0; } } /* page */ .header-static{ background:#333; .head{ position:static; background:transparent; } } .text-section{ padding:40px 0; } .text-content{ color:#333; &>*{ margin-bottom:25px; } h1, h2, h3, h4, h5, h6{ font-weight:700; } h1{ font-size:30px; } h2{ font-size:26px; } h3{ font-size:22px; } h4{ font-size:18px; } h5{ font-size:17px; } h6{ font-size:16px; } ol, ul{ padding-left:20px; li{ margin-bottom:10px; &:last-child{ margin-bottom:0; } } } ul{ list-style:disc; } a{ text-decoration:underline; &:hover{ text-decoration:none; } } } /* server */ .menu-top-server{ a{ color:red; &:hover{ color:@colA; } } } .server{ padding:130px 0 30px; } .server-row{ display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; font-size:0; } .server-col{ display:inline-block; vertical-align:top; -webkit-flex-shrink:0; -ms-flex-negative:0; flex-shrink:0; } .server-img{ width:334px; img{ width:100%; display:block; } } .server-desc{ display:inline-block; vertical-align:top; width:866px; -webkit-box-flex:1; -webkit-flex-grow:1; -ms-flex-positive:1; flex-grow:1; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; font-size:15px; color:#000; } .server-desc-head{ background:#eee; padding:25px; } .server-title{ text-align:center; color:@colA; font-weight:700; font-size:30px; line-height:1; margin-bottom:12px; } .server-list{ padding-left:70px; max-width:705px; text-align:justify; li{ padding-left:95px; position:relative; margin-bottom:5px; &:last-child{ margin-bottom:0; } } [class^="server-icon-"]{ position:absolute; top:0; left:0; } } [class^="server-icon-"]{ display:inline-block; width:47px; height:44px; .bg('../img/server-icons.png',47px,528px); } .server-icon-2{ background-position:0 -44px; } .server-icon-3{ background-position:0 -88px; } .server-icon-4{ background-position:0 -132px; } .server-icon-5{ background-position:0 -176px; } .server-icon-6{ background-position:0 -220px; } .server-icon-7{ background-position:0 -264px; } .server-icon-8{ background-position:0 -308px; } .server-icon-9{ background-position:0 -352px; } .server-icon-10{ background-position:0 -396px; } .server-icon-11{ background-position:0 -440px; } .server-icon-12{ background-position:0 -484px; } .server-list-title{ color:@colA; text-transform:uppercase; font-weight:700; } .server-desc-body{ padding:25px; } .server-desc-footer{ background:#eee; padding:25px; } .server-desc-col{ display:inline-block; float:left; text-align:center; width:25%; .title{ font-weight:700; text-transform:uppercase; color:@colA; } .num{ color:#008e45; font-family:Arial Black, Arial Black, Gadget, sans-serif; font-size:18px; } .num-desc{ color:#008e45; font-size:10px; text-transform:uppercase; font-weight:700; } } .server-btn-wrapp{ padding-top:25px; text-align:center; .services-btn{ width:350px; } } .footer-tels{ color:#fff; padding-bottom:15px; } .center-text{ text-align:center; } .calc-input-asvdc{ overflow:visible; background:transparent; border:0; font-size:14px; width:80px; color:#000; } /* */ .header-slider{ height:760px; overflow:hidden; } .header-slide{ position:relative; } .slick-prev, .slick-next{ font-size:0; border:0; position:absolute; top:50%; background:none; width:25px; height:25px; border-right:solid 3px #fff; border-top:solid 3px #fff; z-index:1; } .slick-prev{ left:20px; -webkit-transform:translateY(-50%) rotate(225deg); -moz-transform:translateY(-50%) rotate(225deg); -o-transform:translateY(-50%) rotate(225deg); -ms-transform:translateY(-50%) rotate(225deg); transform:translateY(-50%) rotate(225deg); } .slick-next{ right:20px; -webkit-transform:translateY(-50%) rotate(45deg); -moz-transform:translateY(-50%) rotate(45deg); -o-transform:translateY(-50%) rotate(45deg); -ms-transform:translateY(-50%) rotate(45deg); transform:translateY(-50%) rotate(45deg); } .services-tabs-nav{ display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; font-size:20px; font-weight:700; li{ -webkit-box-flex: 1; -webkit-flex: 1 0 auto; -ms-flex: 1 0 auto; flex: 1 0 auto; border:solid 1px @colA; .br(20px 20px 0 0); width:50%; overflow:hidden; } li+li{ margin-left:-1px; } a{ display:block; padding:20px; text-align:center; background:@colA; color:#fff; .t(.2s); &:hover{ background:lighten(@colA,10%); } } .active{ border-bottom:0; a{ pointer-events:none; background:#fff; color:@colA; color:none; } } } .services-body{ padding:40px 0 20px; border:solid 1px @colA; border-top:0; } .services-wrapp{ margin:0; } .contacts{ padding-top:30px; .section-title{ margin-bottom:30px; } } .contacts-row{ } .contacts-map{ display:inline-block; float:left; width:70%; min-height:1px; } .contacts-data{ display:inline-block; float:left; width:30%; padding-left:15px; } .contacts-block{ margin-bottom:30px; .title{ font-weight:700; margin-bottom:10px; color:#333; } } .header-contacts{ background:none; .head{ position:static; background:#333; } } .cabinet{ text-decoration:underline; &:hover{ text-decoration:none!important; } i{ margin-right:5px; } } .contacts-block-client{ font-size:13px; } /* */ .tasks{ padding:30px 0 40px; } .tasks-list{ display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; -webkit-box-pack:justify; -webkit-justify-content:space-between; -ms-flex-pack:justify; justify-content:space-between; text-align:center; margin-top:10px; color:@colH; li{ max-width:200px; } [class^="services-icon-"], img{ display:block; position:static; margin:0 auto 5px; } a{ color:inherit; display:inline-block; .t(.2s); &:hover{ color:@colA; } } } .section-title-text{ text-align:center; margin-top:10px; } .index{ .head{ padding:15px; background:none; z-index:66; } .header-slider, .header-slide{ height:~'calc(100vh - 261px)'; height:~'-webkit-calc(100vh - 261px)'; min-height:500px; max-height:760px; } .header-slide{ &>img{ display:none; } .header-desc{ top:0; right:0; bottom:0; left:0; padding:137px 0 20px; display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; -webkit-box-orient:vertical; -webkit-box-direction:normal; -webkit-flex-direction:column; -ms-flex-direction:column; flex-direction:column; -webkit-box-pack:center; -webkit-justify-content:center; -ms-flex-pack:center; justify-content:center; text-align:center; } .main-title{ span{ &:before, &:after{ display:none; } } } } } .main-slide-btn{ margin-top:15px; max-width:300px; margin:15px auto 0; } .advantages{ padding:60px 0; // border-bottom:solid 1px #ccc; } .about{ padding:60px 0; border-bottom:solid 1px #ccc; } .advantages-list{ display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; -webkit-box-pack:justify; -webkit-justify-content:space-around; -ms-flex-pack:justify; justify-content:space-around; text-align:center; margin-top:40px; color:@colH; text-transform:uppercase; li{ max-width:200px; } img{ display:block; position:static; margin:0 auto 20px; height:100px; max-width:120px; } } .advantages-text-top{ font-weight:700; font-size:.8em; } .advantages-text-center{ font-weight:700; font-size:1.2em; } .content-text{ margin-top:40px; } .index{ .footer-info{ display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; -webkit-box-pack:center; -webkit-justify-content:center; -ms-flex-pack:center; justify-content:center; margin:30px 0 -30px; p{ padding:0 30px; } } .menu-footer{ display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; margin:0 -10px -5px; li+li{ margin:0; padding:0 10px 5px; } } .footer-logo{ margin:0; } .footer-content-cell{ vertical-align:middle; } .services{ .section-title{ margin-top:0; } } } .header-mail{ i{ margin-right:5px; } } .advantages-list-main{ margin-bottom:80px; } .tasks{ background:#efefef; border:0; }