@color : #000000;
* {
	margin: 0;
	padding: 0;
}
html {
	height: 100%;
}
article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
	display: block;
}
body {
	font: 12px/18px Arial, sans-serif;
	width: 100%;
	height: 100%;
    -webkit-text-size-adjust: none;
    min-width: 1003px;
}
.wrapper {
	width: 100%;
	min-height: 100%;
	height: auto !important;
	height: 100%;
}
.bl{
    float: left;
    width: 100%;
    overflow-x: hidden;
}
.bl_center{
    width: 1003px;
    margin: 0 auto;
}
input{
    outline: none;
    -webkit-appearance: none;
}
/* Header
-----------------------------------------------------------------------------*/
.header {
	height: 705px;
	background: url(../img/top.jpg) no-repeat center 0;
    .top{
        float: left;
        width: 100%;
        height: 135px;
        color: @color;
        .logo{
            float: left;
            width: 220px;
            margin-top: 14px;
        }
        .cent{
            display: inline-block;
            width: 560px;
            text-align: center;
            font: 300 13px/14px ubuntu;
            margin-top: 26px;
        }
        .right{
            float: right;
            width: 220px;
            margin-top: 20px;
            .phone{
                float: right;
                font: 24px/24px ubuntu;
            }
            .t{
                float: right;
                clear: right;
                font: 300 12px/12px ubuntu;
                position: relative;
                right: 2px;
            }
        }
    }
    .hea_info{
        float: left;
        width: 100%;
        text-align: center;
        color: @color;
        & > span{
            float: left;
            width: 100%;
        }
        .t1{
            font: 42px/45px open sans;
            .b{
                font: 700 42px/45px open sans;
            }
        }
        .t2{
            margin: 20px 0 50px;
            font: 300 19px/24px ubuntu;
            .b{
                font: 500 19px/24px ubuntu;
            }
        }
    }
    .thank{
        float: left;
        width: 100%;
        text-align: center;
        .s1{
            float: left;
            width: 100%;
            margin: 100px 0 20px;
            color: #f26500;
            font: 39px ubuntu;
        }
        .s2{
            float: left;
            width: 100%;
            font: 300 30px ubuntu;
            color: @color;
        }
    }
}
.copy_form{
    float: left;
    padding: 30px;
    width: 700px;
    border-radius:10px;
    background: #e4e4e4;
    margin: 0 120px;
    .t1{
        float: left;
        width: 100%;
        text-align: center;
        margin-bottom: 20px;
        color: @color;
        font: 300 30px/28px ubuntu;
    }
    .lock{
        float: left;
        width: 100%;
        text-align: center;
        color: @color;
        font: 300 12px/14px ubuntu;
        margin-top: 20px;
    }
    .inp{
        float: left;
        width: 223px;
        height: 56px;
        background: #ccc;
        margin-right: 4px; 
        input{
            float: left;
            padding: 20px 33px 20px 20px;
            color: #585858;
            font: 13px arial;
            border: none;
            width: 170px;
            &.mail{
                background: url(../img/ico_mail.png) no-repeat 92% center #fff;
            }
            &.phone{
                background: url(../img/ico_phone.png) no-repeat 92% center #fff;
            }
        }
    }
    .sub{
        float: right;
        width: 244px;
        input{
            float: left;
            width: 100%;
            height: 56px;
            background: #f26500;
            border: none;
            cursor: pointer;
            color: #fff;
            font: 300 18px ubuntu;
            text-transform: uppercase;
            text-align: center;
            transition: background 0.5s ease;
            &:hover{
                background: #e74d02;
            }
        }
    }
}
form ::-webkit-input-placeholder {
    color:    #585858;
}
form :-moz-placeholder {
   color:    #585858;
   opacity:  1;
}
form ::-moz-placeholder {
   color:    #585858;
   opacity:  1;
}
form :-ms-input-placeholder {
   color:    #585858;
}
form :placeholder-shown {
  color:    #585858;
}
/* Middle
-----------------------------------------------------------------------------*/
.content {
	padding: 0 0 88px;
}
#triple{
    padding: 20px 0 18px;
    .row{
        float: left;
        width: 250px;
        &.cent{
            margin: 0 125px;
        }
        .im{
            float: left;
            width: 90px;
        }
        .text{
            display: block;
            padding-left: 90px;
            width: 100%;
            margin-top: 20px;
            color: @color;
            font: 14px/18px ubuntu;
        }
    }
}
#about{
    background: url(../img/about.jpg) no-repeat center bottom #f0f0f0;
    padding: 60px 0 55px;
    color: @color;
    .about_title{
        float: left;
        width: 100%;
        font: 40px ubuntu;
        text-align: center;
        margin-bottom: 45px;
    }
    p{
        float: left;
        width: 100%;
        margin-bottom: 20px;
        font: 300 15px/21px ubuntu;
    }
}
#table{
    padding: 78px 0;
    .table{
        width: 910px;
        margin-left: 45px;
        float: left;
        table{
            width: 100%;
            border-collapse: collapse;
            thead{
                th{
                    background: #f26500;
                    font: 500 15px/17px ubuntu;
                    text-align: left;
                    color: #fff;
                }
            }
            th,td{
                padding: 18px 24px;
                border: 2px solid #fff;
            }
            .first{
                width: 130px;
            }
            .second{
                width: 220px;
            }
            td{
                background: #f0f0f0;
                vertical-align: top;
                color: @color;
                font: 300 14px/18px open sans;
                .b{
                    font: 700 14px/18px open sans;
                }
                .list{
                    span{
                        padding: 0 0 18px 14px;
                        background: url(../img/list.png) no-repeat 0 3px;
                        float: left;
                        clear: left;
                    }
                }
            }
        }
    }
}
#six{
    padding: 65px 0 60px;
    background: #343e4b;
    color: #fff;
    .block{
        float: left;
        width: 49%;
        &:last-child{
            float: right;
        }
        .block_title{
            float: left;
            width: 100%;
            font: 500 21px/24px ubuntu;
            margin-bottom: 20px;
        }
        .row{
            float: left;
            width: 100%;
            margin-bottom: 10px;
            .im{
                float: left;
                width: 70px;
            }
            .text{
                display: block;
                padding-left: 70px;
                width: 100%;
                font: 300 15px/21px open sans;
                margin-top: -3px;
                &.d{
                    margin-top: 6px;
                }
            }
        }
    }
}
#text{
    height: 460px;
    position: relative;
    overflow: hidden;
    .block{
        float: left;
        margin-top: 70px;
    }
    p{
        float: left;
        width: 100%;
        margin-bottom: 20px;
        color: @color;
        font: 300 15px/21px ubuntu;
        .b{
            font: 700 15px/21px ubuntu;
        }
    }
    .abs_im{
        height: 461px;
        left: 53%;
        position: absolute;
        top: 0;
        z-index: 100;
        .h{
            display: block;
        }
        .h2{
            display: none;
        }
        &:hover .h{
            display: none;
        }
        &:hover .h2{
            display: block;
        }
    }
}
#double{
    height: 662px;
    background: url(../img/double.jpg) no-repeat center 0;
    .double_title{
        float: left;
        width: 100%;
        text-align: center;
        margin: 65px 0 40px;
        color: #fff;
        font: 32px/35px ubuntu;
    }
    .blocks{
        float: left;
        width: 700px;
        margin-left: 151px;
        .round{
            float: left;
            width: 303px;
            height: 303px;
            background: url(../img/round.png) no-repeat;
            text-align: center;
            &:last-child{
                float: right;
            }
            .im{
                float: left;
                width: 100%;
                margin-top: 30px;
                height: 80px;
            }
            .name{
                color: #353e4c;
                font: 500 20px ubuntu;
                float: left;
                width: 100%;
                text-transform: uppercase;
                margin-bottom: 40px;
            }
            .text{
                float: left;
                width: 100%;
                span{
                    float: left;
                    width: 100%;
                    margin-bottom:10px;
                    font: 300 15px/19px ubuntu;
                    color: #fff;
                }
            }
        }
    }
    .bot_text{
        float: left;
        width: 100%;
        text-align: center;
        margin-top: 35px;
        font: 300 14px/21px open sans;
        color: #fff;
    }
}
#big{
    padding: 70px 0 90px;
    background: url(../img/big.jpg) no-repeat center bottom #353e4c;
    .big_title{
        float: left;
        width: 100%;
        color: #fff;
        text-align: center;
        font: 36px ubuntu;
        margin-bottom: 60px;
    }
    .table{
        float: left;
        margin: 0 138px;
        width: 718px;
        table{
            width: 100%;
            border-collapse: collapse;
            th, td{
                border: 2px solid #353e4c;
                padding: 13px 35px;
            }
            th{
                background: #f26500;
                color: #fff;
                font: 500 15px ubuntu;
                text-align: left;
            }
            td{
                background: #d1d2d3;
                font: 300 15px ubuntu;
                color: @color;
                .old{
                    text-decoration: line-through;
                    display: inline-block;
                    margin-right: 10px;
                }
                .new{
                    font: 500 18px ubuntu;
                }
            }
        }
    }
    .t2{
        float: left;
        width: 100%;
        text-align: center;
        color: #fff;
        margin: 60px 0 20px;
        font: 21px/24px ubuntu;
    }
    .t3{
        float: left;
        width: 100%;
        text-align: center;
        color: #fff;
        font: 300 16px open sans;
        margin-bottom: 60px;
    }
}
.copy_rows{
    padding-top: 70px;
    background: #ededed;
        color: @color;
    .title{
        float: left;
        width: 100%;
        text-align: center;
        font: 36px ubuntu;
        margin-bottom: 55px;
    }
    .rows{
        float: left;
        width: 100%;
        margin-bottom: 65px;
        .row{
            float: left;
            width: 334px;
            .im{
                float: left;
                width: 96px;
            }
            .r{
                width: 238px;
                display: block;
                padding-left: 96px;
                .name{
                    float: left;
                    width: 100%;
                    font: 21px/21px ubuntu;
                    margin-bottom: 20px;
                }
                .text{
                    float: left;
                    width: 100%;
                    font: 300 15px/21px open sans;
                }
            }
        }
    }
}
#five{
    padding: 70px 0;
    background: #343e4b;
    color: #fff;
    text-align: center;
    .title{
        float: left;
        width: 100%;
        font: 40px ubuntu;
        margin-bottom: 50px;
    }
    .rows{
        float: left;
        width: 100%;
        .row{
            float: left;
            width: 19%;
            position: relative;
            &.big{
                width: 24%;
            }
            .im{
                float: left;
                width: 100%;
            }
            .st{
                position: absolute;
                right: 0;
                top: 29px;
                width: 13px;
                height: 27px;
                background: url(../img/st.png) no-repeat;
            }
            .text{
                float: left;
                width: 100%;
                margin-top: 30px;
                font: 300 14px/20px open sans;
            }
        }
    }
}
#suprize{
    height: 519px;
    position: relative;
    overflow: hidden;
    .title{
        float: left;
        margin: 67px 0 27px 5px;
        span{
            float: left;
            clear: left;
            padding: 8px 18px;
            color: #fff;
            background: #f26500;
            font: 36px/38px ubuntu;
            &:first-child{
                padding-bottom: 2px;
            }
            &:last-child{
                padding-top: 2px;
            }
        }
    }
    .t1{
        float: left;
        width: 100%;
        font: 24px/28px ubuntu;
        margin-bottom: 18px;
        color: @color;
    }
    .t2{
        float: left;
        width: 100%;
        font: 300 15px/21px open sans;
        margin-bottom: 18px;
        color: @color;
    }
    .last{
        float: left;
        width: 100%;
        font: 24px ubuntu;
        color: @color;
        .count{
            padding: 8px 12px;
            display: inline-block;
            color: #fff;
            background: #f26500;
        }
    }
    .abs_im{
        height: 519px;
        left: 47%;
        position: absolute;
        top: 0;
        width: auto;
        z-index: 100;
        .h{
            display: block;
        }
        .h2{
            display: none;
        }
        &:hover .h{
            display: none;
        }
        &:hover .h2{
            display: block;
        }
    }
}
#free{
    background: #ededed;
    height: 505px;
    color: @color;
    overflow: hidden;
    position: relative;
    .block{
        float: right;
        width: 530px;
        margin-top: 65px;
        .t1{
            float: left;
            width: 100%;
            font: 24px ubuntu;
            margin-bottom: 18px;
        }
        .t2{
            float: left;
            width: 100%;
            font: 300 15px/21px open sans;
            margin-bottom: 18px;
        }
        .last{
            float: left;
            width: 100%;
            font: 24px ubuntu;
            color: @color;
            .count{
                padding: 8px 12px;
                display: inline-block;
                color: #fff;
                background: #f26500;
            }
        }
    }
    .abs_im{
        height: 505px;
        right: 52%;
        position: absolute;
        top: 0;
        width: auto;
        z-index: 100;
        .h{
            display: block;
        }
        .h2{
            display: none;
        }
        &:hover .h{
            display: none;
        }
        &:hover .h2{
            display: block;
        }
    }
}
#a_company{
    padding: 65px 0 60px;
    color: @color;
    .title{
        float: left;
        width: 100%;
        text-align: center;
        font: 40px ubuntu;
        margin-bottom: 60px;
    }
    .info{
        float: left;
        width: 750px;
        .block{
            float: left;
            width: 100%;
            font: 300 15px/21px open sans;
            .b{
                font: 700 15px/21px open sans;
            }
            p{
                float: left;
                width: 100%;
                margin-bottom: 22px;
            }
            .list{
                float: left;
                width: 100%;
                margin-bottom: 18px;
                span{
                    float: left;
                    clear: left;
                    background: url(../img/list.png) no-repeat 0 5px;
                    margin-left: 23px;
                    padding-left: 12px;
                }
            }
        }
    }
    .right{
        float: right;
        width: 214px;
        .bs{
                float: left;
                width: 100%;
                padding: 27px 0 17px;
                background: #e9e9e9;
                margin-top: 5px;
            & > span{
                float: left;
                width: 100%;
                text-align: center;
            }
            .i1{
                margin: 0 0 9px;}
            .t1{
                margin: 9px 0 13px;
                color: #353e4c;
                font: 48px/24px ubuntu;
            }
            .t2{
                font: 300 14px/19px open sans;
                color: #353e4c;
            }
            &.bs3{
                padding-top: 25px;
            }
            &.bs4{
                    padding-top: 22px;
            }
            &.bs5{
                    padding-top: 22px;
            }
            
        }
    }
}

#docs{
    background: url(../img/bot.jpg) no-repeat center bottom #f1f1f1;
    padding: 65px 0;
    .title{
        float: left;
        width: 100%;
        text-align: center;
        margin-bottom: 40px;
        font: 40px ubuntu;
    }
    .docs{
        float: left;
        width: 100%;
        text-align: center;
        margin-bottom: 70px;
        a{
            display: inline-block;
            margin: 0 8px;
        }
    }
}
#bot{
    background: #353e4c;
    padding: 45px 0 48px;
    color: #b5b7c4;
    .map{
        float: left;
        width: 336px;
        height: 181px;
        background: #ccc;
    }
    .texts{
        float: left;
        margin: 30px 0 0 63px;
        width: 315px;
        span{
            float: left;
            width: 100%;
            padding: 9px 0;
            border-bottom: 1px solid #4a525e;
            font: 300 14px/17px ubuntu;
            &:last-child{
                border-bottom: none;
            }
        }
    }
    .right{
        float: right;
        width: 238px;
        margin-top: 46px;
        .block{
            float: left;
            & > span{
                float: left;
                width: 100%;
            }
        }
        .phone{
            padding-left: 22px;
            background: url(../img/ico_phone2.png) no-repeat 0 12px;
            .q1{
                font: 700 23px/23px open sans;
            }
            .q2{
                font: 300 12px open sans;
                color: #fff;
                padding-bottom: 11px;
                border-bottom: 1px solid #4a525e;
                margin-bottom: 7px;
            }
        }
        .mail{
            padding-left: 22px;
            background: url(../img/ico_mail2.png) no-repeat 0 13px;
            .q3{
                font: 700 14px open sans;
            }
            .q4{
                
                a{
                    font: 300 13px open sans;
                    text-decoration: none;
                    border-bottom: 1px dotted #fff;
                    color: #fff;
                    &:hover{
                        border-bottom: inherit;
                    }
                }
            }
        }
    }
}

/* Footer
-----------------------------------------------------------------------------*/
.footer {
	width: 100%;
	height: 88px;
    overflow: hidden;
    clear: both;
	background: #262e3a;
	position: relative;
    .logo{
        float: left;
        width: 220px;
        margin-top: 15px;
        color: #fff;
        font: 300 18px/14px open sans;
    }
    .c_text{
        float: left;
        width: 560px;
        text-align: center;
        margin-top: 23px;
        font: 300 12px/14px open sans;
        color: #8a8a8a;
    }
    .r{
        float: right;
        width: 220px;
        margin-top: 24px;
        .polit{
            float: right;
            color:#8a8a8a;
            font: 300 12px/18px open sans;
            text-decoration: none;
            border-bottom: 1px dotted #8a8a8a;
            &:hover{
                border-bottom: 1px solid #262e3a;
            }
        }
        .dew{
            float: right;
            clear: right;
            margin-top: 5px;
            color: #8a8a8a;
            font: 300 12px/18px open sans;
            a{
                font: 700 12px open sans;
                text-decoration: none;
                color: #8a8a8a;
                text-transform: uppercase;
                border-bottom: 1px dotted #fff;
                &:hover{
                    border-bottom: 1px solid #262e3a;
                }
            }
        }
    }
}
#agree {
	padding: 0 5%;
	text-align: center;
    font: 16px ubuntu;
	width: 90%;
    h1{
        float: left;
        width: 100%;
        text-align: center;
        font: 500 36px ubuntu;
        margin-bottom: 20px;
    }
}
.rotate img{
    border-radius: 50%;
    margin: 0 auto;
    -moz-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    -ms-transition: all 0.5s ease-out;
    transition: all 0.5s ease-out;
    &:hover{
      -webkit-transform: rotateY(180deg);
      -moz-transform: rotateY(180deg);
      -o-transform: rotateY(180deg);
      -ms-transform: rotateY(180deg);
      transform: rotateY(180deg);
    }
}
.over{
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 300;
    background: rgba(0,0,0,0.7);
    display: none;
    .over_center{
        width: 960px;
        position: absolute;
        left: 50%;
        margin-left: -500px;
        top: 100px;
        padding: 20px;
        background: #fff;
        border-radius: 10px;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    
    #text .abs_im,
    #suprize .abs_im{
        left: 80%;
    }
    #free .abs_im{
        right: 80%;
    }
}