/*main body text and background*/

body
{margin:0;
 padding:0;
  font-family:sans-serif;}

body
 {background-repeat: no-repeat;
 	background-attachment: fixed;}

			/*main header and logo*/

.main-header p {
	text-align: center;
	padding-top: 0px;
	margin-top: 0px;
	color:red;
	font-size: 32px;
	font-weight: bolder;
	text-shadow: 2px 2px 2px#778899;}


.indexlogo{
	margin-left:auto;
	margin-right:auto;
	 margin-top: 0px;
	 margin-bottom: 0px;
	  display:block;
	  width:225px;}

	  .phonenumber{
	text-align: center;
	width: 100%;
	margin-left:auto;
	margin-right: auto;
	display: inline-block;
	}

.textlogo{
	width:1.5em;
}

.textlogo1{
	width:1.25em;
	padding-top: 4px;
	margin-left: 4px
}

.pn{color: red;}



			/*mobile nav bar*/
.navbutton
{width: 90%;
 margin-left: auto;
 margin-right: auto;}


.nav-toggle {
	box-shadow: 3px 3px 5px black;
	 border-radius: 20px;
	  width:80%;}

.main-navbar
{width:80%;
 background:#00316b}

.nav-navbar{
	width: 80%;
	 border-radius: 25px}

.nav-navbar li a {
	border-radius: 18px;
	box-shadow:4px 4px 6px black;
	  margin-top: 0px;
	   font-size: 25px;
	   text-shadow: 2px 2px black;
	    padding-top: 2px;
	     background-image: linear-gradient(blue,lightskyblue , blue) }

.nav-navbar li 
{margin-top: 0px;
 padding: 3px}

ul{width:100%; margin:auto; padding:0;}

ul li{list-style: none; padding:20px; }

li:  {  color: #e91e63 ;outline: solid white;}

ul li a {color: #fff; text-decoration: none;font-weight: bolder;display: block; height: 45px; text-align: center;padding-top: 10px;}

			/*desktop nav bar*/
.desknav {width:1215px;background-color:lightsteelblue;}

.desknav{width:1215px; border-radius:15px; margin:auto; box-shadow: 5px 5px 7px black }

ul#navmenu{list-style-type: none; width:100%;margin:auto; display: inline-block;}

ul#navmenu li{ 
	width:145px;
	text-align: center;
	position: relative;
	float: left;
	margin-top: 7px;
	margin-bottom: 3px;
	margin-left: 0.5%;
	padding: 0;}

	ul#navmenu a{
		background-image: linear-gradient(blue,lightskyblue , blue);
		 box-shadow: 2px 2px 5px black;
		 text-shadow: 2px 2px black;
		padding: 0;
		text-decoration: none;
		display: block;
		width: auto;
		height: 35px;
		margin-top: 0px;
		margin-bottom: 0px;
		padding-top: 2px;
		border-radius: 25px;
		font-size: 19px;
		}


		/* courses drop down menu*/
		
ul #navmenu .sub1 a{margin-top: 5px; 
}
ul#navmenu li:hover >a{ background-image:linear-gradient(red,lightskyblue , red); color:white; }

ul#navmenu ul.sub1 {
	background-colo: blue;opacit: 0.7;
	display: none;
	position: absolute;
	top: 26px;
	left:0px;
	z-index: 100;

}

	ul#navmenu li:hover .sub1 {display:block;}

	/*useful links dropdown menu*/


	ul #navmenu .sub2 a{
		margin-top:5px; 

}
ul#navmenu li:hover >a{ background-color: red}

ul#navmenu ul.sub2 {
	display: none;
	position: absolute;
	top: 26px;
	left:0px;
	z-index: 100;
}

	ul#navmenu li:hover .sub2 {display:block;}


		/*study dropdown menu*/

	ul #navmenu .sub3 a{
		margin-top:5px; 

}
ul#navmenu li:hover >a{ background-color: red}

ul#navmenu ul.sub3 {
	background-colo: blue;opacit: 0.7;
	display: none;
	position: absolute;
	top: 26px;
	left:0px;
	z-index: 100;
}

	ul#navmenu li:hover .sub3 {display:block;}

			/*mobile nav bar*/
	
.icon-bar {;height:5px; ;margin-left: 15px;
		background:black;
		margin-top:5px ;
		margin-bottom: 5px ;
		border-radius: 24px;
		transition: .3s;
		width: 1.5em;}

.nav-toggle{
	background: linear-gradient(to top, #3399ff 13%, #ffffff 100%);
	width:100%;}

		/* desktop to mobile responsive settings*/

@media(min-width: 1236px)  {
	.nav-toggle{display: none}
}

@media(max-width:1235px){
	.desknav{display:none;}
}

			/* css of content*/
div.gallery{ border: 1px solid #ccc; text-align: center; background: white;box-shadow: 2px 2px 2px black;border-radius: 10px; }

div.gallery:hover {border: 1px solid #777; box-shadow: 5px 5px 5px black;}

div.gallery img {width: 100%
					height:auto;
					margin-left: auto;
					margin-right: auto;
					padding-top: 15px}

div.desc {
	padding: 15px;
	text-align: center;
}

*{box-sizing: border-box;}

.responsive{
	padding: 0 6px;
	float: left;
	width:24.99999%;

}

@media only screen and (max-width: 1270px) {.responsive{width:49.99999%; margin: 6px 0;}}

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

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

/*footer*/

.footer {
	width:100%;
	 background-color: lightsteelblue;
	 margin-bottom: 0px;
	 padding-bottom: 0px}

.footer p {background-color: lightsteelblue;
	margin-bottom: 0px;
	 padding-bottom: 0px}

.socialmedialogos { background-color: lightsteelblue;
	display:inline-block;
	width:100%;
	 margin:auto;
	 text-align: center;}

.fblogo {
	width:4.5em;
	 margin-left: auto;
	 margin-right: auto;
	 padding:5px;}

.instalogo {
	width:4em;
	 margin-left: auto;
	 margin-right: auto;
	 padding: 5px}

.twitterlogo {
	width:4em;
	 margin-left: auto;
	 margin-right: auto;
	 padding:5px;}