/*
Theme Name: Prosenium Main Theme
Author: ITCONET Systemhaus GmbH & Co. KG
Author URI: https://www.itconet.de
Description: Prosenium Main Theme	
Version: 0.1
License: All rights reserved. Copying, changing, sharing, etc. without permission by author permitted
License URI: 
Tags: 
Text Domain: Prosenium Main Theme
FARBEN:
	ROT				#970101
	LACHS			#fabe9a
	SAND			#fef5e5
	TEXT			#494949
*/

:root {
	--rot: 		#970101;
	--lachs: 	#fabe9a;
	--sand: 	#fef5e5;
	--text: 	#494949;
}
* { box-sizing: border-box; }
body, html { color: var(--text); background: var(--sand); font-family: Arial; color: var(--text); position: relative; min-height: 100%;}
html { height: 100%; box-sizing: border-box; }
body{ margin: 0; padding: 0; }
a { color: var(--rot); text-decoration: none; }
h1, h2 {  font-family: 'Playball', cursive; color: #970101; font-size: 2.5em; font-weight: normal; width: 100%; line-height: 120%;  }
h2 b { font-size: 20px; }

img.alignleft { float: left; margin-right: 10px; }
img.alignright { float: right; margin-left: 10px; }
.wp-caption-text { font-size: 10px; line-height: 12px; }

blockquote { width: 95%; margin: 0 auto; background: #fff; border: 1px solid var(--rot); padding: 5px; font-style: italic; }

.flexed { display: flex !important; justify-content: flex-start; flex-flow: row wrap; align-items: flex-start; }

.flex16 { width: 15%; }
.flex26 { width: 30%; }
.flex36 { width: 48%; }
.flex46 { width: 60%; }
.flex56 { width: 80%; }

.c_wrap { padding-bottom: 60px;  }
.wrap { width: 100%; margin: 0 auto; margin-bottom: 40px; min-width: 320px; max-width: 1920px; }

header { height: 130px; background: var(--lachs); border-bottom: 28px solid var(--rot); margin-bottom: 40px;  }
.logo { position: relative; top: 10px; left: 40px; z-index: 200; box-shadow: 2px 2px 5px rgba(0,0,0,0.7); width: 150px; height: 150px; border-radius: 50%; background-position: 50% 50%; background-repeat: no-repeat; background-size: contain; }
.menu-slider-container { }
.slider { width: 1260px; height: 440px; }
.slider img { }
.flex-control-nav { position: absolute; bottom: 20px !important;  }


.menu-main-container { width: 90%; float: right; }
.menu-main-container ul { margin: 0; padding: 0; }
.menu-main-container li { display: block; width: 100%; margin: 0; padding: 0; }
.menu-main-container li a { display: block; width: 100%; background-color: var(--rot); color: #ffffff; margin-bottom: 20px; line-height: 60px; border-radius: 40px; padding: 0px; padding-left: 20px; font-family: 'Playball', cursiv; font-size: 2em;}
.menu-main-container li a:hover { background-color: var(--lachs); color: var(--rot); }
.menu-main-container li a i { position: relative; left: -21px; top: 1px; border: 2px solid var(--sand); border-radius: 50%; line-height: 60px !important; width: 60px !important; font-size: 1.10em !important; }
.current_page_item a  { background-color: var(--lachs) !important; color: var(--rot) !important; }

.mobilemenu { display: none; background-color: var(--sand); color: var(--rot); width: 100%; position: absolute; left: 0; top: 170px; z-index: 9999; padding: 3%;font-family: 'Playball', cursiv; font-size: 40px; box-shadow: 0px 20px 20px rgba(0,0,0,0.3) }
.mobile ul { padding: 0; margin: 0; border: 1px solid var(--rot); }
.mobile ul li { list-style: none; padding: 10px; margin: 0; line-height: 40px; border-bottom: 1px dotted var(--rot); text-align: center; }
.mobile ul li:last-child { border: none} 
.mobile .dashicons { display: none !important; }


.mobilemenutrigger {  display: none; position: absolute; top: 28px; right: 28px; font-size: 30px; background-color: var(--rot); color: #fff; width: 50px; line-height: 50px; padding: 10px; text-align: center; cursor: pointer; box-shadow: 0px 0px 4px rgba(0,0,0,0.3); border-radius: 4px;}
.mobilemenutrigger:hover {  box-shadow: 0px 0px 3px rgba(0,0,0,0.4); }

.content { line-height: 140%; padding-bottom: 200px; padding-left: 40px; font-size: 16px; letter-spacing: 1px; max-width: 1260px; margin: 0 auto; position: relative; top: 30px;   }
.tableInContent td { vertical-align: top; }
.tableInContent td:first-child { padding-right: 10px; }

footer { position: fixed; bottom: 0px; z-index: 9999;  background: var(--rot); width: 100%; color: #fff; line-height: 25px; padding: 20px 40px 10px 40px; font-size: 115%;   }
footer a { color: #fff; }
footer .copyright { float: left; width: 80.0%; }

footer .social { float: right; width: 25.0%; text-align: right;}
footer .social .fab { font-size: 26px; letter-spacing: 10px; }


footer .current_page_item a { background: var(--rot) !important; color: #fff !important; }


.wp-caption-text { display: block; text-align: left; }


#swipebox-overlay { background: rgba(255,255,255,0.8) !important; }
#swipebox-bottom-bar, #swipebox-top-bar { background: var(--rot) !important; }
#swipebox-close { background: var(--rot);} 


/* KONTAKTFORMULARE */
fieldset { border: none; margin: 0; padding: 0; }
.vfb-legend h3 { color: var(--rot); }
ul.vfb-section li { }
ul.vfb-section li label {  }
ul.vfb-section li input, ul.vfb-section li textarea  { width: 100%; border: 2px solid var(--rot); border-radius: 5px; background: #fff;; line-height: 30px; font-size: 24px; padding-left: 10px;  }
ul.vfb-section li textarea { min-height: 200px; }

.vfb-item-checkbox { border: 2px solid var(--rot); border-radius: 5px; margin-top: 20px; box-sizing: border-box; padding: 10px; }
.vfb-item-checkbox .vfb-span input { float: left; width: 20px;  }
.vfb-item-checkbox .vfb-span label	{width: 80%; float: left; }
.vfb-item-checkbox .vfb-span:after { content: ''; display: block; clear: both; }

label.vfb-error { display: block; background: var(--rot); color: #fff; position: relative; left: 5%; top: 0px; font-size: 14px; line-height: 20px; padding: 10px; width: 90%;  }
#form_success { color: var(--red); }
.vfb-item-submit { width: 200px;  background-color: var(--rot); color: #fff; border-radius: 5px; }
.vfb-item-submit input { width: 200px !important; background-color: var(--rot) !important; color: #fff; font-size: 14px !important;  }


.wpcf7 {}
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="date"],
.wpcf7 textarea,
.wpcf-3-checkbox,
.wpcf7 select,
.wpcf7-checkbox .wpcf7-list-item
{
    width: 100%; border: 2px solid var(--rot); border-radius: 5px; background: #fff; line-height: 30px; padding-left: 10px;
}

.wpcf7-checkbox .wpcf7-list-item { position: relative; left: -16px; margin-bottom: 4px;  }
input[type=checkbox] { transform:scale(1.8); position: relative; top: 1px; }
.wpcf7-submit { background: var(--rot); color: #fff; border-radius: 5px; line-height:18px; padding: 5px; font-weight: bold;   }


@media (max-width: 1820px) {
    .slider { width: 1140px; height: 488px; }
    .menu-main-container { width: 80%; }
}

@media (max-width: 1680px) {
    .slider { width: 920px; height: 394px; }
    .menu-main-container { width: 80%; }
    .content { position: relative; top: -20px; }
	footer { line-height: 100%; }
}

@media (max-width: 1440px) {
    .slider { width: 700px; height: 300px; }
    .menu-main-container { display: none; }
	.flexed .flex46,.flexed .flex26  { width: 100% !important; }
	.mobilemenutrigger { display: block;  }
	footer { font-size: 13px; line-height: 18px; padding: 10px 10px; }
	.content { position: relative; top: 200px; }

}

@media (max-width: 1200px) {
    .content { position: relative; top: 100px; }
	.logo { width: 100px; height: 100px; }
}
@media (max-width: 960px) {
    .content { position: relative; top: 60px; }
}
@media (max-width: 800px) {
    .content { position: relative; top: 10px; }
}
@media (max-width: 500px) {
    .content { position: relative; top: -20px; }
}
@media (max-width: 320px) {
    .content { position: relative; top: -20px; }
}


@media (orientation: portrait) {
    .slider { height: 240px; }
	h1, h2 { text-align: center; }
	.content { padding: 20px; padding-top: 0px;  margin-bottom: 20px }
	
	img.alignleft,img.alignright { float: none; margin: 0; display: block; margin: 0 auto; margin-bottom: 10px; }
	.tableInContent td { display: table-row;  }
}