/** flexbeam **/
div.section-divide {
    background-color: #06c;
    clear: both;
    height: 5px;
    width: 100%;
}

div#flexbeam-title {
    flex-wrap: wrap;
    overflow: hidden;
}

.image-overlay-container img {
    display: block;
    width: 100%;
}

.image-overlay-container img.overlay-graphic {
    display: none;
}

.image-overlay-container img#title-location-image {
    width: 100%;
}

div#flexbeam-flexbeam-title-container {
    flex-basis: 100%;
}

div#flexbeam-title-wrapper {
    box-sizing: border-box;
}

div#flexbeam-title-wrapper div#flexbeam-title-container {
    box-sizing: border-box;
}

div#flexbeam-title-wrapper div#flexbeam-title-container img {
    max-width: 300px;
}

div#introduction img#flexbeam-product-options-image {
    transform: translateX(-15%);
}

div#introduction div#flexbeam-introduction-container p,
div#flexbeam-second-intro p {
    margin: 1em auto;
    max-width: 500px;
}

div#blue-overlay-container img#introduction-location-image,
div#blue-overlay-container img#sound-absorption-location-image {
    width: 100%;
}


div#features-wrapper-flexbeam div#glare-options-container {
    height: 541px;
}

div#features-wrapper-flexbeam div#glare-options-container div.glare-control-options {
    left: 50%;
    opacity: 0;
    position: absolute;
    top: 0;
    transform: translateX(-50%);
    transition: 0.2s;
}

div#features-wrapper-flexbeam div#glare-options-container div.glare-control-options.active {
    opacity: 1;
    transition: 0.2s;
}

div#features-wrapper-flexbeam div#glare-option-black {
    background: black;
    border: 1px solid black;
}

div#features-wrapper-flexbeam div#glare-option-metallised {
    background: #706f6f;
}

div#features-wrapper-flexbeam div#glare-option-metallised,
div#features-wrapper-flexbeam div#glare-option-metallised,
div#features-wrapper-flexbeam div#glare-option-black {
    border: 1px solid #706f6f;
}

div#features-wrapper-flexbeam div#glare-option-white {
    background: #fff;
    border: 1px solid #706f6f;
}

div#features-wrapper-flexbeam div#glare-option-black img {
    display: block;
}

div#features-wrapper-flexbeam div#glare-option-black-button {
    background: #000000;
    border: 2px solid #000000;
    color: #fff;
}

div#features-wrapper-flexbeam div#control-glare div.glare-button {
    margin: auto 0.4em;
    width: 100px;
}

div#features-wrapper-flexbeam div#control-glare div.glare-button.active {
    box-shadow: 0 0 0 6px #06c;
}

div#features-wrapper-flexbeam div#glare-option-black-button.active,
div#features-wrapper-flexbeam div#glare-option-metallised-button.active,
div#features-wrapper-flexbeam div#glare-option-white-button.active {
    border: 2px solid #fff;
}

div#features-wrapper-flexbeam div#glare-option-black-button:hover {
    background: #fff;
    border: 2px solid #000000;
    color: #333;
}

div#features-wrapper-flexbeam div#glare-option-metallised-button {
    background: #706f6f;
    border: 2px solid #706f6f;
    color: #fff;
}

div#features-wrapper-flexbeam div#glare-option-metallised-button:hover {
    background: #fff;
    border: 2px solid #706f6f;
    color: #333;
}

div#features-wrapper-flexbeam div#glare-option-white-button {
    background: #fff;
    border: 2px solid #c3c3c3;
}

div#features-wrapper-flexbeam div#glare-option-white-button:hover {
    background: #c8c8c8;
    border: 2px solid #706f6f;
}

div#features-wrapper-flexbeam div.glare-control-options {
    max-width: 1300px;
    width: 90%;
}

div.glare-control-options div.glare-options-text-container {
    padding: 1em 1em 0 1em;
}

div#features-wrapper-flexbeam div.glare-options-text-container p.glare-options-ugr {
    font-size: 3em;
}

div#features-wrapper-flexbeam div#glare-options-container img.glare-image {
    display: block;
    width: 100%;
}

div#features-wrapper-flexbeam div#glare div.glare-button {
    margin: 0.5em;
    width: 130px;
}

div#features-wrapper-flexbeam div#glare div.glare-button.active {
    box-shadow: 0 0 0 6px #06c;
}

div#absorption-image-wrapper {
    position: relative;
}

div#absorption-image-wrapper img {
    width: 100%;
}

div.absorption-pointer {
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    border-radius: 25px;
    box-sizing: border-box;
    display: block;
    height: 25px;
    position: absolute;
    text-align: center;
    transition: background-color 0.5s;
    width: 25px;
}

.absorption-pointer:hover {
    background-color: #06c;
    cursor: pointer;
    transition: background-color 0.5s;
}

div#absorption-pointer-one {
    left: 40%;
    top: 20%;
}

div#absorption-pointer-two {
    right: 16%;
    top: 50%;
}

div#absorption-pointer-three {
    bottom: 16%;
    left: 50%;
}

div#acoustic-absorption h2 {
    margin-top: 1em;
    text-align: center;
}

div#acoustic-absorption p,
div#absorption-second-text p {
    margin: 1em auto;
    max-width: 500px;
}

div#absorption-second-text {
    margin: 0 auto 2em auto;
}

div#absorption-second-strip img {
    box-sizing: border-box;
    max-width: 700px;
}

div#sound-solution h2 {
    margin-top: 1em;
    text-align: center;
}

div#sound-solution p {
    margin: 1em auto;
    max-width: 500px;
}

#application-examples-wrapper {
    display: flex;
    flex-wrap: wrap;
}

.application-more-button {
    margin-top: 1em;
}

.application-example-box {
    border: solid 1px #06c;
    border-radius: 16px;
    box-sizing: border-box;
    margin: 1em auto;
    max-width: 400px;
    overflow: hidden;
    padding-bottom: 1em;
    width: 90%;
}

#application-examples-note-container {
    max-width: 1000px;
    width: 90%;
}

#application-examples-note-container p {
    margin: 1em auto;
}

.application-details {
    display: none;
}

img.reverberation-graph {
    box-sizing: border-box;
}

div#plastic-bottle-banner-wrapper {
    position: relative;
}

div#plastic-bottles-text-container {
    left: 50%;
    max-width: 500px;
    position: absolute;
    top: 50%;
    transform: translateX(-50%);
    width: 90%;
}

div#plastic-bottles-text-container img {
    width: 50px;
}

div#performance {
    overflow: hidden;
}

div#performance h2 {
    margin: auto;
    max-width: 500px;
    text-align: center;
}

div#performance p {
    margin: 1em auto;
    max-width: 500px;
}

img#plastic-bottle-background {
    display: block;
    height: 360px;
    max-width: unset;
    transform: translateX(-25%);
}

div#splash-of-colour-wrapper img#splash-of-colour-background {
    display: block;
    width: 100%;
}

div#splash-of-colour-wrapper {
    position: relative;
}

div#splash-of-colour-text-container {
    text-align: center;
}

div#splash-of-colour-text-container p {
    margin: 1em auto;
    max-width: 500px;
}

div#flexbeam-colour-choice-container {
    text-align: center;
    width: 100%;
}

div#flexbeam-colour-choice-container div#flexbeam-standard-colours {
    border: solid 1px #333;
    border-radius: 2rem;
    box-sizing: border-box;
    height: fit-content;
    margin: auto;
    padding: 1em;
    width: 90%;
}

div#flexbeam-colour-choice-container div#flexbeam-special-colours {
    border: solid 1px #333;
    border-radius: 2rem;
    box-sizing: border-box;
    margin: 2em auto;
    padding: 1em;
    width: 90%;
}

img#flexbeam-smartscan-diagram {
    margin-left: 2em;
}

@media screen and (min-width: 700px) {
    div#features-wrapper-flexbeam div.glare-control-options {
        display: flex;
    }

    div#features-wrapper-flexbeam div.glare-control-options div.glare-options-text-container {
        flex-basis: 33.333%;
    }

    div#features-wrapper-flexbeam div.glare-control-options {
        flex-wrap: wrap;
    }

    div#features-wrapper-flexbeam div#glare-options-container img.glare-image {
        width: 56%;
    }

    div.absorption-pointer {
        height: 40px;
        width: 40px;
    }

    img#plastic-bottle-background {
        height: 400px;
    }
}

@media screen and (min-width: 1024px) {
    img#plastic-bottle-background {
        height: 500px;
    }
}

@media screen and (min-width: 1280px) {
    div#flexbeam-title-wrapper div#flexbeam-title-container img {
        max-width: 500px;
    }

    .image-overlay-container {
        opacity: 1;
        position: relative;
        transform: translateX(0);
        transition: 3s;
    }

    .image-overlay-container img.overlay-graphic {
        display: block;
    }

    div#introduction div#flexbeam-introduction-container p,
    div#flexbeam-second-intro p {
        margin: revert;
    }

    div#flexbeam-title-container {
        flex-basis: 50%;
        max-width: 500px;
        padding-top: 4em;
    }

    div#flexbeam-title-container div#title-container img {
        max-width: 500px;
    }

    .left-image-overlay img.overlay-graphic,
    .right-image-overlay img.overlay-graphic {
        bottom: 0;
        height: 100%;
        position: absolute;
        top: 0;
        width: initial;
    }

    .left-image-overlay img.overlay-graphic {
        left: -1px;
    }

    .right-image-overlay img.overlay-graphic {
        right: -1px;
    }

    div#flexbeam-title-wrapper {
        flex-basis: 50%;
    }

    div#introduction {
        overflow: hidden;
    }

    div#introduction div#flexbeam-introduction-container {
        margin-top: 17%;
    }

    div#introduction div#flexbeam-introduction-container h2 {
        text-align: left;
    }

    div#flexbeam-second-intro-strip {
        overflow: hidden;
    }

    div#flexbeam-second-intro-strip div#flexbeam-second-intro {
        margin-top: 5%;
    }

    div#features-wrapper-flexbeam div#glare div.glare-button {
        margin: auto 0.5em;
        width: 120px;
    }

    div#features-wrapper-flexbeam div#glare-options-strip {
        overflow: hidden;
    }

    div#features-wrapper-flexbeam div.glare-control-options div.glare-options-text-container {
        padding-left: 4em;
        padding-top: 7em;
    }

    div#acoustic-absorption {
        overflow: hidden;
    }

    div#absorption-second-strip {
        overflow: hidden;
    }

    div.absorption-pointer {
        height: 50px;
        width: 50px;
    }

    div#absorption-second-text {
        margin: 8% auto;
    }

    div#acoustic-absorption p,
    div#absorption-second-text p {
        margin: revert;
    }

    div#acoustic-absorption h2 {
        margin-top: 28%;
        text-align: left;
    }

    div#sound-solution {
        overflow: hidden;
    }

    div#sound-solution h2 {
        margin-top: 14%;
        text-align: left;
    }

    div#sound-solution p {
        margin: revert;
        max-width: 500px;
    }

    #application-examples {
        overflow: hidden;
    }

    #application-examples-wrapper {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        width: unset;
    }

    .application-more-button {
        display: none;
    }

    .application-example-box {
        margin: 1em;
    }

    .application-details {
        display: block;
    }

    img#plastic-bottle-background {
        display: block;
        height: unset;
        transform: none;
        width: 100%;
    }

    div#plastic-bottles-text-container img {
        margin-top: 1em;
        width: 60px;
    }

    div#performance h2,
    div#performance p {
        margin: 1em 0;
    }

    div#performance h2 {
        text-align: left;
    }

    div#splash-of-colour-wrapper {
        overflow: hidden;
        position: relative;
    }

    div#splash-of-colour-wrapper img#splash-of-colour-background {
        display: block;
        opacity: 0;
        transition: 2s;
        width: 100%;
    }

    div#flexbeam-smartscan-section {
        overflow: hidden;
    }

    img#flexbeam-smartscan-diagram {
        width: 90%;
    }
}

@media screen and (min-width: 1600px) {
    div#splash-of-colour-wrapper div#splash-of-colour-text-container {
        bottom: 23%;
        left: 16.6%;
        max-width: 500px;
        opacity: 0;
        position: absolute;
        text-align: left;
        transform: translateX(-50%);
        transition: 3s;
        width: 25%
    }

    div#splash-of-colour-wrapper div#flexbeam-colour-choice-container {
        bottom: 5em;
        display: flex;
        opacity: 0;
        position: absolute;
        right: 6%;
        transform: translateX(50%);
        transition: 3s;
    }

    div#flexbeam-colour-choice-container div#flexbeam-standard-colours {
        border: solid 1px #333;
        box-sizing: border-box;
        height: 250px;
        margin-right: 1em;
        padding: 1em;
        width: 281px;
    }

    div#flexbeam-colour-choice-container div#flexbeam-special-colours {
        border: solid 1px #333;
        box-sizing: border-box;
        margin: unset;
        padding: 1em;
        height: 250px;
        width: 535px;
    }

    div#performance h2 {
        margin-top: 3em;
    }
}

@media screen and (min-width: 2000px) {
    div#flexbeam-title-container {
        padding-top: 10em;
    }

    div#flexbeam-second-intro-strip div#flexbeam-second-intro {
        margin-top: 6%;
    }

    div#absorption-pointer-two {
        right: 27%;
    }

    .application-example-box {
        max-width: 500px;
    }

    div#absorption-second-text {
        margin: 7% auto;
    }

    div#plastic-bottles-text-container img {
        width: 100px;
    }

    div#performance h2 {
        margin-top: 30%;
    }

    div#splash-of-colour-wrapper div#splash-of-colour-text-container {
        bottom: 17%;
    }

    div#splash-of-colour-wrapper div#flexbeam-colour-choice-container {
        right: 16%;
    }
}