@font-face {
    font-family: 'r';
    src: url('../fonts/OSregular/OpenSans-Regular-webfont.eot');
    src: url('../fonts/OSregular/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/OSregular/OpenSans-Regular-webfont.woff2') format('woff2'),
         url('../fonts/OSregular/OpenSans-Regular-webfont.woff') format('woff'),
         url('../fonts/OSregular/OpenSans-Regular-webfont.ttf') format('truetype'),
         url('../fonts/OSregular/OpenSans-Regular-webfont.svg#open_sansregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'l';
    src: url('../fonts/OSlight/OpenSans-Light-webfont.eot');
    src: url('../fonts/OSlight/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),
    url('../fonts/OSlight/OpenSans-Light-webfont.woff2') format('woff2'),
    url('../fonts/OSlight/OpenSans-Light-webfont.woff') format('woff'),
    url('../fonts/OSlight/OpenSans-Light-webfont.ttf') format('truetype'),
    url('../fonts/OSlight/OpenSans-Light-webfont.svg#open_sanslight') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'b';
    src: url('../fonts/OSbold/OpenSans-Bold-webfont.eot');
    src: url('../fonts/OSbold/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
    url('../fonts/OSbold/OpenSans-Bold-webfont.woff2') format('woff2'),
    url('../fonts/OSbold/OpenSans-Bold-webfont.woff') format('woff'),
    url('../fonts/OSbold/OpenSans-Bold-webfont.ttf') format('truetype'),
    url('../fonts/OSbold/OpenSans-Bold-webfont.svg#open_sansbold') format('svg');
    font-weight: normal;
    font-style: normal;
}

html, body {
    height: 100%;
}

body{
    font-size:14px;
    font-family:'r',Arial, Tahoma, Sans-serif;
    color:#000;
    position: relative;
    background: url(../img/bg.jpg) no-repeat top center;
}

.ROOT
{
    min-height: 100%;
}

.ROOT_PADDING
{
    padding-bottom: 140px;
}

footer
{
    height: 140px;
    margin-top: -140px;
    position: absolute;
    width: 100%;
    background: #782422;
}

header
{
    height:180px;
    border-bottom: 2px solid #e3dcd6;
    background: #f8f1ed;
}

.w
{
    width: 1200px;
    margin: 0 auto;
}

.left_block
{
    width: 20%;
    padding: 20px;
    box-sizing:border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing:border-box;
}

.content
{
    width: 80%;
    padding: 20px;
    box-sizing:border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing:border-box;
}

.css_block
{
    color:white;
    font-size:65px;
    width: 100px;
    height: 100px;
    display: table-cell;
    vertical-align: middle;
    text-align: center;

}

.color1{
    background: #e4e88a;
}
.color2
{
    background: #a6edd2;
}
.color3
{
    background: #e4bbed;
}
.color4
{
    background: #b2b2b2;
}

.bottom-logo {
    width: 222px;
    height: 77px;
    background: url(../img/q_21.png) no-repeat top left;
    float:left;
    margin-left: 50px;
    margin-top: 34px;
}

.its {
    font-size: 14px;
    color: #fff;
    font-family: 'l';
    margin-left: 96px;
    margin-top: 35px;
    float:left;
    width: 195px;
    text-align: center;
}

.its > a {
    text-transform: uppercase;
    text-decoration: underline;
    color: #fff;
}

.its > a:hover {
    text-decoration: none;
}

.bottom-tels {
    font-family: 'l';
    color: #fff;
    font-size: 18px;
    float:left;
    margin-left: 70px;
    margin-top: 35px;
}

.bottom-tels span {
    font-family: 'b';
    text-transform: uppercase;
    font-size: 15px;
}

.bottom-adress {
    font-family: 'l';
    color: #fff;
    font-size: 18px;
    float:left;
    margin-left: 50px;
    margin-top: 35px;
}

.bottom-adress span {
    font-family: 'b';
    text-transform: uppercase;
    font-size: 15px;
}

.top-container {
    height: 733px;
    margin-top: 85px;
    margin-left: auto;
    margin-right: auto;
    width: 1200px;
}

.top-logo {
    width: 289px;
    height: 96px;
    background: url(../img/topLogo.png) no-repeat top left;
    float:left;
    margin-top: 39px;
    margin-left: 80px;
}

.mode {
    float:left;
    margin-left: 90px;
    margin-top: 45px;
}

.mode-left {
    float:left;
}

.mode-right {
    font-size: 24px;
    float:left;
    padding-left: 18px;
}

.mode-right span {
    color: #c03d43;
    font-size: 24px;
}

.mode-left {
    height: 68px;
    border-right: 3px solid #c03d43;
    background: url(../img/q_03.png) no-repeat left center;
    padding-left: 51px;
}

.top-tels {
    float:right;
    margin-right: 50px;
    margin-top: 45px;
}

.top-tels-left {
    height: 68px;
    border-right: 3px solid #c03d43;
    background: url(../img/q_05.png) no-repeat left center;
    padding-left: 51px;
    float:left;
}

.top-tels-right {
    float:left;
    font-size: 30px;
    line-height: 1.1;
    padding-left: 20px;
}

.top-adress {
    float: right;
    margin-right: 50px;
    font-size: 17px;
}

.left-banner {
    width: 400px;
    height: 189px;
    float:left;
    background: url(../img/k.jpg) no-repeat top left;
}

.right-banner {
    width: 800px;
    height: 348px;
    float:left;
    background: #4b3e5c;
    font-size: 48px;
    text-transform: uppercase;
    color: #fff;
    font-family: 'l';
    padding-top: 30px;
    padding-left: 40px;
}

.right-banner span {
    color: #c03d43;
}

.map {
    height: 572px;
    background: url(../img/map.jpg) no-repeat top left;
}

.left-top {
    float:left;
    width: 400px;
    background: #e3e3e3;
    height: 554px;
}

.right-top {
    float:left;
    width: 800px;
    height: 554px;
    background: rgba(255,255,255,0.9);
}

.all-serv {
    color: #c03d43;
    font-size: 48px;
    text-transform: uppercase;
    font-family: 'r';
    padding-top: 7px;
    padding-left: 77px;
    padding-bottom: 20px;
}

.serv {
    font-family: 'r';
    color: #4b3e5c;
    font-size: 36px;
    text-transform: uppercase;
    margin-bottom: 30px;
    padding-left: 30px;
}

.serv span {
    font-family: 'b';
    color: #c03d43;
}

.left-top-lic {
    font-size: 36px;
    text-transform: uppercase;
    text-align: center;
    font-family: 'l';
    padding-top: 37px;
    padding-bottom: 37px;
}

.car-cont {
    width: 306px;
    height: 193px;
    margin: 0 auto;
    position: relative;
}

#JS_carousel {
    overflow: hidden;
    width: 306px;
    height: 193px;
    position: relative;
}

#JS_carousel > ul {
    width: 20000em;
    position: relative;
    list-style: none;
    margin: 0;
    padding: 0;
}

#JS_carousel > ul > li {
    float: left;
    height: 193px;
    width: 136px;
    position: relative;
    margin-right: 28px;
}

#JS_carousel > ul > li.oneFoto {
    background: url(../img1/1.jpg) no-repeat top left;
    background-size:100% 100%;
}

#JS_carousel > ul > li.twoFoto {
    background: url(../img1/2.jpg) no-repeat top left;
    background-size:100% 100%;
}

#JS_carousel > ul > li.freeFoto {
    background: url(../img1/3.jpg) no-repeat top left;
    background-size:100% 100%;
}

#JS_carousel > ul > li.f4Foto {
    background: url(../img1/4.jpg) no-repeat top left;
    background-size:100% 100%;
}
#JS_carousel > ul > li.f5Foto {
    background: url(../img1/5.jpg) no-repeat top left;
    background-size:100% 100%;
}
#JS_carousel > ul > li.f6Foto {
    background: url(../img1/6.jpg) no-repeat top left;
    background-size:100% 100%;
}
#JS_carousel > ul > li.f7Foto {
    background: url(../img1/7.jpg) no-repeat top left;
    background-size:100% 100%;
}
#JS_carousel > ul > li.f8Foto {
    background: url(../img1/8.jpg) no-repeat top left;
    background-size:100% 100%;
}
#JS_carousel > ul > li > a {
    display: block;
    text-decoration: none;
    cursor: pointer;
    width: 100%;
    height: 100%;
}

.top-carusel-prev,
.top-carusel-next {
    display: block;
    position: absolute;
    width: 35px;
    height: 35px;
    text-decoration: none;
}

.top-carusel-prev:hover,
.top-carusel-next:hover
{
    opacity: 0.9;
}

.top-carusel-prev {
    background: url(../img/q_13.png) no-repeat;
    left: 33%;
    bottom: -60px;
}

.top-carusel-next {
    background: url(../img/akcent_08.png) no-repeat;
    right: 33%;
    bottom: -60px;
}

.top-carusel-prev:hover span,
.top-carusel-next:hover span {
    display: block;
}

.top-carusel-prev.inactive,
.top-carusel-next.inactive {
    opacity: .5;
    cursor: default;
}

.pod {
    color: #000;
    font-family: 'b';
    font-size: 30px;
    text-transform: uppercase;
    text-align: center;
    line-height: 0.8;
    margin-top: 100px;
}

.pod span {
    font-size: 18px;
    font-family: 'l';
    text-align: center;
}