<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="author" content="sumit kumar">
<title>blog</title>
<link href="css/bootstrap.css" rel="stylesheet" type="text/css">
<link href="css/font-awesome.css" rel="stylesheet" type="text/css">
<link href="css/style.css" rel="stylesheet" type="text/css">
<script src="https://use.fontawesome.com/07b0ce5d10.js"></script>
</head>
<body>
<nav class="navbar navbar-inverse">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#"><img src="https://lh3.googleusercontent.com/-oUUGCaMUjfU/WMp9Omi9qvI/AAAAAAAADQQ/-YPhhaFRGX4r71_eNxo-f4zDU2x0uuskwCJoC/w344-h40-p-rw/logo.png"></a>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
<li><a href="#"><span class="glyphicon glyphicon-user"></span> Sign Up</a></li>
<li><a href="#"><span class="glyphicon glyphicon-log-in"></span> Login</a></li>
</ul>
</div>
</div>
</nav>
<section id="blog-section" >
<div class="container">
<div class="row">
<div class="col-lg-8">
<div class="row">
<div class="col-lg-6 col-md-6">
<aside>
<img src="https://lh3.googleusercontent.com/-ndZJOGgvYQ4/WM1ZI8dH86I/AAAAAAAADeo/l67ZqZnRUO8QXIQi38bEXuxqHfVX0TV2gCJoC/w424-h318-n-rw/thumbnail8.jpg" class="img-responsive">
<div class="content-title">
<div class="text-center">
<h3><a href="#">Niki Postingan Sing Kepisan Njeh, Perdana Ngoten</a></h3>
</div>
</div>
<div class="content-footer">
<img class="user-small-img" src="https://lh3.googleusercontent.com/-UJUmoLiJWLY/WMp8QiPCa3I/AAAAAAAADPg/X-o1iKl1JYUpSVAP8ZoZK4ZiY-EFP5jjwCJoC/w150-h148-p-rw/profile-pic.jpg">
<span style="font-size: 16px;color: #fff;">Sumit Kumar</span>
<span class="pull-right">
<a href="#" data-toggle="tooltip" data-placement="left" title="Comments"><i class="fa fa-comments" ></i> 30</a>
<a href="#" data-toggle="tooltip" data-placement="right" title="Loved"><i class="fa fa-heart"></i> 20</a>
</span>
<div class="user-ditels">
<div class="user-img"><img src="https://lh3.googleusercontent.com/-UJUmoLiJWLY/WMp8QiPCa3I/AAAAAAAADPg/X-o1iKl1JYUpSVAP8ZoZK4ZiY-EFP5jjwCJoC/w150-h148-p-rw/profile-pic.jpg" class="img-responsive"></div>
<span class="user-full-ditels">
<h3>Sumit Kumar</h3>
<p>Web & Graphics Disigner</p>
</span>
<div class="social-icon">
<a href="#"><i class="fa fa-facebook" data-toggle="tooltip" data-placement="bottom" title="Facebook"></i></a>
<a href="#"><i class="fa fa-twitter" data-toggle="tooltip" data-placement="bottom" title="Twitter"></i></a>
<a href="#"><i class="fa fa-google-plus" data-toggle="tooltip" data-placement="bottom" title="Google Plus"></i></a>
<a href="#"><i class="fa fa-youtube" data-toggle="tooltip" data-placement="bottom" title="Youtube"></i></a>
<a href="#"><i class="fa fa-github" data-toggle="tooltip" data-placement="bottom" title="Github"></i></a>
</div>
</div>
</div>
</aside>
</div>
<div class="col-lg-6 col-md-6">
<aside>
<img src="https://lh3.googleusercontent.com/-ojLI116-Mxk/WM1ZIwdnuwI/AAAAAAAADeo/4K6VpwIPSfgsmlXJB5o0N8scuI3iW4OpwCJoC/w424-h318-n-rw/thumbnail6.jpg" class="img-responsive">
<div class="content-title">
<div class="text-center">
<h3><a href="#">Niki Postingan Sing Kepisan Njeh, Perdana Ngoten</a></h3>
</div>
</div>
<div class="content-footer">
<img class="user-small-img" src="https://lh3.googleusercontent.com/-UJUmoLiJWLY/WMp8QiPCa3I/AAAAAAAADPg/X-o1iKl1JYUpSVAP8ZoZK4ZiY-EFP5jjwCJoC/w150-h148-p-rw/profile-pic.jpg">
<span style="font-size: 16px;color: #fff;">Sumit Kumar</span>
<span class="pull-right">
<a href="#" data-toggle="tooltip" data-placement="left" title="Comments"><i class="fa fa-comments" ></i> 30</a>
<a href="#" data-toggle="tooltip" data-placement="right" title="Loved"><i class="fa fa-heart"></i> 20</a>
</span>
<div class="user-ditels">
<div class="user-img"><img src="https://lh3.googleusercontent.com/-UJUmoLiJWLY/WMp8QiPCa3I/AAAAAAAADPg/X-o1iKl1JYUpSVAP8ZoZK4ZiY-EFP5jjwCJoC/w150-h148-p-rw/profile-pic.jpg" class="img-responsive"></div>
<span class="user-full-ditels">
<h3>Sumit Kumar</h3>
<p>Web & Graphics Disigner</p>
</span>
<div class="social-icon">
<a href="#"><i class="fa fa-facebook" data-toggle="tooltip" data-placement="bottom" title="Facebook"></i></a>
<a href="#"><i class="fa fa-twitter" data-toggle="tooltip" data-placement="bottom" title="Twitter"></i></a>
<a href="#"><i class="fa fa-google-plus" data-toggle="tooltip" data-placement="bottom" title="Google Plus"></i></a>
<a href="#"><i class="fa fa-youtube" data-toggle="tooltip" data-placement="bottom" title="Youtube"></i></a>
<a href="#"><i class="fa fa-github" data-toggle="tooltip" data-placement="bottom" title="Github"></i></a>
</div>
</div>
</div>
</aside>
</div>
<div class="col-lg-6 col-md-6">
<aside>
<img src="https://lh3.googleusercontent.com/-TrK1csbtHRs/WM1ZI1SIUNI/AAAAAAAADeo/OkiUjuad6skWl9ugxbiIA_436OwsWKBNgCJoC/w424-h318-n-rw/thumbnail3.jpg" class="img-responsive">
<div class="content-title">
<div class="text-center">
<h3><a href="#">Niki Postingan Sing Kepisan Njeh, Perdana Ngoten</a></h3>
</div>
</div>
<div class="content-footer">
<img class="user-small-img" src="https://lh3.googleusercontent.com/-UJUmoLiJWLY/WMp8QiPCa3I/AAAAAAAADPg/X-o1iKl1JYUpSVAP8ZoZK4ZiY-EFP5jjwCJoC/w150-h148-p-rw/profile-pic.jpg">
<span style="font-size: 16px;color: #fff;">Sumit Kumar</span>
<span class="pull-right">
<a href="#" data-toggle="tooltip" data-placement="left" title="Comments"><i class="fa fa-comments" ></i> 30</a>
<a href="#" data-toggle="tooltip" data-placement="right" title="Loved"><i class="fa fa-heart"></i> 20</a>
</span>
<div class="user-ditels">
<div class="user-img"><img src="https://lh3.googleusercontent.com/-UJUmoLiJWLY/WMp8QiPCa3I/AAAAAAAADPg/X-o1iKl1JYUpSVAP8ZoZK4ZiY-EFP5jjwCJoC/w150-h148-p-rw/profile-pic.jpg" class="img-responsive"></div>
<span class="user-full-ditels">
<h3>Sumit Kumar</h3>
<p>Web & Graphics Disigner</p>
</span>
<div class="social-icon">
<a href="#"><i class="fa fa-facebook" data-toggle="tooltip" data-placement="bottom" title="Facebook"></i></a>
<a href="#"><i class="fa fa-twitter" data-toggle="tooltip" data-placement="bottom" title="Twitter"></i></a>
<a href="#"><i class="fa fa-google-plus" data-toggle="tooltip" data-placement="bottom" title="Google Plus"></i></a>
<a href="#"><i class="fa fa-youtube" data-toggle="tooltip" data-placement="bottom" title="Youtube"></i></a>
<a href="#"><i class="fa fa-github" data-toggle="tooltip" data-placement="bottom" title="Github"></i></a>
</div>
</div>
</div>
</aside>
</div>
<div class="col-lg-6 col-md-6">
<aside>
<img src="https://lh3.googleusercontent.com/-UKfIhJSBW9M/WM1ZI8ou34I/AAAAAAAADeo/vlLGY29147AYLaxUW29ZXJlun115BhkhgCJoC/w424-h318-n-rw/thumbnail7.jpg" class="img-responsive">
<div class="content-title">
<div class="text-center">
<h3><a href="#">Niki Postingan Sing Kepisan Njeh, Perdana Ngoten</a></h3>
</div>
</div>
<div class="content-footer">
<img class="user-small-img" src="https://lh3.googleusercontent.com/-UJUmoLiJWLY/WMp8QiPCa3I/AAAAAAAADPg/X-o1iKl1JYUpSVAP8ZoZK4ZiY-EFP5jjwCJoC/w150-h148-p-rw/profile-pic.jpg">
<span style="font-size: 16px;color: #fff;">Sumit Kumar</span>
<span class="pull-right">
<a href="#" data-toggle="tooltip" data-placement="left" title="Comments"><i class="fa fa-comments" ></i> 30</a>
<a href="#" data-toggle="tooltip" data-placement="right" title="Loved"><i class="fa fa-heart"></i> 20</a>
</span>
<div class="user-ditels">
<div class="user-img"><img src="https://lh3.googleusercontent.com/-UJUmoLiJWLY/WMp8QiPCa3I/AAAAAAAADPg/X-o1iKl1JYUpSVAP8ZoZK4ZiY-EFP5jjwCJoC/w150-h148-p-rw/profile-pic.jpg" class="img-responsive"></div>
<span class="user-full-ditels">
<h3>Sumit Kumar</h3>
<p>Web & Graphics Disigner</p>
</span>
<div class="social-icon">
<a href="#"><i class="fa fa-facebook" data-toggle="tooltip" data-placement="bottom" title="Facebook"></i></a>
<a href="#"><i class="fa fa-twitter" data-toggle="tooltip" data-placement="bottom" title="Twitter"></i></a>
<a href="#"><i class="fa fa-google-plus" data-toggle="tooltip" data-placement="bottom" title="Google Plus"></i></a>
<a href="#"><i class="fa fa-youtube" data-toggle="tooltip" data-placement="bottom" title="Youtube"></i></a>
<a href="#"><i class="fa fa-github" data-toggle="tooltip" data-placement="bottom" title="Github"></i></a>
</div>
</div>
</div>
</aside>
</div>
<div class="col-lg-6 col-md-6">
<aside>
<img src="https://lh3.googleusercontent.com/-13DR8P0-AN4/WM1ZIz1lRNI/AAAAAAAADeo/XMfJ7CM-pQg9qfRuCgSnphzqhaj3SQg6QCJoC/w424-h318-n-rw/thumbnail4.jpg" class="img-responsive">
<div class="content-title">
<div class="text-center">
<h3><a href="#">Niki Postingan Sing Kepisan Njeh, Perdana Ngoten</a></h3>
</div>
</div>
<div class="content-footer">
<img class="user-small-img" src="https://lh3.googleusercontent.com/-UJUmoLiJWLY/WMp8QiPCa3I/AAAAAAAADPg/X-o1iKl1JYUpSVAP8ZoZK4ZiY-EFP5jjwCJoC/w150-h148-p-rw/profile-pic.jpg">
<span style="font-size: 16px;color: #fff;">Sumit Kumar</span>
<span class="pull-right">
<a href="#" data-toggle="tooltip" data-placement="left" title="Comments"><i class="fa fa-comments" ></i> 30</a>
<a href="#" data-toggle="tooltip" data-placement="right" title="Loved"><i class="fa fa-heart"></i> 20</a>
</span>
<div class="user-ditels">
<div class="user-img"><img src="https://lh3.googleusercontent.com/-UJUmoLiJWLY/WMp8QiPCa3I/AAAAAAAADPg/X-o1iKl1JYUpSVAP8ZoZK4ZiY-EFP5jjwCJoC/w150-h148-p-rw/profile-pic.jpg" class="img-responsive"></div>
<span class="user-full-ditels">
<h3>Sumit Kumar</h3>
<p>Web & Graphics Disigner</p>
</span>
<div class="social-icon">
<a href="#"><i class="fa fa-facebook" data-toggle="tooltip" data-placement="bottom" title="Facebook"></i></a>
<a href="#"><i class="fa fa-twitter" data-toggle="tooltip" data-placement="bottom" title="Twitter"></i></a>
<a href="#"><i class="fa fa-google-plus" data-toggle="tooltip" data-placement="bottom" title="Google Plus"></i></a>
<a href="#"><i class="fa fa-youtube" data-toggle="tooltip" data-placement="bottom" title="Youtube"></i></a>
<a href="#"><i class="fa fa-github" data-toggle="tooltip" data-placement="bottom" title="Github"></i></a>
</div>
</div>
</div>
</aside>
</div>
<div class="col-lg-6 col-md-6">
<aside>
<img src="https://lh3.googleusercontent.com/-QlnwuVgbxus/WM1ZI1FKQiI/AAAAAAAADeo/nGSd1ExnnfIfIBF27xs8-EdBdfglqFPZgCJoC/w424-h318-n-rw/thumbnail2.jpg" class="img-responsive">
<div class="content-title">
<div class="text-center">
<h3><a href="#">Niki Postingan Sing Kepisan Njeh, Perdana Ngoten</a></h3>
</div>
</div>
<div class="content-footer">
<img class="user-small-img" src="https://lh3.googleusercontent.com/-UJUmoLiJWLY/WMp8QiPCa3I/AAAAAAAADPg/X-o1iKl1JYUpSVAP8ZoZK4ZiY-EFP5jjwCJoC/w150-h148-p-rw/profile-pic.jpg">
<span style="font-size: 16px;color: #fff;">Sumit Kumar</span>
<span class="pull-right">
<a href="#" data-toggle="tooltip" data-placement="left" title="Comments"><i class="fa fa-comments" ></i> 30</a>
<a href="#" data-toggle="tooltip" data-placement="right" title="Loved"><i class="fa fa-heart"></i> 20</a>
</span>
<div class="user-ditels">
<div class="user-img"><img src="https://lh3.googleusercontent.com/-UJUmoLiJWLY/WMp8QiPCa3I/AAAAAAAADPg/X-o1iKl1JYUpSVAP8ZoZK4ZiY-EFP5jjwCJoC/w150-h148-p-rw/profile-pic.jpg" class="img-responsive"></div>
<span class="user-full-ditels">
<h3>Sumit Kumar</h3>
<p>Web & Graphics Disigner</p>
</span>
<div class="social-icon">
<a href="#"><i class="fa fa-facebook" data-toggle="tooltip" data-placement="bottom" title="Facebook"></i></a>
<a href="#"><i class="fa fa-twitter" data-toggle="tooltip" data-placement="bottom" title="Twitter"></i></a>
<a href="#"><i class="fa fa-google-plus" data-toggle="tooltip" data-placement="bottom" title="Google Plus"></i></a>
<a href="#"><i class="fa fa-youtube" data-toggle="tooltip" data-placement="bottom" title="Youtube"></i></a>
<a href="#"><i class="fa fa-github" data-toggle="tooltip" data-placement="bottom" title="Github"></i></a>
</div>
</div>
</div>
</aside>
</div>
<div class="col-lg-6 col-md-6">
<aside>
<img src="https://lh3.googleusercontent.com/-wRHL_FOH1AU/WM1ZIxQZ3DI/AAAAAAAADeo/lwJr8xndbW4MHI-lOB7CQ-14FJB5f5SWACJoC/w424-h318-n-rw/thumbnail5.jpg" class="img-responsive">
<div class="content-title">
<div class="text-center">
<h3><a href="#">Niki Postingan Sing Kepisan Njeh, Perdana Ngoten</a></h3>
</div>
</div>
<div class="content-footer">
<img class="user-small-img" src="https://lh3.googleusercontent.com/-UJUmoLiJWLY/WMp8QiPCa3I/AAAAAAAADPg/X-o1iKl1JYUpSVAP8ZoZK4ZiY-EFP5jjwCJoC/w150-h148-p-rw/profile-pic.jpg">
<span style="font-size: 16px;color: #fff;">Sumit Kumar</span>
<span class="pull-right">
<a href="#" data-toggle="tooltip" data-placement="left" title="Comments"><i class="fa fa-comments" ></i> 30</a>
<a href="#" data-toggle="tooltip" data-placement="right" title="Loved"><i class="fa fa-heart"></i> 20</a>
</span>
<div class="user-ditels">
<div class="user-img"><img src="https://lh3.googleusercontent.com/-UJUmoLiJWLY/WMp8QiPCa3I/AAAAAAAADPg/X-o1iKl1JYUpSVAP8ZoZK4ZiY-EFP5jjwCJoC/w150-h148-p-rw/profile-pic.jpg" class="img-responsive"></div>
<span class="user-full-ditels">
<h3>Sumit Kumar</h3>
<p>Web & Graphics Disigner</p>
</span>
<div class="social-icon">
<a href="#"><i class="fa fa-facebook" data-toggle="tooltip" data-placement="bottom" title="Facebook"></i></a>
<a href="#"><i class="fa fa-twitter" data-toggle="tooltip" data-placement="bottom" title="Twitter"></i></a>
<a href="#"><i class="fa fa-google-plus" data-toggle="tooltip" data-placement="bottom" title="Google Plus"></i></a>
<a href="#"><i class="fa fa-youtube" data-toggle="tooltip" data-placement="bottom" title="Youtube"></i></a>
<a href="#"><i class="fa fa-github" data-toggle="tooltip" data-placement="bottom" title="Github"></i></a>
</div>
</div>
</div>
</aside>
</div>
<div class="col-lg-6 col-md-6">
<aside>
<img src="https://lh3.googleusercontent.com/-ndZJOGgvYQ4/WM1ZI8dH86I/AAAAAAAADeo/l67ZqZnRUO8QXIQi38bEXuxqHfVX0TV2gCJoC/w424-h318-n-rw/thumbnail8.jpg" class="img-responsive">
<div class="content-title">
<div class="text-center">
<h3><a href="#">Niki Postingan Sing Kepisan Njeh, Perdana Ngoten</a></h3>
</div>
</div>
<div class="content-footer">
<img class="user-small-img" src="https://lh3.googleusercontent.com/-UJUmoLiJWLY/WMp8QiPCa3I/AAAAAAAADPg/X-o1iKl1JYUpSVAP8ZoZK4ZiY-EFP5jjwCJoC/w150-h148-p-rw/profile-pic.jpg">
<span style="font-size: 16px;color: #fff;">Sumit Kumar</span>
<span class="pull-right">
<a href="#" data-toggle="tooltip" data-placement="left" title="Comments"><i class="fa fa-comments" ></i> 30</a>
<a href="#" data-toggle="tooltip" data-placement="right" title="Loved"><i class="fa fa-heart"></i> 20</a>
</span>
<div class="user-ditels">
<div class="user-img"><img src="https://lh3.googleusercontent.com/-UJUmoLiJWLY/WMp8QiPCa3I/AAAAAAAADPg/X-o1iKl1JYUpSVAP8ZoZK4ZiY-EFP5jjwCJoC/w150-h148-p-rw/profile-pic.jpg" class="img-responsive"></div>
<span class="user-full-ditels">
<h3>Sumit Kumar</h3>
<p>Web & Graphics Disigner</p>
</span>
<div class="social-icon">
<a href="#"><i class="fa fa-facebook" data-toggle="tooltip" data-placement="bottom" title="Facebook"></i></a>
<a href="#"><i class="fa fa-twitter" data-toggle="tooltip" data-placement="bottom" title="Twitter"></i></a>
<a href="#"><i class="fa fa-google-plus" data-toggle="tooltip" data-placement="bottom" title="Google Plus"></i></a>
<a href="#"><i class="fa fa-youtube" data-toggle="tooltip" data-placement="bottom" title="Youtube"></i></a>
<a href="#"><i class="fa fa-github" data-toggle="tooltip" data-placement="bottom" title="Github"></i></a>
</div>
</div>
</div>
</aside>
</div>
</div>
</div>
<script src="js/jquery-3.1.1.js"></script>
<script src="js/bootstrap.js"></script>
<script>
$(document).ready(function(){
$('[data-toggle="tooltip"]').tooltip();
});
var acc = document.getElementsByClassName("accordion");
var i;
for (i = 0; i < acc.length; i++) {
acc[i].onclick = function() {
this.classList.toggle("active");
var panel = this.nextElementSibling;
if (panel.style.maxHeight){
panel.style.maxHeight = null;
} else {
panel.style.maxHeight = panel.scrollHeight + "px";
}
}
}
</script>
</body>
</html>
body{background-color:#ECF0F1;}
.navbar-inverse {
background-color: #34495E;
border-color: #34495E;
}
.navbar {
position: relative;
min-height: 50px;
margin-bottom: 20px;
border: 0px solid transparent;
border-radius:0px;
}
.navbar-brand {
float: left;
height:auto;
padding: 10px 10px;
font-size: 18px;
line-height: 20px;
}
.navbar-brand>img{ width:60%;}
.navbar-inverse .navbar-nav > li > a {
color: #F39C12;
}
.navbar-inverse .navbar-nav > li > a:hover {
background-color: #009688;
}
.btn-default {
color: #333;
background-color: #009688;
border-color: #009688;
border-radius:0px;
color:#fff;
}
#blog-section{margin-top:40px;margin-bottom:80px;}
.content-title{padding:5px;background-color:#fff;}
.content-title h3 a{color:#34495E;text-decoration:none; transition: 0.5s;}
.content-title h3 a:hover{color:#F39C12; }
.content-footer{background-color:#16A085;padding:10px;position: relative;}
.content-footer span a {
color: #fff;
display: inline-block;
padding: 6px 5px;
text-decoration: none;
transition: 0.5s;
}
.content-footer span a:hover{
color:#F39C12;
}
aside{
margin-top: 30px;
-webkit-box-shadow: 1px 4px 16px 3px rgba(199,197,199,1);
-moz-box-shadow: 1px 4px 16px 3px rgba(199,197,199,1);
box-shadow: 1px 4px 16px 3px rgba(199,197,199,1);}
aside .content-footer>img {
width: 33px;
height: 33px;
border-radius: 100%;
margin-right: 10px;
border: 2px solid #fff;
}
.user-ditels {
width: 300px;
top: -100px;
height: 100px;
padding-bottom: 99px;
position: absolute;
border: solid 2px #fff;
background-color: #34495E;
right: 25px;
display: none;
z-index: 1;
}
@media (max-width:768px){
.user-ditels {
right: 5px;
}
}
.user-small-img{cursor: pointer;}
.content-footer:hover .user-ditels {
display: block;
}
.content-footer .user-ditels .user-img{width: 100px;height:100px;float: left;}
.user-full-ditels h3 {
color: #fff;
display: block;
margin: 0px;
padding-top: 10px;
padding-right: 28px;
text-align: right;
}
.user-full-ditels p{
color: #fff;
display: block;
margin: 0px;
padding-right: 20px;
padding-top: 5px;
text-align: right;}
.social-icon {
background-color: #fff;
margin-top: 10px;
padding-right: 20px;
text-align: right;
}
.social-icon>a{font-size:20px;text-decoration:none;padding: 5px;}
.social-icon a:nth-of-type(1){color:#4E71A8;}
.social-icon a:nth-of-type(2){color:#3FA1DA;}
.social-icon a:nth-of-type(3){color:#E3411F;}
.social-icon a:nth-of-type(4){color:#CA3737;}
.social-icon a:nth-of-type(5){color:#3A3A3A;}
/*recent-post-col////////////////////*/
.widget-sidebar {
background-color: #fff;
padding: 20px;
margin-top: 30px;
}
.title-widget-sidebar {
font-size: 14pt;
border-bottom: 2px solid #e5ebef;
margin-bottom: 15px;
padding-bottom: 10px;
margin-top: 0px;
}
.title-widget-sidebar:after {
border-bottom: 2px solid #f1c40f;
width: 150px;
display: block;
position: absolute;
content: '';
padding-bottom: 10px;
}
.recent-post{width: 100%;height: 80px;list-style-type: none;}
.post-img img {
width: 100px;
height: 70px;
float: left;
margin-right: 15px;
border: 5px solid #16A085;
transition: 0.5s;
}
.recent-post a {text-decoration: none;color:#34495E;transition: 0.5s;}
.post-img, .recent-post a:hover{color:#F39C12;}
.post-img img:hover{border: 5px solid #F39C12;}
/*===============ARCHIVES////////////////////////////*/
button.accordion {
background-color: #16A085;
color: #fff;
cursor: pointer;
padding: 18px;
width: 100%;
border: none;
text-align: left;
outline: none;
font-size: 15px;
transition: 0.4s;
}
button.accordion.active, button.accordion:hover {
background-color: #F39C12;color: #fff;
}
button.accordion:after {
content: '\002B';
color: #fff;
font-weight: bold;
float: right;
margin-left: 5px;
}
button.accordion.active:after {
content: "\2212";
}
.panel {
padding: 0 18px;
background-color: white;
max-height: 0;
overflow: hidden;
transition: max-height 0.2s ease-out;
}
/*categories//////////////////////*/
.categories-btn{
background-color: #F39C12;
margin-top:30px;
color: #fff;
cursor: pointer;
padding: 18px;
width: 100%;
border: none;
text-align: left;
outline: none;
font-size: 15px;
transition: 0.4s;
}
.categories-btn:after {
content: '\25BA';
color: #fff;
font-weight: bold;
float: right;
margin-left: 5px;
}
.categories-btn:hover {
background-color: #16A085;color: #fff;
}
.form-control{border-radius: 0px;}
.btn-warning {
border-radius: 0px;
background-color: #F39C12;
margin-top: 15px;
}
.input-group-addon{border-radius: 0px;}
