

#lab {
    overflow: hidden;
    position: relative;
    margin: 0 auto;
    margin-bottom: 4.375em;
    -webkit-transition: all ease 500ms;
    -moz-transition: all ease 500ms;
    -o-transition: all ease 500ms;
    -ms-transition: all ease 500ms;
    transition: all ease 500ms;
}



.beaker {
    -webkit-filter: drop-shadow(#424242 0px 1px 0px);
    border-bottom: 2em solid #FFF;
    border-left: 1em solid transparent;
    border-right: 1em solid transparent;
    border-radius: .5em;
    height: 0;
    width: 1em;
    position: absolute;
    right: 0.7em;
    bottom: 22%;
    font-size: 0.6em;
}

.beaker::before {
    border-left: .25em solid #FFF;
    border-radius: .25em;
    border-right: .25em solid #FFF;
    content: '';
    height: .25em;
    left: -.25em;
    position: absolute;
    top: -1em;
    width: 1em;
}

.beaker::after {
    border-left: .25em solid #FFF;
    border-right: .25em solid #FFF;
    content: '';
    height: 1em;
    left: 0;
    position: absolute;
    top: -1em;
    width: .5em;
}

.sectionheader {
    position: relative;
}

.lab_item {
    width: 200px;
    height: 230px;
    position: relative;
    display: inline-block;
}

.hexagon2 {
    position: absolute;
    width: 200px;
    height: 400px;
    top: -85px;
}

.hexagon {
    overflow: hidden;
    visibility: hidden;

    -webkit-transform: rotate(120deg);
    -moz-transform: rotate(120deg);
    -o-transform: rotate(120deg);
    -ms-transform: rotate(120deg);
    transform: rotate(120deg);
    cursor: pointer;
}

.hexagon-in1 {
    overflow: hidden;
    width: 100%;
    height: 100%;

    -webkit-transform: rotate(-60deg);
    -moz-transform: rotate(-60deg);
    -o-transform: rotate(-60deg);
    -ms-transform: rotate(-60deg);
    transform: rotate(-60deg);
}

.hexagon-in2 {
    -webkit-box-shadow: inset 0 0 0 0px #18879f;
    box-shadow: inset 0 0 0 0px #18879f;
    overflow: hidden;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: 50%;

    -webkit-background-size: 176%;
    -moz-background-size: 176%;
    background-size: 176%;
    visibility: visible;

    -webkit-transform: rotate(-60deg);
    -moz-transform: rotate(-60deg);
    -o-transform: rotate(-60deg);
    -ms-transform: rotate(-60deg);
    transform: rotate(-60deg);

    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    transition: all 0.5s ease;

}

.hexagon-in2:hover {

    -webkit-box-shadow: inset 0 0 0 200px rgba(176, 218, 212, 0.48);
    box-shadow: inset 0 0 0 200px rgba(176, 218, 212, 0.48);
}

#lab article {
    padding-top: 3.813em;
    width: 71%;
    margin: 0 auto;
}

.lab_item:nth-child(7n-2) {
    margin-left: 101px;
}

.lab_item:nth-child(n+5) {
    margin-top: -55px;
}

@media (max-width: 960px) {
    #lab {
        width: 100%;
    }

}

@media (max-width: 820px) {
    .lab_item:nth-child(5n-1) {
        margin-left: 102px;
    }

    .lab_item:nth-child(n+4) {
        margin-top: -62px;
    }

    .lab_item:nth-child(7n-2) {
        margin-left: 0px;
    }

    .lab_item:nth-child(n+5) {
        margin-top: -56px;
    }

    #lab article {
        width: 610px;
    }

}

@media (max-width: 640px) {
    #lab article {
        width: 405px;
    }

    .lab_item:nth-child(5n-1) {
        margin-left: 0px;
    }

    .lab_item:nth-child(3n) {
        margin-left: 102px;
    }

    .lab_item:nth-child(n+3) {
        margin-top: -56px;
    }

}