:root {
  --dark-liver: rgba(81, 75, 78, 0.511);
  --rose-dust: #9d5c63ff;
  --periwinkle-crayola: #d6e3f8ff;
  --seashell: #fef5efff;
  font-family: 'PT Sans', sans-serif;
  color:#111111;
}

h1 {
  font-size: 7.2vw;
}
h2 {
  font-size: 4.0vh;
}
p, li {
  font-size: 3vw;
}

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;400&family=PT+Sans:wght@700&display=swap');

html {
  color:black;
  background-color: var(--seashell);
}

main, header, footer {
  padding:2em 5% 1em ;
}

header {
  color: var(--seashell);
  align-items: center;
  justify-content: center;
  justify-content: space-between;
  gap: 1%;
  text-align:center;  
  flex-wrap: wrap;
  flex-direction: row;
}
header img {
  width:50%;
  max-width:200px;
}

header ul{
  display:none;
  list-style: none;
  gap: 5vw;
  font-size:2vw;
}
header li {
  display:flex;
  justify-content: space-between;
}

header h1 {
  font-family: 'Montserrat', sans-serif;
  font-weight: 100;
  color:#111111;
}
header a {
  text-decoration: none;
}
header a:hover {
  text-shadow: red;
}

footer {
  border-top:solid var(--dark-liver) 5px;
  text-align:center;
  background: linear-gradient(100deg, rgba(68, 67, 67, 0.511) 0%, rgba(174, 153, 163, 0.511) 28%, rgba(81, 75, 78, 0.511) 100%);

}

footer p, address {
  padding-bottom:3vw;
}

footer>* {
  font-size: 3vw;
}

body, h1, h2, h3, p {
  margin:0;
  padding:0;
}

a {
  color:inherit;
}


#frontpage #c2a {
  background-color:rgb(35, 108, 142);
  background-image: url('/shipwebsite.JPG');
  background-size: cover;
  margin:-2em -6% 1em ;
  overflow:hidden
}
#frontpage #c2a h1 {
  text-align:center;
  flex-direction:column;
  height:50vw;
  width: 100%;;
  align-items: center;
  display: flex;
  justify-content: center;
  color: var(--seashell);
  text-shadow: 5px 5px black;
  line-height: 100%;
  font-weight: 900;
}
#frontpage #c2a a{
  display:block;
  background-color:red;
  padding:2% 5%;
  text-transform: uppercase;
  text-decoration: none;
  margin: 10% 0;
}
#promisse p {
  display:flex;
}
#promisse img {
  width:5vw;
  padding-right:1vw;
}

section {
  padding-bottom:7vw;
  padding-top:7vw;
}

#method img {
  width:1em;
}

#method {
  background: rgb(157,92,99);
  background: linear-gradient(100deg, rgba(157,92,99,1) 0%, rgb(162, 106, 113) 28%, rgba(157,92,103,1) 100%);
  margin:0 -6%;
  padding:5%;
}

footer #nonag {
  font-size: 2vw;
}

.nounderline {
  text-decoration: none;
}

#contactform {
  background-color:red;
  padding:8vw;
  border-radius:1.7vw;
}

#contactform input,
#contactform textarea {
  padding:1vw;
  border:none;
  border-radius: 1vw;
  width:70%;
  display: block ;
  margin: 2vw 0;
}
#contactform input[type=submit] {
  width:30%;
}
@media only screen and (max-width: 600px) {
  #contactform input,
  #contactform textarea {
    width:95%;
  }
  #contactform {
    padding:1vw;
  }
}

#thankyou {
  display:none;
  background-color: greenyellow;
  margin:0 -30%;
  text-align: center;
}

#thankyou:target {
  display:block;
}
