@import url("https://netdna.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css"); @font-face { font-family: "Roboto"; /* Имя шрифта */ src: url(../fonts/RobotoRegular.ttf); /* Путь к файлу со шрифтом */ } @font-face { font-family: "Roboto Light"; /* Имя шрифта */ src: url(../fonts/RobotoLight.ttf); /* Путь к файлу со шрифтом */ } @font-face { font-family: "RobotoCondensed"; /* Имя шрифта */ src: url(../fonts/roboto_condensed.ttf); /* Путь к файлу со шрифтом */ } @font-face { font-family: "FontAwesome"; /* Имя шрифта */ src: url(../fonts/fontawesome-webfont.ttf); /* Путь к файлу со шрифтом */ } html, body { margin: 0; padding: 0; } body { min-width: 100%; min-height: 100vh; position: relative; font-family: "Roboto"; } .fa { font-family: "FontAwesome"; } .wrapper { width: 100%; } .white-text { color: #fff; } header { color: #fff; background: transparent; margin: 0; padding: 0; } footer { overflow: hidden; position: relative; padding: 30px 0; background: #f1f4f7; color: #fff; } footer .navbar-nav> li { padding: 10px 0px 10px 27px; } footer .navbar-nav> li> a { color: #5e6977; font-size: 15px; font-weight: bold; padding: 0; } footer.gr .navbar-nav> li> a { font-size: 14px; } footer .container-pg .navbar-nav> li { padding: 38px 0px 0 15px; } .container-pg .navbar { position: relative; min-height: 50px; margin-bottom: 0; } footer .divider { height: 1px; width: 100%; background: #e1e8ee; margin: 30px 0; } .copyright { color: #bdc6cf; text-align: center; } .social { text-align: right; } .social a { color: #adafb7; font-size: 17px; margin-left: 12px; } header .navbar { position: absolute; top: 0; width: 100%; background: transparent; z-index: 4; } .header-adr { font-size: 16px; font-family: "Roboto Light"; margin-top: 30px; margin-bottom: 5px; } .header-adr .fa { color: #758695; margin: 0 8px 0 20px; } .center-text { text-align: center; } .left-text { text-align: left; } h1 { font-size: 54px; line-height: 1.4; } h2 { font-size: 48px; font-family: "Roboto Light"; color: #358ed7; margin-bottom: 30px; text-align: center; } h3 { font-size: 24px; color: rgb(255, 152, 0); } h4 { font-size: 28px; font-family: "Roboto Light"; color: #358ed7; } .wrapper-pg h2 { margin-top: 62px; margin-bottom: 10px; } .wrapper-pg .top { padding: 130px 0 70px; } .btn-round { box-sizing: content-box; padding: 17px 45px; border-radius: 27px; margin-top: 35px; font-weight: bold; font-size: 14px; } .btn-blue { background: #358ed7; color: #fff; } .btn-white, .btn-white:focus, .btn-white:active, #top .btn-white:hover { background: #fff; color: #358ed7; } .btn-square { box-sizing: content-box; padding: 9px 16px; border-radius: 4px; } .btn-orange { background: #ff9800; color: #fff; } .triangle-top { position: relative; } .triangle-top:before { position: absolute; content: ''; width: 0; height: 0; left: 50%; top: 0; border-right: 24px solid transparent; border-top: 21px solid #f2f2f2; -moz-transform: scale(0.999); -webkit-backface-visibility: hidden; } .triangle-top:after { position: absolute; content: ''; width: 0; height: 0; top: 0; right: 50%; border-left: 24px solid transparent; border-top: 21px solid #f2f2f2; -moz-transform: scale(0.999); -webkit-backface-visibility: hidden; } .top-shadow { box-shadow: inset 0px 0px 6px 4px gainsboro; } /*nav*/ header .navbar-nav> li { padding: 10px 8px; } header .navbar-nav> li> a { color: #fff; font-size: 20px; padding: 17px 14px; } header.gr .navbar-nav> li> a { font-size: 19px; padding: 17px 14px 17px 0; } header .navbar-nav> li> a.btn { padding: 11px 16px; color: #fff; font-size: 15px; margin-top: 6px; } header .navbar-nav> li> a:hover { background: transparent; text-decoration: underline; } header .navbar-nav> li> a.btn:hover { text-decoration: underline; background: #ff9800; } .navbar-brand { margin-top: -56px; } .navbar-brand-pg { margin-top: -58px; } .section { padding-top: 30px; padding-bottom: 30px; } .top-line { background: #fff; color: #358ed7; padding: 15px 0; text-align: center; } /*верхний блок*/ #top { background: url('../images/project/bg-main.jpg') center top no-repeat; background-size: cover; padding: 170px 0 60px; } .cover { top: 200px; } #top h1, #top p, #top a:hover { color: #fff; } #top p { font-size: 15px; } .top-img { position: relative; margin-top: 40px; margin-bottom: 15px; } .top-img img {} .top { padding: 130px 0 100px; background-size: cover; } .top h2 { font-family: "Roboto"; font-weight: bold; color: #fff; } .top-bg-1 { background: url('../images/top-bg-1.jpg') center top; } .top-bg-2 { background: url('../images/top-bg-2.jpg') center top; } .top-bg-3 { background: url('../images/top-bg-3.jpg') center top; } .top-bg-4 { background: url('../images/top-bg-4.jpg') center top; } .logo-2 { margin-top: 72px; } /**/ .grey-bg { background: #f2f2f2; } /**/ .project { height: 350px; background: #fff; border-radius: 3px; overflow: hidden; box-shadow: 2px 4px 7px 0 gainsboro; text-align: left; margin: 15px 0; } .project-img { height: 260px; text-align: center; min-width: 100%; object-fit: cover; } .project-name { color: #000; font-size: 16px; margin: 20px 15px 10px 15px; } .project-place { color: #86939e; font-size: 13px; margin: 0 15px; } .license { height: 350px; background: transparent; border-radius: 3px; overflow: hidden; margin: 15px 0; } .license-img { height: 100%; width: auto; object-fit: contain; } /*steps*/ .steps-wrapper { margin: 30px 0 40px; } .steps { font-size: 24px; color: #358ed7; font-weight: bold; border-bottom: 2px dashed #358ed7; display: inline; } .steps-number { display: inline-block; vertical-align: middle; background: #358ed7; color: #fff; font-size: 13px; text-align: center; border-radius: 50%; width: 23px; height: 23px; line-height: 23px; margin-left: 12px; margin-bottom: 5px; } .steps-done { color: #cacaca; border-bottom: medium none; } .steps-number.steps-done { background: #cacaca; color: #fff; } .steps-line { width: 46%; right: -22%; margin-top: -17px; height: 2px; background: #358ed7; position: absolute; } .steps-line.steps-done { background: #cacaca; } .steps-img { width: 100%; /*background: url('../images/project/steps.png') right center no-repeat;*/ margin: 10px; box-shadow: 0 0 14px 6px #eee; overflow: hidden; } .steps-img img { height: 100%; } #steps ul { margin-top: 30px; } #steps ul li { /*list-style-type: circle #358ed7;*/ text-align: left; color: #358ed7; font-size: 17px; margin: 7px 0; } #steps ul li span { color: #000; } /*benefits*/ #benefits { text-align: center; background: url('../images/project/bg-benefits.png') no-repeat; background-size: cover; padding-top: 40px; } #benefits p { font-size: 20px; line-height: 1.7; margin-top: 40px; margin-bottom: 70px; text-align: justify; } #benefits h2, #benefits p, #link h2 { color: #fff; } /**/ .license-img, .license-img img { width: 100%; } .partners { margin: 50px 0; } .partners .license-img { display: table-cell; vertical-align: middle; height: 200px; } #contacts { font-size: 16px; line-height: 3; } #contacts .fa { color: #358ed7; margin-right: 7px; } #map { width: 100%; height: 400px; } /*form*/ #link { background: #358ed7 url(../images/project/bg-link.png) right center no-repeat; background-size: contain; } .link-input, #link textarea { width: 100%; padding: 10px; box-sizing: border-box; border-radius: 3px; border: medium none; outline: none; } .link-input { height: 45px; margin: 3px 0px 20px; } #link textarea { margin: 3px 0px 40px; height: 170px; } #link label { color: #fff; text-align: left; font-size: 12px; text-transform: uppercase; font-weight: bold; line-height: 1.2; letter-spacing: 1px; } #link form { text-align: left; } .hq-text { position: relative; padding: 50px; color: #86939e; text-align: left; } .hq-text:before, .hq-text:after { color: #0087ca; font-size: 60px; line-height: 0.333; font-weight: bold; position: absolute; } .hq-text:before { content: '«'; top: 50px; left: 4px; } .hq-text:after { content: '»'; bottom: 70px; right: 4px; } #about { text-align: left; margin-top: 70px; } #about p { text-align: justify; } .about-text { color: #0087ca; font-size: 30px; font-family: "Roboto Light"; margin-top: 30px; } .about-text:before { content: "—"; position: absolute; top: -14px; left: 15px; } .news-item { width: 100%; height: 280px; background: #fff; border-radius: 7px; box-shadow: 2px 4px 7px 0 gainsboro; overflow: hidden; text-align: left; padding-right: 20px; margin: 15px 0; } .news-img { width: 33%; height: 100%; float: left; margin-right: 20px; } .news-name { font-size: 17px; font-family: "RobotoCondensed"; color: #418fde; text-decoration: none; cursor: pointer; margin-top: 20px; display: block; height: 48px; } .news-name:hover { color: #418fde; text-decoration: underline; } .news-text { color: #6a6e75; margin-top: 20px; height: 150px; } .news-sign { color: #9fa4af; } .license-image img { width: 100%; max-width: 500px; } .news-pdf-wrapper { width: 100%; height: 1250px; background: #fff; margin-bottom: -5px; overflow-x: hidden; } .partners { padding: 30px 0; /*border-bottom: 1px solid #d5e4e7;*/ } .partners-text { color: #43484d; text-align: left; line-height: 1.7em; } .partners-img { height: 100%; display: table-cell; } .partners-img img { width: 100%; max-width: 200px; margin: 15px 0; } @import url(//fonts.googleapis.com/css?family=Roboto+Slab:400); .top-pg { background: #000; position: relative; /*height: 743px;*/ } .cover { position: absolute; left: 0; z-index: 2; width: 100%; height: 100%; } .tv { position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; overflow: hidden; } .tv .screen { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1; margin: auto; opacity: 0; transition: opacity .5s; } .tv .screen.active { opacity: 1; } .object-text { width: 80%; margin: 0 auto; text-align: left; } .object-text img { max-width: 100%; } .galleria { height: 800px; margin: 15px auto; } .galleria>div { background: transparent; } .galleria-thumbnails { margin: auto; } .video { width: 689px; height: 397px; } @media(min-width: 1200px) { .wrapper { min-height: calc(100vh - 212px); } .header-adr { text-align: center; } .navbar-brand> img { margin-top: 4px; } header .navbar-pg .navbar-nav> li { padding: 19px 8px 10px; } header .navbar-right { margin-left: -20px; } header.gr .navbar-right { float: left !important; } } @media(min-width: 992px) and (max-width: 1199px) { .wrapper { min-height: calc(100vh - 212px); } .header-adr { text-align: right; } .navbar-brand>img { margin-top: 6px; } .navbar-brand { margin-top: -58px; } .navbar-brand-pg { margin-top: -69px; } .gr .navbar-collapse { padding: 0; } header .navbar-nav> li> a { color: #fff; font-size: 15px; padding: 17px 6px; } header.gr .navbar-nav> li> a { font-size: 16px; padding: 17px 12px 17px 0; } footer .navbar-nav> li { padding: 8px 0px 10px 15px; } footer.gr .navbar-nav> li { padding: 10px 0px 10px 15px; } footer .navbar-nav> li> a { font-size: 15px; } footer.gr .navbar-nav> li> a { font-size: 12px; } .top-pg { /*height: 643px;*/ } .news-item { padding-left: 20px; } .video { width: 689px; height: 397px; } .project { height: 290px; } .project-name { margin: 15px 15px 5px 15px; } .project-img { height: 200px; } } @media(min-width: 768px) and (max-width: 991px) { .wrapper { min-height: calc(100vh - 186px); } h1 { font-size: 44px; } h2 { font-size: 42px; } .navbar-brand> img { width: 160px; margin-top: 15px; } .navbar-brand> img { margin-top: 13px; } header .navbar-nav> li { padding: 10px 0; } header .navbar-nav> li> a { font-size: 15px; padding: 7px 8px; } header.gr .navbar-nav> li> a { font-size: 13px; } header .navbar-nav> li> a.btn { padding: 8px 8px; font-size: 13px; margin-top: -2px; } footer { text-align: center; } footer .navbar-nav> li { padding: 10px 0px 10px 15px; } .header-adr { font-size: 13px; text-align: right; } .project, .license-img { text-align: center; margin: 10px auto; } .partners .license-img { height: 100px; } .news-item { margin: 10px 0; padding-left: 15px; } .news-img { display: none; } .top-pg { /*height: 443px;*/ } .video { width: 558px; height: 315px; } /**/ /**/ .navbar-toggle { display: block; float: right; } .navbar-toggle.collapsed .icon-bar { display: block; background: #fff; } .navbar-toggle .icon-bar { display: none; } .navbar-toggle.collapsed .icon-close { display: none; } .navbar-toggle .icon-close { font-size: 50px; line-height: 20px; font-family: LabGrotesque-Black; } .navbar-collapse { width: auto; border-top: 0; -webkit-box-shadow: none; box-shadow: none; } .navbar-collapse.collapse { display: none !important; } .navbar-nav> li { float: none; display: block; } .navbar-header { width: 100%; } .collapse.in { display: block !important; } } @media(max-width: 767px) { .wrapper { min-height: calc(100vh - 186px); } .top-pg { /*height: 423px;*/ } h1 { font-size: 23px; } h2 { font-size: 26px; } h3 { font-size: 19px; } h4 { font-size: 21px; } #top h1 { font-size: 23px; } .header-adr { display: none; } .navbar-brand { width: 200px; } .navbar-brand> img { width: 60%; margin: 0 auto; } .navbar-brand { margin-top: 0; } header .navbar-collapse { background: #fff; } header .navbar-nav { margin: 0 -7px 7.5px; } header .navbar-nav> li { background: #fff; } header .navbar-nav> li:first-child { padding-top: 35px; } header .navbar-nav> li> a { color: #000; padding: 1px; text-align: center; } footer, .copyright { text-align: center; } .navbar-toggle { background-color: transparent; position: absolute; right: 0px; } .navbar-toggle .icon-bar { background: #fff; } #top { padding: 120px 0 60px; } .logo-2 { margin-top: 30px; } .cover { top: 90px; } .top-img { margin-top: 15px; } .top { padding: 60px 0 30px; } .wrapper-pg .top { padding: 70px 0 30px; } .project, .license-img { text-align: center; margin: 10px auto; max-width: 349px; } .partners .license-img { height: 100px; } .partners img { margin: 0 auto 34px; max-width: 200px; } .partners { padding: 10px 0; margin: 15px 0; text-align: center; } .steps-line { display: none; } .steps-img { width: unset; } .steps-img img { height: unset; width: 100%; } .left-text h4 { text-align: center; } #benefits { padding-top: 17px; } #benefits p { font-size: 17px; margin-top: 0px; margin-bottom: 10px; } .hq-text { padding: 30px 35px; } .hq-text:before, .hq-text:after { font-size: 38px; } .hq-text:before { top: 35px; left: 0; } .hq-text:after { bottom: 52px; right: 0; } .navbar-brand-pg { margin-top: 0px; } .navbar-brand> img { width: 100%; max-width: 200px; } .navbar-toggle { margin-top: 11px; } .news-item { margin: 10px 0; padding-left: 15px; } .news-img { display: none; } .top-pg .top-img { display: none; } .section, #about { margin-top: 0; padding-top: 30px; margin-bottom: 0px; padding-bottom: 30px; } .triangle-top { margin-top: -2px; } .about-text { margin-top: 0; margin-bottom: 15px; } .about-text:before { content: ""; } .object-text { width: 90%; } .galleria { height: 300px; } .video { width: 320px; height: 183px; } }