@charset "utf-8";

/*
Theme Name: Abuubakar
Theme URI: http://kodeforest.net/wp-demo/islamic
Description: islamic Center WordPress Theme
Author: KodeForest
Author URI: http://www.kodeforest.com
Version: 4.2
License:
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: featured-images, theme-options
Text Domain: abuubakar
*/


/**
	* Table of Contents :
	* 1.0 - KODE TOP WRAP START
	* 2.0 - KODE TOP LOGO WRAP START
	* 3.0 - KODE NAVIGATION WRAP START
	* 4.0 - KODE BANNER WRAP START
	* 5.0 - KODE MOSQUES WRAP STRAT
	* 6.0 - KODE PILLARS WRAP START
	* 7.0 - KODE SERVICES WRAP START
	* 8.0 - KODE PRAY WRAP START
	* 9.0 - KODE GALLERY WRAP START
	* 10.0 - KODE TEAM WRAP START
	* 11.0 - KODE CAUSE WRAP START
	* 12.0 - KODE BLOG WRAP START
	* 13.0 - KODE CLIENT WRAP START
	* 14.0 - KODE NEWSLETTER WRAP START
	* 15.0 - WIDGET WRAP START
	* 16.0 - WIDGET COPYRIGHT START
	* 17.0 - HOME PAGE 01 START
	* 18.0 - KODE TOP2 WRAP START
	* 19.0 - KODE NAVIGATION WRAP START
	* 20.0 - KODE BANNER2 WRAP START
	* 22.0 - KODE MOSQUE2 WRAP START
	* 23.0 - KODE PILLARS WRAP PILLARS 2 START
	* 24.0 - KODE BUILDING WRAP START
	* 25.0 - KODE CLIENT WRAP CLIENT 2 START
	* 26.0 - KODE GALLERY WRAP START
	* 27.0 - KODE EVENT WRAP START
	* 28.0 - WIDGET WRAP WIDGET 02 START
	* 29.0 - ABOUT US PAGE START
	* 30.0 - KODE SAB BANNER WRAP START
	* 31.0 - KODE PHILOSOPHY WRAP START
	* 32.0 - KODE CLIENT WRAP CLIENT 3 START
	* 33.0 - BLOG PAGE START
	* 34.0 - KODE BLOG MADIUM WRAP START
	* 35.0 - BLOG GRID PAGE START
	* 36.0 - BLOG DETAIL PAGE START
	* 37.0 - 404 PAGE START
	* 38.0 - COMING SOON PAGE START
	* 39.0 - CONTACT US PAGE START
	* 40.0 - EVENT PAGE START
	* 41.0 - EVENT DETAIL PAGE START
	* 42.0 - PORTFOLIO PAGE START
	* 43.0 - PROJECT PAGE STARt
	* 44.0 - PROJECT LIST PAGE START
	* 45.0 - SERVICE PAGE START
	* 46.0 - KODE SERVICE SEARCH FEILD START
	* 47.0 - KODE PRICING WRAP START
	* 48.0 - SHOP PAGE START
	* 49.0 - TEAM DETAIL PAGE START
	* 50.0 - KODE TEAM WRAP START
	* 51.0 - GALLERY3 WRAP START
	* 52.0 - PROJECT DETAIL PAGE START
	* 53.0 - SERVICE DETAIL PAGE START
	
	
	
	
	[Color codes]

	Background: #ffffff (white)
	Content: #999999 (light black)
	Header h1: #111111 (dark black)
	Header h2: #111111 (dark black)
	Footer:  #000000 (dark black)

	a (standard): #999999 (light black)
	a (visited): #999999 (light black)
	a (active): #999999 (light black)

	[Typography]
	  
	Body copy:  15px/  'Ubuntu', sans-serif;
	Headers: 'Ubuntu', sans-serif;
	Input, textarea: 'Ubuntu', sans-serif;
	Sidebar heading: 'Poppins', sans-serif;


==============================================================================================	*/

.wraper {
    float: left;
    width: 100%;
}

.kode_portfolio_detail ul li:last-child,
.kode_contact_service ul li:last-child,
.kode_gallery_fig.fig_2:nth-child(4),
.kode_gallery_fig.fig_2:nth-child(2),
.kode_navi_icon li:last-child,
.widget_social_icon li:last-child,
.product_icon li:last-child,
.koed_event_timer figcaption ul li:last-child,
.radio_points li:last-child,
.kode_amount_list span:last-child,
.kode_social_icon li:last-child,
.navigation ul li:last-child,
.top_icon_fig li:last-child {
    margin-right: 0px;
}

.header .navigation ul li:first-child,
.top_time_circle ul li:first-child {
    margin-left: 0px;
}

.kode_donors_list .slick-prev:hover:before,
.kode_donors_list .slick-next:hover:before,
.kode_gallery3_wrap .slick-prev:hover:before,
.kode_gallery3_wrap .slick-next:hover:before,
.kode_team_profile .event_detail_list li a:hover i,
.kode_team_profile .event_detail_list li a:hover span,
.kode_team_profile .event_detail_list li a:hover,
.kode_view_row .widget_social_icon li a:hover,
.kode_shop_fig .shop_icon li a:hover,
.kode_side_contact_text a,
.kode_event_featured>a,
.kode_service_form .kode_textarea textarea:focus,
.kode_service_form .kf_commet_field input:focus,
.kode_service_form .section_hdg p,
.kode_service_form .section_hdg h3,
.kode_project_text>span,
.kode_portfolio_detail ul li a:focus,
.kode_portfolio_detail ul li a.active,
.kode_portfolio_detail ul li a:hover,
.kode_contact_service ul li:hover .kode_contact_text p,
.kode_contact_service ul li:hover .kode_contact_text>a,
.kode_contact_service ul li:hover .kode_contact_text h5 a,
.widget_event .kode_textarea textarea:focus,
.widget_event .kf_commet_field input:focus,
.kode_newsletter_form .kf_commet_field input:focus,
.coming_social_icon li a,
.kode_coming_text .kode_search .kf_commet_field button,
.kode_coming_text h2,
.countdown.timer li h5,
.countdown.timer li span,
.kode_404_text p,
.kode_404_text h2 span,
.sidebar_add figcaption h4,
.sidebar_add figcaption h2,
.sidebar_add figcaption h3,
.social_meta li a,
blockquote span,
.kode_search .comment-form .kf_commet_field button:hover,
.kode_pagination a:hover,
.kode_blog_des figure .expand_btn:hover,
.kode_blog_des:hover .kode_blog_text .share_link,
.kode_client_wrap.client_3 .slick-prev:before,
.kode_client_wrap.client_3 .slick-next:before,
.kode_philosophy_text span,
.kode_mosque_row.mosque figure a,
.sab_banner_text a:hover span,
.sab_banner_text h2,
.kode_amount_list span:hover,
.kode_pillars_item li a:hover h6,
.kode_pillars_item li a:hover span,
.kode_pillars_item_2 li a:hover h6,
.kode_pillars_item_2 li a:hover span,
.navigation ul li .active,
.navigation ul li a:hover,
.widget_event.event_2 .kode_calender_list:hover>span,
.kode_event_fig a,
.kode_canvas_detail.canvas_2>span,
.kode_building_text p,
.kode_building_text h3,
.kode_building_text h4,
.kode_banner_wrap.banner2 .slick-prev:before,
.kode_banner_wrap.banner2 .slick-next:before,
.kode_navi_icon li a:hover,
.donate_btn button.close:hover,
.kode_top2_icon .dropdown ul li a,
.copyright_text p,
.top_btn,
.widget_event .kode_event_text h6 a,
.widget_title,
.widget_social_icon li a,
.widget_call_info li a,
.widget_logo p,
.kode_newsletter_text p,
.kode_newsletter_text h5 a,
.kode_product_list .slick-prev:before,
.kode_product_list .slick-next:before,
.kode_product_list h6,
.kode_product_list>h5,
.kode_calender_list>span,
.koed_event_timer figcaption ul li p,
.koed_event_timer figcaption ul li span,
.kode_blog_fig .plus_icon:hover,
.kode_canvas_detail .progress-bar div span,
.kode_canvas_text h5,
.kode_cause_text p,
.kode_team_wrap .slick-prev:before,
.kode_team_wrap .slick-next:before,
.kode_social_icon li a,
.kode_tem_fig figcaption p,
.kode_tem_fig figcaption h4,
.kode_gallery_fig a:hover,
.kode_service_text .right_arrow:hover,
.kode_service_des:hover .kode_service_text span,
.kode_service_des:hover .kode_service_text span i,
.kode_mosque_item .koed_banner_btn .medium_btn:hover,
.section_hdg.hdg_2 h3,
.kode_mosque_fig figcaption h6 a,
.drop_deta a,
.kode_paly_text p,
.kode_paly_text h6,
.small_text,
.mediume_text,
.large_text,
.top_time_circle ul li span,
.top_time_circle ul li a {
    color: #fff;
}

.kode_gallery3_fig:hover figure img,
.kode_team_fig:hover figure img,
.kode_side_contact_text a:hover i,
.sidebar_add:hover figure img,
.kode_calender_list:hover figure img,
.kode_mosque_row.mosque figure:hover img,
.kode_pillars_item li a:hover span,
.kode_pillars_item_2 li a:hover span,
.kode_event_fig:hover figure img,
.koed_event_timer:hover figure img,
.kode_blog_fig:hover figure img,
.kode_gallery_fig:hover figure img,
.kode_service_des:hover figure img,
.kode_mosque_fig figure:hover img {
    transform: scale(1.2);
    -moz-transform: scale(1.2);
    -webkit-transform: scale(1.2);
}

.top_icon_fig li a img:hover,
.kode_building_des:hover figure img,
.kode_tem_fig figure:hover img {
    transform: scale(1.1);
    -moz-transform: scale(1.1);
    -webkit-transform: scale(1.1);
}

.kode_donors_text h5,
.kode_view_des h3,
.kode_shop_text h6,
.kode_side_contact_text a,
.kode_event_text.text_2 p,
.kode_event_featured a,
.kode_service_des .right_arrow.btn,
.kode_pricing_dollar h3,
.kode_pricing_des h4,
.kode_project_text h5,
.kode_project_dollar a,
.kode_project_text h4,
.kode_portfolio_detail ul li a,
.kode_portfolio_text h4,
.kode_portfolio_text h6,
.kode_event_speaker_text h6,
.kode_coming_event_text h5,
.event_studium,
.kode_event_detail .kode_calender_list .kode_event_text h4,
.kode_contact_text h5,
.kode_coming_text .kode_search .kf_commet_field button,
.kode_404_text h3,
.sidebar_add figcaption h5,
.sidebar_add figcaption h4,
.sidebar_add figcaption h2,
.sidebar_add figcaption h3,
.comment_title,
.kode_social_share a,
.kode_blog_detail_text h3,
.kode_pagination .next,
.kode_pagination .prve,
.kode_blog_text>h4,
.kode_calender_detail.detail_2 .kode_event_text h4,
.kode_philosophy_text h4,
.sab_banner_text h2,
.kode_calender_detail.detail_2 .kode_event_text,
.kode_canvas_detail.canvas_2>span,
.kode_building_text h3,
.kode_building_text h4,
.widget_title,
.kode_newsletter_text h5,
.kode_product_list>h5,
.kode_product_list h6,
.kode_event_text h6,
.koed_event_timer figcaption ul li p,
.koed_event_timer figcaption h5,
.kode_blog_text>h5,
.checkbox_radio label,
.kode_donation_row h4,
.kode_doantion_amount h4,
.kode_canvas_text h5,
.kode_tem_fig figcaption h4,
.kode_pray_text h5,
.kode_pray_text h2,
.kode_service_text h4,
.kode_pillars_item li a h6,
.kode_pillars_item_2 li a h6,
.kode_pillars_text h4,
.kode_counter_mosque li h6,
.section_hdg h3,
.kode_mosque_fig figcaption h6,
.large_text,
.navigation ul li ul li a,
.navigation ul>li>a,
.top_time_circle ul li span,
.top_time_circle ul li a {
    font-weight: 600;
    text-transform: uppercase;
}


/*
	=======================================
		KODE TOP WRAP START
	=======================================
*/

.kode_top_info ul,
.kode_top_info,
.kode_top_wrap {
    float: left;
    width: 100%;
    margin: 0px;
}

.kode_top_wrap {
    padding: 6px 0 8px;
}

.kode_top_info {
    margin-top: 7px;
    padding: 2px 0;
}

.kode_top_info>ul>li {
    float: left;
    padding: 0px 20px;
    line-height: 15px;
    list-style: none;
    width: auto;
    border-right: 1px solid #cccccc;
}

.kode_top_info ul>li:last-child {
    border-right: none;
}

.kode_top_info ul li:first-child {
    padding-left: 0px;
}

.kode_top_info ul>li>a {
    display: inline-block;
    font-size: 14px;
    font-weight: 300;
}

.kode_top2_icon .dropdown img,
.kode_top_info ul li ul li a img,
.kode_top_info ul li button img,
.kode_top_info ul li a i {
    margin-right: 10px;
}

.kode_top_info ul li button {
    background: none;
    padding: 0px;
    cursor: pointer;
    font-size: 14px;
    color: #999;
}

.kode_top_info ul li button span {
    margin-left: 5px;
    position: relative;
    top: 2px;
}

.kode_top_info ul li ul {
    background-color: #ffffff;
    border: medium none;
    box-shadow: 0 0;
    min-width: 140px;
    padding: 5px 0px;
    border-bottom: 2px solid;
    top: 28px;
}

.kode_top_info ul li ul li {
    width: 100%;
    padding: 0px 0px;
}

.kode_top_info ul li ul li a {
    display: block;
    padding: 8px 20px;
}

.kode_top2_icon .dropdown img,
.kode_top_info ul li ul li a img {
    border-radius: 100%;
}

.kode_top_right_text {
    float: right;
}

.top_icon_fig {
    padding-right: 30px;
    margin: 0px;
}

.kode_top_right_text .comment-form,
.top_icon_fig li,
.top_icon_fig {
    float: left;
    width: auto;
}

.kode_top_right_text ul {
    margin-top: 2px;
}

.top_icon_fig li {
    margin-right: 14px;
    width: auto;
    margin-bottom: 0px;
    list-style: none;
}

.kode_top_right_text .kf_commet_field {
    margin-bottom: 0px;
}

.kode_top_right_text .comment-form {
    float: left;
    padding-left: 30px;
    border-left: 1px solid #ccc;
}

.kode_top_right_text .kf_commet_field {
    width: 160px;
    position: relative;
}

.kode_top_right_text .kf_commet_field input {
    padding: 0px 0px;
    height: auto;
    font-size: 12px;
    border: none;
    border-bottom: 1px solid #cccccc;
    box-shadow: 0px 0px;
    padding: 0px 30px 2px 5px;
}

.kode_top_right_text .kf_commet_field input:focus {
    border: 1px solid;
}

.kode_top_right_text .kf_commet_field button {
    position: absolute;
    top: 0px;
    right: 5px;
    background: none;
    padding: 0px 0px;
    font-size: 16px;
    cursor: pointer;
}


/*
	=======================================
		KODE TOP WRAP END
	=======================================
*/


/*
	=======================================
		KODE TOP LOGO WRAP START
	=======================================
*/

.top_time_circle ul,
.kode_top_logo_wrap {
    float: left;
    width: 100%;
}

.top_time_circle ul {
    margin-bottom: 0px;
}

.top_time_circle ul li {
    margin-bottom: 0px;
}

.kode_top_logo_wrap {
    background-image: url("images/top_bg.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 25px 0px;
}

.top_logo {
    float: left;
    position: relative;
    width: auto;
}

.top_logo h1 {
    margin: 0px;
}

.top_time_circle {
    float: right;
    width: auto;
    position: relative;
    padding: 2px 0px;
}

.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 0px;
    margin-left: 20px;
}

.top_time_circle ul li:hover {
    transform: scale(1.1);
    -moz-transform: scale(1.1);
    -webkit-transform: scale(1.1);
}

.top_time_circle ul li span,
.top_time_circle ul li a {
    display: block;
    font-size: 14px;
    font-weight: 500;
    line-height: normal;
}

.top_time_circle ul li a {
    margin-bottom: 3px;
}


/*
	=======================================
		KODE TOP LOGO WRAP END
	=======================================
*/


/*
	=======================================
		KODE NAVIGATION WRAP START
	=======================================
*/

.navigation ul,
.navigation,
.kode_navigation_wrap {
    float: left;
    width: 100%;
    position: relative;
    z-index: 9999;
}

.navigation ul {
    text-align: center;
    margin: 0px 0px;
}

.navigation ul>li {
    display: inline-block;
    padding-left: 5px;
    position: relative;
    float: none;
    width: auto;
    z-index: 9;
    margin-bottom: 0px;
}

.navigation ul>li>a {
    color: #333333;
    display: inline-block;
    font-size: 16px;
    font-weight: 500;
    padding: 18px 20px 17px;
    position: relative;
    z-index: 999;
}

.navigation ul li ul li a:before,
.navigation ul>li>a:before {
    position: absolute;
    content: "";
    top: 100px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    z-index: -1;
}

.navigation ul>li>a:hover:before {
    top: 0px;
}


/*drop down style*/


/*navigation dropdown start*/

.navigation ul li ul {
    position: absolute;
    top: 80px;
    width: 250px;
    visibility: hidden;
    opacity: 0;
    z-index: 999;
    border-bottom: 3px solid;
    background: rgba(255, 255, 255, 0.97);
}

.navigation ul li:hover>ul {
    opacity: 1;
    visibility: visible;
    top: 65px;
}

.navigation ul li ul li {
    width: 100%;
}

.navigation ul li ul li a {
    display: block;
    padding: 6px 20px;
    text-align: left;
    position: relative;
    z-index: 999;
}

.navigation ul li ul li a:before {
    right: 100%;
    top: 0;
    opacity: 0;
}

.navigation ul li ul li a:hover:before {
    right: 0;
    opacity: 1;
}

.navigation ul ul ul {
    left: 100%;
}

.navigation ul ul :hover>ul {
    top: 30px;
    visibility: visible;
}

.kode_navi_btn {
    float: right;
    width: auto;
    padding: 11px 0px 10px;
}


/*navigation dropdown end*/


/*
	=======================================
		KODE NAVIGATION WRAP END
	=======================================
*/


/*
	=======================================
		KODE BANNER WRAP START
	=======================================
*/

.koed_banner_btn,
.kode_banner_wrap {
    float: left;
    width: 100%;
}

.kode_banner_wrap.them_overlay,
.kode_banner_wrap {
    position: relative;
}

.kode_banner_text {
    left: 50%;
    margin-left: -260px;
    margin-top: -140px;
    position: absolute;
    text-align: center;
    top: 50%;
    width: 490px;
    z-index: 10;
}

.large_text {
    font-size: 60px;
    font-weight: bold;
    line-height: normal;
    position: relative;
    margin-bottom: 5px;
}

.large_text:before,
.large_text:after {
    bottom: 0;
    content: "";
    font-family: fontawesome;
    font-size: 15px;
    left: 40px;
    position: absolute;
    top: 10px;
}

.large_text:before {
    content: "\f10e";
    left: auto;
    right: 40px;
}

.mediume_text {
    font-size: 24px;
    margin-bottom: 20px;
}

.mediume_text span {
    display: inline-block;
    font-weight: bold;
    font-size: 28px;
}

.small_text {
    margin-bottom: 24px;
}


/*pager slider start*/

.kode_banner_wrap .bx-wrapper {
    border: none;
    box-shadow: 0px 0px;
}

.kode_banner_wrap .bx-wrapper {
    margin-bottom: 0px;
}

.pager_link {
    bottom: 30px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    text-align: center;
    z-index: 999;
}

.pager_link img {
    float: none;
    display: inline-block;
    text-align: center;
    margin: auto;
    width: 123px;
    height: 75px;
}

.pager_link a {
    margin-right: 16px;
    display: inline-block;
}

.pager_link a.active {
    display: inline-block;
    outline: 4px solid #d2973b;
    outline-offset: -4px;
}


/*
	=======================================
		KODE BANNER WRAP END
	=======================================
*/


/*
	=======================================
		KODE MOSQUES WRAP STRAT
	=======================================
*/

.kode_counter_mosque,
.kode_mosque_student,
.kode_mosque_item,
.kode_mosque_text,
.kode_mosque_row,
.kode_mosques_wrap {
    float: left;
    width: 100%;
}

.kode_mosques_wrap {
    padding: 80px 0px;
}

.kode_mosque_des {
    width: 49%;
    float: left;
    margin-right: 10px;
}

.kode_mosque_des:last-child {
    margin-right: 0px;
}

.kode_mosque_fig figure {
    width: auto;
    margin-bottom: 0px;
}

.kode_mosque_fig .them_overlay:before {
    opacity: 0;
}

.kode_mosque_fig:hover .them_overlay:before {
    opacity: 0.3;
    z-index: 9;
}

.kode_mosque_fig figure:first-child {
    margin-bottom: 11px;
}

.kode_mosque_fig figcaption {
    position: absolute;
    bottom: -44px;
    left: 0px;
    right: 0px;
    z-index: 10;
}

.kode_mosque_fig:hover figcaption {
    bottom: 0px;
}

.kode_mosque_fig figcaption h6 {
    padding: 6px 15px 8px;
    font-weight: 500;
    margin: 0px;
}


/* SECTION HEADING START */

.kode_mosque_text .section_hdg {
    margin-bottom: 18px;
}

.section_hdg.hdg_4 {
    margin-bottom: 18px;
}

.section_hdg {
    float: left;
    width: 100%;
    margin-bottom: 30px;
}

.section_hdg img {
    margin-bottom: 6px;
    display: block;
}

.section_hdg h3 {
    display: inline-block;
    margin-right: 16px;
    margin: 0px 16px 0px 0px;
}

.section_hdg span {
    font-size: 25px;
    position: relative;
}

.section_hdg span:after,
.section_hdg span:before {
    border-bottom: 1px solid #acacac;
    bottom: 14px;
    content: "";
    left: auto;
    position: absolute;
    right: -56px;
    top: 0;
    width: 38px;
}

.section_hdg span:after {
    border-top: 1px solid #acacac;
    border-bottom: none;
    top: 19px;
    right: auto;
    left: -56px;
    display: none;
}


/* SECTION HEADING END */


/* SECTION HEADING HDG 2 START */

.section_hdg.hdg_2 {
    text-align: center;
    position: relative;
    margin-bottom: 41px;
    z-index: 99;
}

.section_hdg.hdg_2 img {
    display: inline-block;
}

.section_hdg.hdg_2 h3 {
    display: block;
}

.section_hdg.hdg_2 span:after {
    display: block;
}


/* SECTION HEADING HDG 2 START */


/* SECTION HEADING HDG 2 START */

.section_hdg.hdg_2.hdg_3 {
    margin-bottom: 34px;
}

.section_hdg.hdg_2.hdg_3 h3 {
    color: #333;
}


/* SECTION HEADING HDG 2 END */

.kode_mosque_item p {
    margin-bottom: 37px;
}

.kode_counter_mosque {
    float: left;
    text-align: center;
    margin-bottom: 15px;
}

.kode_counter_mosque span {
    display: inline-block;
    height: 72px;
    width: 72px;
    text-align: center;
    line-height: 66px;
    border-radius: 100%;
    border: 2px solid #e7e7e7;
    font-size: 30px;
    font-weight: 500;
    margin-bottom: 16px;
}

.koed_banner_btn .medium_btn,
.kode_counter_mosque h6 a {
    color: #fff;
}

.kode_banner_text .koed_banner_btn.wow .medium_btn.border {
    color: #fff;
}


/* kode mosque row mosque start*/

.kode_mosque_row.mosque {
    margin: 17px 0 0;
}

.kode_mosque_row.mosque figure a {
    position: absolute;
    top: 50%;
    left: 0px;
    right: 0px;
    text-align: center;
    font-size: 40px;
    margin-top: -20px;
    z-index: 10;
}

.kode_mosque_row.mosque .them_overlay:before {
    z-index: 9;
}


/*
	=======================================
		KODE MOSQUES WRAP END
	=======================================
*/


/*
	=======================================
		KODE PILLARS WRAP START
	=======================================
*/

.kode_pillars_item,
.kode_pillars_item_2,
.kode_pillars_wrap {
    float: left;
    width: 100%;
    border: none;
}

.kode_pillars_wrap .nav-tabs {
    border-bottom: none;
}

.kode_pillars_wrap {
    background-image: url("images/piller.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 75px 0px 0px 0px;
}

.kode_pillars_wrap.them_overlay:before {
    background-color: #666666;
    opacity: 0.8;
}

.kode_pillars_row {
    /* width:950px; */
    width: 1120px;
    text-align: center;
    position: relative;
    margin: auto;
}

.kode_pillars_text {
    background-color: #ffffff;
    border-radius: 380px 390px 0 0;
    display: inline-block;
    margin: auto;
    padding: 22px 66px 24px;
    text-align: center;
    width: 445px;
    position: relative;
    z-index: 999;
}

.kode_pillars_text:before {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-color: #ffffff #ffffff currentcolor;
    border-image: none;
    border-radius: 380px 390px 0 0;
    border-style: dotted dotted none;
    border-width: 1px 1px medium;
    bottom: 0;
    content: "";
    left: -190px;
    position: absolute;
    right: -190px;
    top: -173px;
    z-index: -1;
}

.kode_pillars_text span {
    font-size: 40px;
    position: relative;
    margin-bottom: 22px;
    display: inline-block;
    border-bottom: 2px solid #a7a7a7;
    padding-bottom: 8px;
}

.kode_pillars_text h4 {
    margin-bottom: 13px;
    margin-top: 0px;
}

.kode_pillars_text p {
    margin-bottom: 0px;
}

.kode_pillars_item {
    margin-bottom: 85px;
}

.kode_pillars_item_2 {
    margin-bottom: 85px;
}

.kode_pillars_item li {
    display: inline-block;
}

.kode_pillars_item_2 li {
    display: inline-block;
}

.kode_pillars_item li a {
    height: 126px;
    width: 126px;
    text-align: center;
    border-radius: 100%;
    background-color: #fff;
    display: inline-block;
    padding: 0 0;
}

.kode_pillars_item_2 li a {
    height: 126px;
    width: 126px;
    text-align: center;
    border-radius: 100%;
    background-color: #fff;
    display: inline-block;
    padding: 0 0;
}

.kode_pillars_item li a:before {
    border: 1px dotted #ffffff;
    border-radius: 100%;
    bottom: -7px;
    content: "";
    left: -7px;
    position: absolute;
    right: -7px;
    top: -7px;
}

.kode_pillars_item_2 li a:before {
    border: 1px dotted #ffffff;
    border-radius: 100%;
    bottom: -7px;
    content: "";
    left: -7px;
    position: absolute;
    right: -7px;
    top: -7px;
}

.kode_pillars_item li a span {
    font-size: 30px;
    display: inline-block;
    margin-bottom: 10px;
}

.kode_pillars_item_2 li a span {
    font-size: 30px;
    display: inline-block;
    margin-bottom: 10px;
}

.kode_pillars_row .kode_pillars_item li a:hover span i {
    color: #fff;
}

.kode_pillars_row .kode_pillars_item_2 li a:hover span i {
    color: #fff;
}

.center {
    position: relative;
    z-index: 9999;
    /* left:-21px; */
    left: 503px;
}

.center:after {
    border-right: 1px solid #ffffff;
    bottom: -101px;
    content: "";
    left: -70px;
    position: absolute;
    right: 60px;
    top: 126px;
}

.center_left {
    position: relative;
    z-index: 9999;
    /* left:-21px; */
    left: 383px;
}

.center_left:after {
    border-right: 1px solid #ffffff;
    bottom: -137px;
    content: "";
    left: -70px;
    position: absolute;
    right: 60px;
    top: 141px;
    transform: rotate(-12deg) translate(18px);
}

.right_bottom,
.left_bottom {
    bottom: 50px;
    /* left: 0; */
    position: absolute;
    z-index: 9999;
    left: 80px;
}

.right_center {
    /* right: 126px; */
    right: 170px;
    left: auto;
    bottom: 256px;
    position: absolute;
    z-index: 9999;
}

.left_center {
    /* right: 126px; */
    left: 170px;
    right: auto;
    bottom: 256px;
    position: absolute;
    z-index: 9999;
}

.right_bottom {
    left: auto;
    /* right:0px; */
    right: 128px;
}

.right_bottom:after,
.left_bottom:after {
    /* border-right: 1px solid #ffffff;
    bottom: -22px;
    content: "";
    left: auto;
    position: absolute;
    right: -82px;
    top: 0;
	transform: rotate(-66deg) translate(-52px); */
    border-right: 1px solid #ffffff;
    bottom: -51px;
    content: "";
    left: auto;
    position: absolute;
    right: -98px;
    top: 0;
    transform: rotate(-66deg) translate(-52px);
}

.right_bottom:after {
    border-left: 1px solid #ffffff;
    border-right: none;
    right: auto;
    left: -82px;
    transform: rotate(66deg) translate(52px);
}

.right_center:after,
.left_center:after {
    border-right: 1px solid #ffffff;
    bottom: -76px;
    content: "";
    /* left: auto; */
    position: absolute;
    /* right: 140px; */
    top: 32px;
    transform: rotate(-54deg) translate(-61px);
}

.right_center:after {
    border-left: 1px solid #fff;
    border-right: none;
    /* right: auto; */
    left: -89px;
    transform: rotate(54deg) translate(61px);
}

.left_center:after {
    border-right: 1px solid #ffffff;
    bottom: -82px;
    content: "";
    /* left: auto; */
    position: absolute;
    right: -108px;
    top: 5px;
    transform: rotate(-54deg) translate(-61px);
}

.kode_pillars_item a>h6 {
    margin: 0px;
}

.kode_pillars_item_2 a>h6 {
    margin: 0px;
}


/*
	=======================================
		KODE PILLARS WRAP END
	=======================================
*/


/*
	=======================================
		KODE SERVICES WRAP START
	=======================================
*/

.service_btn,
.kode_service_text,
.kode_service_des,
.kode_services_wrap {
    float: left;
    width: 100%;
}

.kode_services_wrap {
    padding: 80px 0px;
}

.kode_service_des {
    margin-bottom: 30px;
}

.kode_service_des:hover {
    box-shadow: 0px 0px 7px 0px;
    margin-bottom: 30px;
}

.kode_service_des:hover figure img {
    opacity: 0.8;
}

.kode_service_text {
    padding: 42px 30px 24px;
    position: relative;
}

.kode_service_text span {
    height: 80px;
    width: 80px;
    text-align: center;
    line-height: 80px;
    margin: auto;
    border-radius: 100%;
    font-size: 42px;
    background-color: #eeeeee;
    display: inline-block;
    position: absolute;
    top: -50px;
}

.kode_service_text h4 {
    margin-bottom: 7px;
    margin-top: 0px;
}

.kode_service_text p {
    margin-bottom: 0px;
}

.kode_service_text p i {
    margin-right: 10px;
}

.kode_service_text,
.kode-service-wrap {
    float: left;
    width: 100%;
}

.kode_service_text .right_arrow {
    position: absolute;
    top: 50%;
    right: 10px;
    height: 30px;
    width: 30px;
    text-align: center;
    line-height: 27px;
    border-radius: 100%;
    border: 1px solid #e0e0e0;
    margin-top: -15px;
    opacity: 0;
}

.kode_service_des:hover .kode_service_text .right_arrow {
    right: 30px;
    opacity: 1;
}

.kode-service-wrap .kode_service_des .right_arrow:hover i {
    color: #fff;
}

.service_btn {
    text-align: center;
}

.check-list {
    float: left;
    width: 100%;
}

.one_half.last .check-list ul {
    margin-left: 0px;
}


/*
	=======================================
		KODE SERVICES WRAP END
	=======================================
*/


/*
	=======================================
		KODE PRAY WRAP START
	=======================================
*/

.kode_pray_fig,
.kode_pray_text,
.kode_pray_wrap {
    float: left;
    width: 100%;
}

.kode_pray_wrap {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.kode_pray_wrap.them_overlay:before {
    background-color: #e8e8e8;
    opacity: 0.92;
}

.kode_pray_text {
    padding: 76px 0 80px;
}

.kode_pray_text h5,
.kode_pray_text h2 {
    margin-bottom: 9px;
    margin-top: 0px;
}

.kode_pray_text h5 {
    font-weight: 600;
    margin-bottom: 20px;
    margin-top: 0px;
}

.kode_pray_text p {
    color: #333333;
    font-weight: bolder;
    margin-bottom: 23px;
    padding-right: 55px;
}

.kode_pray_fig figure {
    width: auto;
    margin-top: -40px;
}


/*
	=======================================
		KODE PRAY WRAP END
	=======================================
*/


/*
	=======================================
		KODE GALLERY WRAP START
	=======================================
*/

.kode_gallery_fig.fig_1,
.kode_gallery_des,
.kode_gallery_row,
.kode_gallery_wrap {
    float: left;
    width: 100%;
}

.kode_gallery_wrap {
    padding: 80px 0px;
    background-color: #f7f7f7;
}

.kode_gallery_des {
    margin-bottom: 30px;
}

.kode_gallery_fig {
    float: left;
    margin-bottom: 20px;
}

.kode_gallery_fig:nth-child(2) {
    margin-right: 0px;
}

.kode_gallery_fig.fig_1.margin {
    margin-bottom: 30px;
}

.kode_gallery_fig a {
    position: absolute;
    top: 50%;
    left: 0px;
    right: 0px;
    text-align: center;
    height: 50px;
    width: 50px;
    text-align: center;
    line-height: 50px;
    font-size: 20px;
    background-color: #fff;
    border-radius: 100%;
    display: inline-block;
    margin: -40px auto;
    opacity: 0;
    z-index: 10;
}

.kode_gallery_fig:hover a {
    margin: -25px auto;
    opacity: 1;
}

.kode_gallery_fig a:hover {
    background-color: #000;
}

.kode_gallery_fig .them_overlay:before {
    opacity: 0;
    top: 100%;
    z-index: 9;
}

.kode_gallery_fig:hover .them_overlay:before {
    opacity: 0.78;
    top: 0;
}

.service_btn.view {
    margin-top: 10px;
}


/*
	=======================================
		KODE GALLERY WRAP END
	=======================================
*/


/*
	=======================================
		KODE TEAM WRAP START
	=======================================
*/

.kode_social_icon,
.kode_tem_fig,
.kode_team_wrap {
    float: left;
    width: 100%;
}

.kode_social_icon {
    margin: 0px;
    padding: 0px;
}

.kode_team_wrap {
    padding: 80px 0px;
}

.kode_tem_fig {
    padding: 0 15px;
    margin-bottom: 30px;
}

.kode-team-slide.col-md-12 .kode_tem_fig {
    padding: 0px;
}

.kode_tem_fig figcaption {
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: -61px;
    background-color: #444444;
    padding: 17px 0px 20px;
    text-align: center;
}

.kode_tem_fig:hover figcaption {
    bottom: 0px;
}

.kode_tem_fig figcaption h4 {
    margin: 0px;
}

.kode_tem_fig figcaption p {
    margin-bottom: 14px;
}

.kode_social_icon li {
    display: inline-block;
    margin-right: 11px;
    width: auto;
    float: none;
    margin-bottom: 0px;
}

.kode_social_icon li a {
    display: inline-block;
    height: 33px;
    width: 33px;
    text-align: center;
    line-height: 33px;
    border-radius: 100%;
    border: 1px solid #f4f4f4;
}


/* SILCK SLIDER START*/

.kode_team_wrap .slick-prev,
.kode_team_wrap .slick-next {
    background: #333333;
    display: block;
    height: 46px;
    position: absolute;
    top: 50%;
    width: 46px;
    z-index: 1;
}

.kode_team_wrap .slick-prev {
    left: -50px;
}

.kode_team_wrap .slick-next {
    right: -50px;
}

.kode_team_wrap .slick-prev:before,
.kode_team_wrap .slick-next:before {
    line-height: 42px;
}


/*
	=======================================
		KODE TEAM WRAP END
	=======================================
*/


/*
	=======================================
		KODE CAUSE WRAP START
	=======================================
*/

.kode_cause_canvas,
.kode_payment_list,
.checkbox_radio,
.radio_points,
.kode_comment,
.kode_donation_row,
.kode_doantion_amount,
.kode_donation_element,
.kode_cause_text,
.kode_cause_wrap {
    float: left;
    width: 100%;
}

.kode_cause_wrap {
    background-image: url("images/cause-bg.png");
    background-position: left center;
    background-repeat: no-repeat;
    position: relative;
    background-size: 51%;
    z-index: 99;
}

.kode_cause_wrap .section_hdg.hdg_2 {
    margin-bottom: 18px;
}

.kode_cause_wrap.them_overlay:before {
    background-color: #333;
    opacity: 0.9;
    width: 50%;
}

.kode_cause_wrap:after {
    bottom: 0;
    content: "";
    left: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 50%;
    z-index: -1;
    background: #f9f9f9;
}

.kode_donate_des,
.kode_cause_des {
    float: left;
    width: 50%;
}

.kode_cause_des {
    text-align: center;
    padding: 65px 96px;
}

.kode_cause_text {
    position: relative;
}


/* canvas style start*/

.kode_cause_text p {
    margin-bottom: 45px;
}

.kode_canvas_text,
.kode_canvas_detail {
    float: left;
    width: 50%;
}

.kode_canvas_detail {
    text-align: right;
    padding-right: 50px;
    border-right: 1px solid #e8e8e8;
}

.kode_canvas_detail .position {
    margin: 0px 0px;
    float: right;
    text-align: right;
}

.kode_canvas_detail .progress-bar div span {
    background-color: #333333;
    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;
}

.kode_canvas_detail .progress-bar div {
    border-radius: 50%;
    height: 132px;
    position: absolute;
    width: 132px;
}

.kode_canvas_detail .progress-bar {
    height: 132px;
    width: 135px;
}

.kode_canvas_text {
    text-align: left;
    padding-left: 50px;
    margin-left: 0px;
    margin-bottom: 0px;
}

.kode_canvas_text li {
    display: inline-block;
    padding-bottom: 15px;
}

.kode_canvas_text li:first-child {
    border-bottom: 1px solid #f1f1f1;
    margin-bottom: 15px;
}

.kode_canvas_text h5 {
    margin-bottom: 6px;
    margin-top: 0px;
}

.kode_canvas_text h4 {
    font-weight: bold;
    margin-top: 0px;
}

.kode_donate_des {
    padding: 27px 190px 33px;
}

.kode_doantion_amount {
    border-bottom: 1px solid #dcdcdc;
    padding-bottom: 22px;
    margin-bottom: 28px;
}

.kode_donation_row>h4,
.kode_doantion_amount>h4 {
    margin-bottom: 25px;
    margin-top: 0px;
}

.kode_amount_list label,
.kode_amount_list {
    float: left;
}

.kode_amount_list span {
    display: inline-block;
    color: #333333;
    width: 75px;
    height: 62px;
    line-height: 60px;
    text-align: center;
    border: 1px solid #dfdfdf;
    margin-right: 15px;
    font-weight: bold;
    cursor: pointer;
    font-size: 20px;
}

.kode_doantion_amount .kf_commet_field {
    float: left;
    width: 180px;
    margin-left: 14px;
}

.kode_doantion_amount .kf_commet_field input {
    float: left;
    width: 180px;
    border: 1px solid #dfdfdf;
    background: none;
    height: 62px;
    font-size: 16px;
    font-weight: 500;
}

.kode_donation_item,
.kf_commet_field {
    margin-bottom: 15px;
    float: left;
}

.kf_commet_field input {
    background: none;
    box-shadow: 0px 0px;
}

.kode_donation_row .chosen-container-single .chosen-single span,
.kode_donation_row .chosen-container-single .chosen-single {
    height: 44px;
    background: none;
}

.kode_donation_row .chosen-container-single .chosen-single span {
    padding: 7px 15px;
    font-size: 15px;
    text-align: left;
}

.kode_donation_row .chosen-container-single .chosen-single {
    padding: 0px 0px;
    border-color: #dfdfdf;
    border-radius: 0px;
    box-shadow: 0px 0px;
}

.kode_donation_row .chosen-container-single .chosen-single div b:before {
    font-size: 16px;
    color: #bdbdbd;
}

.kode_donation_row .chosen-container-single .chosen-single div {
    background: none;
}

.kode_donation_row .chosen-container .chosen-drop {
    z-index: 99;
}


/*radio button start*/

.kode_payment_list h5 {
    margin-bottom: 15px;
    margin-top: 0px;
}

.radio_points {
    margin: 12px 0px 22px 0px;
}

.radio_points li {
    float: left;
    line-height: normal;
    list-style: outside none none;
    margin-right: 30px;
    width: auto;
}

.kode_payment_list.form-submit .checkbox_radio {
    position: relative;
    margin: 0px 0px;
}

.checkbox_radio input {
    display: none;
}

.checkbox_radio span {
    display: inline-block;
    width: 12px;
    height: 12px;
    position: absolute;
    left: 0px;
    top: 3px;
    bottom: 0px;
    border: 1px solid #afafaf;
    border-radius: 100%;
    background-color: #dedede;
}

.checkbox_radio span:before {
    position: absolute;
    content: "";
    left: 2px;
    right: 2px;
    top: 2px;
    bottom: 2px;
    background: transparent;
    border-radius: 100%;
}

.checkbox_radio input[type="radio"]:checked~span:before {
    background-color: #666666;
}

.checkbox_radio label {
    float: left;
    width: 100%;
    padding-left: 20px;
    z-index: 10;
    position: relative;
    font-size: 14px;
    color: #666666;
    margin-bottom: 0px;
    cursor: pointer;
    margin-left: 6px;
}

.kode_payment_list .form-submit {
    margin-bottom: 0px;
}


/*
	=======================================
		KODE CAUSE WRAP END
	=======================================
*/


/*
	=======================================
		KODE BLOG WRAP START
	=======================================
*/

.kode_calender_detail li,
.kode_calender_list,
.kode_calender_detail,
.koed_event_timer,
.kode_event_des,
.kode_event_row,
.kode_meta,
.kode_blog_list>ul>li,
.kode_blog_fig,
.kode_blog_list ul,
.kode_blog_list,
.kode_blog_row,
.kode_blog_wrap {
    float: left;
    width: 100%;
}

.kode_blog_wrap {
    padding: 80px 0px;
}

.kode_blog_wrap .section_hdg {
    margin-bottom: 33px;
}

.kode_blog_list>ul>li {
    margin-bottom: 30px;
}

.kode_blog_list>ul>li:last-child {
    margin-bottom: 0px;
}

.kode_blog_fig figure {
    float: left;
    width: auto;
}

.kode_blog_fig .them_overlay:before {
    opacity: 0;
    top: 100%;
}

.kode_blog_fig:hover .them_overlay:before {
    opacity: 0.65;
    top: 0px;
    z-index: 9;
}

.kode_blog_text {
    overflow: hidden;
    padding: 25px 28px 28px 30px;
}

.col-md-6.columns .kode_blog_text .kode-item.kode-blog-widget .kode_blog_text {
    padding: 30px 28px 30px 30px;
}

.kode_blog_fig:hover .kode_blog_text {
    background-color: #f7f7f7;
}

.kode_meta {
    margin: 0px 0px 13px 0px;
}

.kode_meta.meta_2 li:last-child,
.kode_meta li {
    float: left;
    width: auto;
    list-style: none;
    margin-bottom: 0px;
}

.kode_meta li:last-child {
    float: right;
}

.kode_meta li a {
    display: inline-block;
    color: #666666;
}

.kode_meta li a i {
    margin-right: 14px;
}

.kode_meta.meta_2 {
    margin-bottom: 0px;
}

.kode_meta.meta_2 a i {
    color: #b0b0b0;
    margin-right: 12px;
}

.kode_meta.meta_2 li {
    float: left;
    padding: 0px 15px;
    line-height: normal;
    border-right: 1px solid #b0b0b0;
}

.kode_meta .blog-info.blog-author {
    margin-bottom: 0px;
}

.kode-item.kode-blog-widget {
    float: left;
    width: 100%;
    margin-bottom: 30px;
}

.kode_meta.meta_2 li:last-child {
    border-right: none;
}

.kode_meta.meta_2 li:first-child {
    padding-left: 0px;
}

.kode_blog_des figure .expand_btn,
.kode_blog_fig .plus_icon {
    background-color: #ffffff;
    border-radius: 100%;
    bottom: 0;
    font-size: 18px;
    height: 40px;
    left: 0;
    line-height: 40px;
    margin: -40px auto auto;
    position: absolute;
    right: 0;
    text-align: center;
    top: 50%;
    width: 40px;
    opacity: 0;
    z-index: 10;
}

.kode_blog_fig .plus_icon:hover {
    background-color: #000;
}

.kode_blog_des:hover .expand_btn,
.kode_blog_fig:hover .plus_icon {
    margin: -20px auto auto;
    opacity: 1;
}

.kode_blog_text>h5 {
    display: inline-block;
    margin-bottom: 14px;
    margin-top: 0;
}


/* kode event row start */

.koed_event_timer .them_overlay:before {
    z-index: 9;
}

.koed_event_timer figcaption {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    padding: 25px 30px;
    z-index: 10;
}

.koed_event_timer figcaption h5 {
    margin-bottom: 16px;
    margin-top: 0px;
}

.koed_event_timer figcaption ul {
    margin-left: 0px;
}

.koed_event_timer figcaption ul li {
    float: left;
    margin-right: 34px;
    width: auto;
    list-style: none;
    margin-bottom: 0px;
    text-align: center;
}

.koed_event_timer figcaption ul li span {
    font-size: 36px;
}

.koed_event_timer figcaption ul li p {
    margin-bottom: 0px;
    line-height: normal;
}

.kode_calender_detail {
    padding: 10px 30px;
    background-color: #f7f7f7;
}

.kode_calender_detail li {
    padding: 20px;
    border-bottom: 1px solid #cbcbcb;
}

.kode_calender_detail li:last-child {
    border-bottom: none;
}

.kode_calender_list>span {
    display: inline-block;
    text-transform: uppercase;
    width: 65px;
    height: 70px;
    text-align: center;
    padding: 10px;
    background-color: #333333;
    line-height: 24px;
    font-size: 24px;
    font-weight: 400;
    float: left;
    border-radius: 2px;
}

.kode_calender_list>span i {
    font-size: 16px;
    font-style: normal;
}

.kode_event_text {
    overflow: hidden;
    padding: 1px 0px 0px 10px;
}

.kode_event_text h6 {
    line-height: 22px;
    margin-bottom: 6px;
    margin-top: -5px;
}

.kode_event_text p {
    margin-bottom: 0px;
}


/*
	=======================================
		KODE BLOG WRAP END
	=======================================
*/


/*
	=======================================
		KODE CLIENT WRAP START
	=======================================
*/

.kode_product_rating,
.kode_product_text,
.kode_product_list,
.kode_client_text,
.kode_client_wrap {
    float: left;
    width: 100%;
}

.kode_client_wrap {
    background-color: #f7f7f7;
    padding: 80px 0px 50px;
}

.kode_client_text {
    text-align: center;
    padding: 25px 25px;
    position: relative;
    margin-bottom: 80px;
}

.kode_client_text:hover {
    background-color: #ffffff;
}

.kode_client_text p {
    position: relative;
    margin-bottom: 10px;
    width: 91%;
    left: 20px;
}

.kode_client_text p:before,
.kode_client_text p:after {
    position: absolute;
    content: "\f10d";
    top: -4px;
    left: -15px;
    bottom: 0px;
    font-size: 12px;
    font-family: fontawesome;
    color: #b7b7b7;
}

.kode_client_text p:before {
    left: auto;
    right: 38px;
    top: auto;
    bottom: -5px;
    content: "\f10e";
}

.kode_client_text h6 {
    text-transform: uppercase;
    margin-bottom: 26px;
    margin-top: 0px;
}

.kode_client_text figure {
    width: auto;
    display: inline-block;
    border-radius: 100%;
    float: none;
    position: absolute;
    left: 0px;
    right: 0px;
}

.kode_client_text:hover figure {
    transform: scale(0.2);
    -moz-transform: scale(0.2);
    -webkit-transform: scale(0.2);
}

.kode_client_text .fig_hover {
    transform: scale(1.5);
    -moz-transform: scale(1.5);
    -webkit-transform: scale(1.5);
    opacity: 0;
}

.kode_client_text:hover .fig_hover {
    transform: scale(1);
    -moz-transform: scale(1);
    -webkit-transform: scale(1);
    opacity: 1;
}

.kode_client_text figure img {
    border-radius: 100%;
    float: none;
    width: auto;
    margin: auto;
}

.kode_client_text:hover figure img {
    opacity: 0.8;
}

.kode_product_list>h5 {
    padding: 15px 30px 13px;
    margin: 0px 0px;
}


/* product style */

.kode_product_list {
    background-color: #fff;
}

.kode_product_list>h5 {
    padding: 15px 30px 13px;
}

.kode_product_list figure {
    border-bottom: 1px solid #d2d2d2;
}

.kode_product_list h6 {
    background-color: #333333;
    border-radius: 2px;
    left: 0;
    margin: 0;
    padding: 4px 15px 7px;
    position: absolute;
    top: 30px;
}

.kode_product_text {
    padding: 17px 30px 13px;
    border-bottom: 1px solid #d2d2d2;
}

.kode_product_text h5 {
    margin-bottom: 5px;
    margin-top: 0px;
}

.kode_product_text span:last-child {
    font-weight: 500;
    margin-left: 10px;
}

.kode_product_rating {
    padding: 11px 30px 9px;
}

.product_icon li,
.rating_star li,
.rating_star {
    float: left;
    width: auto;
    margin-left: 0px;
    margin-bottom: 0px;
    list-style: none;
}

.rating_star li a {
    display: inline-block;
    padding: 0px 2px;
    color: #fcc73d;
}

.kode_newsletter_wrap .kode_newsletter_form .kf_commet_field .medium_btn:hover {
    box-shadow: 0 0px 10px 1px rgba(0, 0, 0, 0.1);
}

.textwidget .widget_event .wpcf7-form .medium_btn:hover {
    background-color: #000 !important;
}

.wpcf7-form {
    float: left;
    width: 100%;
}

.kode_product_list .slick-prev:hover:before,
.kode_product_list .slick-next:hover:before,
.rating_star li a:hover {
    color: #000;
}

.product_icon {
    float: right;
    width: auto;
    margin-left: 0px;
    margin-bottom: 0px;
}

.product_icon li {
    margin-right: 15px;
}

.product_icon li a {
    display: inline-block;
    color: #333333;
    margin-bottom: 0px;
}


/* slick slider start */

.kode_product_list .slick-prev,
.kode_product_list .slick-next {
    top: -25px;
    background: none;
    height: 20px;
    right: 23px;
    width: 20px;
}

.kode_product_list .slick-prev {
    right: 46px;
    left: auto;
}

.kode_product_list .slick-prev:before,
.kode_product_list .slick-next:before {
    content: "\f105";
    line-height: 20px;
    font-size: 18px;
}

.kode_product_list .slick-prev:before {
    content: "\f104";
}


/*
	=======================================
		KODE CLIENT WRAP END
	=======================================
*/


/*
	=======================================
		KODE NEWSLETTER WRAP START
	=======================================
*/

.kode_newsletter_form form,
.kode_newsletter_des,
.kode_newsletter_wrap {
    float: left;
    width: 100%;
}

.kode_newsletter_des {
    padding: 17px 0px 13px;
    border-right: 1px solid ##fff;
}

.kode_newsletter_des span {
    display: inline-block;
    font-size: 50px;
    color: #ebd0a7;
    float: left;
    line-height: 50px;
}

.kode_newsletter_text {
    overflow: hidden;
    padding-left: 30px;
}

.kode_newsletter_text h5 {
    padding-bottom: 5px;
    margin-bottom: 10px;
    position: relative;
    margin-top: 0px;
}

.widget_title:before,
.kode_newsletter_text h5:before {
    position: absolute;
    content: "";
    left: 0px;
    right: 0px;
    bottom: 0px;
    border-bottom: 1px solid #fff;
    width: 60px;
}

footer .widget_title {
    margin-bottom: 10px;
    float: left;
}

.widget_title .rsswidget {
    width: auto;
}

.widget_title .rsswidget {
    margin-right: 10px;
}

.kode_newsletter_text p {
    margin-bottom: 0px;
}


/* kode newsletter form start */

.kode_newsletter_form {
    float: right;
    padding: 22px 0 21px;
}

.kode_newsletter_form .kf_commet_field {
    float: left;
    margin-bottom: 0px;
}

.kode_newsletter_form .kf_commet_field input {
    float: left;
    background: none;
    width: 288px;
    box-shadow: 0px 0px;
    color: #fff;
}

.kode_newsletter_form .form-submit {
    margin-left: 30px;
    margin-bottom: 0px;
}

.kode_newsletter_form .kf_commet_field input[type="submit"],
.kode_newsletter_form .form-submit input {
    float: left;
    width: auto;
    margin-bottom: 0px;
    cursor: pointer;
    border: none;
    background-color: #333;
    width: 110px;
    height: 51px;
}

.kode_newsletter_form .kf_commet_field input {
    margin-right: 0px;
}

.kode_newsletter_form .kf_commet_field input[type="submit"]:hover,
.kode_newsletter_form .form-submit input:hover {
    box-shadow: 0px 0px 1px 1px;
}

.kode_newsletter_form .kf_commet_field input[type="submit"],
.kf_commet_field button {
    cursor: pointer;
}

.kode_newsletter_form .kf_commet_field p {
    margin: 0px;
    padding: 0px;
}

.wpcf7-form .form-submit {
    text-align: center;
    width: 100%;
}

.wpcf7-form .widget_event p .wpcf7-form-control {
    color: #fff;
    border: 1px solid #454343;
    cursor: pointer;
}

div.wpcf7-mail-sent-ok {
    border: 2px solid #398f14;
    float: left;
    margin: 0;
    width: 100%;
}

.ajax-loader {
    display: none;
}

.widget_logo .widget_call_info p {
    margin-bottom: 10px;
    line-height: normal;
}

.widget_social_icon {
    padding: 0px;
    list-style: none;
}

.widget_call_info {
    padding: 0px;
    margin: 0px;
}

.widget_social_icon li {
    width: auto;
}

.kode_calender_detail {
    padding: 0px;
    margin: 0px;
}

.kode_calender_detail li,
.widget_call_info li {
    list-style: none;
}

footer .widget.kode-widget .widget_title {
    margin-top: 0px;
    padding-top: 0px;
    margin-bottom: 38px;
}

.wpcf7-form-control.wpcf7-submit.medium_btn.background-bg-dark.btn_hover.hvr-wobble-bottom {
    display: inline-block;
    margin: auto;
    text-align: center;
    width: auto;
}

.donate_btn.koed_banner_btn {
    width: auto;
    float: right;
    padding: 0px;
}

.donate_btn.koed_banner_btn a {
    color: #fff;
}


/*
	=======================================
		KODE NEWSLETTER WRAP END
	=======================================
*/


/*
	=======================================
		WIDGET WRAP START
	=======================================
*/

.widget_social_icon,
.widget_call_info li,
.widget_call_info,
.widget_logo,
.widget_wrap {
    float: left;
    width: 100%;
}

.widget_wrap {
    padding: 60px 0px;
    background-image: url("images/footer-bg.png");
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
    background-size: cover;
}

footer .widget_wrap {}

.widget_wrap.them_overlay:before {
    background-color: #202020;
    opacity: 0.98;
}

.widget_logo img {
    margin-bottom: 25px;
}

.widget_logo p {
    margin-bottom: 18px;
}

.widget_call_info {
    padding-bottom: 25px;
    border-bottom: 1px solid #393535;
    margin-bottom: 30px;
}

.widget_call_info li {
    margin-bottom: 7px;
}

.widget_call_info li:last-child {
    margin-bottom: 0px;
}

.widget_call_info li a {
    display: inline-block;
    width: 100%;
}

.widget_call_info li a i {
    margin-right: 20px;
    float: left;
}

.widget_social_icon li {
    float: left;
    margin-right: 19px;
}

.widget_social_icon li a {
    display: inline-block;
    height: 42px;
    width: 42px;
    text-align: center;
    line-height: 42px;
    border: 1px solid #353333;
    font-size: 16px;
    border-radius: 2px;
}


/* widget event start */

.kode_textarea,
.widget_event {
    float: left;
    width: 100%;
}

.widget_title {
    margin-bottom: 50px;
    position: relative;
    padding: 15px 0px 6px 0px;
}

.widget_title:before {
    width: 80px;
}

.widget_event .kode_calender_detail {
    background: none;
    padding: 0px 0px;
}

.widget_event .kode_calender_detail li {
    border-color: #454343;
}

.widget_event .kode_calender_detail li:first-child {
    padding-top: 0px;
}

.widget_event .kode_event_text {
    padding-left: 20px;
}

.widget_event .kf_commet_field input {
    border-color: #454343;
}

.kode_textarea {
    margin-bottom: 30px;
}

.wpcf7-form .widget_event .kode_textarea {
    margin-bottom: 15px;
}

.widget_event .kode_textarea textarea {
    height: 128px;
    width: 100%;
    background: none;
    border-color: #454343;
    padding: 15px 15px;
    resize: none;
}

.form-submit {
    width: auto;
}

.comment-form button,
.widget_event .form-submit .medium_btn {
    cursor: pointer;
}


/*
	=======================================
		WIDGET WRAP END
	=======================================
*/


/*
	=======================================
		WIDGET COPYRIGHT START
	=======================================
*/

.copyright_text,
.widget_copyright {
    float: left;
    width: 100%;
}

.widget_copyright {
    background-color: #1d1d1d;
}

.copyright_text p {
    float: left;
    margin: 0px 0px;
    padding: 18px 0;
}

.top_btn {
    float: right;
    display: inline-block;
    height: 65px;
    width: 60px;
    text-align: center;
    line-height: 60px;
    margin: auto;
    font-size: 30px;
}

.copyright_text .top_btn:hover {
    background-color: #fff;
}


/*
	=======================================
		WIDGET COPYRIGHT END
	=======================================
*/

.widget_event .kode_textarea textarea::-moz-placeholder,
.widget_event .kf_commet_field input[type="text"]::-moz-placeholder,
.kode_newsletter_form .kf_commet_field input[type="text"]::-moz-placeholder {
    color: #ffff;
}


/*
	============================================================================
					HOME PAGE 01 START
	============================================================================
*/


/*
	=======================================
		KODE TOP2 WRAP START
	=======================================
*/

.kode_top2_row,
.kode_top2_wrap {
    float: left;
    width: 100%;
}

.kode_top2_wrap {
    border-top: 1px solid #d9d9d9;
    border-bottom: 1px solid #d9d9d9;
}

.kode_top2_info {
    float: left;
    width: auto;
}

.kode_top2_info li {
    float: left;
    padding: 21px 16px 21px;
    border-right: 1px solid #d9d9d9;
    width: auto;
    list-style: none;
}

.kode_top2_info li:first-child {
    padding-left: 0px;
}

.kode_top2_info li:last-child {
    border-right: none;
}

.kode_top2_info li span {
    display: block;
    text-transform: uppercase;
    font-size: 12px;
    line-height: normal;
    margin-bottom: 1px;
}

.kode_top2_info li span i {
    margin-right: 10px;
}

.kode_top2_info li a {
    display: block;
    font-size: 14px;
    color: #666666;
}

.kode_top2_icon {
    float: right;
    text-align: right;
}

.kode_top2_icon ul li,
.kode_top2_icon ul {
    float: left;
}

.kode_top2_icon>ul {
    border-left: 1px solid #d9d9d9;
    width: auto;
    margin-left: 0px;
    margin-bottom: 0px;
}

.kode_top2_info ul {
    margin: 0px 0px;
}

.kode_top2_icon>ul>li {
    padding: 20px 20px 16px;
    border-right: 1px solid #d9d9d9;
    float: left;
    list-style: none;
    width: auto;
    margin-bottom: 0px;
    line-height: 25px;
}

.kode_top2_info ul li {
    margin-bottom: 0px;
    line-height: normal;
}

.kode_top2_info ul li i {
    margin-right: 10px;
}

.kode_top2_info .fa.icon.icon-multimedia {
    position: relative;
    top: 2px;
}

.kode_top2_icon>ul>li a {
    display: inline-block;
    position: relative;
    font-size: 18px;
    line-height: 20px;
}

.kode_top2_icon ul>li>a span {
    background-color: #ffffff;
    border-radius: 100%;
    box-shadow: 0 0 7px -3px #000000;
    font-size: 8px;
    font-weight: bold;
    height: 12px;
    line-height: 12px;
    position: absolute;
    right: -7px;
    text-align: center;
    top: 0;
    width: 12px;
}


/* drop down style */

.kode_top2_icon .dropdown {
    cursor: pointer;
}

.kode_top2_icon .dropdown span {
    margin-left: 4px;
}

.kode_top2_icon .dropdown ul {
    left: -20px;
    padding: 0;
    top: 40px;
    width: 150px;
    background: rgba(0, 0, 0, 0.85) none repeat scroll 0 0;
}

.kode_top2_icon .dropdown ul li {
    width: 100%;
}

.kode_top2_icon .dropdown ul li a {
    padding: 6px 15px;
    display: block;
}


/* donate btn start */

.donate_btn {
    display: inline-block;
    float: right;
    padding: 8px 0 9px;
    cursor: pointer;
}

.medium_btn {
    display: inline-block;
    text-transform: uppercase;
    color: #fff;
    font-size: 16px;
    padding: 10px 20px 10px;
    line-height: normal;
    font-weight: 600;
    border-radius: 2px;
    margin-left: 20px;
}

.donate_btn .modal-body,
.donate_btn .modal-content {
    float: left;
    width: 100%;
}

.kode_newsletter_form .kf_commet_field input[type="submit"]:hover {
    box-shadow: 0px 0px;
    border: none;
}

.kode_newsletter_form .kf_commet_field input[type="submit"] {
    padding: 17px 0;
    height: auto;
}

.donate_btn {
    display: inline-block;
    float: right;
    padding: 11px 0 10px;
}

.donate_btn .modal-content {
    background: #f9f9f9;
}

.donate_btn .kode_payment_list h5,
.donate_btn .kode_doantion_amount h4,
.donate_btn .kode_donation_row h4 {
    text-align: left;
}

.donate_btn .modal-body,
.donate_btn .kode_donate_des {
    width: 100%;
    padding: 0px 0px;
}

.donate_btn .modal-dialog {
    margin: 60px auto;
}

.donate_btn .modal-content {
    padding: 50px 25px;
}

.donate_btn .chosen-results li {
    width: 100%;
    text-align: left;
}

.donate_btn .kode_payment_list {
    padding: 10px 0;
}

.donate_btn button.close {
    border-radius: 100%;
    height: 25px;
    line-height: 20px;
    opacity: 1;
    position: absolute;
    right: -6px;
    top: -8px;
    width: 25px;
    z-index: 9999;
    background-color: #fff;
}

.donate_btn .close>span {
    position: relative;
    top: -2px;
}


/*
	=======================================
		KODE TOP2 WRAP END
	=======================================
*/


/*
	=======================================
		KODE NAVIGATION WRAP START
	=======================================
*/

.header {
    float: left;
    width: 100%;
}

.header .kode_navigation_wrap {
    padding: 20px 0px;
}

.header .top_logo {
    float: left;
    width: 25%;
}

.header .navigation {
    float: left;
    padding: 10px 0 10px;
    width: auto;
}

.header .navigation ul {
    text-align: left;
}

.header .navigation ul>li {
    margin-left: 24px;
    padding: 0px 0px;
}

.header .navigation ul.menu>li.current-menu-item.current_page_item a {
    background: none;
}

.header .navigation ul.menu>li.current-menu-item.current_page_item a,
.header .navigation ul>li>a {
    padding: 0px 0px;
    font-size: 14px;
    position: relative;
    z-index: 9999999;
    color: #333333;
    font-weight: 300;
}

.header .navigation ul li a:hover:before,
.header .navigation ul li a:hover {
    background: none !important;
}


/* navigation drop down style*/

.header .navigation ul ul {
    width: 200px;
    border-top: 2px solid;
    border-bottom: 3px solid;
}

.header .navigation ul ul li a {
    padding: 8px 15px;
    text-transform: uppercase;
}

.header .navigation ul li:hover>ul {
    top: 66px;
}

.kode_navi_icon {
    float: right;
    padding: 13px 0;
}

.kode_navi_icon li {
    float: left;
}

.kode_navi_icon li {
    margin-right: 15px;
}

.kode_navi_icon li a {
    display: inline-block;
    height: 32px;
    width: 32px;
    text-align: center;
    line-height: 32px;
    background-color: #f2f2f2;
    border-radius: 100%;
    color: #bcbcbc;
}


/*
	=======================================
		KODE NAVIGATION WRAP END
	=======================================
*/


/*
	=======================================
		KODE BANNER2 WRAP START
	=======================================
*/

.kode_banner2_des {
    float: left;
    width: 100%;
}

.kode_banner2_fig {
    position: absolute;
    left: 53%;
    bottom: 0px;
    text-align: center;
}

.kode_banner2_fig figure {
    width: auto;
}

.kode_banner_wrap.banner2 .them_overlay:before {
    background-color: #202020;
    opacity: 0.95;
}

.kode_banner_wrap.banner2 .kode_banner_text {
    text-align: left;
    margin-left: -550px;
    width: 500px;
    margin-top: -128px;
}

.kode_banner_wrap.banner2 .kode_banner_text .large_text {
    font-size: 44px;
    margin-bottom: 7px;
}

.kode_banner_wrap.banner2 .kode_banner_text .large_text:before,
.kode_banner_wrap.banner2 .kode_banner_text .large_text:after {
    content: "";
}

.kode_banner_wrap.banner2 .kode_banner_text .mediume_text {
    font-size: 20px;
    font-weight: 400;
}

.kode_banner_wrap.banner2 .slick-prev,
.kode_banner_wrap.banner2 .slick-next {
    height: 58px;
    width: 58px;
    border-radius: 100%;
    border: 1px solid #f2f2f2;
    background: none;
    left: 30px;
}

.kode_banner_wrap.banner2 .slick-next {
    right: 30px;
    left: auto;
}

.kode_banner_wrap.banner2 .slick-prev:before,
.kode_banner_wrap.banner2 .slick-next:before {
    line-height: 58px;
    content: "\f177";
}

.kode_banner_wrap.banner2 .slick-next:before {
    content: "\f178";
}


/*
	=======================================
		KODE BANNER2 WRAP END
	=======================================
*/


/*
	=======================================
		KODE MOSQUE2 WRAP START
	=======================================
*/

.kode_mosque2_text,
.kode_mosque2_des,
.kode_mosque2_fig,
.kode_mosque2_wrap {
    float: left;
    width: 100%;
}

.kode_mosque2_fig .them_overlay:before {
    transform: skew(-17deg) translate(44px);
    opacity: 0;
    left: 15px;
    bottom: 10px;
}

.kode_mosque2_fig:hover .them_overlay:before {
    opacity: 0.5;
    z-index: 99;
}

.kode_mosque2_fig figure {
    z-index: 999;
    padding: 0 0 10px 15px;
}

.kode_mosque2_fig figure:after {
    position: absolute;
    content: "";
    top: 10px;
    left: 0px;
    right: 15px;
    bottom: 0px;
    z-index: -1;
    transform: skew(-17deg) translate(44px);
}

.kode_mosque2_wrap {
    padding: 78px 0px 80px;
}

.section_hdg.hdg_4 h3 {
    display: block;
}

.kode_mosque2_text p {
    margin-bottom: 18px;
}

.kode_mosque2_text p:last-child {
    margin-bottom: 23px;
}


/*
	=======================================
		KODE MOSQUE2 WRAP END
	=======================================
*/


/*
	=======================================
		KODE PILLARS WRAP PILLARS 2 START
	=======================================
*/

.section_hdg.hdg_2.hdg_3.hdg_4 {
    margin-bottom: 88px;
}

.kode_pillars_wrap.pillare_2 {
    overflow: hidden;
}

.kode_pillars_wrap.pillare_2 .kode_pillars_text {
    border-radius: 100%;
    height: 550px;
    margin-bottom: -110px;
    padding: 80px 0 0;
    width: 572px;
    background-image: url("images/piller-bg.png");
    background-repeat: no-repeat;
    z-index: 999;
}

.kode_pillars_wrap.pillare_2 .kode_pillars_text:after {
    position: absolute;
    content: "";
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background-color: #000;
    opacity: 0.6;
    border-radius: 100%;
    z-index: -1;
}

.kode_pillars_wrap.pillare_2 .kode_pillars_text:before {
    border: 3px dotted;
    top: -15px;
    left: -15px;
    right: -15px;
    bottom: -15px;
    border-radius: 100%;
}

.kode_pillars_wrap.pillare_2 .kode_pillars_text figure img,
.kode_pillars_wrap.pillare_2 .kode_pillars_text figure {
    width: auto;
    float: none;
}

.kode_pillars_wrap.pillare_2 .kode_pillars_item {
    margin-bottom: 0px;
}

.kode_pillars_wrap.pillare_2 ._2 {
    margin-bottom: 0px;
}

.kode_pillars_wrap.pillare_2 .center:after,
.kode_pillars_wrap.pillare_2 .right_bottom:after,
.kode_pillars_wrap.pillare_2 .left_bottom:after,
.kode_pillars_wrap.pillare_2 .right_center:after,
.kode_pillars_wrap.pillare_2 .left_center:after,
.kode_pillars_wrap.pillare_2 .kode_pillars_item li a:before {
    border: none;
}

.kode_pillars_wrap.pillare_2 .kode_pillars_item_2 li a:before {
    border: none;
}

.kode_pillars_wrap.pillare_2 .right_bottom,
.kode_pillars_wrap.pillare_2 .left_bottom {
    left: 103px;
    right: auto;
}

.kode_pillars_wrap.pillare_2 .right_bottom {
    left: auto;
    right: 103px;
}

.kode_pillars_wrap.pillare_2 .right_center,
.kode_pillars_wrap.pillare_2 .left_center {
    bottom: 296px;
    left: 170px;
}

.kode_pillars_wrap.pillare_2 .right_center {
    right: 170px;
    left: auto;
}

.kode_pillars_wrap.pillare_2 .left_center {
    left: 170px;
    right: auto;
}

.kode_pillars_wrap.pillare_2 .center {
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    text-align: center;
    top: -15%;
}

.kode_services_wrap.service_2 {
    background-color: #f7f7f7;
}


/*
	=======================================
		KODE PILLARS WRAP PILLARS 2 END
	=======================================
*/


/*
	=======================================
		KODE BUILDING WRAP START
	=======================================
*/

.kode_building_des,
.kode_building_wrap {
    float: left;
    width: 100%;
}

.kode_building_wrap {
    background-image: url("images/bulding.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 105px 0px;
}

.kode_building_wrap.them_overlay:before {
    opacity: 0.94;
    background-color: #252525;
}

.kode_building_des figure {
    width: auto;
    border-radius: 100%;
}

.kode_building_des .them_overlay:before {
    opacity: 0;
}

.kode_building_des:hover .them_overlay:before {
    opacity: 0.3;
    z-index: 99;
}

.kode_building_text {
    overflow: hidden;
    padding-left: 30px;
}

.kode_building_text h3,
.kode_building_text h4 {
    margin-bottom: 10px;
}

.kode_building_text h3 {
    margin-bottom: 17px;
}

.kode_building_text p {
    margin-bottom: 28px;
}

.kode_canvas_detail.canvas_2 {
    border-right: medium none;
    float: right;
    padding: 30px 50px 0 0;
    width: auto;
}

.kode_canvas_detail.canvas_2 .progress-bar div {
    height: 184px;
    width: 184px;
}

.kode_canvas_detail.canvas_2 .progress-bar div span {
    height: 170px;
    width: 170px;
    line-height: 148px;
}

.kode_canvas_detail.canvas_2>span {
    font-size: 18px;
    left: 8px;
    position: relative;
    top: -27px;
}


/*
	=======================================
		KODE BUILDING WRAP END
	=======================================
*/


/*
	=======================================
		KODE CLIENT WRAP CLIENT 2 START
	=======================================
*/

.kode_client_wrap.client_2 {
    background: none;
}

.kode_client_wrap.client_2 .kode_client_text:hover {
    background-color: #f7f7f7;
}


/*
	=======================================
		KODE CLIENT WRAP CLIENT 2 END
	=======================================
*/


/*
	=======================================
		KODE GALLERY WRAP START
	=======================================
*/

.kode_gallery_detail {
    float: left;
    width: 100%;
    margin-bottom: 30px;
}

.kode_gallery_list {
    float: left;
    width: 50.5%;
}

.kode_gallery_list.list_2 {
    margin-right: 11px;
    width: 48.4%;
}

.kode_gallery_list .kode_gallery_fig {
    width: 100%;
    margin-bottom: 10px;
}

.kode_gallery_list .kode_gallery_fig figure {
    width: auto;
}

.kode_gallery_fig.fig_2 {
    float: left;
    width: 49%;
    margin-right: 10px;
    margin-bottom: 10px;
}


/*
	=======================================
		KODE GALLERY WRAP END
	=======================================
*/


/*
	=======================================
		KODE EVENT WRAP START
	=======================================
*/

.kode_event_video,
.kode_event_fig,
.kode_calender_detail.detail_2 .kode_event_text span,
.kode_event_wrap {
    float: left;
    width: 100%;
}

.kode_event_wrap {
    padding: 80px 0px;
}

.kode_calender_detail.detail_2 {
    padding: 0px 0px;
    background: none;
}

.kode_calender_detail.detail_2 li:first-child {
    padding-top: 0px;
}

.kode_calender_detail.detail_2 li:last-child {
    padding-bottom: 0px;
}

.kode_calender_detail.detail_2 .kode_calender_list>span {
    width: 95px;
    height: 107px;
    font-size: 36px;
    font-weight: bold;
    padding: 25px 0px;
}

.kode_calender_detail.detail_2 .kode_calender_list>span i {
    font-size: 20px;
    display: block;
    font-weight: 400;
    margin-top: 12px;
}

.kode_calender_detail.detail_2 .kode_event_text {
    padding-left: 30px;
}

.kode_calender_detail.detail_2 .kode_event_text h4 {
    margin-bottom: 7px;
}

.kode_calender_detail.detail_2 .kode_event_text p {
    margin-bottom: 6px;
}

.kode_event_text span i {
    margin-right: 8px;
}

.kode_event_text span a {
    display: inline-block;
}

.kode_event_fig a {
    position: absolute;
    top: 50%;
    left: 0px;
    right: 0px;
    margin: auto;
    font-size: 75px;
    text-align: center;
    margin-top: -40px;
    z-index: 10;
}

.kode_event_fig .them_overlay:before {
    opacity: 0.45;
    z-index: 9;
}


/*
	=======================================
		KODE EVENT WRAP END
	=======================================
*/


/*
	=======================================
		WIDGET WRAP WIDGET 02 START
	=======================================
*/

.widget_wrap.widget_2.them_overlay:before {
    opacity: 0.85;
    background-color: #131313;
}

.widget_event.event_2 .kode_textarea textarea,
.widget_event.event_2 .kf_commet_field input,
.widget_logo.logo_2 .widget_call_info {
    border-color: #fff;
}

.form-submit .medium_btn {
    cursor: pointer;
}

.widget_event.event_2 .form-submit .medium_btn:hover {
    background-color: #fff;
}

.widget_event.event_2 .kode_calender_list>span {
    background-color: #989898;
}


/*
	=======================================
		WIDGET WRAP WIDGET 02 START
	=======================================
*/


/*
	---------------------------------------------------------------------------
	===========================================================================
						ABOUT US PAGE START
	===========================================================================
	---------------------------------------------------------------------------
*/


/*
	=======================================
		KODE SAB BANNER WRAP START
	=======================================
*/

.sab_banner_text,
.kode_sab_banner_wrap {
    float: left;
    width: 100%;
}

.kode_sab_banner_wrap {
    padding: 60px 0px 65px;
    background-repeat: no-repeat;
    background-size: cover;
    animation: 10s linear 0s normal none infinite running shafaqat;
    background: rgba(0, 0, 0, 0) url("images/banner-pattran-bg.png") repeat scroll 0 0;
}

@-webkit-keyframes shafaqat {
    0% {
        background-position: 50% 0;
    }
    100% {
        background-position: 120px 0%;
    }
}

@-moz-keyframes shafaqat {
    0% {
        background-position: 50% 0;
    }
    100% {
        background-position: 120px 0%;
    }
}

@-ms-keyframes shafaqat {
    0% {
        background-position: 50% 0;
    }
    100% {
        background-position: 120px 0%;
    }
}

@keyframes shafaqat {
    0% {
        background-position: 50% 0;
    }
    100% {
        background-position: 120px 0%;
    }
}

.kode_sab_banner_wrap.them_overlay:before {
    opacity: 0.97;
}

.sab_banner_text {
    text-align: center;
    position: relative;
}

.breadcrumb {
    background: transparent none repeat scroll 0 0;
    display: inline-block;
    float: none;
    margin: 0;
    padding: 0;
    width: auto;
}

.breadcrumbs li {
    margin-right: 33px;
    position: relative;
    display: inline-block;
}

.breadcrumbs li:last-child {
    margin-right: 0px;
}

.kode_sab_banner_wrap .sab_banner_text .breadcrumbs li strong {
    text-transform: uppercase;
    font-size: 14px;
    color: #fff;
}

.kode_sab_banner_wrap .breadcrumbs li:last-child:before {
    content: "";
}

.kode_sab_banner_wrap .sab_banner_text .breadcrumb li strong {
    color: #ffffff;
}

.kode_sab_banner_wrap .sab_banner_text .breadcrumb li {
    position: relative;
    margin-right: 25px;
}

.kode_sab_banner_wrap .sab_banner_text .breadcrumb li:before {
    bottom: 0;
    color: #ffffff;
    content: "ï„…";
    font-family: fontawesome;
    font-size: 15px;
    left: -14px;
    position: absolute;
    top: 1px;
}

.kode_sab_banner_wrap .sab_banner_text .breadcrumb li:first-child:before {
    content: "";
}


/*
	=======================================
		KODE SAB BANNER WRAP END
	=======================================
*/


/*
	=======================================
		KODE PHILOSOPHY WRAP START
	=======================================
*/

.kode_philosophy_text,
.kode_Philosophy_wrap {
    float: left;
    width: 100%;
}

.kode_Philosophy_wrap {
    padding: 80px 0px 120px;
    background-image: url("images/philosophy-pt.png");
    background-repeat: no-repeat;
    background-size: cover;
}

.kode_Philosophy_wrap.them_overlay:before {
    background-color: #fff;
    opacity: 0.95;
}

.kode_philosophy_text {
    text-align: center;
    padding: 30px 25px;
    border: 1px solid #d5d5d5;
    background-color: #fff;
}

.kode_philosophy_text:hover {
    box-shadow: 0px 0px 25px -12px;
}

.kode_philosophy_text span {
    display: inline-block;
    height: 99px;
    width: 99px;
    text-align: center;
    line-height: 99px;
    background-color: #5c5c5c;
    border-radius: 100%;
    font-size: 42px;
    margin-bottom: 17px;
}

.kode_philosophy_text h4 {
    padding-bottom: 11px;
    margin-bottom: 10px;
    position: relative;
}

.kode_philosophy_text h4:before {
    position: absolute;
    content: "";
    left: 0px;
    right: 0px;
    bottom: 0px;
    width: 132px;
    border-bottom: 1px solid #d2d2d2;
    margin: auto;
}

.kode_philosophy_text p {
    margin-bottom: 20px;
}


/*slick slider start*/

.kode_Philosophy_wrap .slick-slide {
    padding: 0 15px;
}

.kode_Philosophy_wrap .slick-dots {
    border: 1px solid;
    bottom: -70px;
    float: none;
    left: 0;
    margin: auto;
    padding: 4px 0 0;
    position: absolute;
    right: 0;
    text-align: center;
    width: 140px;
}

.kode_Philosophy_wrap .slick-dots li button {
    padding: 0px 0px;
    height: 14px;
    width: 14px;
}

.kode_Philosophy_wrap .slick-dots li {
    cursor: pointer;
    display: inline-block;
    height: 14px;
    margin: 0 5px;
    padding: 0;
    position: relative;
    width: 14px;
    background-color: #d4d4d4;
    border-radius: 100px;
}

.kode_Philosophy_wrap .slick-dots li button:before {
    content: "";
}

.kode_Philosophy_wrap .slick-prev,
.kode_Philosophy_wrap .slick-next {
    display: none !important;
}


/*
	=======================================
		KODE PHILOSOPHY WRAP END
	=======================================
*/


/*
	=======================================
		KODE CLIENT WRAP CLIENT 3 START
	=======================================
*/

.kode_client_wrap.client_3 {
    padding: 80px 0px 138px;
}

.kode_client_wrap.client_3 .kode_client_text {
    background-color: #fff;
}

.kode_client_wrap.client_3 .kode_client_text p:after {
    left: -3px;
}

.kode_client_wrap .slick-slide {
    padding: 0px 15px;
}

.kode_client_wrap.client_3 .slick-prev,
.kode_client_wrap.client_3 .slick-next {
    top: auto;
    bottom: -80px;
    left: -55px;
    right: 0px;
    text-align: center;
    margin: auto;
    height: 46px;
    width: 46px;
    background-color: #333333;
    border-radius: 2px;
}

.kode_client_wrap.client_3 .slick-next {
    right: -115px;
}

.kode_client_wrap.client_3 .slick-prev:before,
.kode_client_wrap.client_3 .slick-next:before {
    line-height: 46px;
}


/*
	=======================================
		KODE CLIENT WRAP CLIENT 3 END
	=======================================
*/


/*
	---------------------------------------------------------------------------
	===========================================================================
						BLOG PAGE START
	===========================================================================
	---------------------------------------------------------------------------
*/


/*
	=======================================
		KODE BLOG MADIUM WRAP START
	=======================================
*/

.kode_blog_des,
.kode_blog_madium_wrap {
    float: left;
    width: 100%;
}

.kode_blog_madium_wrap {
    padding: 80px 0px;
    background-color: #f7f7f7;
}

.kode_blog_des .kode_blog_text {
    padding: 27px 30px 30px 30px;
    position: relative;
}

.kode_blog_des {
    margin-bottom: 30px;
    background-color: #fff;
}

.kode_blog_des:hover figure img {
    transform: scale(1.7);
    -moz-transform: scale(1.7);
    -webkit-transform: scale(1.7);
}

.kode_blog_des .them_overlay:before {
    opacity: 0;
    z-index: 9;
}

.kode_blog_des:hover .them_overlay:before {
    opacity: 0.65;
}

.kode_blog_des:hover {
    box-shadow: 0 0 10px -1px;
}

.kode_blog_text h4 {
    margin-bottom: 15px;
    margin-top: 0px;
}

.kode_blog_text h4 span {
    display: block;
}

.kode_blog_des .kode_meta.meta_2 {
    margin-bottom: 12px;
    margin-left: 0px;
}

.kode_blog_des .kode_meta.meta_2 li {
    border-right: none;
    list-style: none;
    width: auto;
}

.kode_blog_des .kode_meta.meta_2 li a {
    text-transform: uppercase;
}

.kode_blog_des .kode_blog_text .share_link {
    position: absolute;
    right: 30px;
    bottom: 35px;
    height: 33px;
    width: 33px;
    border: 1px solid #d5d5d5;
    border-radius: 100%;
    text-align: center;
    line-height: 33px;
    color: #d4d4d4;
}

.kode_blog_des figure .btn_hover2:before {
    border-radius: 100%;
}

.kode_blog_fig .kode_blog_text .kode_meta li>i {
    margin-right: 7px;
}


/* KODE PAGINATION START */

.kode-pagination,
.kode_pagination {
    margin: auto;
    padding: 15px 0;
    text-align: center;
    overflow: hidden;
    width: 390px;
    margin-top: 10px;
}

.kode_pagination .next,
.kode_pagination .prve {
    height: auto;
    width: auto;
}

.kode-pagination .next:hover,
.kode-pagination .prve:hover,
.kode_pagination .next:hover,
.kode_pagination .prve:hover {
    background: none;
}

.kode-pagination .next,
.kode-pagination .next i,
.kode_pagination .next,
.kode_pagination .next i {
    margin-left: 10px;
}

.kode-pagination .prve,
.kode-pagination .prve i,
.kode_pagination .prve,
.kode_pagination .prve i {
    margin-right: 10px;
}

.kode-pagination .page-numbers.current,
.kode-pagination a,
.kode_pagination a {
    display: inline-block;
    height: 30px;
    width: 30px;
    text-align: center;
    line-height: 30px;
    font-weight: bold;
    color: #000;
    border-radius: 2px;
    margin-right: 5px;
}

.kode-pagination .next.page-numbers,
.kode-pagination .prev.page-numbers {
    width: auto;
}

.kode-pagination {
    margin-bottom: 30px;
}


/*
	=======================================
		KODE BLOG MADIUM WRAP END
	=======================================
*/


/*
	---------------------------------------------------------------------------
	===========================================================================
						BLOG GRID PAGE START
	===========================================================================
	---------------------------------------------------------------------------
*/

.kode_blog_caption {
    float: left;
    width: 100%;
    padding: 15px 30px 0px 30px;
    margin-bottom: 0px;
}

.kode_blog_des.des_2 .kode_blog_text {
    padding: 27px 1px 35px 1px;
}

.kode_blog_des.des_2 .kode_blog_text h4 {
    padding: 0px 30px 15px 30px;
    border-bottom: 1px solid #dadada;
    margin-bottom: 0px;
}

.kode_blog_caption .kode_meta.meta_2 {
    margin-bottom: 0px;
}

.kode_blog_caption .kode_meta.meta_2 li:first-child {
    padding-right: 0px;
}

.kode_blog_caption p {
    margin-bottom: 22px;
}

.kode_blog_des.des_2 .kode_blog_text .share_link {
    bottom: 30px;
}


/*
	---------------------------------------------------------------------------
	===========================================================================
						BLOG DETAIL PAGE START
	===========================================================================
	---------------------------------------------------------------------------
*/

.kode_blog_detail_post,
.comment_des,
.comment>li,
.comment,
.kode_comments,
.kode_social_share,
.blog_text,
.kode_detail_fig,
blockquote,
.kode_blog_detail_text,
.kode_blog_detail_des,
.kode_blog_detail_row {
    float: left;
    width: 100%;
}

.kode_blog_madium_wrap.detail {
    background: none;
    padding: 0px 0px 50px;
}

.comment_des .them_overlay:before,
.kode_detail_fig .them_overlay:before {
    opacity: 0;
}

.comment_des:hover .them_overlay:before,
.kode_detail_fig:hover .them_overlay:before {
    opacity: 0.35;
}

.kode_blog_detail_des {
    padding-bottom: 20px;
}

.kode_blog_detail_text {
    padding: 15px;
    background: #f9f9f9;
    border-bottom: 1px solid #e2e2e2;
    margin-bottom: 0px;
}

.kode_blog_detail_text h3 {
    padding-bottom: 15px;
}

.kode_blog_detail_text .kode_meta.meta_2 li {
    line-height: 12px;
    padding: 0px 30px;
    float: left;
    list-style: none;
    width: auto;
}

.kode_blog_detail_text h3 {
    margin: 0px;
}

.kode_blog_detail_text .kode_meta.meta_2 li:first-child {
    padding-left: 0px;
}

.kode_blog_detail_text .kode_meta.meta_2 li a {
    font-size: 12px;
    line-height: 14px;
    text-transform: uppercase;
}

.kode_blog_detail_des p {
    margin-bottom: 18px;
}

.kode_blog_detail_des p:last-child {
    margin-bottom: 0px;
}


/* BLOG QUOTE START */

blockquote {
    padding: 30px 30px;
    border-left: 6px solid;
    background-color: #f7f7f7;
    margin-bottom: 20px;
    margin-top: 10px;
}

blockquote span {
    float: left;
    height: 82px;
    width: 82px;
    text-align: center;
    line-height: 82px;
    border-radius: 100%;
    font-size: 33px;
    display: inline-block;
}

.quote_text {
    overflow: hidden;
    padding-left: 30px;
}


/* KODE DETAIL FIG START */

.kode_detail_fig {
    margin-bottom: 24px;
}

.kode_detail_fig figure {
    width: 50%;
}

.kode_detail_fig_text {
    float: left;
    width: 50%;
    padding-left: 30px;
}

.kode_detail_fig_text p:last-child {
    margin-bottom: 0px;
}

.kode_detail_fig.fig_2 .kode_detail_fig_text {
    padding-left: 0px;
    padding-right: 30px;
}

.blog_text {
    margin-bottom: 24px;
}


/* KODE SOCIAL SHARE START */

.kode_social_share {
    padding: 18px 30px 14px;
    background-color: #f9f9f9;
    margin-bottom: 38px;
}

.kode_social_share>a {
    float: left;
    margin-right: 30px;
}

.kode_social_share>a i {
    margin-right: 10px;
}

.social_meta li,
.social_meta {
    float: left;
    width: auto;
}

.social_meta li {
    margin-right: 15px;
    float: left;
    list-style: none;
}

.social_meta li a {
    height: 26px;
    width: 26px;
    text-align: center;
    line-height: 26px;
    border-radius: 100%;
    background-color: #d4d4d4;
    display: inline-block;
}

.kode_social_share .kode_pagination {
    width: auto;
    background: none;
    padding: 0px 0px;
    margin: 0px 0px;
    float: right;
}


/* KODE COMMENT START */

.comment_title {
    margin-bottom: 25px;
    margin-top: 0px;
}

.comment_des {
    padding: 30px 0px;
    border-bottom: 1px solid #d4d4d4;
}

.comment_des figure {
    width: auto;
    border-radius: 100%;
}

.comment_des .them_overlay:before {
    border-radius: 100%;
}

.comment_text {
    overflow: hidden;
    padding-left: 30px;
    margin-top: -5px;
}

.comment_text p {
    margin-bottom: 5px;
}

.comment_text .kode_meta {
    margin-bottom: 0px;
    padding-left: 0px;
}

.comment_text .kode_meta>li a {
    text-transform: uppercase;
    font-size: 14px;
    color: #333;
}

.comment ul {
    padding-left: 30px;
    float: left;
    width: 100%;
}

.comment_des.padding {
    padding-top: 0px;
}


/* KODE COMMENT START */

.kode_comments .kf_commet_field {
    float: left;
    width: 47.9%;
    margin-right: 30px;
    margin-bottom: 30px;
}

.kf_commet_field:nth-child(4),
.kf_commet_field:nth-child(2) {
    margin-right: 0;
}

.kode_comments .form-submit {
    margin-bottom: 0px;
}

.kode_comments .kode_textarea textarea {
    border-color: #e9e9e9;
}

.kode_comments .kode_textarea textarea::-moz-placeholder {
    color: #666;
}

.kode_comments .form-submit .medium_btn {
    border: none;
}

.kode_blog_detail_post .section_hdg {
    margin-bottom: 23px;
}

.kode_blog_detail_post .section_hdg h3 {
    font-size: 20px;
}


/*
	---------------------------------------------------------------------------
	===========================================================================
						BLOG DETAIL PAGE END
	===========================================================================
	---------------------------------------------------------------------------
*/


/*
	---------------------------------------------------------------------------
	===========================================================================
						404 PAGE START
	===========================================================================
	---------------------------------------------------------------------------
*/

.kode_404_text,
.kode_404_wrap {
    float: left;
    width: 100%;
}

.kode_404_wrap {
    background-image: url("images/404-bg.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    z-index: 99;
    padding: 140px 0px 164px;
    height: 100%;
}

.kode_404_text {
    text-align: center;
}

.kode_404_wrap:before {
    position: absolute;
    content: "";
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    z-index: -1;
    background: rgba(0, 0, 0, 0) linear-gradient(5deg, #ffffff, #000000) repeat scroll 0 0;
    opacity: 0.5;
}

.kode_404_text h2 {
    font-size: 375px;
    font-weight: bold;
    line-height: 375px;
}

.kode_404_text h2 span {
    display: inline-block;
    font-size: 207px;
    font-weight: 500;
    position: relative;
    height: 289px;
    width: 280px;
    text-align: center;
    top: -23px;
    margin: 0px -30px;
}

.kode_404_text h2 span:before {
    background-image: url("images/404_bg1.png");
    position: absolute;
    content: "";
    top: 16px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    z-index: -1;
}

.kode_404_text h3 {
    padding: 22px 50px 13px;
    font-size: 84px;
    display: inline-block;
    line-height: 84px;
    text-shadow: 5px 4px #deb47e;
    box-shadow: 0px 0px 18px -1px;
    margin-bottom: 40px;
}

.kode_404_text p {
    font-size: 33px;
    text-transform: uppercase;
    line-height: normal;
    margin-bottom: 42px;
}


/*
	---------------------------------------------------------------------------
	===========================================================================
						404 PAGE END
	===========================================================================
	---------------------------------------------------------------------------
*/


/*
	---------------------------------------------------------------------------
	===========================================================================
						COMING SOON PAGE START
	===========================================================================
	---------------------------------------------------------------------------
*/

.coming_social_icon,
.countdown.timer,
.kode_coming_soon_wrap {
    float: left;
    width: 100%;
}

.kode_coming_soon_wrap {
    background-image: url("images/coming-bg.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    z-index: 99;
    padding: 167px 0px;
    height: 100%;
}

.kode_coming_soon_wrap:before {
    position: absolute;
    content: "";
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    z-index: -1;
    background: rgba(0, 0, 0, 0) linear-gradient(0deg, #ffffff, #000000) repeat scroll 0 0;
    opacity: 0.85;
}

.kode_coming_text {
    text-align: center;
    width: 834px;
    margin: auto;
}

.kode_coming_text a img {
    margin-bottom: 54px;
}

.kode_coming_text h2 {
    text-transform: uppercase;
    margin-bottom: 40px;
}

.countdown.timer {
    margin-bottom: 50px;
}

.countdown.timer li {
    display: inline-block;
    width: 110px;
    height: 100px;
    text-align: center;
    border: 1px solid #fff;
    padding: 22px 0;
    margin-right: 25px;
}

.countdown.timer li:last-child {
    margin-right: 0px;
}

.countdown.timer li span {
    display: block;
    font-size: 33px;
    margin-bottom: 12px;
}

.countdown.timer li h5 {
    margin-bottom: 0px;
    text-transform: uppercase;
}

.kode_coming_text .progress {
    height: 24px;
    overflow: hidden;
    text-align: center;
    outline: 1px solid #fff;
    outline-offset: -1px;
    margin-bottom: 68px;
}

.kode_coming_text .progress-bar {
    color: #ffffff;
    font-weight: 400;
    height: 24px;
    line-height: 21px;
    width: 70%;
}

.kode_coming_text .kode_search {
    float: none;
    margin: auto;
    width: 606px;
    margin-bottom: 40px;
}

.kode_coming_text .kode_search .kf_commet_field input::-moz-placeholder {
    color: #fff;
}

.kode_coming_text .kode_search .kf_commet_field button {
    width: 135px;
}

.coming_social_icon {
    text-align: center;
}

.coming_social_icon li {
    display: inline-block;
    margin-right: 18px;
}

.coming_social_icon li a {
    display: inline-block;
    height: 46px;
    width: 50px;
    text-align: center;
    line-height: 46px;
}

.blue {
    background-color: #3b5997;
}

.blue-light {
    background-color: #55acef;
}

.pinke {
    background-color: #e13b6b;
}

.red {
    background-color: #bc081d;
}


/*
	---------------------------------------------------------------------------
	===========================================================================
						COMING SOON PAGE END
	===========================================================================
	---------------------------------------------------------------------------
*/


/*
	---------------------------------------------------------------------------
	===========================================================================
						CONTACT US PAGE START
	===========================================================================
	---------------------------------------------------------------------------
*/

.kode_contact_text,
.kode_contact_service ul,
.kode_contact_service,
.kode_contact_wrap .comment-form,
.kode_contact_des,
.kode_contact_field,
.kode_contact_map,
.kode_contact_wrap {
    float: left;
    width: 100%;
}

.kode_contact_map .map-canvas {
    height: 400px;
    width: 100%;
}

.kode_contact_des {
    padding: 80px 0px;
}

.kode_contact_field {
    margin-bottom: 40px;
}

.kode_contact_field .kf_commet_field {
    margin-bottom: 30px;
}

.kode_contact_field .form-submit {
    display: inline-block;
    float: none;
    margin-bottom: 0;
    text-align: center;
    width: 100%;
}

.form-submit .medium_btn {
    border: none;
}

.kode_contact_field .form-submit .medium_btn {
    text-align: center;
    display: inline-block;
    width: auto;
}

.kode_contact_service {
    text-align: center;
}

.kode_contact_service ul li {
    display: inline-block;
    background-color: #f7f7f7;
    padding: 45px 0px;
    margin-right: 1%;
    width: 32%;
    position: relative;
    z-index: 9;
    overflow: hidden;
}

.kode_contact_service ul li:before {
    position: absolute;
    content: "";
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    z-index: -1;
    opacity: 0;
}

.kode_contact_service ul li:hover:before {
    opacity: 1;
    box-shadow: 0px 0px 30px -6px;
}

.kode_contact_text h5 {
    margin-bottom: 6px;
    margin-top: 0px;
}

.kode_detail_date .event_detail_list.list_2 li:hover a i,
.kode_contact_service .kode_contact_text:hover a {
    color: #fff !important;
}

.kode_contact_text>a {
    font-size: 16px;
    display: inline-block;
    margin-bottom: 3px;
}

.kode_contact_text p {
    margin-bottom: 0px;
}

.kode_contact_text p span {
    display: block;
}


/*
	---------------------------------------------------------------------------
	===========================================================================
						CONTACT US PAGE END
	===========================================================================
	---------------------------------------------------------------------------
*/


/*
	---------------------------------------------------------------------------
	===========================================================================
						EVENT PAGE START
	===========================================================================
	---------------------------------------------------------------------------
*/

.kode_event_detail li,
.kode_event_detail,
.kode_event_wrap {
    float: left;
    width: 100%;
}

.kode_event_detail li {
    background-color: #f0f0f0;
    padding: 25px 30px;
    border-radius: 3px;
    margin-bottom: 30px;
}

.kode_event_detail li:last-child {
    margin-bottom: 40px;
}

.kode_portfolio_des:hover,
.kode_event_speakar_fig:hover,
.kode_event_detail li:hover {
    box-shadow: 0px 11px 9px -10px #999;
}

.kode_event_ticket,
.kode_event_detail .kode_calender_list,
.kode_calender_list figure,
.event_date {
    float: left;
    width: auto;
}

.event_date {
    text-align: center;
    padding-right: 30px;
    position: relative;
}

.event_date:before {
    position: absolute;
    content: "";
    top: 20px;
    right: 0px;
    bottom: 0px;
    border-right: 1px solid #d0d0d0;
    height: 64px;
}

.event_date span {
    display: inline-block;
    font-size: 62px;
    font-weight: bold;
    line-height: 66px;
    margin-bottom: 3px;
}

.event_date p {
    margin-bottom: 0px;
    text-transform: uppercase;
}

.kode_event_detail .kode_calender_list {
    padding-left: 30px;
}

.kode_portfolio_des .them_overlay:before,
.kode_coming_fig .them_overlay:before,
.kode_event_speakar_fig .them_overlay:before,
.kode_event_detail .kode_calender_list .them_overlay:before {
    opacity: 0;
    z-index: 9;
}

.kode_portfolio_des:hover .them_overlay:before,
.kode_coming_fig:hover .them_overlay:before,
.kode_event_speakar_fig:hover .them_overlay:before,
.kode_event_detail .kode_calender_list:hover .them_overlay:before {
    opacity: 0.35;
}

.kode_event_detail .kode_calender_list .kode_event_text {
    padding: 0px 20px;
}

.kode_event_detail .kode_calender_list .kode_event_text h4 {
    margin-bottom: 2px;
}

.kode_event_detail .kode_calender_list .kode_event_text p {
    margin-bottom: 1px;
}

.kode_event_detail .kode_calender_list .kode_event_text p span {
    display: block;
    color: #999;
}

.kode_event_detail .kode_calender_list .kode_event_text span a {
    font-size: 12px;
    color: #333;
    line-height: 16px;
    font-weight: 400;
}

.kode_event_ticket {
    padding: 15px 0px;
}

.event_studium {
    display: inline-block;
    padding: 20px 30px 20px 20px;
    border-left: 1px solid #d0d0d0;
    border-right: 1px solid #d0d0d0;
    font-size: 12px;
}

.event_studium:hover {
    color: #333;
}

.event_studium i {
    margin-right: 10px;
    color: #333333;
}

.kode_event_ticket .medium_btn {
    margin-left: 28px;
    padding: 10px 20px;
}

.kode_event_wrap .kode_blog_list>ul {
    padding-bottom: 40px;
}


/*
	---------------------------------------------------------------------------
	===========================================================================
						EVENT PAGE END
	===========================================================================
	---------------------------------------------------------------------------
*/


/*
	---------------------------------------------------------------------------
	===========================================================================
						EVENT DETAIL PAGE START
	===========================================================================
	---------------------------------------------------------------------------
*/

.kode_blog_detail_des .kode_calender_detail.detail_2 {
    padding: 30px 0px;
    border-bottom: 1px solid #e9e9e9;
    margin-bottom: 25px;
}

.kode_calender_list {
    position: relative;
}

.kode_blog_detail_des .kode_calender_detail.detail_2 .kode_event_text {
    padding: 0 130px 0 20px;
}

.kode_blog_detail_des .kode_calender_detail.detail_2 .kode_event_text p {
    font-weight: 300;
    text-transform: lowercase;
}

.kode_blog_detail_des .kode_calender_detail.detail_2 .kode_event_text span a {
    font-weight: 300;
}

.kode_calender_list .medium_btn {
    position: absolute;
    top: 29px;
    right: 0px;
}


/* KODE DETAIL DATE START */

.event_detail_list li,
.kode_detail_date {
    float: left;
    width: 100%;
}

.kode_detail_date {
    background-color: #f7f7f7;
    padding: 26px 30px;
}

.event_detail_list {
    float: left;
    width: 50%;
    border-right: 1px solid #d6d6d6;
    padding: 0px;
    list-style: none;
    margin: 0px;
}

.event_detail_list li {
    margin-bottom: 21px;
}

.event_detail_list li:last-child {
    margin-bottom: 0px;
}

.event_detail_list li a {
    display: block;
    text-transform: uppercase;
    color: #999;
}

.event_detail_list li a i {
    margin-right: 10px;
}

.event_detail_list li a span {
    color: #666;
    display: inline-block;
    width: 100px;
    font-weight: 400;
}

.event_detail_list.list_2 {
    border-right: none;
    padding-left: 80px;
}

.event_detail_list.list_2 li a span {
    width: 80px;
}


/* KODE EVENT SPEAKER START */

.kode_event_speakar {
    float: left;
    width: 100%;
}

.kode_event_speakar_fig {
    background-color: #f7f7f7;
    float: left;
    margin-bottom: 25px;
    margin-right: 30px;
    padding: 20px 30px;
    width: 47.9%;
}

.kode_event_speakar_fig:nth-child(3) {
    margin-right: 0;
}

.kode_event_speakar_fig figure {
    width: auto;
    border-radius: 100%;
}

.kode_event_speaker_text {
    display: inline-block;
    overflow: hidden;
    margin-left: 40px;
    padding: 16px 0px 4px 40px;
    position: relative;
}

.kode_event_speaker_text:before {
    position: absolute;
    content: "";
    top: 7px;
    left: 0px;
    bottom: 0px;
    border-left: 1px solid #e5e5e5;
    height: 66px;
}

.kode_event_speaker_text h6 {
    margin-bottom: 5px;
}

.kode_event_speaker_text>p {
    margin-bottom: 0px;
}

.kode_event_speakar p {
    margin-bottom: 18px;
}

.kode_event_speakar p:last-child {
    margin-bottom: 26px;
}


/*
	---------------------------------------------------------------------------
	===========================================================================
						EVENT DETAIL PAGE END
	===========================================================================
	---------------------------------------------------------------------------
*/


/*
	---------------------------------------------------------------------------
	===========================================================================
						PORTFOLIO PAGE START
	===========================================================================
	---------------------------------------------------------------------------
*/

.kode_portfolio_detail ul,
.kode_portfolio_detail,
.kode_portfolio_text,
.kode_portfolio_des,
.kode_portfolio_wrap {
    float: left;
    width: 100%;
}

.kode_portfolio_des {
    margin-bottom: 30px;
    background-color: #fff;
}

.kode_portfolio_des:hover figure img {
    transform: scale(1.5);
    -moz-transform: scale(1.5);
    -webkit-transform: scale(1.5);
}

.kode_portfolio_text {
    padding: 18px 20px 15px;
}

.kode_portfolio_text h6 {
    margin-bottom: 10px;
}

.kode_portfolio_text h4 {
    margin-bottom: 8px;
}

.kode_portfolio_text p {
    margin-bottom: 0px;
}

.kode_portfolio_text p span {
    display: block;
}

.kode_portfolio_detail ul {
    text-align: center;
    margin-bottom: 40px;
}

.kode_portfolio_detail ul li {
    display: inline-block;
    margin-right: 20px;
}

.kode_portfolio_detail ul li a {
    display: inline-block;
    padding: 10px 20px 12px;
    line-height: normal;
    border: 1px solid #d5d5d5;
    border-radius: 2px;
    color: #333333;
}

.filtr-container {
    float: left;
    width: 100%;
}


/*
	---------------------------------------------------------------------------
	===========================================================================
						PORTFOLIO PAGE END
	===========================================================================
	---------------------------------------------------------------------------
*/


/*
	---------------------------------------------------------------------------
	===========================================================================
						PROJECT PAGE START
	===========================================================================
	---------------------------------------------------------------------------
*/

.kode_project_dollar,
.kode_project_text {
    float: left;
    width: 100%;
}

.kode_project_text {
    text-align: center;
    padding: 27px 30px 23px;
    background: #f9f9f9;
}

.kode_project_text h5,
.kode_project_text h4 {
    margin-bottom: 15px;
    margin-top: 0px;
}

.kode_project_text>span {
    height: 60px;
    width: 60px;
    text-align: center;
    line-height: 60px;
    border-radius: 100%;
    font-size: 20px;
    font-weight: 600;
    display: inline-block;
    margin-bottom: 13px;
}

.kode_project_dollar {
    margin-bottom: 8px;
}

.kode_project_dollar a {
    float: left;
    display: inline-block;
}

.kode_project_dollar a:last-child {
    float: right;
}

.kode_project_text p {
    margin-bottom: 0px;
}

.kode_project_text.text_2 .kode_project_dollar a {
    text-align: center;
    float: none;
}


/*
	---------------------------------------------------------------------------
	===========================================================================
						PROJECT PAGE END
	===========================================================================
	---------------------------------------------------------------------------
*/


/*
	---------------------------------------------------------------------------
	===========================================================================
						PROJECT LIST PAGE START
	===========================================================================
	---------------------------------------------------------------------------
*/

.kode_portfolio_des.des_2 figure {
    width: 50%;
}

.kode_portfolio_des.des_2 .kode_project_text {
    width: 50%;
    text-align: left;
    padding: 25px 30px 30px;
}

.kode_portfolio_des.des_2 .kode_project_text h4 {
    margin-bottom: 30px;
}

.kode_portfolio_des.des_2 .kode_project_text p {
    margin-bottom: 24px;
}

.kode_project_share .kode_social_share {
    float: right;
    padding: 9px 0px;
    background: none;
    width: auto;
    margin-bottom: 0px;
}

.kode_portfolio_des.des_2 .kode_project_dollar {
    margin-bottom: 18px;
}


/* Progress Bar Wrap CSS Start */

.progress-names {
    float: left;
    width: 100%;
}

.kode_attorney_detail_skill .progressbar {
    position: relative;
    width: 100%;
    height: 8px;
    padding: 0;
    margin: 0 auto;
    background-color: #e1e1e1;
    margin-bottom: 28px;
}

.kode_attorney_detail_skill .bar {
    position: absolute;
    display: block;
    width: 0px;
    height: 8px;
    top: 0px;
    left: 0px;
    overflow: hidden;
}

.kode_attorney_detail_skill .label {
    background: #000000 none repeat scroll 0 0;
    border-radius: 100%;
    color: #ffffff;
    display: block;
    font-size: 14px;
    font-weight: bold;
    height: 35px;
    left: 0;
    line-height: 35px;
    position: absolute;
    text-align: center;
    top: -17px;
    width: 35px;
    box-shadow: 1px 1px 5px 0px #dbdbdb;
}


/*
	---------------------------------------------------------------------------
	===========================================================================
						PROJECT LIST PAGE END
	===========================================================================
	---------------------------------------------------------------------------
*/


/*
	---------------------------------------------------------------------------
	===========================================================================
						SERVICE PAGE START
	===========================================================================
	---------------------------------------------------------------------------
*/


/*
	=======================================
		KODE SERVICE SEARCH FEILD START
	=======================================
*/

.kode_service_search_feild {
    float: left;
    width: 100%;
}

.kode_service_search_feild {
    background-image: url("images/service_bg.png"), url("images/service_bg1.png");
    background-position: left center, right center;
    background-repeat: no-repeat;
    background-size: 952px 860px;
    position: relative;
    z-index: 999;
}

.kode_service_search_feild.them_overlay:before {
    width: 50%;
    opacity: 0.75;
    z-index: -1;
}

.kode_service_search_feild:after {
    position: absolute;
    content: "";
    top: 0px;
    right: 0px;
    bottom: 0px;
    width: 50%;
    background-color: #a4a4a4;
    opacity: 0.25;
}

.kode_service_form {
    float: left;
    width: 50%;
    padding: 75px 119px 80px;
}

.kode_service_form .section_hdg {
    margin-bottom: 24px;
}

.kode_service_form .section_hdg h3 {
    margin-bottom: 7px;
}

.kode_service_form .section_hdg p {
    margin-bottom: 0px;
}

.kode_service_form .kf_commet_field input {
    border-color: #e2e2e2;
}

.kode_service_form .kode_textarea textarea::-moz-placeholder,
.kode_service_form .kf_commet_field input[type="text"]::-moz-placeholder {
    color: #f2f2f2;
}

.kode_service_form .kode_textarea textarea {
    background: none;
}


/*
	=======================================
		KODE SERVICE SEARCH FEILD END
	=======================================
*/


/*
	=======================================
		KODE PRICING WRAP START
	=======================================
*/

.pricing_list li,
.pricing_list,
.kode_pricing_dollar,
.kode_pricing_des,
.kode_pricing_wrap {
    float: left;
    width: 100%;
}

.kode_pricing_wrap {
    padding: 80px 0px;
    background-color: #f5f5f5;
}

.kode_pricing_des {
    text-align: center;
    background-color: #f8f8f8;
    border-top: 5px solid #e4e4e4;
    padding-bottom: 30px;
}

.kode_pricing_des:hover {
    box-shadow: 0 4px 13px -5px #ddd;
}

.kode_pricing_des h4 {
    padding: 22px 0px 20px;
    border-bottom: 1px solid #e4e4e4;
}

.kode_pricing_dollar {
    padding: 18px 30px 15px;
    border-bottom: 1px solid #e4e4e4;
}

.kode_pricing_des:hover .kode_pricing_dollar {
    background-color: #fff;
}

.kode_pricing_dollar h3 {
    display: inline-block;
    padding-bottom: 5px;
    border-bottom: 2px solid #bfbfbf;
    margin-bottom: 14px;
}

.kode_pricing_dollar p {
    margin-bottom: 0px;
}

.pricing_list {
    padding: 28px 0 29px;
}

.pricing_list li {
    margin-bottom: 10px;
}

.pricing_list li:last-child {
    margin-bottom: 0px;
}

.pricing_list li a {
    position: relative;
    display: inline-block;
    font-weight: 400;
}

.pricing_list li a:before {
    position: absolute;
    content: "\f00c";
    top: 0px;
    left: -28px;
    bottom: 0px;
    font-family: fontawesome;
}


/*
	=======================================
		KODE PRICING WRAP END
	=======================================
*/


/*
	---------------------------------------------------------------------------
	===========================================================================
						SERVICE PAGE END
	===========================================================================
	---------------------------------------------------------------------------
*/

.kode_service_des .right_arrow.btn {
    border: medium none;
    height: auto;
    opacity: 1;
    padding: 0;
    right: 30px;
    width: auto;
    color: #333333;
}

.kode_service_des .right_arrow.btn i {
    margin-left: 10px;
}

.kode_service_des:hover .right_arrow.btn {
    opacity: 1;
    background: none;
}

.kode_blog_madium_wrap.detail .kode_service_des {
    border: 1px solid #ececec;
}


/*
	---------------------------------------------------------------------------
	===========================================================================
						SHOP PAGE START
	===========================================================================
	---------------------------------------------------------------------------
*/

.kode_blog_madium_wrap.wrap_2 {
    background: none;
}

.kode_shop_text>h5,
.kode_shop_text,
.kode_shop_fig {
    float: left;
    width: 100%;
}

.kode_shop_fig {
    margin-bottom: 10px;
}

.kode_shop_text {
    padding: 17px 0px 15px;
}

.kode_shop_text h6 {
    float: left;
    margin-bottom: 10px;
}

.kode_shop_text h3 {
    display: block;
}

.kode_shop_text>h5 {
    font-weight: 400;
}

.kode_shop_fig .event_rating {
    position: relative;
    top: -5px;
}

.kode_shop_fig .event_rating a {
    font-size: 12px;
}

.kode_shop_fig .shop_icon {
    position: absolute;
    top: 50%;
    right: -40px;
    opacity: 0;
}

.kode_shop_fig:hover .shop_icon {
    opacity: 1;
    right: 40px;
}

.kode_shop_fig .shop_icon li {
    margin-bottom: 10px;
}

.kode_shop_fig .shop_icon li:last-child {
    margin-bottom: 0px;
}

.kode_shop_fig .shop_icon li a {
    display: inline-block;
    height: 33px;
    width: 33px;
    border-radius: 100%;
    background-color: #f7f7f7;
    text-align: center;
    line-height: 33px;
}

.kode_shop_fig .shop_icon li a:hover {
    transform: scale(1.3);
    -moz-transform: scale(1.3);
    -webkit-transform: scale(1.3);
}

.kode_shop_fig .them_overlay:before {
    background-color: #d8d8d8;
    opacity: 0;
}

.kode_shop_fig:hover .them_overlay:before {
    opacity: 0.85;
}


/*
	---------------------------------------------------------------------------
	===========================================================================
						SHOP PAGE END
	===========================================================================
	---------------------------------------------------------------------------
*/


/*
	---------------------------------------------------------------------------
	===========================================================================
						TEAM DETAIL PAGE START
	===========================================================================
	---------------------------------------------------------------------------
*/


/*
	=============================================
			KODE TEAM WRAP START
	=============================================
*/

.kode_team_detail_row,
.kode_team_profile,
.kode_view_text,
.kode_view_row,
.kode_overview,
.kode_team_wrap,
.kode_team_fig {
    float: left;
    width: 100%;
}

.kode_team_wrap {
    padding: 80px 0px;
}

.kode_team_detail_row {
    padding-bottom: 40px;
    border-bottom: 1px solid #e4e4e4;
}

.kode_team_fig figure {
    margin-bottom: 30px;
}

.kode_team_fig .siderbar_categories {
    padding: 27px 25px 65px;
    position: relative;
}

.kode_team_fig .siderbar_categories a {
    position: absolute;
    bottom: 0px;
    left: 0px;
    right: 0px;
}

.sidebar_title.title_2 {
    margin-bottom: 14px;
    margin-top: 0px;
}

.kode_team_fig .siderbar_categories p {
    margin-bottom: 15px;
}

.kode_team_fig .them_overlay:before {
    opacity: 0;
}

.kode_team_fig:hover .them_overlay:before {
    opacity: 0.35;
    z-index: 1;
}

.kode_view_row {
    border-bottom: 1px solid #e4e4e4;
    padding-bottom: 14px;
}

.kode_view_des {
    float: left;
    width: auto;
}

.kode_view_des span {
    text-transform: uppercase;
}

.kode_view_row .widget_social_icon {
    float: right;
    width: auto;
    padding: 13px 0px;
}

.kode_view_row .widget_social_icon li a {
    border-color: #e6e6e6;
    color: #a1a1a1;
    height: 30px;
    width: 30px;
    line-height: 30px;
}

.kode_view_row,
.kode_view_text {
    margin-bottom: 15px;
}

.kode_view_text p {
    margin-bottom: 0px;
}

.kode_team_profile .kode_detail_date {
    background: none;
    padding: 0px 0px;
}

.kode_team_profile .event_detail_list li a {
    background-color: #f7f7f7;
    width: 320px;
    padding: 8px 16px;
}

.islamic_center_sermon_des .text.webkit:hover :before,
.copyright_text .top_btn:hover i,
.kode_team_profile .kode_detail_date .event_detail_list li:hover a i {
    color: #fff !important;
}

.kode_team_profile .event_detail_list li a span {
    display: inline;
}

.kode_team_profile .sidebar_title.title_2 {
    margin-bottom: 20px;
}

.islamic_center_sermon_des .text.webkit .jp-page-btn-play {
    color: #999;
    margin: 0;
    position: static;
}

.islamic_center_sermon_des .text.webkit .jp-page-btn-play:before {
    font-size: 25px;
}


/*
	=============================================
			KODE TEAM WRAP END
	=============================================
*/


/*
	=============================================
			GALLERY3 WRAP START
	=============================================
*/

.kode_gallery3_fig,
.kode_gallery3_row,
.kode_gallery3_wrap {
    float: left;
    width: 100%;
}

.kode_gallery3_des {
    float: left;
    width: 33.7%;
    margin-right: 5px;
}

.kode_gallery3_fig.fig_2 {
    width: 31.4%;
    float: left;
    margin-right: 5px;
}

.kode_gallery3_des:nth-child(3) {
    margin-right: 0;
}

.kode_gallery3_fig {
    margin-bottom: 5px;
}

.kode_donors_text .them_overlay:before,
.kode_project_detail_fig .them_overlay:before,
.kode_gallery3_fig .them_overlay:before {
    opacity: 0;
}

.kode_donors_text:hover .them_overlay:before,
.kode_project_detail_fig:hover .them_overlay:before,
.kode_gallery3_fig:hover .them_overlay:before {
    opacity: 0.5;
    z-index: 1;
}

.kode_gallery3_wrap .slick-prev,
.kode_gallery3_wrap .slick-next {
    height: 38px;
    width: 38px;
    background: none;
    border: 1px solid #cecece;
    left: -55px;
    border-radius: 2px;
}

.kode_donors_list .slick-next,
.kode_gallery3_wrap .slick-next {
    left: auto;
    right: -55px;
}

.kode_donors_list .slick-next:before,
.kode_gallery3_wrap .slick-next:before {
    line-height: 36px;
    content: "\f061";
}

.kode_donors_list .slick-prev:before,
.kode_gallery3_wrap .slick-prev:before {
    content: "\f060";
    line-height: 36px;
}

.kode_donors_list .slick-dotted.slick-slider,
.kode_gallery3_wrap .slick-dotted.slick-slider {
    margin-bottom: 0px;
}


/*
	=============================================
			GALLERY3 WRAP END
	=============================================
*/


/*
	---------------------------------------------------------------------------
	===========================================================================
						TEAM DETAIL PAGE END
	===========================================================================
	---------------------------------------------------------------------------
*/


/*
	---------------------------------------------------------------------------
	===========================================================================
						PROJECT DETAIL PAGE START
	===========================================================================
	---------------------------------------------------------------------------
*/

.kode_donors_row,
.kode_donors_text,
.kode_donors_list,
.kode_project_detail_fig,
.kode_projet_detail_des,
.kode_blog_detail_des.des_2 .kode_attorney_detail_skill,
.kode_dollar_des {
    float: left;
    width: 100%;
}

.kode_projet_detail_des,
.kode_blog_detail_des.des_2 {
    border-bottom: 1px solid #e3e3e3;
}

.kode_project_detail_fig,
.kode_blog_detail_des.des_2 {
    padding-bottom: 0px;
}

.kode_blog_detail_des.des_2 .kode_blog_detail_text {
    border-bottom: none;
    margin-bottom: 0px;
}

.kode_dollar_des p {
    margin-bottom: 0px;
    font-size: 24px;
    color: #333333;
}

.kode_dollar_des .full-left {
    float: left;
    width: auto;
}

.kode_dollar_des .full-right {
    float: right;
    width: auto;
}

.kode_attorney_detail_skill.project .label {
    background: none;
    top: -35px;
    height: auto;
    width: auto;
    box-shadow: 0px 0px;
    border: none;
    line-height: normal;
    border-radius: 0px;
}

.kode_attorney_detail_skill.project .progressbar {
    box-shadow: 0 0 5px -2px;
    margin: 0 auto 12px;
}


/*KODE PROJECT DETAIL DES START */

.kode_projet_detail_des {
    padding: 30px 0px 31px;
}

.kode_projet_detail_des p:last-child {
    margin-bottom: 0px;
}


/*KODE DONORS LIST START */

.kode_donors_list {
    padding: 27px 0px 30px;
}

.kode_donors_row {
    padding: 0px 10px;
}

.kode_donors_text {
    text-align: center;
    padding: 0px 20px;
}

.kode_donors_text figure {
    width: auto;
    border-radius: 100%;
    float: none;
    margin-bottom: 12px;
}

.kode_donors_text h5 {
    margin-bottom: 5px;
}

.kode_donors_text h6 {
    font-weight: bold;
}


/*KODE DONORS LIST START */

.kode_donors_list .slick-prev,
.kode_donors_list .slick-next {
    height: 40px;
    width: 40px;
    background: none;
    border: 1px solid #cecece;
    left: -70px;
    border-radius: 100%;
}

.kode_donors_list .slick-next {
    right: -70px;
    left: auto;
}

.kode_donors_list .slick-prev:before,
.kode_donors_list .slick-next:before {
    line-height: 38px;
}


/*
	=======================================
		SIDEBAR WIDGET START
	=======================================
*/

.categories_detail li,
.categories_detail,
.sidebar_title,
.siderbar_categories,
.kode_search,
.sidebar-widget {
    float: left;
    width: 100%;
}

.kode_search .kf_commet_field {
    margin-bottom: 0px;
}

.kode_search .comment-form .kf_commet_field {
    position: relative;
}

.kode_search .comment-form .kf_commet_field button {
    display: inline-block;
    height: 44px;
    position: absolute;
    right: 0px;
    text-align: center;
    top: 0;
    width: 48px;
    background: none;
    border-left: 1px solid #e9e9e9;
}


/* SIDEBAR CATEGORIES START */

.siderbar_categories {
    padding: 27px 30px 30px;
    background-color: #fff;
}

.sidebar_title {
    position: relative;
    font-weight: bold;
    text-transform: uppercase;
    margin-top: 0px;
    margin-bottom: 30px;
    padding-bottom: 7px;
    position: relative;
}

.sidebar_title:before {
    position: absolute;
    content: "";
    left: 0px;
    right: 0px;
    bottom: 0px;
    border-bottom: 2px solid;
    width: 80px;
}

.categories_detail {
    margin-top: -5px;
}

.categories_detail li {
    border-bottom: 1px solid #e5e5e5;
}

.categories_detail li a {
    display: block;
    padding: 9px 0px;
}

.siderbar_categories.recent_news .kode_calender_detail li:first-child,
.categories_detail li:first-child a {
    padding-top: 0px;
}

.categories_detail li a:hover {
    padding-left: 10px;
}


/* SIDEBAR CATEGORIES  RECENT NEWS START */

.siderbar_categories.recent_news .kode_calender_detail {
    padding: 0px 0px;
    background: none;
}

.siderbar_categories.recent_news .kode_calender_detail li:last-child {
    padding-bottom: 0px;
}

.kode_calender_list figure {
    float: left;
    width: auto;
}

.kode_calender_list .them_overlay:before {
    opacity: 0;
    z-index: 9;
}

.kode_calender_list:hover .them_overlay:before {
    opacity: 0.35;
}

.siderbar_categories.recent_news .kode_event_text {
    padding-left: 15px;
}


/* SIDEBAR ADD START */

.sidebar_add {
    float: left;
    width: 100%;
}

.sidebar_add .them_overlay:before {
    z-index: 9;
}

.sidebar_add figcaption {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    text-align: center;
    padding: 50px 0px;
    z-index: 10;
}

.sidebar_add figcaption h5,
.sidebar_add figcaption h2,
.sidebar_add figcaption h3 {
    margin-bottom: 10px;
}

.sidebar_add figcaption h4 {
    margin-bottom: 8px;
}


/* SIDEBAR ADD START */

.siderbar_categories.archive .categories_detail li a {
    position: relative;
}

.siderbar_categories.archive .categories_detail li a:before {
    bottom: 0;
    color: #a1a1a1;
    content: "\f105";
    font-family: fontAwesome;
    margin-top: -12px;
    position: absolute;
    right: 0;
    top: 50%;
}

.siderbar_categories.archive .categories_detail li a:hover:before {
    right: 5px;
}


/* KODE COMING EVENT START */

.kode_coming_event_text,
.kode_coming_fig,
.kode_coming_event {
    float: left;
    width: 100%;
}

.kode_coming_fig {
    text-align: center;
}

.kode_coming_event_text {
    padding: 17px 0px 48px;
}

.kode_coming_event_text h5 {
    margin-bottom: 6px;
}

.kode_coming_event_text>a {
    display: inline-block;
    text-transform: uppercase;
}

.kode_coming_event_text>a i {
    margin-right: 18px;
}


/* slick slider start */

.kode_coming_event .slick-prev,
.kode_coming_event .slick-next {
    display: none !important;
}

.kode_coming_event .slick-dots li {
    cursor: pointer;
    display: inline-block;
    height: 10px;
    margin: 0 3px;
    padding: 0;
    position: relative;
    width: 10px;
    border-radius: 100%;
    background-color: #333333;
    line-height: 10px;
}

.kode_coming_event .slick-dots li button {
    line-height: 10px;
    padding: 0px 0px;
    height: 10px;
    width: 10px;
}

.kode_coming_event .slick-dots li button:before {
    content: "";
}

.kode_coming_event .slick-dotted.slick-slider {
    margin-bottom: 0px;
}

.kode_coming_event .slick-dots {
    bottom: 22px;
}


/* slick slider start */


/* kode event featured start */

.kode_event_featured {
    float: left;
    width: 100%;
    margin-bottom: 1px;
}

.kode_event_featured>a {
    display: inline-block;
    padding: 3px 6px 5px;
    float: left;
    border-radius: 2px;
    font-size: 14px;
    line-height: 14px;
}

.event_rating {
    float: right;
    width: auto;
}

.event_rating a {
    color: #ffcc01;
    display: inline-block;
}

.kode_event_text.text_2 p {
    margin-bottom: 0px;
    font-weight: 400;
    font-size: 14px;
}

.kode_event_text.text_2 p a {
    color: #333;
}


/* kode side contact start */

.kode_photo_gallery,
.kode_photostream,
.kode_side_contact_text {
    float: left;
    width: 100%;
}

.kode_side_contact_text p {
    margin-bottom: 24px;
    font-style: italic;
}

.kode_side_contact_text a {
    display: block;
    overflow: hidden;
}

.kode_side_contact_text a i {
    height: 46px;
    width: 60px;
    text-align: center;
    line-height: 46px;
    border-right: 1px solid #b28237;
    margin-right: 15px;
}


/* KODE PHOTOSTREAM START*/

.kode_photo_gallery li {
    float: left;
    width: auto;
    margin: 0px 10px 10px 0px;
    overflow: hidden;
    cursor: pointer;
}

.kode_photo_gallery li:hover img {
    transform: scale(1.2);
    -moz-transform: scale(1.2);
    -webkit-transform: scale(1.2);
}

.kode_photo_gallery .them_overlay:before {
    opacity: 0;
}

.kode_photo_gallery .them_overlay:hover:before {
    opacity: 0.5;
    z-index: 1;
}

#form03 .modal-dialog {
    z-index: 99999;
}

.kode_sab_banner_wrap {
    margin-bottom: 50px;
}

.kode_top_right_text>form {
    float: right;
}

.kode-responsive-navigation {
    display: none;
}

.one_fourth {
    width: 25%;
    float: left;
}

.one-fifth.columns {
    width: 20%;
    float: left;
}

.kode_amount_list input {
    left: 0;
    position: absolute;
    visibility: hidden;
}

.kode_amount_list label {
    position: relative;
}

.kode_amount_list .active span {
    background: #d3983e;
}

.one_half {
    width: 48.97%;
    margin-right: 15px;
    float: left;
}

.one_half.last {
    margin-right: 0px;
}

.one_half img {
    width: 100%;
}

.check-list li {
    margin-bottom: 6px;
}

.kode_service_caption>p:last-child,
.check-list li:last-child {
    margin-bottom: 0px;
}

.check-list li {
    display: inline-block;
    position: relative;
    padding-left: 30px;
    margin-bottom: 2px;
    list-style: none;
}

.one_half.last .check-list ul {
    margin-bottom: 0px;
}

#checklist-1.check-list li:before {
    position: absolute;
    content: "\f00c" !important;
    top: 0px;
    left: 0px;
    bottom: 0px;
    font-family: fontawesome;
}

.clearboth {
    clear: both;
    width: 100%;
    margin-bottom: 20px;
    float: none;
}

.div-single {
    border: 1px solid #e5e5e5;
    float: left;
    width: 100%;
}

.accordion-section {
    background-color: #f6f6f6;
    border-bottom: 1px solid #e9e9e9;
    position: relative;
}

.accordion-section h6 a {
    display: block;
    position: relative;
    color: #666666;
}


/*----- Section Content -----*/

.accordion-section-content {
    padding: 15px;
    display: none;
}

.accordion-section {
    float: left;
    width: 100%;
}

.accordion-section h6 {
    color: #ffffff;
    cursor: pointer;
    margin: 0;
    padding: 15px 10px;
    font-weight: 600;
}

.accordion-section h6 span {
    float: right;
    position: relative;
    top: 0px;
}

.accordion-section h6 a:before {
    position: absolute;
    content: "\f067";
    top: 0px;
    right: 30px;
    bottom: 0px;
    color: #5e5e5e;
    font-family: fontawesome;
}

.accordion-section h6 a:focus:before,
.accordion-section h6 a:hover:before {
    content: "\f068";
}

.accordion-section-content {
    background-color: #ffffff;
    padding-top: 10px;
}

.accordion-section-content p {
    margin-bottom: 0px;
}

.kode_meta.meta_2 li i {
    margin-right: 10px;
}

.kode-gallery-thumb .kode_item_gallery {
    float: left;
}

.breadcrumb li {
    display: inline-block;
    width: auto;
    float: none;
    margin-right: 10px;
}

.kode-team-slide .kode_tem_fig h4 a {
    color: #fff;
}

.kode-left-comment-sec p {
    margin: 0px;
    padding: 0px;
}

.kode_social_share_item a {
    float: left;
    width: 100%;
    margin-bottom: 5px;
    color: #333;
}

.kode_social_share_item .social_meta li {
    margin-bottom: 0px;
}

.kode_social_share_item a i {
    margin-right: 10px;
}

.kode_social_share_item ul {
    padding: 0px;
    margin: 0px;
}

.kode_blog_detail_row .kode_social_share .kode_pagination {}

.kode_blog_detail_row .kode_social_share .kode-pagination .page-numbers.current,
.kode_blog_detail_row .kode_social_share .kode-pagination a,
.kode_blog_detail_row .kode_social_share .kode_pagination a {
    width: 100%;
}

.kode_social_share_item {
    float: left;
}

.kode_pagination .inner-post a h6 {
    margin: 0px;
}

.kode-previous {
    float: left;
    margin-right: 50px;
}

.kode-next {
    float: right;
}

.kode_pagination .thcolorhover.inner-post a:hover {
    color: #333;
}

.small_btn {
    display: inline-block;
}

#kode-searchform .seach_menu button i {
    color: #333;
}

.kode_top_right_text .seach_menu {
    margin-top: 2px;
}

.kode_top_right_text .seach_menu input {
    height: 30px;
    min-height: 30px;
}

.kode_top_right_text .seach_menu button {
    margin-top: -8px;
}

.kode_counter_mosque>h6 {
    margin: 0;
}

.koed_banner_btn .medium_btn:hover {
    color: #fff;
}

.jp-controls-holder .jp-toggles .jp-full-screen:before,
.jp-controls-holder .jp-toggles .jp-shuffle:before,
.jp_column-left .jp-controls .jp-stop:before {
    bottom: 0;
    content: "\f04d";
    font-family: fontawesome;
    left: 0;
    position: absolute;
    right: 0;
    font-size: 15px;
}

.jp-controls-holder .jp-toggles .jp-shuffle:before {
    content: "\f074";
    bottom: 10px;
}

.jp-controls-holder .jp-toggles .jp-full-screen:before {
    content: "\f0b2";
    bottom: 10px;
}

.kode-custom-player .jp_column-left,
.kode-custom-player .jp_column-right {
    width: 20%;
}

.kode-custom-player .jp_column-mid {
    width: 60%;
}

.jp_column-right .jp-volume-controls button.jp-volume-max {
    display: block !important;
    width: auto;
}

.jp_column-mid .jp_container-bar-s .jp-cover {
    display: none;
}

.kode-custom-player .jp-controls button.jp-play {
    background: #36403d none repeat scroll 0 0;
    height: 45px;
    margin-top: 0;
    width: 45px;
    line-height: 45px;
}

.kode-custom-player .jp-controls button.jp-play::before {
    font-size: 25px;
    line-height: 36px;
}

.left-sec h3 a {
    color: #fff;
}

.text.webkit,
.latest-sermon .islamic_center_sermon_des figure:before {
    transition: all 0.3s ease-in-out;
}

.text.webkit {
    position: relative;
}

.text.webkit .left-sec h4 {
    margin: 0px 0px;
}

.text.webkit .left-sec p {
    margin-bottom: 10px;
}

.latest-sermon .islamic_center_sermon_des .text {
    background-color: #fff;
}

.kode-custom-player .jp-controls-holder .jp-repeat {
    border: 4px solid #36403d;
}

.kode-custom-player .jp-toggles button.jp-show-playlist {
    border-color: #36403d;
}

.islamic_center_sermon_des:hover .text.webkit .left-sec h4 a,
.islamic_center_sermon_des:hover .sermon-tracks .sermon_item a,
.islamic_center_sermon_des:hover .sermon-tracks .sermon_item {
    color: #fff;
}

.islamic_center_sermon_des .left-sec p {
    margin-bottom: 0px;
}

.islamic_center_sermon_des .text.webkit .left-sec h4 {
    margin-bottom: 10px;
}

.sermon_item {
    margin-bottom: 8px;
}

.sermon_item:last-child {
    margin-bottom: 0px;
}

.islamic_center_sermon_des {
    border: 1px solid rgba(0, 0, 0, 0.06);
}

.islamic_center_sermon_des:hover {
    box-shadow: 0px 6px 8px -1px;
}

.sermon_item span {
    float: left;
    width: auto;
}

.jp-page-btn-pause::before,
.jp-page-btn-play::before {
    font-size: 22px;
}

.sermon_item {
    background-color: #333;
}

.sermon-img-info img,
.sermon_item {
    float: left;
    width: 100%;
}

.sermon-img-info {
    float: left;
    width: 5%;
    margin-right: 10px;
}

.sermon-release-item,
.sermon_item>a {
    color: #ffffff;
    float: left;
    width: 25%;
}

.islamic_center_sermon_des .sermon_item>a {
    width: auto;
    color: #333;
    padding: 0px;
}

.sermon-playlist-single .sermon_item span {
    float: none;
}

.islamic_center_sermon_des .sermon_item {
    background: transparent;
}

.sermon-playlist-single .sermon_item {}

.sermon-playlist-single .sermon-release-item {
    float: left;
    text-align: center;
}

.sermon-itunes-item,
.sermon-soundcloud-item,
.sermon-download-item {
    color: #ffffff;
    float: left;
    text-align: center;
    width: 14%;
}

.kode_social_share .social_meta {
    margin: 0px;
}

.kode_social_share .social_meta li {
    margin-bottom: 0px;
}

.kode_social_share>a {
    margin-top: 5px;
}

.sermon-playlist-single .sermon_item a p {
    margin-bottom: 0px;
    line-height: normal;
}

.sermon-tracks.sermon-playlist-single h3 {
    margin: 0px 0px 20px 0px;
}

.sermon-tracks.sermon-playlist-single .sermon_item .sermon-soundcloud-item,
.sermon-tracks.sermon-playlist-single .sermon_item .sermon-itunes-item,
.sermon-tracks.sermon-playlist-single .sermon_item .sermon-download-item,
.sermon-tracks.sermon-playlist-single .sermon_item .sermon-release-item,
.sermon-tracks.sermon-playlist-single .sermon_item a {
    margin-top: 8px;
}

.cross-sells .products {
    margin: 0px;
}

.cross-sells .products li {
    width: 50%;
    padding: 0px 15px;
}

.shop_table.shop_table_responsive .cart-subtotal th,
.shop_table.shop_table_responsive .order-total th {
    color: #333;
}

.cross-sells .products li .woocommerce-loop-product__title {
    font-size: 18px;
    margin-top: 0px;
}

.kode_news_detail .woocommerce ul.products li.product .price del {
    display: none !important;
}

.cart_totals {
    float: right;
    width: 50%;
}

.cross-sells {
    float: left;
    width: 50%;
}

.cart-collaterals h2 {
    margin-top: 0px;
    line-height: 30px;
    padding-bottom: 10px;
    font-size: 30px;
    margin-bottom: 10px;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
    border: none;
}

.jp-sermon-item {
    float: left;
    text-align: center;
    width: 170px;
}

.kode-custom-player #jplayer_jukebox-1 .jp-playlist-container .jp-album-item.jp-sermon-item {
    width: 550px;
}

.jp-sermon-item,
.jp-playlist-item-buy,
.jp-playlist-item-download,
.jp-playlist-item-remove {
    margin-top: 5px;
}

.kode-custom-player #jplayer_jukebox-1 .jp-playlist-container ul .jp-sermon-item-play.jp-playlist-item {
    border-radius: 100%;
    width: 35px;
    height: 35px;
    background: #000 !important;
    float: left;
    line-height: 37px;
    text-align: center;
    margin: 3px 0px 0px 15px;
}

.kode-custom-player #jplayer_jukebox-1 .jp-playlist-container ul .jp-sermon-item-play.jp-playlist-item i {
    color: #fff;
    position: relative;
    top: px;
}

.kode-custom-player #jplayer_jukebox-1 .jp-playlist-container ul .jp-playlist-current .jp-sermon-item-play.jp-playlist-item i {
    left: 2px;
}

.kode-custom-player #jplayer_jukebox-1 .jp-playlist li.jp-playlist-current::before {
    content: "";
}

.jp-playlist.jp-gui-bg li>div {
    float: left;
    width: 100%;
}

.kode-custom-player #jplayer_jukebox-1 .jp-playlist li {
    padding: 0px;
}

.kode-custom-player #jplayer_jukebox-1 .jp-playlist a.jp-playlist-item-buy:before,
.kode-custom-player #jplayer_jukebox-1 .jp-playlist a.jp-playlist-item-remove:before,
.kode-custom-player #jplayer_jukebox-1 .jp-playlist a.jp-playlist-item-download:before {
    color: #000 !important;
}

.kode-custom-player #jplayer_jukebox-1 .jp-playlist a.jp-playlist-item-buy,
.kode-custom-player #jplayer_jukebox-1 .jp-playlist a.jp-playlist-item-remove,
.kode-custom-player #jplayer_jukebox-1 .jp-playlist a.jp-playlist-item-download {
    font-size: 17px;
}

.jp-sermon-item.jp-playlist-item-cover {
    display: none;
}

.jp-sermon-item.jp-playlist-item.jp-playlist-current {
    margin-right: 0px;
}

.widget_islamic_center_islamic_products_widget .sidebar_title {
    margin: 0px;
}

.widget_islamic_center_islamic_products_widget .kode_product_list.custom-class {
    padding: 20px 15px 0px;
}

.jp-playlist-current .jp-sermon-item-play i:before {
    content: "\f04b";
}

.kode-custom-player #jplayer_jukebox-1 .jp-playlist-container ul .jp-sermon-item-play.jp-playlist-item i {
    left: 0px;
}

.page_not_found {
    float: none;
    display: inline-block;
    width: 60%;
    text-align: center;
    margin-bottom: 60px;
}

.search-page-kode .page_not_found {
    width: 100%;
}

.search-page-kode .search-menu_02 {
    margin-bottom: 30px;
}

.eco-big-title {
    float: left;
    width: 100%;
}

.eco-big-title h3 {
    font-size: 90px;
    color: #2e2e2e;
    margin-top: 0px;
    margin-bottom: 22px;
    line-height: normal;
}

.page_not_found .eco-big-title p {
    font-weight: 600;
    width: 65%;
    text-align: center;
    margin: 0 auto;
    margin-bottom: 30px;
}

.page_not_found form {
    width: 60%;
    float: none;
    display: inline-block;
    text-align: center;
}

.eco_404-page {
    float: left;
    width: 100%;
    text-align: center;
    padding-top: 20px;
}

.eco_404-page .search-menu_02 {
    margin-bottom: 50px;
}

.spacial-btn {
    display: inline-block;
    width: 202px;
    height: 48px;
    color: #fff;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
    border-radius: 30px;
    line-height: 48px;
}

.spacial-btn:hover {
    color: #fff !important;
    background-color: #000 !important;
}

.margin-minus-top-50 {
    margin-top: -50px;
    float: left;
    width: 100%;
}

.jp-item-sermon-playlist .jp-artist-item.jp-sermon-item,
.jp-item-sermon-playlist .jp-album-item.jp-sermon-item {
    display: none;
}

.jp-item-sermon-playlist .jp-sermon-item-play.jp-playlist-item {
    float: left;
}

.jp-item-sermon-playlist.jp_custom_box ul li {
    margin: 0px;
    padding: 0px;
}

.widget.kode-widget .jp-item-sermon-playlist.jp_custom_box ul li:before {
    content: "";
}

.widget.kode-widget .jp-item-sermon-playlist.jp_custom_box .jp-sermon-item,
.widget.kode-widget .jp-item-sermon-playlist.jp_custom_box .jp-playlist-item-buy,
.widget.kode-widget .jp-item-sermon-playlist.jp_custom_box .jp-playlist-item-download,
.jp-playlist-item-remove {
    margin-top: 0px;
}

.widget.kode-widget .jp-item-sermon-playlist.jp_custom_box .jp-cover {
    display: none;
}

.kode_project_text a {
    color: #000;
}

.islamic_cen_causes_list {
    float: left;
    width: 100%;
    padding: 15px 0px 0px;
    background: #f9f9f9;
}

.islamic_cen_causes_list ul {
    float: left;
    width: 100%;
    text-align: center;
}

.islamic_cen_causes_list ul li {
    display: inline-block;
    width: 24%;
    text-align: center;
    padding: 0 0px;
    position: relative;
    margin: 0 auto;
}

.islamic_cen_causes_list ul li:before {
    position: absolute;
    content: "";
    top: 0px;
    right: 0px;
    bottom: 0px;
    border-right: 2px solid #e5e5e5;
    height: 30px;
    margin: auto;
}

.islamic_cen_causes_list ul li:last-child {
    padding-right: 0px;
}

.islamic_cen_causes_list ul li:last-child:before {
    display: none;
}

.islamic_cen_causes_list ul li span {
    display: inline-block;
    font-size: 28px;
    font-weight: bold;
}

.islamic_cen_causes_list ul li p {
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 0px;
}


/*
=============================================
	services section
=============================================
*/

.cause-detail-style {
    float: left;
    width: 100%;
    margin-bottom: 0px;
}

.cause-detail-style .eco_blog_detail_content blockquote {
    margin-bottom: 46px;
    margin-top: 29px;
}

.islamic_causes_donate {
    float: left;
    width: 100%;
    padding: 15px 30px;
}

.islamic_causes_donate .progress-bar.progress-bar-success {
    border-radius: 30px;
}

.islamic_causes_donate .eco-progress-row {
    float: left;
    width: 70%;
    margin-top: 12px;
    padding-bottom: 0px;
}

.islamic_causes_donate .progress .eco_progress-heading.skill,
.islamic_causes_donate .eco-progress-row .progress .skill .val {
    color: #fff;
    font-weight: 700;
}

.islamic_causes_donate .progress.skill-bar {
    background-color: #e0e0e0;
    border: 3px solid #e0e0e0;
    border-radius: 10px;
    height: 15px;
    margin-bottom: 0;
}

.islamic_causes_donate a {
    float: right;
}

.eco_count_cause_up {
    float: left;
    width: 100%;
    padding: 10px 0px 16px;
}

.eco_count_cause_up ul {
    float: left;
    width: 100%;
    text-align: center;
}

.eco_count_cause_up ul li {
    display: inline-block;
    width: 24%;
    text-align: center;
    padding: 0 0px;
    position: relative;
    margin: 0 auto;
}

.eco_count_cause_up ul li:before {
    position: absolute;
    content: "";
    top: 0px;
    right: 0px;
    bottom: 0px;
    border-right: 2px solid #e5e5e5;
    height: 30px;
    margin: auto;
}

.eco_count_cause_up ul li:last-child {
    padding-right: 0px;
}

.eco_count_cause_up ul li:last-child:before {
    display: none;
}

.eco_count_cause_up ul li span {
    display: inline-block;
    font-size: 28px;
    font-weight: bold;
}

.eco_count_cause_up ul li p {
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 0px;
}

.kode-navigation-wrapper .navigation ul li ul li {
    padding-left: 0px;
}

.kode_navigation_wrap .kode-navigation-wrapper .navigation>.menu>ul>li ul li a {
    color: #333;
}

.kode_navigation_wrap .navigation ul li>a:hover {
    color: #fff !important;
}

.kode_navigation_wrap .kode-navigation-wrapper .navigation .menu-main-menu-container ul li,
.kode_navigation_wrap .kode-navigation-wrapper .navigation .menu li a {
    position: relative;
    z-index: 9999999;
}

.kode_newsletter_form .kf_commet_field .medium_btn:hover {
    border: none;
    box-shadow: 0px 0px;
}

.menu-main-menu-container {
    float: left;
    width: 100%;
}

.widget_event .kf_commet_field {
    width: 100%;
}

.koed_banner_btn .medium_btn {
    color: #333;
}

.widget_event .kode_calender_detail li {
    padding-left: 0px;
}

.sermon-tracks.sermon-playlist-single .sermon_item {
    position: relative;
}

.sermon_item .jp-page-btn-play {
    color: #ffffff;
    left: 37px;
    margin-top: -26px;
    position: absolute;
    top: 50%;
}

.sermon_item .jp-page-btn-play:before {
    font-size: 40px;
}

.sermon-tracks.sermon-playlist-single .sermon_item .sermon-img-info {
    width: 15%;
}

.sermon-tracks.sermon-playlist-single .sermon-itunes-item,
.sermon-tracks.sermon-playlist-single .sermon-soundcloud-item,
.sermon-tracks.sermon-playlist-single .sermon-download-item {
    width: 12%;
    margin-top: 0px;
    padding: 21px 0 33px;
}

.sermon-tracks.sermon-playlist-single .sermon-release-item,
.sermon_item>a {
    width: 23%;
    margin-top: 0px;
    padding: 11px 0 23px;
}

.sermon-tracks.sermon-playlist-single .sermon-release-item {
    padding: 22px 0 31px;
}

.kode_project_share.koed_banner_btn .medium_btn {
    color: #fff;
}

.kode_payment_list.form-submit .medium_btn:hover {
    background-color: #333;
}

.content-wrapper {
    width: 100%;
    float: left;
    position: relative;
}

.islamic_causes_donate.kode_attorney_detail_skill .modal-content .modal-header {
    padding: 0px 0px;
}

.islamic_causes_donate.kode_attorney_detail_skill .eco-choose-donation h5,
.islamic_causes_donate.kode_attorney_detail_skill .modal-content .modal-header h3 {
    font-weight: bold;
    text-transform: uppercase;
}

.islamic_causes_donate.kode_attorney_detail_skill .modal-content .modal-header h3 {
    padding-bottom: 10px;
}

.islamic_causes_donate.kode_attorney_detail_skill .eco-choose-donation h5 {
    margin-bottom: 25px;
}

.eco_donations_select {
    float: left;
    width: 100%;
}

.eco_donations_select .kode_radio_style {
    background-color: #fff;
    border: 1px solid #e0e0e0;
    height: 112px;
    padding: 22px 20px 0;
    text-align: center;
}

.kode_radio_style label,
.kode_checkbox_style label {
    display: inline-block;
    margin-bottom: 0;
    padding-left: 0;
}

.eco_donations_select .kode_radio_style .kode_radio_style {
    background: transparent;
    height: auto;
}

.kode_radio_style input[type="radio"]:checked+span::before {}

.eco_donations_select .kode_radio_style span {
    border-color: #666666;
    border-radius: 100%;
}

.kode_radio_style span,
.kode_checkbox_style span {
    border: 1px solid;
    display: inline-block;
    height: 10px;
    margin-right: 10px;
    position: relative;
    width: 10px;
}

.kode_radio_style span:before,
.kode_checkbox_style span:before {
    background-color: rgba(0, 0, 0, 0);
    bottom: 0;
    content: "";
    height: 6px;
    left: 1px;
    position: absolute;
    right: 0;
    text-align: center;
    top: 1px;
    width: 6px;
    border-radius: 100%;
}

.islamic_causes_donate.kode_attorney_detail_skill .modal-dialog {
    margin: 30px auto;
    max-width: 800px;
    top: 10%;
}

.kode_radio_style small {
    color: #666666;
    display: inline-block;
    margin-bottom: 10px;
    font-size: 14px;
}

.kode_radio_style .amount-heading {
    display: block;
    font-size: 24px;
    font-weight: bold;
    line-height: 29px;
    margin-bottom: 0;
}

.kode-paymentmethod input,
.eco_donations_select .kode_radio_style input {
    display: none;
}

.islamic_causes_donate.kode_attorney_detail_skill .kode_radio_style .eco_enter_ammount input {
    display: block;
}

.kode-payment-gateways .kode-radio-label-wrap {
    float: left;
    width: 20%;
    padding: 0 5px;
    margin-bottom: 20px;
}

.kode-paymentmethod {
    float: left;
    width: 100%;
}

.kode-payment-gateways .btn-default:hover {
    background-color: #333;
}

.kode_radio_style.col-md-3 .kode_radio_style {
    padding: 0px 0px;
    border: none;
}

.kode_404_wrap .kode_404_text .medium_btn {
    color: #ffffff;
    display: inline-block;
    padding: 9px 20px;
}

.post-password-form input[type="submit"] {
    margin-top: 10px;
}

#user-payment-submit .kode-paypal-form {
    background: #f9f9f9 none repeat scroll 0 0;
    float: left;
    padding: 15px;
    width: 100%;
}

#user-payment-submit p {
    margin-bottom: 10px;
}

#user-payment-submit .kode-paymentmethod {
    text-align: left;
}

.kode-custom-pay-form .kode-paymentmethod {
    text-align: left;
}

.kode-paymentmethod .kode-radio-label-wrap {
    border: 10px solid #ccc;
    margin-right: 15px;
    padding: 10px;
    position: relative;
    width: 155px;
    cursor: pointer;
}

.kode-radio-label-wrap.kode_donate_disable {
    display: none;
}

.kode-paymentmethod .kode_donate_disable:before {
    position: absolute;
    content: "";
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    opacity: 0.7;
    background-color: #fff;
    z-index: 10;
}

.kode-paymentmethod .kode_donate_disable {
    cursor: not-allowed;
}

.kode-paymentmethod .kode_donate_disable .selected-radio {
    display: none !important;
}

.kode-paymentmethod .kode-radio-label-wrap:last-of-type {
    margin-right: 0px;
}

.kode-item.kode-blog-full-single.kode-single-detail .kode_blog_detail_row .kode_blog_detail_des .them_overlay:before {
    background: transparent;
}

.left-right-navigation.kode_pagination {
    width: 100%;
    background: #f9f9f9;
}

.left-right-navigation.kode_pagination .page-numbers.current,
.left-right-navigation.kode_pagination a,
.left-right-navigation.kode_pagination a {
    width: 100%;
    height: auto;
}

.left-right-navigation.kode_pagination .kode-previous,
.left-right-navigation.kode_pagination .kode-next {
    width: 50%;
    margin-right: 0px;
}

.kode_meta.meta_2.pull-right.kode-tag-bottom {
    float: right;
    width: auto;
    margin-top: 19px;
}

.kode_meta.meta_2.pull-right.kode-tag-bottom i {
    opacity: 1;
}

.social-share-single.kode_social_share {
    margin-bottom: 10px;
}

.kode-custom-player .maximized .kode-custom-player,
.kode-custom-player .opt-pos-static {
    float: left;
    width: 100%;
}

.kode-custom-player .opt-pos-static {
    position: relative;
}

.pagebuilder-wrapper {
    float: left;
    position: relative;
    width: 100%;
}

.widget_event .kode_textarea textarea::-webkit-input-placeholder {
    color: #fff;
}

.kf_commet_field input[type="text"]::-webkit-input-placeholder {
    color: #fff;
}

.kode_blog_detail_des .them_overlay:before {
    opacity: 0;
}

.kode_blog_detail_des .them_overlay:hover:before {
    opacity: 0.5;
}

#wp-calendar caption th td,
#wp-calendar table thead tr th {
    text-align: center;
}

.css-events-list table.events-table td {
    padding: 0 9px;
}

.kode_event_detail ul {
    margin: 0px 0px;
}

.kode_event_detail ul li {
    list-style: none;
}

.kode_calender_list figure img {
    height: 110px;
}

.kode_event_des>h6>a {
    margin-bottom: 10px;
    font-weight: 500;
    color: #333;
}

.kode_event_des ul {
    margin-bottom: 0px;
    padding-bottom: 0px;
}

.kode_event_des ul li span i {
    margin-right: 10px;
}

.woocommerce-content h1 {
    margin-bottom: 0px;
}

.woocommerce-result-count {
    margin-bottom: 0px;
    padding: 10px 0px;
}

.woocommerce-content ul.products li {
    margin: 0 29px 20px 0;
}

.woocommerce-content ul.products li:nth-child(4) {
    margin-right: 0px;
}

.woocommerce-content ul.products {
    margin-left: 0px;
}

.kode_event_des>a {
    color: #666;
    display: inline-block;
    border-color: #666;
}

.kode_event_des>a:hover {
    color: #fff;
}

.overlay {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0.96;
}

#cp-rider-boxed .overlay {
    background: rgba(255, 207, 0, 0.8);
}

#cp-rider-repair .overlay {
    background: rgba(240, 80, 80, 0.95);
}

#cp-rider-store .overlay {
    background: rgba(145, 201, 218, 0.9);
}

.overlay .overlay-close {
    background: #000000 url("images/images.png") no-repeat scroll center center;
    border: medium none;
    border-radius: 100%;
    color: rgba(0, 0, 0, 0);
    cursor: pointer;
    height: 40px;
    outline: medium none;
    overflow: hidden;
    position: absolute;
    right: 20px;
    text-indent: 200%;
    top: 20px;
    transition: transform 1s ease 0s;
    width: 40px;
    z-index: 100;
}

.overlay nav {
    text-align: center;
    position: relative;
    top: 50%;
    height: 60%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}

.overlay ul {
    list-style: none;
    padding: 0;
    margin: 0 auto;
    display: inline-block;
    height: 100%;
    position: relative;
}

.overlay ul li {
    display: block;
    height: 20%;
    height: calc(100% / 5);
    min-height: 54px;
}

.overlay ul li a {
    font-size: 54px;
    font-weight: 300;
    display: block;
    color: #fff;
    -webkit-transition: color 0.2s;
    transition: color 0.2s;
}

.overlay ul li a:hover,
.overlay ul li a:focus {
    color: #f0f0f0;
}

.overlay-contentscale {
    visibility: hidden;
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    -webkit-transition: -webkit-transform 0.5s, visibility 0s 0.5s;
    transition: transform 0.5s, visibility 0s 0.5s;
}

.overlay-contentscale.open {
    visibility: visible;
    overflow: visible;
    -webkit-transform: translateY(0%);
    transform: translateY(0%);
    -webkit-transition: -webkit-transform 0.5s;
    transition: transform 1s;
    z-index: 99999;
}

.cp-search-holder #trigger-overlay {
    background-color: transparent;
    border: none;
    padding: 0px;
}

.cp-search-inner {
    width: 750px;
    margin: 0 auto;
    padding-top: 330px;
}

.cp-search-inner form {
    float: left;
    width: 100%;
    position: relative;
}

.cp-search-inner form input[type="text"] {
    font-size: 14px;
    color: #fff;
    height: 40px;
    line-height: 40px;
    text-transform: uppercase;
    padding: 0;
    background: transparent;
    border: none;
    border-bottom: 1px solid #fff;
    position: relative;
    float: left;
    width: 100%;
}

#trigger-overlay {
    vertical-align: text-bottom;
    font-size: 18px;
    cursor: pointer;
}

.cp-search-inner form .submit {
    font-size: 18px;
    color: #fff;
    height: 40px;
    line-height: 40px;
    padding: 0;
    position: absolute;
    right: 0;
    top: 0;
    display: inline-block;
    background-color: transparent;
    border: none;
}

.cp-search-holder {
    border-radius: 0;
    color: #000000;
    float: left;
    font-size: 14px;
    height: 25px;
    line-height: 25px;
    margin: 0;
    position: relative;
    text-align: center;
    width: 25px;
}

.kode_search_overlay {
    float: left;
    width: auto;
}

.kode_event_des ul {
    list-style: none;
}


/*--// Twitter Widget CSS Starts //--*/

.twitter-widget {
    margin: 0px;
    list-style: none;
}

.widget_kode_twitter_widget .twitter-widget {
    list-style: none;
    overflow-x: hidden;
    padding: 20px;
    border: solid 1px #eee;
    margin: 0px;
    height: 250px;
}

.twitter-widget li:last-child {
    margin: 0px;
}

.twitter-widget li {
    margin: 0px 0px 10px 0px;
    padding: 0px 0px 0px 30px;
    position: relative;
}

.twitter-widget li:before {
    content: "\f099";
    position: absolute;
    left: 0px;
    top: 0px;
    font-size: 20px;
    color: #13d5ec;
    font-family: FontAwesome;
}

.twitter-widget .kode-twitter-text,
.twitter-widget p {
    color: #aaaaaa;
    margin: 0px 0px 4px 0px;
}

.twitter-widget p a {
    color: #ffffff;
}

.twitter-widget div.kode-twitter-time {
    color: #ffffff;
    text-transform: capitalize;
}

.twitter-widget i {
    color: #767676;
    margin-right: 6px;
}

.bypostauthor {
    display: inline-block;
}

.kode_pillars_item li a span {
    /* font-size: 30px; */
    display: inline-block;
    margin-bottom: 10px;
}

.kode_pillars_item_2 li a span {
    /* font-size: 30px; */
    display: inline-block;
    margin-bottom: 7px;
}

a.hvr-ripple-out:hover {
    /* background: green; */
    background-color: #38ab1e;
}

.center_right.hvr-ripple-out {
    position: relative;
    z-index: 9999;
    /* left: -21px; */
    left: 460px;
}

.center_right:after {
    border-right: 1px solid #ffffff;
    bottom: -101px;
    content: "";
    left: -70px;
    position: absolute;
    right: 60px;
    top: 114px;
    transform: rotate(12deg) translate(-28px);
}

.new-6pillars-right {
    position: absolute;
    z-index: 9999;
    /* left: 80px; */
    bottom: 47% !important;
    /* left: 11%; */
    right: 11%;
}

.new-6pillars-left {
    /* bottom: 50px; */
    /* left: 0; */
    position: absolute;
    z-index: 9999;
    left: 80px;
    bottom: 47% !important;
    left: 11%;
}

#forIslamMobile {
    display: none;
}

#forIslamMobile2 {
    display: none;
}

#forIslam {
    display: block;
}

#forIslam2 {
    display: block;
}

@media only screen and (max-width: 767px) {
    body {
        font-size: 10px;
    }
    .kode_pillars_item li a {
        height: 65px;
        width: 65px;
        text-align: center;
        border-radius: 100%;
        background-color: #fff;
        display: inline-block;
        padding: 0 0;
    }
    .kode_pillars_item_2 li a {
        height: 65px;
        width: 65px;
        text-align: center;
        border-radius: 100%;
        background-color: #fff;
        display: inline-block;
        padding: 0 0;
    }
    .kode_pillars_item li a span {
        font-size: 20px;
        display: inline-block;
        margin-bottom: 0px;
    }
    .kode_pillars_item_2 li a span {
        font-size: 20px;
        display: inline-block;
        margin-bottom: 0px;
    }
    .kode_pillars_item a>h6 {
        margin: 0px;
        font-size: 7px;
    }
    .kode_pillars_item_2 a>h6 {
        margin: 0px;
        font-size: 7px;
    }
    .center {
        position: relative;
        z-index: 99999;
        /* left:-21px; */
        /* left: 503px; */
        left: 155px;
        top: 60px;
    }
    .center:after {
        border-right: 1px solid #ffffff;
        bottom: -101px;
        content: "";
        left: -70px;
        position: absolute;
        right: 30px;
        top: 70px;
        z-index: -1;
    }
    .center_left {
        position: relative;
        z-index: 99999;
        /* left:-21px; */
        left: 110px;
        top: 60px
    }
    .center_left:after {
        border-right: 1px solid #ffffff;
        bottom: -30px;
        content: "";
        left: 30px;
        position: absolute;
        right: 40px;
        top: 80px;
        transform: rotate(-12deg) translate(18px);
    }
    .center_right.hvr-ripple-out {
        position: relative;
        z-index: 9999;
        /* left: -21px; */
        /* left: 460px; */
        left: 150px;
        top: 60px
    }
    .center_right:after {
        border-right: 1px solid #ffffff;
        bottom: -101px;
        content: "";
        left: 0px;
        position: absolute;
        right: 30px;
        top: 80px;
        transform: rotate(12deg) translate(-28px);
    }
    .right_bottom,
    .left_bottom {
        bottom: 50px;
        left: 3px;
        position: absolute;
        z-index: 99999;
        /* left: 80px; */
    }
    .right_center {
        /* right: 126px; */
        right: 0px;
        left: 290px;
        bottom: 256px;
        position: absolute;
        z-index: 99999;
    }
    .left_center {
        /* right: 126px; */
        left: 26px;
        right: auto;
        bottom: 256px;
        position: absolute;
        z-index: 99999;
    }
    .right_bottom {
        left: 310px;
        /* right:0px; */
        right: 0px;
    }
    .right_bottom:after,
    .left_bottom:after {
        /* border-right: 1px solid #ffffff;
    bottom: -22px;
    content: "";
    left: auto;
    position: absolute;
    right: -82px;
    top: 0;
	transform: rotate(-66deg) translate(-52px); */
        border-right: 1px solid #ffffff;
        bottom: 20px;
        content: "";
        left: auto;
        position: absolute;
        right: -46px;
        top: 0;
        transform: rotate(-66deg) translate(-52px);
    }
    .right_bottom:after {
        border-left: 1px solid #ffffff;
        border-right: none;
        right: auto;
        left: -45px;
        transform: rotate(66deg) translate(52px);
    }
    .right_center:after,
    .left_center:after {
        border-right: 1px solid #ffffff;
        bottom: -76px;
        content: "";
        /* left: auto; */
        position: absolute;
        /* right: 140px; */
        top: 32px;
        transform: rotate(-54deg) translate(-61px);
    }
    .right_center:after {
        border-left: 1px solid #fff;
        border-right: none;
        right: 61px;
        left: -100px;
        transform: rotate(54deg) translate(61px);
    }
    .left_center:after {
        border-right: 1px solid #ffffff;
        bottom: 0px;
        content: "";
        /* left: auto; */
        position: absolute;
        right: -60px;
        top: 0px;
        transform: rotate(-54deg) translate(-61px);
    }
    .kode_pillars_text {
        background-color: #ffffff;
        border-radius: 380px 390px 0 0;
        display: inline-block;
        margin: auto;
        padding: 0px 0px 0px;
        text-align: center;
        width: 210px;
        position: relative;
        z-index: 99999;
        left: -370px;
    }
    .kode_pillars_text:before {
        -moz-border-bottom-colors: none;
        -moz-border-left-colors: none;
        -moz-border-right-colors: none;
        -moz-border-top-colors: none;
        border-color: #ffffff #ffffff currentcolor;
        border-image: none;
        border-radius: 380px 390px 0 0;
        border-style: dotted dotted none;
        border-width: 1px 1px medium;
        bottom: 0px;
        content: "";
        left: -50px;
        position: absolute;
        right: -50px;
        top: -50px;
        z-index: -1;
    }
    .kode_pillars_text span {
        font-size: 40px;
        position: relative;
        margin-bottom: 22px;
        display: inline-block;
        border-bottom: 2px solid #a7a7a7;
        padding-bottom: 8px;
    }
    .kode_pillars_text h4 {
        margin-bottom: 13px;
        margin-top: 0px;
        font-size: 10px;
    }
    .kode_pillars_text p {
        margin-bottom: 0px;
        font-size: 9px;
    }
    .kode_pillars_wrap.pillare_2 .kode_pillars_text {
        border-radius: 100%;
        height: 550px;
        margin-bottom: -110px;
        padding: 80px 0 0;
        width: 572px;
        background-image: url("images/piller-bg.png");
        background-repeat: no-repeat;
        z-index: 999;
    }
    .kode_pillars_wrap.pillare_2 .kode_pillars_text:after {
        position: absolute;
        content: "";
        top: 0px;
        left: 0px;
        right: 0px;
        bottom: 0px;
        background-color: #000;
        opacity: 0.6;
        border-radius: 100%;
        z-index: -1;
    }
    .kode_pillars_wrap.pillare_2 .kode_pillars_text:before {
        border: 3px dotted;
        top: -15px;
        left: -15px;
        right: -15px;
        bottom: -15px;
        border-radius: 100%;
    }
    #forIslamMobile {
        display: block;
    }
    #forIslamMobile2 {
        display: block;
    }
    #forIslam {
        display: none;
    }
    #forIslam2 {
        display: none;
    }
}