/* @font-face {
    font-family: 'gotham_ssmbold';
    src: url('../fonts/gothamssm-bold-webfont.woff2') format('woff2'),
         url('../fonts/gothamssm-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'gotham_ssmbook';
    src: url('../fonts/gothamssm-book-webfont.woff2') format('woff2'),
         url('../fonts/gothamssm-book-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'typo_grotesk_roundedregular';
    src: url('../fonts/typo_grotesk_rounded_demo-webfont.woff2') format('woff2'),
         url('../fonts/typo_grotesk_rounded_demo-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}*/


@font-face {
    font-family: 'gotham_ssmbold';
    src: url('../fonts/Montserrat-Bold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'gotham_ssmbook'; 
    src: url('../fonts/Montserrat-Medium.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}

/* GENERAL ----------- */
html,
body {
	height: 100%;
}

body {
	background-color: var(--x-light-grey);
	color: var(--main-text-color);
	font-family: 'gotham_ssmbook', sans-serif;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	text-align: center;
	margin: 0;
}
h1, h2, h3, h4, h5, h6, p { display: block; width: 100%; }
h1, h2, h3, h4, h5, h6 { font-family: 'gotham_ssmbold', sans-serif; }

h2 { font-size: 1.25rem; }

h4 { font-family: 'gotham_ssmbook'; }

a { color: var(--main-color); }
a:hover { color: var(--watermelon); }

strong { 
    font-family: 'gotham_ssmbold', sans-serif; 
    font-size: min(1.2em, 19px);
}

table { border-collapse: collapse; border-spacing: 0; width: 100%; margin-top: 1.25rem; }
table th { background-color: var(--main-color); padding: 10px; }
table tbody {
    background-color: var(--light-blue);
    border-style: hidden;
    width: 100%;
}
table th:first-child {
    border-top-right-radius: 0;
    border-top-left-radius: 6px;
    width: 35%;
    min-width: 125px;
    padding: 10px;
}
table.table-materials { border-radius: 0; width: 100%; }
.material-item {
    border-bottom: 1px solid #ddd;
    padding: 3px 0;
}
th:last-child {
    border-top-right-radius: 6px;
}
table tr td {
    border: 1px solid var(--white);
	line-height: 1.3;
	overflow-wrap: anywhere;
    padding: 10px;
}
.hide {
    display: none !important;
}
.hidden {
    opacity: 0;
    pointer-events: none;
}
.trace_svg_sm svg {
    margin-right: 6px;
    width: 16px;
}
.trace_svg_md svg {
    margin-right: 5px;
    width: 18px;
    height: 18px;
}
th.trace_svg_lg {
    width: 33px;
    vertical-align: middle;
	padding: 0;
}
.primary_fill_color svg path {
    fill: var(--black) !important;
}
.element-bar {
    width: 90%;
    height: 12px;
    background: var(--blue-tint);
    border-radius: 5px;
    transform: translateY(2px);
}
.element-bar span {
    background: var(--main-color);
    height: 12px;
    display: inline-block;
    float: left;
    border-radius: 10px 0 0 10px;
}

.content-statement img { margin: 1.25rem 0; }

.d-flex { display: flex; }
.d-inline-block { display: inline-block; }
.justify-content-center {justify-content: center;}

.align-center { align-items: center; }

.mb-1 { margin-bottom: .25rem !important; }
.mb-2 { margin-bottom: .5rem !important; }
.mb-3 { margin-bottom: 1rem !important; }
.mt-20 { margin-top: 20px; }
.mt-10 { margin-top: 10px; }
.mt-n-1 { margin-top: -1px; }
.my-5 { margin-top: 5px !important; margin-bottom: 5px !important;}
.my-10 { margin-top: 10px !important; margin-bottom: 10px !important;}
.my-15 { margin-top: 15px !important; margin-bottom: 15px !important;}
.my-20 { margin-top: 20px !important; margin-bottom: 20px !important;}
.my-25 { margin-top: 25px !important; margin-bottom: 25px !important;}

.p-0 { padding: 0 !important; }
.p-6 { padding: 6px !important; }
.p-10 { padding: 10px; }
.py-10 { padding-top: 10px !important; padding-bottom: 10px !important; }
.pb-0 { padding-bottom: 0; }
.pt-4 { padding-top: 4px; }
.py-6 { padding-top: 6px; padding-bottom: 6px; }
.py-4 { padding-top: 4px; padding-bottom: 4px; }
.py-0 { padding-top: 0 !important; padding-bottom: 0 !important; }
.px-10 {padding-right: 10px; padding-left: 10px;}
.px-15 {padding-right: 15px; padding-left: 15px;}
.px-20 {padding-right: 20px; padding-left: 20px;}

.w-25 {max-width: 25%}
.w-50 {max-width: 50%}
.w-75 {max-width: 75%}
.w-100 {max-width: 100%}

.border-0 { border: none; }
.border-tint { border: 1px solid #c4dde0; }
.br-0 { border-radius: 0px; }
.br-8 { border-radius: 8px; }
.br-tl-0 { border-top-left-radius: 0; }
.br-tr-8 { border-top-right-radius: 8px; }
.br-tl-8 { border-top-left-radius: 8px; }
.border-radius-top { border-top-right-radius: 6px; border-top-left-radius: 6px; }

.text-bold { font-family: 'gotham_ssmbold', sans-serif; }

.text-500 { font-weight: 500; }

.font-12 { font-size: 12px; }
.font-13 { font-size: 13px; }
.font-15 { font-size: 15px; }

.bg-none { background-color: transparent !important; }
.bg-blue-tint, .table-blue-tint { background-color: #aacdd3; }
.bg-white { background-color: #FFF; }

.wrap {
	background-color: #FFF;
	display: flex;
	flex-direction: column;
	height: 100%;
	margin: 0 auto;
	max-width: 100%;
	min-height: 100vh;
	overflow: hidden;
	width: 600px;
}

.header, .footer { background-color: var(--main-color); }
.header, .main { border-bottom-left-radius: 35px; border-bottom-right-radius: 35px; margin-right: -5px; margin-left: -5px; padding: 1.5rem 2rem 1rem; }

.header img.main-logo { margin: 0 auto; }

.main { background-color: var(--white); height: 100%; overflow-y: scroll; position: relative; z-index: 1; }

.tile-container, .product-container, .content-area {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
/*    margin: 0.5% 5%;*/
/*    justify-content: center;*/
}
.product-container { margin-bottom: 1rem; margin-top: 1rem; }
.product-img .product {
	align-items: center;
	border: 1px solid var(--black);
	border-radius: 1.35rem;
	-webkit-box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.5);
	-moz-box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.5);
	box-shadow: 5px 5px 10px 0px rgba(0,0,0,0.5);
	display: flex;
	justify-content: center;
	padding: 10px;
}

.tile-item, .product-img, .product-info {
    width: 50%;
    display: flex;
    justify-content: center;
}
.tile, .product {
    color: var(--main-text-color);
    font-size: 1.25rem;
    letter-spacing: .02rem;
	line-height: 1.3;
    margin-bottom: 1rem;
    margin-top: .5rem;
    text-align: left;
    width: 90%;
}
.product-info { flex-wrap: wrap; justify-content: flex-start; }
.product-info .product { padding-left: .75rem; text-align: left; width: 100%; }
.product-info .product h4, .product-info .product p, .tile-title { line-height: 1.1; }
.product-info .product h4 { font-size: 1.4rem; margin-bottom: 5px; }
.product-info .product p { font-size: 1.2rem; }
.product-info .product img { margin-top: 1.5rem; }


.tile { align-items: center; background-color: var(--x-light-grey); border-radius: 0.7rem; display: flex; justify-content: flex-start; padding: 5px 10px; }
.tile:hover, .content-area .heading { background-color: var(--light-blue); font-family: 'gotham_ssmbold', sans-serif; }
.tile-icon, .heading-icon {
    background-color: var(--main-color);
    border: 2px solid var(--white);
    border-radius: 100%;
	margin-right: 12px;
    padding: 8px;
}
.tile-icon img { max-width: initial; }
.tile-title { font-size: 1.15rem; }

.content-area { margin: 0.5% 2.5%; text-align: left; }
.content-area .heading { align-items: center; background-color: var(--light-blue-tint); border-radius: 0.7rem; display: flex; margin-bottom: 1.25rem; padding: .5rem 1rem; width: 100%; }
.content-area .heading .heading-title { font-size: 1.4rem; }

.content-area .body {flex-grow: 1;}

.content-area .inset-box, .content-area .product-image, .bullet-list, .download-item, .content-statement, .general-content { margin: 1.25rem 0; } 
.content-area .inset-box { background-color: var(--light-blue); border-radius: .7rem; margin: 1.25rem 0; padding: 15px 20px; width: 100%; }
.content-area .inset-box p { margin-bottom: 0; }

.bullet-list ul { list-style: none; margin-top: 1rem; padding-left: 0; }
.bullet-list ul li { margin-bottom: .25rem; padding-left: 28px; }
.bullet-list ul li::before {
    background-color: var(--main-color);
    width: 28px;
    height: 20px;
    display: inline-block;
    margin-left: -28px;
    content: '';
    -webkit-mask: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGNvbG9yPSIjNDQ4Q0E3IiBoZWlnaHQ9IjQ4IiB3aWR0aD0iNDgiPjxwYXRoIGZpbGw9ImN1cnJlbnRjb2xvciIgZD0iTTI0IDQ0UTE5Ljc1IDQ0IDE2LjEgNDIuNDc1UTEyLjQ1IDQwLjk1IDkuNzUgMzguMjVRNy4wNSAzNS41NSA1LjUyNSAzMS45UTQgMjguMjUgNCAyNFE0IDE5LjggNS41MjUgMTYuMTVRNy4wNSAxMi41IDkuNzUgOS44UTEyLjQ1IDcuMSAxNi4xIDUuNTVRMTkuNzUgNCAyNCA0UTI4LjIgNCAzMS44NSA1LjU1UTM1LjUgNy4xIDM4LjIgOS44UTQwLjkgMTIuNSA0Mi40NSAxNi4xNVE0NCAxOS44IDQ0IDI0UTQ0IDI4LjI1IDQyLjQ1IDMxLjlRNDAuOSAzNS41NSAzOC4yIDM4LjI1UTM1LjUgNDAuOTUgMzEuODUgNDIuNDc1UTI4LjIgNDQgMjQgNDRaTTIxLjA1IDMzLjEgMzUuMiAxOC45NSAzMi45IDE2LjcgMjEuMDUgMjguNTUgMTUuMDUgMjIuNTUgMTIuOCAyNC44WiIvPjwvc3ZnPg==) no-repeat 0% 0%;
    mask: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGNvbG9yPSIjNDQ4Q0E3IiBoZWlnaHQ9IjQ4IiB3aWR0aD0iNDgiPjxwYXRoIGZpbGw9ImN1cnJlbnRjb2xvciIgZD0iTTI0IDQ0UTE5Ljc1IDQ0IDE2LjEgNDIuNDc1UTEyLjQ1IDQwLjk1IDkuNzUgMzguMjVRNy4wNSAzNS41NSA1LjUyNSAzMS45UTQgMjguMjUgNCAyNFE0IDE5LjggNS41MjUgMTYuMTVRNy4wNSAxMi41IDkuNzUgOS44UTEyLjQ1IDcuMSAxNi4xIDUuNTVRMTkuNzUgNCAyNCA0UTI4LjIgNCAzMS44NSA1LjU1UTM1LjUgNy4xIDM4LjIgOS44UTQwLjkgMTIuNSA0Mi40NSAxNi4xNVE0NCAxOS44IDQ0IDI0UTQ0IDI4LjI1IDQyLjQ1IDMxLjlRNDAuOSAzNS41NSAzOC4yIDM4LjI1UTM1LjUgNDAuOTUgMzEuODUgNDIuNDc1UTI4LjIgNDQgMjQgNDRaTTIxLjA1IDMzLjEgMzUuMiAxOC45NSAzMi45IDE2LjcgMjEuMDUgMjguNTUgMTUuMDUgMjIuNTUgMTIuOCAyNC44WiIvPjwvc3ZnPg==) no-repeat 0% 0%;
    -webkit-mask-size: 20px;
    mask-size: 20px;
    float: left;
    position: relative;
    top: 3px;
}

.download-item, .sub-heading-item { 
background: var(--white);
    padding: 1rem;
    border-radius: 6px;
    box-shadow: inset 0px 0px 0px 2px rgb(184 215 219);
    width: 100%;
}
.sub-heading-item { 
	background: var(--x-light-grey);
    -webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	margin-bottom: 1.25rem;
}
.download-item .sub-heading, .sub-heading-item .sub-heading {
    font-size: 1.1rem;
    background: #f8f8f8;
    margin: -1rem -1rem 1rem;
    padding: .5rem 1rem;
    background-color: var(--main-color);
    border-color: var(--white) !important;
    color: var(--white);
    border-radius: 5px 5px 0 0;
}
a.external-url, a.download-url, a.email-url {
    border: 1px solid var(--light-blue);
    border-radius: 6px;
    padding: 10px;
    display: flex;
    align-items: center;
    margin: .5rem 0 .15rem;
    color: var(--black);
	width: 100%;
}
.sub-heading-item a.external-url, .sub-heading-item a.download-url, .sub-heading-item a.email-url { border: 1px solid var(--blue-tint); }

a.external-url:before, a.download-url:before, a.email-url:before {
    content: "";
    display: block;
    width: 30px;
    height: 30px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin: -5px 5px -5px -5px;
}
a.download-url:before {
	background-color: var(--main-color);
    -webkit-mask: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' fill='%234f6c7d' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='24px' height='24px' viewBox='0 0 24 24' enable-background='new 0 0 24 24' xml:space='preserve'%3E%3Cg%3E%3Cpolygon points='17,2 17,4 20,4 20,7 22,7 22,2 '/%3E%3Cpolygon points='4,17 2,17 2,22 7,22 7,20 4,20 '/%3E%3Cpolygon points='4,4 7,4 7,2 2,2 2,7 4,7 '/%3E%3Cpolygon points='20,20 17,20 17,22 22,22 22,17 20,17 '/%3E%3Cpolygon points='15.668,11.86 15.668,5 8.458,5 8.458,11.86 4.742,11.86 12.001,20.102 19.258,11.86 '/%3E%3C/g%3E%3C/svg%3E");
    mask: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' fill='%234f6c7d' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='24px' height='24px' viewBox='0 0 24 24' enable-background='new 0 0 24 24' xml:space='preserve'%3E%3Cg%3E%3Cpolygon points='17,2 17,4 20,4 20,7 22,7 22,2 '/%3E%3Cpolygon points='4,17 2,17 2,22 7,22 7,20 4,20 '/%3E%3Cpolygon points='4,4 7,4 7,2 2,2 2,7 4,7 '/%3E%3Cpolygon points='20,20 17,20 17,22 22,22 22,17 20,17 '/%3E%3Cpolygon points='15.668,11.86 15.668,5 8.458,5 8.458,11.86 4.742,11.86 12.001,20.102 19.258,11.86 '/%3E%3C/g%3E%3C/svg%3E");
	-webkit-mask-size: 30px;
    mask-size: 30px;
}
a.external-url:before, a.external_url:before, a.email-url:before {
	background-color: var(--main-color);
    -webkit-mask: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='48px' height='48px' viewBox='0 0 48 48' enable-background='new 0 0 48 48' xml:space='preserve'%3E%3Cpath fill='%234f6c7d' d='M24,44c-2.8,0-5.417-0.525-7.85-1.575c-2.433-1.05-4.55-2.475-6.35-4.274C8,36.35,6.583,34.225,5.55,31.775 C4.517,29.325,4,26.7,4,23.9c0-2.8,0.517-5.408,1.55-7.825C6.583,13.658,8,11.55,9.8,9.75c1.8-1.8,3.917-3.208,6.35-4.225 C18.583,4.508,21.2,4,24,4s5.416,0.508,7.85,1.525S36.4,7.95,38.2,9.75s3.216,3.908,4.25,6.325C43.483,18.492,44,21.1,44,23.9 c0,2.8-0.517,5.425-1.55,7.875C41.416,34.225,40,36.35,38.2,38.15c-1.8,1.8-3.917,3.225-6.351,4.274S26.8,44,24,44z M31.9,16.5h7.5 c-1.101-2.3-2.609-4.217-4.525-5.75S30.75,8.133,28.25,7.5c0.834,1.233,1.541,2.566,2.125,4S31.467,14.6,31.9,16.5z M19.2,16.5h9.7 c-0.367-1.767-0.984-3.475-1.851-5.125S25.166,8.267,24,7c-1.067,0.9-1.967,2.083-2.7,3.55C20.567,12.017,19.867,14,19.2,16.5z M7.6,28.45h7.95c-0.1-0.9-0.158-1.708-0.175-2.425S15.35,24.6,15.35,23.9c0-0.833,0.017-1.575,0.05-2.225 c0.033-0.65,0.1-1.375,0.2-2.175h-8c-0.233,0.8-0.392,1.517-0.475,2.15S7,23.033,7,23.9s0.042,1.641,0.125,2.325 S7.367,27.65,7.6,28.45z M19.75,40.5c-0.833-1.267-1.55-2.633-2.15-4.1s-1.1-3.117-1.5-4.95H8.6c1.267,2.366,2.733,4.225,4.4,5.575 C14.667,38.375,16.917,39.533,19.75,40.5z M8.6,16.5h7.55c0.367-1.8,0.833-3.408,1.4-4.825c0.567-1.417,1.284-2.792,2.15-4.125 c-2.5,0.634-4.684,1.7-6.55,3.2S9.767,14.167,8.6,16.5z M24,41.1c1.166-1.199,2.142-2.574,2.925-4.125 c0.784-1.55,1.425-3.391,1.925-5.524H19.2c0.466,2,1.091,3.8,1.875,5.399C21.858,38.45,22.833,39.867,24,41.1z M18.65,28.45H29.4 c0.133-1.034,0.217-1.875,0.25-2.525c0.033-0.649,0.05-1.325,0.05-2.025c0-0.667-0.017-1.308-0.05-1.925s-0.117-1.442-0.25-2.475 H18.65c-0.133,1.033-0.217,1.858-0.25,2.475s-0.05,1.258-0.05,1.925c0,0.7,0.017,1.375,0.05,2.025 C18.433,26.575,18.517,27.416,18.65,28.45z M28.3,40.45c2.4-0.767,4.559-1.917,6.476-3.45c1.916-1.533,3.458-3.383,4.625-5.55h-7.45 c-0.434,1.8-0.942,3.433-1.525,4.899S29.133,39.184,28.3,40.45z M32.4,28.45h8c0.232-0.8,0.391-1.542,0.475-2.226S41,24.767,41,23.9 s-0.041-1.617-0.125-2.25S40.633,20.3,40.4,19.5h-7.95c0.1,1.167,0.167,2.059,0.2,2.675c0.033,0.617,0.05,1.192,0.05,1.725 c0,0.733-0.025,1.425-0.075,2.075C32.575,26.625,32.5,27.45,32.4,28.45z'/%3E%3C/svg%3E%0A");
    mask: url("data:image/svg+xml,%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='48px' height='48px' viewBox='0 0 48 48' enable-background='new 0 0 48 48' xml:space='preserve'%3E%3Cpath fill='%234f6c7d' d='M24,44c-2.8,0-5.417-0.525-7.85-1.575c-2.433-1.05-4.55-2.475-6.35-4.274C8,36.35,6.583,34.225,5.55,31.775 C4.517,29.325,4,26.7,4,23.9c0-2.8,0.517-5.408,1.55-7.825C6.583,13.658,8,11.55,9.8,9.75c1.8-1.8,3.917-3.208,6.35-4.225 C18.583,4.508,21.2,4,24,4s5.416,0.508,7.85,1.525S36.4,7.95,38.2,9.75s3.216,3.908,4.25,6.325C43.483,18.492,44,21.1,44,23.9 c0,2.8-0.517,5.425-1.55,7.875C41.416,34.225,40,36.35,38.2,38.15c-1.8,1.8-3.917,3.225-6.351,4.274S26.8,44,24,44z M31.9,16.5h7.5 c-1.101-2.3-2.609-4.217-4.525-5.75S30.75,8.133,28.25,7.5c0.834,1.233,1.541,2.566,2.125,4S31.467,14.6,31.9,16.5z M19.2,16.5h9.7 c-0.367-1.767-0.984-3.475-1.851-5.125S25.166,8.267,24,7c-1.067,0.9-1.967,2.083-2.7,3.55C20.567,12.017,19.867,14,19.2,16.5z M7.6,28.45h7.95c-0.1-0.9-0.158-1.708-0.175-2.425S15.35,24.6,15.35,23.9c0-0.833,0.017-1.575,0.05-2.225 c0.033-0.65,0.1-1.375,0.2-2.175h-8c-0.233,0.8-0.392,1.517-0.475,2.15S7,23.033,7,23.9s0.042,1.641,0.125,2.325 S7.367,27.65,7.6,28.45z M19.75,40.5c-0.833-1.267-1.55-2.633-2.15-4.1s-1.1-3.117-1.5-4.95H8.6c1.267,2.366,2.733,4.225,4.4,5.575 C14.667,38.375,16.917,39.533,19.75,40.5z M8.6,16.5h7.55c0.367-1.8,0.833-3.408,1.4-4.825c0.567-1.417,1.284-2.792,2.15-4.125 c-2.5,0.634-4.684,1.7-6.55,3.2S9.767,14.167,8.6,16.5z M24,41.1c1.166-1.199,2.142-2.574,2.925-4.125 c0.784-1.55,1.425-3.391,1.925-5.524H19.2c0.466,2,1.091,3.8,1.875,5.399C21.858,38.45,22.833,39.867,24,41.1z M18.65,28.45H29.4 c0.133-1.034,0.217-1.875,0.25-2.525c0.033-0.649,0.05-1.325,0.05-2.025c0-0.667-0.017-1.308-0.05-1.925s-0.117-1.442-0.25-2.475 H18.65c-0.133,1.033-0.217,1.858-0.25,2.475s-0.05,1.258-0.05,1.925c0,0.7,0.017,1.375,0.05,2.025 C18.433,26.575,18.517,27.416,18.65,28.45z M28.3,40.45c2.4-0.767,4.559-1.917,6.476-3.45c1.916-1.533,3.458-3.383,4.625-5.55h-7.45 c-0.434,1.8-0.942,3.433-1.525,4.899S29.133,39.184,28.3,40.45z M32.4,28.45h8c0.232-0.8,0.391-1.542,0.475-2.226S41,24.767,41,23.9 s-0.041-1.617-0.125-2.25S40.633,20.3,40.4,19.5h-7.95c0.1,1.167,0.167,2.059,0.2,2.675c0.033,0.617,0.05,1.192,0.05,1.725 c0,0.733-0.025,1.425-0.075,2.075C32.575,26.625,32.5,27.45,32.4,28.45z'/%3E%3C/svg%3E%0A");
	-webkit-mask-size: 30px;
    mask-size: 30px;
}

.video-streaming {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9 !important;
}
.video-streaming .permission-required {
    background: #3c3c3c;
    color: #fff;
    text-align: center;
    padding: 20% 0;
}
.bd-oembed-player video, .hero-video iframe, .howto-item iframe, .faq-item iframe, .promo-item iframe, .video-iframe iframe {
    width: calc(100%);
    height: auto;
    aspect-ratio: 16 / 9;
    border-radius: 5px;
}

h2.ingredients-heading { padding: 1rem 0; }
.ingredients-table, .ingredients-container { margin-bottom: 1.25rem; width: 100%; }

.content-statement-heading { margin-bottom: 1.25rem; }

.footer { flex: 0 0 50px; margin-top: auto; padding: 5px 30px; position: relative; text-align: right; }
.footer img.footer-logo { float: right; position: relative; z-index: 1; }
.footer:before, .footer:after { background-color: var(--white); content: ""; height: 50px; position: absolute; top: -60px; width: 50px; }
.footer:before {
	border-bottom-left-radius: 50%;
	box-shadow: 0 40px 0 0 var(--main-color);
	left: 0;
}
.footer:after {
	border-bottom-right-radius: 50%;
	box-shadow: 0 0 0 40px var(--main-color);
	right: 0;
}
.footer-btns { display: flex; justify-content: space-evenly; position: absolute; top: -20px; width: calc(100% - 90px); z-index: 10;left: 45px; }
.footer-btns a { background-color: var(--white); border: 2px solid var(--main-color); border-radius: 100%; padding: 10px; }

.footer-btns a:hover {
    transition:all .3s linear;
    background: #c4dde1;
}

.content-area {
    animation: FadeInOut 1s ease-in-out;
}
@keyframes FadeInOut {
  0% {
    display: none;
    opacity: 0;
  }
  1% {
    display: block;
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@media only screen and (max-width: 550px) {
    .main {
        padding: 1.5rem 1rem 1rem;
    }
    .tile {
        padding: 5px 5px;
        margin-bottom: .7rem;
        margin-top: .3rem;
        width: 94%;
    }
    .tile-title {
        font-size: .9rem;
    }
    .tile-icon {
        padding: 4px;
        margin-right: 5px;
    }
    .tile-icon img {
        max-width: 25px;
    }
    .footer-btns a {
        padding: 7px
    }
    .footer-btns a img {
        width: 35px;
    }
}
@media only screen and (max-width: 375px) {
    .tile-container {
        display: flex;
        flex-direction: column;
    }
    a.tile-item{
        width: 100%;
    }
}

.loading {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background-color: #eeeeee;
    z-index: 2;
}

.loading p {
    animation: FadeInOut .5s;
    text-align: center;
    top: 50%;
    bottom: auto;
    transform: translate(0% -50%);
    position: relative;
}

.recycling-label {
    display: flex;
    justify-content: center;
    align-items: flex-start;
}

.white {
    background: var(--white)!important;
    box-shadow: inset 0 0 0px 2px #e6e7e8;
}
.text-center {text-align: center;}
.text-left {text-align: left;}
a.external_url {
    background: green;
    display: block;
    padding: 10px 20px;
    color: #fff;
    font-weight: bold;
}
