*{
	padding: 0;
	margin: 0;
	text-decoration: none;
	list-style: none;
}

body {
	width:100vw;	
	background: #eee;
}

.wraper {
	width: 100vw;
	height: 100%;
	margin-left: 0;
	margin-right: 0;
	margin-top: 0;
	background-color: #eee;
}

/* ---------menu bar formatting------------- */
nav {	
	clear: both;
	height: 100px;
	width: 100%;
	top: 0;	
	bottom: 0;
	background: #006f86;
}


#awuscologo {
	margin:10px 5px;
	padding: 2px; 
	height: 80px;
	float: left;
}

label.logo {
	float: left;
	color: #fff;
	font-size: 22px;	
	line-height: 90px;
	padding: 0 0 0 5px;
	font-weight: bold;
	margin-right: 80px;	
}

/* Menu button */
nav ul {
	float: right;
	margin-right:50px;
}

nav ul li {
	display: inline-block;
	line-height: 50px;
	margin: 30px 0 0 0;
}

/* Menu button text */

ul li a {
    background: #ff8800;
	color: #fff;
	font-size: 16PX;
	padding: 15px 40px;
	border-radius: 5px;
	margin-left: 3px;
	margin-right: 3px;
	font-weight:bold;
}

.active{
	background: #fff;
	text-decoration: none;
	font-weight: bold;
	border-radius: 5px;
	line-height: 40px;	
}

ul li a:hover {
	background: #fff;
	text-decoration: none;
	font-weight: bold;
	border-radius: 5px;
	/*line-height: 40px;*/	
}

/* Toggler button */
.checkbtn {
	font-size: 30px;
	color: #fff;
	float: right;
	line-height: 80px;
	margin-right: 15px;
	cursor: pointer;
	display: none;
}

#check {
	display: none;
}


.barundernavbar{
	    display:none;
	}

/*#srcsidebar1{
   background-image: url(image/Vest_Tie_Trucksuit.jpg);
   background-repeat: no-repeat;
   background-size:cover;
   background-position:center;
}*/

#content{
	background: #fff;
	  
}

#srcsidebar2{
   background-image: url(image/SRCUNIFORM1.jpg);
   background-repeat: no-repeat;
   background-size:cover;
   background-position:center;
}

		.gallerytext {
			clear: both;
			float:left;
			width: 100%;
			background: #808080;
		}
		.gallerytext p {
			text-align: center;
			color: #fff;
			font-size: 24px;
			font-weight: bold;
			padding: 0px;
		}
		div.gallery {
			float: left;
			margin: 0px;
			width: 100%;
			background: #cccccc;
			padding: 0 2vw 0 2vw;
		}
		div.photo {
			float: left;
			margin-top: 10px;
			margin-bottom: 10px;
			margin-left: auto;
			margin-right: auto;
			width: 100%;
			padding: 5px 0 0 5px;
			content-position: center;
			text-align: center;
		}
		div.photo:hover {
			border: 0px solid red;
		}
		div.photo img {
			width: 94%;
			height: 99%;
			margin-left: 3%;
			box-shadow: 1px 1px 2px 2px #2f4f4f;
		}
		div.desc {
			width: 99%;
			padding: 0px;
			text-align: center;
			color: #191970;
			font-weight: bold;
			margin-left: 3%;
		}




.col-md-6 {
	text-align: left; !important;
}

#footertext {
	text-align: center; !important;
}

.picturediv {
	float: left; !important;
	width:300;
	height:270;
	text-align: center;
	position: center;
	background: #2f4f4f;
	color: #fff;
	font-weight: bold;
	margin-right: 3%;
	border-radius: 3px;
}

.textdiv p {
	float: left !important;
	text-align: justify;
}


/* -----Picture Slides---------- */
.carousel-inner img {
	width: 100%;
	height: 100%;
}

.carousel-item {
	transition: -webkit-transform 5s ease;
	transition: transform 5s ease;
	transition: transform 5s ease, -webkit-transform 5s ease;
	-webkit-backface-visibility: visible;
  	backface-visibility: visible
}

.carousel-indicators {
	background: none;
}

.carousel-caption {
	width: 80vw;
	height: 20%;
	margin-right: auto;
	margin-left: auto;
	text-align: center;
	background: rgba(0,0,0,0.3);
	border-radius: 10px;
}


.carousel-caption h1 {
	font-size: 200%;
	font-weight: bold;
	text-shadow: 1px 1px 15px #000;
}

.srcmessage {
			text-align: justify; font-size: 20px; color:dodgerblue;padding: 5px 20px 5px 20px;
		}




/* -----Awusco Anthem---------- */
audio {
	width:100%;
	margin: 0px;
}


/* =============== Custom Underline Style =================================== */

		.underlineContainer{
		    clear:both;
			width: 100%;
			height:15px;
			padding: 0; /* no left and right padding- goes with full page line*/
			/*padding: 3px 330px; /* left and right padding goes with short line */
		}
		.line{
			width: 100%; /* width of the lines - Eg. full page */
			/*width: 50%; /* width of the lines - Eg. short line */
			height: 40px;
			padding: 0;
			position: relative;
		}
		.line::before, .line::after{
			content: '';
			position: absolute;
			width: 48%; /* space between the two lines*/
			height: 2px; /* thikness of the lines*/
			/*padding: 0 20px; */ 
			margin: auto;
			top: 12%;  /* Lower % raises the lines and higher % lowers the lines*/
		}
		.line::before{
			left: 0;
			background: linear-gradient(to right, #fff, #006f86);
		}
		.line::after{
			right: 0;
			background: linear-gradient(to right, #006f86, #fff);
		}
		.shape{
			width: 10px;
			height: 10px;
			border: solid #006f86 2px;
			/*border-radius: 50%;*/
			top: 0;
			bottom: 0;
			left: 0;
			right: 0;
			margin: auto;
			transform: rotate(45deg);
			background: #006f86; 
		}
/* ========================================================================= */






/* -----1st Screen Break Level------------------------------ */
@media (max-width: 992px) {
	label.schname {
		float: left;
		color: light green;
		font-size: 20px;
		line-height: 50px;		
	}	
		
	nav ul li a {
		font-size: 15px;
		padding: 10px 2px;
	}

	.welcome {
		width: 98%;
		height: 550px;
	}

	.adminotice {
		font-size: 17px;
	}

	.carousel-caption h1 {
		font-size: 180%;
	}
	.carousel-caption h3 {
		font-size: 140%;
	}

	.srcmessage {
			text-align: justify; font-size: 20px; padding: 5px 15px 5px 15px;
		}
}


/* -----2nd Screen Break Level------------------------------ */
@media (max-width: 852px) {

		label.schname {
		float: left;
		font-size: 15px;
		marging: 0;		
	}	
		.checkbtn {
		display: block;
	}
	
	nav ul {
	    margin-right:0px;
    }

	ul {
		position: relative;
		width: 50%
		height: 100%;
		background: transparent;
		top: 0;
		left: 0;
		text-align: center;
		display: none;
	}

	nav ul li{
		display: block;
		width: 100vw;
		line-height: 20px;
		border-bottom: 1px solid #006f86;
		background:transparent;
		border-radius:0;
	}
	
	nav ul li a {
	    width:100%;
	    margin:0;
		color: #006f86;
		font-size:18px;
		background:transparent;
		padding:8% 35% 0 35%;
	}

	
/*	ul li a {
	color: #006f86;
}*/

.active {
	color: #006f86;
	line-height: 20px;
}

	#check:checked ~ ul {
	    clear:both;
		display: block;
		background-color: whitesmoke;
	}
	
	#content{
	    padding: 0 15px;
	  
    }
	.carousel-caption {
	width: 80vw;
	height: 40%;
	top:58%;
    }
	
	.carousel-indicators {
	    top: 70%;
    }

	.login {
	padding: 5px;
	margin-left: 20px;
	font-size: 12px;
	}

	.searchbox {
	display: none;
	}

	.searchbutton {
	display: none;
	}
	
	.barundernavbar{
	    display:block;
	    height:10px;
	    background:transparent;
	}

	.welcome {
		width: 98%;
		height: 650px;
	}

	.adminotice {
		font-size: 17px;
	}

	label.logo {
		font-size: 24px;
		padding-left: 5px;
		line-height: 80px;
		margin-right: 0;		
	}

	.picturedesc {
		font-size: 15px;
		}

	.picturedesc h5 {
		font-size: 15px;
	}

	.headpicture {
		margin-left: auto;
		margin-right: auto;
		width: 70%;
		height: 100%
		padding: 15px 0;
	}

	#slides {
	    clear:both;
		display: block;
		margin-left: auto;
		margin-right: auto;
	}

	.srcmessage {
			text-align: justify; font-size: 20px; padding: 5px 15px 5px 15px;
		}
		
	#srcsidebar1{
        display:none;
    }
    
}

/* -----3rd Screen Break Level------------------------------ */
@media (max-width: 576px) {
	label.schname {
		display: none;		
	}	

	.welcome {
		width: 99%;
		height: 1250px;
		padding: 3px 5px 10px 5px;
	}

	.picturedesc {
		font-size: 10px;
		}

	.picturedesc h5 {
		font-size: 12px;
		}

	.adminotice {
		font-size: 17px;
	}

	label.logo {
		font-size: 24px;
		padding-left: 5px;
		line-height: 80px;
		margin-right: 0;		
	}

	.login {
	padding: 5px;
	margin-left: 10px;
	font-size: 12px;
	}

	.searchbox {
	display: none;
	}

	.searchbutton {
	display: none;
	}


	.welcometext {
	text-align: justify;
	padding: 0 10px 0 10px
	}


	.headpicture {
		margin-left: auto;
		margin-right: auto;
		width: 70%;
		height: 100%
		padding: 15px 0;
	}

	.srcmessage {
			text-align: justify; font-size: 20px; padding: 5px 5px 5px 5px;
		}

	.col-xs-12 {
		margin-left: auto;
		margin-right: auto;
		width: 100%;
		padding: 0;
	}
	
}


    /*-----------Footer Section----------------------*/
    footer {
	width: 100%; 
	height: 100%;
	clear: both;
	color: #fff;
	padding: 0;
	background-color: #006f86;
	font-size: 18px;
}

.row {
	width: 100%;
	height: 100%;
	margin-right: auto;
	margin-left: auto;
}

footer i {
	font-size: 15px;
	font-weight: bold;
	padding: 0 10vw 0 10vw;
}