@charset "UTF-8";
/* CSS Document */
.box-shadow {
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2);
}
.box-mid-shadow {
    box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.3);
}
.box-big-shadow {
    box-shadow: 3px 3px 3px 0 rgba(0, 0, 0, 0.35);
}
.box-extra-big-shadow {
    box-shadow: 6px 6px 16px 8px rgba(0, 0, 0, 0.35);
}
.gradient-overlay {
	background-image: -webkit-linear-gradient(270deg,rgba(0,0,0,0.00) 0%,rgba(0,0,0,0.33) 100%);
	background-image: -moz-linear-gradient(270deg,rgba(0,0,0,0.00) 0%,rgba(0,0,0,0.33) 100%);
	background-image: -o-linear-gradient(270deg,rgba(0,0,0,0.00) 0%,rgba(0,0,0,0.33) 100%);
	background-image: linear-gradient(180deg,rgba(0,0,0,0.00) 0%,rgba(0,0,0,0.33) 100%);
}
.panel-actions {
    position: absolute;
    right: 15px;
    top: 15px;
}
.panel-title {
	font-size: 20px;
	font-weight: 400;
	margin-left: 20px;
	text-shadow: 1px 1px 2px rgba(0,0,0,0.50);
}
.list li {
    margin-bottom: 0px;
}
.panel-heading {
    padding: 10px 15px;
}
/* hover effect on the thumbnail-overlay */
		.thumbnail-overlay:hover{
    		background-color: rgba(0,0,0, .20) !important;
		}
		
		/* hover effect on the image */
		.media-box-image img{
		    -webkit-transition: all 0.6s ease-in-out;
		       -moz-transition: all 0.6s ease-in-out;
		         -o-transition: all 0.6s ease-in-out;
		        -ms-transition: all 0.6s ease-in-out;
		            transition: all 0.6s ease-in-out;

		    -webkit-transform-origin: bottom left;
		       -moz-transform-origin: bottom left;
		         -o-transform-origin: bottom left;
		        -ms-transform-origin: bottom left;
		            transform-origin: bottom left;
		}
		.media-box-image:hover img{
		    -webkit-transform: scale(1.2) translate(-20px);
		       -moz-transform: scale(1.2) translate(-20px);
		         -o-transform: scale(1.2) translate(-20px);
		        -ms-transform: scale(1.2) translate(-20px);
		            transform: scale(1.2) translate(-20px);
		}

@media only screen and (min-width: 768px) and (max-width: 1024px) {
.page-header h1 { font-size: 22px; }	
}
@media only screen and (min-width: 480px) and (max-width: 768px) {
.page-header h1 { font-size: 18px; }	
}
@media only screen and (min-width: 320px) and (max-width: 480px) {
.page-header h1 { font-size: 16px; }	
}
@media only screen and (max-width: 320px) {
.page-header h1 { font-size: 14px; }	
}