@media only screen and (min-width: 320px) {
    .content {
        padding: 30px 20px 30px 20px;
        background-position: center;
        background-size: cover;
        background-attachment: fixed;
        display: flex;
        justify-content: center;
        height: auto !important;
        min-height: calc(100% - 550px);
    }

    .contentArea img {
        width: 100%;
    }

    .el-instal {
        background-image: linear-gradient(rgba(255,255,255,0.7), rgba(255,255,255,0.7)), url(../billeder/omosmobil.png);
    }

    .omos {
        background-image: linear-gradient(rgba(255,255,255,0.7), rgba(255,255,255,0.7)), url(../billeder/omosmobil.png);
    }

    .forside {
        background-image: linear-gradient(rgba(255,255,255,0.7), rgba(255,255,255,0.7)), url(../billeder/indexmobil1.png);
    }

    .kontakt {
        background-image: linear-gradient(rgba(255,255,255,0.7), rgba(255,255,255,0.7)), url(../billeder/kontaktMobil.jpg);
    }

    .referencer {
        display: block;
    }

    .billedeTekst {
        font-size: 0.7em !important;
    }

    .contentArea {
        max-width: 100%;
    }

    .contentArea h1 {
        font-size: 2em;
    }

    .contentArea p {
        font-size: 1em;
    }

    .billede {
        position: relative;
        margin: 30px 0;
    }

    .billedeTekst {
        position: absolute;
        bottom: 0;
        margin: 0;
        background: rgba(255,255,255,0.7);
        padding: 10px;
    }

    .kontakt div i {
        margin: 10px 20px;
        padding: 0;
    }

    .kontakt div a {
        text-decoration: none;
        color: #000;
    }

    .btn {
        border-radius: 50px;
        background-image: linear-gradient(to bottom, #292828, #4c4c4c);
        color: #FFF200;
        border: none;
        padding: 10px 30px;
        font-weight: bold;
        text-transform: uppercase;
        outline: none;
    }

    .forside .billede {
        height: auto;
        object-fit: initial;
        margin: 0;
    }

    .omos .billede {
        margin: 0;
    }

    .forside .billede img {
        width: 100%;
        height: auto;
    }
}

@media only screen and (min-width: 480px) {  
    .contentArea {
        width: 800px;
    }

    .contentArea p {
        font-size: 1.2em;
    }

    .contentArea ul {
        font-size: 1.2em;
    }

    .btn {
        font-size: 1.2em;
    }

}

@media only screen and (min-width: 768px) { 
    .content {
        min-height: calc(100% - 360px);
    } 
}

@media only screen and (min-width: 992px) {  
    .content {
        justify-content: initial;
        flex-direction: row-reverse;
        padding: 30px 20px 30px 20px;
    }

    .referencer .contentArea {
        width: 100%;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        display: flex;
    }

    .referencer {
        width: 100%;
        display: block !important;
    }

    .referencer p {
        font-size: 1.2em;
    }

    .billedeTekst {
        font-size: 1em !important;
    }

    .billede {
        width: 800px;
        height: 600px;
        object-fit: cover;
        margin: 20px;
    }

    .billede img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}

@media only screen and (min-width: 1200px) {
    .content {
        padding-right: 10em;
    }

    .referencer {
        padding-left: 0em;
        padding-right: 0em;
    }

    

    .el-instal {
        background-image: url(../billeder/omosO.png);
    }

    .omos {
        background-image: url(../billeder/omosO.png);
    }

    .forside {
        background-image: url(../billeder/indexsized.png);
    }

    .kontakt {
        background-image: url(../billeder/kontaktDesktop.jpg);
    }

    /* .referencer {
        background-image: url(../billeder/omosO.png);
    } */
}