/*
 Theme Name:   Beecoding
 Theme URI:    http://beecoding.com
 Description:  A Child Theme built Beecoding
 Author:       Beecoding
 Author URI:   http://beecoding.com
 Template:     Divi
 Version:      1
 License:      GNU General Public License v2 or later
*/

/* STANDARD PAGE
============= */

/* MENU */

.bc-header-home {
    background: #ffffff !important;
}

.bc-search-home {
    display: none !important;
}

#left-area {
    padding-bottom: 0px; 
}

/* BLOG
============= */

#bc-blog-page {
    text-align: center; 
    width: 100%;
}

.bc-section-content {
    padding: 150px 20px !important;
    width: 100%;
}

.bc-blog-section {
    padding: 100px 20px !important;
}

.bc-content-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
}

#bc-blog-page .et_pb_post {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: calc(33.33333% - 30px);
    max-width: 370px;
    margin: 0 15px 7%;
    vertical-align: top;
    border-radius: 16px;
    border: none;
    padding: 20px; 
    -webkit-box-shadow: 0 18px 50px rgba(0,0,0,.05);
    box-shadow: 0 18px 50px rgba(0,0,0,.05);
    -webkit-transition: all 0.5s ease; 
    -moz-transition: all 0.5s ease; 
    -ms-transition: all 0.5s ease;
    transition: all 0.5s ease;
    background: #fff; 
}

#bc-blog-page .et_pb_post:hover {
    -webkit-box-shadow: 0 18px 80px rgba(0,0,0,.12);
    box-shadow: 0 18px 80px rgba(0,0,0,.12);
}

.bc-custom-header {
    font-size: 22px; 
    line-height: 1.2;
    text-align: left;
    font-weight: bold; 
    margin-bottom: 25px; 
}

#bc-blog-page .post-img   {
    margin: -20px -20px 20px;
    position: relative; 
}

#bc-blog-page .post-img img {
    width: 100%;
    border-radius: 16px 16px 0 0;
}

#bc-blog-page .et_pb_image_container {
    position: relative;
}

.bc-custom-header a {
    display: block;
}

#bc-blog-page .post-img:after  {
    content: url(https://www.razorsocial.com/wp-content/uploads/2019/01/BG-blog_featured-shape.png);
    position: absolute;
    z-index: 9;
    bottom: -10px;
    left: 0;
    right: 0;
    display: block;
    width: 100%;
    height: auto;
    opacity: 1;
    overflow: hidden;
}

#main-content .container:before {
    background-color: transparent;
}

#bc-blog-page .post-content {
    text-align: center;
    font-size: 16px;
    text-transform: uppercase;
    font-weight: bold;
    font-family: 'Exo 2',Helvetica,Arial,Lucida,sans-serif;
}

#bc-blog-page .post-content a {
    font-family: 'Montserrat',Helvetica,Arial,Lucida,sans-serif;
    display: block;
    color: #ffffff;
    font-size: 16px;
    letter-spacing: 2px;
    padding: 0.7em 1.5em;
    border-radius: 100px;
    line-height: 1.3;
    width: 175px; 
    margin: 0 auto -40px;
    background-image: linear-gradient(270deg,#ff5454 0%,#fccf11 100%);
    box-shadow: 0px 10px 29px -9px #ff5454;
    -webkit-transition: all 0.5s ease; 
    -moz-transition: all 0.5s ease; 
    -ms-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

#bc-blog-page .post-content a:hover {
    background-image: linear-gradient(270deg,#fb3a3a 0%,#edc51b 100%);
    box-shadow: none;
}

.bc-img-overlay {
    font-family: etmodules!important;
    display: block;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.6);
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    border-radius: 16px 16px 0 0;
    cursor: pointer;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    transition: all .3s;
}

.bc-img-overlay:before {
    position: absolute;
    top: 55%;
    left: 50%;
    margin: -16px 0 0 -16px;
    font-size: 32px;
    content: "\e02c";
    color: #fff; 
    -webkit-transition: all .4s;
    -moz-transition: all .4s;
    transition: all .4s;
}

#bc-blog-page .et_pb_post:hover  .bc-img-overlay {
    opacity: 1;
}


#bc-blog-page .post-block , #bc-blog-page .post-block .bc-blog-title {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

#bc-blog-page .post-block .bc-blog-title {
    align-items: center;
    justify-content: center;
}

.bc-blog .post-content p {
    display: none;
}

.wp-pagenavi {
    border-top: none;
    text-align: center;
    margin-bottom:0px;
}

.wp-pagenavi a, .wp-pagenavi span {
    font-size: 16px !important;
    background: #EEF3F6;
    padding: 10px;
    font-weight: bold !important;
}

.wp-pagenavi span.current,
.wp-pagenavi a:hover {
    color: #302d2b !important;
    background: none;
}

.wp-pagenavi .extend {
    display: none;  
}

/* BLOG HEADER */

.bc-header-post {
    background-image: linear-gradient(180deg,#fffcf8 0%,#fcf2e3 100%)!important;
    padding-top: 80px;
    padding-bottom: 200px;
    position: relative;
}

.bc-header-post:after {
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDBweCIgdmlld0JveD0iMCAwIDEyODAgMTQwIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxnIGZpbGw9IiNmZmZmZmYiPjxwYXRoIGQ9Ik0xMjgwIDMuNEMxMDUwLjU5IDE4IDEwMTkuNCA4NC44OSA3MzQuNDIgODQuODljLTMyMCAwLTMyMC04NC4zLTY0MC04NC4zQzU5LjQuNTkgMjguMiAxLjYgMCAzLjRWMTQwaDEyODB6IiBmaWxsLW9wYWNpdHk9Ii4zIi8+PHBhdGggZD0iTTAgMjQuMzFjNDMuNDYtNS42OSA5NC41Ni05LjI1IDE1OC40Mi05LjI1IDMyMCAwIDMyMCA4OS4yNCA2NDAgODkuMjQgMjU2LjEzIDAgMzA3LjI4LTU3LjE2IDQ4MS41OC04MFYxNDBIMHoiIGZpbGwtb3BhY2l0eT0iLjUiLz48cGF0aCBkPSJNMTI4MCA1MS43NmMtMjAxIDEyLjQ5LTI0Mi40MyA1My40LTUxMy41OCA1My40LTMyMCAwLTMyMC01Ny02NDAtNTctNDguODUuMDEtOTAuMjEgMS4zNS0xMjYuNDIgMy42VjE0MGgxMjgweiIvPjwvZz48L3N2Zz4=);
    background-repeat-y: no-repeat;
    background-size: 100% 100px;
    bottom: 0;
    height: 100px;
    z-index: 1;
}

.bc-header-content {
    position: relative;
    max-width: 1080px;
    margin: auto;
}

.bc-header-content h3 {
    font-weight:  bold;
    background: -webkit-linear-gradient(#2f4958,#006a7a);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* SINGLE */

#bc-single-page {
    width: 800px !important; 
    max-width: 100%;
    margin: 0 auto;
}

#bc-single-page .post-title  {
    text-align: center;
    line-height: 1.1;
    margin-bottom: 30px;
}

#bc-single-page .et_pb_post ul, #bc-single-page .et_pb_post ol{
    padding-left: 25px;
    margin-bottom: 20px; 
    margin-left: 20px;
}

#bc-single-page .et_pb_post ul li{
    list-style: disc;
}


#bc-single-page .et_pb_post ol li {
    list-style: decimal;
}

.form-submit .et_pb_button {
    font-family: 'Montserrat',Helvetica,Arial,Lucida,sans-serif;
    display: block;
    color: #ffffff;
    font-size: 16px;
    letter-spacing: 2px;
    padding: 0.7em 1.5em !important;
    border-radius: 100px;
    line-height: 1.3;
    border: none; 
    margin: 0 auto -40px;
    background-image: linear-gradient(270deg,#ff5454 0%,#fccf11 100%);
    box-shadow: 0px 10px 29px -9px #ff5454;
    -webkit-transition: all 0.5s ease; 
    -moz-transition: all 0.5s ease; 
    -ms-transition: all 0.5s ease;
    transition: all 0.5s ease;
}
.form-submit .et_pb_button:hover {
    background-image: linear-gradient(270deg,#fb3a3a 0%,#edc51b 100%);
    box-shadow: none;
}

#commentform {
    padding-bottom: 0px;
}

/* SEARCH */

.bc-category {
    display: block;
    width: 100%;
    text-align: left; 
}

.bc-header-page-title h1 {
    padding: 0;
    margin: 0;
    line-height: 1.2;
    margin-bottom: 30px;
}

/* FOOTER 
============= */

#footer-widgets {
    display: none;
}

.bc-footer-section .container{
    padding: 30px 0;
   /* border-top: 2px solid rgba(255,255,255,0.1); */
    overflow: hidden;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
}

.bc-footer-copyright, .bc-social-icons {
    float: left;
    width: 50%;
}

.bc-footer-copyright p {
    font-size: 16px;
    color: rgba(255,255,255,0.2);
}

.bottom-nav {
    padding: 0;
}

.bottom-nav li {
    line-height: 1; 
}

.bottom-nav li a{
    font-weight: normal; 
}

.bottom-nav a:hover {
    opacity: 1;
    color: #FBCF14;
}

.bc-social-icons {
    text-align: right;
}

.bc-social-icons li{
    display: inline-block;
    margin-right: 5px;
}

.bc-social-icons li:last-child {
    margin-right: 0px;
}

.bc-social a {
    width: 32px;
    height: 32px;
    display: inline-block;
    text-align: center;
    color: #fff;
    border-radius: 50%;
    font-size: 15px;
    line-height: 2.2;
    -webkit-transition: all 0.4s ease; 
    -moz-transition: all 0.4s ease; 
    -ms-transition: all 0.4s ease; 
    transition: all 0.4s ease;
}

.bc-social a > span {
    display: none;
}

.bc-social a:before {
    font-family: ETmodules!important;
}

.bc-social-google a {
    background-color: #dd4b39;
}

.bc-social-google a:hover {
    background-color: #fff;
    color: #dd4b39;
}

.bc-social-pinterest a {
    background-color: #C62026;
}

.bc-social-pinterest a:hover {
    background-color: #fff;
    color: #C62026;
}

.bc-social-twitter a {
    background-color: #00aced;
}

.bc-social-twitter a:hover {
    background-color: #fff;
    color: #00aced;
}

.bc-social-facebook a {
    background-color: #3b5998;
}

.bc-social-facebook a:hover {
    background-color: #fff;     
    color: #3b5998;
}

.bc-social-youtube a {
    background-color: #c4302b;
}

.bc-social-youtube a:hover {
    background-color: #fff;
    color: #c4302b;
}

.bc-social-rss a {
    background-color: #EF9435;
}

.bc-social-rss a:hover {
    background-color: #fff;
    color: #EF9435;
}

.bc-social-facebook a:before {
    content: "\e093";
}

.bc-social-google a:before {
    content: "\e096";
}

.bc-social-pinterest a:before {
    content: "\e095";
}

.bc-social-twitter a:before {
    content: "\e094";
}

.bc-social-youtube a:before {
    content: "\e0a3";
}

.bc-social-rss a:before {
    content: "\e09e";
}

/* HELPERS
=============== */

.bc-desktop-right {
    text-align: right;
}

/* MEDIA QUERY
=============== */

@media screen and (max-width:1280px) {
	.bc-header-content {
		padding-left: 20px; 
		padding-right: 20px;
	}
}

@media screen and (max-width:980px) {
    .bottom-nav {
        text-align: left !important;
    }
    #bc-blog-page .et_pb_post {
        width: calc(50% - 45px);
        max-width: 400px; 
        margin-right: 15px;
        margin-left: 15px;
        transition: all 300ms;
    }
    .bc-section-content {
        padding: 100px 20px 50px !important;
    }
    .bc-footer-section .container {
        display: block;
    }
    .bc-blog-section {
        padding: 50px 20px !important;
    }
    .bc-header-post:after {
        height: 70px;
        background-size: 100% 70px;
    }
    .bc-header-post {
        padding-top: 50px;
        padding-bottom: 150px;
    }
}

@media screen and (max-width: 768px) {
    .bc-custom-header {
        font-size: 18px; 
    }
}

@media screen and (max-width:767px) {
    
    .container {
        width: 90%;
    }
    .bc-header-post:after {
        height: 30px;
        background-size: 100% 30px;
    }
    .bc-header-post {
        padding-bottom: 80px;
    }
    .bc-footer-copyright, .bc-social-icons {
        width: 100%;
        float: none;
    }
    .bc-social-icons {
        text-align: left; 
    }
    #main-footer, .bottom-nav a {
        font-size: 14px !important; 
    }
    .bottom-nav li {
        padding-right: 10px;
    }
    #bc-blog-page .post-content {
        font-size: 13px; 
    }
    .bc-desktop-right {
        text-align: left;
    }
    #footer-widgets {
        padding: 30px 0;
    }
    #footer-widgets .footer-widget .fwidget, #footer-widgets .footer-widget:nth-child(n) {
        margin-bottom: 30px !important;
    }
    #footer-widgets .footer-widget:last-child {
        margin-bottom: 0px !important;
    }
}


@media screen and (max-width: 600px) {
    #bc-blog-page .et_pb_post {
        width: 100%; 
        margin: 0 auto 12%;
    }
}