/*
Theme Name: Cool Stuff 2
*/

@import url('reset.css');

html {

}

body {
font-family: arial, verdana, serif;
font-size: 14px;



color: #333;
font-size: 14px;
/*font-family: Verdana, Arial, Helvetica, sans-serif;*/

background:url(images/bg_repeat.gif) repeat-x #eee; 
background-attachment:fixed;



}

a {
	color: #AA453B;
	font-weight: bold;
}

.wrapper {
	width: 1100px;
	margin: 0 auto;
	overflow:auto;
}

.wrapper-restricted-max {
	width: 1100px;
		margin: 0 auto;
	overflow:auto;
}

.show-admin-bar {
	display: none;
}


.shadowed {
box-shadow: 1px 1px 1px #888;
}

.round-top {
        border-top-right-radius: 8px;
    -webkit-border-top-right-radius: 8px;
    -moz-border-top-right-radius: 8px;
    border-top-left-radius: 8px;
    -webkit-border-left-right-radius: 8px;
    -moz-border-top-left-radius: 8px;

}

.round-bottom {
    border-bottom-right-radius: 8px;
    -webkit-border-bottom-right-radius: 8px;
    -moz-border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
    -webkit-border-bottom-right-radius: 8px;
    -moz-border-bottom-left-radius: 8px;
}

#masthead
{
	background-color: #f5f5f5;
	margin-bottom: 10px;
}



.logo {
background: url(images/fg-logo.png) no-repeat;
width: 400px;
height: 100px;
text-indent: -3000em;
display: block;
overflow: hidden;
margin-top: 0px;
margin-bottom: 0px;

background-position: 10px 10px;
}

#top-leaderboard-ad {
	float: left;
	margin-top: -95px;
	margin-left: 366px;

	width:728px;
	height: 90px;

}

.primary-navigation {
	padding: 5px;
/*	background: #007ed2;
background: -moz-linear-gradient(top,  #007ed2 0%, #0070bb 50%, #0070bb 51%, #0070bb 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#007ed2), color-stop(50%,#0070bb), color-stop(51%,#0070bb), color-stop(100%,#7db9e8));
background: -webkit-linear-gradient(top,  #007ed2 0%,#2989d8 50%,#0070bb 51%,#0070bb 100%);
background: -o-linear-gradient(top,  #007ed2 0%,#0070bb 50%,#0070bb 51%,#0070bb 100%);
background: -ms-linear-gradient(top,  #007ed2 0%,#0070bb 50%,#0070bb 51%,#0070bb 100%);
background: linear-gradient(to bottom,  #007ed2 0%,#0070bb 50%,#0070bb 51%,#0070bb 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#007ed2', endColorstr='#0070bb',GradientType=0 );*/

background: url(images/fgnav.png) repeat;


height:20px;
}

.topnav, .footernav									{ padding:0; margin:0 0 0 0px; float:left; }
.topnav li, .footernav li	 								{ float:left; list-style-type:none; margin:0; }
.topnav li a, .topnav li span, .footernav li a, .footernav li span
	 			{ text-decoration:none; background-color:inherit; /*text-shadow: #005ead 1px 1px 1px;*/ text-shadow: rgba(0, 0, 0, 0.3) 1px 1px 2px;
                 color:#fff; padding:0px 15px; font-size:14px; font-weight:bold; display:block; margin:0px 0; }

.topnav .current_page_item,
.topnav a:hover, .footernav	.current_page_item, .footernav	a:hover 						{ -moz-border-radius:3px; -webkit-border-radius:3px; -khtml-border-radius:3px; border-radius:3px; behavior:url(border-radius.htc); background:#692015; }

.copy {
	float: right;
	color:#fff; padding:0px 15px; font-size:14px; font-weight:bold; display:block; margin:0px 10px;
}


/* Contain floats: h5bp.com/q */ 
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

.rightfloat{
	float:right;
}
.leftfloat{
	float:left;
}


/*img {
width: 350px;
height: 300px;
-ms-interpolation-mode: bicubic;
}
*/

#grid-contents {
	margin-right:-10px;
}

.image-thumb-holder {
	overflow: hidden;
	
}


.image-thumb-holder  img {

	width:100%;
}


.social-panel {
	position: absolute;
	left: 5px;
	top: 5px;
	width: 50px;
	height: 185px;
	background-color: #fff;
	opacity:0.2;
filter:alpha(opacity=60); /* For IE8 and earlier */
}


.social-button {
height: 40px;
width: 40px;
margin: 5px;
}


.social-span { 
  position:absolute; 
  width:100%;
  height:100%;
  top:0;
  left: 0;

  /* edit: added z-index */
  z-index: 1;

  /* edit: fixes overlap error in IE7/8, 
     make sure you have an empty gif */
 /* background-image: url('empty.gif');*/
}  

.twitter-button {
background: url(images/twitter.png) repeat;
}

.facebook-button {
background: url(images/facebook.png) repeat;
}
.pinterest-button {
background: url(images/pinterest.png) repeat;
}
.googleplus-button {
background: url(images/google+.png) repeat;
}

.post-grid-item {
	width: 360px;
	float:left;
	overflow: hidden;
	position: relative; 
	margin-right:10px;
}

.post-grid-item h2{
	margin: 5px 5px 5px 5px ;
	font-size: 18px;
	text-shadow: rgba(0, 0, 0, 0.3) 1px 1px 2px;
}

.post-grid-item-format {
box-sizing: content-box;
width: 355px;
height:435px;
margin: 0 0px 0px 0;
background: #fff;
}



.content-border {
	border: 5px solid #ae4941;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	border-radius: 8px;	
/*border: 5px solid #007acc;*/
border: 2px solid #5a7d7f;

box-shadow: 1px 1px 1px #888;

overflow: hidden;
margin-bottom: 10px;


}

.content-post {
	padding: 10px;
	background-color: white;

}

h1, h2, h3, h4 {
	text-shadow: rgba(0, 0, 0, 0.3) 1px 1px 2px;
}

.content-post h1 {
	margin: 0px;
	font-size: 24px;
}

.content-post img {
	padding-right: 10px;
/*	float: left;*/
}


.post-content-image {
	/*width: 75%;*/
	max-width: 366px;
	float: left;
}
.post-content-area {
	width: 728px;

}

.post-content-area p {
	margin-bottom: 10px;
}

.post-content-area img {
	display: block;
	margin: auto;
	padding-bottom: 5px;
}


.entry-content {
	overflow: hidden;
	height: 94px;
	top: 300px;
	position: absolute;

}
.entry-content p {

	overflow: hidden;
	padding: 0 10px 5px  5px;
	line-height: 125%;
	height: 65px;
}

.post-leader-ad {
	width:728px;
	height:90px;
}


.box_header {
	background-color: #85a7a9;
}


.box_header h2 {
	margin: 0px;
	padding: 10px;
	font-size: 16px;
	text-shadow: rgba(0, 0, 0, 0.3) 1px 1px 2px;
	color: #ffffff;
}

.info-post {
font-size: 12px;
margin: 0 0 5px 0;
color: #a8a8a8;
}

.sidebar-contentbox {
	background-color: #ffffff;
	padding: 10px;
}

.sidebar-image-grid img {
	width: 50%;
	float: left;

}
.price-container {
position: absolute;
z-index: 2;
width: 200px;
height: 110px;
top: -4px;
left: -45px;
overflow: hidden;
}

.price {
z-index: 2;
top: 40px;
width: 200px;
padding-top: 2px;
padding-left: 50px;
text-align: left;
color: #ffffff;
background-color: #bf0800;
overflow: hidden;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
}



.more {
	position: absolute;
background-color: #ffffff;
padding: 1px 0px 5px 0px;
top: 378px;
left: 336px;
/*width: 50px;*/
}



.save {
left: 5px;
background: url(images/fggraybg.png) repeat;
color: #a3a3a3;
} 

.button {
		position: absolute;
padding: 5px 0px 5px 0px;
top: 403px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;

width: 130px;
text-align: center;
box-shadow: 1px 1px 1px #888;
	text-shadow: rgba(0, 0, 0, 0.3) 1px 1px 2px;
	font-weight: bold;

}


.findout {
	position: absolute;
	color: #ffffff;
background-color: #bf0800;
background: url(images/fgnav.png) repeat;
padding: 5px 0px 5px 0px;
top: 403px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
left: 224px;
width: 130px;
text-align: center;
box-shadow: 1px 1px 1px #888;
	text-shadow: rgba(0, 0, 0, 0.3) 1px 1px 2px;
	font-weight: bold;
}




.button a,
.findout a {
	color: #ffffff;
	opacity: 0.9;
}

.button a:hover,
.findout a:hover  { opacity: 1.0; }



#content-with-sidebar {
	margin-right: 337px;
/*	370px;*/
}

#content-area-2-col {
	float: left;
	width: 753px;
}

#sidebar {
	float: right;
	/*width: 360px;
	margin-right: -370px;
	*/
	width: 337px;
	margin-right: -336px;
}


#main {
	padding-bottom: 30px;
}

#footerdiv {
   position:fixed;
   width:100%;
   bottom:0px;
   height:32px;
   /*background-color: #eee;*/
   margin-bottom: -25px;

}

#footer-content {
   background: url(images/fgnav.png) repeat;

   height:21px;

   padding:5px 0 5px 0;
   /*margin-top: 2px;*/
   border-top: 1px solid #fff;
}


@media screen and (min-width: 1470px) {
.wrapper {
	width: 1470px;
	}
}

@media screen and (min-width: 1840px) {
.wrapper {
	width: 1840px;
	}
}

@media screen and (min-width: 2210px) {
.wrapper {
	width: 2210px;
	}
}

/*iPad landscape*/
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) { 


.wrapper {
	width: 1470px;
	}
}

/*iPhone portrait*/
@media only screen 
and (min-device-width : 320px) 
/*and (max-device-width : 568px) */
and (max-device-width : 767px) 
and (orientation : portrait) { 

	.wrapper {
	width: 360px;
	}

	.wrapper-restricted-max {
	width: 360px;
	}

	.post-grid-item {
		margin-right: 0px;
	}



	.topnav li a, .topnav li span, .footernav li a, .footernav li span {
		padding: 0 9px;
	}


	#content-area-2-col {
		width: 360px;
	}

	.post-content-area {
		width: 340px;
	}

	.content-post img {
		max-width: 90%;
		height: auto;
	} 

	#sidebar {
		float:none;
	}

	.post-leader-ad {
		width:234px;
		height:60px;
	}
 	
 	#top-leaderboard-ad {
		width:0px;
		height: 0px;
	}

}

/*iPhone landscape*/
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px) 
and (orientation : landscape) { 
	.wrapper {
	width: 730px;
	}
	.post-grid-item {
		/*margin-right: 0px;*/
	}

		#content-area-2-col {
		width: 730px;
	}

	.post-content-area {
		width: 710px;
	}

		#sidebar {
		float:none;
	}

	 	#top-leaderboard-ad {
		width:0px;
		height: 0px;
	}

		.post-leader-ad {
		width:234px;
		height:60px;
	}
}


#nav-below {
	display: none;
}
/*
Default style for WP-PageNavi plugin

http://wordpress.org/extend/plugins/wp-pagenavi/
*/

.wp-pagenavi {
	clear: both;
}

.wp-pagenavi a, .wp-pagenavi span {
	text-decoration: none;
	border: 1px solid #BFBFBF;
	padding: 3px 5px;
	margin: 2px;
	background: url(images/fggraybg.png) repeat;
	color: #fff;
	text-shadow: rgba(0, 0, 0, 0.3) 1px 1px 2px;

	-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
text-align: center;
box-shadow: 1px 1px 1px #888;

	opacity: 0.8;
}

.wp-pagenavi a {

	font-weight: bold;
}

.wp-pagenavi a:hover, .wp-pagenavi span.current {
	font-weight: bolder;
		opacity: 1;
}

.entry-title a {
	color: black;
}

.entry-title a:hover {
	color: black;
}




 
