|
@@ -0,0 +1,625 @@
|
|
|
+* {
|
|
|
+ margin: 0;
|
|
|
+ padding: 0;
|
|
|
+ vertical-align: top;
|
|
|
+ color: inherit;
|
|
|
+ font-family: 'Roboto', sans-serif;
|
|
|
+ -webkit-transition: all .3s ease;
|
|
|
+ -moz-transition: all .3s ease;
|
|
|
+ transition: all .3s ease;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ font-size: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+input::-moz-placeholder {
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+textarea::-moz-placeholder {
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+textarea::-webkit-input-placeholder {
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+input::-webkit-input-placeholder {
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+img {
|
|
|
+ max-width: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.container {
|
|
|
+ width: 1200px;
|
|
|
+ max-width: 90%;
|
|
|
+ margin: 0 auto;
|
|
|
+ /*position: relative;*/
|
|
|
+}
|
|
|
+
|
|
|
+.sm {
|
|
|
+ display: none !important;
|
|
|
+}
|
|
|
+
|
|
|
+a {
|
|
|
+ text-decoration: none;
|
|
|
+}
|
|
|
+
|
|
|
+section {
|
|
|
+ margin-top: 60px;
|
|
|
+}
|
|
|
+
|
|
|
+.left, .right {
|
|
|
+ display: inline-block;
|
|
|
+ width: 49%;
|
|
|
+}
|
|
|
+
|
|
|
+.left {
|
|
|
+ text-align: left;
|
|
|
+}
|
|
|
+
|
|
|
+.right {
|
|
|
+ /*text-align: right;*/
|
|
|
+}
|
|
|
+
|
|
|
+.quater {
|
|
|
+ display: inline-block;
|
|
|
+ width: 24.5%;
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+.three {
|
|
|
+ width: 48%;
|
|
|
+ display: inline-block;
|
|
|
+ vertical-align: top;
|
|
|
+}
|
|
|
+
|
|
|
+.small-three {
|
|
|
+ width: 25%;
|
|
|
+}
|
|
|
+
|
|
|
+.border-btn {
|
|
|
+ width: 180px;
|
|
|
+ max-width: 90%;
|
|
|
+ height: 50px;
|
|
|
+ line-height: 50px;
|
|
|
+ display: inline-block;
|
|
|
+ text-align: center;
|
|
|
+ color: #33aefd;
|
|
|
+ border: 1px solid #33aefd;
|
|
|
+ text-transform: uppercase;
|
|
|
+}
|
|
|
+
|
|
|
+.phone {
|
|
|
+ font-size: 27px;
|
|
|
+}
|
|
|
+
|
|
|
+/*header styles*/
|
|
|
+
|
|
|
+header {
|
|
|
+ background-image: url(../img/bg.png);
|
|
|
+ border-bottom: 1px solid #fff;
|
|
|
+ background-size: 100%;
|
|
|
+ background-size: cover;
|
|
|
+ background-position: center center;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+header .top-mnu {
|
|
|
+ min-height: 130px;
|
|
|
+ line-height: 130px;
|
|
|
+ background-color: rgba(255, 255, 255, .7);
|
|
|
+ width: 100%;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ z-index: 99;
|
|
|
+}
|
|
|
+
|
|
|
+header .top-mnu .logo {
|
|
|
+ vertical-align: middle;
|
|
|
+}
|
|
|
+
|
|
|
+nav ul li {
|
|
|
+ text-transform: uppercase;
|
|
|
+ display: inline-block;
|
|
|
+ color: #000;
|
|
|
+ font-size: 17px;
|
|
|
+ text-align: center;
|
|
|
+ width: 30%;
|
|
|
+}
|
|
|
+
|
|
|
+nav ul li:hover {
|
|
|
+ color: #33aefd;
|
|
|
+}
|
|
|
+
|
|
|
+nav ul li:last-child:after {
|
|
|
+ display: none;
|
|
|
+}
|
|
|
+
|
|
|
+.top-mnu .contacts {
|
|
|
+ text-align: right;
|
|
|
+ line-height: 50px;
|
|
|
+}
|
|
|
+
|
|
|
+/*//slider*/
|
|
|
+.slider {
|
|
|
+ padding: 250px 0;
|
|
|
+ background-color: rgba(0, 0, 0, .6);
|
|
|
+ /*padding: 55px 0 60px;*/
|
|
|
+}
|
|
|
+
|
|
|
+.slider .slide-item {
|
|
|
+ text-align: center;
|
|
|
+}
|
|
|
+
|
|
|
+h1 {
|
|
|
+ text-transform: uppercase;
|
|
|
+ color: #fff;
|
|
|
+ font-size: 30px;
|
|
|
+ line-height: 80px;
|
|
|
+ font-weight: 200;
|
|
|
+}
|
|
|
+
|
|
|
+.slider h2 {
|
|
|
+ font-size: 23px;
|
|
|
+ color: #fff;
|
|
|
+ font-weight: 200;
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
+img.stripe-block {
|
|
|
+ position: absolute;
|
|
|
+ top: 10%;
|
|
|
+ width: 90%;
|
|
|
+ z-index: -1;
|
|
|
+}
|
|
|
+
|
|
|
+.em {
|
|
|
+ color: #33aefd;
|
|
|
+}
|
|
|
+
|
|
|
+.common-h2 {
|
|
|
+ text-align: center;
|
|
|
+ font-size: 30px;
|
|
|
+ margin: 40px auto;
|
|
|
+ max-width: 80%;
|
|
|
+ width: 740px;
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
+.common-h2 .em {
|
|
|
+ font-size: 100%;
|
|
|
+ text-transform: uppercase;
|
|
|
+}
|
|
|
+
|
|
|
+/*chess*/
|
|
|
+
|
|
|
+.chess-item {
|
|
|
+ text-align: center;
|
|
|
+ display: inline-block;
|
|
|
+ font-size: 23px;
|
|
|
+ position: relative;
|
|
|
+ box-sizing: padding-box;
|
|
|
+ margin-top: 40px;
|
|
|
+}
|
|
|
+
|
|
|
+.row.top .chess-item {
|
|
|
+ width: 32%;
|
|
|
+}
|
|
|
+
|
|
|
+.row.bottom .chess-item {
|
|
|
+ width: 49%;
|
|
|
+}
|
|
|
+
|
|
|
+.chess-item p:before {
|
|
|
+ content: " ";
|
|
|
+ display: block;
|
|
|
+ width: 140px;
|
|
|
+ height: 140px;
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+ background-image: url(../img/l-stripe.png);
|
|
|
+ background-repeat: no-repeat;
|
|
|
+}
|
|
|
+
|
|
|
+.advs .chess-item p:before {
|
|
|
+ display: none;
|
|
|
+}
|
|
|
+
|
|
|
+.advs .chess-item:before {
|
|
|
+ content: " ";
|
|
|
+ display: block;
|
|
|
+ width: 140px;
|
|
|
+ height: 140px;
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ top: 0;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ color: #b0e0ff;
|
|
|
+ font-size: 200px;
|
|
|
+ line-height: 140px;
|
|
|
+ font-weight: 900;
|
|
|
+}
|
|
|
+
|
|
|
+.advs .row.top .chess-item:nth-child(1):before {
|
|
|
+ content: "1 ";
|
|
|
+}
|
|
|
+
|
|
|
+.advs .row.top .chess-item:nth-child(2):before {
|
|
|
+ content: "2";
|
|
|
+}
|
|
|
+
|
|
|
+.advs .row.top .chess-item:nth-child(3):before {
|
|
|
+ content: "3 ";
|
|
|
+}
|
|
|
+
|
|
|
+.advs .row.bottom .chess-item:nth-child(1):before {
|
|
|
+ content: "4 ";
|
|
|
+}
|
|
|
+
|
|
|
+.advs .row.bottom .chess-item:nth-child(2):before {
|
|
|
+ content: "5";
|
|
|
+}
|
|
|
+
|
|
|
+.chess-item p {
|
|
|
+ position: relative;
|
|
|
+ max-width: 400px;
|
|
|
+ margin: 0 auto;
|
|
|
+ padding: 40px 0;
|
|
|
+ text-align: left;
|
|
|
+ padding-left: 40px;
|
|
|
+}
|
|
|
+
|
|
|
+section h1 {
|
|
|
+ position: relative;
|
|
|
+ display: inline-block;
|
|
|
+ color: #000;
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
+section h1:after {
|
|
|
+ content: "";
|
|
|
+ display: block;
|
|
|
+ position: absolute;
|
|
|
+ width: 90px;
|
|
|
+ height: 1px;
|
|
|
+ background-color: #33aefd;
|
|
|
+ top: 50%;
|
|
|
+ right: -50%;
|
|
|
+}
|
|
|
+
|
|
|
+section h1.rev:after {
|
|
|
+ left: -50%;
|
|
|
+}
|
|
|
+
|
|
|
+.accept,
|
|
|
+.advs {
|
|
|
+ background-image: url(../img/bg2.png);
|
|
|
+ -webkit-background-size: cover;
|
|
|
+ background-size: cover;
|
|
|
+ padding-bottom: 20px;
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
+.accept .common-h2 {
|
|
|
+ font-weight: 100;
|
|
|
+}
|
|
|
+
|
|
|
+.border-btn.rev {
|
|
|
+ color: #fff;
|
|
|
+ background-color: #33aefd;
|
|
|
+ display: block;
|
|
|
+ margin: 0 auto;
|
|
|
+}
|
|
|
+
|
|
|
+.nine-item {
|
|
|
+ text-align: center;
|
|
|
+ display: inline-block;
|
|
|
+ width: 19.5%;
|
|
|
+ margin-top: 50px;
|
|
|
+ vertical-align: text-bottom;
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
+.nine-item img {
|
|
|
+ max-width: 40%;
|
|
|
+}
|
|
|
+
|
|
|
+.nine-p {
|
|
|
+ font-size: 16px;
|
|
|
+ margin-top: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.row.bottom-9 .nine-item .img {
|
|
|
+ transform: translateX(50%);
|
|
|
+}
|
|
|
+
|
|
|
+.advs h2 {
|
|
|
+ text-align: left;
|
|
|
+ font-weight: 400;
|
|
|
+}
|
|
|
+
|
|
|
+.advs .chess-item p {
|
|
|
+ padding-top: 20px;
|
|
|
+ font-size: 16px;
|
|
|
+}
|
|
|
+
|
|
|
+.advs .chess-item p.h2 {
|
|
|
+ padding-bottom: 0;
|
|
|
+ padding-top: 40px;
|
|
|
+ text-transform: uppercase;
|
|
|
+ font-size: 28px;
|
|
|
+}
|
|
|
+
|
|
|
+.advs .row.bottom .chess-item {
|
|
|
+ width: 33%;
|
|
|
+ transform: translateX(50%);
|
|
|
+}
|
|
|
+
|
|
|
+.async .row.top,
|
|
|
+.async .row.bottom {
|
|
|
+ position: relative;
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
+.async .text-img {
|
|
|
+ background-image: url(../img/bg3.png);
|
|
|
+ -webkit-background-size: cover;
|
|
|
+ background-size: cover;
|
|
|
+ display: inline-block;
|
|
|
+ margin: 100px 0;
|
|
|
+ width: 700px;
|
|
|
+ max-width: 60%;
|
|
|
+ min-height: 500px;
|
|
|
+ text-align: left;
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
+.async .row.top img,
|
|
|
+.async .row.bottom img {
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ max-width: 48%;
|
|
|
+ z-index: -1;
|
|
|
+}
|
|
|
+
|
|
|
+.async .row.top img {
|
|
|
+ right: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.async .row.bottom img {
|
|
|
+ left: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.async .row.bottom {
|
|
|
+ text-align: right;
|
|
|
+}
|
|
|
+
|
|
|
+.text-img {
|
|
|
+ padding: 40px;
|
|
|
+}
|
|
|
+
|
|
|
+.text-img .head {
|
|
|
+ font-size: 50px;
|
|
|
+ font-weight: bold;
|
|
|
+ text-transform: uppercase;
|
|
|
+ width: 50%;
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
+.container.h1-rev {
|
|
|
+ text-align: right;
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
+.content {
|
|
|
+ max-width: 70%;
|
|
|
+ padding-left: 100px;
|
|
|
+ position: relative;
|
|
|
+ margin-top: 20px;
|
|
|
+ /*font-size: 20px;*/
|
|
|
+ max-width: 370px;
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
+.content:after {
|
|
|
+ content: "";
|
|
|
+ display: block;
|
|
|
+ position: absolute;
|
|
|
+ width: 70px;
|
|
|
+ height: 1px;
|
|
|
+ background-color: #33aefd;
|
|
|
+ top: 17px;
|
|
|
+ left: 0%;
|
|
|
+}
|
|
|
+
|
|
|
+.content * {
|
|
|
+ padding-top: 10px;
|
|
|
+ font-size: 17px;
|
|
|
+}
|
|
|
+
|
|
|
+.serv-type {
|
|
|
+ margin-top: 10px;
|
|
|
+ list-style-type: none;
|
|
|
+}
|
|
|
+
|
|
|
+.serv-type li:before {
|
|
|
+ content: " ";
|
|
|
+ display: inline-block;
|
|
|
+ width: 5px;
|
|
|
+ height: 5px;
|
|
|
+ background-color: #33aefd;
|
|
|
+ margin-right: 10px;
|
|
|
+ margin-left: 10px;
|
|
|
+ vertical-align: middle;
|
|
|
+}
|
|
|
+
|
|
|
+.icons-item {
|
|
|
+ display: inline-block;
|
|
|
+ width: 24%;
|
|
|
+ text-align: center;
|
|
|
+ vertical-align: bottom;
|
|
|
+ margin-top: 30px;
|
|
|
+}
|
|
|
+
|
|
|
+.icons-item img {
|
|
|
+ max-width: 80%;
|
|
|
+}
|
|
|
+
|
|
|
+.clients {
|
|
|
+ padding-bottom: 50px;
|
|
|
+}
|
|
|
+
|
|
|
+footer {
|
|
|
+ background-color: #33aefd;
|
|
|
+ color: #fff;
|
|
|
+ padding-top: 30px;
|
|
|
+}
|
|
|
+
|
|
|
+.sign {
|
|
|
+ border-top: 1px solid #fff;
|
|
|
+ text-align: center;
|
|
|
+ padding: 10px 0;
|
|
|
+ margin-top: 20px;
|
|
|
+}
|
|
|
+
|
|
|
+.city {
|
|
|
+ font-weight: 100;
|
|
|
+ font-size: 24px;
|
|
|
+}
|
|
|
+
|
|
|
+.addr,
|
|
|
+.mail,
|
|
|
+.phone {
|
|
|
+ font-size: 17px;
|
|
|
+ margin-top: 15px;
|
|
|
+ max-width: 330px;
|
|
|
+ font-weight: 100;
|
|
|
+}
|
|
|
+
|
|
|
+.phone {
|
|
|
+ max-width: 100%;
|
|
|
+}
|
|
|
+
|
|
|
+.num {
|
|
|
+ font-size: 30px;
|
|
|
+ margin-top: 15px;
|
|
|
+}
|
|
|
+
|
|
|
+form {
|
|
|
+ margin-top: 20px;
|
|
|
+ max-width: 330px;
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
+.field:focus {
|
|
|
+ border: 1px solid #fff;
|
|
|
+ outline: none;
|
|
|
+}
|
|
|
+
|
|
|
+.field {
|
|
|
+ border: 1px solid #fff;
|
|
|
+ width: 300px;
|
|
|
+ height: 50px;
|
|
|
+ background-color: transparent;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding-left: 5px;
|
|
|
+ margin-top: 10px;
|
|
|
+ -webkit-appearance: none;
|
|
|
+}
|
|
|
+
|
|
|
+.field.sub {
|
|
|
+ color: #33aefd;
|
|
|
+ background-color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.center {
|
|
|
+ display: inline-block;
|
|
|
+ text-align: left;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+footer .left,
|
|
|
+footer .right {
|
|
|
+ text-align: center;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+
|
|
|
+footer .left .center:after {
|
|
|
+ content: "";
|
|
|
+ display: block;
|
|
|
+ margin-top: 225px;
|
|
|
+ width: 90px;
|
|
|
+ height: 2px;
|
|
|
+ background-color: #FFF;
|
|
|
+}
|
|
|
+
|
|
|
+.content.lh {
|
|
|
+ line-height: 35px;
|
|
|
+}
|
|
|
+
|
|
|
+.error {
|
|
|
+ border: 1px solid lightcoral !important;
|
|
|
+}
|
|
|
+
|
|
|
+.popup {
|
|
|
+ background-color: #363739;
|
|
|
+ min-height: 70vh;
|
|
|
+ /*width: 380px;*/
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ right: 0;
|
|
|
+ padding: 3% 5%;
|
|
|
+ max-width: 50%;
|
|
|
+ display: none;
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+
|
|
|
+.popup .close {
|
|
|
+ width: 30px;
|
|
|
+ height: 30px;
|
|
|
+ float: right;
|
|
|
+ color: #fff;
|
|
|
+ font-size: 40px;
|
|
|
+}
|
|
|
+
|
|
|
+.popup .submit {
|
|
|
+ width: 100%;
|
|
|
+ background-color: #009bfe;
|
|
|
+ margin-top: 40px;
|
|
|
+ color: #fff;
|
|
|
+ border: none;
|
|
|
+ outline: none;
|
|
|
+ height: 50px;
|
|
|
+ line-height: 50px;
|
|
|
+ text-transform: uppercase;
|
|
|
+}
|
|
|
+
|
|
|
+.popup .title {
|
|
|
+ font-size: 30px;
|
|
|
+ color: #fff;
|
|
|
+ text-align: center;
|
|
|
+ margin-top: 60px;
|
|
|
+ margin-bottom: 5px;
|
|
|
+}
|
|
|
+
|
|
|
+.popup .nameText {
|
|
|
+ color: #6a98b0;
|
|
|
+ font-size: 20px;
|
|
|
+ text-align: left;
|
|
|
+ margin-top: 35px;
|
|
|
+ margin-bottom: 12px;
|
|
|
+}
|
|
|
+
|
|
|
+.popup .textArea {
|
|
|
+ width: 100%;
|
|
|
+ background-color: #363739;
|
|
|
+ border: solid 2px #fff;
|
|
|
+ line-height: 36px;
|
|
|
+}
|
|
|
+
|
|
|
+.popup form {
|
|
|
+ max-width: 100%;
|
|
|
+}
|