/*
Theme Name: Butterfly Abode
Theme URI: http://www.logicbaseinteractive.com/butterfly-wordpress-theme-premium/
Author: Logicbase Interactive
Author URI: http://www.logicbaseinteractive.com
Description: Butterfly Abode is a simple and beautiful blog theme that will give life to your posts and pages. It has a beautiful color pallete that will attract your website visitors. Make your images standout with its simple effects that can make your visitors open your blog posts. Butterfly Abode has flat and clean design perfect for the interactive slider that supports featured posts. Butterfly Abode also gives you the power to add your social media links, change slider background and more. Being SEO friendly and with mobile responsive design, your blog will visually impress your visitors.
Version: 1.0.3
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: butterfly
Tags: green, red, orange, yellow, fluid-layout, two-columns, right-sidebar, responsive-layout, custom-menu, featured-images
*/
/* =WordPress Core
-------------------------------------------------------------- */
.alignnone {
    margin: 5px 20px 20px 0;
}

.aligncenter,
div.aligncenter {
    display: block;
    margin: 5px auto 5px auto;
}

.alignright {
    float:right;
    margin: 5px 0 20px 20px;
}

.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.alignright {
    float: right;
    margin: 5px 0 20px 20px;
}

a img.alignnone {
    margin: 5px 20px 20px 0;
}

a img.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
}

a img.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto
}

.wp-caption {
    background: #fafafa;
    border: 1px solid #ddd;
    max-width: 96%; /* Image does not overflow the content area */
    padding: 5px 3px 10px;
    text-align: center;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.5)
}

.wp-caption.alignnone {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignleft {
    margin: 5px 20px 20px 0;
}

.wp-caption.alignright {
    margin: 5px 0 20px 20px;
}

.wp-caption img {
    border: 0 none;
    height: auto;
    margin: 0;
    max-width: 98.5%;
    padding: 0;
    width: auto;
}

.wp-caption p.wp-caption-text {
    font-size: 11px;
    line-height: 17px;
    margin: 0;
    padding: 0 4px 5px;
}

/* Text meant only for screen readers. */
.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
	height: 1px;
	width: 1px;
	overflow: hidden;
}

.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-size: 0.875rem;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000; /* Above WP toolbar. */
}
.gallery-caption {
  margin: 0;
}
.bypostauthor {}
.size-auto, 
.size-full,
.size-large,
.size-medium,
.size-thumbnail {
  max-width: 100%;
  height: auto;
}
/*HEADER*/
header#header {
  background: #fcfaee none repeat scroll 0 0;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.7);
}
.logo-cont {
  position: relative;
}
.logo {
  display: block;
  left: 0;
  position: absolute;
  top: 0;
  z-index: 1;
}
.logo img {
  max-width: 100%;
  margin: 30px;
}
.top-head {
  background: #f04155 none repeat scroll 0 0;
  padding: 12px 0;
}
.top-head, .top-head p, .top-head a {
  color: #ffffff;
  font-size: 16px;
  line-height: 1;
  margin: 0;
}
.top-head-content, .main-menu {
  float: right;
  text-align: right;
}
.mid-head {
  min-height: 100px;
}
.bot-head {
  background: #95cfb7 none repeat scroll 0 0;
}
.main-menu div > ul {
  margin: 0;
  padding: 0;
}
.main-menu div > ul li {
  display: inline-block;
  padding: 20px 10px 15px;
  border-bottom: 5px solid transparent;
  position: relative;
}
.main-menu ul li ul {
  background: #ff823a none repeat scroll 0 0;
  display: none;
  left: 0;
  list-style: outside none none;
  margin: 0;
  padding: 0;
  position: absolute;
  text-align: left;
  top: 58px;
  width: 150px;
  z-index: 1;
}
.main-menu div > ul li ul li {
  border-bottom: 1px solid #f04155;
  display: block;
  padding: 3px 5px;
}
.main-menu div > ul li ul li a {
  font-weight: 600;
  font-size: 14px;
}
.main-menu ul li ul li ul {
  left: 150px;
  top: 0;
}
.main-menu ul li ul li ul li ul {
  left: 100%;
  top: 0;
}
.main-menu div > ul li ul li:hover {
  background: #fff7bd none repeat scroll 0 0;
}
.main-menu div > ul li ul li:hover a {
  color: #333333;
}
.main-menu div > ul > li.current-menu-item, .main-menu div > ul > li:hover {
  border-bottom: 5px solid #ff823a;
}
.main-menu ul li a {
  color: #ffffff;
  display: block;
  font-size: 18px;
  font-weight: 600;
  letter-spacing: 1px;
  line-height: 1;
  text-transform: uppercase;
}
.main-menu ul li a:hover {
  text-decoration: none;
}
.mobile-menu {
  display: none;
}
.mobile-menu > a {
  color: #ffffff;
  display: inline-block;
  font-size: 30px;
  padding: 8px 15px;
  outline: none !important;
}
.mm-menu.mm-offcanvas {
  z-index: 99;
}
.mm-menu {
  background: #95cfb7 none repeat scroll 0 0;
}
.mm-listview > li > a, .mm-listview > li > span {
  color: #fff;
  text-transform: uppercase;
}
.mm-menu > .mm-navbar {
  background: #F04155;
}
.mm-menu > .mm-navbar > a{
  color: #fff;
}



/*CONTENT*/
.home-content {
  margin-top: 50px;
}
.home-slider-area {
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  background-color: #f04155;
  background-position: center;
  height: 350px;
  padding: 50px 0;
}
.home-slide {
  border: 5px solid #95cfb7;
  box-shadow: 1px 1px 1px inset;
  height: 205px;
  margin: 10px;
  position: relative;
  width: 240px;
  
  overflow: hidden;
}
.home-slide-bg {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 100%;
  position: absolute;
  transition: all 300ms ease 0s;
  width: 100%;
}
.home-slide:hover .home-slide-bg {
  transform: scale(1.10);
}
.home-slide.slick-slide.slick-current.slick-active.slick-center {
  border-color: #ff823a;
  box-shadow: 0 2px 2px #999999;
  height: 230px;
  margin: 0 10px 10px;
  transition: all 300ms ease 0s;
}
.home-slide a {
  background: rgba(0, 0, 0, 0.3) none repeat scroll 0 0;
  display: block;
  height: 100%;
  position: absolute;
  width: 100%;
  transition: all 300ms ease 0s;
  z-index: 1;
}
.home-slide a:hover{
  background: transparent;
}
.home-slide-content {
  color: #ffffff;
  display: table;
  height: 100%;
  position: absolute;
  text-align: center;
  width: 100%;
}
.home-slide-meta h3 {
  display: inline-block;
  font-weight: 600;
  position: relative;
  z-index: 1;
}
.post-box-read-more:hover {
  background: #f04155 none repeat scroll 0 0;
  color: #ffffff;
  text-decoration: none;
}
.home-slide-meta {
  display: table-cell;
  vertical-align: middle;
  transition: all 300ms ease 0s;
}
.home-slide:hover .home-slide-meta {
  transform: scale(0);
}


.home-slider-area .slick-prev, .home-slider-area .slick-next {
  z-index: 1;
}
.home-slider-area .slick-prev {
  left: 10px;
}
.home-slider-area .slick-next {
  right: 10px;
}
.archive-content {
  margin: 50px 0 0; 
}
.posts-content {
  background: #fcfaee none repeat scroll 0 0;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.7);
}
.post-boxes {
  padding-bottom: 10px;
  padding-top: 15px;
}
.show-more-area {
  padding: 20px 0;
  text-align: center;
}
.show-more > a {
  background: #f04155 none repeat scroll 0 0;
  color: #ffffff;
  display: inline-block;
  font-weight: 600;
  padding: 10px;
  text-transform: uppercase;
}
.show-more > a:hover {
  text-decoration: none;
}
.post-box {
  margin-bottom: 30px;
}
.post-box-thumbnail {
  position: relative;
}
.post-box-thumbnail.with-thumb {
  box-shadow: 0 2px 3px rgba(0, 0, 0, 0.5);
  height: 240px;
  overflow: hidden;
}
.with-thumb .post-box-bg {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  display: block;
  height: 240px;
  position: absolute;
  transition: all 300ms ease 0s;
  width: 100%;
}
.with-thumb .post-box-bg:hover {
  transform: scale(1.08);
}
.post-box-cats {
  background: #95cfb7 none repeat scroll 0 0;
  font-size: 0;
}
.with-thumb .post-box-cats {
  bottom: 0;
  left: 0;
  position: absolute;
}
.post-box-cats > a {
  color: #ffffff;
  display: inline-block;
  padding: 0 5px;
  text-transform: uppercase;
  font-size: 12px;
  line-height: 15px;
}
.post-box-cats > a:nth-child(3n+1) {
  background: #f04155 none repeat scroll 0 0;
}
.post-box-cats > a:nth-child(3n+2) {
  background: #ff823a none repeat scroll 0 0;
}
.post-box-cats > a:nth-child(3n+3) {
  background: #fff7bd none repeat scroll 0 0;
  color: #333;
}
.post-content {
  background: #95cfb7 none repeat scroll 0 0;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.5);
  color: #ffffff;
  padding: 10px 10px 20px;
}
.post-content h3 {
  border-bottom: 1px solid #fff;
  margin: 0;
}
.post-content h3:hover { 
  text-decoration: none;
}
.posts-content > h3 {
  display: table;
  font-weight: 600;
  margin: 20px auto;
  position: relative;
  text-align: center;
  text-transform: uppercase;
}
.posts-content > h3::before {
  background: #95cfb7 none repeat scroll 0 0;
  bottom: -5px;
  content: "";
  height: 2px;
  left: 0;
  position: absolute;
  width: 50%;
}
.posts-content > h3::after {
  background: #f04155 none repeat scroll 0 0;
  bottom: -5px;
  content: "";
  height: 2px;
  position: absolute;
  right: 0;
  width: 50%;
}
.post-date {
  font-size: 12px;
  font-weight: 600;
  margin: 0 0 10px;
  text-transform: uppercase;
}
.post-content h3 a {
  color: #fff;
}
.post-content h3 a:hover {
  text-decoration: none;
}
.post-box-comment {
  color: #ffffff;
}
.post-box-read-more {
  background: #ff823a none repeat scroll 0 0;
  color: #ffffff;
  float: right;
  font-weight: 400;
  padding: 5px;
  text-transform: uppercase;
}
.post-box.sticky-post .post-content {
  background: #fff7bd none repeat scroll 0 0;
  color: #333333;
}
.sticky-post .post-content h3 {
  border-color: #333;
}
.sticky-post .post-content h3 a {
  color: #333333;
}
.sticky-post .post-box-comment {
  color: #333333;
}

/*SIDEBAR*/
.sidebar {
}
.widget-box {
  background: #fcfaee none repeat scroll 0 0;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.7);
  margin: 0 0 20px;
}
.widget-title {
  background: #f04155 none repeat scroll 0 0;
  border-right: 10px solid #95cfb7;
  color: #ffffff;
  font-size: 18px;
  font-weight: 600;
  margin: 0 0 10px;
  padding: 5px 5px 5px 10px;
  position: relative;
  text-transform: uppercase;
}
.widget-title::after {
  font-family: FontAwesome;
  font-size: 16px;
  font-style: normal;
  font-weight: normal;
  position: absolute;
  right: 10px;
  top: 5px;
}
.widget_archive .widget-title::after {
  content: "\f187";
}
.widget_calendar .widget-title::after {
  content: "\f073";
}
.widget_pages .widget-title::after {
  content: "\f02d";
}
.widget_categories .widget-title::after {
  content: "\f022";
}
.widget_tag_cloud .widget-title::after {
  content: "\f02b";
}
.widget_search .widget-title::after {
  content: "\f002";
}
.widget_nav_menu .widget-title::after {
  content: "\f0ca";
}
.widget_recent_comments .widget-title::after {
  content: "\f075";
}
.widget_recent_entries .widget-title::after {
  content: "\f044";
}
.widget_rss .widget-title::after {
  content: "\f143";
}
.widget_meta .widget-title::after {
  content: "\f0e4";
}
.widget_rss .widget-title a {
  color: #ffffff;
}
.widget_rss .widget-title a > img {
  display: none;
}
.widget_nav_menu .widget-content ul {
  padding: 0;
}
.widget_nav_menu ul, .widget_nav_menu .widget-content ul li > ul {
  padding-left: 10px;
}
.widget_nav_menu ul li a {
  background: #95cfb7 none repeat scroll 0 0;
  border-bottom: 1px solid #ff823a;
  color: #ffffff;
  display: block;
  padding: 3px 2px 3px 10px;
}
.widget-content ul.sub-menu li a {
  border-left: 2px solid #ff823a;
}
.widget_nav_menu ul li a:hover, .widget_nav_menu ul li.current-menu-item a {
  background: #ff823a none repeat scroll 0 0;
  border-bottom: 1px solid #95cfb7;
  color: #ffffff;
  text-decoration: none;
}
.widget_calendar table {
  margin: 0 auto;
}
.widget_calendar caption {
  background: #f04155 none repeat scroll 0 0;
  color: #ffffff;
}
.widget_calendar th {
  background: #95cfb7 none repeat scroll 0 0;
  padding: 5px;
}
.widget_calendar td {
  background: #fff7bd none repeat scroll 0 0;
  padding: 5px;
  text-align: center;
}
td#today {
  background: #ff823a none repeat scroll 0 0;
  color: #fff;
}


.widget_recent_entries .widget-content {
  padding: 0 0 15px;
}
.widget_recent_entries .widget-content > ul {
  padding: 0;
}
.widget_recent_entries .widget-content > ul li::before {
  content: none;
}
.widget_recent_entries .widget-content > ul li {
  border-bottom: 1px solid #dddddd;
  padding: 5px 10px;
}
.widget_recent_entries .widget-content > ul li:last-child {
  border: medium none;
}
.widget_recent_entries .widget-content > ul li a {
  font-size: 16px;
}
.widget_recent_entries .widget-content > ul li .post-date {
  display: block;
  margin: 0;
  text-transform: none;
}
.widget-content {
  padding: 0 0 20px;
}
.widget-content img{
  max-width: 100%;
}
.widget-content  ul {
  list-style: none;
  margin: 0;
  padding: 0 0 0 15px;
}
.widget-content ul li {
  color: #333333;
  margin: 5px 0;
  position: relative;
}
.widget-content ul li > ul {
  padding-left: 20px;
  list-style: none;
}
.widget-content ul li::before {
  content: "";
  display: inline-block;
  height: 6px;
  left: -15px;
  position: absolute;
  top: 7px;
  width: 6px;
}
.widget-content > ul li:nth-child(4n+1):before {
  background: #f04155 none repeat scroll 0 0;
}
.widget-content > ul li:nth-child(4n+2):before {
  background: #ff823a none repeat scroll 0 0;
}
.widget-content > ul li:nth-child(4n+3):before {
  background: #f2f26f none repeat scroll 0 0;
}
.widget-content > ul li:nth-child(4n+4):before {
  background: #95cfb7 none repeat scroll 0 0;
}
.widget-content > ul li:before {
  content: '';
}
.widget-content > ul li a {
}
.widget-box .search-field {
  border: 1px solid #95cfb7;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  box-sizing: border-box;
  height: 40px;
  padding: 10px;
  width: 80%;
}
.widget-box select,
.widget-box select {
  border: 1px solid #95cfb7;
  box-sizing: border-box;
  padding: 10px;
}

.post-search .btn.btn-search,
.widget-box .btn.btn-search {
  background: #F04155 none repeat scroll 0 0;
  border: medium none;
  color: #ffffff;
  height: 40px;
  width: 15%;
}
.widget-box select,
.widget-box input,
.widget-box textarea  {
  max-width: 100%;
}
.widget-content > ul,
.widget-content > select {
  margin: 0 15px;
}
.widget-content > .search-form,
.widget-content .textwidget,
.widget-content .tagcloud,
.widget_nav_menu .widget-content > div {
  padding: 0 15px;
}
.widget-content > .search-form {
  padding-top: 10px;
}

/*SINGLE*/
.single-content {
  margin: 50px 0;
}
.single-content img {
  max-width: 100%;
  height: auto;
}
.the-post {
  background: #fcfaee none repeat scroll 0 0;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.7);
  font-size: 16px;
  padding: 0 20px 30px;
}
.post-title-area {
  padding: 30px 0 0;
  border-bottom: 2px solid #95CFB7;
}
.the-post .post-title-area h2 {
  border-bottom: 2px solid #f04155;
  display: inline-block;
  margin: 0;
  padding: 0 0 10px;
  position: relative;
  top: 2px;
}
.post-meta-area {
  
}
.post-meta-area .the-post-date {
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
}
.post-content-area {
  margin: 30px 0 50px;
}
.the-post h1, .the-post h2, .the-post h3, .the-post h4, .the-post h5, .the-post h6 {
  margin: 10px 0 20px;
  font-weight: 600;
}
.post-search .search-field, .the-post input, .the-post select .the-post textarea {
  border: 1px solid #95cfb7;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
  box-sizing: border-box;
  padding: 10px 5px;
}
.the-post input[type="submit"], .the-post button {
  background: #ff823a none repeat scroll 0 0;
  border: medium none;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
  color: #ffffff;
  display: inline-block;
  padding: 10px;
  text-transform: uppercase;
}
.post-search { margin-bottom: 40px; }
.error404 .post-search button.btn-search, .search .post-search button.btn-search {
  width: 60px;
}

/*pagination*/
.post-link-pages-area {
  font-weight: bold;
}
.post-link-pages-area span {
  background: #ff823a none repeat scroll 0 0;
  color: #ffffff;
  display: inline-block;
  line-height: 1;
  padding: 5px;
}
.post-link-pages-area a span {
  background: #95cfb7 none repeat scroll 0 0;
}

/*tags*/
.the-post-footer {
  border-top: 1px solid #dddddd;
  padding: 10px 0 20px;
}
.post-tags-area {
  font-weight: 600;
}
.post-tags-area > a {
  color: #ffffff;
  display: inline-block;
  font-size: 12px;
  font-style: italic;
  font-weight: normal;
  padding: 0 5px;
  text-transform: uppercase;
}
.post-tags-area > a:nth-child(3n+1){
  background: #f04155;
}
.post-tags-area > a:nth-child(3n+2){
  background: #ff823a;
}
.post-tags-area > a:nth-child(3n+3){
  background: #f2f26f;
  color: #333;
}
.post-tags-area > a:nth-child(3n+4){
  background: #fff7bd;
  color: #333;
}
.post-tags-area > a:nth-child(3n+5){
  background: #95cfb7;
}

/*post-navigation*/
.post-navigation-area {
  padding: 20px;
}
.post-nav {
  height: 120px;
  display: table;
}
.post-nav-bg {
  background-color: #fff7bd;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  display: table-cell;
  vertical-align: middle;
}
.post-nav-bg a {
  background: rgba(240, 65, 85, 0.7) none repeat scroll 0 0;
  color: #ffffff;
  display: inline-block;
  padding: 5px 10px 5px 30px;
  position: relative;
}
.post-nav-bg a::before {
  content: "\f053";
  font-family: FontAwesome;
  font-size: 16px;
  font-style: normal;
  font-weight: normal;
  left: 10px;
  position: absolute;
  top: 20%;
}
.post-nav-bg a[rel="next"] {
  padding: 5px 30px 5px 10px;
}
.post-nav-bg a[rel="next"]::before {
  content: "\f054";
  left: auto;
  right: 10px
}

/*comments*/
.commentlist {
  background: #fff7bd none repeat scroll 0 0;
  list-style: outside none none;
  padding: 10px;
}
.commentlist .comment {
  background: #fcfaee none repeat scroll 0 0;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
  margin: 0 0 10px;
  padding: 55px 10px 10px;
  position: relative;
}
.comment-body {
  background: #fcfaee none repeat scroll 0 0;
  font-size: 14px;
}
.comment-author.vcard {
  background: #95cfb7 none repeat scroll 0 0;
  color: #ffffff;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
}
.comment-author.vcard img {
  border: 2px solid #f2f26f;
  margin: 5px;
}
.comment-author .url {
  color: #ffffff;
  font-style: normal;
  font-weight: bold;
  text-decoration: underline;
}
.comment-meta.commentmetadata {
  background: #f04155 none repeat scroll 0 0;
  padding: 0 5px;
  position: absolute;
  right: 0;
  top: 0;
}
.comment-meta.commentmetadata a {
  color: #ffffff;
  font-size: 12px;
}
.commentlist ol.children {
  list-style: outside none none;
}
.comment-form label {
  float: left;
  width: 10%;
}

/*FOOTER*/
footer#footer {
  background: #95cfb7 none repeat scroll 0 0;
  margin: 50px 0 0;
  padding: 50px 0 0;
}
.footer-box .widget-title {
  border-bottom: 2px solid #f04155;
  border-right: none;
  background: transparent;
  color: #333333;
  display: inline-block;
  font-weight: 600;
  margin: 10px;
  padding: 5px 5px 5px 0;
}
.footer-box .widget-title::after {
  content: none;
}
.footer-box.widget_rss .widget-title a {
  color: #333;
}
.bot-footer {
  background: #f04155 none repeat scroll 0 0;
  color: #ffffff;
  padding: 20px 0;
}
.b2top {
  color: #fff;
  font-size: 22px;
}


/*RESPONSIVE*/

@media only screen and ( max-width: 992px ) {
  .mobile-menu {
    display: block;
  }
  .main-menu {
    display: none;
  }
  .widget-content > select {
    margin: 0 5px;
  }
}

@media only screen and ( max-width: 767px ) {
  .container {
    width: 300px;
  }
    .sidebar {
    margin-top: 30px;
  }
  #home-slider {
    width: 90%;
    margin: 0 auto;
  }
  .mid-head {
  display: none;
}
.logo {
  margin: 10px auto;
  max-width: 120px;
  position: relative;
}
.single-content {
  margin: 20px 0;
}
.top-head-content .col-md-6 {
  text-align: center;
  margin: 5px 0;
}
.mobile-menu {
  text-align: center;
  float: none !important;
}
.mobile-menu > a {
  font-size: 16px;
}