/* TENTOGEOMETRIKI, stylesheet for website, by U.Green, version 2.2, APRIL 2021  */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, figure, footer, header, hgroup, menu, nav, section, menu,
time, mark, audio, video {
	margin:0;
	padding:0;
	border:0;
	outline:0;
	font-size:100%;
	vertical-align:baseline;
	background:transparent;
	}
	 
	article, aside, figure, footer, header,
	hgroup, nav, section { display:block; }
	 
	nav ul { list-style:none; }
	 
	blockquote, q { display: block; font-style: italic; }  /*  quotes: none;  */
	 
     blockquote:before, q:before { content: open-quote; } 
	blockquote:after,  q:after { content: close-quote; }     /*  	blockquote:before, blockquote:after, q:before, q:after { content:''; content:none; }  */
	 
	a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; }
	 
	ins { background-color:#ff9; color:#000; text-decoration:none; }
	 
	mark { background-color:#ff9; color:#000; font-style:italic; font-weight:bold; }
	 
	del { text-decoration: line-through; }
	 
	abbr[title], dfn[title] { border-bottom:1px dotted #000; cursor:help; }
	 
	/* tables still need cellspacing="0" in the markup */
	table { border-collapse:collapse; border-spacing:0; }
	 
	hr { display:block; height:1px; border:0; border-top:1px solid #aaa; margin:0.85em 5%; padding:0; }
	 
	input, select { vertical-align:middle; }
	/* END RESET CSS */

/*  =================================================================  
  FONT-SIZE control: '*' according to info found in google: IE hacks, bei validation parse error  
  %-Werte bei  http://developer.yahoo.com/yui/fonts/#using ==========  */	
	
body { font:13px sans-serif; *font-size:small; *font:x-small; line-height:1.22em; }
	table { font-size:inherit; font-size:100%; }
	select, input, textarea { font:99% sans-serif; }

	
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++  */	
/* =========================  HAND CODING FROM HERE ON   ====================== */ 

/* ++++++++++++++++++++++++++        GENERAL PRESETS ++++++++++++++++++++++   */

html, body, #container {
	height:100%; /* needed for container min-height, parallax */
	font-family: 'Questrial', sans-serif;
}

.center {
	text-align: center;
}
img.shrink {
	max-width: 100%;
}
img.block {
	display: block;
}

* {
   	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

/*  ------------------ FONT-SIZE & LINKS  ------------------------- */

h2 {
	font-size: 1.465em;
	line-height: 1.465em;
	margin-bottom: 10px;
}
h2.welcome {
	font-size: 1.616em;
}
h2.big {
	font-size: 1.89em;
}
h2.replace {
	font-size: 0.86em;
	margin-bottom: 0;
}

h2.dk_bg {
	font-size: 1.616em;
	color: #f1fbb4;
	margin-top: 20px;
	margin-left: 3%;
}

h3 {
    font-size: 1.385em;
    line-height: 1.465em;
    margin-bottom: 16px;
}
h4 {
    font-size: 1.31em;
    line-height: 1.32em;
    margin-bottom: 10px;
}
p {
    font-size: 1.385em;
    line-height: 1.385em;
    margin-bottom: 6px;
}
p.small { 
	font-size: 1.231em;
	line-height: 1.32em;
	margin-bottom: 6px;
}

li.text {
	font-size: 1.385em;
}

a.textlink:link {
    text-decoration: none;
    color: #d74200;  /*#49812d;  */
}
a.textlink:hover {
    text-decoration: none;
    font-style: italic;
    color: #4e4e4e;
}
a.textlink_dkbg:link {
	text-decoration: none;
	color: #ffd471;
}
a.textlink_dkbg:hover {
    text-decoration: none;
    font-style: italic;
    color: #fff;
}

.spacer {
	height: 80px;
}

.top-bott30 {
	padding-top: 30px;
	padding-bottom: 30px;	
}

.top60bott100 {
	padding-top: 60px;
	padding-bottom: 120px;	
}

.headline {
    padding: 4px 30px;
    color: #234e0d;
}

.opac06 {
	background: rgba(197, 197, 197, 0.6);
}

.trans {
	height: 0;
	display: block;
	text-indent: -9000px;
	line-height:0;
	font-size: 0.86em;
}
.bigtrans {
	display: block;
	
}
 
.small_sub {
	width: 100%;
	background: #274816;
	padding-top:8px;
	padding-bottom: 8px;
}
h2.small_sub {
	margin-bottom: 0;
	color: #fff;
	text-indent: 9%;
}



.flagcontainer {
   position:absolute; top: 40px; right: 36px;
}
.flagcontainer a {
	display: block;
	 margin: 0; padding: 0;
}

.checkhack {
  display: none;
}
#flaglist {
  display: none;
}
#flaglisttoggle:checked + #flaglist {
  display: block;
}
ul#flaglist {
    list-style: none;
}

#js {
	padding-top: 20px;
	padding-bottom: 20px;
	background: yellow;
	color: red;
	font-weight: bold; font-style: italic;
	text-align: center;
}

/* +++++++++++++++++++++++  PAGES GENERAL +++++++++++++++++++++++++ */

body {
	background: #8cac9a;  /*#787878;  */
}

#container {
    width: 89.153%; /* 1200px bei 1346 screen-size */
    max-width: 1200px;
    margin-right:auto;
    margin-left: auto;
    
/*    border-right: 3px solid #a3a3a3; 
	border-left: 3px solid #a3a3a3;	*/
}

header {
    width: 100%;
/* border-right: 3px solid #a3a3a3;
	border-left: 3px solid #a3a3a3; */
}
header img {
    max-width: 1200px;
}



/* ------------------------  NAVIGATION  -------------- */

.round-lftop {
	border-radius: 6px 0 0 0;
}
.round-lftbtm {
	border-radius: 0 0 0 6px;
}

nav.rightnav, nav.rightnav_down {
	float:right;
	height: 44px;
	padding-top: 2px;
	padding-left: 12px;
	width: 40%;
	margin-left: 60%;
	background: #fff;
	
	-moz-box-shadow:    inset 0 0 12px #999;
		-webkit-box-shadow: inset 0 0 12px #999;
		box-shadow:         inset 0 0 12px #999;
}

.buttonframe {
	height: 40px;
	background: url(../pic/button140.png) 0 0 no-repeat;	
	
}

/* -------------  BACKGROUNDS PARALLAX >600 ----------------------  */

.content1 {
    
	background-image: url(../pic/pav1.jpg);
	height: 70%;  
	background-attachment: fixed;
	background-position: 50% 6%;
	background-repeat: no-repeat;
	background-size: cover; 

/*    border-right: 3px solid #a3a3a3;
    border-left: 3px solid #a3a3a3;		*/
}

.content2 {
	background-image: url(../pic/pav1.jpg);
	height: 50%;    
	background-attachment: fixed;
	background-position: 50% 30%;
	background-repeat: no-repeat;
	background-size: cover;
	/*max-width: 1200px;    */
/*	border-right: 3px solid #a3a3a3;
	border-left: 3px solid #a3a3a3; 	*/
}

.content3 {
	background-image: url(../pic/pav1.jpg);
	height: 44px;    
	background-attachment: fixed;
	background-position: 50% 30%;
	background-repeat: no-repeat;
	background-size: cover;
	max-width: 1200px;   

/*	border-left: 3px solid #a3a3a3;	*/
}  

/* ------------- TEXTBOXES --------------------  */


.textbox, .textbox365, .textbox492, .textbox-grid {	
	background: #fff; /* For browsers that do not support gradients */
	background:-webkit-linear-gradient(180deg, rgb(255, 255, 255) 0%, rgb(255, 255, 255) 75%, rgb(184,198,207) 100%);
	background:-o-linear-gradient(180deg, rgb(255, 255, 255) 0%, rgb(255, 255, 255) 75%, rgb(184,198,207) 100%);
	background:-moz-linear-gradient(180deg, rgb(255, 255, 255) 0%, rgb(255, 255, 255) 75%, rgb(184,198,207) 100%);
	background:linear-gradient(180deg, rgb(255, 255, 255) 0%, rgb(255, 255, 255) 75%, rgb(184,198,207) 100%);
	-moz-box-shadow:    inset 0 0 18px #647179;
	-webkit-box-shadow: inset 0 0 18px #647179;
	box-shadow:         inset 0 0 18px #647179;
}

.textbox {	
	padding: 40px 70px 70px 70px;
/*	border-right: 3px solid #a3a3a3;
	border-left: 3px solid #a3a3a3;	*/
}
.textbox h2, .textbox365 h2, .textbox492, .textbox-grid h2 {
	color: #234e0d;
}
.textbox365, .textbox492, .textbox-grid {
	padding: 30px 40px 30px 40px;
	border: 2px solid #a3a3a3;
	text-align: justify;
}

ul.des-list {
	list-style:none; 
	margin-top: 8px;
	margin-bottom: 8px;
}
.des-list li {
	line-height: 1.67em;
	text-align: left;
}
span.list-style {
	font-size: 1.465em;
	font-weight: bold;
}

footer {
/*	border-right: 3px solid #a3a3a3;
	border-left: 3px solid #a3a3a3;	*/
	color: #fff;
	padding-top: 14px;
	padding-bottom: 10px;
	text-align: center;
	background: #787878; /* For browsers that do not support gradients */
/*	background:-webkit-linear-gradient(180deg, rgb(65, 76, 78) 0%, rgb(65, 76, 78) 50%, rgb(255, 255, 219) 100%);
	background:-o-linear-gradient(180deg, rgb(65, 76, 78) 0%, rgb(65, 76, 78) 50%, rgb(255, 255, 219) 100%);
	background:-moz-linear-gradient(180deg, rgb(65, 76, 78) 0%, rgb(65, 76, 78) 50%, rgb(255, 255, 219) 100%);
	background:linear-gradient(180deg, rgb(65, 76, 78) 0%, rgb(65, 76, 78) 50%, rgb(255, 255, 219) 100%);	*/
}

.support {	
	text-align: left;
	padding-bottom:20px;
}
.support h4 {
	color: #ffffdb;
}

.partnerlinks {
	padding-left: 50px;
}
.partnerlinks a {
	display: inline-block;
}



.update {
	padding-top: 40px;
}


footer p {
	
        font-size: 1.16em;
}
span.second {
	padding-left: 10px;
}
span.big {
	font-size: 1.31em;
}
span.nobr {
	display: inline-block;
}

/* ++++++++++++++++++++++++++  SUBPAGES  GENERAL +++++++++++++++++++++++++++++++++++++++++  */

.subcontent1 {
	overflow: auto;
	background: url(../pic/tent2.jpg) center no-repeat;
	background-size: cover; 

}

.subcontent2 {
	overflow: auto;
	background: url(../pic/red-pergola.jpg) center no-repeat;
	background-size: cover; 
}

.subcontent3 {
	overflow: auto;
	background: url(../pic/green-blinds.jpg) center no-repeat;
	background-size: cover; 
}

.subcontent4 {
	overflow: auto;
	background: url(../pic/yellow-shades.jpg) center no-repeat;
	background-size: cover; 
}

.subcontent5 {
	overflow: auto;
	background: url(../pic/umbrella.jpg) center no-repeat;
	background-size: cover; 
}

.subcontent_sans {
	overflow: auto;
}

.subcontent_fff {
	overflow: auto;
	background: #fff;
}

.bg-umbr-green {
    background: url(../umbrellas/pic/green.png) 90% 50%  no-repeat;
}

.picshow  {
	overflow: hidden;
	background: rgba(9, 21, 17, 0.7);
}

.gallcontainer, .gallcontainer_grid {	
	margin-right: auto;
	margin-left: auto;	
}
h2.bottom16 {
	margin-bottom: 36px;
}



/* +++++++++++ FLIP SHOW UMBRELLAS +++++++++++++++++++ */



/* entire container, keeps perspective */
.flip-container {
	perspective: 1000px;

}
	/* flip the pane when hovered */
	.flip-container:hover .flipper, .flip-container.hover .flipper {
		transform: rotateY(180deg);
	}

.flip-container, .front, .back {
/* width: 320px;  */
	height: 420px;
}

/* flip speed goes here */
.flipper {
    transition: 0.6s;
    transform-style: preserve-3d;

    position: relative; 		/* left: 50%; transform: translateX(-50%);  */
	  
}

/* hide back of pane during swap */
.front, .back {
    backface-visibility: hidden;
    position: absolute;
    top: 0;
    width: 100%;
    text-align: center;
    padding-top: 10px;
	
}

.front img, .back img {
    width:400px;
    height: 400px;

}

/* front pane, placed above back */
.front {
      -moz-box-shadow:    inset 0 0 12px #9c9c9c;
	-webkit-box-shadow: inset 0 0 12px #9c9c9c;
	box-shadow:         inset 0 0 12px #9c9c9c;
	 border-radius: 25px;
	z-index: 2;
	/* for firefox 31 */
	transform: rotateY(0deg);
}

/* back, initially hidden pane */
.back, .back-des {
    transform: rotateY(180deg);
    -moz-box-shadow:    inset 0 0 12px #9c9c9c;
    -webkit-box-shadow: inset 0 0 12px #9c9c9c;	
    box-shadow:         inset 0 0 12px #9c9c9c;
    border-radius: 25px;
}

.back-des {
    padding: 20px 30px;
}


	

/*  ++++++++++++++++  GRID PARTS +++++++++++++++++++++++++++++++++++  */

.grid-container8 {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
	grid-template-rows: auto ;	
}

.left3_8 {
	grid-row: 1; 
	grid-column: 1/4; 
}	
.middle3_8 {
	grid-row: 1; 
	grid-column: 4/7; 
}
.right8 {
	grid-row: 1; 
	grid-column: 8/9; 
}

.grid-container6 {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
	grid-template-rows: auto ;
	grid-gap: 10px; 
/*	margin-bottom: 12px;  */
	background: transparent !important;
}
.left-3_6 {
	grid-row: 1; 
	grid-column: 1/4; 
	padding-left: 10px;
}
.right-3_6 {
	grid-row: 1; 
	grid-column: 4/7; 
}

/* ++++++++++++++ CONTACT  ++++++++++++ */




.telephone h4 {	
	font-size: 1.231em;
	line-height: 1.31em;
	color: #363636;
}

td.angaben {
	width: 30%;
	padding-left: 5px;
	color: #3a3a3a;
	text-align:left;
	vertical-align: top;
}

span.asteraki {
	color: red;
	font-size: 1.08em
}
td.leftform {
	text-align:left;
	padding-bottom: 5px;
	vertical-align: middle;
}
td.submit {
	text-align: right;
	vertical-align: bottom;
	}

td.message {
	height: 100px;
}
td.message textarea {
	height: 100px;
	overflow-y: scroll;
	resize: none;
}

.cont-support {
	height: 200px;
	overflow-y: scroll;
}

span.animal-rescue {
	font-size: 1.08em;
	color: #2a3573;
}

.picright {
	float: right;
	margin-left: 16px;
}

/* ++++++++++++++ MAIL_EN.PHP ++++++++++++ */

.sentbox {
	width: 60%;
	margin: 80px auto 80px auto;
	padding: 50px 20px 50px 20px;		
	border: 2px solid #888;
	text-align:center;
}

.sentbox h4 {
	font-size: 1.385em;
	color: green;
}