html
{
  background-color: rgb(0,127,198);
}
  
#school_details
{
  position: relative;
  top:1%;
  width: 100%;
  text-align: center;
  font-family:"Arial";
}

#sponsor
{
  position: relative;
  text-align: center;

  top:10%;
  width:100%; 
  
  font-family:Varsity;
  font-size:3vw;
  font-weight: 500;

 }

#name
{
  position: relative;
  
  top:10%;
  width:100%; 
  
  font-family:Varsity;
  font-size:4.5vw;
  font-weight: 500;

 }

 #ccilogo
 {
  position: relative;
  
  height:100%;
  width:100%; 

 }

 .mapouter
 {
  position:relative;
  text-align:right;
  
  }

.gmap_canvas 
{
  overflow:hidden;
  background:none!important;

  
}

@font-face {
  font-family: Varsity;
  src: url('fonts/varsity_regular.woff') format('woff'), /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
       url('fonts/varsity_regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5, Opera 10+, Safari 3—5 */
}

a
{
  color:rgb(236,132,17)
}

 .social a{
  
  font-size: 2.5em;
  padding-right: 2em;
  padding-left: 2em;
  
}

 .fa-facebook-square{
  color:#3b5998;
}
.fa-twitter-square{
  color:#00aced;
}
.fa-google-plus{
  color:#dd4b39;
}
.fa-instagram{
  color:#517fa4;
}
.fa-youtube-play{
  color:#bb0000;
}

.fa-facebook-square:hover,
.fa-twitter-square:hover,
.fa-google-plus:hover,
.fa-instagram:hover,
.fa-youtube-play:hover{
  color:hsl(135%, 100%, 37%);
}

#post_text
{
  color:rgb(236,132,17);
  font-size:0.7rem;
}

footer {
  background-color: rgb(0,127,198);
  color:#d5d5d5;
  padding-top: 2rem;
}


hr.light{
  border-top: 1px solid #d5d5d5;
  width:90%;
  margin-top: .8rem;
  margin-bottom: 1rem;
  margin-left: 2rem;
  margin-right: 2rem;
}



/* ============ make the dropdown submenus appear on the right ============ */
.dropdown-menu .dropdown .dropdown-menu {
  left: 100%;
  top: 0%;
  margin: 0 20px;
  border-width: 0;
}
/* ======================================================================= */


.dropdown-menu > li a
{
  color:rgb(236,132,17)
}

.nav-item > a
{
  color:rgb(236,132,17)
}


.carousel .carousel-indicators li 
{
  background-color:rgb(4,38,84);
}

.carousel .carousel-indicators li.active
{
  background-color:rgb(236,132,17);
}

#figure_caption
{
  color:black;
  font-size: 25px;
  font-weight: 600;
}

#management ol
{
  display: inline-block;
  text-align: left;
}

#an_article
{
  font-size: 25px; 
  
}

.table {
  border: 1px solid black;
}

.table thead th {
  border-top: 1px solid #000!important;
  border-bottom: 1px solid #000!important;
  border-left: 1px solid #000;
  border-right: 1px solid #000;
}

.table td {
  border-left: 1px solid #000;
  border-right: 1px solid #000;
  border-top: none!important;
  white-space: nowrap;

}


/* ============ small devices ============ */
@media screen and (max-width: 400px) 
 {
  .social a{ 
    
    padding-right: 0.5em;
    padding-left: 0.5em;
    
  }
 }

/* ============ small devices ============ */
@media screen and (max-width: 900px) 
 {

  #school_details_lg {display: none;}
  #school_details_sm {display: block;}

  #large_image_slider {display: none;}
  #slides {display: block;}
  #small_news_post {display: block;}

  #ccilogo { height:200px; width:280px; }
  #school_name { top: 10%;}
  #name {font-size: 7vw;}
  #sponsor {font-size: 5vw;}

  #post_text { font-size:1em;}
  #management_heading {font-size:1em;}


  #figure_caption {font-size: 15px;}
  #an_article {font-size: 15px;}

  #a_footer {position:relative;}

  .fa {font-size: 30px; width:30px}

  .dropdown-menu .dropdown-menu
  {
		margin-left:0.7rem; margin-right:0.7rem; margin-bottom: .5rem;
  }

  
  
 
}
/* ============ small devices .end// ============ */


/* ============ desktop view ============ */
@media screen and (min-width: 901px) 
 {

  #school_details_lg {display: block;}
  #school_details_sm {display: none;}

  #large_image_slider {display: block;}
  #small_image_slider {display: none;}
  #small_news_post {display: none;}
  
  #post_text {font-size: 2vw;}
  
  #carousel_image > img {height:80vh; width:40vw;}
  
  .dropdown-menu .dropdown .dropdown-menu {
    margin: 0;
    border-width: 1px;
  }

  .dropdown-menu > li a:hover,
  .dropdown-menu > li.show {
    background: #ffbb00;
    color: white;
  }
  .dropdown-menu > li.show > a {
    color: white;
  }

}
/* ============ desktop view .end// ============ */