/* Global properties ======================================================== */
body { background: #fff; width:100%;  padding:0; margin:0;}
:root { --main-color: #cfa167; --second-color: #030f17; --third-color: #f3f0eb; --hlcolor1:#5b5c5c;  --hlcolor2:#cfa167; --txtfontcolor: #3c3831;
--navfont: 'RopaSoftPTT-Regular'; --hlfont1: 'Marbach-Light'; --hlfont2: 'Sangli-NorReg'; --txtfont: 'Halifax-Light';}

/***********************************************************************/
a {text-decoration:none; cursor:pointer; color: var(--second-color); font-weight:bold; letter-spacing:1px;}
a:hover {text-decoration:none;}
h1, h2, h3, h4, h5, h6, p {font-weight: normal;}

/******************************************************************/
.clear {clear:both; line-height:0; font-size:0; width:100%;}
.fleft {float:left;}
.fright {float:right;}
.center {text-align: center; margin: 0 auto;}
.last {margin-right:0px !important; padding-right:0px !important;}
:focus {outline: 0;}


a.back-to-top {display: none;width: 45px;height: 45px;text-indent: -9999px;position: fixed;z-index: 999;right: 10px;bottom: 20px; border: 3px white solid;
background: var(--main-color) url("../img/site/up-arrow.png") no-repeat center 43%;-webkit-border-radius: 25px;-moz-border-radius: 25px;border-radius: 25px;}

/*******************************************************************/
.cc-compliance,
.cc-message {font-family: var(--txtfont); font-size: 13px;}
a.cc-link {padding: 0 0.2em;}
.cc-compliance {font-size: 14px;}

/*********************************header*************************************/
/* HEADER */
header {height: 125px; background: var(--second-color); display: block; top: 0px; text-align: center; padding: 0; margin: 0; width:100%; box-sizing:border-box; 
box-shadow: 0px 1px 5px var(--main-color);  position: fixed; z-index: 100;}
header #stickyhead {padding-top: 0px; top:0px; position: relative; width:100%;}
header .grid.navigation {width: 1283px; display:inline-block;}
header #stickyhead .col-2 {padding-top: 5px; }
header #stickyhead .col-2.left {text-align:left;}
header #stickyhead .col-8.right {text-align:right;}
header #stickyhead .desktoplogo {padding-top: 5px;}
header #stickyhead .desktoplogo.small {display: none; padding-top: 0px; text-align:center;}
header #stickyhead .desktoplogo.small #logosmall {display: inline-block; margin: auto;}
header #stickyhead #leftinfo {display: none;font-family: var(--navfont); color: rgba(207,161,103, 0.7); letter-spacing: 1px; text-align:center; text-transform:uppercase; font-size: 12px;}
header #stickyhead #leftinfo span {color: rgba(255,255,255, 0.75);}
header #stickyhead #middleinfo {display: none; font-family: var(--navfont); color: rgba(255,255,255, 0.7); letter-spacing: 1px; text-align:center; text-transform:uppercase; font-size: 16px;}
header #stickyhead #rightinfo {display: none;font-family: var(--navfont); color: rgba(207,161,103, 0.7); font-size: 18px; line-height: 14px;letter-spacing: 2px;}
header #stickyhead #rightinfo #logoname {color: rgba(255,255,255,0.7); letter-spacing: 1px; text-transform:uppercase; font-size: 12px; line-height: 18px;}
header #stickyhead #rightinfo i {font-size: 14px; line-height: 17px;}
header .logomob {background: #fff; width: 100%; position: absolute; top: 10px; left: 20%; width: 60%; display: none;}


/* MAIN NAV */
nav {width: 100%;}
nav ul{margin: 0px auto 0 auto; display:inline-block; padding-top:6px;}
nav ul li{float:left;}
nav ul li a{color: var(--main-color); font-family: var(--navfont); font-size: 16px; line-height: 18px; letter-spacing: 1px; padding: 0px 12px; 
display:inline-block; font-weight: normal; 
text-transform:uppercase;}
nav ul li a:hover,
nav ul li.current a{color: #fff; transition: all 0.5s ease 0s;}

.marrow {display: inline-block;width: 0;height: 0;margin-left: 0px;vertical-align: middle;border-top: 4px dashed;border-top: 4px solid \9;
border-right: 4px solid transparent;border-left: 4px solid transparent;}

/*SUBMENU*/
nav ul ul {position: absolute; z-index: 200; margin-top: 0px; text-align:center; padding: 0px 0px; border-radius: 2px; display:block; background: #f9f9f9;
border: 1px solid #ccc; visibility:hidden; opacity:0; 
transition:visibility 0s linear 0.3s,opacity 0.3s linear;
-webkit-transition:visibility 0s linear 0.3s,opacity 0.3s linear;
-moz-box-shadow:1px 1px 2px #ddd;
-webkit-box-shadow:1px 1px 2px #ddd;
box-shadow:1px 1px 2px #ddd;}
nav ul ul li {float: none; display: block; }
nav ul ul li a {font-size: 12px; line-height: 24px; padding: 0px 15px;}
nav ul ul li:hover {border-radius: 0px;}

nav ul li.current ul {background: var(--second-color);}
nav ul li.current ul li.nosel a {color: #fff; font-size: 12px;}
nav ul li.current ul li.nosel a:hover {color: #ffcc00;}
nav ul li:hover ul,
nav ul li ul:hover {visibility:visible; opacity: 1; transition-delay:0s; -webkit-transition-delay:0s;}
nav ul.subnav li.current a {color: var(--second-color);}

/* STARTSCREEN COLOR NAV */
.whitenav {color: #fff;}

/* GENERIC NAV */
nav ul.genericnav {margin: 0px auto 0 auto; display:inline-block; padding-top:6px;}
nav ul.genericnav li a{ font-size: 10px; padding: 0px 2px; color: rgba(255,255,255,0.5);}
nav ul.genericnav li a:hover {color: var(--main-color);}
nav #middleinfo ul.genericnav {padding-top: 8px;} 
nav ul.genericnav li.current a {color: #efefef;}

/* see nav-toggle.css or nav-drawer.css for mobile versions */
	
/*********************************content*************************************/ 
div#content {margin-top: 0px; overflow:hidden; min-height: 200px;}
.cd-section {clear:both;}
.vcenter {min-height: 100vh; align-items: center;}

/* GENERAL STYLES AND TOOLS */
#stickyhead .col {text-align: center;} 
h1 {font-family: var(--hlfont1); color: var(--hlcolor1); text-align:left; letter-spacing:2px; font-size:calc(24px + 2vw); line-height: calc(32px + 3vw);}
h2{font-family: var(--hlfont2);  color: var(--hlcolor2); text-align:left; letter-spacing:0px; font-size: calc(12px + 1vw); line-height: 100%; padding: 2px; font-weight: normal;}
h3 {font-family: var(--txtfont); font-size: 19px; color:#63605a; text-transform:uppercase; letter-spacing:1px;}
h4 {font-family: var(--txtfont); text-align:center; color: var(--hlcolor2); letter-spacing:2px; font-size: 18px; line-height: 22px; font-weight:normal; text-transform:uppercase;}
h5 {font-family: var(--txtfont); text-align:center; color: var(--hlcolor2); letter-spacing:2px; font-size: 18px; line-height: 22px; font-weight:normal; text-transform:uppercase;}
p {font-family:var(--txtfont); color: var(--txtfontcolor) ;font-size: 17px; line-height: 26px; margin: 17px 0px; text-align:left;} 
p b {color: #696969; letter-spacing: 0.5px;}
.col {text-align:center;}


.button6{color: rgba(255,255,255,1);-webkit-transition: all 0.5s;-moz-transition: all 0.5s;-o-transition: all 0.5s;transition: all 0.5s;
border: 1px solid rgba(255,255,255,0.5);position: relative;}
.button6 a{font-family: var(--hlfont1);color:#f9f9f9;text-decoration: none; text-transform:uppercase;display: block;}
.button6 span{z-index: 2;display: block;position: absolute;width: 100%;height: 100%;}
.button6:hover a{color: #fff;}
.button6::before{content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 1;opacity: 0;	background-color: rgba(255,255,255,0.2); 
-webkit-transition: all 0.4s;-moz-transition: all 0.4s;-o-transition: all 0.4s;transition: all 0.4s;-webkit-transform: scale(0.5, 1);transform: scale(0.5, 1);border-radius: 4px;}
.button6:hover::before{opacity: 1;-webkit-transform: scale(1, 1);transform: scale(1, 1);}

/* BUTTON */
.button {border: 2px solid #f8f8f8; background:#d1a25e; color: #fff; font-family: var(--txtfont); margin: 5px auto; 
font-weight: normal; letter-spacing:0.5px;padding: 5px 10px;letter-spacing: 1px; border-radius: 7px; text-transform:uppercase;}
nav .button {width:120px; float:right; margin-top: 5px;}
.button {margin: 5px 5px; width: 220px; padding: 15px; text-align:center; display:inline-block;}
.button i.fa {line-height: 25px; float:right; font-size:22px;}

/* SMALL BUTTONS */
.button.small {width: 130px; font-size: 12px; font-weight: normal; padding: 5px 5px 5px 30px;line-height: 18px; background: #d1a25e; 
border: 2px solid #d1a25e; box-shadow: 0px 2px 8px #ccc; border-radius: 0; letter-spacing: 0.8px;}
.button.small:hover {color: #e69015;background: var(--second-color);} 
.button.small i.fa {padding: 5px; line-height: 20px; float:none; font-size:22px;}

.button.snip1434 i.fa{font-size: 20px;width: 60px;line-height: 18px;position: absolute;left: -18px;top: 0px;-webkit-transform: rotate(-0deg) scale(1);
 transform: rotate(-0deg) scale(1);-webkit-transition: all 0.3s ease;transition: all 0.3s ease;color: rgba(255,255,255,0.8);}
.button.snip1434:hover i.fa {-webkit-transform: rotate(-20deg) scale(1.3);transform: rotate(-20deg) scale(1.3); color: rgba(255,255,255,1.5);}

/* BUTTON EXTERNER LINK */
.button.extern {width: 210px; background: var(--second-color); padding: 10px 15px; font-size: 12px; line-height: 24px; text-align:center; border: 0px; border-radius: 6px; margin: 15px auto;} 
.button.extern:hover {color: #fff;}
.button.extern i.fa {padding: 0 0 0 10px;}

body.home .wrapper {padding: 15% 5% 0 10%; display:inline-block; margin:auto;}

/* SIDEBAR */
sidebar{ will-change: min-height; }
#sidebar {margin-left: 0px; z-index: 100;}
.sidebar__inner{ transform: translate(0,0); transform: translate3d(0, 0, 0); will-change: position, transform; border: 1px solid var(--main-color);
 position: absolute; left: -96px; padding: 5px 10px 10px 10px; transform: rotate(-90deg); border-radius: 0px 0px 25px 25px;
 background: linear-gradient(var(--main-color), rgba(225,187,94, 1.0)); box-shadow: 0px 0px 10px #ccc;}
.sidebar__inner p{color: #fff; text-align:center;  margin:0; padding-top:10px;} 
.sidebarExpand p {font-size: 14px; line-height: 36px; text-align:center; margin: 0; color: #efefef;}
.sidebarExpand p b.maincolor {font-size: 32px; color:#e0b350; margin-top: 5px;}
.sidebarExpand {position: absolute; left: 0px; margin-top: -68px; display: none; background: var(--second-color); padding: 10px; width: 300px; text-align:center; border: 1px solid #ccc; 
border-radius: 0px 4px 4px 0px; box-shadow: 2px 2px 8px #eee;}
.sidebarExpand .close {position: absolute; right: 10px; padding: 5px;} 
.sidebarExpand p a, 
.sidebarExpand .close a {font-family: var(--txtfont); color: var(--main-color); text-decoration:none;}

/* SECTION 0 */
body.home #section0 #t0{padding-top: 0px; background: #fff; height: 100vh; background-image:url("../img/motive/startmotiv.png"); 
position: relative;  background-position: 50% 0%; background-repeat: no-repeat; background-size: cover !important; -webkit-background-size: cover !important; 
-moz-background-size: cover !important; text-align:center;}
body.home #section0 h1 {color: #fff;}
body.home #section0 h2 {color: #fff; padding: 10px auto;text-transform:none;}
body.home #section0 .button {width: 160px; margin: 50px auto; padding: 15px;}

body.home #section0 a i {font-size:68px; color: rgba(255,255,255,0.1); text-shadow:0px 2px 10px #999; }
body.home #section0 a:hover i {color:var(--main-color);}
body.home #section0 a:hover i.blinking {animation: unset;}
.blinking{animation:blinkingText 1.8s infinite;}
@keyframes blinkingText{0%{color: var(--second-color);} 100%{ color: transparent;}}

/* SECTION 1 */
body.home #section1 {text-align: center;}
body.home #section1 .wrapper {padding: 15% 5% 0 15%;}
body.home #section1 .box {width: 40%; padding: 5% 10%; display:inline-block; margin: 15% auto auto auto; background: var(--third-color);}
body.home #section1 .box p {font-size:14px; line-height:20px; letter-spacing:1px;}
body.home #section1 .box .button {background: #d1a25e; color: #fff; font-family: var(--txtfont); font-size: 20px; letter-spacing: 1px; margin: 7px 0;text-transform:uppercase;}

/* SECTION 2 */
body.home #section2 {border-top: 1px solid #efefef;}
body.home #section2 .col-6.box-2 {background: #000; height: 100vh; background-image:url("../img/motive/kfz-gutachten.png"); position: relative;  
background-position: 0px 0px; background-repeat: no-repeat; background-size: cover !important; -webkit-background-size: cover !important; -moz-background-size: cover !important;}

/* SECTION 3 */
body.home #section3 .col-6.box-2 {background: #000; height: 100vh; background-image:url("../img/motive/leihtaxi.png"); position: relative;  
background-position: 0px 0px; background-repeat: no-repeat; background-size: cover !important; -webkit-background-size: cover !important; -moz-background-size: cover !important;}

/* SECTION 4 */
body.home #section4 .col-6.box-2 {background: #000; height: 100vh; background-image:url("../img/motive/taxiversicherung.png"); position: relative;  
background-position: 0px 0px; background-repeat: no-repeat; background-size: cover !important; -webkit-background-size: cover !important; -moz-background-size: cover !important;}

/* SECTION 5 */
body.home #section5 .col-6.box-2 {background: #000; height: 100vh; background-image:url("../img/motive/steuerberatung.png"); position: relative;  
background-position: 0px 0px; background-repeat: no-repeat; background-size: cover !important; -webkit-background-size: cover !important; -moz-background-size: cover !important;}

/* SECTION 7 */
body.home #section7 .col-6.box-2 {background: #000; height: 100vh; background-image:url("../img/motive/immobilien.png"); position: relative;  
background-position: 0px 0px; background-repeat: no-repeat; background-size: cover !important; -webkit-background-size: cover !important; -moz-background-size: cover !important;}

/* SECTION 6 (KONTAKT) */
body.home #section6 {border-top: 1px #f0f0f0 solid; background: url("../img/motive/startmotiv.png"); 
position: relative;  background-position: 50%; background-repeat: no-repeat; background-size: cover !important; -webkit-background-size: cover !important; 
-moz-background-size: cover !important; text-align:center;}
body.home #section6 h2 {padding: 30px 10px 0px 10px;color: var(--hlcolor1); }


.prowebform {padding: 80px 5% 0px 5%;}
.prowebform h3 {padding: 10px; font-size: 12px; letter-spacing: 2px;color: #efefef; background: var(--second-color); border-radius: 8px 8px 0px 0px; box-shadow: 0px 5px 10px #666;}
.prowebform div.alert{background: #fff;}
.prowebform div.error,
.prowebform div.success{background: #fff; border-radius: 8px; padding: 15px; font-family: var(--txtfont); box-shadow: 0px 5px 10px #666;}
.prowebform .form {box-shadow: 0px 5px 10px #666;}
.prowebform .formTitle label .title{font-family:var(--hlfont2); letter-spacing: 3px; text-align:center; font-weight: bold; padding-left: 68px;}
.prowebform .toggle span.faq-arrow {float: right; padding-right: 35px;}


/*********************************footer*************************************/
footer {text-align:center; font-family: var(--hlfont1);}
footer .grid {margin: 0;}
.footer p.copyright {font-family: var(--hlfont2); font-size: 9px; color: rgba(255,255,255,0.7); line-height: 12px; margin: 0px; padding: 0px; text-align:center;} 
.footer p.claim2 {font-family: var(--hlfont2); font-size: 12px; line-height: 16px; color: rgba(255,255,255,0.7); padding:5px 5px; text-align:center;}
.footer {padding: 15px 0px; background: var(--second-color);}
.footer h5 {margin:5px auto; color: rgba(255,255,255,0.7);}
.footer p {color: #fff; font-size: 10px; letter-spacing:1px; line-height: 25px; margin: 0px; color: rgba(255,255,255,0.5);}
.footer a {color: var(--main-color);}
.footer a:hover {color: var(--main-color); text-decoration:underline;}
.footer .genericLink {text-transform:uppercase;}

/********************************sub****************************************/
body.sub div#content {margin: 60px auto 40px auto;}
body.sub h1 {font-size: 36px; line-height: 56px; color: #696969;}
body.sub.tmpl2 #content h1 {font-size: 36px; line-height: 56px; color: var(--second-color);}
body.sub h2 {font-size: 28px; line-height: 28px; color: #696969; text-align:center;}
body.sub.tmpl2 #content h2 {text-transform:none;}
body.sub h3{font-family: var(--hlfont2); font-size: 16px; line-height: 16px; margin-top: 16px; color: #696969; padding: 0px 20%; text-align:center;}
body.sub h4{margin-top: 12px; padding: 0px 20%;
font-size: calc(16px + (18 - 16) * ((100vw - 300px) / (1600 - 300))); line-height: calc(20px + (24 - 20) * ((100vw - 300px) / (1600 - 300)));}
body.sub h5{font-family: var(--hlfont2); font-size: 14px;}

body.sub p{ text-align:justify; padding: 12px 20%; font-size:15px; line-height: 18px; margin: 0px;} 
body.sub footer p{text-align:center;}

body.sub div#content #impressum,
body.sub div#content #datenschutz {margin: 80px auto 40px auto;}

body.sub #datenschutz ul {font-family: var(--txtfont); color: #8e826b; text-align:left;  padding: 12px 20%; list-style-type:circle; margin-left: 25px; 
font-size: calc(10px + (14 - 10) * ((100vw - 300px) / (1600 - 300))); line-height: calc(16px + (20 - 16) * ((100vw - 300px) / (1600 - 300)));}
body.sub p.center {text-align:center;}
body.sub #impressum h3{letter-spacing: 0px; margin: 12px 0px 0px 0px; padding: 0px 20%; color: #787878;
font-size: calc(10px + (14 - 10) * ((100vw - 300px) / (1600 - 300))); line-height: calc(16px + (20 - 16) * ((100vw - 300px) / (1600 - 300)));}
body.sub #impressum p {text-align:center; padding: 0px 20% 12px 20%; line-height: 22px;}



