html {
    max-width: 100% !important;
    overflow-x: hidden !important;
} 
.bg-nu{
    background-color: #0091df !important;
}
.bg-nu-dark{
    background-color: #002133 !important;
}
.bg-nu-yellow{
    background-color: #f4c30b !important;
}

.color-nu{
    color: #0091df !important;
}
.color-nu-dark{
    color: #002133 !important;
}
.color-nu-yellow{
    color: #f4c30b !important;
}


.white{
    color: white !important;    
}
.bg-white{
    background-color: white !important;
}
html {
    scroll-behavior: smooth;
  }
body{
    /*font-family: 'Lora', serif;*/
	font-family: 'Roboto', serif;
}

/* body{
    font-family: 'Lato', sans-serif;
} */


/* navbar */

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

    #top-bar {
        display:none;
            
    } 
    #main-nav div.nav-container{
        margin-left: 10px;
        margin-right: 10px;
    }

    #main-nav a.navbar-brand-img img{ 
        width: 180px;
    }

    #main-nav div#collapsibleNavbar{
        margin-top: 50px;
    }

    #main-nav a.nav-link{
        background-color: #002133;
        color: white;
    }

    #main-nav li.nav-item{
        width: 100%;
        font-size: 15px;
        font-weight: 600;
        text-transform: uppercase;    
    }

    #main-nav .nav-link:hover{
        background-color:#0091df ;
    }
    
   


}

@media screen and (max-width: 1500px) {

    #main-nav .nav-container{
        margin-left: 0 !important;
        margin-right: 0 !important;
        
    }
    #navbar-logo{
        font-size: 11px !important;
    }
}

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

    #main-nav .nav-container{
        margin-left: 25px !important;
        margin-right: 25px !important;
        
    }
    #navbar-logo{
        font-size: 11px !important;
    }
}
@media screen and (max-width: 500px) {

  #navbar-logo{
      font-size: 11px !important;
  }

}

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

  .sticky-top{
      position:static !important;
   }

}

#main-nav a.navbar-brand-img img{
    width: 50px;
}
#main-nav a#navbar-logo {
 
   font-size: 15px;
   color: #002133;
   font-weight: bold;
   vertical-align: middle;
   
    
}

#main-nav .navbar {
    height: 80px;
    
}

#main-nav .nav-container{
    margin-left: 80px;
    margin-right: 80px;
}

#main-nav .nav-item{
    width: 135px;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;    
}

#main-nav .nav-link{

    height:80px;
    line-height: 65px;
    color: black;
}

#main-nav .active-nav-link{
    border-bottom: 5px solid #0091df ;    
}


#main-nav .nav-link:hover{
    border-bottom: 5px solid #0091df ;
}

#main-nav .custom-toggler.navbar-toggler {
    border-color: rgb(0, 33, 51);
}
#main-nav .custom-toggler .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0, 33, 51, 0.7)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}


#main-nav .dropdown-menu{
    border-radius: 0px;
}

#main-nav .dropdown-menu a:hover{
    
    background-color: #0091df;
    color: white;
    border-radius: 0px;
    font-weight: bold; 
}

#main-nav .dropdown:hover>.dropdown-menu {
    display: block;
    top: 95%;
}



/* footer */
.footer{
    background-color: #002133;
    background-image: url("https://www.transparenttextures.com/patterns/black-twill.png");
    border-radius: 0px;
    margin-bottom: 0px;
    color: white;

}

.mapouter {
    position: relative;
    height: 270px;
    width: 400px;
}

.gmap_canvas {
    overflow: hidden;
    background: none !important;
    height: 270px;
    width: 400px;
}
#lg-map{
    display:block; 
}
#md-map{
    display:none;
}
#sm-map{
    display:none;
}

@media screen and (max-width: 1300px){
    .mapouter {
        position: relative;
        height: 200px;
        width: 300px;
    }

    .gmap_canvas {
        overflow: hidden;
        background: none !important;
        height: 200px;
        width: 300px;
    }
    #lg-map{
       display:none; 
    }
    #md-map{
        display:block;
    }
    #sm-map{
        display:none;
    }
}

@media screen and (max-width: 1000px){
    .mapouter {
        position: relative;
        height: 150px;
        width: 250px;
        
    }
    
    .gmap_canvas {
        
        overflow: hidden;
        background: none !important;
        height: 150px;
        width: 250px;
    }
    #lg-map{
       display:none; 
    }
    #md-map{
        display:none;
    }
    #sm-map{
        display:block;
      

    }
    
}
       




@media (max-width: 1200px) {

    [class*="col-"] {
        margin-bottom: 25px;
    }
  
  }


.pl-150{
    padding-left:150px;
}

.nu-hr{
    border: 2px solid #0091df;
}

#header-jumbotron{
    background-color: #002133;
    height: 150px;
}

.extra-small{
    font-size: 11px;
}

.btn-nu{
    border-radius: 0 !important;
    background-color: #0091df !important;
}
.btn-nu:hover{
    background-color: #002133 !important;
    color: white !important;
}


.nostyle-link{
    color: white;
    
}
.nostyle-link:hover{
    color: white;
}

img.hover-shadow {
    transition: 0.3s;
  }
  
  .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  }

  .overlay-container {
    position: relative;
    
  }
  
  .overlay-container .image {
    display: block;
  
  }
  
  .overlay-container .img-content {
    position: absolute; 
    bottom:0px; 
    background: rgb(0, 0, 0); 
    background: rgba(0, 0, 0, 0.2); 
    color: white; 
    width: 100%; 
    padding: 10px; 
    font-size: 10px;
    height: 100%;
    
  }
  .overlay-text-hover{
      display:none;
    
    }

  .overlay-container:hover .img-content{

    background: rgba(0, 0, 0, 0.5); 
    color: white; 
    width: 100%; 
    padding: 10px; 
    font-size: 10px;
    height: 100%;
    cursor: pointer;
  }


.overlay-container:hover .overlay-text-hover{
    display: block;
    
}
  .activate-overlay .img-content{

    background: rgba(0, 0, 0, 0.5); 
    color: white; 
    width: 100%; 
    padding: 10px; 
    font-size: 10px;
    height: 100%;
    cursor: pointer;
  }


.activate-overlay .overlay-text-hover{
    display: block;
    
}