*,
*::before,
*::after{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
	    font-family: "Times New Roman", Times, serif;
}




/*------NAVTEXT------*/


.navbaratc {
  overflow: hidden;
/*  background-color: #333;*/
}

.navbaratc a {
  float: left;
  font-size: 16px;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

.dropdownatc {
  float: left;
  overflow: hidden;
}

.dropdownatc .dropli {
  font-size: 16px;  
  border: none;
  outline: none;
  color: white;
  padding: 14px 16px;
  background-color: inherit;
  font-family: inherit;
  margin: 0;
}

.dropli i{
	    font-size: 12px;
    vertical-align: middle;
}
.navbaratc a:hover, .dropdownatc:hover .dropli {
  font-weight:bolder;
  
  
}

.pagal{
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.pagal a {
  float: none;
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

.pagal a:hover {
  background-color: #ddd;
}

.dropdownatc:hover .pagal {
  display: block;
}

html{
    font-family: 'Roboto', sans-serif;
    font-size: 10px;
}

header{
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    transition: background-color .5s ease;
    z-index: 1000;
}

.container{
    width: 100%;
    max-width: 120rem;
    margin: 0 auto;
    padding: 0 1.5rem;
}

.nav{
    width: 100%;
    height: 10rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 2px solid rgba(255,255,255,.05);
    transition: height .5s ease;

}

.nav a{
    text-decoration: none;
    color: #fff;
    font-size: 1.6rem;
    display: block;
}
.nav .pagal a{
    color:slateblue;
}
.nav .logo{
    font-size: 3.5rem;
    font-weight: bold;
}

.nav-listatc{
    list-style: none;
    display: flex;
    margin-right: auto;
    margin-left: 4rem;
}

.nav-link{
    margin: 0 2rem;
    position: relative;
}

.nav-link::after{
    content: '';
    width: 100%;
    height: 2px;
    background-color: #fff;
/*    position: absolute;*/
    left: 0;
    bottom: -3px;
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .5s ease;
}

.nav-link:hover::after{
    transform: scaleX(1);
}

#nav-cta{
    display: inline-block;
    background-color: #fff;
    color: slateblue;
    padding: 1rem 2rem;
    border-radius: 2rem;
    transition: background-color .5s ease;
}

#nav-cta:hover{
    background-color: #d3d3d3;
}





.burger{
    background: transparent;
    border: 0;
    color: #fff;
    font-size: 20px;
    cursor: pointer;
    display: none;
}
.burger:focus{
    outline: none;

}
@media screen and (max-width:320px){
	
	#nav-cta{
    padding: 3.6px;
   }

	
}

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


    .burger{
        display: block;
    }

    .nav-listatc li{
        margin-top: 18px;

    }
    .nav-listatc{
        position: absolute;
        right: 0px;
        height: 100vh;
        top: 12vh;
        background-color: indianred;
/*        z-index: 1;*/
        margin: 0px;
        width: 50%;
        display: flex;
        flex-direction: column;
        align-items: left;
        transform: translateX(100%);
        transition: transform 0.6s ease-in;
    }

    .nav-active{
        transform: translateX(0%);
    }
   
    .navli{
        position: relative;
        display: block;

    }
    

}
/*Apply styles after scroll*/
.scrolling-active{
    background-color: #fff;
    box-shadow: 0 3px 1rem rgba(0,0,0,.1);
}

.scrolling-active .nav{
    height:12vh;
}

.scrolling-active .nav a{
    color: #313131;
}

.scrolling-active #nav-cta{
    background-color: #313131;
    color: #fff;
}

.scrolling-active #nav-cta:hover{
    background-color: #151515;
}

.scrolling-active .nav-link::after{
    background-color: #313131;
}
.scrolling-active .burger{
    color: navy;
}
.scrolling-active .dropdownatc .dropli{
    color: black;
}
@media screen and (max-width:768px){
    .scrolling-active .nav a{
        color: azure;
    }
    .scrolling-active .dropdownatc .dropli{
    color: azure;
}
    
/*
    .scrolling-active .navdrop a{
        color: slateblue;
    }
*/
}










/*popup*/





/* styles after scroll end*/



.hero{
    width: 100%;
    height: 100vh;
    background: url("img/airport.jpg") center no-repeat;
    animation: changing 20s infinite ;
    background-size: cover;
    position: relative;
    /* background-attachment: fixed; */
}
@keyframes changing {
  0% {
    background: url("img/airport.jpg") center no-repeat;
  background-size:cover
  }
  20% {
    background: url("img/cgl.jpeg") center no-repeat;
  background-size:cover
  }
    40% {
    background: url("img/cgl1.jpeg") center no-repeat;
  background-size:cover
  }
    60% {
    background: url("img/trbg1.jpg") center no-repeat;
  background-size:cover
  }
    80% {
    background: url("img/trbg2.jpg") center no-repeat;
  background-size:cover
  }
    
 100% {
   background: url("img/trbg3.jpg") center no-repeat;
  background-size:cover
  }
 
}
.heroabout{
    width: 100%;
    height: 36vh;
    background: url("img/bluback3.jpg") center no-repeat;
    background-size: cover;
    position: relative;
    opacity: 0.8;
    /* background-attachment: fixed; */
}

.hero::after{
    content: '';
    width: inherit;
    height: inherit;
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,.36);
}

.demo-content{
    width: 100%;
    height: 18vh;
    background-color: #fff;
}






/* welcome Section
--------------------------------*/
#welcome {
  padding: 36px 0 90px 0;
  background: url("img/back1.jpg") center no-repeat;
  background-size: cover;
}


#welcome .welcome-img
{
    
  overflow: hidden;
    padding: 1%;
    width: 50%;
    
}

#welcome .welcome-img img {
  margin-left: -15px;
  max-width: 100%;
}

#welcome .container{
    display: flex;
    flex-wrap: nowrap;
}
@media (max-width: 768px) {
  #welcome .welcome-img {
    height: auto;
  }
  #welcome .welcome-img img {
    margin-left: 0;
    padding-bottom: 30px;
  }
    
    #welcome .container{
    flex-direction: column;
    
}
    
#welcome .welcome-img{
    
    width: 80%;
    margin: auto;}
    
    #welcome .content{
margin-left:0px;
}
    
}





#welcome .content{
    
    
    border-top: 8.6px solid orange;
    border-bottom: 8.6px solid orange;
    padding: 18px;
	margin-top: auto;
    margin-bottom: auto;
       border-radius: 24px;
    font-size: large;
    width: fit-content;
    text-align: justify;
}
#welcome .content h2 {
    text-align: center;
  color: #000000;
  font-weight: 700;
  font-size: 28px;
    margin-bottom: 3vh;
  font-family: "Raleway", sans-serif;
}

#welcome .content h3 {
  color: #555;
  font-weight: 300;
  font-size: 18px;
  line-height: 26px;
  font-style: italic;
}

#welcome .content p {
  line-height: 26px;
}

#welcome .content p:last-child {
  margin-bottom: 0;
}

#welcome .content i {
  font-size: 20px;
  padding-right: 4px;
  color: #596bf3;
/*    margin-left: */
}

#welcome .content ul {
  /* list-style: A; */
  padding: 0;
  font-size: 16px;
  color: #03148F;
}

#welcome .content ul li {
  padding-bottom: 10px;
}



#welcome .section-header{
    text-align: center;
    font-size: 36px;
    color: azure;
    margin-bottom: 6vh;
}

#welcome .section-header h2{
    margin-bottom: 2vh;
	font-family: "Times New Roman", Times, serif;
}



/* Chandra shekhar Section
--------------------------------*/
#shekhar {
  padding: 36px 66px;
  background: #EFC5BB;
    background: url("img/bluback4.jpg") center no-repeat;
    background-size: cover;


}

#shekhar .section-header{
    text-align: center;
    font-size: 36px;
    color: azure;
}
#shekhar  img {
  max-width: 100%;
  opacity: 0.9;
  transition: 0.3s;
  padding: 15px 0;
    border-radius: 100%;
}

#shekhar img:hover {
  opacity: 1;
}

#shekhar .container{
    display: flex;
    flex-wrap: nowrap;
}

.containerdiv{
    width: 50%;
    margin: 10px;
  text-align: center;


}
.containerdiv1{

}
.containerdiv2 h2{
   color: indianred;
  font-size: 30px;
}
.containerdiv2 h3{

  font-size: 16px;
}
.containerdiv2 p{
    line-height: 75px;
  font-size: 28px;
    line-height: 30px;
}


@media only screen and (max-width: 700px) {
    
    #shekhar .container{
    display: flex;
    flex-direction: column-reverse;
        justify-content: space-around;
}
    
    .containerdiv{
        width: 100%;
    }
    
    
    
    
    
}


/*  RECENT POSTS  */
.section-headers {
  margin-bottom: 16px;
    margin-top: 24px;
}

.section-headers h2 {
  font-size: 32px;
  color: #071e33;
  text-transform: uppercase;
  font-weight: 700;
  position: relative;
  padding-bottom: 0px;
  /* display: inline-block; */
  text-align: center;
}

.section-headers h2::before {
  content: '';
  position: absolute;
  display: block;
  width: 200px;
  height: 3px;
  bottom: 0;
  left: 0;
  border-top: #596bf3 solid 2px;
  right: 0;
  text-align: center;
  margin: 0 auto;
}


.section-headers p {
  padding: 0;
  margin: 0;
  text-align: center;
  color: #333;
}

div.gallerydiv {
  border: 2px solid #ccc354;
    
}

div.gallerydiv:hover {
  border: 1px solid #777;
}

div.gallerydiv img {
  width: 100%;
  height: 360px;
}

div.desc {
  padding: 15px;
  text-align: center;
  font-size: 18px;
}
.noticeboard{
    display: flex;
    
}
.gal1{
    width: 33%;
}
.gal2{
    width: 33%;
}
.gal3{
    width: 33%;
}
* {
  box-sizing: border-box;
}

.responsivegallery {
  padding: 0 6px;
/*  float: left;*/
/*  width: 24.99999%;*/
}

@media only screen and (max-width: 700px) {
  .responsivegallery {
/*    width: 49.99999%;*/
    margin: 6px 0;
  }
    .noticeboard{
     flex-direction: column;
    
}
    .gal1{
    width: 100%;
        padding:30px;
}
.gal2{
    width: 100%;
}
.gal3{
    width: 100%;
}
}

@media only screen and (max-width: 500px) {
  .responsivegallery {
    width: 100%;
  }
}

.clearfix:after {
  content: "";
  display: table;
  clear: both;
}

.readmore{
    padding: 9px 16px;
    background-color:darkslateblue;
    color: white;
    text-decoration: none;
        
}
.readmore:hover{
    background-color:indianred;
}
/*--------------------------------------------------------------
# photo gallery
--------------------------------------------------------------*/


.markhead{
    font-size: 20px;
    color:red;
}

.mySlides {display: none;}
.mySlides img {vertical-align: middle;}

/* Slideshow container */
.slideshow-container {
  max-width: 1000px;
  position: relative;
  margin: auto;
}

/* Caption text */
 .captext {
  color: #f2f2f2;
	 font-weight:bold;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.activedot {
  background-color: #717171;
}

/* Fading animation */
.fadegall {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1s;
  animation-name: fade;
  animation-duration: 1s;
}

@-webkit-keyframes fade {
  from {opacity: .8} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .8} 
  to {opacity: 1}
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .text {font-size: 11px}
}
/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
#footer {
  background:#4B80E7;
  padding: 0 0 30px 0;
  font-size: 14px;
  color: #fff;
    z-index: 20;
    height: 30vh;
}

 #footer .container {
    display:flex;
   padding-top:48.6px;
     text-align: center;
}
.box{
     width:33%;
}
.box1{
display:flex;
text-align:left;
}
.homy1{
font-size:36px;
}
.homy2{
font-size:16px;
margin-left:10px;
}

.homerun{
	font-size: 36px;
}

.ulsm {
 
  display:flex;
}

.ulsm li {
  list-style: none;
}

.ulsm li a {
  position: relative;
  width:60px;
  height:60px;
  display:block;
  text-align:center;
  margin:0 10px;
  border-radius: 50%;
  padding: 6px;
  box-sizing: border-box;
  text-decoration:none;
  box-shadow: 0 10px 15px rgba(0,0,0,0.3);
  background: linear-gradient(0deg, #ddd, #fff);
  transition: .5s;
}

.ulsm li a:hover {
  box-shadow: 0 2px 5px rgba(0,0,0,0.3);
  text-decoration:none;
}

.ulsm li a .fab {
 width: 100%;
    height: 100%;
    display: block;
    background: linear-gradient(
0deg
, #fff, #ddd);
    border-radius: 50%;
    line-height: calc(56px - 18px);
    font-size: 24px;
    color: #262626;
    transition: .5s;
}

.ulsm li:nth-child(1) a:hover .fab {
  color: #3b5998;
}

.ulsm li:nth-child(2) a:hover .fab {
  color: #00aced;
}
.ulsm li:nth-child(3) a:hover .fab {
  color: #007bb6;
}
.ulsm li:nth-child(4) a:hover .fab {
  color: #FF0000;
}
#footer .copyright {
  text-align: center;
  padding-top: 30px;
  color: #ffffffad;
}


.termspol{
	background:cornflowerblue;
	padding:12px;
}
.termspol a{
	    color: white;
    font-size: 14px;
	
}
#footer .credits {
  text-align: center;
  font-size: 13px;
  color: #ffffff85;
  margin-top: 8px;
}


#footer .credits a {
  color: #278bf2;
}
.owl-carousel .owl-item img {
    display: block;
    width: auto;
    height: 70px;
    margin: 0 auto;
}


/* Back to top button */
.back-to-top {
  position: fixed;
/*  display: none;*/


  padding: 3.6px ;

  border-radius: 100%;
  right: 15px;
  bottom: 15px;
  transition: background 1s ease-in;
}
.back-to-top img{
    border-radius: 100%;
}
@media (max-width: 768px) {
  .back-to-top {
    bottom: 15px;
  }
  #footer .container {
   flex-direction:column;
   
     text-align: center;
}
.box{
     width:100%;
}
}

.back-to-top:focus {
  background: #596bf3;
  color: #fff;
  outline: none;
}

.back-to-top:hover {
  background: #278bf2;
  color: #fff;
}


html{
  scroll-behavior: smooth;
}


/* ABOUT US Section
--------------------------------*/
#aboutus {
  padding: 0px 0 60px 0;
/*  background: url("img/air2.jpg") center no-repeat;*/
  background-size: cover;
}

/* #welcome {
  padding: 60px 0;

} */
#aboutus .welcome-img {
  overflow: hidden;
    padding: 1%;
/*    width: 50%;*/
}

#aboutus .welcome-img img {
  margin-left: -15px;
  max-width: 100%;
}

#aboutus .container{
    display: flex;
    flex-wrap: nowrap;
}


#aboutus .content{
    margin-left: 24%;
    position: relative;
    display: inline-block; 
}





.aboutobj{
    margin-top: 66px;
    line-height: 26px;
    font-size: 20px;
  color: #03148F;
         border-top: 8.6px solid orange;
    border-bottom: 8.6px solid orange;
    border-radius: 24px;
    padding: 24px;
    padding: 36px 0px;
    background-color: lightgrey;
    
}
.textover{
/*position: absolute;*/
        margin: 0 auto;
        left: 0;
        right: 0;
        top: 16%; /* Adjust this value to move the positioned div up and down */
        text-align: center;
        width: 80%;            
}
#aboutus .content h2 {
  color: #000000;
  font-weight: 700;
  font-size: 18px;
  font-family: "Raleway", sans-serif;
}

#aboutus .content h3 {
  color: #555;
  font-weight: 300;
  font-size: 18px;
  line-height: 26px;
  font-style: italic;
}

#aboutus .content p {
  line-height: 26px;
}

#aboutus .content p:last-child {
  margin-bottom: 0;
}

#aboutus .content i {
  font-size: 20px;
  padding-right: 4px;
  color: #596bf3;
    margin-left: 
}

#aboutus .content ul {
  /* list-style: A; */
  padding: 0;
  font-size: 20px;
  color: #03148F;
}

#aboutus .content ul li {
  padding-bottom: 10px;
}



#aboutus .section-header{
    text-align: center;
    font-size: 36px;
    color: azure;
    margin-bottom: 10vh;
    position: absolute;
    top: 26vh;
    left: 36vw;
}

#aboutus .section-header h2{
    margin-bottom: 4vh;
}


#aboutus img{
   
}


@media (max-width: 768px) {
  #aboutus .welcome-img {
    height: auto;
      width: auto;
  }
  #aboutus .welcome-img img {
    margin-left: 0;
    padding-bottom: 30px;
  }
    
    #aboutus .container{
        flex-direction: column;
    }
    
    #aboutus .welcome-img img {
        margin-left: 0px;
  
        
}
    #aboutus .content{
        margin-left:0px; 
    }
   
    #aboutus .section-header{
    
    top: 26vh;
    left: 12vw;
}

    #aboutus .content img{
        width: 100%;
    }
    
    #aboutus .content ul {
  /* list-style: A; */
  padding: 0;
  font-size: 14px;
  color: #03148F;
}
	
	#aboutus .section-header h2{
    margin-bottom: 13vh;
}
	
}

@media (max-width: 1100px) {
	#aboutus .section-header h2{
    margin-bottom: 6.8vh;
}
}
/* Call To Action Section
--------------------------------*/
#call-to-action {
  background: #5c7fa2;
  background-size: cover;
  padding: 6px 0;
	margin-bottom:18px;
}

#call-to-action .cta-title {
  color: #fff;
  font-size: 28px;
  font-weight: 700;
}

#call-to-action .cta-text {
  color: #fff;
    font-size: 18px;
}

@media (min-width: 769px) {
  #call-to-action .cta-btn-container {
    display: flex;
    align-items: center;
    justify-content: flex-end;
  }
}

#call-to-action .cta-btn {
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
  font-size: 16px;
  letter-spacing: 1px;
  display: inline-block;
  padding: 8px 24px;
  border-radius: 3.6px;
  transition: 0.5s;
  margin: 10px;
  border: 3px solid #fff;
  color: #fff;
}

#call-to-action .cta-btn:hover {
  background: #ffffff;
  border: 3px solid #ffffff;
  color: #00a3d1;
}


/* Our Team Section
--------------------------------*/
#team {
  background: #fff;
  padding: 60px 0 0 0;
}
.row{
    display: flex;
}

#team .member {
  text-align: center;
  margin-bottom: 20px;
}

#team .member .pic {
  overflow: hidden;
  text-align: center;
}

#team .member .pic img {
  width: 240px;
  padding: 20px 20px 0;
    height: 240px;
}
#team .member .pic img:hover{
    box-shadow: 0px 2px 12px grey; 
}
#team .member .details {
  background: #fff;
  color: #071e33;
  padding: 15px 0;
  border-radius: 0 0 3px 3px;
}

#team .member h4 {
  font-weight: 700;
  margin-bottom: 2px;
  font-size: 18px;
}

#team .member span {
  font-style: italic;
  display: inline-block;
  font-size: 13px;
}

#team .member .social {
  margin-top: 5px;
  padding: 6px;
  text-align: center;
}

#team .member .social a {
  color: #07cc91;
  margin: 2px 6px;
  border: 1px solid #07cc91;
  width: 42px;
  display: inline-block;
   opacity: .4; 
  padding: 4px;
}
#team .member .social a:hover{
  color: #081e5b;
  margin: 2px 6px;
  border: 1px solid #081e5b;
  opacity: 1;
}
#team .member .social i {
  font-size: 16px;
  margin: 0 2px;
}
@media (max-width: 767px) {
  
    .row{
    display: flex;
        flex-direction: column;
}
    
    
    
}


.team-front ul{
	margin-top:36px;
}
/* Testimonials Section
--------------------------------*/
#testimonials {
  padding: 60px 0;
}

#testimonials .testimonial-item {
  box-sizing: content-box;
  padding: 30px 30px 0 30px;
  margin: 30px 15px;
  text-align: center;
  min-height: 250px;
  /* box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.08); */
}

@media (max-width: 767px) {
  #testimonials .testimonial-item {
    margin: 30px 10px;
  }
}

#testimonials .testimonial-item .testimonial-img {
  width: 90px;
  border-radius: 50%;
  border: 4px solid #fff;
  margin: 0 auto;
}

#testimonials .testimonial-item h3 {
  font-size: 18px;
  font-weight: bold;
  margin: 10px 0 5px 0;
  color: #111;
}

#testimonials .testimonial-item h4 {
  font-size: 14px;
  color: #999;
  margin: 0;
}

#testimonials .testimonial-item .quote-sign-left {
  margin-top: -15px;
  padding-right: 10px;
  display: inline-block;
  width: 37px;
}

#testimonials .testimonial-item .quote-sign-right {
  margin-bottom: -15px;
  padding-left: 10px;
  display: inline-block;
  max-width: 100%;
  width: 37px;
}

#testimonials .testimonial-item p {
  font-style: italic;
  margin: 0 auto 15px auto;
  background: #ffffff;
  width: 100%;
  border: 1px solid #07cc91;
  border-radius: 15px 15px 0 15px;
  padding: 22px 15px;
  font-size: 15px;
  color: #686868;
}

#testimonials .owl-nav, #testimonials .owl-dots {
  margin-top: 5px;
  text-align: center;
}

#testimonials .owl-dot {
  display: inline-block;
  margin: 0 5px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background-color: #ddd;
}

#testimonials .owl-dot.active {
  background-color: #07cc91;
}


p.help-block,
p.help-block ul{
    float: left; 
    margin: 0;
    padding: 0;
}
p.help-block li {
    float: left; 
    margin: 10px 0 0 0;
    padding: 0;
    list-style:none;
    color:red;
}




/*animations*/


/*  CHAT BOX  */

.open-button {
  background-color: indianred;
  color: white;
  padding: 0px 0px;
  border-radius: 100%;
  cursor: pointer;
  opacity: 0.8;
  position: fixed;
  bottom: 23px;
  left: 36px;
  width: 66px;
}
.open-button:focus{
    outline:  none;
}
.open-button img:focus{
    outline:none;
}
/* The popup chat - hidden by default */
.chat-popup {
  display: none;
  position: fixed;
  bottom: 0;
  left: 15px;
/*  border: 3px solid #f1f1f1;*/
  z-index: 10;
    transition: 2s ease-in;
}

/* Add styles to the form container */
.form-container {
  max-width: 300px;
  padding: 10px;
  background-color: white;
    border-radius: 8px;
}
.form-container input{
    width: 96%;
    margin:2px 1px;
    padding: 8px;
    border: 1px solid grey;
    border-radius: 3.6px;
    font-family:monospace;
    
}
/* Full-width textarea */
.form-container textarea {
  width: 100%;
  padding: 15px;
  margin: 5px 0 22px 0;
  border: 1px solid grey;
    border-radius: 6px;
/*  background: #f1f1f1;*/
  resize: none;
  min-height: 200px;
}
.form-container h1{
    text-align: center;
    color: #061e53;
    font-family: cursive;
}
/* When the textarea gets focus, do something */
.form-container textarea:focus {
/*  background-color: #ddd;*/
  outline: none;
}

/* Set a style for the submit/send button */
.form-container .btn {
  background-color: #4CAF50;
  color: white;
  padding: 16px 20px;
  border: none;
  cursor: pointer;
  width: 48%;
  border-radius: 6px;
  font-size: 17px;
  margin-bottom:10px;
  opacity: 0.8;
}

/* Add a red background color to the cancel button */
.form-container .cancel {
  background-color: #f54251;
}

/* Add some hover effects to buttons */
.form-container .btn:hover, .open-button:hover {
  opacity: 1;
}



/* Contact Section
--------------------------------*/
#contact {
  padding: 60px 0;
}

#contact .section-header{
    font-size: 13px;
}
#contact .contact-info {
  margin-bottom: 20px;
  text-align: center;
}

#contact .contact-info i {
  font-size: 24px;
  display: inline-block;
  margin-bottom: 0;
  color: #07cc91;
  float: left;
}


.homyer{
	font-size: 18px;
    margin-left: 10px;
    font-weight: bolder;
    color: #232954;
}


#contact .contact-info address, #contact .contact-info p {
  margin-bottom: 0;
  color: #000;
  display: block;
  float: left;
  width: 100%;
  margin-bottom: 15px;
  padding: 0;
  margin-top: 0;
  margin-left: 27px;
  font-size: 14px;
}

#contact .contact-info h3 {
  font-size: 16px;
  margin-bottom: 15px;
  font-weight: bold;
  text-transform: uppercase;
  color: #1c4450;
  float: left;
  margin: 8px 15px;
}

#contact .contact-info a {
  color: #000;
}

#contact .contact-info a:hover {
  color: #596bf3;
}

#contact .contact-address, #contact .contact-phone, #contact .contact-email {
  margin-bottom: 20px;
}

@media (min-width: 768px) {
  #contact .contact-address, #contact .contact-phone, #contact .contact-email {
    padding: 0;
    text-align: left;
  }
}

@media (min-width: 768px) {
  #contact .contact-phone {
  }
}

#contact #google-map {
  height: 290px;
  margin-bottom: 20px;
}

@media (max-width: 576px) {
  #contact #google-map {
    margin-top: 20px;
  }
  #hero .hero-content { 
    left: 5%;
	}
}

#contact .form #sendmessage {
  color: #596bf3;
  border: 1px solid #596bf3;
  display: none;
  text-align: center;
  padding: 15px;
  font-weight: 600;
  margin-bottom: 15px;
}

#contact .form #errormessage {
  color: red;
  display: none;
  border: 1px solid red;
  text-align: center;
  padding: 15px;
  font-weight: 600;
  margin-bottom: 15px;
}

#contact .form #sendmessage.show, #contact .form #errormessage.show, #contact .form .show {
  display: block;
}

#contact .form .validation {
  color: red;
  display: none;
  margin: 0 0 20px;
  font-weight: 400;
  font-size: 13px;
}

#contact .form input, #contact .form textarea {
  padding: 10px 14px;
  border-radius: 0;
  box-shadow: none;
  font-size: 15px;
}

#contact .form button[type="submit"] {
  background: #07cc91;
  border: 0;
  border-radius: 3px;
  padding: 10px 30px;
  color: #fff;
  transition: 0.4s;
  cursor: pointer;
}

#contact .form button[type="submit"]:hover {
  background: #0299c4;
}

/*--------------- BRAG ------------------*/

 .brag{
    display: flex;
    justify-content: center;
    background-color: #071e33;
    padding: 20px;
}

.brag p{
    text-align: center;
    color: white;
    font-size: 16px;
    font-weight: 100;
}

.brag h3{
    text-align: center;
    color: gold;
    font-size: 33px;
    font-weight: lighter;
}
.brag img{ 
    display: block;
    margin-left: auto;
    margin-right: auto;
        }


.bragsec{
    width: 25%;
    padding: 2.6%;
}



@media screen and (max-width:1100px){
	.brag h3{
   
    font-size: 20px;
    
}
}
@media screen and (max-width: 768px){
    .brag{
    flex-direction: column;
     }
    .bragsec{
    width: 100%;
    padding: 2.6%;
}
}



/*----------- ARTICLE PAGE ------------------*/



.artp{
	font-family: 'Poppins', sans-serif;
	font-size: 1.6em;
	font-weight: 300;
	line-height: 1.7em;
	color: #4F4E4E;
	text-align:justify;
}
.artp img{
	    border-radius: 36px;
    margin-left: auto;
    margin-right: auto;
    display: block;
	max-width: -webkit-fill-available;
}
.arta,
.arta:hover,
.arta:focus{
	color: inherit;
	text-decoration: none;
	transition: all 0.3s;
   
}

a:hover{
    text-decoration: none;
}


/* Side Bar*/

.btn-info{
    font-size: 60px;
}

#sidebar.active {
    margin-left: -250px;
}
.wrapper{
	display: flex;
	text-decoration: none;
	transition: all 0.3s;
}

#sidebar{
	min-width: 250px;
	max-width: 250px;
	background: url(img/bluback3.jpg) repeat;
	color: #fff;
	transition: all 0.3s;
    font-size: 1.6em;
}

#sidebar h2{
    font-size: 3em;
}
#sidebar .sidebar-header{
	padding: 20px;
	background: #075474;
}
#sidebar ul.components{
	padding: 20px 0;
	
}

#sidebar ul p{
	color: #fff;
	padding: 10px;
}

#sidebar ul li a{
	padding: 10px;
	font-size: 1.1em;
	display: block;
    text-align: center;
    border-bottom: 0.1px solid #D0D0D0;
	border-bottom-right-radius: 16px;
    border-top-right-radius: 6.8px;
    -webkit-box-shadow: inset 0px 0px 50px -14px rgba(0,0,0,0.66); 
box-shadow: inset 0px 0px 50px -14px rgba(0,0,0,0.66);
}

#sidebar ul li a:hover{
	color: #7386D5;
	background: #fff;
    
}
#sidebar ul li.active>a,
.arta[aria-expanded="true"] {
	color: #fff;
	background: #6d7fcc;
}

.arta[data-toggle="collapse"]{
	position: relative;
}

.dropdown-toggle::after{
	display: block;
	position: absolute;
	top: 50%;
	right: 20%;
	transform: translateY(-50%);
}
.artul ul a{
	font-size: 0.9em !important;
	padding-left: 30px !important;
	background: #6d7fcc;
}

#content{
	width: 100%;
	padding: 20px;
	min-height: 100vh;
	transition: all 0.3s;
}
#content table{
	    border-collapse: collapse;
    border: 1px solid black;
    margin-left: auto;
    margin-right: auto;
}
.prepage {
  text-decoration: none;
  display: inline-block;
  padding: 8px 16px;
  background-color: #f1f1f1;
  color: black;
    font-size: 1.3em;
}
.prepage:hover{
color: black;
   
}
.nextpage {
  text-decoration: none;
  display: inline-block;
  padding: 8px 16px;
  background-color: #4CAF50;
  color: white;
    font-size: 1.3em;
}
.nextpage:hover{
color: black;
   
    transition: 0.3s;
}
.pagination{
    display: flex;
}
.pagination div{
    width: 33%;
    text-align: center;
}
@media (max-width: 768px) {
    #sidebar {
        margin-left: -250px;
    }
    #sidebar.active {
        margin-left: 0;
    }
    #sidebarCollapse span {
        display: none;
    }
}
.demo-content{
    width: 100%;
    height: 36vh;
    background-color: #fff;
}
.articletop{
    width: 100%;
    height: 36vh;
    background: url("img/bluback4.jpg") center no-repeat;
    background-size: cover;
    position: relative;
    opacity: 0.8;
}

.articleback{
    position: absolute;
}
.articletext{
    position: relative;
}
#content{
	overflow: scroll;
    background: #fffbfb ;
    background-size: cover;
}

.articlehead{
   margin-left: auto;
    margin-right: auto;
    font-size: 36px;
    font-weight: bold;
/*    border-bottom: 3.6px solid red;*/
    color: tomato;
}

.gallhead{
    background-color: #071e33;
    color: white;
    padding: 3.6px;
    text-align: center;
    font-size: 24px;
}

.gallul{
	    font-family: 'ABeeZee', sans-serif;
   padding: 6px;
    margin-left: 24px;
    font-size: 1.6em;
    line-height: 1.4em;
    list-style-image: url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/4621/treehouse-marker.png);
}
.gallul li{
     margin-top: 3.6px;
    
}
.gallul a{
    text-decoration: none;
    color: darkslateblue;
}



/*------ EVENTS ------*/


 .evmaindiv{
           display: flex;
            width:80%;
            margin-left: auto;
            margin-right: auto;
            border-bottom: 1.8px solid grey;
            background-color: white;
     
/*    border-radius: 22%;*/
        }
        .evimg{
            width: 100%;
        }
    
        .evimgdiv{
            width: 30%;
            padding: 20px;
            padding-top: 48px;
            margin-bottom: auto;
            margin-top: auto;
        }
.evimgdiv img{
    border: 1px solid blue;
    border-radius: 10px;
    
}
.evimgdiv p{
    font-size:16px;
    text-align: center
}
        .evtxtdiv{
            width: 70%;
            padding: 20px 30px;
            color: darkslategrey;
            font-size: 18px;
			text-align:justify;
        }
        .evtxtdiv h3{
           font-size: 28px;
            color: darkblue;
                text-decoration: underline;
            margin-bottom: 16px;
        }

         .evtxtdiv h3::nth-child(2n){
			  text-align: left;
}

.evtxtdiv h3::nth-child(2n+1){
			  text-align: right;
}
        .evtxtdiv a{
            text-decoration: none;
            display: inline-block;
            padding: 8px 16px;
            background-color: midnightblue;
            color: white;
        }
        .evtxtdiv a:hover{
/*            text-decoration: underline;*/
            background-color:indianred;
        }
.eventbody{
    background-color: lightgrey;
    border-top: 6px solid lightgrey;
}
.marqueehead{
   FONT-SIZE:66PX;
    color: rebeccapurple;
      text-shadow: 2px 2px indianred;
    font-weight: bolder;
    text-decoration: underline;
}
        @media (max-width: 768px) {
            .evmaindiv{
                flex-direction: column;
                width: 96%;
                
            }
			  .evtxtdiv h3::nth-child(2n){
			  text-align: center;
}

.evtxtdiv h3::nth-child(2n+1){
			  text-align: center;
}
            .evimgdiv{
                width: 96%;
            }
            .evtxtdiv{
                width:96%;
            }
            .articlehead{
   margin-left: auto;
    margin-right: auto;
    font-size: 36px;
    font-weight: bold;
/*    border-bottom: 3.6px solid red;*/
    color: tomato;
}

        }





/******* CONSTABLES  ******/


	
 .constables {
  font-family: Arial, Helvetica, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

.constables td, #customers th {
  border: 1px solid #ddd;
  padding: 8px;
}

.constables tr:nth-child(even){background-color: #f2f2f2;}

.constables tr:hover {background-color: #ddd;}

.constables th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  background-color: #4CAF50;
  color: white;
}



		
		
			   .constables tr {
		
		   font-size:18px;
	  }
	  .constables  tr:hover {
		background: #b8aef2 ;
		   color:white;
	  }
.constables tr:hover a{
	color:white;
	
}
.constables a{
	text-decoration:none;
}
.constables a:hover{
	color:blue;
}