*{
  margin:0;
  box-sizing: border-box;
}
body {
  font-family: "Fira Sans", sans-serif;
  font-weight: 500;
  color: black;
  margin: 0px;
}
img{
  display: flex;
  flex-direction: row;
  border-radius: 15px;
  height:360px;
  margin:auto;
}
.header-1{
  background: rgba(255, 255, 255, 0.8);
  color: #000000;
  width:100%;
  display: flex;
  flex-direction: row;
  font-size: 20px;
  height:100px;
  align-items: center;
  z-index: 1;
  justify-content:flex-end;
  position: fixed;
  top: 0;
  width: 100%;
}
.header-2{
display: flex;
align-items:center;
justify-content:center;
}
.headerLandscape{
  display:flex;
}
.dropdownMenu{
  color: #000000;
  position: absolute;
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align: center;
  font-weight: 500;
  height: 80px;    
  border:none;
}
.image-ex-1{
  display:flex;
  border:white;
  height: 360px;
  justify-content: center;
  margin:5px;
}
.price-2{
  background:rgb(255, 255, 255);
  color:rgb(0, 0, 0);
  display: flex;
  flex-direction: row;
  font-size: 30px;
  font-weight: 800;
  width:100%;
}
.price-3{
  text-align: center;
  display:flex;
  position:static;
  width:50%;
  flex-direction:column;
  box-shadow: 0 0px 8px 0 rgba(0,0,0, 0.2), 0 0px 20px 0 rgba(0,0,0,0.19);
  padding: 5px;
  border-radius:20px;
  height:580px;
  margin:5px;
  align-content:center;
  align-items:center;
}
.price-4{
  text-align: center;
  display:flex;
  position:static;
  width:50%;
  flex-direction:column;
  box-shadow: 0 0px 8px 0 rgba(0,0,0, 0.2), 0 0px 20px 0 rgba(0,0,0,0.19);
  padding: 5px;
  border-radius:20px;
  height:600px;
  margin:5px;
  align-content:center;
  align-items:center;
}
.about{
  text-align: center;
  background:rgb(255, 255, 255);
  position:static;
  height: 100%;
  color:rgb(0, 0, 0);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  font-size: 30px;
  font-weight: 800;
  width:100%;
  margin: 40px 0px 0px 0px;
  padding:20px 20px 20px 20px;
}
.about-Left{
  text-align: left;
  justify-content: left;
  box-shadow: 0 0px 8px 0 rgba(0,0,0, 0.2), 0 0px 20px 0 rgba(0,0,0,0.19);
  height:400px;
  width:300px;
  margin:5px;
  border-radius:20px;
  padding: 20px;
}
.about-Right{
  display:flex;
  text-align: center;
  align-items:center;
  justify-content:center;
  height:400px;
  width:50%;
  margin:5px;
  border-radius:5px;
}
.contact-right{
  text-align: left;
  justify-content: left;
  box-shadow: 0 0px 8px 0 rgba(0,0,0, 0.2), 0 0px 20px 0 rgba(0,0,0,0.19); 
  height:460px;
  width:20%;
  margin:5px;
  border-radius:20px;
  padding: 20px;
}
.contact-left{
  display:flex;
  text-align: center;
  align-items:center;
  justify-content:center;
  box-shadow: 0 0px 8px 0 rgba(0,0,0, 0.2), 0 0px 20px 0 rgba(0,0,0,0.19);
  height:460px;
  margin:5px;
  border-radius:20px;
  width:50%;
}
.priceHeader{
  display:flex;
}
.about{
  display:flex;
}
.portrait{
  display: none;
}
.dropdown{
  position:absolute;
}
.contactTitle{
  display:none;
}
.dropdownMask{
  height:200px;
  display:none;
}
.space{
  height:60px;
}
@media only screen and (max-width: 1350px){
  img{
    display: flex;
    flex-direction: row;
    border-radius: 15px;
    justify-content:center;
    align-items:center;
    width:350px;
    height:100%;
  }
  .image-ex-1{
    display:flex;
    border:white;
    height:100%;
    align-items: center;
    justify-content: center;
    margin:5px;
  }
  .contactTitle{
    display:block;
  }
  .contact{
    margin:0px;
    padding:0px;
  }
  a{
    font-weight: 500;
    font-family: "Fira Sans", sans-serif;
    text-decoration:none;
    transition: transform .2s;
  }
  a:hover{
    transform: scale(1.2);
  }
  button{
    color:rgb(245, 56, 56);
    width:0px;
    width:0px;
    font-weight: 500;
    font-family: "Fira Sans", sans-serif;
  }
  button:hover{
    width:100%;
    cursor: pointer;
  }
  .header-1{
    display:flex;
    justify-content:flex-end;
    width:100%;
    margin:0px;
  }
  .dropdown{
    background:rgba(255, 255, 255, 0.8);
    color: #000000;
    position: absolute;
    width:200px;
    display: flex;
    flex-direction: column;
    font-size: 16px;
    height:310px;
    align-items: center;
    justify-content: center;
    opacity:0;
    z-index: 1;
    transition: .2s;
  }
  @keyframes moveFromUp{
    0%{
      translate: 10px -280px
    }
    100%{
      translate: 10px 0px;
    }
  }
  @keyframes moveFromDown{
    0%{
      translate: 10px 0px;
    }
    100%{
      translate: 10px -280px

    }
  }
  .animateOn{
    opacity:100;
    animation: moveFromUp .2s ease-out 1; 
  }
  .animateOff{
    opacity:0;
    animation: moveFromDown .2s ease-out 1; 
    pointer-events:none;
  }
  .dropdownMask{
    height:320px;
    display: flex;
    width:220px;
    translate: 0px 210px;
    position: absolute;
    overflow: clip;
  }
  .dropdownMenu{
    color: #000000;
    position: absolute;
    width:100%;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align: center;
    font-weight: 500;
    height: 80px;    
    border:none;
  }
  .portrait{
    display: flex;
  }
  .headerLandscape{
    display:none;
  }
.imgMobile{
    display:none;
  }
.price-2{
  background:rgb(255, 255, 255);
  position:static;
  color:rgb(0, 0, 0);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-size: 30px;
  font-weight: 800;
  width:100%;
  }  
  .price-4{
    text-align: center;
    display:flex;
    position:static;
    width:95%;
    flex-direction:column;
    padding: 5px;
    border-radius:20px;
    height:600px;
    margin:5px;
    align-items: center;
  }
  .space{
    height:0;
  }
  .price-3{
    text-align: center;
    display:flex;
    position:static;
    width:95%;
    flex-direction:column;
    padding: 5px;
    border-radius:20px;
    height:520px;
    margin:5px;
    align-items: center;
  }
  .marginMobile{
    margin:50px;
  }
  .pricesDoubleIcons{
    display:block;
    align-items: center;
    justify-content:center;
  }
  .about{
    text-align: center;
    background:rgb(255, 255, 255);
    position:static;
    height: 100%;
    color:rgb(0, 0, 0);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-size: 30px;
    font-weight: 800;
    width:95%;
    padding:0px;
  }
  .about-Left{
    text-align: left;
    justify-content: left;
    box-shadow: 0 0px 8px 0 rgba(0,0,0, 0.2), 0 0px 20px 0 rgba(0,0,0,0.19);
    height:400px;
    width:95%;
    border-radius:20px;
    padding: 20px;
  }
  .contact-right{
    text-align: left;
    display:none;
    justify-content: left;
    height:400px;
    width:20%;
    margin:5px;
    border-radius:20px;
    padding: 20px;
  }
  .about-Right{
    display:flex;
    text-align: center;
    align-items:center;
    justify-content:center;
    height:100%;
    width:95%;
    border-radius:20px;
  }
  .contact-left{
    display:flex;
    text-align: center;
    align-items:center;
    justify-content:center;
    box-shadow: 0 0px 8px 0 rgba(0,0,0, 0.2), 0 0px 20px 0 rgba(0,0,0,0.19);  
    height:460px;
    margin:5px;
    border-radius:20px;
    width:95%;
  }
}
.image-ex-2{
  padding:5px;
}
.centered{
  display: block;
  text-align: center;
}
a{
  transition: transform .2s;
}
a:hover{
    transform: scale(1.2);
}
.sticky {
  position: fixed;
  top: 0;
  width: 100%;
}
.sticky + .content {
  padding-top: 102px;
}
p {
  font-size: 14px;
}
.price-1{
  background:rgb(255, 255, 255);
  position:static;
  height: 600px;
  color:rgb(0, 0, 0);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  font-size: 30px;
  font-weight: 800;
  width:100%;
  margin: 100px 0px 0px 0px;
  padding:20px 20px 20px 20px;
}
.pricesDoubleIcons{
  display:flex;
  align-items: center;
  justify-content:space-around;
}
.contact {
  text-align: center;
  background:rgb(255, 255, 255);
  position:static;
  height: 100%;
  color:rgb(0, 0, 0);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  font-size: 30px;
  font-weight: 800;
  width:100%;
  margin: 220px 0px 0px 0px;
}
.contact .form{
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.form-control {
  font-size: 14px;
  margin-bottom: 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: left;
}
input {
  border-radius: 4px;
  width: 300px;
  border: 1px solid rgb(95, 106, 101);
  font-size: 14px;
  outline: none;
  color: #333;
  padding:10px;
}
form {
  display:flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  text-align: center; 
}
label {
  display: block;
  font-size: 14px;
  margin: 4px;
}
textarea {
  padding:10px;
  width: 300px;
  border-radius: 4px;
  outline: none;
  height: 50px;
  font-size: 14px;
}
button {
  display: flex;
  color: black;
  width: 100%;
  padding: 20px;
  background: none;
  cursor: pointer;
  color:rgb(95, 106, 101);
  align-items: center;
  justify-content: center;
  margin-bottom:12px;
  border-radius: 4px;
  transition: transform .2s;
}
.submitDisabled {
  display: flex;
  color: black;
  width: 100%;
  padding: 20px;
  background: none;
  cursor: pointer;
  color:rgb(95, 106, 101);
  align-items: center;
  justify-content: center;
  margin-bottom:12px;
  border-radius: 4px;
  transition: transform .2s;
  font-size: 14px;
  font-weight: 600;
}
button:hover {
  cursor: pointer;
  transform: scale(1.1);
}
button:active{
  color: rgb(255, 255, 255);
  background:rgba(0, 0, 0, 0.5);
}
.invalid {
  border: 1px solid rgb(3, 167, 44);
}
.error {
  color: rgb(3, 167, 44);
  font-size: 14px;
  margin-top: 6px;
}
.success {
  color:rgb(3, 167, 44);
  font-size: 14px;
  margin-top: 12px;
  display: none;
}
.fail {
  color: rgb(0, 255, 64);
  font-size: 14px;
  margin-top: 12px;
  display: none;
}
.hide {
  opacity: 0;
  height: 0px;
}
.hideDelete{
  opacity: 0;
  height: 0px;
  position:absolute;
}