/*
Theme Name: F2FA-V3
Theme URI: https://face2faceafrica.com
Author: NRS
Author URI: 
Description: Custom theme for F2FA site
Version: 1.0
*/


ins{background-color: transparent;}
.nr-image-full img{width:100% !important;}
.nr-video iframe, .nr-video object, .nr-video embed, .nr-video video{width:100%}  
.nr-post-content img{width:100% !important; height:auto !important;}
.nr-post-content .wp-caption {width: 100% !important; text-align: center;}
.nr-post-content .wp-caption-text{    margin-bottom: 10px;font-size: 1.2em;padding: 8px 0 4px 0;border-bottom: 1px solid #eee;}
.nr-post iframe, .nr-post object, .nr-post embed, .nr-post video{width:100%}

.nr-post-content p.presented-by{margin-bottom:8px;font-weight:bold; font-style:italic;text-transform: lowercase;}
.nr-post-content p.presented-by a{display:inline-block;border:0; text-decoration:none;}
.nr-post-content p.presented-by img{width:auto !important; max-height:50px; max-width:150px !important; margin-left:5px; border:0;}



/* pagination */

.nr-pagination{margin-bottom:20px; text-align: center}
.nr-pagination:before{content: ""; display: block; overflow: hidden; clear: both; height: 0; }
.nr-pagination:after{content: ""; display: block; overflow: hidden; clear: both; height: 0; }
.nr-pagination span{color:#333333; display:inline-block; padding: 0px 8px; font-size:12px; font-weight:bold; line-height:40px; height:40px;min-width:40px;margin-right:5px; margin-bottom:5px; text-align:center;  border-radius: 0 18px 0 18px; border: 1px solid #bdac1f; }
.nr-pagination a{color:#bdac1f}
.nr-pagination a span{color:#bdac1f}
.nr-pagination a:hover span{background:#bdac1f;color:#ffffff}

/* gallery */

.gallery-a { overflow: hidden; position: relative; list-style: none; width: 100%; margin: 0 0 15px !important; list-style-type:none!important; padding: 0; }
.gallery-a li { position: relative; z-index: 1; float: left; margin: 0 13px 13px 0; }
.gallery-a img { border: 1px solid #e4e4e4; }
.gallery-a .bx-pager { position: absolute; left: -3000em; top: 0; }
.gallery-a .bx-pager .bx-pager-item { }
.gallery-a .bx-pager .bx-pager-item a { }
.gallery-a .bx-pager .bx-pager-item a.active { }
.gallery-a .bx-prev, .gallery-a .bx-next { display: block; overflow: hidden; position: absolute; top: 0; width: 37px; height: 70px; z-index: 2; background: #fff; color: #b1a11c; font-weight: 400; font-weight: 400; text-align: left; text-indent: -3000em; text-decoration: none; }
.gallery-a .bx-prev { left: 0; }
.gallery-a .bx-next { right: 0; }
.gallery-a .bx-prev.disabled, .gallery-a .bx-next.disabled { top: -3000em; }
.gallery-a .bx-prev:before, .gallery-a .bx-next:before { display: block; position: absolute; left: 0; top: 50%; width: 100%; margin: -20px 0 0; font-family: i; font-size: 30px; line-height: 40px; text-indent: 0; }
.gallery-a .bx-prev:before { content: "\e924"; }
.gallery-a .bx-next:before { content: "\e922"; text-align: right; }

.gallery-a .bx-prev:hover, .gallery-a .bx-next:hover { color: #000; } 
.gallery-a li:before{ left: -3000em; } 
.gallery-a .inner li img{width:70px !important;height:70px !important; cursor: pointer;} 

.gallery-a-con{text-align:center;position:relative;}
.gallery-a-con img{height:540px !important;width:auto !important;}
.gallery-a-con figcaption{font-size:0.9em;text-align:center}
.nr-gallery .left-arrow,.nr-gallery .right-arrow{text-decoration: none;display: block;width: 30px;height: 40px;margin: -20px 0 0;position: absolute;top: 50%;z-index: 10;overflow: hidden;opacity: 0;cursor: pointer;color: rgba(0, 0, 0, 0.8);font-size:30px;line-height:1;color:#bdac1f;text-shadow: 0px 1px 0 #222;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
.nr-gallery .left-arrow{left:10px;text-align:left}
.nr-gallery .right-arrow{right:10px;text-align:right;}
.gallery-a-con:hover .left-arrow{left:10px;opacity:1}
.gallery-a-con:hover .right-arrow{right:10px;opacity:1}
.nr-gallery .header-a{margin: 10px 0}
.nr-gallery .nrg-description{  margin: 8px 0;font-size: 13px;}

/* sharethis & side share */
.sharethis-inline-share-buttons .st-btn{display:none!important}

.sharethis-inline-share-buttons .st-total{width:70px;margin: 0 -12px;max-width:100px;}
.sharethis-inline-share-buttons .st-total .st-label{font-family: Oswald_web, Oswald, Lato, Arial, Helvetica, sans-serif;font-size: 1.0em !important;line-height: 1.3em;font-weight: 700;color: #252525;}
.sharethis-inline-share-buttons .st-total .st-shares{font-family: Oswald_web, Oswald, Lato, Arial, Helvetica, sans-serif;font-size: 0.6em !important;margin-top: 5px;color: #252525;text-transform: lowercase;}
    
#st-el-5,#st-el-3,#st-el-4,#st-el-6,#st-el-7,#st-el-8,#st-el-9,#st-el-10{z-index: 99999999 !important;}

.social-a li.pi a:hover, .social-a.a li.pi a{
    background:#bd081c;
    border-color:#bd081c; 
    text-align:center;
}

.icon-pinterest:before{
    content: "";
    background-image: url(images/icon-pinterest.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width: 35px;
    height: 35px;
    display: inline-block;
}
.social-a li.cm a:hover, .social-a.a li.cm a{
    background:#bdac31;
    border-color:#bdac31; 
    text-align:center;
}

.icon-comment:before{
    content: "";
    background-image: url(images/icon-comments.png);
    background-repeat: no-repeat;
    background-position: center;
    width: 35px;
    height: 30px;
    display: inline-block;  
}
/* pass protect form */
.nr-post-password-form{}
.nr-post-password-form input[type="password"]{float:left;margin-right:5px;}

/*contact */
.nr-pop-wrap {padding:30px 20px 20px 20px; font: 14px Lato, Arial, Helvetica, sans-serif}
.nr-pop-wrap h3{ text-align:center; margin-bottom:30px;}

.input_row{float:left;width:50%;margin-bottom:15px; padding:0 10px;}
.input_row.ir_full{width:100%;}
.input_row input, .input_row textarea{float:left;width:100%; padding: 8px 10px; height:auto}
.input_row textarea{min-height:75px}
.nr-pop-wrap .pop-error{padding:5px; font-size:12px;  border:1px solid #f1f1f1; color:red; background:#fafafa}
.nr-pop-wrap .pop-sucsses{text-align:center;}

.nr-pop-wrap input,textarea{transition: all .4s ease-in-out;}
.nr-pop-wrap input:hover,textarea:hover{background-color: #bdac1f;color: #fff;}
.nr-pop-wrap .p-close{position:absolute;top:5px;right:15px; font-size:32px; line-height:1;font-family:verdana,arial; color:#bdac1f;}
.wdform_section{width:80%;}
.contact_box_style {margin: 0 auto;text-align: center;width: 55%;}

/* article subcribe form*/
#subscribe-article{
    background:#fff url(images/subscribe-bg.png?v=1);
    background-size:coverbackground: #fff url(images/subscribe-bg.png?v=1);
    background-size: contain;
    padding: 25px 40px 30px;
    border: 1px solid #f2f2f2;
    margin: 5px 0;
}
#subscribe-article h2{
    color: #ab8e09;
    margin: 0;
    font-size: 22px;
    line-height: 24px;
    z-index: 1!important;
}
#subscribe-article > span{
    color: #ab8e09;
    font-size: 15px;
    z-index: 1!important;  
}
#subscribe-article > p{
    margin: 0;
    margin-top: 15px;
    z-index: 1!important;  
}
#subscribe-article input{
    display: block;
    float: left;
    width: 511px;
    height: 40px;
    padding: 0 20px;
    border-radius: 0;
    border: 1px solid #CCC;
    background: #fff;
    color: #666;
    font-size: 16px;
    z-index: 1!important;  
}
    
#subscribe-article button{
    display: block;
    float: right;
    width: 180px;
    height: 40px;
    padding: 0;
    border-radius: 0;
    border: 0;
    background: #ab8e09;
    color: #fff;
    font-weight: 900;
    font-size: 18px;
    z-index: 1!important;  
}
    
#subscribe-article > p:after{ 
    content: "";
    display: block;
    overflow: hidden;
    clear: both;
    height: 0;
}


@media only screen and (max-width: 75em){ /*1200*/
    .gallery-a-con img{height:450px !important;width:auto !important;}
    .nr-gallery{padding-left:0px} 
    
    #subscribe-article input{width:458px;}    
}

@media only screen and (max-width: 62.5em) { /* 1000 */ 
    #nav .nr-menu-links li{float:left !important; width:45% !important;}
    #nav .nr-menu-links .nr-ar{
        text-align: right !important;
        margin-right:5%;
    }    
    #nav .nr-menu-links .nr-al{
        text-align: left !important;
        margin-left:5%;   
    }
    .gallery-a .bx-prev, .gallery-a .bx-next { width: 70px; } 
    .gallery-a-con img{height:450px !important;width:auto !important;} 
    #subscribe-article input{width:458px;}
}
@media only screen and (max-width: 47.5em) { /* 760 */ 
    .gallery-a-con img{max-height:450px; height:auto !important;}
    .nr-gallery .gallery-a,.nr-gallery .header-a{display:none}
    .gallery-a-con .left-arrow{left:10px;opacity:1}
    .gallery-a-con .right-arrow{right:10px;opacity:1}
    .input_row,.input_row .in_text,.input_row label{width:100% !important;}
    
    #subscribe-article{padding: 15px;}
    #subscribe-article input{width:100%;margin-bottom:10px}
    #subscribe-article button{float:none;margin: 10px  auto;}
}

/* sponsored text*/
.sponsored-text{font-family: tahoma !important;font-style: normal!important;;font-size: 11px!important;;border: 1px solid #aaa!important;;padding: 2px!important;text-transform:none!important}
    
/* taboola add css*/
#taboola-below-article-thumbnails .trc_rbox_header_span{color: #4c002d;font-size: 3.032em;font-family: Lato, Arial, Helvetica, sans-serif;font-weight: 700;text-align: left;text-transform: uppercase;margin-bottom: 13px;font-size: 1em;display:block;}
.organic-thumbnails-feed-c .trc_rbox_header_icon_img{height:30px !important;}

.list-top a{font-family:Lato, Arial, Helvetica, sans-serif;}
.list-top li:first-child a{font-family:Oswald_web, Oswald, Lato, Arial, Helvetica, sans-serif;}


/*adminbar*/
#wpadminbar{z-index: 999999999999 !important;}
#wpadminbar #wp-admin-bar-my-account.with-avatar>a img{height:16px !important}

/*footer ad*/
#popin-ad-footer{height:250px;width:450px;position:fixed;z-index:999999;bottom:60px;right:0;}
@media only screen and (max-width: 47.5em) { /* 760 */
    #popin-ad-footer{height:150px;width:250px;}   
}


/*
    Colorbox Core Style:
    The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden; -webkit-transform: translate3d(0,0,0);}
#cboxWrapper {max-width:none;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
.cboxIframe{width:100%; height:100%; display:block; border:0; padding:0; margin:0;}
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}


/* 
    User Style:
    Change the following styles to modify the appearance of Colorbox.  They are
    ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:rgba(0,0,0,0.9); opacity: 0.9; filter: alpha(opacity = 90);}
#colorbox{outline:0;}
    #cboxTopLeft{width:0px; height:0px; }
    #cboxTopRight{width:0px; height:0px;}
    #cboxBottomLeft{width:0px; height:0px; }
    #cboxBottomRight{width:0px; height:0px; }
    #cboxMiddleLeft{width:0px;}
    #cboxMiddleRight{width:0px;}
    #cboxTopCenter{height:0px;}
    #cboxBottomCenter{height:0px;}
    #cboxContent{background:#fff; overflow:hidden;}
        .cboxIframe{background:#fff;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{margin-bottom:28px;}
        #cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;}
        #cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;}
        #cboxLoadingOverlay{background:url(images/loading_background.png) no-repeat center center;}
        #cboxLoadingGraphic{background:url(images/loading.gif) no-repeat center center;}

        /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
        #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; }
        
        /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
        #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}

        #cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}
        #cboxPrevious{position:absolute; bottom:0; left:0; background:url(images/controls.png) no-repeat -75px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxPrevious:hover{background-position:-75px -25px;}
        #cboxNext{position:absolute; bottom:0; left:27px; background:url(images/controls.png) no-repeat -50px 0; width:25px; height:25px; text-indent:-9999px;}
        #cboxNext:hover{background-position:-50px -25px;}
        #cboxClose{position:absolute;color: red;content: "\e90c"; bottom:0; right:0;  width:25px; height:25px; }
        #cboxClose:hover{background-position:-25px -25px;}

/*
  The following fixes a problem where IE7 and IE8 replace a PNG's alpha transparency with a black fill
  when an alpha filter (opacity change) is set on the element or ancestor element.  This style is not applied to or needed in IE9.
  See: http://jacklmoore.com/notes/ie-transparency-problems/
*/
.cboxIE #cboxTopLeft,
.cboxIE #cboxTopCenter,
.cboxIE #cboxTopRight,
.cboxIE #cboxBottomLeft,
.cboxIE #cboxBottomCenter,
.cboxIE #cboxBottomRight,
.cboxIE #cboxMiddleLeft,
.cboxIE #cboxMiddleRight {
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
}

#mc-embedded-subscribe,.button-submit,.button-reset{
background: #bdac1f !important;
border: 1px solid #bdac1f !important;
border-radius: 20px !important;
color: #fff !important;
display: inline-block;
height: auto;
min-width: 140px;
overflow: hidden;
padding: 8px 22px 6px !important;
position: relative !important;
text-align: center !important;
height:auto !important;
text-decoration: none; 
line-height: 25px !important;  
}


