body {margin: 0; padding: 0; overflow-y: auto; overflow-x: hidden;}
nav{background-color: #ffffff ;position: sticky; top: 0; z-index: 999; box-shadow: 1px 1px 10px 0px #00000030;}
.toogleNav{display: none;}
.md_bg{display: none;}
.md_bg img{display: none;}
.logo{display: grid; height: 100%; overflow: hidden; align-items: center; color: #fff; overflow: visible;}
.logo img {height: 48px;}
.menu{float: right;}
.menu ul{list-style: none; padding:0; margin: 0;}
.menu ul li{ position: relative; padding:0; margin: 0; display: inline-block;}
.menu ul li a{display: block; padding:20px; color: #000; text-decoration:none; font-weight: bold;}




.menu ul li .sub_menu{ border-bottom: 2px solid #00c5ad; position: absolute; padding: 0; margin: 0; background-color: #fff; top: 50px; left: 0; width: max-content; visibility: hidden; opacity: 0; transition: all 0.7s; z-index: 999;}
.menu ul li .sub_menu li{display: block;}
.menu ul li .sub_menu li a{padding: 10px 20px; color: #333; font-size: 18px;} 
.menu ul li .sub_menu li a:hover{color: #00c5ad; transition: all 500ms ease;}
.menu ul li:hover .sub_menu{ visibility: visible; opacity: 1; top:100%;}






/*...............home.............*/
.home{ padding: 10px 0; background: linear-gradient(90deg, rgba(40,130,223,1) 51%, rgba(40,130,223,1) 100%);
position: relative; z-index: 1;}
.home:after{ content: ""; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background-image: url('../images/home-bg.jpg'); background-position: 0; background-size: cover; z-index: -1; opacity: 0.1;}
.home_content h1{color: #fff; font-weight: 900; font-size: 60px;}
.home_content a{color: #fff; font-size: 50px;}
.home_content p{color: #fff; font-size: 20px;} 
.home_img{display: grid; height: 100%; align-content: center; float: right;}
.home_content {display: grid; height: 100%; align-content: center;}
.title{font-size: 50px !important;}



/*...................contact............*/
.form_group input,textarea{background-color: #F8F9F9;}
.form_group{margin-bottom:15px;}
.form_group input ,textarea
{
  width: 100%; 
  padding: 19px 25px; 
  border-radius:0; 
  border:1px solid #e0e2e1; 
  font-size: 16px;
  font-family: "Raleway", sans-serif;
  font-weight: 500;
  outline: none !important;
} 

.sub_btn{border:none; background-color: #74b4f6; color: #fff; width: 100%;}
.sub_btn:hover{transition: 0.5s; background-color: blue;}
.left_div{position: relative;}
.brdr {height: 2px; width: 50px; background-color: #3a8adb; position: absolute; top: 14%; left: 2%;}
.left_div h3{margin-bottom: 50px; color: #2f7fd2; font-weight: 700;}
.left_div h2{margin-bottom: 50px;}
.icon_detail{margin-bottom: 30px;}
.icon_detail a{font-size: 20px; color: #000; text-decoration: none;}


/*...................brand............*/
.brand{background-color: #f8f9f9;}
.brand_title h1{color: #000; font-weight: 700;font-size: 35px; text-align: center;}




/*...................sec_footer............*/
.sec_footer{padding:40px 0; background-color: #216999;}
.sec_footer{background-color: #022a57;}
.footer_content h4{color: #fff; font-weight: 600; font-size: 25px;margin-bottom: 30px;}
.footer_content p{color: #fff; text-align: justify; font-size: 20px;}
.footer_services{display: grid; height: 100%;}
.services_content h4{color: #fff; font-weight: 600; font-size: 25px;margin-bottom: 30px;}
.services_content ul{padding: 0; margin:0; list-style: none;}
.services_content ul li{padding: 0; margin: 0;}
.services_content ul li a{ display: block; color: #fff; margin-bottom: 15px; font-size: 18px;}

.footer_information h4{color: #fff; font-weight: 600; font-size: 25px; margin-bottom: 20px;}
.footer_information p{color: #fff; text-align: left; font-size: 18px;}
.footer_information p span {font-size:18px; font-weight: bold;}
.footer_information a{color: #fff; text-decoration:none;}
.detail{font-size: 20px;}
.detail a i{margin-bottom: 20px;}
.footer_logo img {filter: invert(5);}



.footer_bottom 
{
  padding: 10px 15px;
  text-align: center;
  background-color: #000;
  color: #ccc;
  border-top:1px solid #fff;
}
.footer_bottom p {font-size: 12px;}

.fs_12
{
  font-size: 12px !important;
}
.fs_12 a
{color: #74b4f6; text-decoration: none;
}





@media only screen and (max-width: 991px){ /* md-size */
  /*...............home.............*/
  .home_content h1 {color: #fff;font-weight: 900;font-size: 28px;}
  .home_content a {color: #fff;font-size: 37px;}
  .title{font-size: 23px !important;}
  /*...............services.............*/
  .service_con h3 {color: #000;font-weight: 700;padding: 10px 0;font-size: 26px;}
  /*...............contact.............*/
}


@media only screen and (max-width: 767px){ /* sm-size */
  .menu{ position: fixed; left: -100%; top: 0; width: 80%; height: 100%; overflow-y: auto; background-color: #f8f9fa; transition: all 0.5s; z-index:999;}
  .menu ul li{display: block;}
  .menu ul li a{padding:10px;}
  .toogleNav{display: block; float: right; padding: 12px; font-size: 30px;}
  .menu ul li .sub_menu{position: relative; width: 100%; visibility: visible !important; opacity: 1 !important; top:0; display: none; transition: inherit;}
  .menu ul li .sub_menu li:hover{background-color: #f3efef87;}
  .menu_open{left: 0;}
  .md_bg{background-color: #f3f5f7; padding:10px !important;}
  .md_bg img{display: block;}
  /*...............home.............*/
  .home_content h1{color: #fff; font-weight: 900; font-size: 40px;}
  /*...............contact.............*/



}


@media only screen and (max-width: 576px){ /* xs-size */
  /*...............home.............*/
  .home_content h1 {color: #fff;font-weight: 900;font-size: 29px;}
  /*...............about.............*/
  .about_title {margin-bottom: 20px;font-size: 34px;margin-top: 20px;}
  .home_content a {color: #fff;font-size: 38px;}
  .box_item, .services, .contact_us {padding: 30px 0;}
  .main_item {margin-bottom: 30px;}
  /*...............contact.............*/
  
  /*...................sec_footer............*/
  .icon{margin-bottom: 20px;}


}

.fs_10 {font-size: 10px !important;}
.fs_11 {font-size: 11px !important;}
.fs_12 {font-size: 12px !important;}
.fs_13 {font-size: 13px !important;}
.fs_14 {font-size: 14px !important;}
.fs_15 {font-size: 15px !important;}
.fs_16 {font-size: 16px !important;}
.fs_17 {font-size: 17px !important;}
.fs_18 {font-size: 18px !important;}
.fs_19 {font-size: 19px !important;}
.fs_19 {font-size: 19px !important;}
.fs_20 {font-size: 20px !important;}
.fs_22 {font-size: 22px !important;}
.fs_24 {font-size: 24px !important;}
.fs_26 {font-size: 26px !important;}
.fs_28 {font-size: 28px !important;}
.fs_30 {font-size: 30px !important;}
.fs_36 {font-size: 36px !important;}
.fs_40 {font-size: 40px !important;}
.fs_50 {font-size: 50px !important;}