@charset "utf-8";
@font-face {
	font-family: 'Roboto';
	src: url('fonts/robot.eot');
	src: local('☺'), url('fonts/robot.woff') format('woff'), url('fonts/robot.ttf') format('truetype'), url('fonts/robot.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
/* CSS Document */

.mobnav{display:none;}
.mobnavbar{display:none;}

@media only screen and (max-width:767px) {

.wrapper{width:100%; margin:0px; height:auto; overflow:hidden;}
h1, h2, h3, h4, h5, h6 {font-family:'Roboto';font-weight:normal; margin:0px; padding:0px;}
a{-moz-transition: all 0.3s ease-out;	-o-transition: all 0.3s ease-out;	-khtml-transition: all 0.3s ease-out;	-ms-transition: all 0.3s ease-out;	-webkit-transition: all 0.3s ease-out; text-decoration:none;}
.blrow{clear:both;border-bottom:#ccc inset 1px;}
.left{float:none;}
.fix{clear:both;}
.right{float:none;}
.clm50{width:100%;}
.clm60{width:100%;}
.clm40{width:100%;}
.clm45{width:100%;}
.clm40{width:100%;}
.clm900{width:100%; margin:0 auto;}
.clm800{width:800px; margin:0 auto;}
.clm700{width:100%; margin:0 auto;}
.clm1000{width:100%; margin:0 auto;}
.clm400{width:100%; margin:0 auto;}
.clm200{width:100%; margin:0 auto;}

/****************header*****************/
.header{height:auto; background:none; width:100%; border-top:#FF7F27 solid 10px;}
.header .main{margin:0px; width:100%;}
.header .logo{width:100%; height:auto; float:none; }

.header .logo .logimg{float:left; width:70%; text-align:center;}
.header .logo .logimg img{width:110px; background:#fff; height:auto; margin-top:5px;}

.header .logo .mobnavbtn{display:block; width:27%; text-align:center;}
.header .logo .mobnavbtn a{background:#FF7F27; padding:7px; height:40px; width:40px; border-radius:7px; float:right; margin-right:20px; margin-top:20px;}
.header .logo .mobnavbtn a i{font-size:40px; color:#fff;}

.header .name{width:100%; float:none; height:auto; margin-left:0px;}
.header .name img{width:100%; height:auto;}

.header .widget{width:100%; float:none; height:auto; background:#3D4094; overflow:hidden;}

.affl{width:100%;}
.affl li{width:50%; float:left; text-align:center; list-style-type:none; color:#fff; padding-top:10px; font-size:13px;}
.affl li span{font-size:20px; line-height:30px; font-weight:bold;}
.affl .corner{background:#FF7F27; color:#fff; padding-top:0px; padding-bottom:5px; border-radius:5px; clear:both; width:80%; margin:0 auto; float:none; font-size:20px;}
.affl .corner a{display:block; color:#fff;}
.affl .corner a img{width:100%;}

.phone{width:350px; background:#fff; border-radius:4px; height:30px;  margin:0 auto; line-height:30px; margin-bottom:10px;}
.phone li{float:left; list-style-type:none; color:#000; font-size:17px;}
.phone li i{font-size:20px; margin-right:10px; color:#3D4094; margin-left:10px;}

/****************header*****************/


/****************menu bar*****************/
.navbar{display:none;}
.navbar{width:70%; background:#3D4094; height:100%; position:fixed; top:0; z-index:9999999;}
nav {height:auto; width:100%; margin:0px;}
nav ul {font-size:0; margin:0; padding:0;}
nav ul li{width:100%; border-bottom:#000 solid 1px;}
nav ul li a{color:#fff; display:block;  font-size:19px;  padding:0px 14px; line-height:45px;}
nav ul li:hover{background:#3D4094; color:#fff;}
nav ul li:hover a{color:#FFF;}

nav ul li ul {width:100%; position:relative; border-bottom:none;}
nav ul li ul li {border-top:1px solid #444; }
nav ul li ul li:first-child {border-top:none;}
nav ul li ul li a {background:#3D4094; color:#ababab !important;  padding:0px 14px; border-radius:0px;}
nav ul li ul li a:hover {color:#fff !important;}
nav ul li ul li a i{margin-right:10px;}
nav .fa.fa-angle-down {margin-left: 6px; }
/****************menu bar*****************/

/**************Table**************/
.frmtable {border-collapse:collapse; border-spacing:0; width:100%; border-color:#ccc; border-style:solid; border-width:1pt;}
.frmtable th{vertical-align:top; text-align:left; background:#F2F2F2; font-weight:bold; line-height:45px; padding-left:5px;}
.frmtable td{vertical-align:top; text-align:left; line-height:45px; padding-left:5px;}
/**************Table**************/

/*****mobile navbar**************/
.mobnavbar{width:80%; background:#AC1241; height:auto; overflow:hidden; display:none; border-top:#FF7F27 solid 1px; z-index:99999;}
.mobnavbar .title{font-size:20px; line-height:30px; color:#FF7F27; padding-left:3px; padding-top:10px;}
.mobnavbar li{list-style-type:none; border-bottom:#ccc solid 1px; overflow:hidden;}
.mobnavbar li a{line-height:40px; width:100%; display:block; color:#fefefe;  padding-left:8px; overflow:hidden;}
.mobnavbar li a i{font-size:17px; margin-right:12px; color:#FF7F27;}
/*****mobile navbar**************/

/**********inner pages 2************/
.innerpage{height:auto; overflow:hidden; margin-bottom:20px; background:#FFF; width:100%; margin:0 auto;}
.innerpage .title{background:#FF7F27; height:42px; font-size:20px; color:#fff; font-style:italic; line-height:37px; padding-left:5px; box-sizing:border-box;}
.innerpage .content{height:auto; overflow:hidden;padding:20px 10px; box-sizing:border-box;}
.innerpage .content h1{background:#C8EBFA; color:#3D4094; font-size:30px; line-height:30px; padding-left:8px; padding-top:4px;}
.innerpage .content p{text-align:justify; padding:10px;}
.innerpage .content div{border:none;}
.innerpage .content .uc{width:100%; margin:0 auto;}
.innerpage .content uc img{width:100%; height:auto;}

.innerpage .content .list1{width:100%;}
.innerpage .content .list1 li{background:url(marker_1.gif) 0 2px no-repeat;padding-left:48px; float:left; width:100%; list-style-type:none; line-height:35px;}

.innerpage .content .list2{width:100%;}
.innerpage .content .list2 li{background:url(marker_1.gif) 0 -38px no-repeat;padding-left:48px; float:left; width:100%; list-style-type:none; line-height:35px;}
/**********inner pages 2************/

/**********footer***************/
.footer{ height:auto; overflow:hidden; width:100%; background:#3D4094 url(footer.png) left top repeat; border-top:#FF7F27 solid 5px;}
.footer .wp{width:100%; height:auto; overflow:hidden;}
.footer .ft{height:auto;overflow:hidden; width:100%; margin-top:15px; margin-bottom:10px;}
.footer .ft .col{float:none; width:100%; margin:0px;}
.footer .ft .col h1{margin:0px; text-transform:uppercase; color:#FEFEFE; font-weight:bold; font-size:18px; line-height:35px; padding-left:5px;}
.footer .ft li{width:100%; padding-left:10px;}
.footer .ft li a{color:#fff; list-style-type:none; line-height:30px;}
.footer .ft li a i{color:#FF7F27; margin-right:10px;}
.footer .ft li a:hover{color:#FF7F27; text-decoration:none;}
.footer .ft .col .add{text-align:left; color:#fff; line-height:28px; padding-left:10px;}
.footer .ft .col .add i{color:#FF7F27; margin-right:5px;}
.footer .copy{height:auto; overflow:hidden; font-size:12px; color:#ABABAB; line-height:25px; border-top:#FFFF01 inset 1px; padding-top:5px; text-align:center;}
.footer .copy .col1{float:none; width:100%;}
.footer .copy .col1 a{color:#ABABAB; padding-left:10px;}
.footer .copy .col2{float:none; padding:0px; width:100%; text-align:center;}
.footer .copy .col2 a{text-decoration:none; padding:0 4px; color:#FFF;}
.footer .copy .col2 a i{font-size:30px;}
.footer .copy .col2 a:hover{color:#69E326;}
/**********footer***************/


/************contact us***************/
.reach{padding:0px; height:auto; border:#FF7F27 solid 1px;}

.contact{width:100%; border-bottom:none;}
.contact .cl1{width:100%; border:none;}
.contact .cl2{width:100%; border:none;}
/************contact us***************/




/********banner wrapper************/
.banwrap{width:100%; height:auto; background:#EDFAFB;}
.banwrap .main{width:100%; margin:0 auto;}
/********banner wrapper************/


/********banner************/
.banner{width:100%; float:none; height:400px;}

.banner .thought{height:auto; width:100%; background:#EDFAFB;}
.banner .thought .hd{float:none; width:100%; font-style:italic; background:#3D4094; color:#fff; font-size:17px; line-height:30px; padding:0 10px; margin-top:10px; margin-right:0px; box-sizing:border-box;}
.banner .thought .quots{line-height:30px; font-style:italic; font-size:18px; padding:0 5px; text-align:center;}
.banner .slide{height:349px; overflow:hidden; border-top:#3D4094 solid 1px;}
/********banner************/

/**********news panel******************/
.newspan{clear:both; height:390px; width:90%; float:none; background:#3D4094; margin:0 auto; margin-top:0px;}
.newspan .title{text-align:center; color:#fff; font-size:25px; padding-top:15px; padding-bottom:5px; text-transform:uppercase; font-weight:bold; width:230px; margin:0 auto;}
.newspan  .newscroll{height:280px;}
.newspan  .newscroll li{list-style-type:none; padding-left:10px; box-sizing:border-box;}
.newspan  .newscroll li a{display:block; color:#fff; text-decoration:none;}
.newspan  .newscroll li a span{color:#ababab;}
.newspan  .newscroll li a span i{color:#fff; font-size:18px; margin-right:10px;}
.newspan  .newscroll li a .dsize{font-size:13px;}

.newsfooter{text-align:center;}
.newsfooter a{background:#FF7F27; color:#fff; padding:4px 18px; line-height:35px;}
.newsfooter a:hover{background:#F36A0D;}

.scrollbar{width:100%;height:auto;overflow-y:scroll;}
#ex4::-webkit-scrollbar{width:5px;background-color:#3D4094;}
#ex4::-webkit-scrollbar-thumb{background-color:#FF7F27;}
#ex4::-webkit-scrollbar-track{}
/**********news panel******************/



/********welcome home page************/
.welcome{width:100%; background:#EDFAFB; height:auto; overflow:hidden; box-sizing:border-box; }
.welcome .main{width:100%; margin:0 auto; height:auto; overflow:hidden;}

.welcome .home{width:90%; float:none; height:auto; overflow:hidden; margin:0 auto;}
.welcome .home .title{text-align:left; color:#000; font-size:25px; padding-top:15px; padding-bottom:15px;font-weight:bold; text-align:left;}
.welcome .home p{margin:0px; padding:0px; text-align:justify; padding:0 10px;}
.welcome .home p a{color:#FF7F27;}

.welcome .home .counter{width:90%; margin-top:20px;}
.welcome .home .counter li{list-style-type:none; font-size:30px; color:#3D4094; float:left; margin-left:20px; line-height:40px;}
.welcome .home .counter li span{font-size:17px; color:#000; padding-left:5px;}

/********welcome home page************/

/********student corner************/
.events{height:300px; width:90%; float:none; background:#3D4094; margin:10px auto; padding-bottom:40px;}
.events .title{text-align:center; color:#fff; font-size:25px; padding-top:15px; padding-bottom:5px; text-transform:uppercase; font-weight:bold; width:230px; margin:0 auto;}
/********student corner************/

/***********principle messave*******************/
.principle{width:100%; height:auto; background:none; margin:0px; overflow:hidden;}
.principle .main{width:100%; margin:0px; height:auto;}
.principle .main .photo{width:100%; height:194px; background:url(principlemessage2.jpg) left top no-repeat; background-size:cover; float:none; border-radius:0%; text-align:center;}
.principle .main .photo img{width:140px; height:auto; margin-top:20px; }

.principle .main .message{width:98%; height:auto; float:none; margin:10px auto;}
.principle .main .message .title{text-align:left; color:#1F2490; font-size:25px; padding-top:15px; padding-bottom:5px; font-weight:bold; font-style:italic;}
.principle .main .message p{margin:0px; padding:0px; padding-top:8px; padding-left:15px; font-style:italic; line-height:30px; font-size:17px; color:#000; line-height:25px;}
.principle .main .message p a{margin-left:10px; font-weight:bold; color:#FF7F27;}
/***********principle messave*******************/



/********bottom blocks****************/
.botrow{width:100%; height:auto; overflow:hidden; margin-bottom:20px;}
.botrow .main{width:95%; margin:0 auto; height:auto; overflow:hidden;}

.block{height:auto; min-height:100px; width:100%; float:none; background:#fff; margin-left:0px; overflow:hidden; margin-top:10px;}
.block .title{text-align:left; background:#C8EBFA; color:#3D4094; font-size:25px; line-height:30px; padding-left:8px;}
.block .title i{font-size:30px; color:#FF7F27; margin-right:10px; margin-top:4px;}

.slide_nav{float:right; margin-right:10px;}
.slide_nav a{cursor:pointer; float:left; line-height:25px; background:#3D4094; color:#fff !important; text-align:center; display:block; margin-left:5px; padding:0px 10px; margin-top:10px;}
.slide_nav a i{color:#fff !important; font-size:25px; margin-top:0px !important; margin-right:0px !important;}
.slide_nav a:hover{background:#3D7294;}

.bottombtn{width:120px; margin:0 auto; border-top:#999 solid 1px; margin-top:10px; text-align:center;}
.bottombtn a{background:#EDFBF7; color:#000; width:80px; line-height:30px; display:block; margin:0 auto;}
.bottombtn a:hover{background:#3D4094; color:#fff;}

/********bottom blocks****************/


/*******student birthday****************/
.birthday{height:auto; width:100%; padding-top:10px; min-height:235px;}
.birthday .slide_contain{width:100%; margin:0 auto; height:auto; overflow:hidden;}
.birthday .slide{width:100%; height:auto; text-align:center; color:#000; }
.birthday .slide img{width:140px; height:160px; border:#3D4094 solid 1px; box-sizing:border-box; background:url(blank.png) left top no-repeat; background-size:cover;}
.birthday .slide .name{width:100%; margin:0px; padding:0px; text-align:center; font-size:17px; font-weight:bold; text-transform:uppercase; color:#3D4094;}
.birthday .slide .class{width:100%; text-align:center; margin:0px; padding:0px;}
.birthday .slide .date{width:100%; text-align:center; margin:0px; padding:0px;}
.birthday .fade {-webkit-animation-name: fade; -webkit-animation-duration: 2.0s; animation-name: fade;animation-duration: 2.0s;}
@-webkit-keyframes fade {  from {opacity: .4}   to {opacity: 1}}
@keyframes fade {  from {opacity: .4}   to {opacity: 1}}
/********bottom blocks****************/

/***********birthday page**************/
.bdlist{width:100%; margin:20px 0px;}
.bdlist .card{width:45%; height:auto; text-align:center; color:#000; float:left; margin-left:10px; margin-top:10px;}
.bdlist .card img{width:140px; height:160px; border:#3D4094 solid 1px; box-sizing:border-box; background:url(blank.png) left top no-repeat; background-size:cover;}
.bdlist .card .name{width:100%; margin:0px; padding:0px; text-align:center; font-size:17px; font-weight:bold; text-transform:uppercase; color:#3D4094;}
.bdlist .card .class{width:100%; text-align:center; margin:0px; padding:0px;}
.bdlist .card .date{width:100%; text-align:center; margin:0px; padding:0px;}
/***********birthday page**************/

/***********achievement page**************/
.aclist{width:100%; margin:20px 0px;}
.aclist .card{width:100%; height:auto; text-align:center; color:#000; float:none; margin-left:10px; margin-top:10px;}
.aclist .card img{width:140px; height:160px; border:#3D4094 solid 1px; box-sizing:border-box; background:url(blank.png) left top no-repeat; background-size:cover;}
.aclist .card .name{width:100%; margin:0px; padding:0px; text-align:center; font-size:17px; font-weight:bold; text-transform:uppercase; color:#3D4094;}
.aclist .card .class{width:100%; text-align:center; margin:0px; padding:0px;}
.aclist .card .date{width:100%; text-align:center; margin:0px; padding:0px;}
/***********achievement page**************/

/******photo album************/
.albbox{width:220; float:left; margin:15px 5px; height:auto; background:#EDFAFB; border:#ccc solid 1px; padding:10px 0px; border-radius:4px;}
.albbox:hover{box-shadow: 0 0 8px rgba(102,175,233,.6);}
.albbox a{color:#000;}
.albbox img{width:90%; height:150px; background:url(blank.png) left top no-repeat; background-size:cover; border:#3D4094 solid 1px;}
.albname{padding-left:10px; font-size:17px; font-weight:bold; color:#3D4094;}
.photos{padding-left:10px; font-weight:400;}
.date{padding-left:10px; font-weight:400;}
.gallpage{width:90%; margin:0 auto; height:auto; overflow:hidden;}
.gallpage .back{width:100%; text-align:right;}
.gallpage .back a{font-size:20px; background:#3D4094; color:#fff; width:200px;}
.gallpage .back a i{ margin:0 5px;}

.latestgallery{width:95%; margin:0 auto; height:auto;}
.latestgallery .alb{width:100%; float:none;}
.latestgallery .alb .slide_nav{float:right; margin-right:3px;}
.latestgallery .alb .slide_nav a{cursor:pointer; float:left; line-height:25px; background:#3D4094; color:#fff !important; text-align:center; display:block; margin-left:5px; padding:5px 10px; margin-top:10px;}
.latestgallery .alb .slide_nav a i{color:#fff !important; font-size:20px; margin-top:0px !important; margin-right:0px !important; margin-right:10px !important;}
.latestgallery .alb .slide_nav a:hover{background:#3D7294;}

/********facebook************/
.facebook{height:auto; width:95%; float:none; overflow:hidden; margin:0 auto;}
.facebook .fbbox{width:100%; height:300px; margin:0 auto; background:#C8EBFA; overflow:hidden; text-align:center; padding-bottom:5px;}
/********facebook************/
/******photo album************/

/************footer style**************/
.footer{height:auto;overflow:hidden;width:100%;background:#ccc url(footer.png) left top repeat;border-top:#3D4094 solid 5px; margin-top:20px;}
.footer .wp{width:95%; margin:0 auto; height:auto; overflow:hidden;}
.footer .ft{height:auto;overflow:hidden; width:100%; margin-top:15px; margin-bottom:10px;}

.footer .ft .implink{float:left; width:100%; margin:0 auto;}
.footer .ft .implink h1{margin:0px; width:90%; text-transform:uppercase;color:#3D4094;font-weight:bold;font-size:18px;line-height:35px; border-bottom:#000 solid 1px; margin-bottom:5px;}
.footer .ft .implink li{width:100%; list-style-type:none; padding-left:5px; float:none; margin-bottom:5px; box-sizing:border-box;}
.footer .ft .implink li a{color:#000; list-style-type:none; line-height:30px;}
.footer .ft .implink li a i{color:#3D4094; margin-right:10px;}
.footer .ft .implink li a:hover{color:#000; text-decoration:none;}

.footer .ft .addresss{float:left; width:100%; margin-left:0px;}
.footer .ft .addresss h1{margin:0px; width:90%; text-transform:uppercase;color:#3D4094;font-weight:bold;font-size:18px;line-height:35px; border-bottom:#000 solid 1px; margin-bottom:10px;}
.footer .ft .addresss .add{line-height:35px; padding-left:10px;}


.footer .ft .location{width:100%; float:none;}
.footer .ft .location h1{margin:0px; text-transform:uppercase;color:#3D4094;font-weight:bold;font-size:18px;line-height:35px; margin-bottom:6px; border-bottom:#000 solid 1px; margin-bottom:10px;}
.footer .ft .location .map{border:#fff solid 1px;}

.footer .copy{clear:both; height:auto; width:100%; overflow:hidden; font-size:15px; background:#3D4094; color:#ABABAB; line-height:35px; border-top:#ccc inset 1px; padding-top:5px; text-align:left;}
.footer .copy a{color:#fefefe; padding:0px 10px;}
/************footer style**************/