/* Smartphones (portrait) ----------- */
@media only screen and (max-width : 320px) {
	.announcemain{
		width:320px;
		margin:0 auto;
		margin-bottom:20px;
	}
	.announcebox{
		width:38%;
		height:200px;
		float:left;
		border:solid 1px;
	}
}



/* iPads (portrait) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
	.announcemain{
		width:768px;
		margin:0 auto;
		margin-bottom:20px;
	}
	.announcebox{
		width:33%;
		height:200px;
		float:left;
		border:solid 1px;
	}

}

/* Desktops and laptops ----------- */
@media only screen  and (min-width : 1224px) {
	.announcemain{
		width:95%;
		height:200px;
		margin:0 auto;
		padding:20px;

		
	}	
	.announcebox{
		width:24%;
		height:50px;
		float:left;
		text-align:center;
		line-height:1;
		
		border:solid 3px;
		border-color:#ffffff;
		padding-top:10px;

		
	}

}

.adinfo {padding:5px !important;}

.card {
        width: 572px;
        height: 374px;
        position: relative;
        display: inline-block;
    }

.card .img-top {
        display: none;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 99;
    }

.card:hover .img-top {
        display: inline;
    }

.covers {
	width:300px;
	margin-right:20px;
	margin-bottom:20px;
	text-align:center;
	float:left;
}

.coversmall {
	width:112px;
	margin-right:20px;
	margin-bottom:20px;
	text-align:center;
	float:left;
}

.advertisers {
  float:left;
  border:solid 1px;
  margin-bottom:10px;
  margin-right:10px;
  opacity:1;
}

.advertisers:hover {
  margin-bottom:10px;
  margin-right:10px;
  opacity:0.3;
  
}