@charset "utf-8";
/* CSS Document */
body {
	background:url(../images/bg-body.jpg); font-size:94%; color:#333; font-family:Arial, Helvetica, sans-serif;
}
 body, html{
	overflow:hidden;
 }
input[type="text"], input[type="password"],input[type="date"], input[type="textarea"],input[type="search"],textarea {
	background:#fff;
	color:#333!important;
	padding:8px;
	font-size:14px;
	font-weight:bold;
	width:98%;
}
select {
	background:#fff;
	color:#333!important;
	padding:18px!important 0;
	font-size:14px;
	font-weight:bold;
	width:auto;
	overflow:auto!important;
}

form label{ color:#999!important;}
.inputSizeSmall{
	width:30%;
}
input[type="date"].inputSizeSmall{
	width:28%;
}

.date{
	color:#f6edcd;
	font-size:11px;
	margin:0;
	}
.photo-image{
	float:left;
	margin:0 15px 15px 0;
	}
.caption{ font-size:12px; color:#999; display:block; background:#222; padding:3px 10px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}

.btnSelected {
	border: 1px solid 		#000 /*{a-bdown-border}*/;
	font-weight: bold;
	color: 					#fff /*{a-bdown-color}*/;
	text-shadow: 0 /*{a-bdown-shadow-x}*/ -1px /*{a-bdown-shadow-y}*/ 1px /*{a-bdown-shadow-radius}*/ #000 /*{a-bdown-shadow-color}*/;
	background-image: -webkit-gradient(linear, left top, left bottom, from( #333 /*{a-bdown-background-start}*/), to( #5a5a5a /*{a-bdown-background-end}*/))!important; /* Saf4+, Chrome */
	background-image: -webkit-linear-gradient(#333 /*{a-bdown-background-start}*/, #5a5a5a /*{a-bdown-background-end}*/)!important; /* Chrome 10+, Saf5.1+ */
	background-image:    -moz-linear-gradient(#333 /*{a-bdown-background-start}*/, #5a5a5a /*{a-bdown-background-end}*/)!important; /* FF3.6 */
	background-image:     -ms-linear-gradient(#333 /*{a-bdown-background-start}*/, #5a5a5a /*{a-bdown-background-end}*/)!important; /* IE10 */
	background-image:      -o-linear-gradient(#333 /*{a-bdown-background-start}*/, #5a5a5a /*{a-bdown-background-end}*/)!important; /* Opera 11.10+ */
	background-image:         linear-gradient(#333 /*{a-bdown-background-start}*/, #5a5a5a /*{a-bdown-background-end}*/)!important;

}
/* ================== custom buttons skin =================== */
input[type=button].backButton, .backButton{
			display:inline-block;
			width:auto;
			padding:7px 3px 9px 7px;
			font-weight:bold;
			font-size:12px;
			text-align:center;
			color:#fff;
			border-width: 0 15px;
			-webkit-border-image: url(../images/btn-back.png) 0 15 round!important;
			background:none;
			}
input[type=button].backButton:hover, .backButton:hover{
			display:inline-block;
			width:auto;
			padding:7px 3px 9px 7px;
			font-weight:bold;
			font-size:12px;
			text-align:center;
			color:#fff;
			border-width: 0 15px;
			-webkit-border-image: url(../images/btn-back-hover.png) 0 15 round!important;
			background:none;
			}
input[type=button].defaultButton, .defaultButton{
			display:inline-block;
			width:auto;
			padding:7px 3px 9px 5px;
			font-weight:bold;
			font-size:12px;
			text-align:center;
			color:#fff;
			border-width: 0 15px;
			-webkit-border-image: url(../images/button.png) 0 15 round;
			background:none;
			text-decoration:none;
			}
input[type=button].defaultButton:hover, .defaultButton:hover{
			display:inline-block;
			width:auto;
			padding:7px 3px 9px 5px;
			font-weight:bold;
			font-size:12px;
			text-align:center;
			color:#fff;
			border-width: 0 15px;
			-webkit-border-image: url(../images/button-hover.png) 0 15 round;
			background:none;
			text-decoration:none;
			}



.clearSpace{
	clear:both;
	}
.floatLeft{
	float:left;
	}
.floatRight{
	float:right;
	}
.Hline{ clear:both; border-bottom:1px solid #000; height:10px; margin-top:30px; display:block;}
.Hline-NoMargin{ clear:both; border-bottom:1px solid #000; height:10px; margin-top:0; display:block;}
.halfBlock{ width:49%; float:left;}
.loginPanel {
	width:350px;
	margin:5% auto 0 auto;
}
.loginPanel .logo {
	margin:30px 0;
	text-align:center;
}
.loginPanel .loginBox {
	width:100%;
	height:250px;
	font-size:12px;
	border-radius:12px;
	padding:15px;
	border:1px solid #545353;
	-moz-box-shadow: 0 0 30px 10px #333;
	-webkit-box-shadow: 0 0px 30px 10px #1a1a1a;
	box-shadow: 0 0 30px 10px #131313;
	text-shadow: 0 -1px 1px #000 /*{global-active-shadow-color}*/;
	background-image: -webkit-gradient(linear, left top, left bottom, from( #696868 ), to( #333 )); /* Saf4+, Chrome */
	background-image: -webkit-linear-gradient(#696868, #333 ); /* Chrome 10+, Saf5.1+ */
}
.loginPanel .loginBox form ul {
	margin:15px 0 0 0;
	padding:0;
}
.loginPanel .loginBox ul li.leftColm {
	list-style:none;
	width:28%;
	display:inline-block;
	margin-bottom:15px;
}
.loginPanel .loginBox ul li.rightColm {
	list-style:none;
	width:68%;
	display:inline-block;
	margin-bottom:15px;
}
.loginPanel .loginBox ul li label {
	font-weight:bold;
	font-size:13px;
}
.loginPanel .loginBox ul li a {
	text-decoration:none;
	color:#ccc;
}
.optionLogin, .optionLogin a {
	font-size:11px;
	text-align:left;
}
.listofColm-Thumbview ul {
	margin:0 0 0 15px;
	padding:0;
}

.listofColm-Thumbview ul li {
	margin:0 0 40px 31px;
	padding:0;
	list-style:none;
	display:inline-block;
	width:210px;
	height:200px;
}
.listofColm-Thumbview ul li label {
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
	display:block;
	width:auto;
}
.listofColm-Thumbview ul li .document-thumb {
	width:150px;
	height:180px;
	overflow:hidden;
	border:5px solid #fff;
	margin:10px 0;
	-moz-box-shadow: 0 0 5px 3px #131313;
	-webkit-box-shadow: 0 0px 5px 5px #131313;
	box-shadow: 0 0 5px 5px #131313;
}
.listofColm-Thumbview ul li .document-thumb:hover {
	border:5px solid #0981dd;
}
.listofColm-Thumbview ul li .document-thumb img {
	width:150px;
}
/*================= search popup =============== */
.popupSkin{
	background:#353535;
	-moz-box-shadow: 0 0 5px 3px #131313;
	-webkit-box-shadow: 0 0px 5px 5px #131313;
	box-shadow: 0 0 5px 5px #131313;
	height:auto;
	position:absolute;
	top:45px;
	padding:15px 10px;
	z-index:99999;
	left:0; right:0;
	display:block;
}
.popupSkin .title-search{
	background:url(../images/icon-searchBox.png) no-repeat left bottom;
	font-size:14px;
	color:#ccc;
	padding:8px 0 0 25px;
	float:left;
	width:10%;
	}
.popupSkin .content-search{
	float:left;
	width:70%;
	color:#fff;
	}
.popupSkin  .btn-controll{
	float:right;
	width:5%;
	text-align:right;
	margin-right:25px;
	padding-top:8px;
	}
.popupSkin form label{
	color:#efefef;
	display:inline-block;
	width:80px;
	margin-left:10px;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
	}
.popupSkin span{
	color:#bbb9b9;
	}
.popupContent{
	margin:0px;
	}
/*=========== page detals Section ====== */
.details-section{
	padding:10px; margin:0;
	min-height:768px;
	background:#fff;
	}

.close-popup{
	background:url(../images/icon-closepopup.png) no-repeat;
	width:24px;
	height:21px;
	display:inline-block;
	text-decoration:none;
	}
.close-popup:hover{
	background:url(../images/icon-closepopup.png) no-repeat;
	width:24px;
	height:20px;
	display:inline-block;
	text-decoration:none;
	border-bottom:1px solid #666;
	}
.dateText{
	color:#ccc;
	font-size:11px;
	font-weight:bold;
	}
.titleHeader{
	color:#75b1d4!important;
	font-weight:bold;
	font-size:15px;
	}
.titleHeaderH2{
	color:#75b1d4!important;
	font-weight:bold;
	font-size:18px;
	}
ul.listing-2Colms{
	margin:10px 0 0 0;
	padding:0;
	}
ul.listing-2Colms li{
	list-style:none;
	margin:0; padding:3px 0;
	width:49%;
	display:inline-block;
	}
ul.listing-2Colms li label{
	display:inline-block;
	width:40%;
	overflow:hidden;
	white-space:nowrap;
	text-overflow:ellipsis;
	}
ul.listing-2Colms li span{
	display:inline-block;
	width:58%;
	overflow:hidden;
	white-space:nowrap;
	text-overflow:ellipsis;
	}
.articleUpdateInfo{
	float:right;
	width:68%;
	text-align:right;
	padding-top:15px;
	}

.articleDetails{
	width:51%;
	float:left;
	}
.articleDetails_2{
	width:80%;
	float:left;
	}
.articleButtons{
	width:47.7%;
	float:right;
	text-align:right;
	}
.articleButtons_2{
	width:20%;
	float:right;
	text-align:right;
	}
.btnGroup{
	margin-top:15px;
	text-align:right;
	white-space:nowrap;
	}
.infoBar{
	background:#000;
	color:#999;
	font-size:12px;
	font-weight:bold;
	padding:7px 10px;
	height:20px;
	z-index:99999;
}
.infoBar .leftSide{
	width:50%;
	float:left;
	}
.infoBar .rightSide{
	width:50%;
	float:right;
	text-align:right;
	}
.RSSfeed ul{
	margin:0 0 0 0;
	padding:0;
	}
.RSSfeed ul li{
	margin:5px 0;
	padding:10px; font-size:12px;
	background: -webkit-linear-gradient(left, #1b1b1b 0%, #2f3030 30%, #2f3030, #1b1b1b 99%, #1b1b1b)!important;
	border:1px solid #1b1b1b;
	}
.RSSfeed ul li:hover, .RSSfeed ul li:focus {
	padding:10px;
	border:1px solid #46a4df;
	}

.RSSfeed ul li.RSS-icon{
	list-style:url(../images/icon-rss.png);
	list-style-position:inside;
	}
.RSSfeed li label{
	color:#d0b549!important;
	font-size:18px;
	display:block;
	padding-top:-10px;
	}
.RSSfeed li p, .RSSfeed li a p{
	margin:5px 0 5px 32px; font-weight:normal;
	}
.RSSfeed .date{
	color:#f6edcd;
	font-size:11px;
	margin:0 0 0 32px;
	}
.RSSfeed .RSS-icon a{
	display:block;
	text-decoration:none;
	color:#ccc!important;
	font-weight:normal;
	}
.RSSfeed .RSS-icon a:hover, .RSSfeed .RSS-icon a:focus{
	display:block;
	text-decoration:none;
	color:#46a4df!important;
	font-weight:normal;
	}

.NewsListing{}
.NewsListing ul{
	margin:0 0 0 0;
	padding:0;
	}
.NewsListing ul li{
	margin:5px 0;
	padding:0 10px 10px 10px; font-size:12px;
	background: -webkit-linear-gradient(left, #1b1b1b 0%, #2f3030 30%, #2f3030, #1b1b1b 99%, #1b1b1b)!important;
	border:1px solid #1b1b1b;
	list-style:none;
	}
.NewsListing ul li:hover, .NewsListing ul li:focus {
	border:1px solid #46a4df;
	}
.NewsListing ul li .thumbnail{
	width:14%;
	height:105px;
	overflow:hidden;
	float:left;
	}
.NewsListing ul li .news{
	width:82%;
	float:left;
	margin-left:20px;
	}
.NewsListing li .news label{
	color:#d0b549!important;
	font-size:18px;
	display:block;
	}
.NewsListing li a{
	display:block;
	text-decoration:none;
	color:#ccc!important;
	font-weight:normal!important;
	}
.NewsListing li a:hover, .NewsListing li a:focus{
	display:block;
	text-decoration:none;
	color:#46a4df!important;
	font-weight:normal;
	}


.detailsPage-content{
	padding:15px;
	background:#323232;
	}
.bgGray{
	padding:15px;
	background:#323232!important;
	}
.detailsPage-content label{
	color:#d0b549;
	font-size:18px;
	}
.detailsPage-content p{
	color:#c8c8c8;
	padding:7px 0;
	margin:0;
	line-height:22px;
	text-align:justify;
	}
.detailsPage-content strong{
	color:#94c2d7;
	}


/*============== new story css ============*/
.new_story_ipad{
	display: none;
}
.new_story_ipad.active{
	display: block;
	position: absolute;
    top: calc(50% - 108px);
    left: calc(50% - 250px);
	width: 500px;
	height: 215px;
	background: #fff;
	border-radius: 4px;
	color: #000;
}

ul.stories{
	padding-right: 32px;
}
.stories li{
	width: 30.33%;
	display: inline-block;
	font-size: 12px;
	text-align: center;
	padding: 5px;
}

.stories li a {
	display: block;
	text-transform: uppercase;
	font-weight: 600;
	background: #65a1d0;
	color: #fff !important;
	border-radius: 3px;
	padding: 10px;
	cursor: pointer;
	height: 33px;
}

/*============== autocomplete css ============*/


ul.holder{
	font-size: 12px;
	background: #fff;
	border: none;
	border-radius: 3px;
	margin: 0;
	min-height: 38px;
	width: 100%;
	padding: 0 10px;

}

li.holder{
	background: #666 !important;
	color: #fff;
}

.imgDiv{
	width: 100px;
	height: 60px;
	display: inline-block;
}
.imgDiv img{
	height: 100%;
}



/*============== for thumbnail horizontal use only ============*/
.scrollSection{
	/*background:#333;*/ background:url(../images/transBg.png); height:150px; width:100%; position:absolute; z-index:999;
	bottom:6%;
	}
/*@media only screen and (orientation:landscape) {
.scrollSection{
		background:#333; height:150px; width:100%; position:absolute; top:72.5%; z-index:999;
	}
	}*/

.square {
	width: 160px;
	height: 200px;
	text-align: center;
	margin:10px;
	overflow:hidden;
	border:1px solid #666;
}
.square img{
	width:100%;
	height:100%;

	}
.square:hover, .square:focus{
	border:1px solid #46a4df;
	}

.single-block-view-h, .single-block-view-v {
	width: 160px;
	height: 130px;
}
.double-block-view-h {
	width: 100%;
	height: 130px;

}
.single-block-view-h > .view, .double-block-view-h > .view {
	width: 9999px;
	height: 130px;
}
.single-block-view-h > .view > .square, .double-block-view-h > .view > .square {
	float: left;
}



.formStructure ul {
	margin:15px 0 0 0;
	padding:0;
}
.formStructure li.leftColm {
	list-style:none!important;
	width:20%;
	display:inline-block;
	margin-bottom:15px;
}
.formStructure li.rightColm {
	list-style:none!important;
	width:78%;
	display:inline-block;
	margin-bottom:15px;
	vertical-align:top;
}
.formStructure li label {
	font-weight:bold;
	font-size:13px;
}


.formStructure .floatLeft{
	width:49%;
	float:left;
	}

.formStructure .floatRight{
	width:49%;
	float:right;
	}

.formStructure .floatLeft li.leftColm, .formStructure .floatRight li.leftColm{
	width:41%;
	display:inline-block;
	}
.formStructure .floatLeft li.rightColm, .formStructure .floatRight li.rightColm{
	width:48%;
	display:inline-block;
	}

.btnCollapse{
	text-align:center;
	}
.btnCollapse img{
	border-right:1px solid #333;
	border-bottom:1px solid #333;
	border-left:1px solid #333;
	}
.btnCollapse img:hover, .btnCollapse img:focus{
	border-right:1px solid #46a4df;
	border-bottom:1px solid #46a4df;
	border-left:1px solid #46a4df;
	}

.overlayBox{ background:url(../images/transparentbg.png); width:100%; height:100%; position:absolute; z-index:9999;}
.overlayBox .messageBox{
	position:absolute;
	left:40%;
	top:35%;
	min-width:150px;
	height:auto;

	background-image: -webkit-gradient(linear, left top, left bottom, from( #CCCCCC ), to( #AAAAAA )); /* Saf4+, Chrome */
	background-image: -webkit-linear-gradient(#CCCCCC, #AAAAAA ); /* Chrome 10+, Saf5.1+ */

	margin:0 auto!important; z-index:9999;
	padding:15px;
	font-size:18px;
	border-radius:12px;
	text-align:center;
	border:2px solid #046eb8;
	opacity:0.95;
	}

.toolsPalate{
	background-image: -webkit-gradient(linear, left top, left bottom, from( #696868 ), to( #333 )); /* Saf4+, Chrome */
	background-image: -webkit-linear-gradient(#696868, #333 ); /* Chrome 10+, Saf5.1+ */
	width:300px;  float:right; position:absolute; z-index:9999; right:0%;
	-webkit-border-bottom-right-radius: 12px;
	-webkit-border-bottom-left-radius: 12px;
	-moz-border-radius-bottomright: 12px;
	-moz-border-radius-bottomleft: 12px;
	border-bottom-right-radius: 12px;
	border-bottom-left-radius: 12px;
	opacity:0.95;
	border-top:1px solid #666;
	}
.strockSize{ width:99%; margin:10px 10px 10px 5px;}
.strockSize ul{ margin:0; padding:0;}
.strockSize ul li{ margin:10px; padding:0; list-style:none; float:left; }
.strockSize ul li.selected{ outline:1px dashed #9FF;}
.strockSize ul li.penSize1{  padding:0; width:12px; height:10px; border:1px solid #fff; }
.strockSize ul li.penSize2{ padding:0; width:12px; height:10px; border:2px solid #fff; }
.strockSize ul li.penSize3{ padding:0; width:12px; height:10px; border:3px solid #fff; }
.strockSize ul li.penSize4{  padding:0; width:12px; height:10px; border:4px solid #fff; }
.strockSize ul li.penSize5{  padding:0; width:12px; height:10px; border:5px solid #fff; }
.strockSize ul li.penSize6{  padding:0; width:12px; height:10px; border:6px solid #fff; }
.strockSize ul li.penSize7{  padding:0; width:12px; height:10px; border:7px solid #fff; }

.colorPalate{ clear:both; width:99%; margin:5px 10px 10px 10px; background:#666;}
.colorPalate ul{ margin:0; padding:0;}
.colorPalate li{ margin:5px; padding:0; float:left; list-style:none; width:20px; height:20px; border:#fff;}
.colorPalate ul li.selected{ outline:1px dashed #9FF;}
.colorPalate li.color1{ background:#f82105;}/* red */
.colorPalate li.color2{ background:#f8d305;}/* yellow */
.colorPalate li.color3{ background:#4fdc09;}/* green */
.colorPalate li.color4{ background:#09dcd5;}/* aqua */
.colorPalate li.color5{ background:#0945dc;}/* Blue */
.colorPalate li.color6{ background:#6d09dc;}/* megenta */
.colorPalate li.color7{ background:#d009dc;}/* pink */
.colorPalate li.color8{ background:#000000;}/* black */
.colorPalate li.color9{ background:#ffffff;}/* white */

/*********** albilad login style ********/

/* ipad */

body.albilad_style {
background: white !important;
}

.albilad_style .ui-body-c.ui-page {
background: white !important;
}

.albilad_style .body-login {
background: white !important;
}

.albilad_style .rightsReserved, .albilad_style .rightsReserved * {
color: white !important;
font-size: 11px !important;
padding-bottom: 20px;
}

.albilad_style #MOBILE_LOGO{
 width: 140px;
}

.albilad_style .form * {
box-shadow: none !important;
font-weight: normal !important;
}

.albilad_style .form input{
background: white !important;
border-radius: 0px !important;
margin-bottom: 19px !important;
}

.albilad_style #IPAD_LOGIN_BUTTON span{
padding: 10px !important;
}

.albilad_style #IPAD_LOGIN_BUTTON{
margin: 0 !important;
width: 100% !important;
margin-bottom: 19px !important;
text-transform: uppercase;
}

.albilad_style .form input:focus, .albilad_style .form input:active{
border: 2px solid black !important;
box-shadow: none !important;
}

.albilad_style .form #IPAD_LOGIN_BUTTON:active{
background: #333 !important;
color: white !important;
border: 1px solid #ccc !important;
}

.albilad_style .form #IPAD_LOGIN_BUTTON{
background: black !important;
border-color: black !important;
color: white !important;
border-radius: 0px !important;
font-size: 12px !important;
font-weight: normal !important;
}


.albilad_style .loginContent{
max-width: 377px !important;
margin: 0 auto !important;
}

@media (min-width:768px) {
.albilad_style #COPYRIGHT_LOGO{
filter: invert(0.6) !important;
 }
}

.albilad_style .loginBox{
background: transparent !important;
border-color: transparent !important;
box-shadow: none !important;
}
