:root {
    --customs-primary: #1a472a;
    --customs-secondary: #2d7a4f;
    --customs-accent: #f59e0b;
    --customs-light: #f8f9fa;
    --customs-dark: #0f2419;
}

#notes h6{
    
    
    font-family:poppins;
    margin-top:25px;
    text-align:center;
    font-weight:700;
    font-size:21px;
    text-transform:uppercase;
    
    
}


#notes hr{
    
    
   border:2px solid red;
   width:9%;
    
    
}



.btn-success{


  background-color: inherit;
  border:2px solid white;

}


.btn-success:hover,.btn-succes:focus{


  background-color: inherit;
  border:2px solid white;
}

.btn-message{
 top: 90%;

  left: 2%;

border:2px transparent transparent;

font-family: poppins;

font-weight: 700;

font-weight: bold;

cursor: pointer;

background-color: rgba(0,90,60,1) !important;

color: white !important;

font-size: 18px;

position: fixed;

z-index: 1;

box-shadow:0px 0px 12px rgba(0,0,0,0.3);


}

#popup-messaging{

background-color: rgba(248,248,248,0.3);  
position:fixed;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
width: 400px;
padding:5px;
font-family: poppins;
box-shadow: 0 5px 30px rgba(0,0,0,.30);
border-radius:13px 13px 0px 0px;
background: #fff;

visibility:hidden;
opacity:0;
transition: 0.3s;
z-index: 1;
}

#close-messaging:hover, #close-messaging:focus{
opacity: 0.6;
border: none;
outline: none;
 outline: none;

}


#close-messaging{

  position: absolute;
  left:90%;
  
  color:white;
  font-weight: bold;
  top:-7px;
  font-size:23px;
  background-color: rgba(255,50,40,1);
  padding:0px 12px;
  cursor: pointer;
  border-radius:50%;
}




#popup-messaging.active{
  
visibility: visible;
opacity: 1;
transition: 0.3s;

    }


.search{

width: 30%;

  position: absolute;

  right: 3%;

  top:35%;
}


.search button{

float: right;

margin-top: -37px;
 
}


#q{

width: 100%;
border:1px solid transparent;
box-shadow: 0px 0px 1px rgba(0,0,0,0.2);

}

  

h1{

height:54px;

border:1px solid transparent;

padding:10px 8px;

width: 100%;

z-index: 999;

background-color:rgba(0,20,70,0.9);

} 

#pform{

	margin-top: 49px;
}

.main{

background-image: linear-gradient(to right,rgba(0,60,90,0.6),rgba(0,90,60,0.8)),url('../../main.PNG');
background-repeat: no-repeat;
background-size: 100% 100%;
background-position: center;

position: relative;

height:385px;

margin-top:-10px;

}


.menu{

background-color: rgba(0,20,80,1);
padding: 30px;

color: white;

position: absolute;

margin: auto;

left: 0;

right: 0;

top: 8%;



}


.menu p{


  width: 78%;
}

.menu p a{

  color: white;
  width: 100%;
}


.gallery{

font-family:poppins;
font-weight: bold;
float: right;
text-transform:uppercase;
font-size:14px;

cursor: pointer;

color:white;


margin:5px 15px;

transition: 0.5s;



}




.gallery:hover{


color: white;
text-decoration:none;
opacity:0.8;
border-bottom:5px solid red;




}

.logoU{


opacity:1;

height: 110px;

width:225px;

margin-left: 20px;

margin-top:0px;

opacity: 1;


background-color: inherit;
}

#logotext{

	position: relative;
}


.menu h4{

  font-weight: 700;
}

.menu >h4,p,button{

  font-family: poppins;
}


.row{

  margin-top: 35px;
}

.col-md-3{

text-align: center;

margin-top: 10px;




}

.family{

  border:1px solid rgba(0,20,80,0.6);

  padding: 20px 0px;
  padding-bottom: 25px;
  border-radius: 10px;
  position: relative;
}

.family h6{
  margin-top: 10px;
  position: absolute;
  box-shadow: 0px;
  font-family: poppins;
  color: white;
  font-weight: 700;
  background-color: rgba(0,50,90,1);
  width: 100%;
  border-radius: 0px 0px 10px 10px;
  top: 80%;
  text-transform: capitalize;
  font-size: 23px;
}

#kings{

  text-align: center;
  width: 100%;

  margin-top: 65px;
}


#kings h4{


  width: 100%;

  background-color: rgba(0,20,80,0.9);

  text-align: center;

  font-family: poppins;

  color: white;

  font-weight: 700;

  margin-top: 10px;

  padding: 15px;

  font-size: 21px;
}

#news h4{

margin-bottom: 8px;

font-family: poppins;

font-weight: 700;

margin-top: 25px;
}

#managers h6{

font-weight: 700;

margin-top: 8px;


}


#managers img{

width: 100%;

height: 100%;


}


#managers{

  margin:0;


}

#managers_notes h6{

font-family: poppins;

}




#managers_notes{



padding: 8px;

}







.navbar a{

color: black;
font-family: poppins;
text-transform: uppercase;

}



.footer{



  background-color: rgba(0,20,70,0.9);
  padding: 10px;
}

.footer a{

color: white;
}

.footer img{

  width: 125px;

  height: 80px;
  margin-top: 8px;

}


.footer small{

  color: white;
  font-family: poppins;
  font-size: 12px;
}

.fa-twitter{

margin-right: 8px;


}

#user{

  height: 40px;
  width: 40px;
  border-radius: 50%;
  display: none;

}

#twitter_user{


  width: 100%;
}


#twitter_user img{


  width: 100%;
  border-radius:8px;
}


 #cloud{
        width:100%;
        padding-left:20px;
        opacity:0.9;
        animation:slide 10s infinite;
        font-family: poppins;
        font-size:15px;
        font-weight: 700;
        color:red;
        margin-top: 8px;
         
}

@keyframes slide{
    0%   {transform: translate(0px, 0px); }
        100% {transform: translate(500px,0px); }
   


}

.logoUS{

  height: 80px;
  width: 135px;
  float: right;
  margin-top: 13px;
}


.search{

  display: none;
}




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


#managers_notes{

padding: 8px;

}

.menu{

  box-shadow: 0px 0px 13px rgba(243,243,243,1);
}


.main{


  height:430px;
}




#popup-messaging{

width:340px;}

  #cloud{
        width:100%;
        padding-left:20px;
        opacity:0.9;
        animation:slide 10s infinite;
        font-family: poppins;
        font-size:12px;
        font-weight: 700;
        color:red;
        margin-top:23px;
         
} 

.menu{


background-color: rgba(0,20,80,1);
padding: 30px;

color: white;

position: absolute;

margin: auto;

left: 0;

right: 0;

top: 15%;



}


.menu p{


  width: 100%;
  font-size: 13px;
}

  
#loader{

width:50px;
height:50px;



}

h1{

display: none;


}
.overlay{
height:100%;
width: 0%;
display: block;
position:fixed;
z-index: 500;
top:0;
right: 0;
color:#818181;
background-image:linear-gradient(to right,rgba(243,243,243,1),rgba(243,243,243,0.9),rgba(243,243,243,0.6)),url(logo.PNG);

background-size: cover;

background-position: 20% center;

height:100%;
overflow-x:hidden;
transition: 0.5s;

}
.overlay-content{
position:relative;
top: 20%;
left:8%;
}

.overlay a{

margin-top:13px;
padding: 5px;
font-size:18px;
color:#161e39; 
display: block;
text-transform:uppercase;
font-weight: bold;
font-family:poppins;
transition: 0.3s;

}
.overlay .close-btn{
position: absolute;
top: 3px;
right: 15px;
font-size: 28px;
color:rgba(0,0,0,0.8);
padding:5px;
transition: 0.3s;
border-radius:50%;

}

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

  outline: none;
box-shadow: none;
color:rgba(0,0,0,0.5);


}

.fa-arrow-right{

display: none;

}



.gallery:hover + .fa-arrow-right{

display: block;

}



.overlay a:hover,.overlay a:focus{
  color:white;
  text-decoration: none;
}


#open-btn{

 position: absolute;
   display: block;
  color: white!important;
  border:1px solid transparent;
  
  background-color:rgba(0,20,80,0.8); 

  padding:6px;
  top:20%;
  right: 3%;
  
  font-size:15px;
  
  cursor: pointer;
  
  
}

.logoU{

height:80px;
width: 175px;
margin:0;
margin-top: -10px;


}



#logotext{

padding: 0;
margin: 0;


}


.search{

  display: none;
}


.navbar{

float: none;

font-family: poppins;

font-size: 14px;


}


.footer img{

  width:110px;
  height: 70px;
}



.footer small{

  font-size: 10px;
}

.col-md-3{

  margin-top: 10px;
  margin-bottom: 10px;
}

.logoUS{

  height: 80px;
  width: 155px;
  float: right;
  margin-top: 13px;
  display: none;
}

#kings h4{


font-size:17px;


}


}