
#banner1 { float:left; width:100%; background:#2e69ad;}
.banner1-left {
float:left; width:50%;margin:0; height:510px;
background:url('../images/midpage-banner1.png');
background-repeat: no-repeat;
background-size:cover;
background-position:left 0% bottom 80%;}

.banner1-right { float:right; width:50%; padding:100px;}
.banner1-right h2 {color:#fff; font-size:50px; line-height:50px;}
.banner1-right h3 {color:#fff; font-size:40px; line-height:50px;font-family:'Montserrat Bold';}
.banner1-right p { color:#fff; line-height:28px; font-size:19px; font-weight:normal;}

.banner1-right .btn { float:left; width:100%; margin:0px;}
.banner1-right .btn a { background:#fff; margin:25px 0 0; display:inline-block; padding:10px 30px; border-radius:8px; color:#2f68ad; font-size:18px;}
.banner1-right .btn a:hover { background:#6bf3ff; color:#fff;}

#banner2 { float:left; width:100%;background:#2e69ad;}

.banner2-left {
float:left; width:50%;margin:0; height:510px;
background:url('../images/midpage-banner-2.png');
background-repeat: no-repeat;
background-size:cover;
background-position:left 0% bottom 80%;}



@media only screen and ( max-width:1800px) {
.banner1-left { background-size:cover; background-position:right 0 bottom 0;}
}

@media only screen and ( max-width:1640px) {

}

@media only screen and ( max-width:1400px) {

}

@media only screen and ( max-width:1350px) {
.banner1-right { padding:110px;}
.banner1-right h2 { font-size:26px; line-height:35px;}
.banner1-right h2 br,.banner1-right p br { display:none;}

}

@media only screen and ( max-width:1200px) {
}

@media only screen and ( max-width:1100px) {
#banner1,#banner2,#banner3,#banner4,#banner5 { position:relative;}
.banner1-left { width:100%;
background:
linear-gradient(rgba(0,0,0,0.6),rgba(0,0,0,0.6)),
url('../images/midpage-banner1.png');
background-repeat: no-repeat,no-repeat;
background-size:100% 100%,cover;
background-position:top 0 left 0,right 0% bottom 86%;}

.banner2-left { width:100%;
background:
linear-gradient(rgba(0,0,0,0.6),rgba(0,0,0,0.6)),
url('../images/midpage-banner-2.png');
background-repeat: no-repeat,no-repeat;
background-size:100% 100%,cover;
background-position:top 0 left 0,left 0% bottom 60%;}



.banner1-right,.banner2-right { padding:0px; width:100%; text-align:center; position:absolute; top:30%; background:none; padding:15px;}
}
@media only screen and ( max-width:980px) {
.banner1-right h2 { color: #fff; font-size: 40px; line-height:40px;}
.banner1-right p {padding: 0 30px;}
}

@media only screen and ( max-width:767px) {

}

@media only screen and ( max-width:640px) {
.banner1-left,.banner2-left  {height:400px;}
.banner1-right,.banner2-right { background-position:top 0 left 0,left 0% bottom 70%;}
.banner1-right h2 { color: #fff; font-size: 35px; line-height:30px;}

.banner1-right { top:18%;}
}

@media only screen and ( max-width:560px) {	
.banner1-left,.banner2-left {height:310px;}
.banner1-right,.banner2-right  {background-position:top 0 left 0,left 0% bottom 70%;}

#banner2 .banner1-right { top:15%;}
.banner1-right h2 { font-size:22px;}
.banner1-right p { font-size:16px;}
}

@media only screen and ( max-width:460px) {	
.banner1-right h2 { font-size:18px; line-height:24px;}
.banner1-right p { font-size: 14px; line-height:18px;}



.banner1-left {background-size: 100% 100%,110% auto;}
.banner2-left { background-size:100% 100%,165% auto;}


.banner1-right h2 { color: #fff; font-size: 25px; line-height:25px;}

}

@media only screen and ( max-width:360px) {	

}