button, hr, input {
    overflow: visible
}

progress, sub, sup {
    vertical-align: baseline
}

[type=checkbox], [type=radio], legend {
    box-sizing: border-box;
    padding: 0
}

html {
    line-height: 1.15;
    -webkit-text-size-adjust: 100%
}

body {
    margin: 0
}



hr {
    box-sizing: content-box;
    height: 0
}

code, kbd, pre, samp {
    font-family: monospace, monospace;
    font-size: 1em
}

a {
    background-color: transparent
}

abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    text-decoration: underline dotted
}

b, strong {
    font-weight: bolder
}

small {
    font-size: 80%
}

sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative
}

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

img {
    border-style: none
}

button, input, optgroup, select, textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0
}

button, select {
    text-transform: none
}

[type=button], [type=reset], [type=submit], button {
    -webkit-appearance: button
}

[type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner, button::-moz-focus-inner {
    border-style: none;
    padding: 0
}

/* [type=button]:-moz-focusring, [type=reset]:-moz-focusring, [type=submit]:-moz-focusring, button:-moz-focusring {
    outline: ButtonText dotted 1px
} */

fieldset {
    padding: .35em .75em .625em
}

legend {
    color: inherit;
    display: table;
    max-width: 100%;
    white-space: normal
}

textarea {
    overflow: auto
}

[type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button {
    height: auto
}

[type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

details {
    display: block
}

summary {
    display: list-item
}

[hidden], template {
    display: none
}

.clearfix {
    clear: both;
}

body {
    font-family: Helvetica, Arial, sans-serif;
    background-color: #fff;
    font-size: 16px;
    color: #999;
    word-break: break-word;
}
div {
    box-sizing: border-box;
}

.product-head h1{
color: #008243;
}

.container {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    margin-bottom: 10px;
    padding: 10px;
}

.logo-wrapper{
    display: flex;
    margin-bottom: 20px;
    margin-top: 10px;
}

.hero{
    display: flex;
    flex-wrap: wrap;
}

.gallery, .product-head{
    position: relative;
    width:50%;
}

.gallery{
    padding-top: 15px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.product-head{
    padding-left: 20px;
}

.main-img{
    width: 70%;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    margin: 0 auto;
}

.thumbnails-wrapper{
    white-space: nowrap;
    overflow-x: hidden;
    position: absolute;
}

.thumbnail{
    width: 100px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
    max-width: 15vw;
    border: 1px solid rgba(170, 170, 170, 0.89);
    display: inline-block;
}

.thumbnail:hover{
    border-color: #000000;
}

.thumbnail.active{
    border-color: #000000;
}

.aspect-1-1::before {
    content: "";
    float: left;
    padding-bottom: 100%;
}

.aspect-1-1::after,.aspect-16-9::after,.aspect-4-3::after {
    clear: left;
    content: " ";
    display: table;
}

.arrow-left, .arrow-right{
    position: absolute;
    top: 30%;
    transform: translateY(-50%);
    cursor: pointer;
}

.arrow-right:after{
    content: "";
    position: absolute;
    transform: rotate(-45deg);
border-right: 3px solid #008243;
border-bottom: 3px solid #008243;
width: 20px;
height: 20px;
margin-top: 10px;
}

.arrow-left:after{
    content: "";
    position: absolute;
    transform: rotate(135deg);
border-right: 3px solid #008243;
border-bottom: 3px solid #008243;
width: 20px;
height: 20px;
margin-top: 10px;
margin-left: 10px;
}

.arrow-left, .arrow-right {
    top: 50%;
    height: 46px;
    width: 35px;
    z-index: 9999;
}

.arrow-left {
    left: 20px;
}
.arrow-right{
    right: 20px;
}

.thumbnails .arrow-left, .thumbnails .arrow-right{
    top: 40%;
}

.thumbnails .arrow-left {
    left: 0px;
}
.thumbnails .arrow-right{
    right: 0px;
}

.arrow-left:hover, .arrow-right:hover{
    background-color: #cccccc;
}

.thumbnails{
    position: relative;
    margin-top: 15px;
}

.thumbnails-slider{
    overflow-x: hidden;
    position: relative;
    height: 120px;
    width: CALC(100% - 60px);
    margin-left: 30px;
}

.main-img-wrapper{
    position: relative;
}


#details .video img{
    width: 100%;
    cursor: pointer;
}

#details .video{
    position: relative;
}

.play-btn {
    width: 180px;
    height: 100px;
    background-image: url('data:image/false;base64,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');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    opacity: .7;
    cursor: pointer;
    filter: invert(100%);
    position: absolute;
    top:50%;
    left:50%;
    transform: translateX(-50%) translateY(-50%);
}

.play-btn:hover {
    opacity: 1;
}

#details .video:hover .play-btn {
    opacity: 1;
}

#details .slider{
    position: relative;
}

#details .slider img{
    width: 100%;
}

#details .slider .text{
    width: 50%;
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    padding: 20px;
    display: flex;
    align-items: center;
    padding-left: 60px;
}

#details .slider .text div{
    background-color: rgba(0, 0, 0, 0.8);
    color: white;
    padding: 20px;
}

#details .slider{
    display: none;
}

#details .slider.active{
    display: block;
}

#details .slider-wrapper{
    position: relative;
}

#details .bg-img{
    position: relative;
}

#details .bg-img img{
    width: 100%;
}

#details .bg-img .text{
    width: 50%;
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    padding: 20px;
    display: flex;
    align-items: center;
}

#details .bg-img .text div{
    background-color: rgba(255, 255, 255, 0.8);
    color: black;
    padding: 20px;
}

#details .bg-img h5{
    font-size: 16px;
    margin: 6px 0;
}

#details .bg-img h1{
    font-size: 26px;
    margin: 8px 0;
}

#details .bg-img p{
    font-size: 16px;
    margin-bottom: 0;
}

#details .tooltips{
    position: relative;
}

#details .tooltips img{
    width: 100%;
}

.bubble{
    cursor: pointer;
    width: 35px;
    height: 35px;
    background-color: rgba(0, 163, 229, 0.54);
    border: 1px solid white;
    border-radius: 100%;
    position: absolute;
    transform: translateX(-50%) translateY(-50%);
    transition: background-color .3s;
}

.bubble:hover{
background-color: #008243;
}

.tab{
    float: left;
    padding: 10px 16px;
    margin-right: 1px;
    cursor: pointer;
    font-weight: 400;
    transition: opacity .5s, background-color .5s, color .5s;
}

.tab.active{
    margin-bottom: 0px;
background-color: #008243;
color: white;
}

.tab:hover{
    opacity: .8;
background-color: #008243;
color: black;
}

.content{
    padding:30px;
border: 1px solid #008243;
}

.content img{
    display: block;
}

#details{
    padding: 10px;
    color: black;
}

table {
    border-collapse: collapse;
}
td{
    padding: 7px;
}

td{
    border-top: 1px solid #a8a8a8;
}
tr:first-of-type td{
    border-top: none;
}

.downloads-wrapper a{
    color: white;
    background-color: rgb(117, 117, 117);
    padding: 7px 15px;
    text-decoration: none;
    border-radius: 3px;
}

.downloads-wrapper a:hover{
    background-color: rgb(148, 148, 148);
}

li{
    margin-bottom: 10px;
    line-height: 20px;
    font-size: 14px;
}
ul{
    padding-left: 24px;
}


.tooltip{
    position: absolute;
    background-color: rgba(255, 255, 255, 0.9);
    padding: 5px 15px;
    width: 450px;
    bottom: 45px;
    right: 18px;
    transform: translateX(50%);
    z-index: 999;
    border-radius: 7px;
    font-size: 13px;
    line-height: 19px;
    color: #999;
    text-align: center;
    pointer-events: none;
    border: 1px solid #999;
}
.tooltip:after{
    content: "";
    width: 10px;
    height: 10px;
    background-color: #ffffff;
    position: absolute;
    bottom: -2px;
    left: 50%;
    border-bottom: 1px solid #999;
    border-left: 1px solid #999;
    transform: rotate(-45deg) translateX(-50%);
}

.tooltip p{
    margin: 5px 0;
}

.left{
    float:left;
}
.right{
    float:right;
}

.legal{
    font-size: 10px;
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    margin-bottom: 20px;
    padding: 0 10px;
}

.highlight{
    display: flex;
    flex-wrap: wrap;
    border-bottom: 1px solid #80808045;
    padding: 20px 0;
}

.highlight:nth-of-type(even){
    flex-direction: row-reverse;
}

.text-wrapper, .text-wrapper-2, .img-wrapper, .img-wrapper-2{
    width: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.img-wrapper img, .img-wrapper2 img{
    max-width: 100%;
    display: block;
}

.text-wrapper div{
    padding: 25px;
}

.text-wrapper h3:nth-of-type(1){
    font-size: 26px;
}

.text-wrapper h3:nth-of-type(2){
    font-weight: normal;
    font-size: 16px;
}

.mobile-only{
    display: none;
}

@media (max-width: 600px) {
    .desktop-only{
        display: none;
    }

    .mobile-only{
        display: block;
    }

    .text-wrapper, .img-wrapper, .text-wrapper-2, .img-wrapper-2 {
        width: 100%;
    }

    .text-wrapper, .text-wrapper-2{
        text-align: center;
    }

    .gallery, .product-head{
        width:100%;
    }

    .text-wrapper h3:nth-of-type(1){
        font-size: 26px;
    }
}



.logo{
    height: 70px;
}

.banner{
    width: 100%;
    margin-bottom: 50px;
}

.multi-banner-wrapper{
    width: 100%;
    position: relative;
}

.multi-banner-wrapper div{
    position: absolute;
    top: 50%;
    width: 30%;
    color: black;
    background-color: rgba(255, 255, 255, 0.82);
    right: 4%;
    transform: translateY(-50%);
    padding: 0 15px;
}

.multi-banner{
    width: 100%;
    margin-bottom: 20px;
}

.content-wrapper{
    margin-top: 50px;
}

.absolute-left{
    right: auto;
    left: 0;
}

h4{
    font-size: 26px;
    margin: 10px 0;
}

.logo-bottom{
    margin-top: 50px;
    justify-content: center;
}

.three-cols{
    display: flex;
    flex-wrap: wrap;
    margin: 0 -15px;
    color: black;
    margin-bottom: 30px;
    justify-content: center;
}

.three-cols div{
    width: 33.333%;
    padding: 0 15px;
}

.three-cols img{
    width: 100%;
}

.three-cols h4{
    font-weight: normal;
    font-size: 17px;
}

.three-cols p{
    font-weight: normal;
    font-size: 13px;
    line-height: 17px;
}

h2.small{
    font-size: 17px;
    margin-top: 30px;
}

.header-wrapper{
    display: flex;
    flex-wrap: wrap;
}

.header-wrapper img{
    width: 100%;
}

.header-wrapper > div{
    width: 33.333%;
    padding:10px;
}

.header-wrapper h3{
    margin-top: 0;
}

.header-wrapper h4{
    font-size: 17px;
}

.header-wrapper p{
    font-size: 13px;
    line-height: 18px;
}
.header-wrapper li {
    margin-bottom: 0px;
}

.header-wrapper h5{
    margin: 10px 0;
}

.highlight-2, .highlight-3{
    display: flex;
    flex-wrap: wrap;
    padding: 20px 0;
    font-size: 13px;
    line-height: 16px;
}

.highlight-3{
    flex-direction: row-reverse;
}

.highlight-2 h3, .highlight-3 h3{
    font-size: 17px;
}

.highlight-2 span, .highlight-3 span, .full-width span{
    font-weight: bold;
}

.highlight-2 span:before, .highlight-3 span:before, .full-width span:before, .highlight-2 span:after, .highlight-3 span:after, .full-width span:after{
    content: " ";
}

.four-col{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.four-col-item img{
    width: 100%;
}

.four-col-item h4{
    font-size: 17px;
}

.four-col-item{
    width: 25%;
    padding: 15px;
    font-size: 13px;
    line-height: 18px;
}

.module6{

}

.module6-big-image{
    float: left;
}

.module6-item{
    float: left;
    margin-right: 35px;
}
.module6-right-side{

}

.module6-icon-container{
    display: flex;
    justify-content: left;
}
.module6-icon-container img{
    width: 100%;
}



@media (max-width: 800px) {
    .text h1{
        font-size: 24px;
    }

    .multi-banner-wrapper div {
        position: relative;
        top: auto;
        width: 100%;
        right: auto;
        transform: translateY(0%);
        text-align: center;
        margin-bottom: 40px;
    }

    .three-cols div {
        width: 50%
    }

    .header-wrapper > div:nth-child(1), .header-wrapper > div:nth-child(2){
        width: 50%;
    }
    .four-col-item{
        width: 50%;
    }
}

@media (max-width: 600px) {
    .three-cols div {
        width: 100%
    }
    .four-col-item{
        width: 100%;
    }

    .header-wrapper > div:nth-child(1), .header-wrapper > div:nth-child(2){
        width: 100%;
    }
    .header-wrapper > div{
        width: 100%;
    }
}

.full-width img{
    width: 100%;
}