/************************************************/
/*                     BLOG                     */
/************************************************/
.clear { clear: both; }
.clearfix:after { content: "."; display:block; height:0; clear:both; visibility:hidden; }
.clearfix { display:inline-block;}
* html .clearfix { height:1%; }
.clearfix { display:block; }

.col1-3 { width: 399px;min-height:200px;padding: 15px;float: left;}
.col2-3 { width: 798px;min-height:200px;padding:15px;float:left;}
.col2-3.post, .col2-3.auto, .col1-3.auto, .col1-1.auto {height:auto;}

.white-bottom {background:#fff;position:relative;height:246px;padding:30px;
    -webkit-border-radius:0 0 4px 4px;
    -moz-border-radius:0 0 4px 4px;
    border-radius:0 0 4px 4px;
}
.white-bottom h2 {font-size: 18px;font-weight: 700;color: #222;margin-bottom: 5px;padding-bottom: 20px;padding-top: 5px;text-transform: uppercase;letter-spacing: 1px;border-bottom: 1px solid #c1c1c1;display: block;position:relative;z-index:600;}
.white-bottom h3 {font-family: 'Open Sans', sans-serif;font-size: 15px;line-height:1.6;font-weight: 700;color: #222;margin:0;padding:30px 20px;display: block;}

.blog-summary,.blog-description {margin-top:20px;line-height: 1.5;font-style: italic;color:#8d8d8d;}
.isotope-item:hover .blog-summary,.blog-description,.blog-description * {color:#555;}
.element-item {position:relative;}

.post .white-bottom {height:auto; padding-bottom:40px; }
.bottom {position:absolute; bottom:0px; padding-bottom:36px; }
.break { height:20px; position:relative; }
.images { display:block; position:relative;}
.images img {display:block;}
.blog-date-container {position: absolute;bottom: -25px;left:40px;z-index: 555;text-align: center;width: 50px;height: 50px;background: #fff;-moz-transform: rotate(45deg);-ms-transform: rotate(45deg);-webkit-transform: rotate(45deg);-o-transform: rotate(45deg);transform: rotate(45deg);}
.blog-date {position: relative;left: -6px;top: 3px;font-family: 'Alegreya Sans', sans-serif;font-size: 13px;text-align: center;line-height: 1;text-transform:uppercase;color: #222;-moz-transform: rotate(-45deg);-ms-transform: rotate(-45deg);-webkit-transform: rotate(-45deg);-o-transform: rotate(-45deg);transform: rotate(-45deg);}
.blog-date span {display:block;font-size:21px;font-weight:bold;}
.overflow {overflow:hidden;}
.images img {width:100%; display: block; z-index:9;
    -webkit-border-radius: 4px 4px 0 0;
    -moz-border-radius: 4px 4px 0 0;
    border-radius: 4px 4px 0 0;
}

.icons { position:absolute; right:20px; top:20px; height:45px; width:45px; margin-left:0px; z-index:100 }
.slideshow {background:url(../img/bg-slideshow.png) center no-repeat #fff; background-size:28px 15px; }
.aside,.pictures-icon {background:url(../img/bg-aside.png) center no-repeat rgba(255,255,255,.7);background-size:20px 20px;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}
.pictures-icon {background:url(../img/bg-pictures.png) center no-repeat rgba(255,255,255,.7);}
.close {background:url(../img/bg-close.png) center no-repeat rgba(255,255,255,.7); background-size:18px 18px;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}

/* =Isotope
--------------------------------------------------------------------------------------------------------*/
.isotope {width:calc(100% + 30px);margin:0 -15px;}
.isotope-item { z-index: 2;}
.isotope-item:hover {cursor:pointer;}
.isotope-hidden.isotope-item { pointer-events: none; z-index: 1;opacity:0;}
.isotope, .isotope .isotope-item { -webkit-transition-duration: 0.8s; -moz-transition-duration: 0.8s; -ms-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; }
.isotope { -webkit-transition-property: height, width; -moz-transition-property: height, width; -ms-transition-property: height, width; -o-transition-property: height, width; transition-property: height, width; }
.isotope .isotope-item { -webkit-transition-property: -webkit-transform, opacity; -moz-transition-property: -moz-transform, opacity; -ms-transition-property: -ms-transform, opacity; -o-transition-property: top, left, opacity; transition-property: transform, opacity; }
/**** disabling Isotope CSS3 transitions ****/
.isotope.no-transition, .isotope.no-transition .isotope-item, .isotope .isotope-item.no-transition { -webkit-transition-duration: 0s; -moz-transition-duration: 0s; -ms-transition-duration: 0s; -o-transition-duration: 0s; transition-duration: 0s; }
/* End: Recommended Isotope styles */

/* disable CSS transitions for containers with infinite scrolling*/
.isotope.infinite-scrolling { -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none; transition: none; }

.isotope-archive {padding-top:20px;}
.isotope-archive .archive-pages {
    position:absolute;
    bottom:40px;
    left:0;
    width:100%;
    text-align:center;
}
.isotope-archive .archive-pages a {
    display:inline-block;
    margin:0 10px;
    position:relative;
    color:#8abeb2;
}
.isotope-archive .archive-pages a:hover {
    color:#4DC8E3;
}
.isotope-archive .archive-pages a:before,
.isotope-archive .archive-pages a:after {
    display:inline-block;
    text-align:center;
    font-size:15px;
    line-height:1;
    vertical-align:middle;
    text-decoration:none;
    margin:1px 5px 0 5px;
}
.isotope-archive .archive-pages a i {
    font-size:18px;
    line-height:1;
    vertical-align:middle;
    margin:0 5px;
}
.isotope-archive .archive-pages a.archive_prev:after {
    content:'NEWER POSTS';
}
.isotope-archive .archive-pages a.archive_next:before {
    content:'OLDER POSTS';
}

@media screen and (max-width:1200px){
    .col1-3 {width:329px}
    .col2-3 {width:658px}
}
@media screen and (max-width:990px){
    .col1-3 {width:394px}
    .col2-3 {width:788px}
}
@media screen and (max-width:790px){
    .col1-3 {width:284px}
    .col2-3 {width:568px}
    
    .icons {
        right:10px;
        top:10px;
    }
    
    .blog-date-container {left:20px;}
    .white-bottom {padding:15px 15px 20px 15px;}
    .white-bottom h2 {font-size:15px;letter-spacing:0;}
}
@media screen and (max-width:570px){
    .col1-3 {width:254px}
    .col2-3 {width:508px}
}

@media screen and (max-width:510px){
    .col1-3 {width:389px}
    .col2-3 {width:389px}
}
@media screen and (max-width:390px){
    .col1-3 {width:349px}
    .col2-3 {width:349px}
}
@media screen and (max-width:350px){
    .col1-3 {width:309px}
    .col2-3 {width:309px}
}