@import url("https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i|Poppins:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i");
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200;300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css?family=Abhaya+Libre|Molengo|Poppins|Open+Sans');
@import url(https://allfont.net/allfont.css?fonts=agency-fb);
body{margin:0; font-size: 14px; font-family: "Poppins", sans-serif, sans-serif;}
#main{width:100%; height:auto; float:left}
#main-inner{width:90%; height:auto; margin:0 auto; overflow:auto}
#main-inner1{width:86%; height:auto; margin:0 auto;}
#main-inner2{width:90%; height:auto; margin:0 auto; overflow:auto}
#main-inner3{width:100%; height:auto; margin:0 auto; overflow:auto}
#main-inner4{width:98%; height:auto; margin:0 auto; overflow:hidden}

a{text-decoration:none; color:#333}

.upheader-bac{background:#015dab; border-top: 3px solid #db7702;}
#upheader{width:100%; height:auto; float:left; padding:0.5% 0}
#upheader .left{width:85%; height:auto; float:left; margin:0.5% 0 0 0;}
#upheader .left p{float:left; margin:-0.5% 3% 0 0; color:#fff;}
#upheader .left .p{float:left; margin:-0.5% 3% 0 0; color:#fff; font-size:13px}
#upheader .left p img{width:18px; height:18px; float:left; margin:1% 0 0 0}
#upheader .left p .img{width:18px; height:18px; float:left; margin:0% 0 0 0}
#upheader .left a{color:#fff}
#upheader .middle{width:7%; height:auto; float:right; margin:0.2% 0}
#upheader .middle a{width:22%; height:auto; float:left; margin:0 2%; border:#fff 2px solid; border-radius:50%; padding:0%; transition:0.5s}
#upheader .middle a:hover{border:#63bc46 2px solid;}
#upheader .middle a img{width:70%; height:auto; float:left; margin:15%}

.fixedup .navbar-scrolltofixed.scroll-to-fixed-fixed {background:#fff; margin-top:0; padding-top: 8px; padding-bottom: 8px; -webkit-box-shadow: 0px 5px 16px 0px rgba(0,0,0,0.2); -moz-box-shadow: 0px 5px 16px 0px rgba(0,0,0,0.2); box-shadow: 0px 5px 16px 0px rgba(0,0,0,0.2);}

.mainlogo{width:35%; height:auto; float:left; padding:0;}
.mainlogo img{width:100%; height:auto; float:left; margin:0}

.menudiv-bac{background:#fff; padding: 0.5% 0;}

.welcomebg{background: url('images/aboutbg.png') #fff top no-repeat; background-size: 100% auto; padding-top: 30px;}
#welcome{width:100%; height:auto; float:left; padding:5% 0; text-align: center;}
#welcome h4{width:100%; height:auto; float:left; color: #6b6c6c; margin: 0;}
#welcome h1{width:100%; height:auto; float:left; color: #db2429; margin:0; font-size: xx-large;}
#welcome b{width:10%; height:auto; float:left; color: #9c0c0b; margin: 6px 45% 30px 45%; background: #7e7e7e; padding: 2px 0;}
#welcome p{width:60%; height:auto; float:left; margin: 0 20%; font-size: 16px; line-height: 170%;}
#welcome a{width:16%; height:auto; float:left; color: #fff; font-size: 16px; margin: 25px 42% 30px 42%; background: #0081b1; padding: 10px 0; text-align: center; border-radius: 30px; transition: 0.5s;}
#welcome a:hover{background: #025c7d;}

.cour{width: 80%; height: auto; float: left; margin: 20px 10%;}
.cour h2{width: 100%; height: auto; float: left; color: #0275c1; margin: 0; font-weight: 500; text-align: center; font-size:x-large;}
.cour b{width: 8%; height: auto; float: left; margin: 5px 46%; padding: 2px 0; background: #616161;}

.figurecon{width: 50%; height: auto; float: left;}
figure.snip1205 {
  position: relative;
  overflow: hidden;
  margin: 0;
  min-width: 220px;
  max-width: 610px;
  width: 25%;
  height: 500px;
  float: left;
  background: #000000;
  text-align: center;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
.figurecon .snip1205 {
  position: relative;
  overflow: hidden;
  margin: 0;
  min-width: 220px;
  max-width: 610px;
  width: 50%;
  height: 250px;
  float: left;
  background: #000000;
  text-align: center;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
figure.snip1205 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.35s ease-in-out;
  transition: all 0.35s ease-in-out;
}
figure.snip1205 img {
  max-width: 100%;
  vertical-align: top;
  width: 100%;
  height: 100%;
}
figure.snip1205 i {
  position: absolute;
  top: 50%;
  left: 50%;
  border-radius: 50%;
  font-size: 34px;
  color: #000000;
  width: 60px;
  height: 60px;
  line-height: 60px;
  background: #ffffff;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
  -webkit-transform: translate(-50%, -50%) scale(0);
  transform: translate(-50%, -50%) scale(0);
  transition: all 300ms 0ms cubic-bezier(0.6, -0.28, 0.735, 0.045);
}
figure.snip1205 a {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  position: absolute;
}
figure.snip1205.green {
  background-color: #183641;
}
figure.snip1205.green i {
  color: #183641;
  font-size:x-large
}
figure.snip1205:hover img,
figure.snip1205.hover img {
  opacity: 0.3;
  -webkit-filter: grayscale(100%);
  filter: grayscale(100%);
}
figure.snip1205:hover i,
figure.snip1205.hover i {
  -webkit-transform: translate(-50%, -50%) scale(1);
  transform: translate(-50%, -50%) scale(1);
  transition: all 300ms 100ms cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.enrollbg{background: #bd313b;}
#enroll{width:100%; height:auto; float:left; padding: 35px 0;}
#enroll .text{width:70%; height:auto; float:left; margin: 0 5.5% 0 3.5%;}
#enroll .text h1{width:100%; height:auto; float:left; color: #fff; margin: 0; padding: 10px 0;}
#enroll .text p{width:100%; height:auto; float:left; color: #fff; margin: 0;}
#enroll a{width:21%; height:auto; float:right; margin: 10px 0 0 0; color: #fff; border-radius: 50px; text-align: center; padding: 10px 0; border: 2px solid #fff; transition: 0.3s;}
#enroll a:hover{border: 2px solid #fdb92e;}

.popularbac {
  background: #16343f;
  padding: 50px 0;
}

.popularbac h2 {
  width: 100%;
  height: auto;
  float: left;
  color: #fff;
  margin: 0;
  font-weight: 500;
}

.popularbac b {
  width: 5%;
  height: auto;
  float: left;
  margin: 5px 0 15px 0;
  padding: 2px 0;
  background: #d9aa3f;
}

.popularbac .b {
  width: 15%;
  height: auto;
  float: left;
  margin: 6px 80% 15px 0;
  padding: 1px 0;
  background: #eeeeee;
}

.popularbac .card-title {
  font-weight: 500;
  margin: 10px 0 0 0;
  font-size: large;
}

.popularbac .card-text {
  margin: 5px 0;
}

.popularbac .btn {
  float: left;
  background: #36788e;
  color: #fff;
  padding: 5px 10px;
  border-radius: 3px 3px 3px 3px!important;
  margin: 12px 0 0 0!important;
}

.popularbac .carousel-item1 {
  margin-bottom: 60px;
}

.popularbac .carousel-item1 .card-img-top {
  width: 100%;
}

.popularbac .controls-top {
  float: right;
  margin: 0 0 20px 0;
}

.popularbac .btn-floating {
  border: 1px solid #fff;
  padding: 5px 10px;
}

.popularbac .btn-floating1 {
  margin-bottom: -10px!important;
}

.missionbg{background: #0081b1;}
#mission{width: 90%; height: auto; float: left; margin:0 5%;}
#mission a{width: 31.3%; height: auto; float: left; margin: 50px 1%;}
#mission .content-box {
	padding: 32px 28px 22px 28px;
	margin:0;
	text-align: center;
	height: 370px;
}
#mission .content-box p {
	margin: 1;
	color: #212121
}
#mission .content-box h2 {
	line-height: 26px;
	padding-bottom: 0;
    margin-bottom: 0;
	color: #0081b1;
	font-weight: 600
}
#mission .content-box b {
    width: 20%;
    height: auto;
    float: left;
    margin: 10px 40% 20px 40%;
    background: #a7a7a7;
    padding: 1px 0 2px 0;
}
#mission .content-box i {
	font-size: 80px;
	height: 80px;
	color: #0081b1;
	margin: 10px 0;
	display: block
}
#mission .content-box.color-effect-1 {
	background: #fff
}
#mission .box-icon i {
	display: inline-block;
	font-size: 0;
	margin: 15px 0;
	width: 90px;
	height: 90px;
	border-radius: 50%;
	text-align: center;
	position: relative;
	z-index: 1;
	color: #fff
}
#mission .box-icon i:after {
	pointer-events: none;
	position: absolute;
	width: 100%;
	height: 100%;
	border-radius: 50%;
	content: '';
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box
}
#mission .box-icon i:before {
	font-size: 40px;
	line-height: 90px;
	font-style: normal;
	font-weight: 400;
	font-variant: normal;
	text-transform: none;
	display: block;
	-webkit-font-smoothing: antialiased
}
#mission .box-icon-effect-1 .box-icon i {
	background: #deedf2;
	color: #0081b1;
	-webkit-transition: background .2s, color .2s;
	-moz-transition: background .2s, color .2s;
	transition: background .2s, color .2s
}
#mission .box-icon-effect-1 .box-icon i:after {
	top: -7px;
	left: -7px;
	padding: 7px;
	box-shadow: 0 0 0 4px #0081b1;
	-webkit-transition: -webkit-transform .2s, opacity .2s;
	-webkit-transform: scale(.8);
	-moz-transition: -moz-transform .2s, opacity .2s;
	-moz-transform: scale(.8);
	-ms-transform: scale(.8);
	transition: transform .2s, opacity .2s;
	transform: scale(.8);
	opacity: 0
}
#mission .content-box:hover .box-icon-effect-1a .box-icon i {
	background: #0081b1;
	color: #fff
}
#mission .content-box:hover .box-icon-effect-1a .box-icon i:after {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	opacity: 1
}
#mission .box-icon-effect-2 .box-icon i {
	box-shadow: 0 0 0 4px #fff;
	overflow: hidden;
	-webkit-transition: background .3s, color .3s, box-shadow .3s;
	-moz-transition: background .3s, color .3s, box-shadow .3s;
	transition: background .3s, color .3s, box-shadow .3s;
	color: #fff
}

.presidentbg{background: #f4f4f4;}
#president{width: 100%; height: auto; float: left; margin: 50px 0;}
#president h1{width: 100%; height: auto; float: left; text-align: center; text-transform: uppercase; color: #313131; margin-bottom: 0;}
#president b{width:10%; height:auto; float:left; margin: 6px 45% 55px 45%; background: #0081b1; padding: 2px 0;}
#president img{width: 47%; height: auto; float: left; margin-right: 3%;}
#president .right{width: 50%; height: auto; float: left;}
#president .right h4{width: 100%; height: auto; float: left; margin: 0 0 0 0; color: #272727;}
#president .right p{width: 100%; height: auto; float: left; line-height: 160%; color: #272727; text-align: justify;}
#president .right h3{width: 100%; height: auto; float: left; color: #272727; margin: 0;}
#president .right h3 span{color: #0081b1;}

.footerbg{background: #00284a;}
#footer{width: 100%; height: auto; float: left; color: #fff; margin: 20px 0 30px 0;}
#footer h3{text-transform: uppercase;}
#footer .con{width: 33%; height: auto; float: left; margin: 1% 3% 1% 0;}
#footer .con img{width: 70%; height: auto; float: left; margin: 1% 30% 1% 0;}
#footer .con .img{width: 8%; height: auto; float: left; margin: 2% 0; padding: 7px; background: #019fb6; border-radius: 50%;}
#footer .con .img img{width: 100%; height: auto; float: left; margin: 0;}
#footer .con p{width: 100%; height: auto; float: left; text-align: justify; margin: 2% 0;}
#footer .con1{width: 18%; height: auto; float: left; margin: 1%;}
#footer .con1 a{width: 100%; height: auto; float: left; margin: 1.5% 0; color: #fff; transition: 0.2s;}
#footer .con1 a:hover{color: #037adf;}
#footer .con2{width: 22%; height: auto; float: left; margin: 1%;}
#footer .con2 p img{margin:0 9px 0 0; float: left;}
#footer .con2 p span{margin:0;}

.gdlowfooterbg{background: #000;}
#gdlowfooter{width:90%; height:auto; float: left; padding: 1% 0}
#gdlowfooter p{width: 50%; height: auto; float: left; margin: 0; padding: 0; color: #fff; font-size: small}
#gdlowfooter .p{ text-align: right;}
#gdlowfooter p a{color: #62aae7;}

.shadow_one{text-align:center;}
#page_header{background:url(images/bg.jpg); background-attachment: fixed;background-position: center;background-repeat: no-repeat; background-size: 100% auto; margin-top:-2px;}
#page_header h2{color:#fff;font-size:40px;margin:18px 0;font-family:'Abhaya Libre',cursive}
#page_header p{color:#fff}
.page_header_breadcum{color:#fff}
.page_header_breadcum a .fa{color:#fdb92e;font-size:16px}
.page_header_breadcum a.active_page{color:#fdb92e}
.page_header_breadcum a{color:#fff}

#static{width:100%; height:auto; float:left; margin:4% 0}
#static img{width:auto; height:auto; float:left; margin:1% 1% 1% 0}
#static p{margin:1% 0; line-height:175%; text-align:justify; color:#333333;}
#static span{margin:1% 0; line-height:160%; text-align:justify; color:#333333;}
#static ul{list-style-image: url('images/tick.png'); line-height:160%; text-align:justify; color:#333333;}
#static ul li{margin:1.5% 0}
#static h2{width:100%; height:auto; float:left; color: #247ebb!important; text-transform: uppercase; margin-bottom: 0;}

#album{width:100%; height:auto; float:left; margin:2% 0; overflow:hidden;}
#album .con1{width:22%; height:auto; float:left; margin:1.5%; box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.15); transition:0.50s}
#album .con1:hover{box-shadow: 0px 0px 15px 0px rgba(253,179,2,0.55);}
#album .con1 img{width:100%; height:auto; float:left;}

@media all and (max-width: 768px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) {

#main-inner{width:100%; height:auto; margin:0 auto; overflow:auto}
#main-inner1{width:100%; height:auto; margin:0 auto;}

#upheader{width:0; height:auto; float:left; padding:0; visibility: hidden;}
#upheader .left{width:0; height:auto; float:left; margin:0; visibility: hidden;}
#upheader .left p{float:left; margin:0; color:#fff; font-size:0; visibility: hidden;}
#upheader .left .p{float:left; margin:0; color:#fff; font-size:0; visibility: hidden;}
#upheader .left p img{width:0; height:0; float:left; margin:0; visibility: hidden;}
#upheader .left p .img{width:0; height:0; float:left; margin:0; visibility: hidden;}
#upheader .left a{color:#fff; visibility: hidden;}
#upheader .middle{width:0; height:auto; float:right; margin:0; visibility: hidden;}
#upheader .middle a{width:0; height:auto; float:left; margin:0; border:0; border-radius:0; padding:0; visibility: hidden;}
#upheader .middle a img{width:0; height:auto; float:left; margin:0; visibility: hidden;}

.mainlogo{width:90%; height:auto; float:left; padding:0; margin: 5px 5%;}

#welcome{width:100%; height:auto; float:left; padding:5% 0; text-align: center;}
#welcome h1{width:100%; height:auto; float:left; color: #db2429; margin:0; font-size: x-large;}
#welcome b{width:20%; height:auto; float:left; color: #9c0c0b; margin: 6px 40% 30px 40%; background: #7e7e7e; padding: 2px 0;}
#welcome p{width:95%; height:auto; float:left; margin: 0 2.5%; font-size: 16px; line-height: 170%; text-align: justify;}
#welcome a{width:60%; height:auto; float:left; color: #fff; font-size: 16px; margin: 25px 20% 30px 20%; background: #0081b1; padding: 10px 0; text-align: center; border-radius: 30px; transition: 0.5s;}

#mission a{width: 100%; height: auto; float: left; margin: 10px 0}
#mission .content-box{height: auto;}

#president{width: 100%; height: auto; float: left; margin: 20px 0;}
#president h1{width: 100%; height: auto; float: left; text-align: center; text-transform: uppercase; color: #313131; margin-bottom: 0; font-size: x-large;}
#president b{width:20%; height:auto; float:left; margin: 6px 40% 20px 40%; background: #0081b1; padding: 2px 0;}
#president img{width: 80%; height: auto; float: left; margin: 0 10%;}
#president .right{width: 95%; height: auto; float: left; margin: 3% 2.5% 1% 2.5%;}

.cour{width: 100%; height: auto; float: left; margin: 20px 0;}
.figurecon{width: 100%; height: auto; float: left;}
figure.snip1205 {
  position: relative;
  overflow: hidden;
  margin: 0;
  min-width: 220px;
  max-width: 610px;
  width: 100%;
  height: 500px;
  float: left;
  background: #000000;
  text-align: center;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}
.figurecon .snip1205 {
  position: relative;
  overflow: hidden;
  margin: 0;
  min-width: 220px;
  max-width: 610px;
  width: 100%;
  height: 250px;
  float: left;
  background: #000000;
  text-align: center;
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.15);
}

#enroll .text{width:95%; height:auto; float:left; margin: 0 2.5%;}
#enroll .text h1{width:100%; height:auto; float:left; color: #fff; margin: 0; padding: 10px 0; text-align: center;}
#enroll .text p{width:100%; height:auto; float:left; color: #fff; margin: 0;}
#enroll a{width:50%; height:auto; float:right; margin: 10px 25%; color: #fff; border-radius: 50px; text-align: center; padding: 8px 0; border: 2px solid #fff; transition: 0.3s;}

.col-md-4{margin-bottom: 20px!important;}

.popularbac {
  background: #16343f;
  padding: 50px 0 0 0;
}

#footer .con{width: 95%; height: auto; float: left; margin: 1% 2.5%;}
#footer .con1{width: 95%; height: auto; float: left; margin: 1% 2.5%;}
#footer .con2{width: 95%; height: auto; float: left; margin: 1% 2.5%;}
#footer h3{text-align: center;}
#footer .con1 a{text-align: center;}

#gdlowfooter{width:95%; height:auto; float: left; padding: 1% 2.5%}
#gdlowfooter p{width: 100%; height: auto; float: left; margin: 5px 0; padding: 0; color: #fff; font-size: small; text-align:center}
#gdlowfooter .p{text-align: center;}

#page_header{background:url(images/bg.jpg); background-attachment: scroll;background-position: center;background-repeat: no-repeat; background-size: auto 100%;}
.page_header_breadcum .fa{color:#fdb92e;font-size:14px!important}

#static{width:95%; height:auto; float:left; margin:4% 2.5%}

#album .con1{width:97%; height:auto; float:left; margin:1.5%; box-shadow: 0px 0px 8px 0px rgba(0,0,0,0.15); transition:0.50s}

}