

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

}

@font-face {
    font-family: 'Robotoblack';
    src: url('../fonts/Roboto-Black-webfont.eot');
    src: url('../fonts/Roboto-Black-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Roboto-Black-webfont.woff2') format('woff2'),
         url('../fonts/Roboto-Black-webfont.woff') format('woff'),
         url('../fonts/Roboto-Black-webfont.ttf') format('truetype'),
         url('../fonts/Roboto-Black-webfont.svg#fonts/Robotoblack') format('svg');
    font-weight: normal;
    font-style: normal;

}

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

}

@font-face {
    font-family: 'Robotomedium';
    src: url('../fonts/Roboto-Medium-webfont.eot');
    src: url('../fonts/Roboto-Medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/Roboto-Medium-webfont.woff2') format('woff2'),
         url('../fonts/Roboto-Medium-webfont.woff') format('woff'),
         url('../fonts/Roboto-Medium-webfont.ttf') format('truetype'),
         url('../fonts/Roboto-Medium-webfont.svg#fonts/Robotomedium') format('svg');
    font-weight: normal;
    font-style: normal;

}








*{ margin:0; padding:0; box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -ms-box-sizing:border-box; -o-box-sizing:border-box; }
img{ max-width:100%; }
ul,li{ list-style:none; }
h1,h2,h3,h4,h5,h6{ font-weight:normal; }
a{ text-decoration:none; }






.wrapper{ max-width:1112px; margin:0 auto; width:100%; }

.white-area{ width:100%; float:left; padding:0 61px; background:url(../images/content-shadow.png) center 0 no-repeat; background-size:101% 121%; margin-top:-7px; } 


.header-back{ width:100%; float:left; background:url(../images/header-back.png) 0 0 repeat-x; position:relative; }
.header-back .white-area{ background:url(../images/header-shadow.png) center 20px no-repeat; margin:0; }
.header{ width:100%; float:left; padding-top:16px; }
.header .logo{ float:left; }
.header .right-header{ width:342px; float:right; text-align:right; padding-top:12px; }
.header .number{ width:100%; float:left; text-align:right; font-size:15px; color:#223267; font-family: 'Robotolight';  }
.header .number span{ color:#0072bc; font-family: 'Robotobold'; }
.header .call-number{ width:100%; float:left; text-align:right; font-size:31px; margin-top:5px; color:#223267; font-family: 'Robotolight';  }
.header .call-number span{ background:url(../images/icon.png) left center no-repeat; padding-left:35px;   }

.navigation{ width:100%; float:left; background:#223267; margin-top:-53px; }
.nav{ width:100%; float:left; position:relative; z-index:9; padding:0 30px; }
.nav .menu{ margin:0; padding:0; width:100%; float:left; text-align:right; }
.nav .menu li{ margin:0; padding:0; display:inline-block; float:none; list-style:none; }
.nav .menu li+li{ background:url(../images/navigation-border.png) left center no-repeat; }
.nav .menu li a{ margin:0; padding:0 22px;   line-height:46px; color:#fff; font-family: 'Robotolight'; font-size:17px; text-transform:uppercase; display:inline-block; }

.banner{ width:100%; float:left;   margin-top:-7px; padding-top:39px; }
.banner .left-banner{ width:697px; float:left; }
.banner .right-banner{ width:283px; background:#223267; padding:10px 10px 5px 10px; float:right; }
.banner h1{ color:#74c8ff; font-size:19px; text-transform:uppercase; font-family: 'Robotobold'; }
.banner h1 span{ width:75%; float:left; line-height: 20px;  margin-bottom: 12px; }
.banner h1 img{ margin-right:15px; float:left; }
.banner .form{ width:100%; float:left; margin:0; padding:0; }
.banner .form li{ list-style:none; width:100%; float:left; margin:0; padding:0; }
.banner .form li+li{ padding-top:10px; }
.banner .form li input[type=text]{ width:100%; float:left; height:30px; line-height:30px; background:#fff; outline:none; border:0 none; padding:0 10px; font-size:15px; color:#363636;  font-family: 'Robotolight'; }

.banner .form li textarea{ width:100%; float:left; height:92px; line-height:30px; background:#fff; outline:none; border:0 none; padding:0 10px; font-size:15px; color:#363636;  font-family: 'Robotolight'; overflow:auto; }

.banner .form li input[type=submit]{ width:272px; float:left; height:62px; line-height:62px; background:url(../images/submit-01.png) 0 0 no-repeat; outline:none; border:0 none; padding:0 10px; margin-left:-4px; font-size:15px; color:#363636;  font-family: 'Robotolight'; cursor:pointer; background-size:100% 62px; }



.content{ width:100%; float:left; padding:27px 0 34px 0; }
.content h1{ width:100%; float:left; font-size:21px; color:#000; text-transform:uppercase; font-family: 'Robotobold'; }
.content p{ width:100%; float:left; font-size:18px; color:#000; font-family: 'Robotolight'; margin-bottom:25px; }
.content p.margin-none{ margin:0; }


.content .left-content{ width:700px; float:left;  }
.content .left-content .gallery{ width:700px; float:left; padding:0 0 50px 0; }
.content .left-content .gallery li{ width:155px; border:1px solid #72b1da; height:146px; float:left; box-shadow:3px 3px 2px #e0e0e0; position:relative; }
.content .left-content .gallery li+li{ margin-left:25px; }
.content .left-content .gallery li .icon{ width:100%; float:left; text-align:center; margin-top:18px; }
.content .left-content .gallery li .name{ position:absolute; left:0; bottom:13px; display:inline-block; width:100%; text-transform:uppercase; line-height:15px; vertical-align:bottom; text-align:center; font-size:15px; color:#0072bc;  font-family: 'Robotomedium';  }


.content .list-ul{ width:100%; float:left; margin:0;  padding:0 0 0 9px; }
.content .list-ul li{ background:url(../images/circle.png) left center no-repeat; margin:0; padding:0; font-family: 'Robotomedium'; width:100%; float:left; padding-left:20px; font-size:20px; color:#0072bc; }
.content .list-ul li a{ font-size:16px; float:left; color:#000; font-family: 'Robotomedium'; }




.content .right-content{ width:275px; float:right; }
.content .right-content p{ margin-bottom:15px; }


.footer-back{ width:100%; float:left; background:url(../images/footer.png) repeat; border-top:8px solid #0072bc; }
.footer{ width:100%; float:left; padding:23px 61px; }
.footer .left-footer{ width:370px; float:left; border-bottom:1px solid rgba(255, 255, 255, 0.5); padding-top:37px; padding-bottom:41px; }
.footer .left-footer h1{ width:100%; color:#fff; font-size:23px; float:left; font-family: 'Robotobold'; text-transform:uppercase; }
.footer .left-footer p{ width:100%; color:#fff; font-size:13px; float:left; font-family: 'Robotolight'; text-transform:uppercase; }



.footer .right-footer{ width:323px; float:right; border-bottom:1px solid rgba(255, 255, 255, 0.5); padding:21px 0 34px 0;  }
.footer .right-footer .mail{ width:100%; float:left; text-align:right; }
.footer .right-footer .mail a{ color:#4db1f1; font-size:19px; font-family: 'Robotobold'; background:url(../images/msg.png) left center no-repeat; padding-left:32px; display:inline-block; }
.footer .right-footer .call-number{ width:100%; float:left; text-align:right; font-size:31px; margin-top:5px; color:#fff; font-weight:normal; font-family: 'Robotolight';  }
.footer .right-footer .call-number span{ background:url(../images/phone-icon.png) left center no-repeat; padding-left:35px;   }




.footer .mid-footer{ padding:0 12px; float:left; width:294px; font-size:18px; color:#8f8f8f; text-align:center;  font-family: 'Robotolight'; }
.footer .mid-footer p{ width:100%; color:#808080; font-size:13px; float:left; font-family: 'Robotolight'; margin-top:15px;  }














