/*
 Theme Name:   stickerei_textildruck
 Theme URI:      https://www.stickerei-textildruck-leipzig.de/
 Description:  Child Theme von Flash, für uns aufbereitet
 Author:       Katharina
 Author URI: https://www.stickerei-textildruck-leipzig.de/
 Template:  flash
 Version:      1.0
 Text Domain:  stickerei_textildruck
*/

/*
Rot = #E42618
hellgrau = #D7D7D7
dunkelgrau = #3D4543


HEADER: ab Zeile 26
FOOTER: ab Zeile 55
ELEMENTE: ab Zeile 112
ALLGEMEIN: ab Zeile 228
RESPONSIVE: ab Zeile 270

*/

ul{
	color:white}



/*HEADER*/
/*Brotkrumennavigation anpassen*/
.breadcrumb-trail.breadcrumbs{
	background: none;
	border-top: 1px solid lightgrey;
}

.trail-title{
	display: none;
}

.breadcrumb-trail.breadcrumbs .trail-items{
	float: left;
}

.transparent.header-sticky #masthead-sticky-wrapper {
	position: sticky;
}

/*Hamburgermenü*/
.menu-toggle{
	margin-right: 40px;
}

/*Schrift des Navigations-Menüs oben*/
nav#site-navigation.main-navigation a{
	font-size: 1.5em;
}

#site-navigation ul li{
	padding: 23px 40px 23px 0;
}

.logo img{
	padding-top: 5%;
	padding-bottom: 5%;
}

/*FOOTER*/

.footertext{
	color: white;
}

#top-footer {
	background-color: #D7D7D7;
	padding: 40px 0 20px;
	white-space: nowrap;
}

#top-footer .textwidget,
#top-footer .widget-title:first-letter,
#top-footer .widget ul li:after,
#top-footer .widget ul li a {
	color: #3D4543;
}

#top-footer .widget-title {
	font-size: 18px;
	border-left: 3px solid #3D4543;
	font-weight: 600;
	line-height: 24px;
	color: #3D4543;
	margin-bottom: 30px;
	padding-left: 20px;
}

#bottom-footer {
	padding: 20px 0;
	background-color: #3D4543;
}

#bottom-footer a{
color: #fff;
}

#bottom-footer p{
	margin: 0;
}

#top-footer a:hover,
#bottom-footer a:hover{
color: #E42618;
}

/*Footer Text Anpassungen*/
.textwidget p{
	margin: 0;
}

#top-footer .widget ul li:after{
	_content: '•'; /*macht Probleme im Edge*/
}

#top-footer .widget ul li{
	padding: 0 0 0 20px;
	font-size: 13px;
}

/*ELEMENTE*/

#primary .content-404 {
	padding: 0;
}

#primary .content-404 a{
	color: #E42618;
}

#primary {
	float: none;
	width: 100%;
}

/*Aufklapp-Tabellen*/

.KostenÜberschrift{
font-size: 1.5em;
font-weight: bold;
}

.KostenÜberschrift:any-link {
	color: #3D4543;
	}


.KostenÜberschrift:hover{
color: #E42618;
-ms-color:#3D4543;
}

.KostenÜberschrift::before{
content:'+';
}

.KostenText{
}

thead{
	background-color: #D7D7D7;
}

thead td {
font-weight: bold;
}

/*Bilder auf Druck-Seiten*/

.DruckbildLinks{
	float:left;
	max-height: 250px;
	margin-right: 2%;
	margin-top: 1%;
}

.DruckbildRechts{
	float:right;
	max-height: 250px;
	margin-top: 1%;
}

/*Cookie Bar/Button*/

#cn-accept-cookie,
#cn-refuse-cookie,
#cn-more-info {
background: #D7D7D7;
color: black;
}

/*roter Balken/Vorteile*/
#vorteile {
	display: flex;
	margin-left: 17%;
	margin-right: 17%;
	justify-content: space-between;
	color: white;
	font-size: 1.2em;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: baseline;
	white-space: nowrap;
}

#vorteileBG{
	background: #E42618;
}

#vorteile .flex:nth-child(1),
#vorteile .flex:nth-child(2),
#vorteile .flex:nth-child(3){
	padding-top: 2%;
 	padding-right: 8%;
	border-right: 2px solid #fff;
}

/*Aufteilung der Produktvorschläge*/

.containerProdukte{
	display:grid;
	grid-template-columns: 25% 25% 25% 25%;
	grid-template-rows: 50% 25% 25%;
	grid-gap: 2%;

}

.produkt1{
	display: grid;
	grid-column: 1 / span 2;
	grid-row: 1/ span 2;

}

.produkt1 img{
width: 100%;
padding-left: 0;
}

.produkt2{
	display: grid;
	grid-column: 3 / 4;
	grid-row: 1 / 2;
}
.produkt3{
	display: grid;
	grid-column: 4 / 5;
	grid-row: 1 / 2;
}

.produkt4{
	display: grid;
	grid-column: 3 / 4;
	grid-row: 2 / 3;
}

.produkt5{
	display: grid;
	grid-column: 4 / 5;
	grid-row: 2 / 3;
}

	.produkt1 img,
	.produkt2 img,
	.produkt3 img,
	.produkt4 img,
	.produkt5 img{
		padding: 0;
	}


/*Kontaktformular*/
.floatLeft{
	float:left;
	width: 45%;
}

.floatRight{
	float: right;
	width: 50%;
	margin-top: 5%;
	font-size: 1.1em;
}

.nf-help{
	background: none;
}

/*Startbild*/
.startbild{
	width:100%;
}

/*ALLGEMEIN*/

/* Festlegen der max-Breite aller Elemente */
#top-footer .tg-container,
#bottom-footer .tg-container,
#flash-breadcrumbs.breadcrumb-trail.breadcrumbs .tg-container{
	max-width:66%;
	float: none
}

.header-bottom .tg-container{
	margin-right: 17%;
	margin-left:3%
}

.text {
	margin-left: 17%;
	margin-right: 17%
}



/*Typography*/
body,button,input,select,textarea,blockquote,code,
kbd,tt,var,pre,p,h1,h2,h3,h4,h5,h6,a,
html, div, span, dl, dt, dd, ol, ul, li, fieldset, form,
label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	font-family: "PT Sans", sans-serif;
}

p, label, #top-footer.tg-container.tg-column-wrapper{
	font-size: 13pt;}


/*damit Startbild auf ganze Breite angezeigt wird, alle anderen Elemente müssen aber angepasst werden*/
.tg-container {
	max-width: 100%;
	margin: 0 auto;
}


/*RESPONSIVE*/


	@media screen and (min-width:150px) and (max-width:560px){
		#bottom-footer .tg-column-wrapper .tg-column-4{
		float:none;
		}

		#vorteile, #vorteileBG{
			display:none;
			}
		}

	@media screen and (min-width:150px) and (max-width:762px){
			#vorteile, #vorteileBG{
				display:none;
			}

			.produkt1,
			.produkt2,
			.produkt3,
			.produkt4,
			.produkt5,
				.containerProdukte{
				display: block;
				float: left;
				margin: 2%;
			}

			.floatLeft,
			.floatRight{
				float: none;
				width: 85%;
			}
		}

@media screen and (min-width:150px) and (max-width:770px){
			.tg-column-wrapper .tg-column-1, .tg-column-wrapper .tg-column-2,
			.tg-column-wrapper .tg-column-3, .tg-column-wrapper .tg-column-4,
			.tg-column-wrapper .tg-column-5{
				float: none;
				width:100%;
			}
			tr {
				_display: block;
				min-width:20px;
			}

@media screen and (min-width:150px) and (max-width:1060px){
				#vorteile .flex:nth-child(1),
				#vorteile .flex:nth-child(2),
				#vorteile .flex:nth-child(3),
				#vorteile .flex:nth-child(4){
					border-style: none;
					font-size: 1em;
					padding: 1%;
				}
				#vorteile{
					margin-right: 2%;
					margin-left: 2%;
				}
				}

@media screen and (min-width:982px) and (max-width:1360px){
					#primary-menu li{
						font-size: 0.7em;
								}

					#vorteile .flex p{
						margin-left: 5%;
					}
								}

@media screen and (min-width:320px) and (max-width:338px){
#top-footer .tg-container{

		margin-left: 5%;
		width: 100%;
	}
								}


/*BROWSER-SPEZIFIKATIONEN*/
	
	th,td,tr {white-space: nowrap;
									}