/*
-----------------------------------------
Google Fonts Style
-----------------------------------------
*/
@import url(http://fonts.googleapis.com/css?family=Quattrocento+Sans:400,400italic,700,700italic|Maven+Pro:400,700,500,900);
*{
	outline: 1px solid transparent;
	font-family:"Quattrocento Sans", 'Maven Pro', arial, sans-serif;
}

/*
-----------------------------------------
Bootstrap Overwriting Style
-----------------------------------------
*/
.container{
	width: auto !important;
	padding: 0 20px;
}

/*
-----------------------------------------
Header Style
-----------------------------------------
*/
header{
	padding-top: 15px;
}
header .logo{
	float: left;
	width: 146px;
	height: 33px;
	background: url(../images/logo.png) left top no-repeat;
}
header .caption{
	margin: 0;
	float: left;
	color: #303030;
	font-size: 14px;
	line-height: 16px;
	padding-top: 17px;
	padding-left: 30px;
}
header .switcher{
	float: right;
	z-index: 1001;
	margin-left: 10px;
	position: relative;
}
header .switcher button{
	border: 2px solid #4c4b4b;
	background-color: #303030;
}
header .switcher button .caret{
	color: #FFF;
}
header .navbar{
	clear: both;
	margin: 0px;
	border: none;
	background: none;
	padding-top: 15px;
}
header .navbar .container{
	padding: 0;
	background-color: #303030;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
header .navbar .navbar-header{
	float: left;
	margin: 8px 10px;
}
header .navbar .navbar-header .navbar-toggle{
	margin: 0;
	border: 1px solid #FFF;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
header .navbar .social a{
	float: left;
	width: 30px;
	height: 30px;
	color: #FFFFFF;
	font-size: 18px;
	line-height: 35px;
	margin-right: 5px;
	text-align: center;
	background-color: #4c4b4b;

	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
}
header .navbar .social a:hover{
	background-color: #000000;
}
header .navbar .social a i{
	color: inherit;
	font-size: inherit;
}
header .navbar .navbar-collapse{
	float: left;
}
header .navbar .navbar-collapse .nav li{
	float: left;
}
header .navbar .navbar-collapse .nav li a{
	height: 50px;
	color: #797979;
	display: block;
	padding: 0 20px;
	font-size: 16px;
	line-height: 50px;
	font-weight: bold;
	border-left: 1px solid #797979;
}
header .navbar .navbar-collapse .nav li:first-child a{
	border: none;
	-webkit-border-radius: 5px 0 0 5px;
	-moz-border-radius: 5px 0 0 5px;
	border-radius: 5px 0 0 5px;
}
header .navbar .navbar-collapse .nav li a:hover,
header .navbar .navbar-collapse .nav li.actif a{
	color: #fff;
	background-color: #000;
}
header .navbar .social{
	float: right;
	padding: 10px 20px 10px 0;
}
@media screen and (max-width: 767px){	
	header .caption{
		margin: 0;
		padding: 0;
		clear: both;
		width: 100%;
		display: block;
		text-align: center;
		padding-top: 14px;
	}
	header .navbar .navbar-collapse{
		margin: 0;
		padding: 0;
		clear: both;
		float: none;
	}
	header .navbar .navbar-collapse .nav{
		margin: 0;
	}
	header .navbar .navbar-collapse .nav li{
		float: none;
	}
	header .navbar .navbar-collapse .nav li a{
		padding: 0 20px;
		border: none;

		-webkit-border-radius: 0;
		-moz-border-radius: 0;
		border-radius: 0;
	}
}

/*
-----------------------------------------
Featured Articles Style
-----------------------------------------
*/
#featured-articles{
	padding-bottom: 30px;
}
#featured-articles .carousel-inner{
	border: 10px solid #191919;
}
#featured-articles .item{
	overflow: hidden;
	max-height: 400px;
}
#featured-articles .item .carousel-topic{
	top: 10px;
	right: 0px;
	color: #FFF;
	height: 40px;
	padding: 0 40px;
	font-size: 18px;
	line-height: 40px;
	font-weight: bold;
	position: absolute;
	text-transform: uppercase;
	background-color: #097eff;
}
#featured-articles .item .carousel-caption{
	left: 0;
	bottom: 0;
	color: #FFF;
	width: 100%;
	padding: 10px;
	font-size: 30px;
	font-weight: bold;
	position: absolute;
	background-color: rgba(0,0,0,.6);
}
#featured-articles .carousel-indicators{
	left: 0px;
	bottom: 0px;
	margin: 0px;
	width: auto;
	text-align: left;
}
#featured-articles .carousel-indicators li{
	margin: 0;
	width: 20px;
	height: 20px;
	background-color: #818181;
}
#featured-articles .carousel-indicators li:hover,
#featured-articles .carousel-indicators li.active{
	background-color: #303030;
}

/*
-----------------------------------------
Main Section Style
-----------------------------------------
*/
#main{
	padding-top: 10px;
}
#main .content-wrapper{
	clear: both;
	overflow: hidden;
	margin-top: 20px;
}
#main .content-wrapper .title{
	height: 45px;
	color: #303030;
	padding: 0 15px;
	font-size: 18px;
	overflow: hidden;
	font-weight: bold;
	line-height: 50px;
	background-color: #f4f2f2;
	font-family: 'Quattrocento Sans';
	border-bottom: 1px solid #959393;
	-webkit-border-radius: 5px 5px 0 0;
	-moz-border-radius: 5px 5px 0 0;
	border-radius: 5px 5px 0 0;
}
#main .content-wrapper .title span{
	float: left;
	height: 45px;
	color: inherit;
	padding: 0 15px;
	line-height: 45px;
	font-size: inherit;
	margin-left: -15px;
	padding-right: 15px;
	border-bottom: 8px solid #000;
}
#main .content-wrapper .title i{
	color: inherit;
	font-size: inherit;
	padding-right: 10px;
}
#main .content-wrapper .main{
	padding: 10px 20px;
	background-color: #f4f2f2;
}
#main .content-wrapper > .action-link{
	color: #FFF;
	display: block;
	font-size: 12px;
	line-height: 30px;
	text-align: center;
	background-color: #303030;

	-webkit-border-radius: 0 0 5px 5px;
	-moz-border-radius: 0 0 5px 5px;
	border-radius: 0 0 5px 5px;
}

/*
-----------------------------------------
Video Gallery Style
-----------------------------------------
*/
#main .video-gallery{
	margin-bottom: 0;
}
#main .video-gallery .video{
	padding: 0;
	margin: 5px 0;
	cursor: pointer;
	overflow: hidden;
	position: relative;
	border: 5px solid #191919;
}
#main .video-gallery .col-lg-12 .video{
	max-height: 245px;
	border-width: 8px;
}
#main .video-gallery .col-lg-6 .video{
	max-height: 137px;
}
#main .video-gallery .video .fa-play{
	top: 50%;
	left: 50%;
	width: 60px;
	height: 60px;
	color: #FFFFFF;
	font-size: 20px;
	line-height: 60px;
	margin-top: -30px;
	margin-left: -30px;
	position: absolute;
	text-align: center;
	background-color: rgba(0,0,0,.7);

	-webkit-border-radius: 100px;
	-moz-border-radius: 100px;
	border-radius: 100px;
}
#main .video-gallery .video .caption{
	left: 0;
	bottom: 0;
	margin: 0;
	width: 100%;
	color: #FFF;
	display: none;
	font-size: 14px;
	font-weight: bold;
	padding: 10px 15px;
	position: absolute;
	background-color: rgba(0,0,0,.6);
	z-index: 1;/**kaled*/
}
#main .video-gallery .video:hover .caption{
	display: block;
}

/*
-----------------------------------------
Tag Cloud Style
-----------------------------------------
*/
#main .tag-cloud{
	overflow: hidden;
	padding-bottom: 10px;
}
#main .tag-cloud a{
	color: #2e5bcc;
	font-size: 18px;
	margin: 0 15px 10px 0;
	display: inline-block;
}

/*
-----------------------------------------
Article Style
-----------------------------------------
*/
#main article{
	overflow: hidden;
	padding-top: 20px;
	padding: 0px !important;
	background-color: #f4f2f2;
}
#main article .cover{
	overflow: hidden;
	/*border: 1px solid #8b8a8a;*/
	margin: 20px 20px 0 !important;
}
#main article.minimal .cover{
	float: left;
	width: 120px;
	max-height: 90px;
	height: 100%;
}
#main article header{
	padding: 0px;
	overflow: hidden;
	margin: 20px 20px 0px !important;
}
#main article header h1{
	margin: 0;
	padding: 0;
	color: #303030;
	font-size: 18px;
	font-weight: bold;
}
#main article.minimal header h1{
	font-size: 16px;
	font-weight: normal;
}
#main article header p{
	color: #8d8d8d;
	padding-top: 5px;
}
#main article header p i{
	color: inherit;
	padding-left: 10px;
}
#main article header p i:first-child{
	padding: 0;
}
#main article > p{
	margin: 0px;
	color: #696868;
	font-size: 1.2em;
	padding: 0px 20px 10px;
}
#main article.minimal > p{
	font-size: 1.2em;
	line-height: 14px;
	margin-left: 140px;
}
#main article footer{
	clear: both;
	overflow: hidden;
	border-bottom: 5px solid #000;
}
#main article footer .action-link{
	float: right;
	height: 22px;
	padding: 0 15px;
	color: #FFFFFF;
	font-size: 12px;
	line-height: 30px;
	background-color: #000;
}
#main article.minimal footer .action-link{
	height: 18px;
	font-size: 10px;
	line-height: 24px;
}

/*
-----------------------------------------
Categories Colors Style
-----------------------------------------
*/
.red article footer,
.red.content-wrapper .title,
.red.content-wrapper .title span{
	border-color: #ec1212 !important;
}
.red article footer .action-link{
	background-color: #ec1212 !important;
}
.blue article footer,
.blue.content-wrapper .title,
.blue.content-wrapper .title span{
	border-color: #097eff !important;
}
.blue article footer .action-link{
	background-color: #097eff !important;
}
.green article footer,
.green.content-wrapper .title,
.green.content-wrapper .title span{
	border-color: #27a01e !important;
}
.green article footer .action-link{
	background-color: #27a01e !important;
}
.yellow article footer,
.yellow.content-wrapper .title,
.yellow.content-wrapper .title span{
	border-color: #ffa509 !important;
}
.yellow article footer .action-link{
	background-color: #ffa509 !important;
}
.purple article footer,
.purple.content-wrapper .title,
.purple.content-wrapper .title span{
	border-color: #a01e95 !important;
}
.purple article footer .action-link{
	background-color: #a01e95 !important;
}

/*
-----------------------------------------
Footer Style
-----------------------------------------
*/
body > footer{
	color:#FFFFFF;
	padding:10px 0;
	font-size: 12px;
	margin-top: 15px;
	background-color: #303030;
	font-family:"Quattrocento Sans";
}
body > footer .copyright{
	margin: 0;
	float:left;
	color:#999999;
	display: block;
}
body > footer .pull-right{
	margin-top: -7px;
	margin-right: 15px;
}
body > footer .pull-right{
	margin: 0;
	overflow: hidden;
}
body > footer .pull-right li{
	height: 14px;
	padding:0px 10px;
	display: inline-block;
	border-left: 1px solid #999999;
}
body > footer .pull-right li:first-child{
	border: none;
}
body > footer .pull-right li a{
	color:#999999;
	line-height: 16px;
	text-transform: uppercase;
}
body > footer .pull-right li a:hover{
	color:white;
	text-decoration: none;
}

/*
-----------------------------------------
Forcing Style
-----------------------------------------
*/
*.noTxt{
	display:block;
	overflow:hidden;
	line-height:0;
	font-size:0;
	text-align:left;
	text-indent:-9999px;
}
.hidden{
	display:none;
}


/********by khaled */
/*sport*/
.category-2{

	background-color: #097eff !important;
}
/*politics*/
.category-3{

	background-color: #ec1212 !important;
}
/*tech*/
.category-4{

	background-color: #ffa509 !important;
}
/*art*/
.category-5{

	background-color: #a01e95 !important;
}
/*economy*/
.category-6{

	background-color: #27a01e !important;
}

article.minimal{

	height: 160px;
}

.article-title{
	height: 36px;
	overflow: hidden;
	display: block;
	color: #303030;
	font-size: 1.7em;
	font-weight: bold;
}

.article-title-small{

	height: 36px;
	overflow: hidden;
	display: block;
	color: #303030;
	font-size: 1.7em;
	font-weight: normal;
}

.source-title{

	color: #8d8d8d;
}

article .article-body{

	height: 52px;
	/*overflow: hidden;*/
	display: block;
}

