/* Feature Boxes */

.layout-3 {
    background-color: #D4E4F1;
    height: 448px;
    margin: 0 auto;
    max-width: 1364px;
    padding-top: 53px;
}

.layout-3__container {
    display: -webkit-box;  
	display: -ms-flexbox;
	display: flex;
    height: 342px;
    margin: 0 auto;
    position: relative;
    width: 1026px;
}

.layout-3__container a {
    position: absolute;
    text-decoration: none;
}

.left {
    left: -30%;
}

.centre {
    left: 342px;
}

.right {
    right: -30%;
}

.layout-3__box {
    height: 342px;
    text-align: center;
    width: 341.5px;
}

.layout-3__box:hover {
    opacity: 0.8;
}

.layout-3__box__icon {
    background-size: cover;
    height: 258px;
}

.layout-3__box__textDiv {
    height: 84px;
}

.layout-3__box__textDiv__title, 
.layout-3__box__textDiv__discover {
    color: #ffffff;
}

.layout-3__box__textDiv__title {
    font-size: 1.4em;
    font-weight: 700;
    padding: 0.5em;
}

.layout-3__box__textDiv__title {
    font-weight: 500;
}

.layout-3__box__textDiv__discover {
    font-size: 0.9em;
    font-weight: 300;
}

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

    .layout-3__container {
        height: 250px;
        width: 750px;
    }

    .layout-3__box {
        height: 250px;
        width: 250px;
    }

    .layout-3__box__icon {
        height: 210px;
    }

    .centre {
        left: 250px;
    }
}

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

    .layout-3__container {
        height: 200px;
        width: 600px;
    }

    .layout-3__box {
        height: 200px;
        width: 200px;
    }

    .layout-3__box__icon {
        height: 150px;
    }

    .centre {
        left: 200px;
    }
}

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

    .layout-3 {
        height: auto;
        padding: 80px 0;
    }
    
    .layout-3__container {
        display: block;
        height: 1026px;
        width: 342px;
    }

    .layout-3__container a {
        position: relative;
    }

    .layout-3__box {
        display: block;
        height: 342px;
        width: 342px;
    }

    .layout-3__box__icon {
        height: 258px;
    }

    .centre {
        left: 0px;
    }
}

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

    .layout-3__container {
        width: 100%;
    }

    .layout-3__box {
        width: 100%;
    }

}