/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
    @media screen and (max-height: 450px) {
        .sidenav {padding-top: 15px;}
        .sidenav a {font-size: 18px;}
    }  



@media screen and (max-width:  900px){
 .school-cards{
    margin-bottom: 20px;
    height: 300px;
}

 #web_header_brand_name{
 	font-size: 25px;
 	font-weight: bold;
 }   
#web_header_motto{
	padding-left: 80px;
	font-size: 18px;
}

#kubwa > li{
padding-top: 20px;

}

#view_full_gall_img_body{
	width: 100%;
}
img.actual_gallery_image{
     
 height: 50vh;  

}

.gallery_imgs_controls_btn{
	top: 100px;
}
.uniform_cards  img{

width: 300px;
}
#collapse_div > a{
	padding-top: 10px;
}

#explore_collapse_div > a{
padding-top: 10px;
}

a{
	padding-top: 10px;
}

 .anthem_cards:first-child{
margin-bottom: 30px;
    } 

#php-slides{
	width: 100%;
}
#web_header_logo_image{
	width: 60px;
	 height: 60px;
}

#web_header_brand_name{
	padding-left: 7px;
}

#web_header_motto{
	 padding-left: 7px;
}

 #events_show_room{
 	width: 100%;
 }
 .event_img_cont{
 	width: 100%;
 	clear: left;
 }
 .event_img_cont > img{
text-align: center;
width: 250px;
 }
.jedwali-row{
    width: 100%;
    text-align: center;

}
 .gallery_event_image{
 	width: 250px;
 }
    
    .anthem_cards:last-child{
margin-top: 30px;
    }   
   #mobileMenuBtn{
   	
   } 

    
#mainNav_mobile{
	width: 100%;
	min-width: 100%;
	max-width: 100%;
	display: block;
	background-color: #006600;
	margin: 0;
	padding: 0;
	transform: translateY(-20px);
}
#lg_topnav_content{
	display: none;
}
.event_img_cont{
	display: flex;
	text-align: center;
	align-items: center;
}
.event_img_cont img{
	align-self: center;
	margin-left: 50px;
}
.event_p_cont{
display: block;
}
#events_show_room{
	display: block;
}

#events_show_room h3{
	text-align: center;
	margin-left: 30px;
}
#events_show_room img{
	width: 350px;
	height: 350px;
}
#events_show_room p{
	display: none;
}

#explore_paton{
	text-align: center;
	
}
#head p{
 font-size: 13px;   
}

.desc_n{
  font-size: 40px;  
}


.other_cards{
	margin-left: 50px ! important;
}

.other_cards p{
	font-size: 20px;
}


.announcement_card p{

	font-size: 20px;
}

.office_hours li{
	font-size: 18px;
}

.office_hours h5{
	font-size: 20px;
}
.quick_links{
	margin-left: 90px;
}
.quick_links a{

font-size: 18px;	
}
.quick_links h5{
	font-size: 20px;
}
.img-top-card{
	width: 50px;
	height: 50px;
}
.academics_comm_container{
	display: block;
}
.academics_comm_big{
display: block;
	justify-content: center;
	margin-left: 0 ! important;
	margin-top: 50px;
		
}
.academics_comm_big h5{
	margin-top: 20px;
}

.academics_comm{
	max-width:  300px;
	min-width: 300px;
	width: auto;
/*margin-bottom: 60px;
margin-top: 60px;*/
margin: auto;
float: none;

}


.social_media a{
	font-size: 18px;
}
.social_media h6{
	font-size: 18px;
}

.social_media h5{
	font-size: 20px;
}
.leave_message{
	margin-left: 30px;
}
.leave_message h5{
	font-size: 20px;
}

#academics_kcse_comments{
	display: inline-block;
}

#academics_kcse_table{
	overflow: auto;
}

#myTopnav{
    display: block;
 }   
 #mainNav{
    display: block;
 }

.large_screen_controls{
    display: none;
}

#header p{
   font-size: 23px; 
}

#header{
	min-width: 100%;
	max-width: 100%;
	padding: 0;
	margin-bottom: 0 ! important;
}

.nice-box{
    margin-left: 30px;
    padding: 5px;
}

body{
	max-width: 100%;
	min-width: 100%;
	overflow-x: hidden ! important;
	padding: 0;
	margin:  0;
}

.nice-box-footer{
	padding: 50px;
}

.announcementCard{
	width: 320px;
	margin-left: 0;
	transform: translateX(-50px);
}

}/*this is all about mobile device*/