/*!
 * Theme Name: 		OceanWP
 * Theme URI: 		https://oceanwp.org/
 * Author: 			Nick
 * Author URI: 		https://oceanwp.org/about-me/
 * Description: 	OceanWP is the perfect theme for your project. Lightweight and highly extendable, it will enable you to create almost any type of website such a blog, portfolio, business website and WooCommerce storefront with a beautiful & professional design. Very fast, responsive, RTL & translation ready, best SEO practices, unique WooCommerce features to increase conversion and much more. You can even edit the settings on tablet & mobile so your site looks good on every device. Work with the most popular page builders as Elementor, Beaver Builder, Brizy, Visual Composer, Divi, SiteOrigin, etc... Developers will love his extensible codebase making it a joy to customize and extend. Best friend of Elementor & WooCommerce. Looking for a Multi-Purpose theme? Look no further! Check the demos to realize that it's the only theme you will ever need: https://oceanwp.org/demos/
 * Version: 		1.7.1
 * Tags: 			two-columns, right-sidebar, footer-widgets, blog, news, custom-background, custom-menu, post-formats, rtl-language-support, sticky-post, editor-style, threaded-comments, translation-ready, buddypress, custom-colors, featured-images, full-width-template, theme-options, e-commerce
 * Text Domain: 	oceanwp
 *
 * License: GNU General Public License v3.0 or later
 * License URI: https://www.gnu.org/licenses/gpl-3.0.html
 * 
 * DO NOT ADD YOUR CSS TO THIS FILE - IT WILL BE LOST
 * To add your own CSS, use a child theme: https://github.com/oceanwp/oceanwp-child-theme
 * 
 * CSS file is in "assets/css"
 */
.top_logo{
	margin-top:10px
}
.menu-link{
	border: 1px solid white !important
}
.menu-link span{
	font-size: 16px !important
}
.current-menu-item .menu-link{
	color: white !important;
	background-color: #46A56C !important
}
.menu-link:hover{
	    transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
	color: white !important;
	background-color: #46A56C !important
}
#site-navigation-wrap{
	float:none !important;
	text-align: center;
}
#site-navigation{
	display: inline-block !important;
    vertical-align: bottom;
    text-align: center;
}
#site-navigation-wrap > ul{
    float: none;
}
header#site-header {
    background-color: transparent;
    display: flow-root !important;
}
.main-menu{
	position: relative !important;
	display: block !important;
	border: none !important
}
.main-menu .sub-menu{
	background-color: white !important
}
.topbar-content a:hover{
	color: #46A56C
}
.topbar-content a{
	margin-right:10px
}
.topbar-content i{
	margin-left:10px;
	margin-right:5px
}
.kode_top_logo_wrap {
/*     background-image: url(http://kodeforest.net/wp-demo/islamic-center/wp-content/themes/islamic-center/images/top_bg.png) !important; */
	background-color: #46A56C;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    padding: 25px 0 !important;
}
.kode_top_logo_wrap.them_overlay:before {
    background-color: #46A56C !important;
}
.top_time_circle ul, .kode_top_logo_wrap {
    float: left !important;
    width: 100% !important;
}
.kode-bxslider .bxslider li, .them_overlay {
    position: relative !important;
}
.top_logo {
    float: left !important;
    position: relative !important;
    width: auto !important;
}
.top_time_circle {
    float: right;
    width: auto;
    position: relative;
    padding: 2px 0;
}
.top_time_circle ul, .kode_top_logo_wrap {
    float: left;
    width: 100%;
}
.top_time_circle ul li {
    height: 76px;
    width: 76px;
    text-align: center;
    float: left;
    border-radius: 100%;
    list-style: none;
    border: 1px solid #fff;
    padding: 18px 0;
    margin-left: 20px;
}
.top_time_circle ul li span, .top_time_circle ul li a {
    display: block;
    font-size: 14px;
    font-weight: 500;
    line-height: normal;
    margin-bottom: 3px;
	color: white
}
/* home blog */
.sp_wpspwpost_static h2{
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    -webkit-line-clamp: 1 !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
}
.wpspw-columns:hover img{
    opacity: 1;
    -webkit-transform: scale(1.05,1.07);
    -webkit-transition-timing-function: ease-out;
    -webkit-transition-duration: 250ms;
}
.wpspw-readmorebtn{
	border-radius:50px !important;
	background: #46A56C !important;
	border: 1px solid white !important;
/* 	font white color is from footer script */
}
.wpspw-columns:hover a.wpspw-readmorebtn{
	    background: #46A56C;
    color: #fff !important;
    -webkit-animation-name: bounceIn;
    -moz-animation-name: bounceIn;
    -o-animation-name: bounceIn;
    animation-name: bounceIn;
    animation-delay: 0.1s;
    -moz-animation-delay: 0.1s;
    -webkit-animation-delay: 0.1s;
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -ms-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-duration: 0.5s;
    -moz-animation-duration: 0.5s;
    -ms-animation-duration: 0.5s;
    -o-animation-duration: 0.5s;
    animation-duration: 0.5s;
}
.wpspw-post-content{
	text-align: center !important
}
.wpspw-post-content div {
	text-align: left
}
/* home blog */
/* footer */
.footer-section {
    background: #46A56C !important;
    padding-top: 50px;
    padding-bottom: 106px;
}
.widget-one-body, .widget-two-body, .widget-three-body{
	color: white
}
.widget-two-body p, .widget-two-body a, .widget-three-body p, .widget-three-body a {
    color: #fff;
}
span.title-separetor {
    position: relative;
    height: 3px;
    width: 100%;
    background: #fff;
    display: inline-block;
    margin-bottom: 60px;
}

element.style {
}
.widget-title .title-separetor img {
    background: #32383C;
}
.widget-title{
	border: none !important
}
.widget-title h4 {
    text-transform: uppercase;
    color: #fff;
    text-align: center;
}
span.title-separetor img {
    position: absolute;
    left: 50%;
    top: -11px;
    margin-left: -28px;
    padding: 0 10px;
    background: #46A56C !important;
}
.widget-one-body p, .widget-two-body p, .widget-two-body p a, .widget-three-body p, .widget-three-body ul li a{
	font-size: 16px
}
.widget-two-body p{
	margin-bottom: 20px
}
.widget-two-body p i, .widget-three-body ul li a i{
	padding: 0px 5px
}
.widget-three-body ul .widget-four-body ul{
	margin: 0px !important
}
.widget-three-body ul li{
	padding: 5px;
	list-style: none
}
.widget-four-body li {
    list-style: none;
    display: inline-block;
    margin-bottom: 5px;
	position: relative;
}
.widget-one-body{
	margin-top: 62px
}
.widget-two-body{
	margin-top: 25px
}
.widget-two-body, .widget-three-body{
	padding-left: 15px
}
.widget-two-body .subscribe-boxed-btn{
	margin-bottom:20px;
}
.boxed-btn{
	border: 1px solid;
    padding: 7px 15px;
    background-color: white;
    border-radius: 50px;
    font-size: 15px;
    font-weight: 600;
	color: black !important;
	border: 1px solid black;
}
.footer-social-links {
    padding-top: 40px;
}
.footer-social-links a {
    display: inline-block;
    width: 30px;
    height: 30px;
    line-height: 30px;
    color: #fff;
    border: 1px solid #fff;
    border-radius: 25px;
    text-align: center;
    margin-right: 10px;
    transition: all 0.5s ease-in-out;
}
.footer-social-links a:hover i {
    display: inline-block;
    width: 30px;
    height: 30px;
    line-height: 30px;
	background-color: white;
    color:  #008140;
    border: 1px solid #fff;
	border-radius: 25px;
    text-align: center;
    margin-right: 10px;
    transition: all 0.5s ease-in-out;
}
.footer-social-links a i {
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.footer-social-links{
	margin-bottom:20px
}
.footer-box {
	margin-bottom: 0px !important
}
.widget-three-body ul{
	    margin: 15px 0 15px 0px !important;
}
/* footer */
/* Event Widget */
.widget-event-body {
    border: 1px solid #d9d9d9;
    background: #fff;
}
.widget-event-body .event-item:first-child {
    border-top: none;
}
.widget-event-body .event-item {
    padding: 13px;
    border-bottom: none;
    background: #fff;
    border-top: 1px solid #d9d9d9;
	display: inline-flex
}
.widget-event-body .event-day-month {
    width: 22%;
    max-width: 60px;
    text-align: center;
    margin-right: 7.69230769%;
}
.fleft {
    float: left;
}
.widget-event-body .event-day-month .event-month {
    font-size: 12px;
    text-transform: uppercase;
    color: #46A56C;
    background: white;
    padding: 3px 0;
	border: 1px solid;
}
.widget-event-body .event-day-month .event-day {
    font-size: 23px;
    background: #46A56C;
    color: #fff;
}
.widget-event-body .event-info {
    line-height: 22px;
    font-size: 15px;
    width: 70%;
}
.fleft {
    float: left;
}
.fright {
    float: right;
}
.widget-title-demo {
    background: transparent url(http://www.isgponline.com/wp-content/uploads/2019/08/widget-title-line.png) repeat-x 0 50%;
    margin-bottom: 20px;
}
.widget-title-demo h3 {
    font-size: 20px;
    margin-bottom: 20px;
    text-transform: uppercase;
    font-weight: 600;
    background: #F6F6F6;
    display: inline;
    padding-right: 20px;
}
.widget-title-demo span {
    margin: 0;
    padding: 0 0 0 20px;
    background: #F6F6F6;
}
.widget-title-demo span a {
    font-size: 12px;
    text-decoration: none;
    background: #46A56C;
    color: #fff;
    padding: 4px 10px 5px 10px;
    margin: 0;
    display: block;
	border: 1px solid;
	border-radius:20px
}
.widget-title-demo span a:hover {
    background: white;
    color: #46A56C;
    padding: 4px 10px 5px 10px;
    margin: 0;
    display: block;
	border: 1px solid #46A56C;
	border-radius:20px
}
/* Event Widget */
/* Contact */
.wpcf7-form label{
	color: white !important
}
.wpcf7-response-output{
	background: white !important
}
.wpcf7-textarea:focus, .wpcf7-text:focus{
	background: white !important
}
/* Contact */
/* Donation */
.kode_cause_wrap {
/*      background-image: url(http://kodeforest.net/wp-demo/islamic-center/wp-content/uploads/2017/05/cause-bg.png) !important; */
    background-position: left center;
	background-size: cover;
    background-repeat: no-repeat;
    position: relative;
    background-size: 51%;
    z-index: 99;
	height: max-content;
    display: flex;
}
.back_green{
	background-image: url(http://www.isgponline.com/wp-content/uploads/2019/09/donation_banner.jpg) !important;
    background-position: left center;
	background-size: cover;
    background-repeat: no-repeat;
	position:relative !important;
	z-index:-1;
}
.back_green::before {
    background-color: #333;
    opacity: .9;
	position:absolute;
	content: " ";
	top: 0;
	bottom:0;
	right:0;
	left:0;
}
.back_form{
	background-image: url(http://www.isgponline.com/wp-content/uploads/2019/10/donation_form_banner.jpg) !important;
    background-position: right center;
	background-size: cover;
    background-repeat: no-repeat;
	position:relative !important;
	z-index:-1;
}
.back_form::before {
    background-color: #333;
    opacity: .9;
	position:absolute;
	content: " ";
	top: 0;
	bottom:0;
	right:0;
	left:0;
}
.kode_cause_des {
    padding: 84px 100px;
	    text-align: center;
    padding: 65px 104px;
	    float: left;
    width: 50%;
}
.kode_cause_wrap .section_hdg.hdg_2 {
    margin-bottom: 18px;
}
.section_hdg.hdg_2 {
    text-align: center;
    position: relative;
    margin-bottom: 41px;
    z-index: 99;
}
.section_hdg {
    float: left;
    width: 100%;
    margin-bottom: 30px;
}
.section_hdg.hdg_2 h1 {
    display: block;
	color: white !important
}
.kode_cause_text {
    position: relative;
	    float: left;
    width: 100%;
}
.kode_cause_text p {
    margin-bottom: 45px;
	color: white
}
.kode_cause_canvas {
    float: left;
    width: 100%;
}
.kode_cause_canvas ul{
	margin-top: 0px !important
}
.kode_canvas_detail {
    text-align: right;
    padding-right: 50px;
    border-right: 1px solid #e8e8e8;
	    float: left;
    width: 50%;
}
.kode_canvas_detail {
    text-align: right;
    padding-right: 50px;
    border-right: 1px solid #e8e8e8;
}
.kode_canvas_detail {
    float: left;
    width: 50%;
}
.kode_canvas_detail .progress-barr {
    height: 132px;
    width: 135px;
    position: relative;
}
.kode_canvas_detail .progress-barr div span {
    background-color: #333;
    border-radius: 50%;
    font-size: 40px;
    height: 120px;
    left: 6px;
    line-height: 120px;
    position: absolute;
    text-align: center;
    top: 6px;
    font-weight: lighter;
    width: 120px;
	color: white
}
.kode_canvas_detail .position {
    margin: 0;
    float: right;
    text-align: right;
}
.kode_canvas_detail .progress-barr div {
    border-radius: 50%;
    height: 132px;
    position: absolute;
    width: 132px;
}
.kode_canvas_text {
    text-align: left;
    padding-left: 50px;
    margin-left: 0;
    margin-bottom: 0;
}
.kode_canvas_text li:first-child {
    border-bottom: 1px solid #f1f1f1;
    margin-bottom: 15px;
}
.kode_canvas_text h5 {
    margin-bottom: 6px;
    margin-top: 0;
	font-weight: 600;
    text-transform: uppercase;
	color:white !important
}
.kode_canvas_text h4 {
    font-weight: 700;
    margin-top: 0;
	color: #d2973b !important;
	margin-bottom: 3px;
}
.kode_donate_des {
    padding: 225px 35px 194px;;
	float: left;
    width: 50%;
	border-top: 1px solid;
    border-bottom: 1px solid;
	border-right: 1px solid;
}
.kode_canvas_text li {
    display: inline-block;
    padding-bottom: 15px;
	padding-left: 25px;
}
.kode_comment{
	    float: left;
    width: 100%;
}
.kode_doantion_amount {
    border-bottom: 1px solid white;
    padding-bottom: 22px;
    margin-bottom: 28px;
		    float: left;
    width: 100%;
}
.kode_doantion_amount>h4 {
    margin-bottom: 25px;
    margin-top: 0;
}
.kode_amount_list {
    float: left;
}
.kode_amount_list label{
    position: relative;
    float: left;
	color: #333;
    display: block;
    font-weight: 400;
    margin-bottom: 10px;
}
.kode_amount_list span {
    display: inline-block;
    color: white;
    width: 75px;
    height: 62px;
    line-height: 60px;
    text-align: center;
    border: 1px solid #dfdfdf;
    margin-right: 5px;
    font-weight: 700;
    cursor: pointer;
    font-size: 20px;
	-webkit-transition: all .5s ease-in-out;
}
.kode_amount_list input {
    left: 0;
    position: absolute;
    visibility: hidden;
	box-sizing: border-box;
}
.kode_doantion_amount .kf_commet_field {
    float: left;
    width: 179px;
	margin-bottom: 15px;
    float: left;
	position: relative
}
.kode_doantion_amount .kf_commet_field input {
    float: left;
    min-width: 180px;
    border: 1px solid white;
    background: 0 0;
    height: 62px;
    font-size: 16px;
    font-weight: 500;
	color: white
}
.kode_donation_row{
    float: left;
    width: 100%;
}
.kode_donation_row>h4 {
    margin-bottom: 25px;
    margin-top: 0;
	font-weight: 600;
    text-transform: uppercase;
}
.row {
    margin-right: -15px;
    margin-left: -15px;
}
.kf_commet_field {
    margin-bottom: 15px;
    float: left;
}
.kf_commet_field input {
    background: 0 0;
    box-shadow: 0px 0px;
	 -webkit-transition: all .3s ease-in-out;
}
.form-submit {
    width: auto;
}
.radio_points {
    margin: 12px 0 22px;
	    float: left;
    width: 100%;
	list-style: disc;
}
.radio_points li {
    float: left;
    line-height: normal;
    list-style: outside none none;
    margin-right: 30px;
    width: auto;
	margin-bottom: 5px;
}
.kode_payment_list.form-submit .checkbox_radio {
    position: relative;
    margin: 0;
	float: left;
    width: 100%;
	display: inline-block;
}
.kode_payment_list h4{
	text-transform: uppercase
}
.kode-radio-label-wrap input[type=radio] {
    display: none;
}
.checkbox_radio span {
    display: inline-block;
    width: 12px;
    height: 12px;
    position: absolute;
    left: 0;
    top: 3px;
    bottom: 0;
    border: 1px solid #afafaf;
    border-radius: 100%;
    background-color: #dedede;
}
.checkbox_radio label {
    float: left;
    width: 100%;
    padding-left: 20px;
    z-index: 10;
    position: relative;
    font-size: 14px;
    color: #666;
    margin-bottom: 0;
    cursor: pointer;
    margin-left: 6px;
}
.form-submit .medium_btn {
    border: none;
    cursor: pointer;
}
.form-submit .donate-button:hover {
    background:#d2973b !important;
	color: white !important
}
.selected-amount{
	background: #d2973b;
}
/* Donation */
/* Recent Post */
#related-posts{
	display: none;
}
/* Recent Post */
/* subscribe */
.subscribe-button{
	margin: 0px 0px 15px 0px !important
}
.subscribe-button, .donate-button{
	font-weight:700 !important;
	border-radius:50px !important;
	background-color: white !important;
	color: black !important;
	border: 1px solid black !important;
}
.subscribe-button:hover{
	background-color: #46A56C !important;
	color: white !important;
	border: 1px solid white !important;
}
/* subscribe */
/* Gallery */
#past-event-gallery .gallery-item{
	margin-bottom:15px;
}
#past-event-gallery .gallery-caption{
	width:150px !important
}
/* Gallery */
/* Board Members */
#Board-members img{
	height:300;
	width:300;
	border-radius: 50%;
	margin-bottom: 15px
}
/* Board Members */
/* .subscribe-button:hover{
	background-color:#454545 !important;
	color: white !important
} */
#footer-widgets{
	display: none !important
}
/* OUR Story Header */
h1.our_story_header {
    position: relative;
    z-index: 1;
}
h1.our_story_header:before {
        border-top: 2px solid #dfdfdf;
        content:"";
        margin: 0 auto; /* this centers the line to the full width specified */
        position: absolute; /* positioning must be absolute here, and relative positioning must be applied to the parent */
        top: 50%; left: 0; right: 0; bottom: 0;
        width: 50%;
        z-index: -1;
}

h1.our_story_header span { 
        /* to hide the lines from behind the text, you have to set the background color the same as the container */ 
        background: white; 
        padding: 0 15px; 
}
/* OUR Story Header */
/* PDF */
.pdfemb-viewer{
	margin: 30px auto !important
}
.page-id-1313 #main{
	width: 80% !important;
	margin:auto !important
}
@media (min-width: 1200px){
	.container {
		width: 1140px;
		max-width: 100%;
	}
}
@media (max-width: 991px){
.top_time_circle ul li {
    float: none;
    display: inline-block;
}
	.top_time_circle {
    text-align: center;
    width: 100%;
}
	.kode_cause_des {
    padding: 40px 60px;
		    width: 100%;
}
	.kode_donate_des {
    position: relative;
		    width: 100%;
	}
}
	@media (max-width: 767px){
.top_logo{
	float:none !important;
	text-align:center
}
.top_time_circle ul {
    margin-left: 0;
}
		.kode_cause_des {
    padding: 40px 12px;
}
		.kode_donate_des {
    padding: 27px 20px 33px;
}
		.kode_amount_list span {
    border: 1px solid #dfdfdf;
    font-size: 16px;
    height: 63px;
			    margin-right: 4px;
}
		.kode_cause_wrap{
			display:block;
		}
	}
	@media (max-width: 480px){
.top_time_circle ul li {
    height: 53px;
    width: 53px;
    padding: 10px 0;
    margin-left: 4px;
}

.top_time_circle ul li span, .top_time_circle ul li a {
    font-size: 10px;
}
		.kode_cause_des {
    padding: 40px 12px 0;
}
		.kode_canvas_detail {
    padding-right: 10px;
}
		.kode_canvas_text li{
    padding-left: 15px;
}
		.kode_amount_list span {
    width: 66px;
			    display: inline-block;
    float: none;
}
		.kode_doantion_amount .kf_commet_field input {
    width: 100%;
    margin-top: 10px;
    margin-left: 0;
}
		.kode_doantion_amount .kf_commet_field {
			margin-left: 0px;
		}
	}
@media (min-width: 1400px) and (max-width: 2000px){
	.kode_donate_des{
		padding: 57px 60px 57px;
	}
}

/* Boxed section */
.boxed-section{
	max-width: 1140px !important; 
	margin: 0 auto !important;
}
.mb30{
	margin-bottom:30px !important
}
/* Boxed Section */