@font-face {
    font-family: asphont;
    src: url("../fonts/Asphont-Regular.ttf");
}

body {
    background-color: black;
}

.startpage {
    color: white;
    font-family: "asphont";
    margin: 25px;
    /* align: center; */
}

.header_img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-top: 5%;
    margin-bottom: 5%;
    width: 25%;
    cursor: zoom-out;
}

.backlink {
    cursor: default;
}

.opener {
    display: block;
    font-size: 200%;
    width: 50%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 5%;
    text-align: left;
    text-transform: uppercase;
    font-family: "asphont";
}

.header1 {
    display: block;
    font-size: 300%;
    width: 50%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    text-transform: uppercase;
    font-family: "asphont";
    float:left;
}
.header_table {
    content: "";
    clear:both;
    display:table;
}

.header_c {
    display: block;
    font-size: 300%;
    width: 50%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    text-transform: uppercase;
    font-family: "asphont";
}

.section_img1 {
    float:left;
    width:50%;
    content:url("../img/muziek_bitmapped.png");
}
.section_img1:hover {
    content: url("../img/muziek_button.jpg");
}

.section_img2 {
    float:left;
    width:50%;
    content:url("../img/plantneus_BM.png");
}
.section_img2:hover {
    content: url("../img/plantneus.png");
}

.main_sections {
    content: "";
    clear:both;
    display:table;
}

.footer {
    display: block;
    font-size: 200%;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    text-transform: uppercase;
    font-family: "asphont";
    cursor: crosshair;
}

/*VISUALS PAGE*/

.thumb_img {
    float:left;
    width:100%;
}

.img_wrap {
    position: relative;
    float:left;
    width:50%;
}

.art_sections{
    content: "";
    clear:both;
    display:table;
}

.img_desc {
    white-space: nowrap;
    color: white;
    /* visibility: hidden; */
    opacity: 0;

    font-size: 2vw;

    position: absolute;
    left: 50%;
    top: 50%;

    /* text-align:center; */
    transform: translate(-50%, -50%);

    /* transition effect. not necessary */
    transition: opacity .2s, visibility .2s;
}

.img_desc span{
    background-color:rgba(0, 0, 0, 0.5);
}

.img_wrap:hover .img_desc {
    visibility: visible;
    opacity: 1;
}

#tjeerd_wrap img {
    content: url("../img/thumbnails_visuals/bms/TJEERD_BM.png");
}
#tjeerd_wrap:hover img {
    content: url("../img/thumbnails_visuals/TJEERD.png");
}

#flow_wrap img {
    content: url("../img/thumbnails_visuals/bms/FLOW_BM.png");
}
#flow_wrap:hover img {
    content: url("../img/thumbnails_visuals/FLOW.png");
}

#plant_wrap img {
    content: url("../img/thumbnails_visuals/bms/PLANTVANDALS_BM.png");
}
#plant_wrap:hover img {
    content: url("../img/thumbnails_visuals/PLANTVANDALS.png");
}

#politiek_wrap img {
    content: url("../img/thumbnails_visuals/bms/POLITIEK_BM.png");
}
#politiek_wrap:hover img {
    content: url("../img/thumbnails_visuals/POLITIEK.png");
}

#marktplaats_wrap img {
    content:url("../img/thumbnails_visuals/bms/MARKTPLAATS_BM.png");
}
#marktplaats_wrap:hover img {
    content: url("../img/thumbnails_visuals/MARKTPLAATS.png");
}

#AV2022_wrap img {
    content:url("../img/thumbnails_visuals/bms/AV2022_BM.png");
}
#AV2022_wrap:hover img {
    content:url("../img/thumbnails_visuals/AV2022.png");
}

#rondzang_wrap img {
    content:url("../img/thumbnails_visuals/bms/RONDZANG_BM.png");
}
#rondzang_wrap:hover img {
    content:url("../img/thumbnails_visuals/RONDZANG.png");
}

#zwerm_wrap img {
    content:url("../img/thumbnails_visuals/bms/ZWERM_BM.png");
}
#zwerm_wrap:hover img {
    content:url("../img/thumbnails_visuals/ZWERM.png");
}

#sobsa_wrap img {
    content:url("../img/thumbnails_visuals/bms/sobsa_bm.png");
}
#sobsa_wrap:hover img {
    content:url("../img/thumbnails_visuals/sobsa.png");
}

#orca_wrap img {
    content:url("../img/thumbnails_visuals/bms/ORCA_BM.png");
}
#orca_wrap:hover img {
    content:url("../img/thumbnails_visuals/ORCA.PNG");
}

#fall_wrap img {
    content:url("../img/thumbnails_visuals/bms/FALL_BM.png");
}
#fall_wrap:hover img {
    
    content:url("../img/thumbnails_visuals/FALL.gif");
    object-fit: cover;
}

#AV2021_wrap img {
    content:url("../img/thumbnails_visuals/bms/AV2021_BM.png");
}
#AV2021_wrap:hover img {
    content:url("../img/thumbnails_visuals/AV2021.png");
}

#cursor_wrap img {
    content:url("../img/thumbnails_visuals/bms/CURSOR_BM.png");
}
#cursor_wrap:hover img {
    content:url("../img/thumbnails_visuals/CURSOR.png");
    object-fit: cover;
}

#asphalt_wrap img {
    content:url("../img/thumbnails_visuals/bms/ASPHALT_BM.png");
}
#asphalt_wrap:hover img {
    content:url("../img/thumbnails_visuals/asphalt.png");
    object-fit: cover;
}

/* KUNSTMATIG LEVEN, NATUURLIJKE DOOD */

.backbutton {
    color: white;
    font-family: "Courier New";
    font-size: 10pt;
    /* margin-left: %;  */
}

.video_player {
    display: block;
    position: relative;
    margin-top: 3%;
    margin-left: auto;
    margin-right: auto;
    width:100%;
    height: 600px;
}

.no-margin-mobile{
    display:block;
    max-width: 768px;
    margin: 0 auto !important;
    float: none !important;
    }

.no-margin-mobile {
    display:block;
    margin-left: 25%;
    margin-right: 25%;
}

.video_info {
    display: block;
    color: white;
    font-family: "Courier New";
    font-size: 14pt;
    margin-left: auto;
    margin-right: auto;
    width:100%;
}

.aux_video {
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-top: 2%;
    margin-bottom: 2%;
}

.asphont {
    display: block;
    color: white;
    font-family: "Asphont";
    font-size: 50pt;
    margin-left: auto;
    margin-right: auto;
    width:50%;
}