/*****************************************************************************************************************
	Project        : Red Phone
	Css Created By : Pradeep Chandra Bhatt
*****************************************************************************************************************/

html, body {  
    padding: 0px;
    margin: 0px;
	font-family:arial;
	background:#1f8ec5 url(../images/topbg.jpg) repeat-x left top; 
}






*:focus {  outline: none;}  
/*h1, h2, h3, h4, h5, h6, p, ul, li, form, div { list-style-type:none;  margin:0px; padding:0px; }*/
#bghome{ width:100%; height:auto; background:#dcd7cc url(../images/bg.jpg) no-repeat center top; float:left; }
#mainwrapper { width:980px; margin:0 auto;}
.headtoparea {float:left; width:980px; height:71px; text-align:center; padding:15px 0 0 0 ;}
.toparea {float:left; width:980px; height:65px; position:relative;}
.logoarea { position:absolute; top:7px; left:20px; z-index:100;}
.topnav { float:left;  height:65px; line-height:65px; margin:0 0 0 150px; }
.topnav ul {list-style-type:none;  margin:0px; padding:0px; float:left;}
.topnav ul li {list-style-type:none;  margin:0px; padding:0px; float:left; height:65px;}

.topnav ul li a { float:left; padding:0px 12px 0px 12px; font-family:arial; font-size:14px; color:#fff; font-weight:normal; text-decoration:none; text-transform:uppercase;}
.topnav ul li a:hover { color:#000;}
.topnav ul li.active a { color:#000;}
.topnav ul li.last { background:none;}
.index_banner_area { float:left; width:980px; padding-top:35px; }
.inner_banner_area { float:left; width:972px; border:4px solid #ffffff; margin-bottom:11px; }
.innermidarea { float:left; width:980px; background:#FFFFFF; margin-bottom:20px; height: auto;}
.innermidarea h1 { padding:20px 0px 10px 10px; margin:0px; font-family:arial; font-size:15px; color:#000; font-weight:bold; text-decoration:none; text-transform:uppercase; border-bottom:1px solid #b2b2b2} 
.innermidarea .txtarea {padding:20px 14px 20px 14px; overflow:hidden; margin:0px; font-family:arial; font-size:14px; color:#565656; font-weight:normal; text-decoration:none; min-height:400px;}
.red {color:#2a4f93; font-weight:bold; text-decoration:none; font-size:16px;}



.text16 { font-family:arial; font-size:16px; color:#333333; font-weight:normal; text-decoration:none;}
.text16 a { font-family:arial; font-size:16px; color:#1f8ec5; font-weight:normal; text-decoration:none;}
.text16 a:hover { font-family:arial; font-size:16px; color:#1f8ec5; font-weight:normal; text-decoration:underline;}


.governing_area { overflow:hidden;}
.governing_area ul {list-style-type:none;  margin:0px; padding:0px; float:left; width:100%;}
.governing_area ul li {list-style-type:none;  margin:0px 23px 20px 0px;  float:left; width:131px; padding:20px; background:#ebebeb;}
.governing_area ul li .imgarae{ float:left; width:131px; height:135px; padding-bottom:8px;}
.governing_area ul li .des{ float:left; font-family:arial; font-size:14px; color:#1f79ff; font-weight:normal; text-decoration:none; line-height:20px;  width:131px; text-align:center;}
.governing_area ul li .des span { color:#404040}
.governing_area ul li.last { margin:0px;}

.midarea { float:left; width:980px;}
.white_bx { float:left; width:438px; min-height:205px; padding:15px 20px 15px 20px; background:#ffffff; margin-right:20px; margin-bottom:20px;}
.white_bx.riht { margin-right:0px;}
.hdarea { float:left; width:100%; border-bottom:1px solid #e4e4e4; padding-bottom:10px; margin-bottom:10px;}
.hdarea h2 { float:left; padding:0px; margin:0px; font-family:arial; font-size:16px; color:#383838; font-weight:bold; text-decoration:none; text-transform:uppercase;} 
.hdarea .rht { float:right; padding-top:3px;}
.hdarea .rht a {font-family:arial; font-size:11px; color:#2a4f93; font-weight:normal; text-decoration:none; text-transform:uppercase;}
.hdarea .rht a:hover { text-decoration:underline;}

.white_bx .lftimg { float:left; width:111px; height:138px; padding-right:10px;}
.txtbx { float:right; width:315px; padding-top:10px; }

.txtbx p {font-family:arial; font-size:13px; color:#636363; font-weight:normal; text-decoration:none; padding:0px; margin:0px;}

.latest_bx { float:left; width:438px;}
.latest_bx ul {list-style-type:none;  margin:0px; padding:0px;  width:100%;}
.latest_bx ul li {list-style-type:none;  margin:0px; padding:0px; overflow:hidden; border-bottom:1px dotted #7e7e7e; padding-bottom:15px; margin-bottom:15px;}
.latest_bx ul li.last { padding:0px; margin:0px; border-bottom:none;}
.latest_bx ul li .imgarea { float:left; width:69px; height:60px; padding-right:10px;}
.latest_bx ul li .txtarea { float:left; width:359px; padding-top:5px; font-family:arial; font-size:13px; color:#636363; font-weight:normal; text-decoration:none; }

.latest_bx ul li .txtarea a { color:#dc6727; font-weight:normal; text-decoration:none; }
.latest_bx ul li .txtarea a:hover { color:#dc6727; font-weight:normal; text-decoration:underline; }

.white_bx_btm { float:left; width:940px; min-height:230px; padding:15px 20px 15px 20px; background:#ffffff; margin-bottom:20px;}

.white_bx_btm  h2 { float:left; padding:0px; margin:0px; font-family:arial; font-size:16px; color:#383838; font-weight:bold; text-decoration:none; text-transform:uppercase;} 
.white_bx_btm .hdarea .rht { float:right; padding-top:3px;}
.white_bx_btm .hdarea .rht a {font-family:arial; font-size:11px; color:#1f79ff; font-weight:normal; text-decoration:none; text-transform:uppercase;}
.white_bx_btm .hdarea .rht a:hover { text-decoration:underline;}

.people_bx { float:left; width:910px; padding:15px}
.people_bx ul {list-style-type:none;  margin:0px 31px 0px 0px; padding:0px 31px 0px 0px;  width:254px; float:left; border-right:1px solid #dbdbdb}
.people_bx ul.last { margin-right:0px; border-right:none; padding-right:0px;}
.people_bx ul li {list-style-type:none;  margin:0px; padding:0px; overflow:hidden; border-bottom:1px solid #dbdbdb; padding-bottom:15px; margin-bottom:15px;}
.people_bx ul li.last { padding:0px; margin:0px; border-bottom:none;}
.people_bx ul li .imgarea { float:left; width:60px; height:62px; padding-right:15px;}
.people_bx ul li .txtarea { float:left; width:179px;  font-family:arial; font-size:13px; color:#636363; font-weight:normal; text-decoration:none; }
.people_bx ul li .txtarea h2 {padding:0px 0px 6px 0px; margin:0px; font-family:arial; font-size:16px; color:#1f79ff; font-weight:normal; text-decoration:none; float:none; text-transform:none;}
.people_bx ul li .txtarea p {padding:0px; margin:0px; font-family:arial; font-size:16px; color:#636363; font-weight:normal; text-decoration:none; }

.footerarea { float:left; width:100%; height:55px; line-height:55px; background:#2a4f93; margin-top:20px}
.footer_container { width:980px; margin:0px auto;}
.footerarea  .lft { float:left; font-family:arial; font-size:12px; color:#ffffff; font-weight:normal; text-decoration:none;}
.footerarea  .rht { float:right; }
.footerarea  .rht a { float:left; background:url(../images/fb.gif) no-repeat left 16px; padding-left:30px; font-family:arial; font-size:12px; color:#ffffff; font-weight:normal; text-decoration:none;}

.contactpage{margin:10px; float:left; width:960px; font-family:arial; font-size:12px; color:#333333; font-weight:normal; text-decoration:none; height:auto;}

.archivement{margin:10px; float:left; width:960px; font-family:arial; font-size:12px; color:#333333; font-weight:normal; text-decoration:none; height:1000px;}

.policies{margin:10px; float:left; width:960px; height:300px; background-color:#fff;}
.policies h4{font-family:arial; font-size:24px; color:#000; font-weight:bold; text-decoration:none; padding:0 0 5px 0;}
.policies ul{ list-style:none; float:left; margin:0; padding:0;}
.policies ul li{list-style:none; float:left; margin:0; padding:0 0 15px 0;width:600px}
.policies ul li a{font-family:arial; font-size:16px; color:#2a4f93; font-weight:normal; text-decoration:none;}
.policies ul li a:hover{text-decoration:underline;}

.gap{width:900px; height:200px; float:left}


/* custom css */

.schemeContainer.riht {
    margin-right: 0px;
}

.schemeContainer {
    float: left;
    min-height: 150px;
    padding: 15px 20px 15px 20px;
    background: #ffffff;
}

.scheme_bx .flexBox {
	display: flex;
    justify-content: space-around;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.scheme_bx {
    float: left;
    width: 100%;
}

.scheme_bx ul:first-child {
	list-style: none;
	padding-left: 0px;
}

.scheme_bx .txtarea {
	padding-bottom: 20px;
}

.scheme_bx .txtarea ul {
	padding-top: 6px;
    padding-left: 30px;
    list-style-type: disc;
}

.gallery-container {
	display: flex;
	flex-wrap: wrap;
	background-color: #fff;
	width: 98%;
	margin: 20px auto;
	padding: 10px;
	gap: 10px;
}

.gallery-item {
	flex-basis: 31.7%;
	opacity: .85;
	cursor: pointer;
}

.gallery-item:hover {
	opacity: 1;
}

.gallery-item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	width: 313px;
	height: 213px;
	transition: .3s all;
}

.gallery-item img:hover {
	box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.3);
}

.lightbox {
	position: fixed;
	display: none;
	background-color: rgba(0, 0, 0, 0.8);
	width: 100%;
	height: 100%;
	overflow: auto;
	top: 0;
	left: 0;
}

.lightbox-content {
	position: relative;
	width: 70%;
	height: 70%;
	margin: 5% auto;
}

.lightbox-content img {
	border-radius: 7px;
	box-shadow: 0 0 3px 0 rgba(225, 225, 225, .25);
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.lightbox-prev,
.lightbox-next,
.lightbox-close {
	position: absolute;
	background-color: rgba(0, 0, 0, 0.8);
	color: #fff;
	padding: 10px;
	top: 50%;
	transform: translateY(-50%);
	cursor: pointer;
	font-size: 24px;
}

.lightbox-prev {
	left: 10px;
}

.lightbox-next {
	right: 10px;
}

.lightbox-close {
	top: 10px;
	right: 10px;
}

.lightbox-prev:hover,
.lightbox-next:hover,
.lightbox-close:hover {
	opacity: .8;
}

@media (max-width: 767px) {
	.gallery-container {
		width: 100%;
	}
	
	.gallery-item {
		flex-basis: 49.80%;
		margin-bottom: 3px;
	}
	
	.lightbox-content {
		width: 80%;
		height: 60%;
		margin: 15% auto;
	}
}

@media (max-width: 480px) {
	.gallery-item {
		flex-basis: 100%;
		margin-bottom: 1px;
	}
	
	.lightbox-content {
		width: 90%;
		margin: 20% auto;
	}
}

