body,form,figure{margin:0;padding:0}img{border:0}header,footer,nav,section,aside,article,figure,figcaption{display:block}body{font-size:100.01%}select,input,textarea{font-size:99%}#container,.inside{position:relative}#main,#left,#right{float:left;position:relative}#main{width:100%}#left{margin-left:-100%}#right{margin-right:-100%}#footer{clear:both}#main .inside{min-height:1px}.ce_gallery>ul,.content-gallery>ul{margin:0;padding:0;overflow:hidden;list-style:none}.ce_gallery>ul li,.content-gallery>ul li{float:left}.ce_gallery>ul li.col_first,.content-gallery>ul li.col_first{clear:left}.float_left,.media--left>figure{float:left}.float_right,.media--right>figure{float:right}.block{overflow:hidden}.media{display:flow-root}.clear,#clear{height:.1px;font-size:.1px;line-height:.1px;clear:both}.invisible{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}.custom{display:block}#container:after,.custom:after{content:"";display:table;clear:both}
@media (max-width:767px){#wrapper{margin:0;width:auto}#container{padding-left:0;padding-right:0}#main,#left,#right{float:none;width:auto}#left{right:0;margin-left:0}#right{margin-right:0}}img{max-width:100%;height:auto}.audio_container audio{max-width:100%}.video_container video{max-width:100%;height:auto}.aspect,.responsive{position:relative;height:0}.aspect iframe,.responsive iframe{position:absolute;top:0;left:0;width:100%;height:100%}.aspect--16\:9,.responsive.ratio-169{padding-bottom:56.25%}.aspect--16\:10,.responsive.ratio-1610{padding-bottom:62.5%}.aspect--21\:9,.responsive.ratio-219{padding-bottom:42.8571%}.aspect--4\:3,.responsive.ratio-43{padding-bottom:75%}.aspect--3\:2,.responsive.ratio-32{padding-bottom:66.6666%}
/* CSS Document */

body {
  font-family: Karla;
}

.vf_form {
  overflow: visible;
}

.vf_background {
  position: fixed;
  width: 100vw;
  height: 100vh;
  
  background-color: #B00000;
  z-index:-1;
}

.bg_left{
  background-image: url("/files/Lehrstellen/background-left.svg");
    
  width: 50%;
  min-width: 275px;
  height: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: right;
}

.bg_top{
  background-image: url("/files/Lehrstellen/background-top.svg");
    
  position: absolute;
  top: 0;
  right: 0;
  height: 25%;
  width: 45%;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: right top;
}

.bg_bottom{
  background-image: url("/files/Lehrstellen/background-bottom.svg");
    
  position: absolute;
  bottom: 0;
  left: 0;
  height: 25%;
  width: 100%;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: bottom center;
}

.vf_content {
  display: flex;
  justify-content: space-evenly;
}

.flexbox {
  height: 100vh;
  padding: 100px 25px;
  box-sizing: border-box;
}


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

.vf_logo {
  width: 253px;
  height: 101px;
}

h1 {
  margin-top: 169px;
  font-size: 36px;
  font-weight: 400;
  color: white;
  border-bottom: 1px solid white;
  padding-bottom: 10px;
  width: 370px;
}

input {
  width: 355px;
  background-color: #780000;
  color: white;
  font-size: 25px;
  border: none;
  border-bottom: 1px solid #D8D8D8;
  margin-bottom: 15px;
  padding: 12px 0 14px 16px;
}

input:focus-visible {
  outline: none;
  box-shadow: 2px 4px 10px black;
}

input::placeholder{
  color: white;
  font-size: 25px;
  font-weight: 400;
}

button {
  width: 134px;
  height: 56px;
  background-color: #B00000;
  border: 1px solid white;
  color: white;
  font-size: 20px;
  font-weigth: 600;
  margin-top: 50px;
}

.vf_form-antwort{
  display: flex;
  align-items: center;
  justify-content: center;
  
  text-align: center;
  
  height: 100vh;
  width: 100vw;
  
  color: white;
}

@media(max-width: 1200px) {
  .vf_content {
    flex-direction: column;
    align-items: center;
  }
  
  .flexbox {
    height: auto;
    margin: 0 50px;
    padding-top: 50px;
  }
  h1 {
    margin-top: 100px;
  }
}

@media(max-width: 470px) {
  h1 {
    font-size: 28px;
    width: 300px;
    }
  input {
    width: 288px;
    font-size: 18px;
    margin-bottom: 15px;
    padding: 8px 0 9px 12px;
  }
  input::placeholder{
    font-size: 18px;
  }
  button {
    width: 110px;
    height: 48px;
    font-size: 15px;
    font-weigth: 600;
    margin-top: 30px;
  }
  
  .flexbox {
    height: auto;
    margin: 0 25px;
  }
}
