/*========================================

           DEFAULT VALUES

         

Font Family:              Lato



                 COLORS



usafa-blue:                 #095084



mustard:                    #FFDD4A



opal:                       #A5CBC3



silver-metallic:            #ADA8B6



eerie-black:                #171717



black:                      #000000



white:                      #FFFFFF



cultured:                   #F5F4F6

==========================================*/





html {font-family: 'Open Sans', sans-serif;}

/* Typography */

p, a {font-weight: 400;}

.h2 {font-size: 30px;}

h3 {font-size: 28px;

    text-transform: uppercase;}

.light-300 {

  font-family: 'Open Sans', sans-serif !important;

  font-weight: 300;

}

.regular-400 {

  font-family: 'Open Sans', sans-serif !important;

  font-weight: 400;

}

.semi-bold-600 {

  font-family: 'Open Sans', sans-serif !important;

  font-weight: 600;

  color: #095084;

  text-transform: uppercase; 

}

.typo-space-line::after,

.typo-space-line-center::after {

  content: "";

  width: 150px;

  display:block;

  position: absolute;

  border-bottom:  5px solid #095084;

  padding-top: .5em;

}

.typo-space-line-center::after {

  left: 50%;

  margin-left: -75px;

}

/* Main Nav */

#main_nav .nav-item .nav-link:hover {color: #FFDD4A;}

/* Home */

#index_banner {

  background-image: url('./../img/banner-bg-01.jpg');

  background-position: center center; background-size: cover;

  height: 100%;

  min-height: 60vh;

  width: 100%;

}

#index_banner .carousel-item {

  min-height: 60vh;

}

#index_banner .carousel-control-prev i,

#index_banner .carousel-control-next i {

  color: #095084 !important;

  text-decoration: none;

  font-size: 4em;

}

#index_banner .carousel-inner {

  height: 80vh;

}

#index_banner .carousel-indicators li,

#index_banner .carousel-indicators.active {

  background-color: #095084 !important;

}

.service-wrapper .service-footer {

  max-width: 720px;

}

.service-work.card {

  border-radius: 10px !important;

  cursor: pointer;

}

.service-work .service-work-vertical {

	background: rgb(0,0,0);

  background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 33.33%, rgba(255,255,255,1) 66.66%, rgba(255,255,255,0) 99.99%);

  background-size: 300% 300%;

  background-position: 0% 100%;

  transition: .5s;

}

.service-work .service-work-vertical:hover {

  background-position: 0% 0%;

  transition: .5s;

}

.service-work .service-work-vertical:hover * {

  color: #000;

  border-color: #000;

  transition: .5s;

}

.recent-work.card{

  border-radius: 10px !important;

}

.recent-work .recent-work-vertical {

	background: rgb(255,255,255);

  background: linear-gradient(0deg, rgb(255, 255, 255) 0%, rgba(255,255,255,0) 33.333%, rgb(9, 80, 132) 66.666%, rgba(255,255,255,0) 99.999%);

  background-size: 300% 300%;

  background-position: 0% 100%;

  transition: .5s;

  cursor: pointer;

}

.recent-work .recent-work-vertical:hover {

  background-position: 0% 0%;

  transition: .5s;

}

.recent-work .recent-work-vertical:hover div.recent-work-content {

  top: 50%;

  margin-top: -2.5em;

  position: absolute;

}

.recent-work .recent-work-vertical:hover * {

  color: white;

  transition: .5s;

}







/*Other Stuff */

#work_banner {

  background-image: url('./../img/banner-bg-02.jpg');

  background-position: center center; background-size: cover;

  height: 100%;

  width: 100%;

}

.progress {

  height: 8px;

}

.objective-icon {

  border-radius: 13px;

  width: 8rem;

}

.partner-wap {

  background-color: #7276ec;

  transition: 1s;

  cursor: pointer;

}

.partner-wap:hover {

  background-color: #b1b3f5;

}

.why-us {

  background: rgb(239,239,253);

  background: -moz-linear-gradient(0deg, rgba(239,239,253,1) 50%, rgba(255,255,255,1) 50%);

  background: -webkit-linear-gradient(0deg, rgba(239,239,253,1) 50%, rgba(255,255,255,1) 50%);

  background: linear-gradient(0deg, rgba(239,239,253,1) 50%, rgba(255,255,255,1) 50%);

  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#efeffd",endColorstr="#ffffff",GradientType=1);

}

.team-member-img {

  transition-duration: 0.15s;

}



.float-on {

    

float: right;

    

}









.team-member:hover .team-member-img {

  padding: 10px !important;

}



/* Work */

/* Singel Work */

#work_single_banner {

  background-image: url('./../img/banner-bg-02.jpg');

  background-position: center center;

  background-size: cover;

  height: 100%;

  width: 100%;

}

.related-content {

  border-radius: 20px;

  cursor: pointer;

}

/* Pricing */

.pricing-list {

  margin-bottom: 1px;

}

.pricing-table {

  max-width: 350px;

  margin: auto;

}

.pricing-table,

.pricing-horizontal {

  border-radius: 15px !important;

}

/* Contact */

#floatingtextarea {

  height: 150px

}

/* Footer */

footer a.text-light:hover {

  color: #bfbfbf !important;

  transition-duration: 0.15s;

}



/*========================================

     CONTENT

==========================================*/



.content-box {

    padding: 60px 0 60px 0;

    

}



.content-title h3 {

    font-size: 30px;

    font-weight:700;

    text-align: center;

    margin: 0 0 30px 0;

}





.content-title-underline {

    width:50px;

    height:3px;

    background-color:#095084;

    margin: 0 auto 30px auto;

    

}



/*========================================

                SERVICES

==========================================*/



#services {

   padding-top: 82px;



}



/* services pictures */

.col-md-4 {

margin-top: -48px; 



}



.mb-5 {

 padding-bottom: 12px;   

}





/*========================================

     ABOUT

==========================================*/





#about {

background: url('./../img/aboutus.png')no-repeat center center; background-size: cover;

padding-top: 30px;

padding-bottom: 30px;



  

}





.about-text {

font-size: 19px; 

color: #171717;

text-align: justify;

letter-spacing: 1px;

line-height: 1.5;

}





.btn-general {

       

       border-width: 2px;

       border-radius: 12px;

       padding: 12px 26px 12px 26px;

       font-size: 16px;

       font-weight:400;

       text-transform: uppercase;

    

    }





.btn-blue {

   border-color: #095084; 

   color: #095084;

    

    }  



.btn-blue:hover, btn-blue:focus {

    background-color: #095084;

    color: #fff;



}





.btn-blue2 {

   border-color: #095084; 

   color: #095084;

    

}





.btn-blue2:hover, btn-blue:focus {

    background-color: #FFDD4A;;

    color: #095084;



}



form .form-control {

    background-color: #fff;

    border-radius: 0;

    border-color: #fff;

    font-size: 17px;

    font-weight: 300;

    padding: 8px 16px;

    margin-bottom: 20px;

    color: #000;

}







/*========================================

     CONTACT

==========================================*/



#contact {

   background: url('./../img/contactus.jpg')no-repeat center center; background-size: cover; 

 margin-bottom: -5px;

  padding-top: 40px;  

}





#contact-left p {

color: #fff;  

text-align: justify;

font-size: 18px;



    

}



#contact-left a {

color: #fff;    

}



#contact-left a:hover {

color: #FFDD4A       



}



#contact-left h3, #contact-right h3 {

color: #fff;

font-size: 27px;

font-weight:700;

    

}



#contact h4 {

color: #FFDD4A;

font-size: 22px;

    

    

    

}















/*========================================

                SOCIAL

==========================================*/



.social-media{

  list-style-type: none;

  padding: 0px;

  margin: 0px;

}



.social-media li{

  display: inline-block;

  margin-right: 20px;



}





.social-icon-fb {

    background: url('../img/social-icon-fb.png') no-repeat;

    width: 42px;

    height: 42px;

    display:block;

}



a:hover .social-icon-fb {

    background: url('../img/social-icon-fb-over.png') no-repeat;

}



.social-icon-ig {

    background: url('../img/social-icon-ig.png') no-repeat;

    width: 42px;

    height: 42px;

    display: block;

}



a:hover .social-icon-ig {

    background: url('../img/social-icon-ig-over.png') no-repeat;

}



.social-icon-twitter {

    background: url('../img/social-icon-twitter.png') no-repeat;

    width: 42px;

    height: 42px;

    display: block;

}



a:hover .social-icon-twitter {

    background: url('../img/social-icon-twitter-over.png') no-repeat;

}



.social-icon-linkedin {

    background: url('../img/social-icon-linkedin.png') no-repeat;

    width: 42px;

    height: 42px;

    display: block;

}



a:hover .social-icon-linkedin {

    background: url('../img/social-icon-linkedin-over.png') no-repeat;

}







/*========================================

                NAVBAR

==========================================*/



.navbar-toggle {

background-color: rgba(255, 248, 248, 0.1);

border: none;

border-radius: 0;

    

}



.navbar-toggle .icon-bar {

background-color: #095084;

    

        

}



.navbar-collapse {

max-height: none !important;

    

}



.nav-size {

    height: 60px;

    

}



.halo-item {

padding-top: 0px;    

}



/*========================================

         Navigation

==========================================*/



.navbar {

    padding: 20px 0;

}



.halo-top-nav {

background: #F5F4F6;

padding: 7px 0;

}



.halo-nav-wrapper {

padding: 0 85px;    

}





.navbar-nav {

float: right   

    

}



.navbar-nav >li > a {

    color: #000;

    font-size: 15px;

    text-transform: uppercase;

    letter-spacing: 1px;

    font-weight: 700;

}



.navbar-nav > li > a:hover, .navbar-nav > li > a:focus {

background: none;

color:#FFDD4A;

}



.navbar-toggle {

background-color: rgba(255, 248, 248, 0.1);

border: 9px solid #095084;

border-radius: 0;

}



.navbar-toggle .icon-bar {

background-color: #095084;    

}



.navbar-collapse {

max-height: none !important;    

}



.halo-top-nav ul.navbar-nav > li.active > a {

color: #FFDD4A;  

    

}



.navbar-toggler:focus,

.navbar-toggler:active,

.navbar-toggler-icon:focus {

    outline: none;

    box-shadow: none;

}





/*========================================

         Responsive 

==========================================*/





/* Responsive  1200-min & 1399-max */



@media (min-width: 1200px) and (max-width: 1399px) {



    #home h1 {

    font-size: 55px    

    }  

    

    #about h3 {

    padding-top: 16px;

    }    



#contact h4 {

    font-size: 22px;    

    }    

    

}







/* Responsive  992-min & 1199-max */



@media (min-width: 992px) and (max-width: 1199px) {



    #home h1 {

    font-size: 42px;    

    }   

    

    #home p {

    font-size: 12px;    

    }

    

    .btn-lg {

    font-size: 12px;    

    }

    

}



/* Screen size 768 to 991 */



@media (min-width: 768px) and (max-width: 991px) {

   

    #home h1 {

    

    font-size: 30px    

    }

    

    #home p {

    font-size: 10px;

    }

    

    .btn-lg {

    font-size: 8px;

    }

    

    #services h3 {

     font-size: 20px;

        

    }

    

    #about h3 {

    font-size: 20px; 

    padding-top: 12px;

    }

    

    #about p {

    font-size: 16px;    

    }

    

    .ceo-size {

    width:85%;

    align-content: center;



    }

    

    

    #contact-left h3, #contact-right h3 {

    font-size: 22px; 

    padding-top: 32px;

    }

    

 .social-media li .fa { 

  background: #F5F4F6;   

  color: #262626;

  width: 30px;

  height: 30px;

  font-size: 15px;

  border-radius: 50%;

  text-align: center;

  line-height: 29px;

  transition: all .3s ease;

  

}

    

     #contact p {

        font-size:15px;

        padding-bottom: 15px;

        

    } 



}

    

 /* Responsive  721-min & 767-max*/



@media only screen and (min-width: 721px) and (max-width: 767px) {  

 

    #home h1 {

    font-size: 25px;

    

    } 

    

    #home p {

    font-size:9px; 

    

    }

    

    .btn-lg {

    display: none;    

    }

    

    #services h3 {

    font-size: 16px;    

        

    }

    

    #services p {

     font-size: 14px; 

     

    }

    

    #contact-left h3, #contact-right h3 {

    font-size: 16px; 

    padding-top: 32px;

    }

    

    #contact p  {

    

    font-size: 14px;

    padding-bottom: 12px;

    }

    

    #contact h4 {

    font-size: 18px;    

    }

    



.social-media li .fa { 

  background: #F5F4F6;   

  color: #262626;

  width: 30px;

  height: 30px;

  font-size: 15px;

  border-radius: 50%;

  text-align: center;

  line-height: 29px;

  transition: all .3s ease;

  

} 

    .recent-work {

    width: 50%;

    height:auto;

    }

 

}  





/* Responsive  601-min & 720-max*/



    @media only screen and (min-width: 601px) and (max-width: 720px) {

    

        #about h3 {

        font-size: 25px;

        padding-top: 18px;

        }   

        

.social-media li .fa { 

  background: #F5F4F6;   

  color: #262626;

  width: 30px;

  height: 30px;

  font-size: 15px;

  border-radius: 50%;

  text-align: center;

  line-height: 29px;

  transition: all .3s ease;

  

}    

   #contact-left h3, #contact-right h3 {

    font-size: 22px; 

    padding-top: 32px;

    }

        

        #contact p {

        padding-bottom: 12px;    

        }    

        

    }



    

/* Responsive  320-min & 480-max*/



@media only screen and (min-width: 320px) and (max-width: 480px) {



.social-media li .fa { 

  background: #F5F4F6;   

  color: #262626;

  width: 30px;

  height: 30px;

  font-size: 15px;

  border-radius: 50%;

  text-align: center;

  line-height: 29px;

  transition: all .3s ease;

  

}

 #contact-left h3, #contact-right h3 {

    font-size: 22px; 

    padding-top: 32px;

    }       

 

  #contact p {

        font-size:15px;

        padding-bottom: 15px;

        

    } 

    

    #about h3 {

    font-size: 20px;

    padding-top: 16px;

    }

    

    #about p {

    font-size:15px;

    }

    

    #services h3 {

    font-size: 20px;   

        

    } 



    #home h1 {

    font-size: 30px;

    text-justify: auto;

    } 

    

    #home p {

    text-align:left;

    }

    

}