#hoeWerktHet{
    top: 0;
    position: relative;
    color: #000;
    height: 100%;
    width: 90vw;
    max-width: 1266px;
    left: 0;
    right: 0;
    margin: 0 auto;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
}

#hoeWerktHet h2{
    width: 100%;
}

#hoeWerktHet p{
    font-size: min(1.5vw, 18px);
}

#howDoesItWorkWrapper{
    width: 100%;
    position: relative;
    display: flex;
    justify-content: space-between;
}

#howDoesItWorkBlock{
    background: #333136;
    color: #fff;
    position: relative;
    display: flex;
    width: 58vw;
    max-width: 700px;
    align-items: center;
}

.howTextItem{
    display: flex;
    flex-direction: row;
    font-size: min(1.5vw, 18px);
    margin: min(1.5vw, 21px) 0;
}

.howNumber{
    width: 5vw;
    max-width: 45px;
    text-align: right;
    margin-right: min(14px, 1vw);
}

.howText {
    width: 100%;
}

#calcProfitBlock{
    position: relative;
    width: 30vw;
    display: flex;
    align-items: center;
    flex-direction: column;
    max-width: 438px;
}

#calcForm{
    position: relative;
    width: 100%;
}

.calcLine{
    display: flex;
    justify-content: space-between;
    font-size: min(1.5vw, 18px);
    margin-bottom: 0.75vw;
}

.calcLine input,
.calcLine select{
    font-size: min(1.5vw, 18px);
    width: 11vw;
    max-width: 190px;
    box-sizing: border-box;
}

.calcLine:last-child{
    margin-bottom: 0;
    margin-top: 1.5vw;
}

#nettoProfit{
    font-weight: bold;
    font-size: min(3vw, 36px);
}

#farmWrapper{
    position: relative;
    width: 30vw;
    max-width: 420px;
    right: 0px;
    margin-top: 8vw;
    display: none;
}

#farm{
    position: relative;
    width: 100%;
}

#signWrapper{
    position: absolute;
    left: 30%;
    top: 29%;
}

#letterWWrapper,
#letterDWrapper,
#letterSWrapper{
    width: 100%;
    height: 100%;
}

#lightWrapper1{top: 0%; left: 1%;}
#lightWrapper2{top: 14%; left: 1.7%;}
#lightWrapper3{top: 27%; left: 2.6%;}
#lightWrapper4{top: 39%; left: 3.5%;}
#lightWrapper5{top: 51%; left: 4.3%;}
#lightWrapper6{top: 64%; left: 4.5%;}
#lightWrapper7{top: 64%; left: 6.8%;}
#lightWrapper8{top: 51%; left: 7%;}
#lightWrapper9{top: 39%; left: 8%;}
#lightWrapper10{top: 27%; left: 8%;}
#lightWrapper11{top: 14%; left: 9.4%;}
#lightWrapper12{top: 0%; left: 9.4%;}
#lightWrapper13{top: 27%; left: 10.4%;}
#lightWrapper14{top: 39%; left: 10.4%;}
#lightWrapper15{top: 50%; left: 11.5%;}
#lightWrapper16{top: 64%; left: 11.7%;}
#lightWrapper17{top: 64%; left: 14%;}
#lightWrapper18{top: 50%; left: 14.4%;}
#lightWrapper19{top: 39%; left: 15%;}
#lightWrapper20{top: 27%; left: 15.8%;}
#lightWrapper21{top: 14%; left: 16.8%;}
#lightWrapper22{top: 0%; left: 17.5%;}

#lightWrapper23{top: 19%; left: 29%;}
#lightWrapper24{top: 9%; left: 28.7%;}
#lightWrapper25{top: 0%; left: 27.1%;}
#lightWrapper26{top: -2%; left: 24.8%;}
#lightWrapper27{top: 1%; left: 22.5%;}
#lightWrapper28{top: 11%; left: 21.5%;}
#lightWrapper29{top: 21%; left: 21.7%;}
#lightWrapper30{top: 30%; left: 23.4%;}
#lightWrapper31{top: 34%; left: 26%;}
#lightWrapper32{top: 38%; left: 28.2%;}
#lightWrapper33{top: 50%; left: 28.7%;}
#lightWrapper34{top: 61%; left: 28.4%;}
#lightWrapper35{top: 67%; left: 26.2%;}
#lightWrapper36{top: 66%; left: 23.6%;}
#lightWrapper37{top: 59%; left: 21.7%;}
#lightWrapper38{top: 50%; left: 21%;}
#lightWrapper39{top: 42%; left: 21%;}

#lightWrapper40{top: 0%; left: 32.6%;}
#lightWrapper41{top: 0%; left: 35.5%;}
#lightWrapper42{top: 0%; left: 38.5%;}
#lightWrapper43{top: 8%; left: 40.6%;}
#lightWrapper44{top: 20%; left: 41.8%;}
#lightWrapper45{top: 33%; left: 42%;}
#lightWrapper46{top: 46%; left: 41.8%;}
#lightWrapper47{top: 59%; left: 40.4%;}
#lightWrapper48{top: 66%; left: 37.9%;}
#lightWrapper49{top: 66%; left: 35%;}
#lightWrapper50{top: 66%; left: 32.3%;}
#lightWrapper51{top: 53%; left: 33.8%;}
#lightWrapper52{top: 40%; left: 33.8%;}
#lightWrapper53{top: 26%; left: 33.8%;}
#lightWrapper54{top: 12%; left: 33.8%;}

#lightWrapper55{top: 0%; left: 46.5%;}
#lightWrapper56{top: 13%; left: 46.5%;}
#lightWrapper57{top: 26%; left: 46.5%;}
#lightWrapper58{top: 39%; left: 46.5%;}
#lightWrapper59{top: 51%; left: 46.5%;}
#lightWrapper60{top: 64%; left: 46.5%;}
#lightWrapper61{top: 44%; left: 48.8%;}
#lightWrapper62{top: 33%; left: 50.4%;}
#lightWrapper63{top: 21%; left: 51.8%;}
#lightWrapper64{top: 10%; left: 53.2%;}
#lightWrapper65{top: 0%; left: 54.5%;}
#lightWrapper66{top: 44%; left: 52.6%;}
#lightWrapper67{top: 55%; left: 53.7%;}
#lightWrapper68{top: 64%; left: 54.7%;}

.lightWrapper{
    position: absolute;
    width: 5%;
}

.lightOn,
.lightOff{
    position: absolute;
    width: 100%;
}

#sign{
    position: relative;
    width: 60%;
}

#cowMark5{
    position: relative;
    max-width: 150px;
    width: 9vw;
    margin: min(8vw, 100px) 0;
    left: 50%;
    transform: translateX(-50%) rotate(140deg);
}

@media (max-width:480px)  { 
    #howDoesItWorkBlock{
        width: 90vw;
        margin-bottom: min(7vw, 88px);
    }

    .howTextItem{
        font-size: 4vw;
        margin: 5vw 0;
        width: 87vw;
    }

    .howNumber{
        width: 9vw;
        margin-right: 2vw;
    }

    #howDoesItWorkWrapper{
        flex-direction: column;
    }

    #calcProfitBlock{
        width: 90vw;
    }

    #calcProfitBlock p{
        font-size: 4vw;
    }

    .calcLine{
        font-size: 4vw;
        margin-bottom: 4vw;
    }

    .calcLine input,
    .calcLine select{
        font-size: 4vw;
        width: 38vw;
    }

    .calcLine:last-child{
        margin-top: 6vw;
    }

    #nettoProfit{
        font-size: 8vw;
    }

    #farmWrapper{
        display: none;
        position: relative;
        width: 80vw;
        right: -5vw;
        bottom: 0px;
        margin-bottom: 7vw;
    }

    #cowMark5{
        width: 15vw;
        margin: 15vw 0;
    }
}