.header {
        height: 80px;
        width: 100%;
        background-color: #36435F;
    }
    
    .header img {
        padding: 10px;
        margin: auto;
        display: block;
    }
    
    .calosc {
        width: 100%;
        position: relative;
        z-index: 1;
        margin: 10px auto;
        max-width: 1110px;
        left: 25px;
    }
    
    #foto1 {
        float: left;
        width: 51%;
        position: relative;
        z-index: 2;
        left: 4.4%;
    }
    
    #foto1 a img {
        /* -webkit-filter: saturate(0%);
        -moz-filter: saturate(0%);
        -o-filter: saturate(0%);
        -ms-filter: saturate(0%);
        filter: saturate(0%); */
    }
    
    #foto2 a img {
        -webkit-filter: saturate(0%);
        -moz-filter: saturate(0%);
        -o-filter: saturate(0%);
        -ms-filter: saturate(0%);
        filter: saturate(0%);
    }
    
    #foto1 a img:hover {
        /* -webkit-filter: saturate(100%);
        -moz-filter: saturate(100%);
        -o-filter: saturate(100%);
        -ms-filter: saturate(100%);
        filter: saturate(100%); */
    }
    
    #foto2 a img:hover {
        /* -webkit-filter: saturate(0%);
        -moz-filter: saturate(0%);
        -o-filter: saturate(0%);
        -ms-filter: saturate(0%);
        filter: saturate(0%); */
    }
    
    #foto2 {
        float: left;
        width: 30%;
        position: relative;
        z-index: 1;
        right: 0.4%;
    }
    
    #foto1 a p {
        position: absolute;
        z-index: 99999;
        left: 0px;
        right: 3vw;
        margin: auto;
        bottom: 0;
        text-align: center;
        font-size: 1.5em;
        font-weight: bold;
        background: rgba(255, 255, 255, 0.2);
        height: 30%;
        width: 60%;
        color: #36435F;
        padding: 15px;
        border-radius: 10px 10px 0px 0px;
    }
    
    #foto2 a p {
        position: absolute;
        z-index: 99999;
        left: 2vw;
        right: 0;
        margin: auto;
        bottom: 0;
        text-align: center;
        font-weight: bold;
        font-size: 1.5em;
        background: rgba(255, 255, 255, 0.2);
        height: 30%;
        width: 80%;
        color: #36435F;
        padding: 0px;
        border-radius: 10px 10px 0px 0px;
    }
    
    @media screen and (max-width: 700px) {
        #foto1 a p {
            position: absolute;
            z-index: 99999;
            left: 0px;
            right: 3vw;
            margin: auto;
            bottom: 0;
            text-align: center;
            font-size: 0.5em;
            font-weight: bold;
            background: rgba(255, 255, 255, 0.2);
            height: 32%;
            width: 60%;
            color: #36435F;
            padding: 10px;
            border-radius: 10px 10px 0px 0px;
        }
        #foto2 a p {
            position: absolute;
            z-index: 99999;
            left: 2vw;
            right: 0;
            margin: auto;
            bottom: 0;
            text-align: center;
            font-weight: bold;
            font-size: 0.5em;
            background: rgba(255, 255, 255, 0.2);
            height: 32%;
            width: 80%;
            color: #36435F;
            padding: 0px;
            border-radius: 10px 10px 0px 0px;
        }
    }