/* == LETS MODIFY SOME COLORS AND STYLE FOR THE DEMO == */

		/* hide no more entries button */
		.media-boxes-no-more-entries{
			display: none;
		}

		/* make your own style of the filter */
		.filters-container{
			margin-bottom: 20px;
		}

		/* Change the color red to something blue */
		.custom-filter>li a.selected {
			background: #9bd7d5 !important;
		}

		/* Center the filters */
		.custom-filter {
			text-align: center;
			float: none;
		}

		/* change style of filter menu */
		.custom-filter>li {
			margin: 0;
		}
		.custom-filter>li:last-child a{
			border-right: 1px solid #EBEBEB;
			border-radius: 0 4px 4px 0;
		}
		.custom-filter>li:first-child a{
			border-radius: 4px 0 0 4px;
		}
		.custom-filter>li a {
			float: left;
			border: 1px solid #EBEBEB;
			display: block;
			cursor: pointer;
			color: #676767;
			font-size: 12px;
			text-decoration: none;
			margin: 0 0px 0px 0;
			padding: 11px 14px;
			background-color: white;
			-webkit-border-radius: 1px;
			-moz-border-radius: 1px;
			border-radius: 1px;
			-webkit-transition: background-color .1s;
			-moz-transition: background-color .1s;
			-o-transition: background-color .1s;
			-ms-transition: background-color .1s;
			transition: background-color .1s;

			border-bottom: 1px solid #EBEBEB;
			  border-left: 1px solid #EBEBEB;
			   border-top: 1px solid #EBEBEB;
			 border-right: 1px solid #EBEBEB;

			-webkit-box-shadow: none;
			   -moz-box-shadow: none;
		  	     -o-box-shadow: none;
		        -ms-box-shadow: none;
		  		    box-shadow: none;
		}
		.custom-filter>li a.selected {
		    -webkit-box-shadow: none !important;
		       -moz-box-shadow: none !important;
		        -ms-box-shadow: none !important;
		            box-shadow: none !important;
		}
		.custom-filter>li a:hover{
		    background: #fff;
		    color: #676767;
		}

		/* Set the style of the thumbnail overlay items */
		.media-box-title{
			color: #fff;
			font-size: 11px;
			margin-bottom: 5px;
			text-transform: uppercase;
		    letter-spacing: 2px;
		    line-height: 28px;
		}
		.media-box-date{
			color: #F2F2F2;
			font-size: 10px;
		}

		/* Remove box shadow and border-radius from the media boxes */
		.media-box-container{
			  -webkit-border-radius: 0px;
			  	 -moz-border-radius: 0px;
			  		  border-radius: 0px;

			  -webkit-box-shadow: none;
			  	 -moz-box-shadow: none;
			  	   -o-box-shadow: none;
			      -ms-box-shadow: none;
			  		  box-shadow: none;
		}

		/* thumbnail overlay background */
		.thumbnail-overlay{
    		background-color: rgba(0,0,0, .40);

    		-webkit-transition: all 0.2s ease-out;
		       -moz-transition: all 0.2s ease-out;
		         -o-transition: all 0.2s ease-out;
		            transition: all 0.2s ease-out;
		}

		/* thumbnail overlay background (in the first grid change the initial background) */
		#grid .thumbnail-overlay{
    		background-color: rgba(0,0,0, 0);
		}

		/* 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);
		}

		/* Change alignment in grid 2 */
		#grid2 .thumbnail-overlay>div.aligment>div.aligment{
			vertical-align: bottom;
			padding-bottom: 40px;
		}

		.thumbnail-overlay .media-box-title{
			font-size: 16px;
		}

		.thumbnail-overlay .media-box-date{
			font-style: italic;
			font-size: 12px;
		}

		/* re-vertical-align play button */
		.media-box-play-button, .media-box-sound-button {
			verticle-align: middle !important;
		}