@font-face { 
  font-family: 'titlefont'; 
  src: url('../type/ChunkFive-Regular.woff'); 
}
@font-face { 
  font-family: 'textfont'; 
  src: url('../type/Asap-Regular.woff'); 
}
@font-face { 
  font-family: 'strongfont'; 
  src: url('../type/Asap-BoldItalic.woff'); 
}
html {
    font: normal 16px 'textfont';
}
.stop-me-weg {
    display: none;
}
body {
}
body.animated {
    animation-duration: 1s;
    animation-name: slagschaduw;
    animation-iteration-count: infinite;
    animation-delay: 125ms;
}
p {
    padding-bottom: 2rem;
    line-height: 1.55rem;
}
hgroup {
    color: #365f91;
    text-align: left;
    display: flex;
    justify-content: start;
    padding-bottom: 1rem;
}
hgroup img {
    margin-top: 2rem;
    height: 6rem;
}
h1 {
    font: normal 2rem 'titlefont';
    margin-top: 1.5rem;
}
h2 {
    font: normal 1.5rem 'titlefont';
    color: #365f91;
}
h3 {
    font: normal 1.1rem 'titlefont';
    text-align: left;
    color: #365f91;
}
article {
    width: 95vw;
}
article, footer>p {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
#dorpsplein-oosterwold {
    justify-content: left;
    margin-left: 4rem;
}
section {
    margin: 0 2.5vw;
}
section.windturbine {
    width: 20rem;
}
section.windturbine button {
    width: 100%;
    margin-top: 1rem;
}
section.windturbine h2 {
    text-align: center;
    width: 100%;
    margin-top: 4rem;
}
section.content {
    text-align: justify;
    width: 25rem;
}
section.contact {
    overflow-x: hidden;
    width: 20rem;
}
section.contact p:nth-of-type(7) {
    position: relative;
    left: 10000rem;
}
section.contact p:nth-of-type(8), section.contact p:nth-of-type(9) {
    position: relative;
    top: -6.7rem;
}
section.contact label {
    display: flex;
    justify-content: space-between;
    width: 100%;
}
section.contact label.invalid {
    color: #EF8354;
}
section.contact input, section.contact output {
    width: 100%;
}
section.contact input.invalid {
    border-color: #EF8354;
}
section.contact output.invalid {
    border-color: #EF8354;
    color: #EF8354;
}
section.contact output {
    font: normal 1rem 'strongfont';
}
footer {
    width: 95vw;
}
footer span {
    margin: 0 1rem;
}
button, input , output {
    background-color: #fff;
    padding: 0.7rem;
    border: 0.1rem solid #dce6f0;
    border-radius: 0.7rem;
    display: block;
}
button, input[type=submit] {
    box-shadow: 0.2rem 0.2rem 0.5rem #dce6f0;
}
button:hover, input[type=submit]:hover {
    background-color: #e6f0fa;
    cursor: pointer;
}
input[type=submit] {
    font: normal 1rem 'strongfont';
}
input[type=submit]:disabled {
    color: #dce6f0;
}
input[type=submit]:disabled:hover {
    background-color: #fff;
    cursor: not-allowed;
}
button>a {
    text-decoration: none;
    color: #000000;
}
strong {
    font: normal 1rem 'strongfont';
}

svg.windturbine>path {
    stroke: #365f91;
    stroke-width: 20;
    stroke-linejoin: round;
    fill: #fff;
}
svg.windturbine>path.swt1 {
    visibility: visible;
    stroke: #365f91;
    fill: #fff;
}
svg.windturbine>path.swt2,
svg.windturbine>path.swt3,
svg.windturbine>path.swt4,
svg.windturbine>path.swt5,
svg.windturbine>path.swt6,
svg.windturbine>path.swt7,
svg.windturbine>path.swt8 {
    visibility: hidden;
}
svg.windturbine>path.wt1 {
    animation-duration: 1s;
    animation-name: turbine;
    animation-iteration-count: infinite;
    animation-delay: 0ms;
}
svg.windturbine>path.wt2 {
    visibility: hidden;
    animation-duration: 1s;
    animation-name: turbine;
    animation-iteration-count: infinite;
    animation-delay: 125ms;
}
svg.windturbine>path.wt3 {
    visibility: hidden;
    animation-duration: 1s;
    animation-name: turbine;
    animation-iteration-count: infinite;
    animation-delay: 250ms;
}
svg.windturbine>path.wt4 {
    visibility: hidden;
    animation-duration: 1s;
    animation-name: turbine;
    animation-iteration-count: infinite;
    animation-delay: 375ms;
}
svg.windturbine>path.wt5 {
    visibility: hidden;
    animation-duration: 1s;
    animation-name: turbine;
    animation-iteration-count: infinite;
    animation-delay: 500ms;
}
svg.windturbine>path.wt6 {
    visibility: hidden;
    animation-duration: 1s;
    animation-name: turbine;
    animation-iteration-count: infinite;
    animation-delay: 625ms;
}
svg.windturbine>path.wt7 {
    visibility: hidden;
    animation-duration: 1s;
    animation-name: turbine;
    animation-iteration-count: infinite;
    animation-delay: 750ms;
}
svg.windturbine>path.wt8 {
    visibility: hidden;
    animation-duration: 1s;
    animation-name: turbine;
    animation-iteration-count: infinite;
    animation-delay: 875ms;
}
@keyframes slagschaduw {
    from {
        background-color: #fff;
    }
    10% {
        background-color: #dce6f0;
    }
    20% {
        background-color: #fff;
    }
    to {
        background-color: #fff;
    }
}
@keyframes turbine {
    from {
        visibility: visible;
        stroke: #365f91;
        fill: #fff;
    }
    12.5% {
        visibility: visible;
        stroke: #365f91;
        fill: #fff;
    }
    12.6% {
        visibility: hidden;
        stroke: transparent;
        fill: transparent;
    }
    to {
        visibility: hidden;
        stroke: transparent;
        fill: transparent
    }
}
@media screen and (min-height: 1024px) and (min-width: 1600px) {
    footer {
        position: fixed;
        bottom: 0;
    }
}