@charset "utf-8";
/* CSS Document */
/*----------------------------------------------Reset CSS---------------------------------------------------------*/
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video {margin: 0;	padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;font-family:Arial, Helvetica, sans-serif;font-smooth:always;}
/* HTML display-role reset for older browsers */
article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;margin:0;background-color: #E62C08;font-size:12px;font-smooth:always;}
ol, ul {list-style: none;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after,q:before, q:after {content: '';content: none;}
table {border-collapse: collapse;border-spacing: 0;}
/*----------------------------------------------Clearfix CSS---------------------------------------------------------*/
/* slightly enhanced, universal clearfix hack */
.clearfix:after {visibility: hidden;display: block;font-size: 0;content: " ";clear: both;height: 0;}
.clearfix { display: inline-block; }
/* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* close commented backslash hack */
/*--------------------------------------------------------------------------------------------------------------------*/
.main {width:100%;height:100%;background-image:url(../images/back.gif);background-position:top left;background-repeat:repeat-x;	background-color:#e62c08;margin:0;font-smooth:always;}
a{text-decoration:none;color:#000;}
h1{font-size:24px;font-weight:bold;padding-bottom:10px;background-image:url(../images/sep1.png);background-repeat:no-repeat;background-position:bottom left;color:#840120;}
h2{font-size:20px;font-weight:bold;padding-bottom:10px;color:#840120;background-image:url(../images/sep1.png);background-repeat:no-repeat;background-position:bottom left;}
h3{font-size:18px;font-weight:bold;padding:5px 0;color:#840120;background-image:url(../images/sep1.png);background-repeat:no-repeat;background-position:bottom left;}
h4{font-size:16px;font-weight:bold;padding:5px 0;color:#840120;background-image:url(../images/sep1.png);background-repeat:no-repeat;background-position:bottom left;}
h5{font-size:14px;font-weight:bold;padding:5px 0;color:#840120;background-image:url(../images/sep1.png);background-repeat:no-repeat;background-position:bottom left;}
h6{font-size:14px;font-weight:bold;padding:5px 0;}
.fr{float:right;}
.fl{float:left;}
.wrapper{width:940px;height:auto;overflow:hidden;margin:auto;}
.headtop{width:940px;height:90px;float:left;}
.b115{width:115px;}
.b740{width:740px;}
.htext{padding:5px;color:#FFF;}
.image_container{width:940px;height:254px;float:left;}
.container{width:940px;height:auto;overflow:hidden;float:left;background-color:#FFF;-moz-border-radius:0 0 5px 5px;-webkit-border-radius:0 0 5px 5px;-khtml-border-radius:0 0 5px 5px;border-radius:0 0 5px 5px;}
.hwtext{width:615px;height:auto;padding:2px;line-height:20px;}
.hwt{font-size:18px;font-weight:bold;text-transform:uppercase;margin-bottom:5px;}
.d280{width:300px;}
.hold{width:300px;height:auto;}
.holdtop{width:288px;height:29px;background-image:url(../images/hc.gif);background-repeat:repeat-x;background-position:top left;position:relative;text-align:left;}
.hb{position:absolute;top:29px;left:20px;}
.htt{margin:8px 0 0 0;text-transform:uppercase;font-weight:bold;color:#FFF;font-size:14px;}
.holdbottom{width:280px;height:95px;padding:15px 10px 10px;position:relative;line-height:16px;text-align:justify;}
.holdbottom p img {margin-right: 10px;}
.mtr{margin-top:16px;margin-right:25px;}
.rm{float:right;margin-top:5px;}
.mr6{margin-right:6px}
.sse{margin:0;}
.sse li{background-image:url(../images/bullet.png);background-repeat:no-repeat;vertical-align:top;padding-left:20px;margin-bottom:5px;}
.sse li a{vertical-align:top;color:#000;}
.mnews {margin:0;}
.mnews li {background-image:url(../images/bullet.png);background-repeat:no-repeat;background-position:0 3px;float:left;padding:0 20px}
.footer{width:940px;height:auto;float:left;margin:10px 0;background-color:#ec6b53;background-image:url(../images/fbottom.gif);	background-position: bottom left;background-repeat:no-repeat;}
.fm{margin:15px 10px 10px 10px;}
.hnews{width:902px;height:auto;overflow:hidden;text-align:left;background-color:#ececec;border:1px solid #000;padding:8px;	word-wrap:break-word;font-weight:bold;margin-bottom:10px;}
/*----------------------------------------------Navigation-----------------------------------------------------------*/
.navigation{width:940px;height:45px;background-color:#00F;float:left;background:url(../images/nav_back.gif) repeat-x top left;-moz-border-radius:5px 5px 0 0;-webkit-border-radius:5px 5px 0 0;-khtml-border-radius:5px 5px 0 0;border-radius:5px 5px 0 0;}
.nav{margin:0;padding:0;}
.nav li{display:block;width:117px;height:45px;float:left;}
.nav li a{display:block;width:117px;height:45px;float:left;text-indent:-9999px;}
.nav li a.home{background-image:url(../images/nav.gif);background-repeat:no-repeat;width:117px;height:45px;}
.nav li a.home:hover{background-image:url(../images/nav_hover.gif);background-repeat:no-repeat;width:117px;height:45px;}
.nav li a.about{background-image:url(../images/nav.gif);background-repeat:no-repeat;background-position:-117px 0;width:117px;	height:45px;}
.nav.menu li a.about.menulink:hover{background-image:url(../images/nav_hover.gif);background-repeat:no-repeat;background-position:-117px 0;width:117px;height:45px;display:block;}
.nav li a.gallery{background-image:url(../images/nav.gif);background-repeat:no-repeat;background-position:-234px 0;width:117px;	height:45px;}
.nav li a.gallery:hover{background-image:url(../images/nav_hover.gif);background-repeat:no-repeat;background-position:-234px 0;	width:117px;height:45px;}
.nav li a.school{background-image:url(../images/nav.gif);background-repeat:no-repeat;background-position:-234px 0;width:117px;	height:45px;}
.nav li a.school:hover{background-image:url(../images/nav_hover.gif);background-repeat:no-repeat;background-position:-234px 0;	width:117px;height:45px;}
.nav li a.achievement{background-image:url(../images/nav.gif);background-repeat:no-repeat;background-position:-351px 0;width:117px;height:45px;}
.nav li a.achievement:hover{background-image:url(../images/nav_hover.gif);background-repeat:no-repeat;background-position:-351px 0;width:117px;height:45px;}
.nav li a.donations{background-image:url(../images/nav.gif);background-repeat:no-repeat;background-position:-468px 0;width:117px;height:45px;}
.nav li a.donations:hover{background-image:url(../images/nav_hover.gif);background-repeat:no-repeat;background-position:-468px 0;width:117px;height:45px;}
.nav li a.membership{background-image:url(../images/nav.gif);background-repeat:no-repeat;background-position:-585px 0;width:117px;height:45px;}
.nav li a.membership:hover{background-image:url(../images/nav_hover.gif);background-repeat:no-repeat;background-position:-585px 0;width:117px;height:45px;}
.nav li a.reports{background-image:url(../images/nav.gif);background-repeat:no-repeat;background-position:-702px 0;width:117px;	height:45px;}
.nav li a.reports:hover{background-image:url(../images/nav_hover.gif);background-repeat:no-repeat;background-position:-702px 0;	width:117px;height:45px;}
.nav li a.contacts{background-image:url(../images/nav.gif);background-repeat:no-repeat;background-position:-819px 0;width:117px;height:45px;}
.nav li a.contacts:hover{background-image:url(../images/nav_hover.gif);background-repeat:no-repeat;background-position:-819px 0;width:121px;height:45px;}
ul.nav.menu {list-style:none; margin:0; padding:0;}
ul.nav.menu * {margin:0; padding:0;}
ul.nav.menu li {position:relative; float:left;}
ul.nav.menu ul {position:absolute; top:45px; left:0; background:#d1d1d1; display:none; opacity:0; list-style:none;}
ul.nav.menu ul li {position:relative;border-top:none; margin:0;width:186px;height:32px;}
ul.nav.menu ul li a {display:block; background-color:#d1d1d1;}
ul.nav.menu ul li a.avm {display:block;background-color:#d1d1d1;background-image:url(../images/vissionmission.gif);background-repeat:no-repeat;width:186px;height:32px;}
ul.nav.menu ul li a.amc {display:block;background-color:#d1d1d1;background-image:url(../images/managingcommittee.gif);background-repeat:no-repeat;width:186px;height:32px;}
ul.nav.menu ul li a.apm {display:block;background-color:#d1d1d1;background-image:url(../images/presidentm.gif);background-repeat:no-repeat;width:186px;height:32px;}
ul.nav.menu ul li a.agsm {display:block;background-color:#d1d1d1;background-image:url(../images/gsm.gif);background-repeat:no-repeat;width:186px;height:32px;}
ul.nav.menu ul li a.avm:hover {display:block;background-color:#d1d1d1;background-image:url(../images/vissionmission_1.gif);background-repeat:no-repeat;width:186px;height:32px;}
ul.nav.menu ul li a.amc:hover {display:block;background-color:#d1d1d1;background-image:url(../images/managingcommittee_1.gif);background-repeat:no-repeat;width:186px;height:32px;}
ul.nav.menu ul li a.apm:hover {display:block;background-color:#d1d1d1;background-image:url(../images/presidentm_1.gif);background-repeat:no-repeat;width:186px;height:32px;}
ul.nav.menu ul li a.agsm:hover {display:block;background-color:#d1d1d1;background-image:url(../images/gsm_1.gif);background-repeat:no-repeat;width:186px;height:32px;}
ul.nav.menu .menulink {font-weight:bold;display:block;}
ul.nav.menu .menulink:hover{display:block;}
/*---------------------------------------------------------------------------------------------------------------------*/
/*---------------------------------------------Slider----------------------------------------------------------------*/
a img {border : 0;}
div.wrap {width : 940px;margin : 0 auto;text-align : left;}
div#top div#nav {float : left;clear : both;width : 993px;height : 52px;margin : 22px 0 0;}
div#top div#nav ul {float : left;width : 700px;height : 52px;list-style-type : none;}
div#nav ul li {float : left;height : 52px;}
div#nav ul li a {border : 0;height : 52px;display : block;line-height : 52px;text-indent : -9999px;}
div#header {margin :0;}
div#video-header {height : 683px;margin : -1px 0 0;}
div#header div.wrap {height : 254px;}
div#header div#slide-holder {z-index : 40;width : 940px;height : 254px;position : absolute;}
div#header div#slide-holder div#slide-runner {width : 940px;height : 254px;overflow : hidden;position : absolute;}
div#header div#slide-holder img {margin : 0;display : none;position : absolute;}
div#header div#slide-holder div#slide-controls {left : 0;bottom : 208px;width : 940px;height : 46px;display : none;position : absolute;}
div#header div#slide-holder div#slide-controls p.text {float : left;color : #fff;display : inline;font-size : 10px;line-height : 16px;margin : 15px 0 0 20px;text-transform : uppercase;}
div#header div#slide-holder div#slide-controls p#slide-nav{float:right;height:24px;display:inline;margin:11px 15px 0 0;}
div#header div#slide-holder div#slide-controls p#slide-nav a {float : left;width : 24px;height : 24px;display : inline;font-size : 11px;margin : 0 5px 0 0;line-height : 24px;font-weight : bold;text-align : center;text-decoration : none;background-position : 0 0;background-repeat : no-repeat;}
div#header div#slide-holder div#slide-controls p#slide-nav a.on {background-position : 0 -24px;}
div#header div#slide-holder div#slide-controls p#slide-nav a {background-image : url(../images/silde-nav.png);color:#FFF;}
div#nav ul li a {background : url(../images/nav.png) no-repeat;}
/*---------------------------------------------Slider----------------------------------------------------------------*/
/*---------------------------------------------FeedBack--------------------------------------------------------------*/
#mask {position:absolute;left:0;top:0;z-index:9000; background-color:#000;  display:none;}
.window {position:fixed;left:0;top:0;width:440px;display:none;z-index:9999;}
#dialog {width:410px;background-color:transparent;}
#dialog1 {width:375px;height:203px;}
#dialog1 .d-header { background:url(images/login-header.png) no-repeat 0 0 transparent;width:375px;height:150px;}
#dialog1 .d-header input { position:relative;top:60px;left:100px;border:3px solid #cccccc;height:22px;width:200px;font-size:15px;padding:5px;margin-top:4px;}
#dialog1 .d-blank {float:left;background:url(images/login-blank.png) no-repeat 0 0 transparent;width:267px;height:53px;}
#dialog1 .d-login {float:left;width:108px;height:53px;}
#dialog2 {background:url(images/notice.png) no-repeat 0 0 transparent;width:326px;height:229px;padding:50px 0 20px 25px;}
.ff {float: left;width: 100%;}
.fdpu li {float: left;margin-bottom: 5px;width: 100%;min-height:30px;}
.fdl {float: left;text-align: left;width: 100px;}
.fdr {float: left;padding-left: 20px;}
.red{color:#F00;}
.fdt{width:410px;background-image:url(../images/fdt.gif);background-repeat:no-repeat;background-position:left top;overflow:hidden;}
.fdb{width:390px;padding:10px;overflow:hidden;background-image:url(../images/fdb.gif);background-repeat:no-repeat;background-position:bottom left;}
.fdc{width:410px;overflow:hidden;background-image:url(../images/fdc.gif);background-repeat:repeat-y;background-position:top left;}
.fdit{width:250px;height:20px;background-color:#FFF;border:1px solid #c4c4c4;}
.fdht{font-size:24px;text-transform:uppercase;color:#000;}
.mt10{margin:10px 0 0 0;}
.fwb{font-weight:bold;}
.containerleft{width:200px;height:500px;background-color:#ececec;}
.containercenter{width:540px;height:auto;overflow:hidden;background-image:url(../images/sep.png);background-repeat:no-repeat;background-position:top right;min-height:450px;}
.containerright{width:190px;height:500px;padding:5px;}
.holdip{width:190px;height:auto;overflow:hidden;margin-bottom:5px;}
.holdtopip{width:190px;height:29px;background-image:url(../images/hc.gif);background-repeat:repeat-x;background-position:top left;position:relative;text-align:left;}
.holdbottomip{width:170px;height:auto;padding:15px 10px 10px;position:relative;overflow:hidden;}
.holdbottomip p img {margin-right: 10px;}
.m5{margin:5px;}
.smenu{width:200px;height:auto;overflow:hidden;}
.submenu{margin:0;padding:0;border-top:1px solid #9c9a9c;}
.submenu li{width:200px;background-color:#ececec;color:#FFF;border-bottom:1px solid #9c9a9c;text-transform:uppercase;}
.submenu li a{display:block;font-weight:bold;padding:10px;}
.submenu li a:hover{display:block;background-color:#FFF;}
.abtschool{width:98%;padding:5px;height:auto;overflow:hidden;}
.cp{cursor:pointer;}
.active{background-color:#FFF;}
.active1{background-color:transparent;}
.abtall{width:98%;padding:5px;height:auto;overflow:hidden;min-height:450px;}
.containerl{width:720px;height:auto;overflow:hidden;padding:10px;background-image:url(../images/sep.png);background-repeat:no-repeat;background-position:top right;min-height:450px;}
.contact-1{width:46%;padding:10px;float:left;font-size:14px;line-height:20px;margin:10px 0;background-color:#dddddd;}
.contact-2{width:46%;padding:10px;float:left;font-size:14px;line-height:20px;}
.contmus{text-transform:uppercase;font-size:24px;font-weight:bold;}
.lh{line-height:24px;text-align:justify;}
.list{list-style-type:decimal;margin:0 0 0 30px;}
.tac{text-align:center;}
.holdbottomip p{line-height:20px;}
.fs14{font-size:14px;}
.fc{color:#840120;}
.epln{width:47%;padding:1%;float:left;border-top:1px solid #999;border-left:1px solid #999;border-right:1px solid #999;text-align:center;}
.plbb{border-bottom:1px solid #999;}
.tf1{color:#0033cc;text-shadow:0px 0px 1px #000;}
.mtb10{margin:10px 0;}
.oh{overflow:hidden}
.ml8{margin-left:8px;}
.common{list-style-type:none;padding:0;margin:5px 0;}
.common li{margin:0 5px 10px;padding:10px;width:44%;background-color:#f5f6f1;height:auto;float:left;text-align:center;}
.common li img{margin:0 0 5px 0;}
.common li p{text-align:center;width:96%;padding:5px;font-weight:bold;font-size:14px;word-wrap:break-word;background-color:#dbdbdb;color:#4b4c4c;}
.stable{width:500px;list-style-type:none;padding:0;margin:5px auto;border-bottom:1px solid #929292;}
.stable li{width:500px;height:auto;overflow:hidden;border-left:1px solid #929292;border-top:1px solid #929292; }
.stable li span.stable1{padding:3px;width:118px;height:auto;float:left;text-align:center;border-right:1px solid #929292;}
.achtable{width:375px;list-style-type:none;padding:0;margin:5px auto;border-bottom:1px solid #929292;}
.achtable li{width:375px;height:auto;overflow:hidden;border-left:1px solid #929292;border-top:1px solid #929292;}
.achtable li span{padding:3px;width:118px;height:auto;float:left;text-align:center;border-right:1px solid #929292;}
.stab.fwb {height: auto;width: 500px;list-style-type:none;padding:0;margin:5px auto;border-bottom:1px solid #929292;}
.stab.fwb li{width:500px;height:auto;overflow:hidden;border-left:1px solid #929292;border-top:1px solid #929292;}
.stab.fwb li .stable1 {float: left;width:70px;padding:3px;height:auto;text-align:center;border-right:1px solid #929292;}
.stab.fwb li .stable2 {float: left;width:115px;padding:3px;height:auto;text-align:center;border-right:1px solid #929292;}
.stab.fwb li .stable3 {float: left;width:194px;padding:3px;height:auto;text-align:center;border-right:1px solid #929292;}
.stab.fwb li .stable4 {float: left;width:93px;padding:3px;height:auto;text-align:center;border-right:1px solid #929292;}
.pdficon{background-image:url(../images/pdf_25.png);background-repeat:no-repeat;background-position:left center;width:190px;display:block;margin:auto;}
.abtmcl{margin-left:133px;width:100%;height:auto;overflow:hidden;}
.imgmb{margin:10px;border:1px solid #7e7b7b;}
.imga{display:block;width:100%;}
ul.schtd{list-style-type:none;padding:0;margin:5px 0;}
ul.schtd li{padding:3px;margin:3px 0;width:99%;height:auto;overflow:hidden;border-bottom:1px solid #CCC;}
ul.schtd li span.schtdimg{width:20%;height:auto;overflow:hidden;float:left;word-wrap:break-word;}
ul.schtd li span.schtdt{width:80%;height:auto;overflow:hidden;float:left;word-wrap:break-word;}
ul.schtd li span.schtdt p span{width:122px;height:auto;overflow:hidden;float:left;font-weight:bold;}
.feedback{position:fixed;top:40%;right:0;width:32px;height:125px;z-index:100;}
.footer p.tac a{padding:10px;text-transform:uppercase;}
.footer p.tac a:hover{color:#FFF;}

/*======Header Menu======*/
/*.navigation{width:940px;height:45px;background-color:#00f; color:Black; float:left;-moz-border-radius:5px 5px 0 0;-webkit-border-radius:5px 5px 0 0;-khtml-border-radius:5px 5px 0 0;border-radius:5px 5px 0 0;}
.nav{margin:0;padding:0;}
.nav li{display:block;width:117px;height:45px;float:left; color:Black;}
.nav li a{display:block;width:117px;height:45px;float:left;text-indent:-9999px; color:Black;}
.nav li a.home{width:117px;height:45px;}
.nav li a.home:hover{width:117px;height:45px;}
.nav li a.about{background-position:-117px 0;width:117px;	height:45px; color:Black;}
.nav.menu li a.about.menulink:hover{background-position:-117px 0;width:117px;height:45px;display:block;}
.nav li a.gallery{background-position:-234px 0;width:117px;	height:45px; color:Black;}
.nav li a.gallery:hover{background-position:-234px 0;	width:117px;height:45px; color:Black;}
.nav li a.school{background-position:-234px 0;width:117px;	height:45px;}
.nav li a.school:hover{background-position:-234px 0;	width:117px;height:45px;}
.nav li a.achievement{background-position:-351px 0;width:117px;height:45px;}
.nav li a.achievement:hover{background-position:-351px 0;width:117px;height:45px;}
.nav li a.donations{background-position:-468px 0;width:117px;height:45px;}
.nav li a.donations:hover{background-position:-468px 0;width:117px;height:45px;}
.nav li a.membership{background-position:-585px 0;width:117px;height:45px;}
.nav li a.membership:hover{background-position:-585px 0;width:117px;height:45px;}
.nav li a.reports{background-position:-702px 0;width:117px;	height:45px;}
.nav li a.reports:hover{background-position:-702px 0;	width:117px;height:45px;}
.nav li a.contacts{background-position:-819px 0;width:117px;height:45px;}
.nav li a.contacts:hover{background-position:-819px 0;width:121px;height:45px;}
ul.nav.menu {list-style:none; margin:0; padding:0;}
ul.nav.menu * {margin:0; padding:0;}
ul.nav.menu li {position:relative; float:left;}
ul.nav.menu ul {position:absolute; top:45px; left:0; background:#d1d1d1;color:Black; display:none; opacity:0; list-style:none;}
ul.nav.menu ul li {position:relative;border-top:none; margin:0;width:186px;height:32px;}
ul.nav.menu ul li a {display:block; background-color:#d1d1d1;color:Black;}
ul.nav.menu ul li a.avm {display:block;background-color:#d1d1d1; color:Black;width:186px;height:32px;}
ul.nav.menu ul li a.amc {display:block;background-color:#d1d1d1;color:Black;width:186px;height:32px;}
ul.nav.menu ul li a.apm {display:block;background-color:#d1d1d1;color:Black;width:186px;height:32px;}
ul.nav.menu ul li a.agsm {display:block;background-color:#d1d1d1;color:Black;width:186px;height:32px;}
ul.nav.menu ul li a.avm:hover {display:block;background-color:#d1d1d1;color:Black;width:186px;height:32px;}
ul.nav.menu ul li a.amc:hover {display:block;background-color:#d1d1d1;color:Black;width:186px;height:32px;}
ul.nav.menu ul li a.apm:hover {display:block;background-color:#d1d1d1;color:Black;width:186px;height:32px;}
ul.nav.menu ul li a.agsm:hover {display:block;background-color:#d1d1d1;color:Black;width:186px;height:32px;}
ul.nav.menu .menulink {font-weight:bold;display:block;}
ul.nav.menu .menulink:hover{display:block;font-weight:bold; color:Black;}*/






* {
    box-sizing: border-box;
}

.column {
    float: left;
    width: 33.33%;
    padding: 5px;
}

/* Clearfix (clear floats) */
.row::after {
    content: "";
    clear: both;
    display: table;
}

/*Model*/
.modal-issue {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 999; /* Sit on top */
    left: 0;
    top: 100px;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgba(0,0,0,0.5); /* Black w/ opacity */
}

/* The Close Button */
.close {
    color: #c1ddad;
    float: right;
    font-size: 50px;
    font-weight: bold;
}

    .close:hover,
    .close:focus {
        color: #a8818b;
        text-decoration: none;
        cursor: pointer;
        -webkit-transition: all 200ms ease-in;
        transition: all 200ms ease-in;
    }

/* Modal Header */
.modal-header {
    padding: 2px 16px;
    /*background-color: #5cb85c;*/
    color: white;
}

/* Modal Body */
.modal-body {
    padding: 2px 16px;
}

/* Modal Content */
.modal-content {
    position: relative;
    background-color: transparent;
    margin: auto;
    padding: 0;
    width: 50%;
    -webkit-animation-name: animatetop;
    -webkit-animation-duration: 0.4s;
    animation-name: animatetop;
    animation-duration: 0.4s;
}

/* Add Animation */
@-webkit-keyframes animatetop {
    from {
        top: -300px;
        opacity: 0;
    }

    to {
        top: 0;
        opacity: 1;
    }
}

@keyframes animatetop {
    from {
        top: -300px;
        opacity: 0;
    }

    to {
        top: 0;
        opacity: 1;
    }
}