[type=radio] {
    display: none;
}

@media only screen and (max-width: 3200px) {
    #slider {
        height: 250px;
        position: relative;
        perspective: 500px;
        transform-style: preserve-3d;
    }

    #slider label {
        margin: auto;
        width: 200px;
        height: 340px;
        border-radius: 0px;
        position: absolute;
        left: 0; right: 0;
        cursor: pointer;
        transition: transform 0.4s ease;

    }
    .imgbreve{
        height: 300px;
    }
}
@media only screen and (max-width: 959px) {
    #slider {
        height: 300px;
        position: relative;
        perspective: 500px;
        transform-style: preserve-3d;
    }

    #slider label {
        margin: auto;
        width: 200px;
        height: 320px;
        border-radius: 0px;
        position: absolute;
        left: 0; right: 0;
        cursor: pointer;
        transition: transform 0.4s ease;
    }
    .imgbreve{
        height: 300px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 959px) {
    #slider {
        height: 300px;
        position: relative;
        perspective: 500px;
        transform-style: preserve-3d;
        margin-bottom: 40%;
    }

    #slider label {
        margin: auto;
        width: 200px;
        height: 320px;
        border-radius: 0px;
        position: absolute;
        left: 0; right: 0;
        cursor: pointer;
        transition: transform 0.4s ease;
    }
    .imgbreve{
        height: 300px;
    }
}
@media only screen and (max-width: 767px) {
    #slider {
        height: 300px;
        position: relative;
        perspective: 500px;
        transform-style: preserve-3d;
    }

    #slider label {
        margin: auto;
        width: 200px;
        height: 320px;
        border-radius: 0px;
        position: absolute;
        left: 0; right: 0;
        cursor: pointer;
        transition: transform 0.4s ease;
    }
    .imgbreve{
        height: 300px;
    }
}
@media only screen and (min-width: 480px) and (max-width: 767px) {
    #slider {
        height: 200px;
        position: relative;
        perspective: 500px;
        transform-style: preserve-3d;
        margin-bottom: 10%;
    }

    #slider label {
        margin: auto;
        width: 120px;
        height: 200px;
        border-radius: 0px;
        position: absolute;
        left: 0; right: 0;
        cursor: pointer;
        transition: transform 0.4s ease;
    }
    .imgbreve{
        height: 180px;
    }
}
@media only screen and (max-width: 479px) {
    #slider {
        height: 100px;
        position: relative;
        perspective: 390px;
        transform-style: preserve-3d;
        margin-bottom: 40%;
    }

    #slider label {
        margin: auto;
        width: 120px;
        height: 200px;
        border-radius: 0px;
        position: absolute;
        left: 0; right: 0;
        cursor: pointer;
        transition: transform 0.4s ease;
    }
    .imgbreve{
        height: 180px;
    }
}


#s1:checked ~ #slide4, #s2:checked ~ #slide5,
#s3:checked ~ #slide1, #s4:checked ~ #slide2,
#s5:checked ~ #slide3 {
    box-shadow: 0 1px 4px 0 rgba(0,0,0,.37);
    transform: translate3d(-150%,0,-200px);
}

#s1:checked ~ #slide5, #s2:checked ~ #slide1,
#s3:checked ~ #slide2, #s4:checked ~ #slide3,
#s5:checked ~ #slide4 {
    box-shadow: 0 6px 10px 0 rgba(0,0,0,.3), 0 2px 2px 0 rgba(0,0,0,.2);
    transform: translate3d(-80%,0,-100px);
}

#s1:checked ~ #slide1, #s2:checked ~ #slide2,
#s3:checked ~ #slide3, #s4:checked ~ #slide4,
#s5:checked ~ #slide5 {
    box-shadow: 0 13px 25px 0 rgba(0,0,0,.3), 0 11px 7px 0 rgba(0,0,0,.19);
    transform: translate3d(0,0,0);
    border-left: 4px solid #000000;
    border-right: 4px solid #000000;

    border-image:
    linear-gradient(
            to bottom,
            #131313,
            rgba(86, 86, 86, 0)
    ) 0 100%;
}

#s1:checked ~ #slide2, #s2:checked ~ #slide3,
#s3:checked ~ #slide4, #s4:checked ~ #slide5,
#s5:checked ~ #slide1 {
    box-shadow: 0 6px 10px 0 rgba(0,0,0,.3), 0 2px 2px 0 rgba(0,0,0,.2);
    transform: translate3d(80%,0,-100px);
}

#s1:checked ~ #slide3, #s2:checked ~ #slide4,
#s3:checked ~ #slide5, #s4:checked ~ #slide1,
#s5:checked ~ #slide2 {
    box-shadow: 0 1px 4px 0 rgba(0,0,0,.37);
    transform: translate3d(150%,0,-200px);
}

#slide1 { background: transparent }
#slide2 { background: transparent }
#slide3 { background: transparent }
#slide4 { background: transparent }
#slide5 { background: transparent }


.reflection {
    position: relative;
    width: auto;
    height: auto;
    margin: auto auto;
}
.reflection-text {
    font: 1.2em sans-serif;
    position: absolute;
    right: 0; bottom: 20px;
    margin: 0;
    padding: 10px;
    background: rgba(255,255,255,.6);
    color: #000;
    transition: padding .3s;
}
.reflection:hover .reflection-text {
    padding-right: 0px;
}

/* reflection the standard way (detecting support) */
@supports (background: -moz-element(#css-element)) {
    .reflection::after{
        content: '';
        position: absolute;
        left: 0; top: 100%;
        width: inherit; height: inherit;
        background: -moz-element(#css-element);
        transform: scaleY(-1);
        mask: url('#mask');
        opacity: .3;
    }
}

/* reflection the old WebKit way*/
.reflection {
    -webkit-box-reflect: below 0 linear-gradient(transparent 80%, rgba(0,0,0,.7));
}

@media only screen and (max-width: 3520px){

    .col-a-1 {width: 8.33%;}
    .col-a-2 {width: 16.66%;}
    .col-a-3 {width: 25%;}
    .col-a-4 {width: 33.33%;}
    .col-a-5 {width: 41.66%;}
    .col-a-6 {width: 50%;}
    .col-a-7 {width: 58.33%;}
    .col-a-8 {width: 66.66%;}
    .col-a-9 {width: 75%;}
    .col-a-10 {width: 83.33%;}
    .col-a-11 {width: 91.66%;}
    .col-a-12 {width: 100%;}
    .col-a-13 {width: 0;visibility: hidden}
    .col-a-14 {width: 16.60%;}
    .col-a-15 {width: 14.28%;}
    .col-a-16 {width: 12.5%;}

    .txtTitulo{
        font-family: 'Raleway', sans-serif;
        display: inline-block;
        font-size: 35px;
        font-weight: 800;
        position: relative;
        line-height: 38px;
        /*  background: rgba(247, 247, 247, 0.3);*/
        padding: 0.5%;
        float: left;
        color: #ffffff;
        text-align: center;
    }

    .txttexto{
        font-family: 'Raleway', sans-serif;
        display: inline-block;
        font-size: 18px;
        font-weight: 200;
        position: relative;
        line-height: 23px;
        /*  background: rgba(247, 247, 247, 0.3);*/
        padding: 2%;
        float: left;
        color: #ffffff;
        text-align: left;
    }

    .txttextoFilme{
        font-family: 'Raleway', sans-serif;
        display: inline-block;
        font-size: 18px;
        font-weight: 200;
        position: relative;
        line-height: 18px;
        /*  background: rgba(247, 247, 247, 0.3);*/
        padding: 2%;
        float: left;
        color: #ffffff;
        text-align: left;
    }
    .brevet{
        margin-top: 2%;
    }

    .txttexto3{
        font-family: 'Raleway', sans-serif;
        display: inline-block;
        font-size: 13px;
        font-weight: 300;
        position: relative;
        letter-spacing: 1px;
        line-height: 16px;
        /*  background: rgba(247, 247, 247, 0.3);*/
        padding: 2%;
        float: left;
        color: #8c8c8c;
        text-align: center;
    }
}

@media only screen and (max-width: 960px){

    .col-b-1 {width: 8.33%;}
    .col-b-2 {width: 16.66%;}
    .col-b-3 {width: 25%;}
    .col-b-4 {width: 33.33%;}
    .col-b-5 {width: 41.66%;}
    .col-b-6 {width: 50%;}
    .col-b-7 {width: 58.33%;}
    .col-b-8 {width: 66.66%;}
    .col-b-9 {width: 75%;}
    .col-b-10 {width: 83.33%;}
    .col-b-11 {width: 91.66%;}
    .col-b-12 {width: 100%;}
    .col-b-13 {width: 0%;visibility: hidden}
}

@media only screen and (max-width: 768px){

    .col-c-1 {width: 8.33%;}
    .col-c-2 {width: 16.66%;}
    .col-c-3 {width: 25%;}
    .col-c-4 {width: 33.33%;}
    .col-c-5 {width: 41.66%;}
    .col-c-6 {width: 50%;}
    .col-c-7 {width: 58.33%;}
    .col-c-8 {width: 66.66%;}
    .col-c-9 {width: 75%;}
    .col-c-10 {width: 83.33%;}
    .col-c-11 {width: 91.66%;}
    .col-c-12 {width: 100%;}
    .col-c-13 {width: 0%;visibility: hidden;padding: 0px}
}

@media only screen and (max-width: 420px){

    .col-d-1 {width: 8.33%;}
    .col-d-2 {width: 16.66%;}
    .col-d-3 {width: 25%;}
    .col-d-4 {width: 33.33%;}
    .col-d-5 {width: 41.66%;}
    .col-d-6 {width: 50%;}
    .col-d-7 {width: 58.33%;}
    .col-d-8 {width: 66.66%;}
    .col-d-9 {width: 75%;}
    .col-d-10 {width: 83.33%;}
    .col-d-11 {width: 91.66%;}
    .col-d-12 {width: 100%;}
    .col-d-13 {width: 0%;visibility: hidden}

    .txtTitulo{
        font-family: 'Raleway', sans-serif;
        display: inline-block;
        font-size: 25px;
        font-weight: 500;
        position: relative;
        line-height: 28px;
        /*  background: rgba(247, 247, 247, 0.3);*/
        padding: 0.5%;
        float: left;
        color: #ffffff;
        text-align: center;
    }
    .txttexto{
        font-family: 'Raleway', sans-serif;
        display: inline-block;
        font-size: 15px;
        font-weight: 200;
        position: relative;
        line-height: 18px;
        /*  background: rgba(247, 247, 247, 0.3);*/
        padding: 2%;
        float: left;
        color: #ffffff;
        text-align: left;
    }

    .txttextoFilme{
        font-family: 'Raleway', sans-serif;
        display: inline-block;
        font-size: 12px;
        font-weight: 200;
        position: relative;
        line-height: 18px;
        /*  background: rgba(247, 247, 247, 0.3);*/
        padding: 2%;
        float: left;
        color: #ffffff;
        text-align: left;
    }

    .brevet{
        margin-top: 5%;

    }
    .txttexto3{
        font-family: 'Raleway', sans-serif;
        display: inline-block;
        font-size: 11px;
        font-weight: 200;
        position: relative;
        letter-spacing: 1px;
        line-height: 14px;
        /*  background: rgba(247, 247, 247, 0.3);*/
        padding: 2%;
        float: left;
        color: #8c8c8c;
        text-align: center;
    }
}

@media only screen and (max-width: 320px){

    .col-e-1 {width: 8.33%;}
    .col-e-2 {width: 16.66%;}
    .col-e-3 {width: 25%;}
    .col-e-4 {width: 33.33%;}
    .col-e-5 {width: 41.66%;}
    .col-e-6 {width: 50%;}
    .col-e-7 {width: 58.33%;}
    .col-e-8 {width: 66.66%;}
    .col-e-9 {width: 75%;}
    .col-e-10 {width: 83.33%;}
    .col-e-11 {width: 91.66%;}
    .col-e-12 {width: 100%;}
    .col-e-13 {width: 0%;visibility: hidden}

    .txtTitulo{
        font-family: 'Raleway', sans-serif;
        display: inline-block;
        font-size: 25px;
        font-weight: 500;
        position: relative;
        line-height: 28px;
        /*  background: rgba(247, 247, 247, 0.3);*/
        padding: 0.5%;
        float: left;
        color: #ffffff;
        text-align: center;
    }

    .txttexto{
        font-family: 'Raleway', sans-serif;
        display: inline-block;
        font-size: 15px;
        font-weight: 200;
        position: relative;
        line-height: 18px;
        /*  background: rgba(247, 247, 247, 0.3);*/
        padding: 2%;
        float: left;
        color: #ffffff;
        text-align: left;
    }

    .txttextoFilme{
        font-family: 'Raleway', sans-serif;
        display: inline-block;
        font-size: 12px;
        font-weight: 200;
        position: relative;
        line-height: 18px;
        /*  background: rgba(247, 247, 247, 0.3);*/
        padding: 2%;
        float: left;
        color: #ffffff;
        text-align: left;
    }

    .brevet{
        margin-top: 5%;
    }

    .txttexto3{
        font-family: 'Raleway', sans-serif;
        display: inline-block;
        font-size: 11px;
        font-weight: 200;
        position: relative;
        letter-spacing: 1px;
        line-height: 14px;
        /*  background: rgba(247, 247, 247, 0.3);*/
        padding: 2%;
        float: left;
        color: #8c8c8c;
        text-align: center;
    }
}