@charset "UTF-8";
/* CSS Document */
@media screen and (min-width:980px){
div.wrap{
	position:relative; /* important(so we can absolutely position the description div */ 
}
div.wrap a:hover{
     background:#FFFFFF;
     opacity: 0.8;
  }
div.description{
	position: absolute; /*absolute position (so we can position it where we want)*/
	bottom: -20px; /* position will be on bottom */
	left: -25px;
	display:none; /* hide it */
	/* styling bellow */
	background-color: #fffaf0;
	font-size: 1em;
	color: #000;
	width: auto;
}
div.content{
	padding:3px 1px 0;
	height: 20px;
}

div.content p{
	float: left;
	padding:0 6px 0 0;
	margin-left: -15px;
	font-size: 0.9em;
}

div.content p.time{
	float: right;
	margin-right:15px;
	font: 0.7em
}
}


@media screen and (min-width:768px) and (max-width: 979px) {
div.wrap{
	position:relative; /* important(so we can absolutely position the description div */ 
}
div.wrap a:hover{
     background:#FFFFFF;
     opacity: 0.9;
  }
div.description{
	position: absolute; /*absolute position (so we can position it where we want)*/
	bottom: -17px; /* position will be on bottom */
	left: -24px;
	display:none; /* hide it */
	/* styling bellow */
	background-color: #fffaf0;
	font-size: 0.8em;
	color: #000;
	width: auto;
}
div.content{
	width:100%;
	padding:3px 1px 0 0;
	height: 30px;
}
div.content p{
	width:100%;
	margin-left: -20px;
	float: left;
	padding:0 0 0 -50px;
	font-size: 1em;
}
div.content p.time{
	float: right;
	margin-right:15px;
	font: 0.7em
}
}


@media screen and (max-width:767px){
div.wrap{
	width: 95%;	
	position:relative; /* important(so we can absolutely position the description div */ 
}
div.wrap img{
	width: 100%;
}
div.description{
	width: 100%;
	position:relative; /*absolute position (so we can position it where we want)*/
	bottom:60px; /* position will be on bottom */
	left:8px;
	height: 53px;
	display:none;/* hide it */
	/* styling bellow */
	background-color:#fffaf0;
	font-size:0.8em;
	color:#000;
}
div.content{
	width: 100%;
	padding-top:0;
}
div.content p{
	padding:5px;
	font-size: 1.1em;
	/*float: left*/
}
div.content p.time{
	float: right;
	margin-right:10px;
	font: 0.7em
}
}


@media screen and (min-width: 568px) and (max-width: 736px) {
	div.wrap{
	width: 95%;
	margin:0 auto 0 25px;	
	position:relative; /* important(so we can absolutely position the description div */ 
}
div.wrap img{
	width: 100%;
}
div.description{
	width: 100%;
	position:relative; /*absolute position (so we can position it where we want)*/
	bottom:90px; /* position will be on bottom */
	left:0px;
	height: 90px;
	display:none;/* hide it */
	/* styling bellow */
	background-color:#fffaf0;
	font-size:1.2em;
	color:#000;
}
div.content{
	width: 100%;
	padding-top:0;
}
div.content p{
	padding:10px;
	font-size: 1.1em;
	/*float: left*/
}
div.content p.time{
	float: right;
	margin-right:10px;
	font: 0.7em
}
}

@media screen and (max-width:480px){
div.wrap{
	width: 94%;
	margin:0 auto 0 0;	
	position:relative; /* important(so we can absolutely position the description div */ 
}
div.wrap img{
	width: 100%;
}
div.description{
	width: 100%;
	position:relative; /*absolute position (so we can position it where we want)*/
	bottom:61px; /* position will be on bottom */
	left:10px;
	height: 60px;
	display:none;/* hide it */
	/* styling bellow */
	background-color:#fffaf0;
	font-size:0.8em;
	color:#000;
}
div.content{
	width: 100%;
	padding-top:0;
}
div.content p{
	padding:5px;
	font-size: 1.1em;
	line-height: 130%
	/*float: left*/
}
div.content p.time{
	float: right;
	margin-right:10px;
	font: 0.7em
}
}

@media screen and (max-width:414px){
div.wrap{
	width: 94%;
	margin:0 auto 0 0;	
	position:relative; /* important(so we can absolutely position the description div */ 
}
div.wrap img{
	width: 100%;
}
div.description{
	width: 100%;
	position:relative; /*absolute position (so we can position it where we want)*/
	bottom:61px; /* position will be on bottom */
	left:10px;
	height: 60px;
	display:none;/* hide it */
	/* styling bellow */
	background-color:#fffaf0;
	font-size:0.8em;
	color:#000;
}
div.content{
	width: 100%;
	padding-top:0;
}
div.content p{
	padding:5px;
	font-size: 1.1em;
	line-height: 130%
	/*float: left*/
}
div.content p.time{
	float: right;
	margin-right:10px;
	font: 0.7em
}
}


@media screen and (max-width:375px){
div.wrap{
	width: 92%;
	margin:0 auto 0 0;	
	position:relative; /* important(so we can absolutely position the description div */ 
}
div.wrap img{
	width: 100%;
}
div.description{
	width: 100%;
	position:relative; /*absolute position (so we can position it where we want)*/
	bottom:60px; /* position will be on bottom */
	left:10px;
	height: 59px;
	display:none;/* hide it */
	/* styling bellow */
	background-color:#fffaf0;
	font-size:0.8em;
	color:#000;
}
div.content{
	width: 100%;
	padding-top:0;
}
div.content p{
	padding:5px;
	font-size: 1.1em;
	line-height: 130%;
	/*float: left*/
}
div.content p.time{
	float: right;
	margin-right:10px;
	font: 0.7em
}		

}