/**
 * Theme Name: TECH Schmiede Template
 * Theme URI: http://wordpress.org/themes/twentythirteen
 * Author: Michael Ruhdorfer
 * Author URI: http://www.tech-schmiede.at
 * Description: Basic Wordpress Template on Bootstrap Base
 * Version: 1.0	
 *
 *	#314757		dark blue
 *	#d2dde5		light blue
 *	#edf3f6		light light blue
 *
 *	#a4cd69		green
 *	#73ab2e		dark green
 *
 */

:root {
	
	--logo-url :url("/wp-content/uploads/2025/11/zuckerfrei-store-zuckerfreie-schokolade-logo.png");
	--logo-bg : rgba(77,134,147, 0.9);
	--logo-border-radius: 0px;
	--logo-height : 71px;
	--logo-width : 368px;
	--logo-padding : 50px;
	
	--calendar-url: url("/wp-content/uploads/2023/10/adventkalender-baeume-schnee.jpg");
	--calendar-bg: rgba(255,255,255,0.9);
	--calendar-border-radius: 0px;
	
	--day-font-family: Impact;
	--day-color:#28525b!important;
	--day-text-shadow: rgba(77,134,147,0.6) 0em 0em 0.2em;
	
	--overlay-bg: rgba(77,134,147,0.6);
	
	--modal-header-color: #fff;
	--modal-header-bg: #28525b;
	--modal-content-bg: #e1e0de;
	--modal-content-url:url("/wp-content/uploads/2023/10/header.jpg");
	
	--h1-color: #000;
	--h2-color: #4d8693;
	
	--button-bg : #4d8693;
	--button-hover : #28525b;
	--button-color : #fff;
	
	--subsite-bg: #fff;
	
	--days-1-color:#28525b!important;
	--days-2-color:#4d8693!important;
	--days-3-color:#28525b!important;
	--days-4-color:#4d8693!important;	
	
	--footer-link-color: #dcdcdc;
} 
 
html 
	{height: 100%;} 

#ts-admin-msg
	{position: absolute}
	
#logo
	{background: var(--logo-bg) var(--logo-url) no-repeat center center / var(--logo-width) var(--logo-height);width:calc( var(--logo-width) +  var(--logo-padding) );height:calc( var(--logo-height) +  var(--logo-padding));	position: absolute;
		top: 50px; left: 80px;border-radius: var(--logo-border-radius);
	}
 
body				
	{width:100%;height:100%;background: transparent var(--calendar-url) no-repeat center center;background-size: cover;}

/* ROWS */
.ts-col-12							{width: 100%;}
.ts-col-11							{width: 91.6667%;}
.ts-col-10							{width: 83.3333%;}
.ts-col-9							{width: 75%;}
.ts-col-8							{width: 66.6667%;}
.ts-col-7							{width: 58.3333%;}
.ts-col-6							{width: 50%;}
.ts-col-5							{width: 41.6667%;}
.ts-col-4							{width: 33.3333%;}
.ts-col-3							{width: 25%;}
.ts-col-2							{width: 16.6667%;}
.ts-col-1							{width: 8.3333%;}

.ts-col-12							{display: block;float:none;position: relative;padding: 5px;box-sizing: border-box;}
.ts-col-11,
.ts-col-10,
.ts-col-9,
.ts-col-8,
.ts-col-7,
.ts-col-6,
.ts-col-5,
.ts-col-4,
.ts-col-3,
.ts-col-2,
.ts-col-1							{display: inline;float:left;position: relative;padding: 5px;box-sizing: border-box;}

.ts-col-6							{padding-left: 0;}
.ts-col-6 + .ts-col-6				{padding-left: 15px;padding-right: 0}

.clearer,
.ts-row:after						{clear: both;}

.spacer								{clear:both;display:block;height: 40px}

body .ts-col-12.ts-xmas-calendar
	{padding: 0;}

body .ts-content > p
	{margin: 0 auto;}
	
.ts-content
	{max-width:1400px;}	
	
.ts-footer	
	{	text-align: right;
		max-width: 1140px;
		position: absolute;
		margin: 0 auto;
		padding: 0 15px;
		bottom: 15px;
		right: 0;}
		
.ts-footer a
	{font-size: 14px;margin-top: 0px;display: inline-block;color: var(--footer-link-color);}	

.ts-button
	{font-size: 14px;font-weight: normal;transition: background-color 250ms linear 0s !important;display: inline-block;
    background-color: var(--button-bg);color: var(--button-color)!important;padding: 14px 40px;border-radius: 0;border: 0;
    text-transform: none;margin-bottom: 30px;text-decoration: none!important;margin: 0 auto;}

.ts-button:hover    
	{background-color: var(--button-hover)!important;}

.ts-right
	{float: right;display: inline;position: relative;}	
	
/*** ADVENT CALENDAR ***/
body .xmas-advent-calendar__wrapper
	{line-height: 3;}

body .xmas-advent-calendar__wrapper--big
	{width: 100%;max-width: 1240px;background: var(--calendar-bg)!important;
	margin-top:17vh!important;padding: 30px!important;

	-webkit-box-shadow: 0px 0px 60px -10px rgba(0,0,0,0.3);
	-moz-box-shadow: 0px 0px 60px -10px rgba(0,0,0,0.3);
	box-shadow: 0px 0px 60px -10px rgba(0,0,0,0.3);
	
	border-radius: var(--calendar-border-radius);
	
	display: grid; 
	grid-template-columns: 16.7% 16.7% 16.7% 16.7% 16.7% 16.7%;  
	resize: both;
	height: auto!important;max-height: unset!important;
 }

	
body .xmas-advent-calendar__wrapper--big .xmas-advent-calendar__day-wrapper
	{width: 100%;height: auto;
	  max-height: 170px;
	  max-width: 170px;
	  margin: auto;
	  aspect-ratio: 1 / 1;
	  box-sizing: border-box;
	  position: relative;
	  text-align: center;
	  font-size: 20px;
	  color: white;
	  display: flex;
	  align-items: center;
	  justify-content: center;
	}	
	
body .xmas-advent-calendar__wrapper--big .xmas-advent-calendar__day-text	
	{font-family: Arial;    text-shadow: rgba(0,0,0,0.2) 0.1em 0.1em 0.5em;}
	

body .container 
	{width: 100%;margin: 0 auto;position:relative;max-width: 1400px;}
body .xmas-advent-calendar__wrapper--big .xmas-advent-calendar__day-text
	{font-size: 50px!important;font-weight: 400!important;line-height: 100px;color:#fff!important;font-family: var(--day-font-family);
		
		line-height: inherit!important;
		top: 0!important;
		left: 0!important;
		width: calc(100% - 20px)!important;
		height: calc(100% - 20px)!important;
		
display: flex;
		flex-direction: row;
		flex-wrap: nowrap;
		align-content: center;
		justify-content: center;
		align-items: center;
		
		border-radius: 0;
		margin: 10px;
		
		background-color: rgba(112,148,178,0.3);
		
	}	

body img.xmas-advent-calendar__day
	{display: none!important;}
	
	
	
	
/*** EFFECTS ***/
html body .xmas-advent-calendar__day-text:hover {
	color:var(--day-color)!important;
	text-shadow: var(--day-text-shadow);
}

.xmas-advent-calendar__day-wrapper--opened {
	/* CSS EFFECT */
	animation-name: puffOut;
	animation-duration: 3s;
	animation-fill-mode: both;
}


/*** OVERLAY ***/
body .xmas-advent-calendar__modal
	{background-color:var(--overlay-bg)}
	
body .xmas-advent-calendar__modal-header	
	{position: relative;transform: none!important;
		transform: none!important;
		text-align: center;
		font-weight: 600;
		font-size: 18px;
		margin-top: -10px;
		color:var(--modal-header-color);
		background-color:var(--modal-header-bg);
		padding: 7px;
		margin-left: -80px;
		margin-right: 0;
		width: calc(100% + 160px);
	}

body .xmas-advent-calendar__modal__content
	{top:0!important;width:94%!important;max-width:900px!important;height:94%!important;max-height:700px!important;
	background: var(--modal-content-bg) var(--modal-content-url) no-repeat center top / contain;
	padding: 10px 80px 80px 80px;border-radius: 0;border:1px solid var(--modal-header-bg);}
	
body .xmas-advent-calendar__modal .close-button	
	{background-color: transparent;}

body .xmas-advent-calendar__modal .close-button img
	{width: 27px!important;height:27px!important;}

body .xmas-advent-calendar__modal-code
	{width: calc(100% - 160px);height: calc(100% - 80px)!important;overflow-x: hidden;overflow-y: auto;padding-top: 35px;}
	
body .xmas-advent-calendar__modal-code img.size-full
	{height: auto!important;}

body .xmas-advent-calendar__modal-header img:first-child
	{display:none;}


body .xmas-advent-calendar-title,
body .xmas-advent-calendar__modal__content h1 
	{color: var(--h1-color)!important;font-family: Arial!important;font-size: 26px!important;margin: 0 auto;}

body .xmas-advent-calendar-subtitle,
body .xmas-advent-calendar__modal__content h2
	{color:var(--h2-color)!important;text-align: left;font-size: 24px;font-weight: 400;}
	
body .xmas-advent-calendar__modal__content h3
	{font-weight: 600;font-size: 16px;}	

body .xmas-advent-calendar__modal__content p
	{font-size: 16px;}

body .xmas-advent-calendar__modal__content blockquote p
	{font-size: 18px;
			font-style: italic;
			line-height: 50px;
			font-weight: 300;
		}

body .xmas-advent-calendar__modal__content a
	{font-weight: 600;text-decoration: underline;}

body .xmas-advent-calendar__modal__content a:hover
	{text-decoration: none;}


/*** QUFORM ***/
.quform-spacer {
	padding: 0 0 5px 0;
	margin: 0 0 0 0;
}

[type=button]:not(:disabled), [type=reset]:not(:disabled), [type=submit]:not(:disabled), button:not(:disabled) {
	background: var(--button-bg);
	border-radius: 100px;
	padding: 8px 25px;
	border: 0;
	font-weight: 600;
	text-transform: uppercase;
	color:var(--button-color)!important;
}

.quform .quform-field-textarea {
	height: 150px;
}

body .quform-button-text,
body .quform-button-submit-text,
button,
body .xmas-advent-calendar-call-to-action {color:var(--button-color)!important;text-decoration: none!important;display: inline-block;}
body .xmas-advent-calendar-call-to-action
	{background-color: var(--button-bg);margin-top: 5px}

/*** SUB SITES ***/
body:not(.home) .ts-content 
	{margin-top: 21vh;background: var(--subsite-bg);padding: 30px}




/*** MOBILE ***/
.ts-rotate-phone
	{display: none;}

.ts-rotate-phone
	{background: transparent url("/wp-content/uploads/2017/10/rotate-phone.png") no-repeat center center;}

.ts-rotate-phone:after
	{content: "Bitte Smartphone drehen";position: relative;width: 100%;text-align: center;font-size: 20px;margin-top: 320px;display: block;}



/*** DAYS ***/
#xmas-advent-calendar__day-text5 {
	margin:10px;
}


#xmas-advent-calendar__day-text1:not(:hover),
#xmas-advent-calendar__day-text3:not(:hover),
#xmas-advent-calendar__day-text18:not(:hover),
#xmas-advent-calendar__day-text16:not(:hover)
	{color:var(--days-1-color)!important}

#xmas-advent-calendar__day-text5:not(:hover),
#xmas-advent-calendar__day-text6:not(:hover),
#xmas-advent-calendar__day-text7:not(:hover),
#xmas-advent-calendar__day-text10:not(:hover)
	{color:var(--days-2-color)!important}

#xmas-advent-calendar__day-text9:not(:hover),
#xmas-advent-calendar__day-text15:not(:hover),
#xmas-advent-calendar__day-text19:not(:hover),
#xmas-advent-calendar__day-text12:not(:hover),
#xmas-advent-calendar__day-text2:not(:hover),
#xmas-advent-calendar__day-text25:not(:hover)
	{color:var(--days-3-color)!important}

#xmas-advent-calendar__day-text13:not(:hover),
#xmas-advent-calendar__day-text14:not(:hover),
#xmas-advent-calendar__day-text8:not(:hover),
#xmas-advent-calendar__day-text4:not(:hover),
#xmas-advent-calendar__day-text3:not(:hover)
	{color:var(--days-4-color)!important}


body .xmas-advent-calendar__wrapper--big .xmas-advent-calendar__day-background 
	{border:1px solid transparent;}

video,iframe
	{max-width: 100%;}		

@media (max-width: 1500px) {

	#logo {
		position: relative;
		top: auto;
		left: auto;
		display: block;
		margin: 30px auto -100px;
	}	
	body .xmas-advent-calendar__wrapper--big .xmas-advent-calendar__day-wrapper
		{
		  max-height: 140px;
		  max-width: 140px;
		}	

	body .xmas-advent-calendar__wrapper--big .xmas-advent-calendar__day-text
		{font-size:36px!important;}
		
	body .xmas-advent-calendar__wrapper--big {
		max-width: 1000px;
		margin-top: 13vh!important;
		padding: 15px!important;
	}	
	
}		


@media (max-width: 768px) {
	body .xmas-advent-calendar__wrapper
		{line-height: 2;}
	
	.ts-col-11,
	.ts-col-10,
	.ts-col-9,
	.ts-col-8,
	.ts-col-7,
	.ts-col-6,
	.ts-col-5,
	.ts-col-4,
	.ts-col-3,
	.ts-col-2,
	.ts-col-1							{display: block;float:none;position: relative;padding: 5px;width: 100%;}
	
	body .xmas-advent-calendar__modal-code 
		{width: 96%;}
	body .xmas-advent-calendar__modal__content
		{padding: 3%;}
	
	
	body .xmas-advent-calendar__modal .close-button		
		{top:0;width: 4%;}
	body .xmas-advent-calendar__modal .close-button img		
		{width: 100%!important;height:auto!important;}


			
	body .xmas-advent-calendar__modal-code
		{padding-top: 0;}	
		
	body .xmas-advent-calendar__modal-header
		{margin-top: -10px;}	
	body .xmas-advent-calendar-title, body .xmas-advent-calendar__modal__content h1
		{font-size: 16px!important;line-height: 10px;margin-bottom: 16px;}	
		




		
	body:not(.home)
		{background: transparent url("");}	
		
	.ts-footer a
		{font-size: 14px;}
		
		
	body .xmas-advent-calendar__wrapper--big
		{grid-template-columns: 25% 25% 25% 25%;}
		
	body .xmas-advent-calendar__wrapper--big .xmas-advent-calendar__day-text
	{font-size: 30px!important;
		width: calc(100% - 10px)!important;
		height: calc(100% - 10px)!important;margin: 5px;}	
		
		
		
	body .xmas-advent-calendar__modal-header	
	{margin-top:0;
		padding: 7px;
		margin-left: 0px;
		margin-right: 0;
		width: calc(100%);
	}	
	
	body .xmas-advent-calendar__modal__content
		{padding: 0!important}
		
	body .xmas-advent-calendar__modal-code
		{padding: 3%}
	
	body .xmas-advent-calendar__wrapper--big .xmas-advent-calendar__day-wrapper .xmas-advent-calendar__day-background
		{transform: none!important;transition: none!important;}
		
	.ts-footer
		{position: relative}
}

@media (max-width: 580px) {
	body .xmas-advent-calendar__modal__content
		{background: #e1e0de url("/wp-content/uploads/2023/10/modal-bg.jpg") no-repeat center top / contain;}

	body .xmas-advent-calendar__modal .close-button		
		{top:0.5%;width: 7%; max-width: 32px;}

		
	body .xmas-advent-calendar-title, body .xmas-advent-calendar__modal__content h1
		{font-size: 24px!important;line-height: 34px;margin-bottom: 14px;}	
	
	body .xmas-advent-calendar__modal-code img
		{width: 100%!important;height: auto!important;}
		
}
