html,body {height:100%;width:100%;min-width:1030px;display:flex;flex-direction:column;padding:0;margin:0;font-family:sans-serif;font-size:calc(16px + 1vw)}
a {color:#000;text-decoration:none;outline:0}
a:hover, aside b:hover {color:#999;text-decoration:underline;text-decoration-color:#000;text-underline-offset: 6px}
header {position:relative;margin:0 7vw;background: url(/mbc-logo.png) right 43px no-repeat;background-size: auto 60%}
header h1 {color:#4e4d4e;margin:0;padding:20px 0 40px 0;font:600 3em/.85em Helvetica;letter-spacing:-1px}
header i {color:#b09a93;font-style:normal}

aside {position:absolute;top:5px;right:2.9vw;font-size:.6em;cursor:pointer}
aside b {display:inline!important;font-weight:normal;padding:0.5em;font-variant:small-caps}

nav {text-align:right;padding-top:12px;box-shadow:#ccc 0 -1px 0}
nav button {all: unset;font-weight:bold;color: #111;cursor: pointer;margin-left:5vw;text-transform:uppercase;font-size:.7em}
nav button:hover,nav button:focus {color:#999;text-decoration:underline;outline:none;text-decoration-color:#000;text-underline-offset:6px}
nav button:last-child, .p5 button {text-align:center;background:#000;color:#fff;padding:9px 0;width:190px;margin-right:3.3%}

.overlay{position:fixed;inset:0;display:flex;justify-content:center;align-items:center;background:rgba(0,0,0,0.5);opacity:0;pointer-events:none;transition:opacity 0.3s ease;z-index:9;}
.overlay.show{opacity:1;pointer-events:auto}
.popup{position:relative;color:#fff;background:radial-gradient(circle,#b09a93 0%, #4e4d4e 100%);width:50vw;height:auto;max-height:90vh;padding:20px 20px 50px 20px;box-shadow:0 0 20px rgba(0,0,0,0.3);border-radius:8px;transform:scale(0.95);transition:transform 0.3s ease;overflow-y:auto}
.overlay.show .popup{transform:scale(1)}
.close-btn{position:absolute;top:10px;right:15px;font-size:24px;color:#888;cursor:pointer}
.close-btn:hover{color:#000}
.overlay li {margin:1em 0}

main, footer {padding:1em 0}
main {flex:1;padding-bottom:0}
h3 {text-align:center;margin:.7em 0 1.5em 0;font-size:1.2em}

.slideshow{position:relative;width:100%;height:500px;overflow:hidden;}
.slideshow img{position:absolute;top:0;left:0;width:100%;height:600px;object-fit:cover;opacity:0;animation:fade 10s infinite;}
.slideshow img:nth-child(1){animation-delay:0s;}
.slideshow img:nth-child(2){animation-delay:2s;}
.slideshow img:nth-child(3){animation-delay:4s;}
.slideshow img:nth-child(4){animation-delay:6s;}
.slideshow img:nth-child(5){animation-delay:8s;}
@keyframes fade{0%{opacity:0;}10%{opacity:1;}40%{opacity:1;}50%{opacity:0;}100%{opacity:0;}}

#colorbg {background-position:left center}
#nocolorbg {background-position:right center}
#nocolorbg, #colorbg {background-repeat:no-repeat;display:flex;align-items:center}
#nocolorbg p {padding-right:44%}
#colorbg p {padding-left:44%}

.p1{background:url(/1.jpg)}
.p2{background:url(/connections.jpg)}
.p3{background:url(/3a.jpg)}
.p4{background:url(/discression.jpg)}
.p5{background:url(/join.jpg)}
.p5 button {font-size:.7em;font-weight:bold;border:0;margin-top:1em}

section div {display:flex;height:380px}
section b {display:block;font-size:2em;line-height:1em;margin-bottom:.2em}
section p {font-size:.9em;padding:0 7vw;}

form {font-size:.7em;text-align:center;padding:9px;margin:1em;background:#00000066;color:#fff}
button {margin-bottom:9px}
input {width:226px;margin-bottom:9px;}
#modal4 i {font-size:.6em;bottom:9px;text-align:center}
footer {text-align:center;font-size: 0.5em;height: 1.2em;color: #fff;padding: 1em;background: #000}

.drone-rise {
width: 100%;
height: 400px;
overflow: hidden;
position: relative;
background: url('droneskypark.jpg') center top / cover no-repeat;
animation: droneRisePan 10s ease-in-out infinite alternate;
display: flex;
justify-content: center;
align-items: center;
text-align: center
}

.drone-rise h2 {color:#fff;font-size:2em;width:70%}
.drone-rise h2 i {display:block;font-weight:500;margin-top:1em;font-size:0.5em;text-shadow: 0 1px 15px #000}

@keyframes droneRisePan {
  0% {
    background-position: center 0%;
    background-size: 105% auto;
  }
  50% {
    background-position: calc(50% + 2%) 20%;
    background-size: 103% auto;
  }
  100% {
    background-position: center 10%;
    background-size: 100% auto;
  }
}

@supports (-webkit-touch-callout: none) {
  /* Safari-specific styles */
.drone-rise {height:350px}
aside {position:absolute;top:5px;right:1.8vw;font-size:.8em;cursor:pointer}
}