/***************************************************
	  portfolio
***************************************************/
.portfolio-item a { margin: 15px 0 15px 0; }

.portfolio-item-meta { background: none repeat scroll 0 0 #EEEEEE; display: block; padding: 4px 10px 12px 10px; font: italic 12px georgia, serif; color: #777777; text-align: center; width: auto\9; height: auto; max-width: 100%; -o-text-overflow: ellipsis; text-overflow:    ellipsis; overflow:hidden; white-space:nowrap; -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; transition:all 0.5s ease; }

.portfolio-item-meta a { font: normal 13px/30px Arial, sans-serif; color: #000; margin:0px 5px 5px 5px; border-bottom: 1px solid rgba(0, 0, 0, 0.07); display: block; text-transform: uppercase; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }

.portfolio-item-meta a:hover { color: #ccc; text-decoration: none; }

.portfolio-post-grid { margin: 0px; }

.portfolio-post-grid li { list-style: none; float: left; margin-bottom: 25px; }

.portfolio-post-grid li:hover { -webkit-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3); box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3); -webkit-transition:all 0.5s ease; -moz-transition:all 0.5s ease; -o-transition:all 0.5s ease; transition:all 0.5s ease; }

.portfolio-post-grid li:hover .portfolio-item-meta { background-color:#fff; }

.port-filters a:hover { color: #2F96B4; text-decoration: none; }

.port-filters li a { color: #222; }

.port-filters { margin: 40px 10px 30px 0; }

.port-filters li { list-style: none; float: left; font-family: Arial, sans-serif; font-size: 13px; padding: 0 10px 0 0; text-transform: uppercase; }

.port-filters .last:after { content: ""; }

.port-filters li:after { content: "\203A"; margin-left: 10px; color: #999; font-size: 18px; }

.portfolio-single-slider { margin: 0 0 0; }

.portfolio-single h2 { margin: 15px 0 18px 0; }

.portfolio .featured-thumbnail { float: left; margin: 0 0 10px 0; overflow: hidden; position: relative; }


/* ===================================== */
/* Grid Style */
/* ===================================== */

.codrops-header h1, .codrops-header-special h1 { font-size: 26px; line-height: 26px; margin: 0; position: relative; font-weight: 700; color: #000; }

.codrops-info { padding: 20px; margin: 0 auto; text-align: center; text-shadow: 0 1px 1px rgba(255, 255, 255, 0.7); line-height: 22px; }

.codrops-header-special { background-color: transparent; position: absolute; top: 5px; left: 0px; text-align: center; width: 100%; }

.codrops-header-special h1 { background: #000; background: rgba(0, 0, 0, 0.8); display: inline-block; font-size: 32px; line-height: 32px; padding: 20px; color: #fff; text-shadow: 0 0 1px #fff; }

.codrops-header-special .codrops-info { color: #fff; background: #000; background: rgba(0, 119, 130, 0.8); text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.5); padding: 5px 20px 5px 10px; line-height: 26px; margin-top: 10px; text-align: left; }

.ri-grid { width: 600px; }

.ri-grid ul li, .ri-grid ul li a { width: 100px; height: 100px; }

.ri-grid ul li a img { width: 100%; }

.ri-grid { margin: 30px auto 30px; position: relative; height: auto; }

.ri-grid ul { list-style: none; display: block; width: 100%; margin: 0; padding: 0; }

.ri-grid ul:before, .ri-grid ul:after { content: ''; display: table; }

.ri-grid ul:after { clear: both; }

.ri-grid ul { zoom: 1; /* For IE 6/7 (trigger hasLayout) */ }

.ri-grid ul li { -webkit-perspective: 400px; -moz-perspective: 400px; -o-perspective: 400px; -ms-perspective: 400px; perspective: 400px; margin: 0; padding: 0; float: left; position: relative; display: block; overflow: hidden; background: #000; }

.ri-grid ul li a { display: block; outline: none; position: absolute; left: 0; top: 0; width: 100%; height: 100%; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -o-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; -o-transform-style: preserve-3d; -ms-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-background-size: 100% 100%; -moz-background-size: 100% 100%; background-size: 100% 100%; background-position: center center; background-repeat: no-repeat; background-color: #333; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; }

.ri-grid-size-3 { width: 100%; padding: 5px 0; margin-top: 0px; }

.ri-loading-image { display: none; }
 @media screen and (max-width: 860px) {
}
 @media (max-width: 767px) {
}

/* This setting hides the lead  and button on an ipad*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
}

/* This setting hides the lead and button on an ipad*/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
}
 @media (max-width: 480px) {
.portfolio-item-meta {
width: 250px;
text-align: center;
margin-left:auto;
margin-right: auto;
}
.portfolio-post-grid {
text-align: center
}
.portfolio {
text-align: center;
}
.port-filters {
display: none;
}
}

/* Android landscape 320 x 240 */
@media (max-width: 320px) {
.portfolio-item-meta {
width: 245px;
text-align: center;
margin-left:auto;
margin-right: auto;
}
.portfolio-post-grid {
text-align: center
}
.portfolio {
text-align: center;
}
}

/* Android portrait 240 x 320 */
@media (max-width: 240px) {
.portfolio-item-meta {
width: 165px;
text-align: center;
margin-left:auto;
margin-right: auto;
}
.portfolio-post-grid {
text-align: center
}
.portfolio {
text-align: center;
}
.port-filters {
display: none;
}
}


/* Android portrait 295 x 515 */
@media (width: 295px) {
.portfolio-item-meta {
width: 220px;
text-align: center;
margin-left:auto;
margin-right: auto;
}
.portfolio-post-grid {
text-align: center
}
.portfolio {
text-align: center;
}
.port-filters {
display: none;
}
}

/* Android landscape 515 x 295 */
@media (width: 515px) {
 .portfolio-item-meta {
width: 250px;
text-align: center;
margin-left:auto;
margin-right: auto;
}
 .portfolio-post-grid {
text-align: center;
}
 .portfolio {
text-align: center;
}
 .port-filters {
display: none;
}
}