/*
 Theme Name:   Divi Child
 Theme URI:    https://demoksu.bcd.ch/wp-content/themes/Divi/
 Description:  Layout - Structure CSS
 Author:       TWI AG
 Author URI:   http://example.com
 Template:     Divi
 Version:      1.1.0
 License:      TWI AG
 Text Domain:  Divi

 User Information: The following styles should be only changed with extreme caution, since they define the structure of the page and the damage caused by wrong usage could be major. - JessicaD
*/


/* Header */

/* hide Hamburger menu button WP-menu  */
@media (max-width: 980px){
	.et_header_style_left #et-top-navigation { display: none; }
}


/* Hamburger menu button superfly*/
.sfm-navicon-button {
	margin-top:  34px;
	margin-left: 34px;
}

/* Menu und Navigation */

#logo {
	top: 34px;
	position: absolute;
}


.et_header_style_left .logo_container {
	position: relative;
	width : 300px;
	float: right;
	margin-top: -10px;
    margin-right: 200px;
}

#top-menu {
	padding-left: 97px;
	text-transform: uppercase;
}

#top-menu a {
	display:inline;
}

#top-menu-nav ul li	{
	display: inline-block;
	padding: 16px;
	border-right: solid 2px darkgray;
}


#top-menu > li:last-child {
    padding-right: 16px;
}

#et-top-navigation {
	float: left;
	font-weight: 500;
	padding-top: 34px !important;
	padding-left: 0px !important;
}

/* ======= Divi Slider  ========== */
/**********************************/
@media only screen and (min-width: 1280px) {
	.et_pb_fullwidth_slider_0.et_pb_slider { border-right: #e3e9eb solid 96px !important; }
	.et_pb_slider .et_pb_slide { border-right: white solid 0px; }
}
.et_pb_slider .et_pb_slide_description {
	visibility: hidden;
}





/* ======= Woocommerce ========== */
/**********************************/


.et-cart-info {
	display:none;
}

body.woocommerce #primary {
	float: none;
	width: 100%;
}

/*  ========= Superfly ========== */
/**********************************/
.sfm-logo {
	position : absolute ;
	top : -5px;
	margin-left : 20px;
}

#sfm-sidebar .sfm-menu a img {
    max-width: 300px;
    max-height: 3000px;
	width : 250px;
	height: 200px;
}

.sfm-images {
	display: table;
	overflow: hidden;
}

.sfm-images img {
	width:250px;
	height: 150px;
	float: left;
	padding: 2px;
}



/* =============  teaser ================== */


/*rowTeaser*/

.colTeaser { /*@@JDS*/
	overflow: hidden;
	position: relative;
}

/*Used only for Portrait*/
.twiTeaser {
		padding: 67.16% 0 0 0!important;
}

.twiTeaser .et_pb_promo_description { /*text in box*/
	position : absolute;
}
.twiTeaser .et_pb_button_wrapper {  /*button in box */
	position : absolute;
	top: 0;
    bottom: 0;
    width: 100%;
}

/*Text of the Call to Action Module */
.twiTeaser .et_pb_button_wrapper .et_pb_button {
	position: absolute;
	left:0;
	top:0;
 	width: 100%;
	height: 100%;
	padding-left: 34px!important;
}

/*Remove arrow from Call to action on Hover*/
.twiTeaser .et_pb_button_wrapper .et_pb_button:after,
.twiTeaser .et_pb_button_wrapper .et_pb_button:before{
	content: "";
}



 /****** TWI Teaser 4s - 4 Columns *****/
/**************************************/

.twiTeaser4s {
	padding: 111% 0 0 0!important;
}

.twiTeaser4s .et_pb_button_wrapper .et_pb_button p,
.twiTeaser4s .et_pb_button_wrapper .et_pb_button .et_pb_email a,
.twiTeaser4s .et_pb_button_wrapper .et_pb_button .et_pb_email a:link{
	color: white !important;
	padding-bottom: 0;
}

.twiTeaser4s .et_pb_button_wrapper .et_pb_button .et_pb_telefon{
	margin-top: 1.4em; /*aprox. 34px*/
}
.twiTeaser4s .et_pb_button .et_pb_promo_button{
	padding-top: 75% !important;
}


.twiTeaser4s .et_pb_button .et_pb_promo_button:hover{
	padding: none !important;
	padding-top: 45% !important;
}

.twiTeaser4s .et_pb_telefon,
.twiTeaser4s .et_pb_email{
	opacity: 0;
}


.twiTeaser4s .et_pb_promo_button:hover .et_pb_telefon,
.twiTeaser4s .et_pb_promo_button:hover .et_pb_email{
	opacity: 1;
}

.twiTeaser4s .et_pb_promo_description{
	top: 0;
	width: 100%;
    height: 100%;
    padding-bottom: 0;
}



.twiTeaser4s .et_pb_button_wrapper{
	box-sizing: unset !important;
}
.twiTeaser4s .et_pb_button:hover, .et_pb_module .et_pb_button:hover,
.twiTeaser4s .et_pb_button:hover, .et_pb_module .et_pb_button{
	border: 0 !important;
}
.twiTeaser4s .et_pb_promo_description:hover{
	box-sizing: unset !important;
}



/*Media Queries for: Tablet*/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
	/* 4 Column Elm - Portraits */
	.twiTeaser .et_pb_button_wrapper .et_pb_button {
		padding-left: 22px!important;
	}
}
/*Media Queries for: Tablet - Landscape Only! */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation: landscape) {
		/* Adjusts Elm Width when Tablet Landscape */
	.rowTeaser .et_pb_column_1_4, .et_pb_gutters2.et_pb_row .et_pb_column_1_4{
		width: 45% !important;
		margin-top: 25px;
	}
	.et_pb_jt_filterable_grid .et_pb_portfolio_items .et_pb_portfolio_item{
		width: 50% !important;
	}
}

/*Media Queries for: Smartphone*/
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
	/* Padding of Text elements */
	.twiTeaser .et_pb_button_wrapper .et_pb_button {
		padding-left: 22px!important;
	}
}





/* ==== Tabs-Settings for Projects ==== */



.twiProjectTabs {
	border: 0 solid white!important;
}

.twiProjectTabs ul.et_pb_tabs_controls:after{
	border-top: 0 !important;
}

.twiProjectTabs .et_pb_tabs_controls  {
    background-color: white!important;
}

ul.et_pb_tabs_controls li{
	border: 0 solid #939393;
	border-top: 1px solid #939393;
	border-bottom: 1px solid #939393;
	min-width: 50% !important;
}



.twiProjectTabs .et_pb_tab {
	padding-left : 0;
	padding-right: 0;
}


.twiProjectTabs .et_pb_tab_0 {
	min-width : 50%;
}

.twiProjectTabs ul li:hover{
	cursor: pointer !important;
	min-width: 50% !important;
}

/* slider in tab  */
.twiProjectTabs .et_pb_slider .et_pb_slide{
	border-right: 0 !important;
}

/* --- end of Project Tabs --- */

/*
Custom CSS TWI AG: Jessica - Test --> Portfolio Items for References
---------------------------------------------------------------- */


/*Grid Item Title Container:*/
.et_pb_jt_filterable_grid_item_title_container{
	position:absolute;
	padding-top: 59%;
	padding-left: 8%;
	z-index: 1000;
	width: 100%;
}

.et_pb_jt_filterable_grid_item_title_container h4{
	position: absolute;
	bottom: 0;
}


/*Grid Item Image Container:*/

.et_pb_jt_filterable_grid_0 .et_pb_jt_filterable_grid_item_image_container{
	position: relative;
	display: flex;

}


/***********KSU Header***************/

#main-header,
#main-header .container{
	height: 9.882em!important;
	transition: top 0.3s !important; /* Transition effect when sliding down (and up) */
}

#top-menu-nav ul li{
	border-right: 1px solid darkgrey
}



/*******References Modul***********/

.et_pb_filterable_portfolio .et_pb_portfolio_filters li {
    float: left;
    margin-right: 20px;
	width: 184px;
	height: 37px;
}

.et_pb_filterable_portfolio .et_pb_portfolio_filters li a{
	border: 0;
	width: 100%;
	height: 100%;
	margin: auto !important;
	display: table;
}

.et_pb_jt_filterable_grid_item .et_overlay{
	z-index: 1 !important;
	border: 0;
}

.et_portfolio_image:hover > .et_overlay{
	opacity: 1 !important;
}

/*****Filterable Portfolio Items*****/


.et_pb_module_header{
	position: absolute;
    top: 55%;
    left: 8%;
    z-index: 100;
}

/*Filter of Filterable Portfolio Items*/
.et_pb_portfolio_filter a{
	border-radius: 0 !important;
}
.et_pb_filterable_portfolio .et_pb_portfolio_filters li a{
	width: 282px !important;
	margin-right: 20px;
}

.et_pb_portfolio_filters.et_pb_jt_filterable_grid_filters li{
	display: table !important;
}

/* FOOTER */
#footer-info{
	padding-bottom: 46px !important;
}
#footer-bottom{
	background-color: #fff !important;
	border-bottom: 1px solid rgba(0,0,0,.32);
	padding-bottom: 0px;
}


/*  P R O D U C T  F I N D E R  by TWI AG (JessicaD) */
#ProductFinder_Title{
	font-size: 42px !important;
	color: #4a4949;
}
.Ebene1_title{
	font-size: 25px !important;
	color: #4a4949;
	top: 0;
}
.hidden{
	display: none!important;
}

#ksu_ebene1_wrapper{
	min-height: 400px;
	margin-top: -40px;
}
.ksu_category1{
	background-color: white;
	width: 20%;
	height: 200px;
	float: left;
}
.card-img-top {
    max-width: 242px !important;
}
#ksu_ebene2_wrapper{
	margin-top: 30px;
}
#ksu_ebene3_wrapper{
	margin-top: 50px;
}
#ksu_ebene3_wrapper h1{
	color: #b5cc54;
	font-weight: 700;
}

#ksu_ebene3_wrapper > div:nth-of-type(1) {
    margin-top: -15px !important;
}
p.card-text{
	position: absolute;
	bottom: 0;
}

.ksu_category2 .card-body{
	height: 47px !important;
	margin-bottom: 16px; 
	width: 150px;
}
.ksu_category2 p.card-text{
	font-size: 18px;
	color: #4a4949;
	xxtop: 0 !important;
}

.ksu_category1:hover,
.ksu_category2:hover{
	cursor: pointer;
}
div.ksu_category2 img{
	xxheight: 120px !important;	
}

/* C A R D  settings */
.ksu_category1 p.card-text{
	font-size: 25px;
	margin-bottom: 10px;
}

#ksu_ebene1_wrapper .card-body{
    height: 60px;
    margin-bottom: 19px;
}
.card-img-top{
	border-radius: 0 !important;
}
.ksu_category3{
	margin-top: 20px;
}
.card-body{
	min-height: 30px !important;
	position: relative;
	padding: 0 !important;
}
.no_border_card{
	border: none!important;
}

/* Titel */

.ksu_pf_catname1,
.ksu_pf_catname2{
	float: left;
	margin-bottom: 10px;
}

.ksu_pf_catname1{
	font-size: 24px;
}
.ksu_pf_catname2{
	font-size: 14px;
}

.ksu_ebene4_wrapper{
	margin-top: -100px;
}
.produkt_familie{
	border-top: 1px solid #d5d3d3;
    border-bottom: 1px solid #d5d3d3;
	height: 196px;
}
.produkt_familie img{
	max-height: 190px !important;
}
.produkt_familie > div {
    max-height: 196px;
	max-width: 282px;
}

.produkt_familie:hover .familie_hover_zone, 
.produkt_familie_articleListView:hover .familie_hover_zone{
	background-color: #b5cc54;
	cursor: pointer;
}
.produkt_familie_title {
    font-size: 65px;
    font-weight: 600;
}
/* center vertically */
.produkt_familie_title, .produkt_familie_table{
    margin: 0;
    position: absolute;
    top: 50%;
    transform: translate(0, -50%);	
}
table.produkt_familie_table tr td{
	font-size: 15px !important;
	padding: 0 !important;
}
table.produkt_familie_table tr td:first-child{
	min-width: 230px !important;
	font-weight: 700;
}

/* Styles on article List View Ebene 5*/
.produkt_familie_title_familie_articleListView{
	font-size: 30px;
    font-weight: 600;
	margin-top: 30px;
}
.table thead th{
	border-bottom: 1px !important;
}
.table th{
	border-top: none !important;
}

/* Styles to switch the shown info container of a family */
.hide_family_container{
	display: none !important;
}

/* Styles to make Ebene 4 appear to be the only one present */

.show_only_ebene4{
	top: 0; 
	width: 100%;
	height: 100%;
}
.hide_ebene, .hide_ksu{
	display: none !important;
}

/* Style for the breadcrump in family view */
#family_ebene_view_breadcrump{
	margin: 50px 10px;
	font-size: 42px !important;
}

/* Ebene 6 Styles */
.artDetailView_Title{
	padding: 0;
    margin: 0;
    line-height: 1em;
}
.artDetailView_Subtitle{
	font-weight: 700;
}

/* Go Back Button */
#go_back_from_family_overview, #back_to_family_view{
	padding: 0;
    position: absolute;
    background-color: transparent;
    border: none;
    left: -218px;
    top: -30px;
}

#article_detailsView_ebene6{
	margin-top: -58px;
}

/*--  Tabs */

/* Tab Navigation */
#articleDetailsView_tabs_element{
    height: 100%;
}
#articleDetailsView_tabs{
	height: 76px;
	padding: 0 !important;
    list-style: none !important;
	border-bottom: 1px solid #dee2e6;
    border-top: 1px solid #dee2e6;
}
#articleDetailsView_tabs_element .tab-content .tab-pane{
	padding-top: 10px !important;
}


/* Cleanup BS Tabs*/
.nav-tabs .nav-link.active{
	background: none !important;
	border: none !important;
	background-color: #b5cc54 !important;
	color: white !important;
	border-radius: unset !important;
}
.nav-tabs .nav-link.active:hover{
	color: white !important;
}
.nav-tabs .nav-link{
	border: none !important;
}
.nav-tabs .nav-link:hover{
	border: none !important;
	border-radius: unset;
	color: #666 !important;
}
a.nav-link {
    font-size: 22px;
    line-height: 3em;
    color: #666;
    padding: 4px 30px 4px;
    vertical-align: middle;
    display: table-cell;
}



/* Media Queries : Product Finder */

/* MD -> on Tablet (iPad) */
@media only screen and (max-width: 768px) {
	.ksu_category1{
		margin-bottom: 5rem!important;
		margin-left: 1rem!important;
		margin-right: 2rem!important;
		
		/*col
		-ms-flex-preferred-size: 0;
		flex-basis: 0;
		-ms-flex-positive: 1;
		flex-grow: 1;
		max-width: 100%;*/
	}
	.ksu_category2{
		margin-bottom: 1rem!important;
		margin-left: 1rem!important;
		margin-right: 1rem!important;
	}
}

/* LG -> For iPad landscape and Desktop*/
@media only screen and (min-width: 768px) {
	.ksu_category1  {
		margin-right: 0.07rem;
		margin-left: 0.07rem;
		margin-bottom: 5rem;
	}
	.ksu_category1, .ksu_category2  {
		-ms-flex: 0 0 auto!important;
		flex: 0 0 auto!important;
		width: auto!important;
		max-width: 100%!important;
	}
}