/*!
 * Adminux (http://maxartkiller.com)
 * Copyright 2017 The Adminux Author: Maxartkiller
 * purchase licence before use
 * You can not resale or modify without prior licences.
*/

/*------------------------------------------------------------------ 
[Table of contents]
1.	General CSS
2.	Responsive 
------------------------------------------------------------------*/

/*========================================
1.	General CSS
=========================================*/

.light-bg{ background: #eaecf4}
.section{ padding-top: 150px; padding-bottom: 150px;}
.banner{ background: url(../img/banner3.png) no-repeat top center #eaecf4; background-size:100%; height: 900px;}
.banner_sub{ background: #ffffff; text-transform: uppercase; display: inline-block; padding: 10px 20px; letter-spacing: 3px}
.responsive-img2{ max-width: 100%;}
.laptop-left{ width: 38%; position: absolute; left: -70px; top: 120px}
.lady-right{ width: 18%; position: absolute; left: 5%; bottom: 0}
.block{ background: #eaecf4; padding: 20px;  position: relative; height:  100%}
.block figure{ margin: -20px -20px 20px -20px; }
.block .hide{ display: none}
.block i{ text-align: center; font-size: 26px; line-height: 50px; padding: 0; height: 50px; width: 50px;display: block; position: absolute; right: 0; bottom: 0;  background: #6c8bef; color: #ffffff;}
.girl-laptop{ width: 58%; position: absolute; right: 0; bottom: 0}
.block:hover { background: #6c8bef; color:#ffffff; box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.3); -ms-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.3); -webkit-box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.3);}
.block:hover .hide{ display: block}
.block:hover i{ color:#222222; background: #FFFFFF}
.block:hover a{ color:#ffffff;}
.block.bordered{border:1px solid rgba(108, 139, 239, 0.5); }
.block.bordered:hover{ background: #6c8bef}
.block.bordered:hover *{ color:#ffffff;}
.block.bordered:hover .btn{ color:#6c8bef;background: #ffffff}
.subscribe{ max-width: 400px; margin: 50px auto;}
.subscribe input[type="text"]{ background: rgba(255, 255, 255, 0.5) ; color: #ffffff; line-height: 50px; height: 50px; padding: 0 15px;}
.subscribe .btn{ color: #ffffff; background: #2cc4cd; text-transform: uppercase}
.subscribe .btn:hover{background: #26aab2; }
footer{margin: 0}
.footer{display: flex}
.footer-links { margin: 50px auto;}
.footer-links a { color:#999999}
.footer-links a:hover { color:#222222}
.dark_bg{background: #252d47; color: #ffffff;}
.copyright{ color: #222222; line-height: 50px; vertical-align: middle; margin: 0}
.navbar-toggler{background: #bcc4e6; margin-right: 10px; height: 40px; padding: 0; width: 40px; text-align: center; vertical-align: middle; color: #ffffff}
nav .navbar-collapse li.nav-item a:hover{  background: #eaecf4}
.contact-form{ max-width: 440px; margin: 0 auto; padding: 20px; box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.15); -moz-box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.15); -webkit-box-shadow: 0px 3px 15px 0 rgba(0, 0, 0, 0.15); -ms-box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.15); border-radius: 10px; -ms-border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; }
.banner_laptop{ margin-bottom: -200px; position: absolute; left: 0; right: 0; bottom: 0;}
.icon-lg{ height: 100px; width: 100px; line-height: 100px; padding: 0; text-align: center; vertical-align: middle; font-size: 50px; margin-bottom: 20px; border-radius: 50%}

/*========================================
2.	Responsive
=========================================*/

@media screen and ( max-width:1019px) {
    .banner{ height: 550px;}
    h3{ 0.9rem}
    .display-1{ font-size: 3rem;}
    .display-4{ font-size: 1.25rem}
    .display-3 { font-size: 2.25rem;}    
    .lead {font-size: 1rem;}
    .section {padding-top: 80px;  padding-bottom: 80px;}
    .navbar-collapse{ position: fixed; top: 80px; background: rgba(255, 255, 255, 1);left: 0; padding: 20px;}
    .copyright{ line-height: 30px; text-align: center !important; padding: 10px 15px;}
}
@media screen and ( max-width:767px) {
    .banner { background: url(../img/banner3.png) no-repeat top center #eaecf4;  background-size:auto100%;}
    .laptop-left{ display: none}
    .lady-right{ display: none}
    .display-1{font-size: 4rem} 
     .display-2{font-size: 3rem} 
     .display-3{font-size: 2rem} 
}
@media screen and ( max-width:556px) {
    .banner{ height: 500px;}
    .navbar-brand h4{ display: none}
}