/* ------ GLOBAL --------

Theme-Name: EXPO - Gewerbeschau 2026 Ochtrup
Author: MOLECO GmbH
Author URI: http://www.moleco.de
Description: MOLECO Theme - EXPO
Version: 1.0

-----------------------*/

body,html,*{font-size:22px;line-height:1.5;font-family:'Barlow';font-weight:300;color:var(--dunkelgrau)}
html{scroll-behavior: smooth;}

body.karte{background:var(--blau);}

a{color:var(--blau);text-decoration:none;font-size:100%;transition:all .3s ease;}
a:hover{text-decoration:none;color:var(--orange);transition:all .3s ease;}
a:focus{text-decoration:none;}

li{list-style:none;padding-left:30px;position:relative;}

ul{padding:0;margin:0;}

img{max-width:100%;height:auto;}

h1{font-size:250%;font-weight:500;display:block;margin-bottom:25px;line-height:1;}
h2{font-size:250%;font-weight:500;display:block;margin-bottom:25px;line-height:1;color: var(--schwarz);}
h3{font-size:150%;font-weight:500;display:block;margin-bottom:25px;line-height:1;color: var(--schwarz);}

.headline{display:block;line-height:1;color: var(--schwarz);}
.subline{font-size:150%;font-weight:500;display:block;color:var(--dunkelgrau);margin-bottom:35px;margin-top:-15px;}

.btn{position:relative;padding:13px 50px 15px 50px;font-size:22px;font-weight:500;background:var(--orange);color:var(--weiss);transition:all .3s ease;line-height:1;text-align:center;}
.btn:hover{transition:all .3s ease;background:var(--buttonhover);color:var(--weiss);}

strong{font-weight:500;font-size:100%;}

.container{max-width:1500px;}
.container.wide{max-width:1660px;}

.passwordwrapper{height:100vh;width:100%;align-content:center;}
.passwordwrapper .inner{text-align:center; padding: 2em;width: 50%;margin: 0 auto;background: var(--blau);}
.passwordwrapper .inner .headline{color:var(--weiss);}
.passwordwrapper .inner .info{color:var(--weiss);font-size:125%;}
.passwordwrapper .inner form{text-align:center;margin-top:25px;}
.passwordwrapper .inner form input{background:var(--weiss);padding:5px 15px;width:50%;display:block;margin:10px auto;border:none;box-shadow:none;}
.passwordwrapper .inner form .btn{width:50%;display:block;margin:10px auto;}


/*------------------------------------Header-------------------------------------------------*/

#page-header .desktop{display: flex;width: 100%;justify-content: end;}
#page-header .mobile{display:none;}

#page-header{background:var(--blau);position: absolute;top:0;right:0;left:0;display: flex;align-items: center;justify-content:end;padding:15px 0;z-index:9999;}
/* #page-header .logo{width:250px;} */

#page-header #toppermenu{height:100%;align-content:center;text-align:right;}
#page-header #toppermenu .menu li.btn{padding:2px 20px 5px;margin:0 50px;}

#page-header .menu li{display:inline-block;}
#page-header .menu li a{color:var(--weiss);text-transform: uppercase;transition:all .3s ease;position:relative;font-weight:400;}
#page-header .menu li a:hover{opacity: 0.7;transition:all .3s ease;}
#page-header .menu li a:after{content:'';display:block;width:0%;height:1px;background:var(--weiss);position:absolute;bottom:-2.5px;left:0;transition:all .3s ease;}
#page-header .menu li a:hover:after{content:'';display:block;width:100%;height:1px;background:var(--weiss);position:absolute;bottom:-2.5px;left:0;transition:all .3s ease;}
#page-header .menu li.current-menu-item a:after{content:'';display:block;width:100%;height:1px;background:var(--weiss);position:absolute;bottom:-2.5px;left:0;transition:all .3s ease;}

#page-header .favwrapper li.favorite{padding-left:0;}
#page-header .favwrapper li.favorite a{color:transparent;display:block;width:25px;height:25px;}
#page-header .favwrapper li.favorite a img{vertical-align:baseline;}


#page-header .desktop{height:100%;}
#page-header .desktop .favwrapper{align-content:center;margin-left:25px;}


#page-header.bottom{padding:15px 0;position:fixed;top:0;left:0;right:0;-webkit-animation: fadein 2s; /* Safari, Chrome and Opera > 12.1 */              -moz-animation: fadein 2s; /* Firefox < 16 */-ms-animation: fadein 2s; /* Internet Explorer */-o-animation: fadein 2s; /* Opera < 12.1 */animation: fadein 2s;z-index:999;}
#page-header.bottom .logo{width:150px;}


@keyframes fadein {
    from { top: -150px; }
    to   { top: 0; }
}
@-moz-keyframes fadein {
    from { top: -150px; }
    to   { top: 0; }
}
@-webkit-keyframes fadein {
    from { top: -150px; }
    to   { top: 0; }
}
@-ms-keyframes fadein {
    from { top: -150px; }
    to   { top: 0; }
}
 
#page-header .logo{width: 250px;}


/*------------------------------------Footer-------------------------------------------------*/

#page-footer{background:var(--blau);padding-top:75px;}
#page-footer *{color:var(--weiss);}
#page-footer .logo{width:75%;}
#page-footer .logo img{width:100%;}
#page-footer .socials{display: flex;flex-direction: column;align-items: flex-end;}
#page-footer .socials .link{display:block;width:40px;height:40px;margin-bottom:10px;}

#page-footer .logos{margin:75px 0 50px;}
#page-footer .logos .headline{font-size:100%;}
#page-footer .logos .row{justify-content: space-between;}
#page-footer .logos .headline{color:var(--weiss);font-size:125%;font-weight:600;margin-bottom:15px;}
#page-footer .logos .item{width:calc(100% / 7 - 50px);height:65px;align-content:center;text-align:center;}
#page-footer .logos .item img{max-width:100%;max-height:100%;opacity:1;transition:all .15s ease;}
#page-footer .logos .item a img{transform:scale(1);transition:all .3s ease;}
#page-footer .logos .item a:hover img{transform:scale(1.05);transition:all .3s ease;}

#page-footer .copyright{padding: 15px 0;border-top:solid 1px var(--weiss);}
#page-footer .copyright span{float:left;width:50%;text-align:left;color:var(--weiss);font-size:75%;text-transform:uppercase;letter-spacing:1px;padding-right: 15px;}
#page-footer .copyright .impressum{float: right;line-height: 1;}
#page-footer .copyright .impressum a{width: fit-content; padding-left: 20px;font-size:75%; color: var(--weiss);letter-spacing:1px;text-transform:uppercase;position:relative;}
#page-footer .copyright .impressum a:after{content:'';display:block;width:0%;height:1px;background:var(--weiss);position:absolute;bottom:-2.5px;left:20px;transition:all .3s ease;}
#page-footer .copyright .impressum a:hover{opacity: 0.7;transition:all .3s ease;}
#page-footer .copyright .impressum a:hover:after{content:'';display:block;width:calc(100% - 20px);height:1px;background:var(--weiss);position:absolute;bottom:-2.5px;left:20px;transition:all .3s ease;}


/*------------------------------------ABWEICHUNGEN-------------------------------------------------*/