html { height: 100% }
body 						{ color: #000; font-family: 'Raleway', sans-serif; font-size: 14px; min-height: 100%; height: 100% }
body.HomePage 				{ min-height: 100vh;}

a 							{ color: #000; text-decoration: none; }
a:hover, a:active			{ color: #000; text-decoration: underline; }
	
h1,h2    				   { font-family: 'Playfair Display' !important; font-weight: bold; padding-bottom: 4px; display: inline-block; color: #000; }
h1 			    			{ font-size: 4.9rem; color: #000;   line-height: 1; font-weight: 400; padding-left: 0px; margin-left: 0px; padding-bottom: 22px;}
h2          				{ font-weight: 400; font-size: 1.15rem; line-height: 1.4;  }
h3          				{ font-family: 'Playfair Display' !important; font-size: 3rem; font-weight: 400; letter-spacing: 0 }
h4          				{ font-family: 'Playfair Display', sans-serif; font-weight: 400; padding-bottom: 4px; display: inline-block; font-size: 1.15rem; }

img        					{ max-width: 100%; }

p     	    				{ font-family: 'Raleway', sans-serif; font-weight: 400; line-height: 1.6; font-size: 0.95rem; color: #000; margin-bottom: 1.5rem; font-weight: 500; }
p strong    				{ font-weight: 700; font-size: 1em; }
li          				{ font-family: 'Raleway', sans-serif; font-weight: 300; line-height: 1.6; font-size: 0.95rem; color: #000;}
.underlined                 { text-decoration: underline; }
.blackbg                    { background-color: #000; }
.white                      { color: #fff; }
.nounder:hover              { text-decoration: none }
.uppercase                  { text-transform: uppercase; }
.borderbottom               { border-bottom: 1px solid #000; }
.borderleftright            { border-left: 1px solid #000; border-right: 1px solid #000; }

.Page p { font-weight: 400; }

.ml-200 { margin-left: 200px; }
.ml-100 { margin-left: 100px; }

h2.smalltitle               { display: flex; flex-direction: row; font-size: 0.78em; letter-spacing: 4.2px; color: #000; font-weight: 500; font-family: 'Raleway' !important; font-style: normal }
h2.smalltitle:before, 
h2.smalltitle:after         { content: ""; flex: 1 1; border-bottom: 1px solid; margin: auto; }
h2.smalltitle:before        { margin-right: 20px }
h2.smalltitle:after         { margin-left: 15px }

span.faketitle              { display: flex; flex-direction: row; font-size: 0.7em; letter-spacing: 2px; color: #000; font-weight: 500; font-family: 'Raleway' !important; }
span.faketitle:before, 
span.faketitle:after        { content: ""; flex: 1 1; border-bottom: 1px solid; margin: auto; }

.headerlink                 { letter-spacing: 2px; font-size: 1.2em; color: #000; font-weight: 500; font-family: 'Raleway' !important; line-height: 4; display: inline-block; position: relative; text-decoration: none !important; }
/*
.headerlink:active .linkinside,
.headerlink:hover .linkinside { display: block; position: absolute; left:  0px; right: 0px; bottom: 23px; height:  8px; background-color:  #bed2e6; z-index:  -1}
*/
.blueunderline.active .linkinside,
.blueunderline:hover .linkinside { display: block; position: absolute; left:  0px; right: 0px; bottom: 23px; height:  8px; background-color:  #bed2e6; z-index:  -1}

.headertitle                { min-height: 64px; line-height:  64px; font-family: 'Playfair Display' !important; letter-spacing: 0.1rem !important; font-weight: 400; font-style:  normal; font-size: 2.2rem; padding-bottom: 0px; margin-bottom: 0px; color: #000 }

/* Header */
header                      { position: relative; z-index: 999999;}

.homelink img               { max-width: 180px }
nav ul 						{ list-style-type: none; padding-left: 0px; padding-top: 65px;}
nav ul li 					{ float: left; padding-right: 25px; padding-left: 25px;}
nav ul li.HomePage          { padding-left: 0px !important; }
nav ul li a 				{ color: #000; font-weight: 300; font-family: 'Raleway';}
nav ul li a:hover 			{ color: #333; text-decoration: underline;}
nav ul li.current > a,
nav ul li.section > a       { color: #333; font-weight: bold;}

.mobile-link                { display: none;}

.allButFooter               { min-height: calc(100vh - 70px); text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.HomePagewith .allButFooter     { min-height: calc(100vh - 170px); overflow: hidden }
.HomePage header            { background-color: #fff }


/* Footer */
.footer                     { background-color: #bed2e6; color: #fff; font-family: 'Raleway'; height: 70px;}
.footer p                   {  font-family: 'Raleway'; color: #fff; }
.footer a                   { color: #fff; }
.footermenu li              {  display: inline-block; }
.footermenu li a            {  padding-left: 20px; font-family: 'Raleway'; color: #fff; }

.homecontent                { padding-bottom: 0px }

/* Body */
.bigger                     { font-size: 1.4rem; }
.relativer                  { position: relative; }
.borderleft                 { position: absolute; height: 70px; width: 1px; background-color: #000; left: 0px }
.borderright                { position: absolute; height: 70px; width: 1px; background-color: #000; right: 0px }

/* home */
.fullwidth                  { width: 100%; }
.lblheadline                { font-family: 'Playfair Display'; font-weight: 400; font-size: 2rem; padding-bottom: 0px; margin-bottom: 15px; }
#fldTitel                   { border-radius: 0px; border: none; border-bottom: 2px solid #000; padding: 12px 25px; padding-left: 15px; font-size:  1.55em; font-weight:  400; color:  #000}

.btn-primary                { background-color: #fff; color: #000; border: 1px solid #000; text-transform: uppercase; border-radius: 0px; padding: 5px 15px; font-size: 0.9em;}
.btn-primary:hover          { background-color: #000; color: #fff; }
.border-left                { border-left: 1px solid #000 !important; }
.border-bottom              { border-bottom: 1px solid #000 !important; }

.smallblue                  { color: #5d8fc1; font-family: 'Playfair Display'; font-style: italic; font-size: 1.15em; text-decoration: underline; letter-spacing: none !important;}

.factstitle                 { float:  left;display:  block; width:  100%; clear:both; letter-spacing: 1px; font-size: 0.9em; color: #000; font-weight: 500; font-family: 'Raleway'; line-height: 1.4; text-transform: uppercase; }
.factsbg                    { background-color: #bed2e6 }
.bigvalue                   { float:left; display: block; width:  100%; padding-bottom: 30px; line-height:40px; clear:both;  color: #fff; font-size: 3rem; font-family: 'Playfair Display'; font-weight: 500; }

table td                    { font-size: 1.15em; letter-spacing: 0.1em; }

.datum                      { font-family: 'Playfair Display'; font-size: 1.1rem; padding-bottom: 10px; display: block; letter-spacing: 0; }

.showshare                  { position: relative; z-index: 9; cursor: pointer; }
.showshare:hover .sharebox  { display: block; }
.sharebox                   { display: none;  position: absolute; border: 1px solid #000; top: -6px; right: -162px; height: 40px; width: 190px;  }
.sbinside                   { margin-top: 5px; padding-right: 13px; background-color: #fff; margin-left: 35px; padding-bottom: 5px }

.custompager                { text-align:  center; position: absolute; left: 0px; right: 0px; bottom: 30px; z-index: 999 }
.custompager span           { cursor: pointer; font-size:  29px; display: inline-block; width: 30px; height: 30px;border: 1px solid transparent; border-radius: 15px; line-height: 26px;  }
.custompager span.cycle-pager-active { border: 1px solid #000 }
.inside50                   { padding: 10px 50px 10px 70px }
.projectheadline            { text-align: right; padding-bottom: 30px }
.quote                      { padding: 80px 50px }
.quote p                    { text-align:  center;font-family: 'Playfair Display'; font-weight: 600; color: #bed2e6; font-size: 2rem; line-height: 1.4  }

.projects                   { list-style-type: none; display: block; margin: 0 auto }
.projects li                { width: 30px; height: 30px; display: inline-block; border: 1px solid #fff; border-radius: 15px; line-height: 26px;  }
.projects li.active         { border: 1px solid #000 }
.projectlink                { text-transform: uppercase; }

.pricetable {  }
.pricetable td { border-bottom: 1px solid #000 }


#MemberLoginForm_LoginForm .middleColumn { display: inline-block;  }
#MemberLoginForm_LoginForm label { padding-right: 20px; text-align: left; min-width: 140px; letter-spacing: 0.1em; text-transform: uppercase; font-family: 'Raleway'; font-size: 16px }
#MemberLoginForm_LoginForm_Email_Holder { padding-bottom: 25px }
#MemberLoginForm_LoginForm_Email_Holder input { border-width:  1px; min-width: 360px; height:  60px; border-radius: 0px; padding: 15px 25px; font-family: 'Playfair Display'; font-size: 18px }
#MemberLoginForm_LoginForm_Remember_Holder { padding-left: 51px; padding-top: 50px }
#MemberLoginForm_LoginForm_Remember_Holder input { margin-right: 25px }
#MemberLoginForm_LoginForm_Password_Holder input { border-width:  1px; min-width: 360px; height:  60px; border-radius: 0px; padding: 15px 25px; font-family: 'Playfair Display'; font-size: 18px }
#ForgotPassword { display: none; }
#MemberLoginForm_LoginForm_action_doLogin { margin:  0 auto; margin-top:  60px; line-height:  30px; font-weight:600; height:  60px; letter-spacing: 0.09em;  cursor: pointer; font-size: 16px; background-color: #fff; border: 1px solid #000; border-radius: 0px; padding: 15px 40px; text-transform: uppercase; font-family: 'Raleway'; }
#MemberLoginForm_LoginForm_action_doLogin:hover          { background-color: #000; color: #fff; }

input:focus{
    outline: none;
}
.login-form__header h1 { padding-top: 40px; padding-bottom: 60px;  }
.cycle-slideshow img { width: 100% !important }

.GeneratorPage td a:hover img { opacity: 0.6 }
.greylink { color: #aaa !important }

input[type=checkbox] {
    -moz-appearance:none;
    -webkit-appearance:none;
    -o-appearance:none;
    outline: none;
    content: none; 
    border:  none; 
}

input[type=checkbox]:before {
    font-family: "Font Awesome 5 Pro";
    content: "\f00c";
    font-size: 15px;
    line-height: 17px;
    color: transparent !important;
    background: #fff;
    display: block;
    width: 20px;
    height: 20px;
    border: 1px solid black;
    margin-right: 0px;
    padding-left:  3px;
    text-decoration-thickness: 7px;
    font-weight:  300;
}

input[type=checkbox]:checked:before {
    color: black !important;
}

#newset label { margin-top: 1rem }
#newset .labels label { margin-top: 1rem; font-size: 16px;  letter-spacing: 0.1em; margin-bottom: 2rem }
#newset label.error { display: block; position: absolute; width: 430px; margin-left: 1px }

.erstellen { padding: 15px 40px; font-weight: 600; font-size: 16px; margin-top: 60px; letter-spacing: 0.09em; margin-bottom: 60px  }
h2.bluetitle { font-weight: 500; font-size: 3.1rem; letter-spacing: 0.05em; font-style: italic; color: #bed2e6; }
.backlink { margin:  0 auto; width:  360px; cursor:  pointer; display:  block; text-align:  center; padding: 15px 40px; font-weight: 600; font-size: 16px; margin-top: 80px; letter-spacing: 0.09em; border: 1px solid #000 }
.backlink:hover { text-decoration: none; }

.pb-80 { padding-bottom: 140px }

.pcolumn label.error { position: absolute; top: -40px; margin-left: -20px; font-weight: bold }
.inhalts label.error { position: absolute; top: -40px; margin-left: -20px; font-weight: bold }

.unsichtbar h3, .unsichtbar .datum, .unsichtbar td { color: #aaa;  }
.unsichtbar img { opacity: 0.5 }

.mobile { display: none; }
.ipadonly { display: none; }

#MemberLoginForm_LoginForm_action_doLogin, 
.erstellen { margin-bottom: 60px }

.calfix .datepicker table tr td.day div { min-height: 30px !important; line-height: 30px !important; }


@media screen and ( min-width:  1200px) {
    .container { max-width: 95%; }
}


@media screen and (min-width: 1640px) {
    .container { max-width: 1600px }   
    .ml-100 { margin-left: 100px !important; }
}

@media screen and (max-width: 1440px) {
    h1 { font-size: 4.6rem }
}

@media screen and (max-width:  1110px) {
    .sep { display: none !important; }
    .sharebox { right: -15px }
    .sbinside { margin-right: 35px; margin-left:  1px; background-color: #fff; margin-top: 4px; padding-bottom: 6px }
}


@media screen and (min-width: 768px) and (max-width:  1024px) and (orientation: landscape) {
   
    .projectheadline h1 { font-size: 3.5rem }

    .inside50 { padding: 10px 20px 10px 20px }

    .ml-100 { margin-left: 50px !important }
    .ml-50 { margin-left: 50px !important }
    h1 { font-size: 4rem;  padding-bottom: 1px }
    h2.headertitle { font-size: 1.9rem }
    h2.smalltitle { margin-bottom: 0px }
    h3 { font-size: 3rem }
    .pb-80 { padding-bottom: 70px }
    #newset .labels label { padding-left: 12px !important }
    .border-left.labels { border-left: none !important }
    .lbltrenner { height: 340px;  width: 1px; display: block; position: absolute; left:  -45px; background-color: #000 }
    .headerlink { font-size: 1.1em }
    .blueunderline.active .linkinside, .blueunderline:hover .linkinside { bottom: 20px }

    .ipadmiddler { margin-top: 12px !important; }
   
}


@media screen and (min-width: 810px) and (max-width: 1080px) and (orientation: landscape) { 
     .projectheadline h1 { font-size: 3.5rem }

    .inside50 { padding: 10px 20px 10px 20px }

    .ml-100 { margin-left: 50px !important }
    .ml-50 { margin-left: 50px !important }
    h1 { font-size: 4rem;  padding-bottom: 1px }
    h2.headertitle { font-size: 1.9rem }
    h2.smalltitle { margin-bottom: 0px }
    h3 { font-size: 3rem }
    .GeneratorPage h3 { font-size: 1.7rem }
    .pb-80 { padding-bottom: 70px }
    #newset .labels label { padding-left: 12px !important }
    .border-left.labels { border-left: none !important }
    .lbltrenner { height: 340px;  width: 1px; display: block; position: absolute; left:  -45px; background-color: #000 }
    .headerlink { font-size: 1.1em }
    .blueunderline.active .linkinside, .blueunderline:hover .linkinside { bottom: 20px }

    .ipadmiddler { margin-top: 12px !important;   }
    .ipadmiddler h2 {  }
}



@media screen and (min-width: 768px) and (max-width:  1024px) and (orientation:  portrait) {
    .headertitle { line-height: 37px; min-height:  44px}
    .headerlink { line-height: 18px; padding-top: 13px }
    .blueunderline .linkinside { bottom: 2px }
    .blueunderline.active .linkinside, .blueunderline:hover .linkinside { bottom: -2px !important }
    .md-clear { clear: left; display: block }
    .md-none { display: none; }

    .inside50 { padding: 10px 20px 10px 20px }

    .projectheadline h1 { font-size: 2.5rem }
    .quote p { font-size: 1.5rem }

    .ml-100 { margin-left: 0px !important }
    .ml-50 { margin-left: 0px !important }
    h1 { font-size: 3rem;  padding-bottom: 1px }
    h3 { font-size: 1.8rem }
    .hochformat.col-md-5 { width: 100% !important; flex: 0 0 100%; max-width: 100%; }
    .pb-80 { padding-bottom: 70px }

    .newset .linkinside { left: 50px !important; right: 50px !important; line-height: 20px; bottom: -2px !important }
    .vertikaler { padding-top: 28px }

    #newset .labels .col-md-5 { width: 100% !important; max-width: 100%; flex: 0 0 100% }
    .border-left.labels { border-left: none !important }
    .lbltrenner { height: 620px;  width: 1px; display: block; position: absolute; left:  -90px; background-color: #000 }

    .md-ipad-0 { margin-left: 0px !important }

    .sharebox { right: -15px }
    .sbinside { margin-right: 0px; margin-left: 0px }
    .sep { display: none }

    .smallblue { font-size: 0.95em }
}


@media only screen and (min-width: 810px) and (max-width: 1080px)  and (orientation: portrait) {

    .headertitle { line-height: 37px; min-height:  44px}
    .headerlink { line-height: 18px; padding-top: 15px }
    .blueunderline .linkinside { bottom: 2px }
    .blueunderline.active .linkinside, .blueunderline:hover .linkinside { bottom: -2px !important }
    .md-clear { clear: left; display: block }
    .md-none { display: none; }
    .ipadmiddler { margin-top: 0px !important }

    .inside50 { padding: 10px 20px 10px 20px }

    .projectheadline h1 { font-size: 2.5rem }
    .quote p { font-size: 1.5rem }

    .ml-100 { margin-left: 0px !important }
    .ml-50 { margin-left: 0px !important }
    h1 { font-size: 3rem;  padding-bottom: 1px }
    h3 { font-size: 1.8rem }
    .hochformat.col-md-5 { width: 100% !important; flex: 0 0 100%; max-width: 100%; }
    .pb-80 { padding-bottom: 70px }

    .newset .linkinside { left: 50px !important; right: 50px !important; line-height: 20px; bottom: -2px !important }
    .vertikaler { padding-top: 15px }

    #newset .labels .col-md-5 { width: 100% !important; max-width: 100%; flex: 0 0 100% }
    .border-left.labels { border-left: none !important }
    .lbltrenner { height: 620px;  width: 1px; display: block; position: absolute; left:  -90px; background-color: #000 }

    .sharebox { right: -15px }
    .sbinside { margin-right: 34px; margin-left: 0px }
    .sep { display: none }
    .ipadonly { display: block; }
    .smallblue { font-size: 0.95em }
} 


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


	.mobile 						  { display: block;}
    .nomobile { display: none; }

	.menu                             { cursor: pointer; margin: 0 auto;position: absolute; width: 70px; height: 70px; display: block; right: -3px; top: -1px;  z-index: 999999;  }
    .menu-global                      { backface-visibility: hidden; position: absolute; left: 0; border-top: 2px solid #000;  width: 40%; margin-left: 22px; margin-top: 26px; transition: 0.55s; }
    .menu-top                         { top: 0; }
    .menu-middle                      { top: 8px; }
    .menu-bottom                      { top: 16px; }
    .menu-top-click                   { backface-visibility: hidden; top: 15px; -webkit-transform: rotate(45deg); -webkit-transition: 0.55s 0.5s; -moz-transform: rotate(45deg); -moz-transition: 0.55s 0.5s; transform: rotate(45deg); transition: 0.55s 0.5s; }
    .menu-middle-click                { opacity: 0; }
    .menu-bottom-click                { backface-visibility: hidden; top: 15px; -webkit-transform: rotate(-405deg); -webkit-transition: 0.55s 0.5s; -moz-transform: rotate(-405deg); -moz-transition: 0.55s 0.5s; transform: rotate(-405deg); transition: 0.55s 0.5s;  }

    .navi                             { margin-bottom:  0px !important;border-top:  1px solid #000;bottom:  0px; right:  0px; position: absolute; background-color: #fff; top:  0px; text-align: center; left: 0px; width: 100%; display: none; z-index:  129999999; margin-left:  0px; padding-left:  0px; margin-top:  10px}
    .pt-sm-60 { padding-top: 120px !important; padding-bottom: 30px }
    .navi li                          { display: block; clear: both; float: none; width: 100%;text-align: center; padding-top: 12px; padding-bottom: 12px;  }
    .navi li a                        { color: #000; font-weight: 300; text-transform: uppercase;}
   

    nav ul                            { border-top: 0px;}

    h1                                { font-size: 3.3rem; padding-top: 0px !important; padding-bottom: 0px !important; }
    h3                                { font-size: 2.1rem }
    .GeneratorPage h3                 { font-size: 1.6rem }
    .inside50                         { padding: 10px }
    .quote                            { padding: 40px }
    .quote p                          { line-height: 1.4 }

    h2.smalltitle                     { font-size: 0.6em; margin-bottom: 0px; padding-bottom:  0px}
    .projectlink                      { font-size: 0.6em }

    ul.projects { display: none }
    .projects li { width: 20px; height: 20px; line-height:  17px; border-radius:  10px; }
    .custompager { border: 0px }
    .custompager span { width: 20px; height: 20px; line-height: 17px; border-radius: 10px; }


    #MemberLoginForm_LoginForm label { display: block; padding-left: 0px }
    .login-form__header h1 { padding-bottom: 40px }

    #MemberLoginForm_LoginForm .middleColumn { width: 100%; display: block; }
    #MemberLoginForm_LoginForm_Email_Holder input { padding: 15px; min-width: unset; max-width: 100%; width: 100%; }
    #MemberLoginForm_LoginForm_Password_Holder input { padding: 15px; min-width: unset; max-width: 100%; width: 100%;  }
    #MemberLoginForm_LoginForm_Remember_Holder { padding-left: 1px }
    #MemberLoginForm_LoginForm_Remember { display: block; float: left; margin-left: 0px }

    .border-left.labels { border-left: none !important; }
    .lblheadline.mobile { font-size: 2rem !important; padding-top: 30px; margin-top: 0px }
    .text-sm-left { text-align: left !important }
    .borderleft, .borderright { display: none; }
    .insidertitle { max-width: 60%; }

    .headertitle { font-size: 1.5rem }
    .pb-80 { padding-bottom: 60px }

    .sharebox { right: -15px }
    .sbinside { margin-right: 47px; margin-left:  0px; background-color: #fff; margin-top: 4px; padding-bottom: 4px }
    .sep { display: none }

    table td { font-size: 1em }

    .smallblue { font-size: 1em; letter-spacing: 0px; }
    .mobsm { line-height: 0.9 }
    .erstellen { margin-bottom: 60px }
    .backlink { max-width: 90% }

    #newset .labels label { margin-bottom: 1rem }

 }