body {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    background-color: #fff;
    color: #646464;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 14pt;
    min-width: 680px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: default;
    overflow-y: visible;
}

.pover_ground {
    position: absolute;
    width: 100%;
    /*max-width: 1920px;*/
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    height: 100%;
    transition: transform ease 0.8s;
}



.pover_master_title {
    position: absolute;
    left: 0;
    padding-left: 78px;
    top: -75px;
    font-size: 2.2em;
    font-weight: 600;
    background-repeat: no-repeat;
    text-align: left;
    height: 64px;
    /* width: 590px; */
    background-size: 48px 48px;
    background-position: 0px 7px;
}

/*.pover_master_title.business {
        background-image: url('../media/symbols/usericonBlue.png');
    }

    .pover_master_title.home {
        background-image: url('../media/symbols/usericonorange.png');
    }

    .pover_master_title.student {
        background-image: url('../media/symbols/usericonGreen.png');
    }*/


.pover_wide_mastercontainer {
    position: relative;
    height: 600px;
    margin: 80px;
    margin-top: 150px;
    margin-bottom: 30px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url('../media/SurfacePro.jpg');
}

    /*IndexÜbernahme*/

    .pover_wide_mastercontainer.index {
        background-image: url('../media/back.jpg');
        /*margin-top: 125px;*/
        height: 490px;
    }


    .pover_wide_mastercontainer.business {
        height: 650px;
        margin-bottom: 42px;
        background-image: url('../media/ProduktübersichtBusinessBack.jpg');
    }

        .pover_wide_mastercontainer.business.neu {
            background-image: url('../media/Business.png');
        }

    .pover_wide_mastercontainer.home.neu {
        height: 650px;
        margin-bottom: 42px;
        background-image: url('../media/Home.png');
    }

    .pover_wide_mastercontainer.student.neu {
        height: 650px;
        margin-bottom: 42px;
        background-image: url('../media/Student.png');
    }


.pover_featurebox {
    position: absolute;
    left: 20px;
    bottom: 50px;
    width: 330px;
    margin: 50px;
    background-color: rgba(240,240,240,0.9);
    padding: 25px;
}

.pover_featurebox_business {
    position: absolute;
    display: flex;
    flex-flow: column;
    right: 20px;
    bottom: -25px;
    width: 330px;
    margin: 50px;
    background-color: rgba(240,240,240,0.9);
    padding: 25px;
}

.pover_featurebox_index {
    position: absolute;
    right: 20px;
    bottom: -36px;
    width: 400px;
    margin: 50px;
    background-color: rgba(255,255,255,0.9);
    /*height: 396px;*/
}

.paddingbox {
    position: relative;
    padding: 20px 30px;
    /*padding-bottom:0;*/
}

.pfb_prod_name {
    font-size: 1.4em;
    color: rgb(255, 115, 0);
    font-weight: 600;
    /*margin-bottom: 10px;*/
}

    .pfb_prod_name.home {
        font-size: 1.4em;
        font-weight: 600;
    }

.pfd_prod_description {
    color: rgb(255, 115, 0);
    margin-bottom: 16px;
}


.featurelistbox {
    font-size: 1.1em;
    position: relative;
    height: 150px;
}

    .featurelistbox.business {
        height: 160px;
        margin-top: 10px;
    }

    .featurelistbox.small {
        height: 100px;
    }


.feature_line {
    position: relative;
    margin-bottom: 3px;
    margin-bottom: 3px;
    color: rgb(64,64,64);
    font-size: 0.8em;
    font-weight: 100;
    background-color: rgb(208, 208, 208);
    padding: 2px;
    padding-left: 31px;
    background-position: 6px center;
    background-repeat: no-repeat;
    background-size: 16px 16px;
    background-image: url('../media/symbols/info_square.svg');
    cursor: pointer;
}

.uvp_price {
    position: absolute;
    color: rgb(115, 115, 115);
    font-size: 1em;
}

    .uvp_price.big {
        font-size: 1.2em;
        margin-bottom: 12px;
    }

    .uvp_price.discount {
        font-size: 1em;
        vertical-align: super;
    }

    .uvp_price b {
        font-weight: 100;
        margin-right: 10px;
    }

    .uvp_price.dark {
        color: #fff;
    }

.left_price_div {
    position: absolute;
    left: 0;
    bottom: 60px;
}

    .left_price_div.small {
        bottom: 37px;
    }

.our_price_text {
    position: relative;
    left: 40px;
    top: 55px;
    color: rgb(115, 115, 115);
    font-weight: 400;
    margin-right: 5px;
}

    .our_price_text.dark {
        color: #fff;
    }

.mwst_text {
    font-size: 0.5em;
    text-align: right;
}

    .mwst_text.dark {
        color: #fff;
    }

    .mwst_text.small {
        position: relative;
        top: 32px;
    }

.product_price {
    position: absolute;
    right: 0;
    color: rgb(255, 115, 0);
    text-align: right;
    font-size: 2.9em;
    font-weight: 400;
    transition: opacity ease 0.3s;
}

    .product_price.big {
        font-size: 3.9em;
    }

    .product_price.small {
        font-size: 2.5em;
    }

.our_price {
    position: relative;
    height: 95px;
    right: 0;
}

    .our_price.dark {
        color: #fff;
    }

    .our_price.small {
        bottom: 23px;
    }

.small_price {
    vertical-align: 40%;
    font-size: 0.6em;
}

.byenow_button {
    padding: 5px;
    text-align: center;
    font-weight: 600;
    color: #fff;
    background-color: rgb(255, 115, 0);
    margin-bottom: 30px;
    margin-top: 5px;
    cursor: pointer;
}

.byenow_button {
    margin-bottom: 8px;
}

.triplebox_container {
    position: relative;
    display: flex;
    flex-flow: wrap;
    align-items: stretch;
    justify-content: space-between;
    /*height: 600px;*/
    margin: 80px;
    margin-top: -45px;
    margin-bottom: 30px;
}

    .triplebox_container.index {
        margin-top: 0px;
    }

    .triplebox_container.indexNeu {
        margin-top: 30px;
    }

.double_flex_container {
    display: flex;
    flex-flow: row;
}


.pover_smallfeaturebox {
    position: relative;
    width: 532px;
    min-height: 680px;
    background-color: #fff;
    margin-top: 30px;
    margin-bottom: 30px;
}

    .pover_smallfeaturebox.index {
        min-height: 10px;
        cursor: pointer;
    }



.product_featureimage {
    position: relative;
    width: 100%;
    height: 300px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
}

    .product_featureimage.index {
        height: 250px;
    }

#studioimage {
    background-image: url('../media/Surface-Studio.jpg');
}

#laptopimage {
    background-image: url('../media/Surface-Laptop.jpg');
}

#bookimage {
    background-image: url('../media/Surface-Book.jpg');
}

.feature_usericon {
    position: absolute;
    top: 10px;
    left: 10px;
    width: 32px;
    height: 32px;
    background-image: url('../media/symbols/usericonorange.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}



/*Änderungen für Student*/

.pfb_prod_name.student {
    color: #89cc00;
}

.product_price.student {
    color: #89cc00;
}

.byenow_button.student {
    background-color: #89cc00;
}

.pfd_prod_description.student {
    color: #89cc00;
}

.feature_usericon.student {
    background-image: url('../media/symbols/usericonGreen.png');
}
/*Ende*/

/*Änderungen für Business*/

.pfb_prod_name.business {
    color: rgb(0,158,227);
}

.product_price.business {
    color: rgb(0,158,227);
}

.byenow_button.business {
    background-color: rgb(0,158,227);
}

.pfd_prod_description.business {
    height: 40px;
    color: rgb(0,158,227);
    margin-top: 2px;
}

.feature_usericon.business {
    background-image: url('../media/symbols/usericonBlue.png');
}
/*Ende*/

.mwLogo {
    position: absolute;
    left: 55px;
    top: 55px;
    height: 55px;
    width: 168px;
    background-image: url('../media/ModernWorkplaceLogo.png');
}


.abo_container {
    position: relative;
    display: flex;
    flex-flow: row;
    align-items: stretch;
    justify-content: space-between;
    margin-top: -15px;
}

.abo_box {
    position: relative;
    width: 105px;
    height: 57px;
    background-color: rgb(238, 238, 238);
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    transition: all ease 0.1s;
}

.pover_featurebox_business .abo_box {
    background-color: rgb(208, 208, 208);
}

.pover_featurebox_business .user_selection_box {
    background-color: rgb(208, 208, 208);
}

/*.abo_box.aktiv {
        color: rgb(0,158,227);
    }*/

.abo_box_innerContent {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.abo_box_price_innerContent {
    position: absolute;
    top: 8px;
    left: 0;
    width: 100%;
    height: 100%;
    transition: all ease 0.3s;
}

.month_text {
    font-size: 0.8em;
}

    .month_text.aktiv {
        display: block;
        margin-top: 17px;
        font-size: 0.9em;
        font-weight: 600;
        color: rgb(0,158,227);
    }

    .month_text.home.aktiv {
        color: rgb(255, 115, 0);
    }

    .month_text.student.aktiv {
        color: #89cc00;
    }


.direct_buy_line {
    text-align: center;
    font-size: 0.9em;
}

.direct_buy_link {
    color: rgb(0,158,227);
    text-decoration: underline;
    cursor: pointer;
}


.price_container {
    position: relative;
    height: 95px;
}

    .price_container.business {
        position: relative;
        height: 115px;
    }

    .price_container.small {
        position: relative;
        top: 26px;
        height: 43px;
    }


.statt_text {
    font-size: 0.8em;
    color: rgb(115, 115, 115);
}

    .statt_text.small {
        font-size: 0.7em;
    }


.discount_text {
    font-size: 1.2em;
}

#pover_json_container {
    position: relative;
}

/*Filter*/
.filter_container {
    /*position: relative;*/
    /*padding-left: 80px;*/
    /*padding-right: 80px;*/
    /*padding-bottom: 45px;*/
    background-color: #eee;
    display: flex;
    flex-wrap: wrap;
    margin-left: 52px;
    margin-right: 25px;
    margin-bottom: 45px;
}


#ChildFilterAnchor > * {
    float: left;
    float: left;
    background-color: #eee;
    display: flex;
    flex-wrap: wrap;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 45px;
}

    /* Nur das erste Kind */
#ChildFilterAnchor > *:first-child {
margin-left: 52px;
}

/* Letztes Kind: kein Float */
#ChildFilterAnchor > *:last-child {
float: none;
}


    .filter_container div:hover {
        -webkit-box-shadow: 0 0.1875rem 0.625rem 0 rgba(75,89,109,0.3);
        -moz-box-shadow: 0 0.1875rem 0.625rem 0 rgba(75,89,109,0.3);
        box-shadow: 0 0.1875rem 0.625rem 0 rgba(75,89,109,0.3);
    }

.filter_right {
    position: relative;
    width: 1000px;
}

.filter_left {
    position: relative;
    width: 700px;
}

.filter_blocks {
    position: relative;
    /*display: flex;
    flex-wrap: wrap;*/
    /*justify-content: space-between;*/
    align-items: stretch;
    width: auto;
    font-size: 0.9em;
}


.filter_text {
    position: relative;
    top: 9px;
    left: 12px;
    color: rgb(0,158,227);
    font-weight: 600;
    font-size: 0.9em;
}

    .filter_text.home {
        color: rgb(255, 115, 0);
    }

    .filter_text.student {
        color: #89cc00;
    }

    .filter_text.hidden {
        display: none;
    }

.selected_text {
    position: relative;
    margin-right: -9px;
    z-index: 6;
    background-color: #eee;
}

.filter {
    position: relative;
    background-color: rgba(255,255,255,0.5);
    width: 300px;
    /*min-width: 195px;*/
    cursor: pointer;
    height: 42px;
    margin-top: 13px;
    margin-right: 25px;
    margin-left: 27px;
    float: left;
}


    .filter.aktiv {
        background-color: rgb(0,158,227);
        color: #fff;
    }

    .filter.home.aktiv {
        background-color: rgb(255, 115, 0);
    }

    .filter.student.aktiv {
        background-color: #89cc00;
    }

    .filter span {
        position: absolute;
        transform: translateY(18%) translateX(12px);
    }

.filter_indi_button {
    position: relative;
    background-color: rgba(255,255,255,0.5);
    width: 49%;
    height: 42px;
    min-width: 223px;
    cursor: pointer;
    margin-top: 9px;
}



    .filter_indi_button span {
        position: absolute;
        transform: translateY(18%) translateX(12px);
    }



    .filter_indi_button.aktiv {
        background-color: rgb(0,158,227);
        color: #fff;
    }

    .filter_indi_button.home.aktiv {
        background-color: rgb(255, 115, 0);
    }

    .filter_indi_button.student.aktiv {
        background-color: #89cc00;
    }

    .filter_indi_button.aktiv .filter_arrow {
        background-image: url('../media/symbols/pfeil_unten.png');
    }

.filter_arrow {
    background-image: url('../media/symbols/pfeil_unten_grey.png');
    background-size: 25px 25px;
    width: 25px;
    height: 25px;
    position: absolute;
    right: 15px;
    top: 8px;
    transition: transform 0.5s;
}

.filter_suche {
    position: relative;
    background-color: rgba(255,255,255,0.5);
    width: 300px;
    height: 42px;
    /*min-width: 223px;*/
    cursor: pointer;
    margin-top: 9px;
    margin-right: 19px;
    margin-left: 25px;
    float: left;
    border: solid;
}

.filter_suche_wide {
    width: 300px;
    float: none;
}

.filter_filter {
    position: relative;
    background-color: rgba(255,255,255,0.5);
    width: 300px;
    height: 42px;
    /*min-width: 223px;*/
    cursor: pointer;
    margin-top: 9px;
    margin-right: 21px;
    margin-left: 25px;
    float: left;
    border: solid;
}



.filter_indi_box {
    position: absolute;
    background-color: #eee;
    top: 59px;
    left: 0;
    width: 100%;
    min-width: 428px;
    z-index: 9;
}


.filter_indi_header {
    position: relative;
    background-color: rgb(0,158,227);
    height: 50px;
    width: 100%;
}

    .filter_indi_header.home {
        background-color: rgb(255, 115, 0);
    }

    .filter_indi_header.student {
        background-color: #89cc00;
    }

    .filter_indi_header div {
        color: #fff;
        position: relative;
        top: 8px;
        left: 17px;
        font-size: 1.2em;
    }

.filter_indi_container {
    position: relative;
    top: 8px;
    width: 100%;
    height: 740px;
    display: flex;
    flex-flow: column;
    background-color: #fff;
}

.filter_indi {
    position: relative;
    height: 42px;
    font-size: 1.1em;
    cursor: pointer;
}

    .filter_indi.aktiv {
        color: rgb(0,158,227);
        background-color: rgb(208, 208, 208);
        background-image: url('../media/symbols/x_blau.svg');
        background-size: 17px 17px;
        background-position: 96% 13px;
        background-repeat: no-repeat;
    }

    .filter_indi.home.aktiv {
        color: rgb(255, 115, 0);
        background-image: url('../media/symbols/x_orange.svg');
    }

    .filter_indi.student.aktiv {
        color: #89cc00;
        background-image: url('../media/symbols/x_gruen.svg');
    }

    .filter_indi:hover {
        background-color: rgba(0,158,227,1);
        color: #fff;
    }

    .filter_indi.home:hover {
        background-color: rgb(255, 115, 0);
        color: #fff;
    }

    .filter_indi.student:hover {
        background-color: #89cc00;
        color: #fff;
    }

    .filter_indi span {
        position: relative;
        top: 5px;
        left: 17px;
    }


.filter_del {
    position: relative;
    z-index: 12;
    font-size: 0.6em;
    color: #646464;
    cursor: pointer;
}

    .filter_del.hidden {
        display: none;
    }

.such_placeholder {
    position: absolute;
    left: 55px;
    top: 6px;
}


.such_icon {
    position: absolute;
    background-color: #fff;
    width: 42px;
    height: 42px;
    background-size: 17px 17px;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url('../media/symbols/search.svg');
}

.filter_icon {
    position: absolute;
    background-color: #fff;
    width: 42px;
    height: 42px;
    background-size: 17px 17px;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url('../media/symbols/Filter.svg');
}


.triplebox_title {
    position: relative;
    left: 80px;
    top: 22px;
    font-size: 2.2em;
    font-weight: 600;
}

.noProductText {
    width: 300px;
    height: auto;
    text-align: center;
    position: relative;
    margin: auto;
    font-size: 2em;
}