@import 'animate.min.css';

*{scroll-behavior: smooth;}

@font-face {
    font-family: 'OpenSansCondensed';
    src: url('OpenSans_Condensed-Regular.ttf');
}

h1 {
  font-family: OpenSansCondensed;
}
h2 {
  font-family: OpenSansCondensed;
}
h3 {
  font-family: OpenSansCondensed;
}
h4 {
  font-family: OpenSansCondensed;
}
h5 {
  font-family: OpenSansCondensed;
}
h6 {
  font-family: OpenSansCondensed;
}
p {
  font-family: OpenSansCondensed;
}

:root {
  --cassiopeia-color-primary: #005f6a;
  --cassiopeia-color-link: #005f6a;
  --cassiopeia-color-hover: #005f6a;
}

body.wrapper-fluid .site-grid {
  grid-gap: 0;
}

main {
  margin-top: 0px !important;
}

.footer {
  margin-top: 0px;
}

/* Hide scrollbar for Chrome, Safari and Opera */
body::-webkit-scrollbar {
  display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
html {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

.ESFullscreen {
  width: 100svw;
  height: 100svh;
  overflow: hidden;
  color:white;
}

.ESBackground-image {
  width: 100%;
  height: 100%;
  background-image: url('Hero.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center 80%;
  text-shadow: -1px -1px 0 #0002, 1px -1px 0 #0002, -1px 1px 0 #0002, 1px 1px 0 #0002;
  display:grid;
}

.ESOverlayBottom {
  grid-area:1/1;
  background-image: linear-gradient(rgb(0 0 0 / 15%) 70%, var(--cassiopeia-color-primary) 99%);
}

.ESOverlayTop {
  grid-area:1/1;
  background-image: linear-gradient(var(--cassiopeia-color-primary) 1%, rgb(0 0 0 / 0%) 30%);
}

.ESContainer {
  display:flex;
  align-items:center;
  justify-content: center;
  grid-area:1/1;
  height:100%;
}

.ESContent {
  display:flex;
  flex-direction: column;
  justify-content: space-evenly;
  align-items:center;
  height:100%;
}

.ESPad-left {
  padding-left:3vw;
  flex:0;
  transition: flex .3s;
}

.ESPad-right {
  flex:0;
  transition: flex 1s;
}

.ESLogo {
  width:min(40vw, 20vh);
  background: radial-gradient(rgba(0, 0, 0, 1) 0%, rgba(238, 130, 238, 0) 60%);
  border-radius:50%
}

.ESTeaser {
  padding: 1em;
  align-items: center;
  display: flex;
  flex-direction: column;
}

.ESKontakt-button {
  border: solid;
  width: fit-content;
  padding: 1em;
  color: white
}

.ESKontaktPortrait {
  background-image:url('portrait.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center 80%;  
}

.Circle {
  padding: 2vmin;
  width: 9vmin !important;
}

@media (orientation: landscape) {
  .ESContainer .ESPad-right {
    flex: auto;
  }
  .ESPad-left {
    flex: none;
  }
}

@media (orientation: portrait) {
  .ESContainer .ESPad-right {
    flex: none;
  }
  .ESPad-left {
    flex: none;
  }
}