/*
Theme Name: Esilverconnect
Theme URI: https://evangelismbgi.com/themes/evangelismbgi/
Author: the Esilverconnect team
Author URI: https://esilverconnect.com/
Description: Esilverconnect is a modernized take on an ever-popular WordPress layout — the horizontal masthead with an optional right sidebar that works perfectly for blogs and websites. It has custom color options with beautiful default color schemes, a harmonious fluid grid using a mobile-first approach, and impeccable polish in every detail. Twenty Sixteen will make your WordPress look beautiful everywhere.
Version: 1.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: black, blue, gray, red, white, yellow, dark, light, one-column, two-columns, right-sidebar, fixed-layout, responsive-layout, accessibility-ready, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-images, flexible-header, microformats, post-formats, rtl-language-support, sticky-post, threaded-comments, translation-ready
Text Domain: evangelismbgi

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

@import url(https://fonts.googleapis.com/css?family=Oswald:400,300,700);
/* default */
h1,h2,h3,h4,h5{ padding:0; margin:0; }
.hidden{ text-indent:-999em; overflow:hidden;}
hr.hide-line{ padding:0; margin:0; display:none;}
.clear{ clear:both;}
.clearfix:after {content:"."; display:block; height:0; clear:both;visibility:hidden;}
.clearfix {display:inline-block;}

/* Hide from IE Mac \*/
.clearfix {display:block;}/* End hide from IE Mac */

/*nojavascript*/
.nojavascript{ position:absolute; z-index:1; color:red; background:#fff; font:bold 12px 'Trebuchet MS',Arial,georgia, San-serif; border:2px red dashed; width:990px; top:0; left:50%; margin-left:-495px; }


/* Removed all default styles */
body {
    background-color: white;
    margin: 0;
}

/*************************
**************************
    Most Used Styles
**************************
*************************/

* {
    box-sizing: border-box;
}
div#fancybox-wrap,
div#fancybox-wrap *,
div[id^=cat_gal],
div[id^=cat_gal] *{
    box-sizing: content-box;
}

.width_1440 {
    max-width: 1440px;
    min-width: 1200px;
    margin: auto;
}

/*Change depending on size of content based on design*/
.width_content {
    width: 1200px;
    margin: auto;
}

.margin-padding-0 {
    margin: 0;
    padding: 0;
}

img {
    vertical-align: middle;
}


.nav-item ul li a{ text-decoration: none; color: white;}
.nav-item ul li a:hover, .nav-item ul li.active-menu a{ color:gold; text-decoration: underline;}

/*Social Icons*/
/*Social Icons*/
.social-icons, 
.social-icon {
    margin: 0;
    padding: 0;
}

.social-icons {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    list-style: none;
}
.social-icon {
    margin-right: 10px;
}
.social-icon:last-child {
    margin-right: 0px;
}

.usual-lettering {
    font-family: 'Oswald', sans-serif;
    font-weight: 300;
    text-transform: uppercase;
    color: #008B00;
}

.usual-mistral {
    font-family: 'Mistral', cursive;
    font-size: 50px;
    font-weight: 400;
    font-size: 50px;
}
.usual-mistral span {
    font-size: 25px;
    font-family: 'Oswald', sans-serif;
    font-weight: 300;
    text-transform: uppercase;
    color: #008B00;
}

/*************************
**************************
    Fonts
**************************
*************************/

@font-face {
    font-family: 'mistralregular';
    src: url('fonts/mistral-webfont.eot');
    src: url('fonts/mistral-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/mistral-webfont.woff2') format('woff2'),
         url('fonts/mistral-webfont.woff') format('woff'),
         url('fonts/mistral-webfont.ttf') format('truetype'),
         url('fonts/mistral-webfont.svg#mistralregular') format('svg');
    font-weight: normal;
    font-style: normal;
}


/*************************
**************************
   Header-Banner stuff
**************************
*************************/

#header-banner {
    background-image: url(images/backgrounds/banner_background.jpg);
    background-position: center top;
    background-repeat: no-repeat; background-size: cover;
    height: 700px;
    min-width: 1200px;
}

/*************************
**************************
   Header stuff
**************************
*************************/
#header {
    background-color: white;
}

#social-logo-contact {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 0 15px;
}
#social-logo-contact div:nth-child(odd) {
    width: 25%;
    padding-top: 30px;
}
#social-logo-contact div:last-child {
    text-align: right;
}
#social-logo-contact div:last-child a[href^="telno:"] {
    font-family: mistralregular, cursive;
    font-size: 40px;
    color: black;
    text-decoration: none;
    line-height: 38px;
}

#header-nav {
    background-color: #008B00;
    height: 50px;
}

#menu-header-nav-ul {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}
#menu-header-nav-ul li {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    height: 80%;
    margin: 5px 0;
    text-align: center;
    border-right: 1px dashed #00CA00;
}
#menu-header-nav-ul li:last-child {border: 0;}
#menu-header-nav-ul li a {
    display: inline-block;
    height: 100%;
    width: 100%;
    line-height: 40px;
    color: black;
}
#menu-header-nav-ul li.active-menu a,
#menu-header-nav-ul li:hover a{
    color: gold;
}


/*************************
**************************
   Banner stuff
**************************
*************************/
#banner-wrapper {
    text-align: right;
}
#banner {
    display: inline-block;
    width: 538px;
    text-align: center;
    font-family: 'Arimo', sans-serif;
    font-size: 14px;
    font-weight: 700;
    margin-top: 80px;
}
#banner p:last-child {
    font-weight: 300;
    font-size: 12px;
}
#banner p:last-child a {
    text-decoration: none;
    color: inherit;
}


/*************************
**************************
   Content stuff
**************************
*************************/

#cn-wrapper{ background: #000;}
#content {
    background-color: white;
    padding: 20px 20px 0px;
    position: relative;
    text-align: center;
    width:1200px; margin:0 auto;
    font-family: 'Arimo', sans-serif;
    font-weight: 400;
    font-size: 14px;
    color: #1F1F1F;
}
#content .big-Image {
    width: 100%;
} 

.heading {
    color: white;
    text-align: center;
    display: inline-block;
    position: absolute;
    z-index: 10;
    left: 50px;
    top: 50px;
    text-shadow: 2px 2px 2px black;
    font-family: 'mistralregular'; font-size: 50px;
}
.sub-head{position: absolute;left: 50px; top: 110px; font-family: "Oswald",sans-serif; font-size: 25px; font-weight: 300; text-shadow: 2px 2px 2px #000; color: #fff;}
.subtitle{font-family: 'mistralregular'; font-size: 50px; text-align: center; line-height: 35px; margin: 15px 0;}
.subtitle span{ font-family: "Oswald",sans-serif; color: #008B00; font-size: 25px; font-weight: 300;}
#content h2 {
    text-align: center;
    display: inline-block;
    line-height: 35px;
    margin-top: 15px;
    margin-bottom: 15px;
}
#content h1.usual-mistral span {
    color: white;
}
#content hr {
    height: 0;
    border-top: 1px dashed #D6D6D6;
    margin: 20px 0;
}
#content p.center-this {
    text-align: center;
}
.home #content p {
    font-family: 'Arimo', sans-serif;
    font-weight: 400;
    font-size: 14px;
    color: #1F1F1F;
    line-height: 22px;
    text-align: justify;
    text-indent: 0;
}
#content p {
    font-family: 'Arimo', sans-serif;
    font-weight: 400;
    font-size: 18px;
    color: #1F1F1F;
    line-height: 24px;
    text-align: justify; text-indent: 50px; margin-top: 0;
}
.page-id-13 #content p{ text-align: left; text-indent: 0;}
.page-id-15 #content p{ text-align: center; text-indent: 0;}
#content .content-section div{}
#content .content-section ul.vision-list {
    list-style: decimal;
    text-align: left;
    padding-left: 15px;
}
#content .content-section ul.vision-list li {
    margin-bottom: 10px;
}
#content .content-section .text-of-content {
    padding: 10px 15px 20px;
}
#content .content-section .img-holder {
    overflow: hidden;
    text-align: center;
}
.fl{ float: left; margin: 0 20px 0 0;}
.fr{ float: right; margin: 0 0 0 20px;}
#content .content-section:first-of-type .img-holder img {
    min-width: 679px;
    height: auto;
}
#content .content-section .img-holder img {
    height: 100%;
}

#content .content-section ul.ministry-list {
    text-align: left;
    padding-left: 15px;
}
#content .content-section ul.ministry-list li {
    margin-bottom: 10px;
}
#content .content-section strong {
    text-align: left;
    display: block;
    font-style: italic;
}
#content .content-section:last-of-type {
   
}
.c-left{ float: left; width: 45%}
.c-right{ float: right; width: 45%;}

/*************************
**************************
   gallery stuff
**************************
*************************/
#pic {
    text-align: left;
}
#pic .photo {
    display: inline-block;
    float: left;
    overflow: hidden;
}
#pic .big-image {
    width: 71.55%;
}
#pic .small-image {
    width: 28.45%;
    border-left: 1px solid white;
    border-bottom: 2px solid white;
    text-align: right;
}


/*************************
**************************
   Footer stuff
**************************
*************************/

#footer-wrapper {
    background-color: black;
    position: relative; margin-top: -15px;
}

#footer {
    padding: 20px 20px;
    background-color: white;
    background-color: #008B00;
}

#footer-green {
    background-color: #008B00;
    padding: 35px 40px;
    width: 100%;
}
#footer-green div{ display: inline-table; vertical-align: top;}
#footer-green h6 {
    margin: 0;
    color: white;
    font-family: 'Oswald', sans-serif;
    font-weight: 300;
    font-size: 22px;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

#footer-green p { margin-bottom: 0;
    font-family: 'Arimo', sans-serif;
    font-size: 14px;
    color: white;
}
#footer-green .alo_easymail_form_table {
    width: 100%;
}
#footer-green .alo_easymail_widget h2 {
    display: none;
}
#footer-green .alo_easymail_widget label {
    color: #FFF;
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
}
#footer-green .alo_easymail_disclaimer {
    margin: 10px 0;
}
#footer-green input[type="text"] {
    height: 36px;
    width: 100%;
}
#footer-green input[type="submit"] {
    height: 36px;
    width: 100%;
    border: 1px solid #015601;
    background: url(images/contact/email-icon-green.png) 382px center no-repeat,
        white;
    padding-left: 7px;
    margin-bottom: 20px;
}

#footer-green > * {
    height: 100%;
}

.brand{text-align: center;color:#fff;font-size: 15px;font-family: 'Arimo';}
.brand *{display: inline-block;vertical-align: middle;}
.brand a{color:#000;text-decoration: none;}

#footer-green div:first-child {
    width: 240px;
}

#footer-green div:nth-of-type(2){ padding-left: 145px;}
#footer-nav {height: 230px;}
#footer-nav ul {
    height: 100%;
 
    list-style: none;
   
    padding: 0;
    font-family: 'Arimo', sans-serif;
    font-size: 14px;
    color: white;
}
#footer-nav ul li a{ padding:10px 0; display: block}
#footer-nav ul li a:hover{ text-decoration: underline; color: #FFD700;}
#footer-green div:last-child div {
    margin:20px 0 20px 30px;
    position: relative;
}
#footer-green div:last-child p.mini-heading {
    font-size: 10px;
    margin: 0;
}
#footer-green div:last-child div:first-of-type p:last-child {
    margin: 4px 0 0 ;
}
#footer-green div:last-child a {
    text-decoration: none;
    color: inherit;
    font-size: 13px;
    color: white;
    font-family: 'Arimo', sans-serif;
}
#footer-green div:last-child section{ display: block; margin: 20px 0px 20px 30px;
position: relative;}
.location:before {
    content: url(images/contact/location-icon.png);
    position: absolute;
    left: -30px;
    top: 5px;
}
.phone:before {
    content: url(images/contact/phone-icon.png);
    position: absolute;
    left: -30px;
    top: 5px;
}
.email:before {
    content: url(images/contact/email-icon.png);
    position: absolute;
    left: -30px;
    top: 5px;
}
#footer h5 {
    text-align: center;
    margin: 0;
    color: white;
    font-size: 20px;
    font-weight: 400;
    font-family: Georgia, serif;
}

/*Inner*/
#content h1 {
    position: relative;
    top: 0;
    left: 0;
    color: black;
    font-size: 70px;
    text-shadow: none;
    text-align: center;
    display: block;font-family: 'Mistral', cursive;
    font-weight: 400;
}

.float-left {
    float: left;
    margin-right: 20px;
    margin-bottom: 5px;
}
.float-right {
    float: right;
    margin-left: 20px;
    margin-bottom: 5px;
}
.underline-this {
    text-decoration: underline;
}
.serv-list{ text-align: left; padding-left: 40px; line-height: 25px; font-size: 18px;}

.logged-in #alo_easymail_widget_form td:first-child input[type="radio"] {width:50px;}

#messages-page .widget-title{font-size:30px; margin:30px 0 10px}
.message{border-top:5px solid #008B00; padding:35px 0}

.list{text-align:left; padding:0 0 0 80px; list-style-position:inside;}
.letter-list{list-style:lower-alpha; text-align:left; padding:0 0 0 80px; list-style-position:inside; }
.letter-list li,.list li{font-family:'Arimo', sans-serif; font-size:18px; line-height:24px}

/*Responsive*/

@media screen and (max-width: 1220px) {
    body {min-width: 320px;}
    .width_content, #content, #header-banner {width: 100%; min-width: 100%;}
    #banner {padding: 0 10px; box-sizing: border-box;}
    #header-banner {background-position: center bottom -160px; position: relative;}
    img {max-width: 100%; height: auto;}
    #footer-green {display: flex; display: -webkit-flex;}
    #footer-green div:nth-of-type(2) {padding-left: 7%;}
}

@media screen and (max-width: 900px) {
    #social-logo-contact div:last-child a[href^="telno:"] {font-size: 35px;}
    #content .content-section:first-of-type .img-holder img {min-width: 100%;}
    #content .content-section .fr, #content .content-section .fl {float: none; margin: 20px auto 10px;}
    .subtitle {line-height: 110%; margin: 10px 0;}
    #content .content-section .text-of-content {padding: 10px 0;}
}

@media screen and (max-width: 800px) {
    #wprmenu_bar {box-shadow: 0 2px 5px #333;}
    #wprmenu_bar .menu_title a {text-decoration: none; color: #FFF; font-family: 'Oswald', sans-serif; top: 0 !important;}
    #mg-wprm-wrap ul li {border-bottom: 1px solid rgba(255, 255, 255, .3);}
    #mg-wprm-wrap ul li a {font-family: 'Oswald', sans-serif;}
    #social-logo-contact {flex-wrap: wrap; -webkit-flex-wrap:  wrap;}
    #social-logo-contact div {width: 100% !important; text-align: center; padding: 5px 10px !important;}
    #social-logo-contact div:nth-of-type(1) {order: 3; -webkit-order: 3; width: 50% !important;}
    #social-logo-contact div:nth-of-type(2) {order: 1; -webkit-order: 1;}
    #social-logo-contact div:nth-of-type(3) {order: 2; -webkit-order: 2; width: 50% !important;}
    #social-logo-contact div:last-child {text-align: center;}
    #social-logo-contact div img {max-width: 250px;}
    #header {padding: 15px 0;}
    #header .social-icons {justify-content: center; -webkit-justify-content: center;}
    #header-banner {background-position: center bottom -100px; position: relative;}
    #footer-green {padding: 0 10px 20px;}
    #footer-green div {width: 50% !important; padding: 10px 20px; box-sizing: border-box;}
    #footer-green .alo_easymail_disclaimer {width: 100% !important;}
    .inner #content h1 {line-height: 95%;}
}

@media screen and (max-width: 600px) {
    #banner-wrapper {text-align: center;}
    #banner {width: 90%; position: absolute; left: 0; right: 0; bottom: 5%; background: rgba(255, 255, 255, .3); padding: 10px; margin: auto;}
    #footer-green {flex-direction: column; -webkit-flex-direction: column;}
    #footer-green div:first-child {order: 2; -webkit-order: 2;}

    #footer-green div {width: 100% !important; text-align: center; margin-bottom: 15px;}
    #footer-green div:nth-of-type(3) {display: flex; display: -webkit-flex; flex-direction: column; -webkit-flex-direction: column; justify-content: center; -webkit-justify-content: center; order: 1; -webkit-order: 1;}
    #footer-green div:nth-of-type(3) img {max-width: 220px; margin: 10px auto 20px;}
    #footer-green div:nth-of-type(3) section {display: inline-block; width: fit-content; margin: 0 auto 15px;}
    #footer-green div:nth-of-type(3) section:before {display: block; position: static; margin: 0 auto 5px;}
    #footer .social-icons {justify-content: center; -webkit-justify-content: center; margin: 10px auto 20px;}

    .inner .c-left, .inner .c-right {float: none; display: block; width: 100%; margin: 10px auto 30px; text-align: center;}
    .inner .c-left p, .inner .c-right p {text-align: center !important;} 
    .inner .c-left iframe {width: 100%; height: 350px;}
    .inner .c-right input, .inner .c-right textarea {width: 100%;}
    .inner .c-right input[type="submit"] {width: 100%; max-width: 300px; margin: 15px auto 0;}
    .inner .c-right .g-recaptcha div {margin: 10px auto 15px;}
    .inner #content p {text-indent: 0;}
    .inner .letter-list, .inner .list {padding: 0 0 0 15px;}
    .inner .letter-list ol, .inner .list ol {padding: 0 0 0 20px;}
}

@media screen and (max-width: 500px) {
     #social-logo-contact div:nth-of-type(1),  #social-logo-contact div:nth-of-type(3) {width: 100% !important;}
     #social-logo-contact p {margin: 0;}
     #header-banner {background-position: left 35% bottom -165px;}
     .wp-image-32 {height: 159px; object-fit: cover;}

     .inner .float-left, .inner .float-right {float: none; margin: 15px auto 5px; display: block;}
     .inner .so-widget-image {display: block; margin: 0 auto 15px; float: none;}
     .inner .message {padding: 20px 0;}
}

@media screen and (max-width: 350px) {
     .inner .c-right .g-recaptcha div {transform: scale(.9); transform-origin: 30% 0;}
}