/*
* under construction template
* author: sabine brings
* website: http://brings-online.com/templates/
* License: GNU General Public License version 3.0
* License URI: http://www.gnu.org/licenses/gpl-3.0.html
*/

body { height:100%;  margin:0; padding:0; font-family: Tahoma, Geneva, sans-serif; font-size:80%; color:#eee; text-align:center; background:#CACACA;}
body {-webkit-background-size: 100% 100%;
    -moz-background-size: 100% 100%;
    -o-background-size: 100% 100%;
    background-size: 100% 100%;
    background-attachment: fixed;
}

#wrapper { margin:0; width:100%; height:100%; text-align:center;  padding:30px 0 0 0; position:relative; background:rgba(255,255,255,.2);  }
#page { width:100%; max-width:960px; margin:0 auto; padding:0 10px;}
#footer { margin:50px 0 0 0;  width:100%; height:20px; padding:10px 0; background:#333; color:#eee; font-size:.8em; }
#footer a { color:#eee; text-decoration:none; }


.sliderwrap {position: fixed; top: 0; left:0; z-index:-1; width:100%; height:100%; -webkit-background-size: 100% 100%;
    -moz-background-size: 100% 100%;
    -o-background-size: 100% 100%;
    background-size: 100% 100%; }
.sliderwrap img {min-width: 1600px; width:100%; height:100%; display:block; position:fixed;}


/* =========================  grid =========================  */

.col-full { max-width: 1600px; width:100%; margin-left: auto;
    margin-right: auto;}
.col-ttc { width:65.85744680851%; margin:1.5% 0;}
.col-otc { width:31.714893617021%; margin:1.5% 0;}
.col-ofc { width:23.179255319148%; margin:1.5% 0;}
.col-ohc {width:48.786170212699%; margin:0.5% 0; float: center;}
.col-ttc, .col-otc, .col-ofc, {margin-right:2.427659574468%; display: inline; float:left;}

.cr {margin-right:0 !important;}
.ct {margin-top: 0 !important;}
.mr { margin-right:25px;}

.clearfix:before,
.clearfix:after {content: " "; display: table; }
.clearfix:after {clear: both; }
.clearfix {*zoom: 1;}
.clear { clear:both;}



/* =========================  font =========================  */

h1 {font-family: 'Lato', sans-serif; font-size: 2em; color:#eee; margin:0; padding:0; line-height:1.6em; font-weight: normal;}
h2 {font-family: 'Lato', sans-serif; font-size: 1.3em;  color:#eee; margin:0; padding:0 0 5px 0; line-height:1.5em; font-weight: normal;}
h3 {font-family: 'Lato', sans-serif; font-size: 1.175em;  color:#eee; margin:0; padding:0; line-height:1.5em; font-weight: normal;}
p {font-family: 'Lato', sans-serif; font-size:1.15em; margin:10px 0; padding:0 0 10px 0; line-height:1.65em; }

.title {font-family: 'Lato', sans-serif; font-size:4em; color:#555; font-weight:bold;}
.subtitle {font-family: 'Lato', sans-serif; font-size:1.5em; color:#555; }


/* =========================  logo =========================  */

/* Wenn Sie ein Logobild einbinden, geben Sie dem #logo die maximale Breite des Bildes und kommentieren die folgenden Zeilen aus */
#logo { margin:25px auto 85px auto; height:auto; text-align:center; /* max-width:450px; */}
#logo img { width:80%; max-width: 950px; height:100%; display:block; margin-left: auto;
    margin-right: auto;}



/* ============== countdown ============== */

.wrapper-countdown { margin:20px 0 0 0;  padding:20px 0 80px 0;}
#countdown { text-align:center; margin:0; padding:0; }
.countdownHolder{font: 5em/1.5 'Lato', sans-serif; letter-spacing:-3px;}

.position {display: inline-block; height: 1.5em; overflow:hidden; position:relative; width: 1.5em;}
.digit {position:absolute;	display:block; width:1.5em; background: rgba(102,102,102,.9);	border-radius:5px;	text-align:center;	color:#fff;	letter-spacing:-1px;}
.digit.static { background: rgba(102,102,102,.9);		}

.countDiv{	display:inline-block;	width:20px;	height:1.5em;	position:relative;}
.countDiv:before, .countDiv:after{position:absolute; width:5px;	height:5px;	background-color:#60684B; border-radius:50%;	left:50%;	margin-left:-3px;	top:0.5em;		content:'';}
.countDiv:after {top:0.9em;}
#note { font-size:1em; text-align:center; margin:-15px 0 0 0; color:#333;}

/* ==============
 * Hier können die Angaben, die nicht gebraucht werden, ausgeblendet werden
 ============== */

.countDays {}
.countDiv0 {}
.countHours {}
.countDiv1 {}
.countMinutes {}
.countDiv2{ display:none !important;}
.countSeconds{ display:none !important;}



/* ============== info ============== */

.wrapper-info { background:rgba(102,102,102,.9); padding:20px; box-sizing:content-box; border-radius:3px; max-width: 600px;}
#info { margin:5%; padding: 0 20px; text-align:left;}
.wrapper-info [class^="icon-"]:before, .wrapper-info [class*=" icon-"]:before  { float:left; margin:0 10px 0 0; font-size:26px; color:#eee; max-width:}

.social-media {margin:22px 0 0 0;}
.social-media div { background:#333; opacity:.5;width:22px; height:20px; padding:8px 8px 8px 6px; margin:0 4px 0 0; text-align:center; border-radius:100%; float:left; display:inline-block;}
.social-media div:hover { opacity:1;}

#info .social-media [class^="icon-"]:before, #info .social-media [class*=" icon-"]:before  { float: none !important; margin:0; font-size:24px; line-height:24px; color:#fff; text-shadow:none !important;}



/* ============== contact ============== */
#contact-form { margin:20px 0 0 0; text-align:left; }
#contact-form label { font-size:.9em; display:block; margin:5px 0 2px 0;}
#contact-form input {width:100%; max-width:180px; border:1px solid #dedede; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; padding:5px 1px; margin:0 0 7px 0; font-family:Verdana, Arial, sans-serif; font-size:.9em;}
#contact-form textarea { width:100%; max-width:400px; border:1px solid #dedede; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px; padding:5px 1px; font-family:Verdana, Arial, sans-serif; font-size:.9em; display:block;}
#contact-form input:focus, #contact-form textarea:focus { border:1px solid #ccc;}
#contact-form button { color:#fff; cursor:pointer; margin:15px 0 0 0; border:none; font-size:1em;  padding:6px 10px; -moz-border-radius:3px; -webkit-border-radius:3px; border-radius:3px;
background: #333;}

.thanks, .error { padding:15px; }




@media screen and (max-width: 1024px)  {
.sliderwrap {position: fixed; top: 0; left:0; z-index:-1; width:auto !important; height:100%; }
.sliderwrap img {width: auto !important; height:100%; display:block; position: fixed;}

	 }


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

	.sliderwrap {position: fixed; top: 0; left:0; z-index:-1; width:auto !important; height:100%; }
.sliderwrap img {width: auto !important; height:100%; display:block; position: fixed;}

	#page { max-width:760px; margin:0 auto; padding:0 10px;}
	#info { }
	h1 {font-size: 1.8em;}
	h2 {font-size: 1.2em; }
	h3 {font-size: 1.075em;  }
	p {font-size:1em;}

	.col-ohc { width:100% !important; display:block !important; float:none !important; }
	#contact-form input {width:100%; max-width:400px !important; }
#contact-form textarea { width:100%; max-width:400px !important;}
	}


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

	body {}
	.wrapper-info {  padding:15px; }
	#page { max-width:720px; margin:0 auto; padding:0 10px;}
	#info { }
	#contact-form textarea { width:100%; max-width:350px;}


	}

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

	body {}
	.col-ohc { width:100% !important; display:block !important; float:none !important; }
	#contact-form { margin:30px 0 10px 0;  }

	#page { max-width:540px; margin:0 auto; padding:0 10px;}
	#info { }
	.position {width: 1.3em;}
	.digit {width:1.3em; }
	.countdownHolder{font: 3.5em/1.5 'Lato', sans-serif;}
	}

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



	#page { max-width:440px; margin:0 auto; padding:0 10px;}
	#info { }
	.position {width: 1.1em;}
	.digit {width:1.1em; }
	.countdownHolder{font: 3em/1.5 'Lato', sans-serif;}
	#contact-form input {width:100%; max-width:320px !important; }
#contact-form textarea { width:100%; max-width:320px !important;}
	}


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

	#page { max-width:300px; margin:0 auto; padding:0 5px !important;}
	#info { }
	.position {width: 1em;}
	.digit {width:1em; }
	.countdownHolder{font: 1em/1.5 !important 'Lato', sans-serif ;}
	#note { font-size:.9em; margin:0 0 0 0;}
	#contact-form input {width:100%; max-width:280px !important; }
#contact-form textarea { width:100%; max-width:280px !important;}
	}
