:root {
  --standard-gray-color: #5e5e5e;
  --big-ts-gray-color: #4b4b4b;
  --standard-dark-gray-color: #252525;
  --standard-light-gray-color: #a1a1a1;
  --line-gray: #d9d9d9;
  --background: #ffffff;
  --button-color: #ededed;
  --button-color-hover: #cecdcd;
}

@media (min-width: 500px) and (max-width: 999px) {
  :root {
    --body-size: 90%;
    --big-ts-size: 15vw;
    --social-div-size: 10vw;
    --social-svg-and-hight-size: 10vw;
    --social-text-size: 3vw;
    --gallery-pic-size: 42vw;
    --gallery-flex-direction: column;
    --gallery-slidesPerView: 2;
    --gallery-slides-spacebetween: 10;
    --LinkButtonWidth: 90%;
    --NormalFooterDisplay: ;
    --MobileFooterDisplay: none;
    --displaysocialtext: flex;
    --social-svg-justify: space-evenly;
    /* Tablet CSS */
  }
}

@media (min-width: 320px) and (max-width: 500px) {
  :root {
    --body-size: 90%;
    --big-ts-size: 16vw;
    --social-div-size: 8vh;
    --social-svg-and-hight-size: 7vh;
    --social-text-size: 3vw;
    --gallery-pic-size: 40vh;
    --gallery-pic-size-width: 100%;
    --gallery-flex-direction: column;
    --gallery-slidesPerView: 1;
    --gallery-slides-spacebetween: 10;
    --LinkButtonWidth: 100%;
    --NormalFooterDisplay: none;
    --MobileFooterDisplay: ;
    --displaysocialtext: none;
    --social-svg-justify: space-around;
    /* Mobile CSS */
  }
}

@media (min-width: 1000px) {
  :root {
    --body-size: 70%;
    --big-ts-size: 7.9vw;
    --social-div-size: 5vw;
    --social-svg-and-hight-size: 5vw;
    --social-text-size: 2vw;
    --gallery-pic-size: 22vw;
    --gallery-flex-direction: row;
    --gallery-slidesPerView: 3;
    --gallery-slides-spacebetween: 30;
    --LinkButtonWidth: 80%;
    --NormalFooterDisplay: ;
    --MobileFooterDisplay: none;
    --displaysocialtext: flex;
    --social-svg-justify: space-evenly;
  }

  /* Laptop/desktop CSS */
}

a {
  text-decoration: none;
}

img {
  pointer-events: none;
}

.MainTextElements {
  width: 90%;
  align-items: center;
  margin: auto;
}

body {
  margin: 0%;
  background-color: var(--background);
  transition: all ease-in 100ms;
  width: var(--body-size);
  margin: auto;
}

/*Cookie CSS START*/

.ccm-modal-inner {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 450;
  border-radius: 2%;
}

#ccm-widget--title {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 800;
}

.ccm-powered-by a {
  display: none;
}

.ccm-root .ccm-widget--buttons .button,
.ccm-root .ccm-widget--buttons button {
  width: 30%;
}

/*Cookie CSS ENDE*/

div {
  display: block;
}

p {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
}

b {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 800;
}

header {
  text-align: center;
  display: flex;
  align-items: center;
  margin: auto;
  margin-top: 1%;
  margin-bottom: 1%;
  height: 5vh;
  width: 100%;
}

header a {
  color: var(--standard-gray-color);
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 400;
  font-size: 2vh;
  margin-left: auto;
  margin-right: auto;
  text-decoration: none;
  transition: color 300ms ease-in-out;
}

header a {
  color: var(--standard-dark-gray-color);
  transition: color 300ms ease-in-out;
}

header .headerlink1 {
  justify-content: left;
  margin-left: 1vw;
  margin-right: auto;
}

header .headerlink2 {
  justify-content: right;
  margin-left: auto;
  margin-right: 1vw;
}

header a:hover {
  cursor: pointer;
}

header .TSSilverCharm {
  font-family: "Silver Charm";
  font-style: normal;
  font-size: 5vh;
  text-shadow: none;
  transition: font-size 200ms ease-in-out;
  color: var(--standard-dark-gray-color);
}

header .TSSilverCharm:hover {
  font-size: 6vh;
  transition: font-size 200ms ease-in-out;
}

.line {
  width: 100%;
  display: block;
  height: 1vw;
  border: 0;
  border-top: 1px solid var(--line-gray);
  margin: auto;
  padding: 0;
  height: auto;
}

.big-tizianschoenijahn {
  text-align: center;
  font-family: "Open Sans";
  font-style: bold;
  font-weight: 700;
  font-size: var(--big-ts-size);
  color: var(--standard-light-gray-color);
  background-image: -webkit-radial-gradient(
    circle,
    var(--standard-light-gray-color) 0%,
    var(--big-ts-gray-color) 100%
  );
  background-size: 300%;
  background-position: center;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  margin-top: 3.5vh;
  margin-bottom: 3.5vh;
  transition: background-size 3s ease-in-out;
}

.big-tizianschoenijahn:hover {
  background-size: 100%;
  transition: background-size 1s ease-in-out;
  cursor: default;
}

.social {
  text-align: center;
  height: auto;
  width: 100%;
  margin-top: 2vw;
  margin-bottom: 2vw;
  display: flex;
  justify-content: var(--social-svg-justify);
  height: var(--social-div-size);
  vertical-align: middle;
}

.social div {
  height: var(--social-svg-and-hight-size);
  margin-top: auto;
  margin-bottom: auto;
}

.social div a {
  display: flex;
}

.social svg {
  height: var(--social-svg-and-hight-size);
  width: var(--social-svg-and-hight-size);
  fill: var(--standard-gray-color);
  transition: fill 100ms ease-in-out;
}

.social svg:hover {
  fill: var(--standard-dark-gray-color);
  transition: fill 100ms ease-in-out;
}

.socialtext {
  text-decoration: none;
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 800;
  color: var(--standard-dark-gray-color);
  font-size: var(--social-text-size);
  vertical-align: middle;
  align-items: center;
  display: var(--displaysocialtext);
}

.socialtextdiv {
  display: var(--displaysocialtext);
  align-content: center;
}

.socialtext:hover {
  cursor: pointer;
}

.swiper {
  width: 100%;
  height: var(--gallery-pic-size);
  width: var(--gallery-pic-size-width);
  margin-top: 2vh;
  margin-bottom: 2vh;
}

.swiper-slide img {
  display: block;
  height: 100%;
  object-fit: cover;
  border-radius: 2%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.swiper-slide {
  text-align: center;
  font-size: 18px;
  background: #ffffff00;
  display: flex;
  justify-content: center;
  align-items: center;
  pointer-events: none;
}

.swiper-wrapper {
  width: 300%;
}
/*.gallery {
  display: flex;
  width: 100%;
  margin-top: 2vw;
  margin-bottom: 2vw;
  vertical-align: middle;
  justify-content: space-between;
  flex-direction: var(--gallery-flex-direction);
  align-self: center;
}
.gallery img {
  width: var(--gallery-pic-size);
  border-radius: 2%;
  margin: auto;
} */
.NormalFooter {
  display: var(--NormalFooterDisplay);
}

.MobileFooter {
  display: var(--MobileFooterDisplay);
}

footer {
  margin: 0%;
  text-align: center;
  height: 25%;
}
.FooterTSDiv {
  width: 100%;
  align-items: center;
  justify-content: center;
  margin-top: 5vh;
  margin-bottom: 5vh;
}
.FooterTS {
  color: var(--standard-dark-gray-color);
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 800;
  font-size: 2.5vw;
  cursor: default;
}

.MobileFooterTS {
  color: var(--standard-dark-gray-color);
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 800;
  font-size: 9.65vw;
  cursor: default;
  margin-top: 1vh;
  margin-bottom: 1vh;
}

footer a {
  width: 10%;
}

footer div {
  display: flex;
  height: 2.7vw;
  vertical-align: middle;
  align-items: center;
  justify-content: space-between;
}

footer a p {
  color: var(--standard-gray-color);
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 500;
  font-size: 1.5vw;
  text-decoration: none;
}

.MobileFooter a p {
  color: var(--standard-gray-color);
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 500;
  font-size: 3vh;
  text-decoration: none;
}

.footerupperpart {
  margin-top: 1.5vw;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  height: 2.5vw;
}

.FooterCopyright {
  width: 100%;
  height: auto;
  width: 100%;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.5vw;
}

.MobileFooterCopyright {
  width: 100%;
  height: auto;
  width: 100%;
  align-items: center;
  justify-content: center;
  margin-bottom: 1.5vw;
}

.FooterCopyright p {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 500;
  font-size: 1vw;
  cursor: default;
}

.MobileFooterCopyright p {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 500;
  font-size: 3.5vw;
  cursor: default;
  color: var(--standard-light-gray-color);
}

.MobileFooterRows {
  display: block;
  height: auto;
  justify-content: space-between;
  margin-bottom: 1vh;
}

.MobileFooterRows div {
  width: 100%;
  height: 5vh;
}

.MobileFooterRows div div {
  width: auto;
}
/*Link-Page-Start*/

.bigLinksTitle {
  text-align: center;
  font-family: "Open Sans";
  font-style: bold;
  font-weight: 700;
  font-size: 7.9vw;
  color: var(--standard-light-gray-color);
}

.LinkButtonDiv {
  width: var(--LinkButtonWidth);
  display: block;
  align-self: center;
  margin: auto;
  margin-top: 2vh;
  margin-bottom: 2vh;
}

.LinkButtons {
  display: inline;
  vertical-align: middle;
  align-items: center;
  margin: 0;
}
.LinkButtons a {
  height: auto;
}

.LinkButtons button {
  align-items: center;
  width: 100%;
  height: 4vh;
  margin-top: 0.8vh;
  margin-bottom: 0.8vh;
  background-color: var(--button-color);
  color: var(--big-ts-gray-color);
  border-radius: 1vh;
  border: 0;
  font-weight: 750;
  font-size: 1.5vh;
  cursor: pointer;
}

.LinkButtons button:hover {
  background-color: var(--button-color-hover);
  color: var(--standard-dark-gray-color);
}
/*Link Page Contact Form
form {
  font-family: "Open Sans";
  font-style: normal;
  background-color: var(--button-color);
  border-radius: 1vh;
  width: var(--LinkButtonWidth);
  display: flex;
  align-self: center;
  margin: auto;
  margin-top: 2vh;
  margin-bottom: 2vh;
  align-items: center;
}
form div {
  width: 100%;
} 
form label {
  font-family: "Open Sans";
  font-style: normal;
  font-weight: 850;
}
.rendered-form {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin: 4vh;
  margin-top: 1vh;
}
form input {
  
    align-items: center;
    width: 100%;
    height: 4vh;
    margin-top: 1vh;
    margin-bottom: 1vh;
    background-color: var(--line-gray);
    color: var(--big-ts-gray-color);
    border-radius: 1vh;
    border: 0;
    font-weight: 750;
    font-size: 1.5vh;
}
form button {
  align-items: center;
  width: 100%;
  height: 4vh;
  margin-top: 1vh;
  margin-bottom: 1vh;
  background-color: var(--line-gray);
  color: var(--big-ts-gray-color);
  border-radius: 1vh;
  border: 0;
  font-weight: 750;
  font-size: 1.5vh;
}
.text-field-large {
  height: 15vh;
}
.text-field-large input{
  height: 15vh;
}
*/

/*Imprint Start*/

.bigImprintTitle {
  text-align: center;
  font-family: "Open Sans";
  font-style: bold;
  font-weight: 700;
  font-size: 7.9vw;
  color: var(--standard-light-gray-color);
}

/*Privacy Start*/

.bigPrivacyTitle {
  text-align: center;
  font-family: "Open Sans";
  font-style: bold;
  font-weight: 700;
  font-size: 5vw;
  color: var(--standard-light-gray-color);
}

/*Info Start*/

.bigInfoTitle {
  text-align: center;
  font-family: "Open Sans";
  font-style: bold;
  font-weight: 700;
  font-size: 7.9vw;
  color: var(--standard-light-gray-color);
}

/*Cookies Start*/

.bigCookiesTitle {
  text-align: center;
  font-family: "Open Sans";
  font-style: bold;
  font-weight: 700;
  font-size: 7.9vw;
  color: var(--standard-light-gray-color);
}