/*
 Theme Name: Bateaux Child
 Theme URI: http://www.bateauxtheme.com
 Description: Bateaux Child Theme.
 Author: Twisttheme
 Template: bateaux
 Version: 1.0.0
 Text Domain: bateaux-child
 */


/* *********************************************************************** */
/* ******************* Styles für Diggelmann + Partner AG **************** */
/* *********************************************************************** */

/* =================== gesamte Seite  =================== */

body {line-height: 1.5em; }


/* Roter Rand oberhalb bzw. unterhalb Section */
#first-section, .top-red-border {border-top: 13px; border-top-style: solid; border-color: #CC0000; top: -13px;} /* -13px damit strich bei vollbild ersichtlich ist */
#last-section, .bottom-red-border {border-bottom: 13px; border-bottom-style: solid; border-color: #CC0000; }

/* Formatierung der Fusszeile - Bottom-bar */
.btx-bottombar .widget {line-height: 2em; text-align: left;padding: 5px 0;}


/* =================== Überschriften   =================== */

h1, h2, h3, h4 {text-transform: uppercase;} /* Grossbuchtstaben bei Überschrift 1 + 2 */
h1, h2, h3, h4 {letter-spacing: 0.05em; } /* color funktioniert nur mit !important */
h1 {font-size: 30px !important; }
h2 {font-size: 20px !important;}
h3 {font-size: 18px !important; line-height: 1.5em;}
h4 {font-size: 17px !important; font-weight: 700 !important; }
h5 {font-size: 16px !important; line-height: 1.5em; }


/* ===================  Überschrift 1 - innerhalb Hero   =================== */

/* Hero Position des Haupttitels im Bild */
h1.btx-page-hero-title, h1.btx-page-hero-title span  {font-size: 30px !important; }
.btx-page-hero-content {padding: 30px 0px;}
.vollbild .btx-page-hero-content {padding: 50px 0;}
.kontaktbild .btx-page-hero-content {padding: 30px 0;}


/* ===================  Überschrift 2 - Hintergrund-Fläche   =================== */

h2 {font-weight: 700 !important; background-color: #A9C0CE; color: white !important; 
	padding: 5px 5px 5px 15px; 
	margin: 5px 0 5px -15px; }

/* Überschriften 2 und Bilder bei Referenz-Seiten - eingerückt und kein Abstand zu Bilder */
.referenz-divers h2 {
	padding: 10px 5px 10px 15px;
	margin: 5px 0 0px 0px; }

.referenz-divers img {padding-top: 0; margin-top: 0;}
.referenz-divers p img {padding-top: 0; margin-top: 0;}

/* vgl. h2 Einstellungen beim Akkordeon */


/* h2 wenn verlinkt > Pfeil im Hintergrund */
h2 a {
	color: #fff !important; display: block;
	background-image: url("img/accord_icon_rechts.png");
	background-size: 30px;background-repeat: no-repeat;background-position: right;
	}


/* Class .h2-navig bei Referenzen, damit Rollover über ganze Fläche möglich ist */
h2.h2_link:hover {background-color: #CC0000; color: white !important;}

/* Class .h3-oben bei Referenzen und Kompetenzen, damit oben kein unerwünschter Abstand; _middle ist für die rechte Spalte bei Kompetenzen */
h3.h3_top, h3.h3_middle {margin-top: 0px;}

/* Class .h5-im Text, damit oben kein unerwünschter Abstand */
h5.h5_text {margin-top: -15px;}

/* ===================  Überschrift + Schrift  Kontakt-Seite =================== */

#kontakt .btx-text-content-inner {font-size: 15px;}


/* unsichtbarer Link bzw. Button auf gesamtes Hero-Header-Bild (Google-Maps) - Einstellungen bateaux-Button */
#kontakt .btx-page-hero-buttons {position: absolute; top: 0px; left: 0px; margin: 0 auto 0 auto; width: 100%; height: 100%;}
#kontakt .btx-page-hero-buttons .btx-button a {width: 1000px; height: 700px; }


/* unsichtbarer Link bzw. Button auf gesamtes Hero-Header-Bild (Google-Maps) - Einstellungen bateaux-Button */
/* #kontakt .btx-page-hero-buttons .btx-button a {border: 1px solid blue !important;}*/


/* Google-Seite https://www.dig-ing.ch/google-maps/ page-id-1525 
	Google Maps Vollbild
*/

/* Braucht evtl. nicht alle CSS-Befehle */

.page-id-1525 .btx-section-wrapper {padding: 0 !important; vertical-align: top !important;}
.page-id-1525 #wpgmza_map {height: 100vh !important;}
.page-id-1525 .btx-container--fullwidth {background-image: none !important;}


/* 2-spaltiges Design */
@media only screen and (max-width: 1050px) { 
	.btx-col-3 { width: 50% !important;}  
	.btx-row .btx-col-3:nth-child(3) {clear: left;}
	#kontakt .portrait {width: 240px;}
}

/* 1-spaltiges Design */
@media only screen and (max-width: 550px) { 
	.btx-col-3 {    width: 100% !important;}
	#kontakt .portrait {width: 280px;}
}


/* ===================  Aufzählung, Listen etc.  =================== */

ul {line-height: 1.5em;}



/* ===================  Hyperlinks (inkl. hover)   =================== */

/* Hyperlinks - bei h2 nicht */
.btx-container a {font-weight: normal; }
.btx-container a:hover {text-decoration: underline; }

.btx-container h2 a {font-weight: 700; }
.btx-container h2 a:hover {text-decoration: none; }


.btx-container h5 a {font-weight: 900; text-transform: uppercase; }
.btx-container h5 a:hover {text-decoration: underline; }



/* ===================  Kopfbereich - Header (Logo, Hamburger-Icon etc.)   =================== */

/* Diging-Symbol rechts des Headers */
div.btx-container--fullwidth {
		background-image: url("img/dig_symbol.png");
		background-repeat: no-repeat;
		background-position: right top;
		background-size: 228px 100px;
	}

/* Text-Logo nach links verschieben */
.btx-navbar-header {margin-right: 220px;}

/* Hamburger und Logo tauschen */
/* geliefert von Support: .btx-navbar-header { float: right; } .btx-navbar--minimal .btx-collapsed-button { float: left; margin-left: 0; }*/
.btx-navbar-header { position: relative !important; float: right !important; } 
.btx-navbar--minimal .btx-collapsed-button { float: left; margin-left: 0; }


/* Logo + Hamburgernavigation beim Rollover aufgehellt */
.btx-navbar-brand:hover, .btx-collapsed-button:hover {opacity: 0.7;}



/* =================== Vollbild-Menü   =================== */

/* Aufklapp-Menu - Linksbündig und Positionierung */
/*.btx-navbar--mobile .btx-collapsed-menu--full .btx-menu {width: 50%; text-align: left; left: 40%;}*/

/* Aufklapp Menu nur 75% der Breite - Bei Standard untereinander */
/* div.btx-collapsed-menu--full {width: 75% !important;} */


/* Achtung zwei unterschiedliche Menüs */

/* --------- Version gross ------------ */

.btx-collapsed-menu--full .btx-menu {margin-left: 20px; top: 130px;}

.btx-collapsed-menu--full .btx-menu>li { float: none; } 
.btx-collapsed-menu--full .btx-menu a { text-align: left; }

/* --------- Version Mobile ------------ */

.btx-navbar--mobile .btx-collapsed-menu--full .btx-menu {text-align: left; padding-left: 25px; padding-top: 90px; vertical-align: top;}
.btx-navbar--mobile .btx-collapsed-menu--full .btx-menu>li { height: 45px;} 

/*
.btx-navbar--mobile .btx-collapsed-menu--full .btx-menu { text-align: left; padding-left: 5%; }
*/



/* =================== Akkordeon (Bateaux) wird nicht verwendet   =================== */

/* Bateaux Akkordeon-Titel formatieren */
.btx-accordion-heading {
	font-weight: 700 !important; color: white !important; font-size: 120% !important; 
	padding: 0 15px 0 15px !important; 
	text-transform: uppercase;letter-spacing: 0.08em
	}

.btx-accordion-heading:hover {background-color: #CC0000 !important; }
.btx-text-content {padding: 0 15px !important;}


/* =================== Akkordeon (jQuery)    =================== */

/* Accordion - jQuery-UI neu definieren - für beide Varianten - Class + ID */

/*.accordion .ui-widget, #accordion .ui-widget {font-family: Verdana, Lato, Arial, sans-serif !important; }*/
.ui-widget {font-family: Lato, Arial, sans-serif !important; }

/* Titel des Akkordeons */
.accordion .ui-state-default, #accordion .ui-state-default {
	background-color: #A9C0CE; border: 0px; 
	padding: 5px 5px 5px 15px; 
	margin: 5px 0 5px -15px; height: auto;} 

/* Hover des des Akkordeons */
.accordion .ui-state-default:hover, #accordion .ui-state-default:hover {background-color: #CC0000; }

.ui-state-focus { }  /* Definition des Fokus-Status */
:focus {outline:0;} /* Entfernt blauer Strich in Chrome */
.accordion .ui-corner-all, #accordion .ui-corner-all {border-radius: 0px;} /* abgerundete Ecken abstellen */

/* ausgeklpappter Inhalt */ 
.accordion .ui-widget-content, .accordion .ui-widget-content, #accordion .ui-widget-content, #accordion .ui-widget-content {
	border: 0px;color: #5e5e5e; padding: 1em 1em 1em 0em; 
	}

/* h4 Anfangs des Inhaltes kein Anfangsabstand */
.accordion div>h4 {margin-top: 0px;}

/* Linkfarbe im Akkordeon */
.ui-widget-content a {color: #CC0000;}
.ui-widget-content a:hover {color: #686868;}

/* Pfeil zum Herunterscrollen */
.ui-accordion-header-icon, .ui-icon {background-color: transparent; height: 30px; width: 30px; float: right; margin-top: -4px; margin-right: 2px;}

.ui-accordion-header-icon, .ui-icon, .ui-widget-content .ui-icon {background-size: cover;background-repeat: no-repeat;background-position: right; }
.ui-icon-triangle-1-e {background-position: center; }
.ui-icon-triangle-1-s {background-position: center;}


.ui-icon, .ui-state-hover .ui-icon, .ui-state-focus .ui-icon {background-image: url("img/accord_icon_rechts.png"); }
.ui-state-active .ui-icon {background-image: url("img/accord_icon_unten.png"); }

/*.ui-accordion-header-icon, .ui-icon {float: right; ;height: 20px; width: 20px; }*/



/* =================== Akkordeon zweispaltig    =================== */

/* Akkordeon zweispalting */
.acc-left, .acc-right {display: block; width: 48%; border: 0px solid blue; float: left; }
.acc-left {margin-right: 4%;}



/* =================== ARI Lightbox    =================== */

/* Pfeil bei ARI Fancybox */
.fancybox-arrow:after {background-image: url("img/accord_icon_rechts.png") !important;background-size: 30px !important;;background-repeat: no-repeat;}



/* =================== NextGen Gallery    =================== */

/* Nextgen Gallery Thumbnails - Rand entfernen */
.ngg-gallery-thumbnail {border: 0px !important; margin:0px !important; }
.ngg-gallery-thumbnail a {margin: 0 !important;}

.ngg-galleryoverview {margin: 0 !important;}

.ngg-gallery-thumbnail a:hover {opacity: 0.8;}



/* =================== TinyMCE Editor    =================== */
/* vgl. auch editor-style.css + editor-style-shared.css */


/* TinyMCE - hidden - Text */
.hidden {display: none;}


/* ===================  Sprachnavig NEU 2022-11  =================== */

.sprach-navig {padding-top: 1px;}
.sprach-navig a {; opacity: 0.6;}
.sprach-navig a:hover {opacity: 1;}
.sprach-navig .dt {margin-left: 15px}
.sprach-navig .fr {margin-left: 3px;}
.sprach-navig .aktiv {opacity: 1; color: #565656;}

@media only screen and (max-width: 670px) { 
	.sprach-navig {padding-top: 2px;}
	.sprach-navig p {font-size: 80% !important;}
}



/* ===================  Test-Code  =================== */

/* Testen Zeichen nach Tag */
/*.ui-accordion-header-icon:before {content: '\ea41';}*/


/* Zurücksetzten von Definitionen (class etc.) */
/*test {all: unset;}
test {all: initial;}
test {all: inherit;}
test {all: revert;} - noch nicht unterstützt - nur Safari*/




/* ====================  Media Queries ========================== */

@media only screen and (min-width: 961px) {
	/*.btx-collapsed-button {margin-right: 100%; text-align: left;}*/
	
	/* Grösse des Header-Logotextes */
	.btx-navbar-logo--text {font-size: 30px; letter-spacing: 0.06em;}

	/* Grösse des Hero-Titels */
	h1.btx-page-hero-title, h1.btx-page-hero-title span  {font-size: 32px !important; letter-spacing: 0.06em;}
	
}

@media only screen and (max-width: 960px) {
	/*.btx-collapsed-button {margin-right: 100%; text-align: left;}*/
	
	/* Grösse des Headers und Position des Header-Logotextes und des Logo-Bildes */
	.btx-navbar-header {margin-right: 120px;}
	div.btx-container--fullwidth {background-size: 137px 60px;}


	/* Grösse des Header-Logotextes */
	.btx-navbar-logo--text {font-size: 25px; ;letter-spacing: 0.02em;}

	/* Grösse des Hero-Titels */
	h1.btx-page-hero-title, h1.btx-page-hero-title span  {font-size: 27px !important; letter-spacing: 0.06em;}
}


@media only screen and (max-width: 670px) { 

	/* Grösse des Headers und Position des Header-Logotextes und Logo-Bildes (ausgeblendet) */
	.btx-navbar-header {margin-top: -3px; margin-right: 10px;}
	div.btx-container--fullwidth {background-image: none;}
	.btx-navbar--mobile {line-height: 20px; padding-top: 17px;} 

	/* Grösse des Hero-Titels */
	h1.btx-page-hero-title, h1.btx-page-hero-title span  {font-size: 19px !important; letter-spacing: 0.06em;}
	
	/* Grösse des Header-Logotextes */
	.btx-navbar-logo--text {font-size: 17px; ;letter-spacing: 0.02em;}


	/* sonstige Einstellungen  */
	h1 {font-size: 20px !important;} 
	h3 {line-height: 1.3em;}
	p, .btx-text-content-inner {font-size: 17px !important;}
	
	/* Abstand des unteren Spartentitels h3 bei Kompetenzen in der einspaltigen Darstellung */
	h3.h3_middle {margin-top: 25px;}

	/* zweispaltiges Akkordeon nur noch einspaltig */
	.acc-left, .acc-right {display: block; width: 100%; float: none; padding-right: 0; margin-left: 2%;}
}