.blog1{}
.blog1 .blog-list{margin-bottom: 30px;}
.blog1 .blog-list .blog-img{margin-bottom: 30px}
.blog1 .blog-list .blog-img img{width: 100%;}
.blog1 .blog-list .blog-text{}
.blog1 .blog-list .blog-text h1{margin: 0 0 30px; padding-bottom: 10px; position: relative; text-transform: uppercase; color: #333333}
.blog1 .blog-list .blog-text h1 a{color: #333333}
.blog1 .blog-list .blog-text h1:after{width: 30px; height: 3px; background-color: #2684e4; content: ''; position: absolute; left: 0; right: auto; bottom: -10px; margin: 0 auto;}
.blog1 .blog-list .blog-text a{color: #2684e4}
.blog1 .blog-list .panel {padding: 5px 10px; border: 1px solid #eeeeee;}
.blog1 .blog-list .author, .blog1 .blog-list .date, .blog1 .blog-list .comments {display: inline-block; float: left; font-size: 14px; color: #5c6873; font-weight: 400; margin: 6px 10px 3px 0;}
.blog1 .blog-list .tags {padding: 0; margin: 3px 0px 5px 0; float: right; display: inline-block;}
.blog1 .blog-list .tags > li {font-size: 13px; text-transform: uppercase; display: inline-block; list-style: none; padding: 2px 6px 1px 6px;  margin: 0; color: #ffffff; background: #2684e4;}
.blog1 .blog-list .comments{float: right}

.blog1 .side-bar{}
.blog1 .side-bar .search{width: 100%; border: 1px solid #2684e4; border-radius: 0; margin-bottom: 30px;}
.blog1 .side-bar .search input{border: none; box-shadow: none; background: #FFFFFF; float: left;}
.blog1 .side-bar .search .search-btn{background: #2684e4; color: #FFFFFF; border-radius: 0; float: right;}

.blog1 .side-bar h3{margin: 0 0 30px; padding-bottom: 10px; position: relative; text-transform: uppercase;}
.blog1 .side-bar h3:after{width: 30px; height: 3px; background-color: #2684e4; content: ''; position: absolute; left: 0; right: auto; bottom: -10px; margin: 0 auto;}

.blog1 .side-bar .category{margin-bottom: 30px;}
.blog1 .side-bar .category ul{}
.blog1 .side-bar .category ul li{list-style: none; padding: 7px 0; border-bottom: 1px solid #f2f2f2;}
.blog1 .side-bar .category ul li::before {color: #2684e4; content: "\eab8"; font-family: IcoFont !important; font-weight: 100; width: 12px; height: 12px; font-size: 14px; float: left; margin: 2px 5px 0 0;}
.blog1 .side-bar .category ul li a:hover{color: #2684e4}

.blog1 .side-bar .posts{margin-bottom: 30px;}
.blog1 .side-bar .posts ul li{display: inline-block; width: 100%; margin-bottom: 10px; border: 1px solid #eeeeee; padding: 10px;}
.blog1 .side-bar .posts ul li:last-child{margin-bottom: 0}
.blog1 .side-bar .posts .posts-img{width: 60px; display: inline-block;}
.blog1 .side-bar .posts .posts-img img{width: 100%;}
.blog1 .side-bar .posts .posts-text{width: 70%}
.blog1 .side-bar .posts .posts-text .p-title{font-weight: 400; font-size: 17px;}
.blog1 .side-bar .posts .posts-text .p-date{font-size: 15px; color: #5c6873;}

.blog1 .side-bar .blogs{margin-bottom: 30px;}
.blog1 .side-bar .blogs ul{}
.blog1 .side-bar .blogs ul li{list-style: none; padding: 7px 0; border-bottom: 1px solid #f2f2f2;}
.blog1 .side-bar .blogs ul li::before {color: #2684e4; content: "\eab8"; font-family: IcoFont !important; font-weight: 100; width: 12px; height: 12px; font-size: 14px; float: left; margin: 2px 5px 0 0;}
.blog1 .side-bar .blogs ul li a:hover{color: #2684e4}

.blog2{}
.blog2 .blog-list{margin-bottom: 30px;}
.blog2 .blog-list .blog-img{}
.blog2 .blog-list .blog-img img{width: 100%;}
.blog2 .blog-list .blog-text{border: 1px solid #eeeeee; padding: 10px; margin-bottom: 20px;}
.blog2 .blog-list .blog-text h1{margin: 0 0 30px; padding-bottom: 10px; position: relative; text-transform: uppercase; color: #333333}
.blog2 .blog-list .blog-text h1 a{color: #333333}
.blog2 .blog-list .blog-text h1:after{width: 30px; height: 3px; background-color: #2684e4; content: ''; position: absolute; left: 0; right: auto; bottom: -10px; margin: 0 auto;}
.blog2 .blog-list .blog-text a{color: #2684e4}
.blog2 .blog-list .panel {padding: 5px 10px; border: 1px solid #eeeeee;}
.blog2 .blog-list .author, .blog2 .blog-list .date, .blog2 .blog-list .comments {display: inline-block; float: left; font-size: 14px; color: #5c6873; font-weight: 400; margin: 6px 10px 3px 0;}
.blog2 .blog-list .tags {padding: 0; margin: 3px 0px 5px 0; float: right; display: inline-block;}
.blog2 .blog-list .tags > li {font-size: 13px; text-transform: uppercase; display: inline-block; list-style: none; padding: 2px 6px 1px 6px;  margin: 0 2px; color: #ffffff; background: #2684e4;}
.blog2 .blog-list .comments{float: right}

.blog2 .side-bar{}
.blog2 .side-bar .search{width: 100%; border: 1px solid #2684e4; border-radius: 0; margin-bottom: 30px;}
.blog2 .side-bar .search input{border: none; box-shadow: none; background: #FFFFFF; float: left;}
.blog2 .side-bar .search .search-btn{background: #2684e4; color: #FFFFFF; border-radius: 0; float: right;}

.blog2 .side-bar h3{margin: 0 0 30px; padding-bottom: 10px; position: relative; text-transform: uppercase;}
.blog2 .side-bar h3:after{width: 30px; height: 3px; background-color: #2684e4; content: ''; position: absolute; left: 0; right: auto; bottom: -10px; margin: 0 auto;}

.blog2 .side-bar .category{margin-bottom: 30px;}
.blog2 .side-bar .category ul{}
.blog2 .side-bar .category ul li{list-style: none; padding: 7px 0; border-bottom: 1px solid #f2f2f2;}
.blog2 .side-bar .category ul li::before {color: #2684e4; content: "\eab8"; font-family: IcoFont !important; font-weight: 100; width: 12px; height: 12px; font-size: 14px; float: left; margin: 2px 5px 0 0;}
.blog2 .side-bar .category ul li a:hover{color: #2684e4}

.blog2 .side-bar .posts{margin-bottom: 30px;}
.blog2 .side-bar .posts ul li{display: inline-block; width: 100%; margin-bottom: 10px; border: 1px solid #1D9972; padding: 10px;}
.blog2 .side-bar .posts ul li:last-child{margin-bottom: 0}
.blog2 .side-bar .posts .posts-img{width: 60px; display: inline-block; margin-right: 10px;}
.blog2 .side-bar .posts .posts-img img{width: 100%;}
.blog2 .side-bar .posts .posts-text{width: 73%}
.blog2 .side-bar .posts .posts-text .p-title{font-weight: 400; font-size: 17px;}
.blog2 .side-bar .posts .posts-text .p-date{font-size: 15px; color: #5c6873;}

.blog2 .side-bar .blogs{margin-bottom: 30px;}
.blog2 .side-bar .blogs ul{}
.blog2 .side-bar .blogs ul li{list-style: none; padding: 7px 0; border-bottom: 1px solid #f2f2f2;}
.blog2 .side-bar .blogs ul li::before {color: #2684e4; content: "\eab8"; font-family: IcoFont !important; font-weight: 100; width: 12px; height: 12px; font-size: 14px; float: left; margin: 2px 5px 0 0;}
.blog2 .side-bar .blogs ul li a:hover{color: #2684e4}

@media only screen and (min-width:1200px) and (max-width:1399px) {
.blog1 .side-bar .search input{width: 80%;}
.blog1 .side-bar .search .search-btn{width: 20%;}
.blog1 .side-bar .posts .posts-text {width: 68%;}

.blog2 .side-bar .search input{width: 80%;}
.blog2 .side-bar .search .search-btn{width: 20%;}
}

/** 5.0 - 1200 - Desktop **/
@media only screen and (min-width:992px) and (max-width:1199px) {
.blog1 .side-bar .search input{width: 80%;}
.blog1 .side-bar .search .search-btn{width: 20%;}
.blog1 .side-bar .posts .posts-text {width: 60%;}

.blog2 .side-bar .search input{width: 80%;}
.blog2 .side-bar .search .search-btn{width: 20%;}
.blog2 .side-bar .posts .posts-text {width: 60%;}
}

/** 7.0 - 768 - iPad **/
@media only screen and (min-width: 768px) and (max-width: 991px) {
.blog1 .side-bar .search input{width: 80%;}
.blog1 .side-bar .search .search-btn{width: 20%;}
.blog1 .side-bar .posts .posts-text {width: 86%;}

.blog2 .blog-list{padding: 0}
.blog2 .side-bar .posts .posts-text{width: 86%;}
}

/** 8.0 - 640 - Mobile **/
@media only screen and (min-width: 640px) and (max-width: 767px) {
.blog1 .side-bar .search input{width: 80%;}
.blog1 .side-bar .search .search-btn{width: 20%;}
.blog1 .side-bar .posts .posts-text {width: 86%;}

.blog2 .blog-list{padding: 0}
.blog2 .side-bar .posts .posts-text{width: 86%;}
}

/** 9.0 - 480 - Mobile **/
@media only screen and (min-width: 480px) and (max-width: 639px) {
.blog1 .side-bar .search input{width: 80%;}
.blog1 .side-bar .search .search-btn{width: 20%;}
.blog1 .side-bar .posts .posts-text {width: 80%;}

.blog2 .blog-list{padding: 0}
.blog2 .side-bar .posts .posts-text{width: 80%;}
}

/** 10.0 - 320 - Mobile **/
@media only screen and (min-width: 320px) and (max-width: 479px) {
.blog1 .blog-list .author, .blog1 .blog-list .date, .blog1 .blog-list .comments, .blog1 .blog-list .tags{display: block; float: none}
.blog1 .side-bar .search input{width: 80%;}
.blog1 .side-bar .search .search-btn{width: 20%;}
.blog1 .side-bar .posts .posts-text {width: 70%;}

.blog2 .blog-list{padding: 0}
}