/*
Template: Php Auction Template With bidding System
Author Name: Mohammed Tahir Ahmed
Author Email: dominic7owino@yahoo.com
Theme URL: http://www.dalawa.co.ke
Version: 1.0

*/

/*
----------------------------------
CSS Table of contents

----------------------------------

1: General Content Styles
2: Font Awesome Icons Styles
3: Common Section Styles
4: Layout styles that deal with overall page structure
5: Widewrapper that span the whole width of the page
6: Navbar Section
7: Blog-bredcrumb
8: Searchbox
9: Blog area and sidebar area styles
10: The blog main page boxes
11: Blog sidebar styles
12: Blog main page pagination
13: Blog detail article styles
14: Blog detail comments styles
15: Add Comment form styles
16: About Us page styles
17: Footer Styles
18:Buttons Styles

*/

/*  General Content Styles such as links, body text, or heading */
body{
font-size:16px;
line-height:27px;
font-family: 'open Sans', sans-serif;
color:#40b55;
background-color:#feffff;
overflow-x:hidden;
}
a{
color:#5b6268;
}
a:hover,
a:focus{
text-decoration:none;
color:#5b6268;
}
h3{
font-size:21px;
line-height:30px;
font-weight:normal;
font-family: 'Open Sans', sans-serif;

}
hr{
border-top-color: #ced5db;

}

/* Font Awesome Icons Styles */
.fa{
font-size:24px;
}
/* Layout Styles that deal with the overall page structure */
/* Masthead is the upper part of the header, containing logo and navigation */
.masthead{
padding-top:55px;
padding-bottom:55px;
}
/* Widewrapper that span the whole width of the page */
.widewrapper{
background-color:#feffff;
}
.widewrapper.main{
box-shadow: inset 1px 10px 8px -8px #ababab;
-webkit-box-shadow: inset 1px 10px 8px -8px #ababab;
-moz-box-shadow: inset 1px 10px 8px -8px #ababab;
}
.widewrapper.masthead{
background-color:#242b32;
color:#f8f8f9;

}
.widewrapper.subheader{
background-color:#37424c;
color:#b6bfc8;
font-size:16px;
min-height:63px;
}
/* Navbar Section */
.navbar-custom{
padding:10px 0;
margin-bottom:0;
text-transform:uppercase;
font-weight:700;
}
.navbar-custom.navbar-brand:focus{
outline:0;
}
.navbar-custom .top-nav-collapse{
background:rgba(254,82,76, 1);

}
.navbar-custom.navbar-fixed-top{
transition:all .4s ease-in-out;
-webkit-transition:all .4s ease-in-out;
-moz-transition:all .4s ease-in-out;
}
.navbar-custom.navbar-brand.navbar-toggle{
padding:4px 6px;
font-size:16px;
color:#fff;
}
.navbar-custom.navbar-brand.navbar-toggle:focus,
.navbar-custom.navbar-brand.navbar-toggle:active{
outline:0;
}
.navbar-custom a{
color:#fff;
}
.navbar-custom .nav li a{
transition: background .6s ease-in-out;
-webkit-transition: background .6s ease-in-out;
-moz-transition: background .6s ease-in-out; 
}
.navbar-custom .nav li a:hover{
outline:0;
color:rgba(255, 255, 255, .8);
background-color:#37424c;
}

/* Blog Breadcrumb  */

.blog-breadcrumb {
color: #b6bfc8;
float:left;
margin-top: 19px;
  
}
.blog-breadcrumb a {
color: #b6bfc8;
}

/* The searchbox in the subheader on top of the site */

.blog-searchbox{
float:right;
display: inline-block;
min-width:210px;
margin-bottom:16px;
margin-top: 16px;
}
.blog-searchbox form {
margin: 0;
}
.blog-searchbox .fa{
color: #b6bfc8;
font-size: 19px;
}
.blog-searchbox .searchbutton,
.blog-searchbox .searchfield {
color: #b6bfc8;
background-color: #242b32;
}
.blog-searchbox .searchbutton {
display: inline-block;
border: none;
line-height: 20px;
padding: 4px 5px 4px 15px;
height:31px;
vertical-align: middle;
border-top-left-radius: 15px;
border-bottom-left-radius: 15px;

}
.blog-searchbox .searchbutton a:hover,
.blog-searchbox .searchbutton a:focus {
text-decoration: none;
}
.blog-searchbox .searchfield {
border: none;
height: 22px;
line-height:22px;
box-sizing: content-box;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
border-bottom-right-radius: 15px;
border-top-right-radius: 15px;
padding: 4px 6px 5px 6px;
vertical-align: middle;
display: inline-block;
margin-bottom:0;
width:200px;
font-size: 16px;
margin-left: -4px;
outline: none;
}

/* Blog Area And Sidebar Area Styles */
.blog-main,
.blog-aside {
position:relative;
}
.blog-main:before,
.blog-aside:before {
border-left:1px solid #ced5db;
height:100%;
content: "";
position: absolute;
top:0;
width:1px;
}
@media (max-width: 767px) {
.blog-main:before,
.blog-aside:before {

display:none;

}

}
.blog-main{
padding-top:36px;
padding-bottom:20px;
}
.blog-main:before{
right: -16px;
}
@media (min-width: 768px) and (max-width: 979px) {
.blog-main:before{
display:none;
}

}
.blog-aside {
padding-top: 125px;
}

@media (max-width: 767px) {
.blog-aside {
padding-top: 50px;
}

}

.blog-aside:before {
left: 15px;
}

@media (min-width: 768px) and (max-width: 979px) {
.blog-aside:before {
display: none;
}

}

/* The Blog Main Page Styles */
.blog-teaser{
background-color:#ececec;
border-radius:10px;
box-shadow:0px 1px 5px #a8a8a8;
-webkit-box-shadow:0px 1px 5px #a8a8a8;
-moz-box-shadow:0px 1px 5px #a8a8a8;
margin-bottom:40px;
}
@media (min-width: 768px) and (max-width: 979px) {
.blog-teaser{
display:block;
float:none;
width:95%;
}

}
.blog-teaser header{
padding-top:20px;
padding-right:45px;
padding-left:45px;
text-align:center;
}
.blog-teaser header img{
margin-bottom:20px;
border-radius:200px;
}
.blog-teaser header h3{
color:#45a4e;
margin-top:0;
font-size:28px;
margin-bottom:10px;
}
.blog-teaser header h3 a,
.blog-teaser header h3 a:focus,
.blog-teaser header h3 a:hover{
color:#5a6065;
}
.blog-teaser header .meta{
color:#5a6065;
}
.blog-teaser header hr {
border-top-color:#ced5db;
border-bottom: none;
}
.blog-teaser .body{
padding-right:45px;
padding-left:45px;
margin-bottom:10px;
color:#343a3f;
}
.blog-teaser .btn{
float:right;
margin-bottom:18px;
margin-right:45px;
}

/* Blog main page paging */

.paging{
margin-bottom: 20px;
text-align: right;
}
.paging a:hover,
.paging a:focus {
color: #55a773;
}
.paging i {
font-size: 16px;
}

.paging a {
margin-left: 10px;
}

.paging .first i {
margin-right: 5px;
}

.paging .last i {
margin-left: 5px;
}

/* Buttons used in blog */

.btn-blog-one {
color: #ffffff;
border-color: #549f6f;
background-image: linear-gradient(to bottom, #69bc87 0%, #48a068 100%);

}

.btn-blog-one:hover,
.btn-blog-one:focus,
.btn-blog-one:active {
color: #ffffff;
background-color:#4eae71;
}

.btn-xlarge {
padding:12px 46px;
font-size: 20px;
line-height: normal;
border-radius: 5px;
}

/* Blog Sidebar widgets Styles  */

.aside-widget {
margin-bottom:100px;
}
.aside-widget header {
background-image: linear-gradient(to bottom, #f6f5f5 0%, #ebeaea 100%);
border: 1px #ced5db solid;
}

.aside-widget header h3 {
font-size: 24px;
padding: 10px 20px 3px 20px;
margin-top: 0;
color: #48535f;
}
.aside-widget .body {
margin-top: 30px;
padding-left: 20px;
}

.aside-widget a{
color : #5b6268;
}

.re{
color : #8B0000;
}

.blog-list {
list-style:none;
}
.blog-list li {
line-height:23px;
margin-bottom: 14px;
}
.blog-list li a:hover,
.blog-list li a:focus {
color: #55a773;
}

.blog-list li:before {
content: "";
border-color: transparent transparent transparent #757e88;
border-style: solid;
border-width: 3px 8px;
display: block;
width: 8px;
left: -20px;
top: 15px;
position: relative;
}

/* Blog Detail Article Styles */
.blog-post {
margin-bottom:90px;
    margin-left:300px;
}
.blog-post header h1{
font-family : 'PT Serif', serif;
margin-bottom:22px;
}
.blog-post header .lead-image{
position: relative;
}

.blog-post header .lead-image .meta{
padding-left:30px;
padding-bottom:10px;
position:absolute;
bottom:15px;
background-color:rgba(85, 167, 115, 0.85);
color: #ccecd7;
}
.blog-post header .lead-image .meta a{
color:#ccecd7;
}

@media (max-width: 979px) {
.blog-post header .lead-image .meta {
position:relative;
bottom:0;
}

}
.blog-post header .lead-image .meta .author,
.blog-post header .lead-image .meta .date,
.blog-post header .lead-image .meta .comments{
float:left;
margin: 10px 55px 0 0;

}
.blog-post header .lead-image .meta .author .data,
.blog-post header .lead-image .meta .date .data,
.blog-post header .lead-image .meta .comments .data{
line-height: 30px;
}
@media (min-width: 980px) and (max-width: 1199px) {
.blog-post header .lead-image .meta .author,
.blog-post header .lead-image .meta .date,
.blog-post header .lead-image .meta .comments{
margin-right: 20px;
}

}
.blog-post header .lead-image .meta .author i,
.blog-post header .lead-image .meta .date i,
.blog-post header .lead-image .meta .comments i{
font-size:30px;
float:left;
margin-right:10px;
}
.blog-post .body{
margin-top: 20px;
}
@media (min-width: 1200px) {
.blog-post .body{
padding-right: 30px;
}
}

/* Comments Styles */
aside.comments,
aside.create-comment{
margin-bottom:100px;
}
aside.create-comment hr {
width:515px;
margin-left: auto;
margin-right:auto;
border-top-color: #ced5db;
margin-bottom:130px;
}
@media (min-width: 768px) and (max-width: 979px) {
aside.create-comment hr {
width:415px;
}

}
@media (max-width: 767px) {
aside.create-comment hr {
width:100%;
}

}
aside.comments h2,
aside.create-comment h2 {
text-align:center;
font-weight: normal;
margin-bottom:130px;

}
aside.comments h2 i,
aside.create-comment h2 i {
font-size: 36px;
}
aside.comments .comment {
margin: 130px 0 0 0;
}
aside.comments .comment header img {
float:left;
border-radius: 100px;
}
aside.comments .comment header .meta {
margin-left:100px;
font-size:14px;
}
aside.comments .comment .body {
margin-top:10px;
margin-left:100px;
}

.create-comment input,
.create-comment textarea{
margin-top:15px;
}
.create-comment .btn {
margin: 15px 0 0 30px;
float: right;
}

/* About Us Page Styles */
.about hr {
margin-top: 75px;
}
.about-portrait {
float:right;
margin-top:20px;
margin-left: 70px;
border-radius: 180px;
}
@media (max-width: 767px) {
.about-portrait {
float:none;
margin: 40px auto;
}

}
.about-button {
font-weight:bold;
}
.about-bold {
font-weight:bold;
}
.about-italic {
font-style: italic;
}
.about-large,
.about-small {
line-height:60px;
}
@media (max-width: 767px) {
.about-large,
.about-small {
display:block;
}

}
.about-large {
font-size:40px;
}
.about-small {
font-size: 30px;
}
.contact-form input,
.contact-form textarea {
margin-top: 15px;
}
.contact-form .btn {
margin: 15px 0 0 30px;
float:right;
}


/* Footer and Footer Widgets Styles */
.widewrapper.footer {
background-color: #242b32;
color: #b3b5b7;
font-size:14px;
}
.widewrapper.footer a {
color: #7b8690;
}
.widewrapper.footer h3 {
color: #e6e6e6;
}

.footer-widget {
margin-top: 25px;
margin-bottom: 50px;
line-height: 23px;
}
.footer-widget .stats .line {
font-size: 18px;
margin-top: 10px;
}
.footer-widget .stats .line .number {
font-weight: 600;
float: left;
margin-right: 15px;
display: block;
}

.widewrapper.copyright {
background-color: #37424c;
color: #b6bfc8;
padding-top: 15px;
padding-bottom: 15px;
}

.widewrapper.copyright a {
color: #e2e5e9;
}

.footer .blog-list li {
margin-bottom: 5px;
}
.footer .blog-list li a {
color: #b3b5b7;
padding-bottom: 5px;
}
