*, *:before, *:after {margin:0;padding:0;border:0;outline:0;line-height:1;vertical-align:top;text-decoration:none;list-style:none;box-sizing:border-box;}

html, body {height:100%;}

img {width:auto;max-width:100%;height:auto;}

h1, h2, h3, h4, h5, h6 {}

a {color:#34495e;}
a:hover,
a:focus,
a:active {
    
}

body {
    color:#34495e;
    font:16px "Roboto-Regular", Helvetica, Arial, sans-serif;
    font-size:100%;
    background:#fff;
    cursor:default;
}

/*--------------------------------------------------*/
/*----- Page -------------------------------------- */
/*--------------------------------------------------*/
#page {
    position:relative;
    width:100%;
}

.inner {
    width:100%;
    max-width:960px;
    margin:0px auto;
}

/*--------------------------------------------------*/
/*----- Sections ---------------------------------- */
/*--------------------------------------------------*/
.section {
    position:relative;
    overflow:hidden;
    width:100%;
    padding-left:30px;
    padding-right:30px;
    background:#fff;
}

/*--------------------------------------------------*/
/*----- Section 1 --------------------------------- */
/*--------------------------------------------------*/
.section-1 {
    padding-top:80px;
    background:url(../images/background.jpg) center center no-repeat;
	-webkit-background-size:cover;
	   -moz-background-size:cover;
		 -o-background-size:cover;
			background-size:cover;
}

/*----- Section 1 > Title ------------------------- */
/*--------------------------------------------------*/
.section-1 .title {
    position:relative;
    margin:0px -30px;
    padding:30px;
    background:#3d5368;
    text-align:center;
    box-shadow:0px -1px 0px 0px rgba(0, 0, 0, 0.5);
}

.section-1 .title span {
    line-height:1.42857143;
    color:#eef7ff;
    font-size:30px;
    font-weight:700;
}

/*--------------------------------------------------*/
/*----- Section 2 --------------------------------- */
/*--------------------------------------------------*/
.section-2 {
    padding-top:60px;
    padding-bottom:60px;
}

/*----- Section 2 > Title ------------------------- */
/*--------------------------------------------------*/
.section-2 .title {
    width:100%;
    max-width:600px;
    margin:0px auto;
    margin-bottom:50px;
    text-align:center;
}

.section-2 .title h1 {
    line-height:1.42857143;
    font-size:30px;
    font-weight:700;
}

/*----- Section 2 > Items ------------------------- */
/*--------------------------------------------------*/
.items {
    width:auto;
    margin:0px -15px;
}

/*----- Section 2 > Items > Item ------------------ */
/*--------------------------------------------------*/
.items .item {
    float:left;
    width:50%;
    padding:15px;
}

.items .item.i-1 {
    width:100%;
}

.items .item.i-2 {
    
}

.items .item.i-3 {
    
}

.items .item.i-4 {
    
}

.items .item.i-5 {
    
}

/*----- Section 2 > Items > Item > Details
/*--------------------------------------------------*/
.items .item .details {
    display:table;
    width:100%;
    border:2px solid #bbc4cd;
    border-radius:10px;
    
    -webkit-transition:all 0.3s ease-out;
            transition:all 0.3s ease-out;
}

.items .item .details:hover,
.items .item .details:hover .icon {
    border-color:#d79348;
}

.items .item .icon,
.items .item .descr {
    display:table-cell;
    vertical-align:middle;
}

/*----- Section 2 > Items > Item > Icon
/*--------------------------------------------------*/
.items .item .icon {
    width:100px;
    border-right:2px solid #bbc4cd;
    text-align:center;
    
    -webkit-transition:all 0.3s ease-out;
            transition:all 0.3s ease-out;    
}

.items .item .icon i {
    display:inline-block;
    vertical-align:middle;
    width:35px;
    height:35px;
    
    -webkit-transition:all 0.3s ease-out;
            transition:all 0.3s ease-out;    
}

.items .item .icon i.icon-1 {background:url(../images/icon-1.png) center no-repeat;}
.items .item .details:hover .icon i.icon-1 {background-image:url(../images/icon-1-h.png);}

.items .item .icon i.icon-2 {background:url(../images/icon-2.png) center no-repeat;}
.items .item .details:hover .icon i.icon-2 {background-image:url(../images/icon-2-h.png);}

.items .item .icon i.icon-3 {background:url(../images/icon-3.png) center no-repeat;}
.items .item .details:hover .icon i.icon-3 {background-image:url(../images/icon-3-h.png);}

.items .item .icon i.icon-4 {background:url(../images/icon-4.png) center no-repeat;}
.items .item .details:hover .icon i.icon-4 {background-image:url(../images/icon-4-h.png);}

.items .item .icon i.icon-5 {background:url(../images/icon-5.png) center no-repeat;}
.items .item .details:hover .icon i.icon-5 {background-image:url(../images/icon-5-h.png);}

/*----- Section 2 > Items > Item > Descr
/*--------------------------------------------------*/
.items .item .descr {
    padding:30px;
}

/*----- Section 2 > Items > Item > Name
/*--------------------------------------------------*/
.items .item .name {
   margin-bottom:15px;
}

.items .item .name h2 {
    line-height:1.42857143;
    font-size:20px;
    font-weight:700;
    text-transform:uppercase;
}

/*----- Section 2 > Items > Item > Text
/*--------------------------------------------------*/
.items .item .text {
    
}

.items .item .text p {
    line-height:1.42857143;
}

/*--------------------------------------------------*/
/*----- Section 3 --------------------------------- */
/*--------------------------------------------------*/
.section-3 {
    padding-top:40px;
    padding-bottom:60px;
    background:#3d5368;
}

/*----- Section 3 > Title ------------------------- */
/*--------------------------------------------------*/
.section-3 .title {
    margin-bottom:40px;
    text-align:center;
}

.section-3 .title span {
    line-height:1.42857143;
    color:#fff;
    font-size:30px;
}

/*----- Section 3 > Alerts ----------------------- */
/*--------------------------------------------------*/
.section-3 .alerts {
    margin-bottom:30px;
    text-align:center;
}

.section-3 .alerts div.error_msg,
.section-3 .alerts div.success_msg {
    display:inline-block;
    margin-bottom:15px;
    border:10px solid #374B5E;
    border-radius:10px;
}

.section-3 .alerts:last-child,
.section-3 .alerts div.error_msg:last-child,
.section-3 .alerts div.success_msg:last-child {
    margin-bottom:0px;
}

.section-3 .alerts div.error_msg span,
.section-3 .alerts div.success_msg span {
    display:inline-block;
    padding:15px 20px;
    background:#fff;
    line-height:1.42857143;
    border-radius:5px;
}

.section-3 .alerts div.error_msg span {
    color:#E74C3C;
}

.section-3 .alerts div.success_msg span {
    color:#27AE60;
}

/*----- Section 3 > Notice ------------------------ */
/*--------------------------------------------------*/
.section-3 .notice {
    display:table;
    width:100%;
    height:60px;
    padding:5px;
    background:#fff;
    border-radius:5px;
    box-shadow:0px 0px 0px 10px #374B5E;
}

.section-3 .notice .input,
.section-3 .notice .button {
    display:table-cell;
    vertical-align:middle;
}

/*----- Section 3 > Notice > Input
/*--------------------------------------------------*/
.section-3 .notice .input {
    
}

.section-3 .notice .input input {
    display:block;
    width:100%;
    height:100%;
    padding:0px 10px;
    font:20px "Roboto-Regular", Helvetica, Arial, sans-serif;
}

/*----- Section 3 > Notice > Button
/*--------------------------------------------------*/
.section-3 .notice .button {
    width:50px;
}

.section-3 .notice .button button {
    cursor:pointer;
    position:relative;
    width:100%;
    height:50px;
    background:#d79348 url(../images/mail.png) center no-repeat;
    color:#fff;
    font-size:28px;
    border-radius:5px;
}

/*--------------------------------------------------*/
/*----- Footer ------------------------------------ */
/*--------------------------------------------------*/
.footer {
    padding-top:20px;
    padding-left:30px;
    padding-right:30px;
    padding-bottom: 20px;
    text-align:center;
}

.footer .copy,
.footer .mail {
    color:#fff;
}

.footer .copy span,
.footer .mail a {
    display:block;
}

/*----- Footer > Copy ----------------------------- */
/*--------------------------------------------------*/
.footer .copy {
    float:left;
}

.footer .copy span {
    color:#a3a4a5;
}

/*----- Footer > Mail ----------------------------- */
/*--------------------------------------------------*/
.footer .mail {
    float:right;
}

.footer .mail a {

}

/*--------------------------------------------------*/
/*----- LapTop ------------------------------------ */
/*--------------------------------------------------*/
.laptop {
    position:relative;
    width:100%;
    max-width:800px;
    max-height:290px;
    margin:0px auto;
    padding:30px;
    padding-bottom:0px;
    background:#333;
    background:#303A44;
    background-clip:padding-box;
    border:1px solid rgba(0,0,0,0.2);
    border-radius:10px 10px 0px 0px;
}

/*----- LapTop > Camera --------------------------- */
/*--------------------------------------------------*/
.laptop .camera {
    position:absolute;
    top:5px;
    left:50%;
    width:20px;
    height:20px;
    margin-left:-10px;
    padding:5px;
    background:#444;
    background:#696969;
    border:1px solid #222;
    border-radius:50%;
}

.laptop .camera span {
    display:block;
    width:100%;
    height:100%;
    background:#222;
    border-radius:50%;
}

/*----- LapTop > Screen --------------------------- */
/*--------------------------------------------------*/
.laptop .screen {
    position:relative;
    overflow:hidden;
    width:100%;
    height:100%;
    background:#fff;
    background-clip:padding-box;
    border:1px solid rgba(0,0,0,0.2);
    border-radius:5px 5px 0px 0px;
}

/*----- LapTop > Screen > FindBar
/*--------------------------------------------------*/
.laptop .findbar {
    display:table;
    width:100%;
    height:30px;
    background:#eee;
}

.laptop .buttons,
.laptop .address,
.laptop .navigat {
    display:table-cell;
    vertical-align:middle;
    line-height:0;
    padding:0px 5px;
}

/*----- LapTop > Screen > FindBar > Buttons
/*--------------------------------------------------*/
.laptop .buttons {
    width:60px;
    text-align:center;
}

.laptop .buttons span {
    display:inline-block;
    vertical-align:middle;
    width:6px;
    height:6px;
    margin:0px 2px;
    border-radius:50%;
}

.laptop .buttons span.but-1 {
    background:#E74C3C;
}

.laptop .buttons span.but-2 {
    background:#E67E22;
}

.laptop .buttons span.but-3 {
    background:#27AE60;
}

/*----- LapTop > Screen > FindBar > Address
/*--------------------------------------------------*/
.laptop .address {
    padding:0px;
}

.laptop .address span.link {
    display:block;
    padding:3px 5px;
    background:#fff;
    border:1px solid #e1e1e1;
    font-size:12px;
}

/*----- LapTop > Screen > FindBar > Navigation
/*--------------------------------------------------*/
.laptop .navigat {
    width:30px;
}

.laptop .navigat span {
    display:block;
    width:100%;
    height:3px;
    margin-bottom:2px;
    background:#666;
}

.laptop .navigat span.nav-1 {}

.laptop .navigat span.nav-2 {}

.laptop .navigat span.nav-3 {
    margin-bottom:0px;
}

/*----- LapTop > Screen > Site
/*--------------------------------------------------*/
.laptop .site {
    border-top:1px solid #e1e1e1;
}

/*----- LapTop > Screen > Site > Image
/*--------------------------------------------------*/
.laptop .image {

}

.laptop .image img {
    /* max-width:none; */
}

/*----- LapTop > Screen > Site > Text
/*--------------------------------------------------*/
.laptop .text {

}

/*--------------------------------------------------*/
/*----- Clear Fix --------------------------------- */
/*--------------------------------------------------*/
.inner,
.items {*zoom:1;}
.inner:before, .inner:after,
.items:before, .items:after {content:" ";display:table;}
.inner:after,
.items:after {clear:both;}

/*--------------------------------------------------*/
/*----- Media Queries ----------------------------- */
/*--------------------------------------------------*/
@media only screen and (max-width: 959px) {
    
    .items .item {
        float:none;
        width:100%;
    }
    
    .section-2 .title {
        max-width:none;
    }
    
}

@media only screen and (max-width: 768px) {
    
    
    
}

@media only screen and (max-width: 640px) {
    
    .section {
        padding-left:15px;
        padding-right:15px;
    }
    
    .section-1 {
        padding-top:30px;
    }
    
    .items .item .icon {
        width:80px;
    }
    
    .items .item .descr {
        padding:20px;
    }
    
    .items .item .name {
        margin-bottom:10px;
    }
    
}

@media only screen and (max-width: 480px) {
    
    .section-1 .title span,
    .section-2 .title span {
        font-size:26px;
    }
    
    .items .item .details {
        display:block;
        text-align: center;
    }
    
    .items .item .icon {
        display:block;
        width:100%;
        height:60px;
        line-height:60px;
        border-right:none;
        border-bottom:2px solid #bbc4cd;
    }

    .items .item .descr {
        display:block;
    }
    
    .footer .copy,
    .footer .mail {
        float:none;
        padding:10px 0px;
    }    
    
}

@media only screen and (max-width: 440px) {
    
    .section-1 .title span {
        font-size:22px;
    }
    
}

@media only screen and (max-width: 385px) {
    
    .section-1 .title span {
        font-size:20px;
    }
    
    .section-2 .title span,
    .section-3 .title span{
        font-size:24px;
    }    
    
}

@media only screen and (max-width: 360px) {
    
    .section-1 .title span {
        font-size:18px;
    }
  
}