* {
    border: 0 none;
    margin: 0;
}
img {
    border: 0 none;
}
a {
    color: #ffffff;
    text-decoration: none;
}
a:hover {
    text-decoration: none;
}
body {
    background: #f1f1f1;
    color: #444444;
    font-family: Verdana,Geneva,sans-serif;
    font-size: 11px;
    line-height: 19px;
}

#top-wrap1{display: block}
#top-wrap2{display: none}
#info {
	float: right;
	padding: 8px;
	font-size: 0.9rem;
	background-color: #0976e4;
	color: #fff;
}
#info:after{content: " >"}

.top-wrap2-ul{
	font-size: 1.0rem;
	padding: 0px;
	display: inline-block;
 }

.top-wrap2-ul > li:first-child{
	display: inline-block;
	padding: 0px 10px;
	color: #fff;
	background-color: #0976e4;
	cursor: pointer;
}
.top-wrap2-ul > li:first-child > div:after{
	content: "\f103";
	font-family: FontAwesome;
	display: inline-block;
	vertical-align: middle;
	font-size: 1.6em;
	text-align: center;
	width: 20px;
	text-decoration: none !important;
}

 .top-wrap2-ul > li:first-child > div{
	 /* transitions */
	 display: inline-block;
	-webkit-transition-duration: 0.6s;
    -moz-transition-duration: 0.6s;
    -o-transition-duration: 0.6s;
    transition-duration: 0.6s;
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    -o-transition-property: -o-transform;
	transition-property: transform;
 }

 .top-wrap2-ul > li:nth-last-child(2) {
	padding: 10px 15px;
	font-family: 'Noto Sans', sans-serif;
	font-size: 1.2rem;
	background-color: #f1f1f1;
	display: inline-block;
	border-left: 1px solid;
	border-right: 1px solid;
}

.top-wrap2-ul > li:last-child{
	display: inline-block;
	padding: 3px 10px;
}

 .top-wrap2-ul > ul {
	display: none;
	position: absolute;
	color: #000;
	list-style: none;
	padding-left: 0;
	margin-top: 10px;
	font-family: 'muli', sans-serif;
	font-size: 1.0rem;
	background-color: #f1f1f1;
	z-index: 1002;
	width: 100%;
}
.top-wrap2-ul > ul > li {
	border-bottom: 1px solid #1a2930;
	padding: 10px 10px;
	font-weight: bold;
}

.top-wrap2-ul > ul > li:hover {
	background-color: #8d8d8d;
	color: #f1f1f1;
}

 /* .top-wrap2-ul > li:hover > ul {display: block} */

#l-top {
	background-color: #f1f1f1;
	border-top: 0.05rem solid #1a2930;
}
#badge {
	float: left;
	display: inline-block;
	margin-left: 10%;
}
.search-box{
    display: inline-block;
    float:right;
    margin: 10px 10px;
}
.search-box .input {
	border: 1px solid #8d8d8d;
	background-color: #8d8d8d;
	color: #fff;
	padding-left: 10px;
}
.search-box .item {
	background-color: #8d8d8d;
	color: #fff;
	cursor: pointer;
	font-size: 1.158rem;
	position: relative;
	top: 2px;
	padding-top: 1px;
}
.search-box .item:hover{
    background-color: #fff;
    color:#22363f;
    cursor: pointer;
}
.nav-button{display: none}
#badge .menu-wrapper .title{
    display: table-row;
    width: 56%;
}
#badge .title h2 {
	font-size: 1.5rem;
	color: #22363f;
	font-family: 'Droid Serif', serif;
    margin: 0;
}
#badge .title h3{display: none}
#badge .title p {
	font-family: 'Arimo', sans-serif;
	font-size: 0.9rem;
	color: #22363f;
	float: right;
	margin-top: -5px;
}
#badge {
	margin-left: 10%;
}
#l-img {
	float: left;
	width: 110px;
	display: inline-block;
	margin-left: 5%;
}
#badge .title div b{white-space: nowrap}
/* 
here goes new navigation CSS
 */
 .nav-back{
    float: right;
    width: 100%;
    background-color: #22363f;
    color: #f1f1f1;
    margin-top: 10px;
}

 .nav-ul{
	margin: 0 auto;
	font-size: 1.0rem;
	text-align: center;
 }

 .nav-ul > li{
     width: calc(100%/6.5);
    padding: 10px 0;
    display: inline-block;
 }

 .nav-ul > li:hover{
    background-color: #0976e4;
 }

 .nav-ul > li > ul {
	display: none;
	position: absolute;
	color: #000;
	text-align: initial;
	list-style: none;
	box-shadow: 0 4px 10px 0 rgba(0,0,0,0.2),0 4px 20px 0 rgba(0,0,0,0.19);
	padding-left: 0px;
	margin-top: 10px;
	font-family: 'muli', sans-serif;
	font-size: 1.0rem;
	min-width: 210px;
 }
 .nav-ul > li > ul > li {
	 border-bottom: 1px solid grey;
	 padding:10px;
 }
  .nav-ul > li > ul .active{
	  background-color: #8d8d8d;
	  color: #f1f1f1;
  }
 .nav-ul > li > ul > li:hover{
	 background-color: #8d8d8d;
	 color: #f1f1f1;
 }
 /* .nav-ul > li > ul {display: block} */
 .nav-ul > li:hover > ul{display: block; z-index: 10002; background-color: #f1f1f1}

/* Content goes here */
.parent-wrapper{
    display: block;
}
.body-wrapper {
	display: block;
	margin: 0 auto;
    margin-top: 0px;
}

.content2{
	display: grid;
	/*grid-template-columns: 1fr 3fr 1fr;*/
	grid-template-columns: 1fr 4fr;
	grid-column-gap: 1em;
	margin: 0 auto;
	min-height: 0px;
	max-width: 1250px;
	border-top: 1px solid #22363f;
	padding: 10px 5px;
}

.content2 h3 {
	font-family: 'Arvo', serif;
	color: #0976e4;
	padding-left: 10px;
	margin-top: 10px;
	font-size: 1.3rem;
}

.content2 h4 {
	font-family: 'Arvo', serif;
	color: #22363f;
	margin-top: 10px;
	font-size: 1.1rem;
}

.content2 p {
	font-family: 'Noto Sans', sans-serif;
	font-size: 1.0rem;
	text-align: justify;
}


 .content-wrap{
	 display:inline-block;
	 padding: 10px 10px;
	 vertical-align: top;
 }
 .nav-left{
		width: 100%;
		background-color: #f1f1f1;
		color: #0976e4;
		margin-top: 10px;
 }
 
 .nav-left-ul {
	display: block;
	list-style: none;
	padding-left: 0px;
}
 .nav-left-ul > li{
	border-bottom: 1px solid grey;
	padding:10px;
 }
 .nav-left-ul > li:hover{
	background-color: #fff;
	color: #0976e4;
 }
 .nav-left-ul .active{
	background-color: #fff;
	color: #0976e4;
 }
 /* content ends here */
/* mobile navigation start */

.nav-ul-mob{
	margin: 0 auto;
	font-size: 1.0rem;
	padding-left: 0px;
 }

 .nav-ul-mob > li{
    padding: 10px 30px;
	list-style: none;
}

.nav-ul-mob > li::before {
	content: "\f103";
	font-family: FontAwesome;
	display: inline-block;
	vertical-align: middle;
	text-align: center;
	text-decoration: none !important;
	padding-right: 5px;
}

.nav-ul-mob > li:hover{
	background-color: #0976e4;
 }

 .nav-ul-mob > li > ul {
	display: none;
	color: #fff;
	text-align: initial;
	list-style: none;
	padding-left: 0px;
	margin-top: 15px;
	font-family: 'muli', sans-serif;
	font-size: 0.8rem;
	width: 100%;
	background-color: #0976e4
 }
 .nav-ul-mob > li > ul > li {
	 border-bottom: 1px solid #fff;
	 padding:10px;
 }
  
 .nav-ul-mob > li > ul .active{
	font-weight: bold;
}
 
 .nav-ul-mob > li:hover > ul{display: block; z-index: 10002}


/* mobile navigation ends */

 .foot-wrapper {
	display: block;
	background-color: #22363f;
	width: 100%;
    margin-top: 40px;
}

 .foot {
	display: grid;
	grid-template-columns: repeat(4, auto);
	grid-template-rows: repeat(3, auto);
	grid-column-gap: 1em;
	margin: 0 auto;
	min-height: 350px;
    max-width: 1250px;
	background-color: #22363f;
}

.foot > div{
    grid-row: 1/2;
    padding-right: 10px;
}
.foot > div:nth-child(5) {
	grid-column: 1/5;
	grid-row: 2/3;
	padding-left: 20px;
}
.foot > div:nth-child(5) img{
    display: inline-block;
    width:100px;
    background: #fff;
}
.foot > div:last-child{
    grid-row: 3/4;
    grid-column: 1/5;
    border-top: 1px solid #f1f1f1;
}
.foot h3 {
	color: #007fff;
	font-size: 1.2rem;
	padding: 10px;
	font-family: 'Droid Serif', serif;
}
.foot ul {
	color: #f1f1f1;
	font-size: 0.9rem;
    line-height: 1.5rem;
	list-style: none;
}
.foot ul li{
		position: relative;
}

.foot ul li:hover{
	text-decoration: underline;

}
/*.foot ul li::before{
	content: "\f054";
	font-family: FontAwesome;
	display: inline-block;
	vertical-align: middle;
	font-size: 1.0em;
	width: 15px;
	text-decoration: none !important;
}*/

#fb::before{
	content: "\f230";
	font-family: FontAwesome;
	display: inline-block;
	vertical-align: middle;
	font-size: 1.6em;
	width: 25px;
	text-decoration: none !important;
    
}

#fb:hover{
	color:#4267b2;
    transition: color ease 320ms;
}

#tw::before{
	content: "\f081";
	font-family: FontAwesome;
	display: inline-block;
	vertical-align: middle;
	font-size: 1.6em;
	width: 25px;
	text-decoration: none !important;
    
}

#tw:hover{
	color:#1da1f2;
    transition: color ease 320ms;
}

#yt::before{
	content: "\f166";
	font-family: FontAwesome;
	display: inline-block;
	vertical-align: middle;
	font-size: 1.6em;
	width: 25px;
	text-decoration: none !important;
    
}

#yt:hover{
	color:#ff0000;
    transition: color ease 320ms;
}

.foot a{
    color:#fff!important;
}

.foot h4 {
	color: #fff;
	padding: 10px 20px;
	font-size: 1.0rem;
	display: inline-block;
}
/* 
 here it ends
  */
/***********************************************************************/
/*************Optimization for different screen sizes goes here*********/
/***********************************************************************/
/*between 950px and 599px
*nexus7-landscape and nexus7-portrait
*/
@media only screen and (min-width: 37.44rem) and (max-width:59.1rem) {
#l-img{width: 70px;}
#badge .title h2 {font-size: 0.9rem;}
.search-box{display: none;}
 .content2{grid-template-columns: 1fr 3fr }
 /*.content2{grid-template-columns: 1fr 2fr 1fr}*/
}

/*Mobile site optimisation
*less than 598px
*/
@media only screen and (max-width:40.1rem){
#top-wrap1{display: none}
#top-wrap2{display: block;border-bottom: 1px solid}
#l-top{border-bottom: 2px solid #0976e4;}
.nav-ul{display: none}
.search-box{display: none;}
.nav-button {
	display: inline-block;
	float: right;
	margin: 5px 8px;
	font-size: 1.8rem;
	color: #0976e4;
	padding: 0px 9px;
	cursor: pointer;
}
#badge{margin-left: 3%}
#badge .title h2{display: none}
#badge .title div{display: none}
#badge .title h3{
    display: block;
    font-size: 2.0rem;
    color: #000;
    font-family: 'Droid Serif', serif;
}
#badge .title p {font-size: 0.9rem;}
#l-img{width: 70px;padding-bottom: 10px;}

.body-wrapper{margin-top: 0px}
.footer-img{display: none;}
}
@media only screen and (max-width:47.76rem){
/*#badge .title div{display: none}*/
#badge .title div b{white-space: normal}
}
@media only screen and (max-width:77.76rem){
#l-img {margin-left: 1%;}
#badge {margin-left: 1%;}
}
/*@media only screen and (max-width:77.76rem){
.navbar-toggle {display: block;}
}*/
/* content */

@media only screen and (max-width:40.1rem){
	.content2 {
		display: grid;
		/*grid-template-rows: repeat(3, auto);*/
		grid-template-rows: repeat(2, auto);
		grid-template-columns: 1fr;
		grid-row-gap: 1em;
		margin: 0 auto;
		border: none;
	}
}

/* FOOT */
/*Mobile*/
@media only screen and (max-width:37.1rem){
    .foot{
    grid-template-columns: repeat(2, auto);
	grid-template-rows: repeat(4, auto);
	grid-column-gap: unset;
}
.foot > div:nth-child(1),.foot > div:nth-child(2){
	grid-row: 1/2;
}
.foot > div:nth-child(3),.foot > div:nth-child(4){
    grid-row: 2/3;
}
 .foot > div:nth-child(5){grid-row: 3/4; grid-column: 1/3;}
.foot > div:last-child{
	grid-row: 4/5;
	grid-column: 1/3;
}
#m-id{float:left}

.foot ul {
	padding: 10px;
}
.foot ul li{
		padding:5px 0;

}

}




/*below 1025px*/
@media only screen and (max-width:64.06rem){
    .search-box{display: none}
    .back-drop{display:none}
}
#fff{
    content:" "
}