@charset "utf-8";
/* CSS Document */
@import url(https://fonts.googleapis.com/css?family=PT+Serif:400,700);
@import url(https://fonts.googleapis.com/css?family=Oswald);

body {font-family: 'PT Serif', serif; margin: 0 auto; top: 0;}

header {  
  margin: 0;
  width: 100%;
    background-color: #fff;
	border-bottom: 1px solid #f0f0f0; border-top: 1px solid #ccc;
}
#mainheadcontainer { width: 100% !important; display: inline-block; margin: 0; padding: 0; left:0; right: 0;background-color: #f6f6f6;}

#headcontainer { max-width: 1250px; margin: 0 auto; left:0; right:0; padding:0;}
.sponsored {width: 36%; margin-right: 10px; float: left; padding: 5px; height: 95px; font-size: 11px; color: #999; text-align: right; vertical-align: top;}
.sponsored img { float: left; margin-right: 10px; width: 30%;}
.sponsored a { width: 60%; font-size: 22px; float: left; text-decoration: none; color: #333; display:inline-block; text-align: left;}
.add { width: 60% !important; float: right; padding: .5% 0; right: 0; text-align: right; height: 100px;}
.advt { width: 750px; height: 90px;}
.logo { padding: 9px 5px 5px 5px; padding-right: 10px; float:left;}
.webindialogo { width: 173px;}
.date { width: 25%; float: left; padding: 0px 2px 5px 2px; font-size: 14px; margin:0;}
.news { width: 72%; float: right; margin: 0px 0; background:#f7f7f7; height: 20px; padding: 5px 10px;}
.span_search { float: right; padding: 10px 0; right: 0; top: 0;  }
.social {}
.span_10 { padding: 5px; float: left;}
.section { width: 24% ; float: left; padding: 1% 1% 1% 0;}
.googleadd { float: right; padding: 5px 0 5px 1%;}
.sectionname { font-size: 36px; padding: 5px 0px; margin-top: 30px;font-family: 'PT Serif', serif;}
.advertise { text-transform:uppercase; font-size: 13px; display: inline-block; margin-top: 3px;  }
.advertise a { text-decoration: none; color: #000 !important;}
.clearfix { width: 100%; height: 0px; clear:both;}


/*-----------navigation bar-----------------*/

#mainmenu { display: block;}
#mainmenu a {color: #000;
text-transform: uppercase;
text-decoration: none;
font-family: 'PT Serif', serif;}

#mainmenu li { 
margin: 0px;
float: left;
border-right: 1px solid #EAEAEA;
border-left: 1px solid #ffffff;
padding: 2px 22px;
list-style: none;
border-top: 2px solid #fff;
 }
#mainmenu li a {font-size: 14px;
font-weight: 500;
letter-spacing: 0.5px;
line-height: 36px;}
#mainmenu li:hover {border-top: 2px solid #000;}

.moreitem a {font-family: 'PT Serif'; color: #000; font-size: 14px; padding: 2px 20px;
font-weight: 500;
letter-spacing: 0.5px;
text-transform: uppercase;
text-decoration: none;
display: inline-block;
line-height: 37px;
clear: both;
cursor: pointer;}

.moreitem a:hover {font-family: 'PT Serif';  line-height: 37px; color: #000; font-size: 14px; padding: 2px 20px;
font-weight: 500;
letter-spacing: 0.5px;
text-transform: uppercase;
text-decoration: none;}

#showmore li { float: left; list-style: none; text-align: left; padding: 0; width: 20%; display: block;}

#showmore li a{ text-decoration: none; line-height: 37px; font-family: 'PT Serif';}

#showmore li a:hover { text-decoration: none;}

#showmore {
display:none;
padding-left:20%;
width: 80%;
background: #fff !important;
border-top: 1px solid #f0f0f0;

}

.menuleft { display: none; background: #fff;}
.combottom { width: 100%; background: #26292B; font-family: 'PT Serif'; color: #fff; display: inline-block; padding: 20px 0; font-size: 14px; line-height: 25px; margin-top: 10px; text-transform: none;}
.btm50 {width: 45%; float: left; padding: 10px 30px;}
.btm30 { width: 40%; float: left;}
.btm30 a{ color: #fff; text-decoration: none; font-size: 14px; font-family: 'PT Serif';}
.btm50heading {color: #f0f0f0; font-size: 18px; margin: 10px 0; font-family: 'PT Serif'; text-decoration: none; text-transform: none;}


a.bottom_link:link  {color: #fff;  font-family: 'PT Serif'; font-size: 14px; text-decoration: none; text-transform:none; }
a.bottom_link:hover {color: #fff; font-family: 'PT Serif'; font-size: 14px; text-transform:none; text-decoration:underline; }
a.bottom_link:visited {color: #fff; font-family: 'PT Serif'; font-size: 14px; text-decoration: none; text-transform:none; }



#footer { background: #666; font-family: 'PT Serif'; color: #f0f0f0; font-size: 14px; padding: 20px 0 10px 0; height: 40px; width: 100%; bottom:0; text-align: center; display: inline-block; margin: 0;}
#footer img { float: right; padding-right:65px;}
.toTop
{
    position:fixed;
    right:20px;
    bottom:40px;
    display:none;
}
/**------------ search input------------ **/
#searchform {
  display: block;
}

.fieldcontainer {
	width: 99%;
	vertical-align: top;
	white-space: nowrap;
	position: relative;
	float: right;

}

.searchfield {
  display: block;
  width: 100px;
  padding-left: 10px;
  height: 25px;
  background-color: #f0f0f0;
  font-size: 12px;
  color: #000;
  float: right;
	  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  transition: all 0.5s ease;
	  border: 0px solid #C00; 
}

.searchfield:focus {
  width: 100%;
  color: #333;
  	  border: 0px solid #C00; 
}

#searchbtn {
  position: absolute;
  height: 25px;
  right: 0;
  width: 32px;
  cursor: pointer;
  border: 0;
	background-image:url(../images/search-icon.png);
	background-position: center;
	background-repeat:no-repeat;
  -webkit-transition: all 0.4s linear;
  -moz-transition: all 0.4s linear;
  transition: all 0.4s linear;
  	background-color: #000;
}
#searchbtn:hover, #searchbtn:focus, #search2btn:hover, #search2btn:focus {
	background-color: #cc0000;
}
.searchfield:focus + #searchbtn {
  right: 1px; /* adjust btn position as the field expands */
}
.toTop
{
    position:fixed;
    right:20px;
    bottom:20px;
    display:none;
}
/*---------------------------------------------------------------------*/
@media (max-width : 320px) {
	.searchfield { width: 80px;}
.logo img { height: 15px; width: 120px;}
	.n1, .n2, .n3, .n4, .n5, .n6, .n7, .n8 { display: none;}
	.menuleft {display: block;}
	#showmore { padding-left: 0; width: 100%;  margin-top: 20px;  } 
	.sponsored {width: auto; height:auto; margin: 0 auto;}
	.sponsored img { float: left; margin-right: 10px; width: 35%; height: auto;}
	.sponsored a { font-size: 14px; float: left; padding-top: 10px; }
	#showmore li { width: 50%;}
	.section { width: 99% !important; background:#f7f7f7; padding: 0;}
	.add { display: none;}		
	.date { display: none;}
	.news {display:none}
	.social { width: 45%; float: right; padding: 5px 5px;}
	.sectionname { font-size: 20px; padding: 5px 5px; margin: 0;}
	#headcontainer { width: auto; margin: 0 auto; left:0; right:0;}

		
}
@media (min-width : 321px) and (max-width : 480px) {
		.searchfield { width: 80px}
		.logo img { height: 18px; width: 140px;}
	.searchfield:focus { width: 100px;}
	.n1, .n2, .n3, .n4, .n5, .n6, .n7, .n8 { display: none;}
	.menuleft {display: block;}
	#showmore { padding-left: 0; width: 100%; margin-top: 10px; } 
	#showmore li { width: 50%;}
	.sponsored {width: auto; height:auto; margin: 0 auto;}
	.sponsored img { float: left; margin-right: 10px; width: 35%; height: auto;}
	.sponsored a { font-size: 16px; float: left; padding-top: 10px; }
	.section { width: 99% !important; background:#f7f7f7; padding: 0;}
	.add { display: none;}		
	.date { display: none;}
	.news {display:none}
	.social { width: 45%; float: right; padding: 5px 5px;}
	.sectionname { font-size: 22px; padding: 5px 5px; margin: 0;}
	#headcontainer { width: auto; margin: 0 auto; left:0; right:0;}

}

@media (min-width : 481px) and (max-width : 690px) {
	
	.n2, .n3, .n4, .n5, .n6, .n7, .n8 { display: none;}
	.menuleft {display: block;}
	.menuleft .m1{display: none;}
	#showmore { padding-left: 0; width: 100%; margin-top: 10px;  }
    #showmore li { width: 33.33%;}
	.sponsored {width: auto; height:auto; margin: 0 auto;}
	.sponsored img { float: left; margin-right: 10px; width: 30%; height: auto;}
	.sponsored a { font-size: 20px; float: left; padding-top: 10px; }
	.section { width: 99% !important; background:#f7f7f7; padding: 0;}
	.add { display: none;}		
	.date { display: none;}
	.news {display:none}
	.social { width: 45%; float: right; padding: 5px 5px;}
	.sectionname { font-size: 24px; padding: 5px 5px; margin: 0;}
	#headcontainer { width: auto; margin: 0 auto; left:0; right:0;}
	
}

@media (min-width : 691px) and (max-width : 768px) {
	
	.n4, .n5, .n6, .n7, .n8 { display: none;}
	.menuleft {display: block;}
	.menuleft .m1, .menuleft .m2, .menuleft .m3{display: none;}
	.section { width: 100% !important; background:#f7f7f7; padding: 0;}
	.sponsored {width: 98%; height:auto; margin: 0 auto;}
	.sponsored img { float: left; margin-right: 10px; width: 15%; height: auto;}
	.sponsored a { font-size: 20px; float: left; padding-top: 10px; width: auto; }
	#showmore { padding-left: 0; width: 99%; margin-top: 10px;  }
	.add { display: none;}		
	.date { display: none;}
	.news {display:none}
	.social { width: 45%; float: right; padding: 5px 5px;}
	.sectionname { font-size: 24px; padding: 5px 5px; margin: 0;}
    #showmore li { width: 25%;}		
#headcontainer { width: auto; margin: 0 auto; left:0; right:0;}

}
@media (min-width : 769px) and (max-width : 1024px) {	
	
	.n4, .n5, .n6, .n7, .n8 { display: none;}
	.menuleft {display: block;}
	.menuleft .m1, .menuleft .m2, .menuleft .m3{display: none;}
	.section { width: 100% !important; background:#f7f7f7; padding: 0;}
	.sponsored {width: 98%; height:auto; margin: 0 auto;}
	.sponsored img { float: left; margin-right: 10px; width: 15%; height: auto;}
	.sponsored a { font-size: 20px; float: left; padding-top: 10px; width: auto; }
	#showmore { padding-left: 0; width: 100%;  margin-top: 10px;  }
	.add { display: none;}		
	.date {display: none;}
	.news {width:auto; float: left;}
	.social { width: 45%; float: right; padding: 5px 5px;}
	.sectionname { font-size: 24px; padding: 5px 5px; margin: 0;}
    #showmore li { width: 25%;}		
	#headcontainer { width: auto; margin: 0 auto; left:0; right:0;}

}
@media (min-width : 1025px) and (max-width : 1250px) {

	 .n6, .n7, .n8 { display: none;}
	.menuleft {display: block;}
	.menuleft .m1, .menuleft .m2, .menuleft .m3, .menuleft .m4, menuleft .m5{display: none;}
	.section { width: 25%; float: left; padding: 1% 5px;}
	.sponsored {width: 24%; height:auto; margin: .5% 0;}
	.sponsored img { float: left; margin-right: 10px; width: 20%; height: auto;}
	.sponsored a { font-size: 16px; float: left; padding-top: 10px; width: auto; }
	.add { width: 74% !important; float: right; padding: .5% 0; right: 0; text-align: right; height: 100px;}
	#showmore { padding-left: 0; width: 100%;  margin-top: 10px;  }
    #showmore li { width: 25%;}	
	#headcontainer { width: auto; margin: 0 auto; left:0; right:0;}
	.googleadd { float: right; padding: 5px; 0;}

}
@media screen and (max-width : 639px){
	.btm50 {width: 95%; float: left; padding: 10px 0; padding-left: 10px;}
	.btm30 { width: 50%; float: left;}
	#footer { height: auto; font-size: 14px; padding: 10px 0; width: 100%; text-align: center;}
	#footer img {padding-right:65px;}
	.sponsored {width: 96%; margin-right: 10px; float: left; padding: 5px; border: 1px solid #f0f0f0; height: 95px; font-size: 11px; color: #999; text-align: right; vertical-align: top; background: #fff;}
}
@media (min-width : 640px) and (max-width : 1250px) {
	.btm50 {width: 95%; float: left; padding: 10px 0; padding-left: 10px;}
	.btm30 { width: 50%; float: left;}	
}