/*
font-family: 'Inter', sans-serif;
font-family: 'Kanit', sans-serif;
font-family: 'Montserrat', sans-serif;
font-family: 'Roboto', sans-serif;
font-family: 'Roboto Condensed', sans-serif;
*/

/* FOUNDATION RESETS */
.grid-container{
	width:98%;
	max-width: 1174px;
}
.grid-container.full{width:100%;}

@media only screen and (min-width:48em){

	.grid-container{
		width:90%;
		max-width: 1174px;
	}

}

/* GLOBAL - STRUCTURE start */

body{
	font-family: 'Inter', sans-serif;
	background-color:#75C1FB;
}

strong{font-weight:700;}

.table-vertical-align{
	display:table;
	width: 100%;
	height:100%;
}
.table-vertical-align .td{
	display:table-cell;
	height:100%;
	vertical-align: middle;
}
.site-container > section{padding:1px 0;}
.site-container > section.section-1{overflow-x: hidden;}

.pos-rel{position: relative;}
.group:after {content: "";display: table;clear: both;}
.vertical-align-top{vertical-align:top;}
.vertical-align-middle{vertical-align:middle;}
.vertical-align-bottom{vertical-align:bottom;}
.overflow-horizontal-scroll{overflow-x:scroll;}
/* GLOBAL - STRUCTURE end */

/* COLORS start */
.color-yellow{color:#FFE55A !important;}
.color-blue{color:#0075BC !important;}
.color-white{color:#FFFFFF !important;}
.weight-500{font-weight:500;}
.weight-800{font-weight:800 !important;}
.weight-900{font-weight:900 !important;}
.bg-color-white{background-color:#FFFFFF !important;}
.bg-color-blue{background-color:#0075BC !important;}
.bg-color-dark-blue{background-color:#263D7A !important;}
.bg-color-light-blue{background-color:#E5F1F8 !important;}
.shadow{box-shadow:0 2px 4px #000000;}
/* COLORS end */

@media only screen and (min-width:40em){}

/* GLOBAL - FLOATING BAR start */ 

.floating-bar{
	position:fixed;
	top:-160px;
	left:0;right:0;
	height:auto;
	min-height:60px;
	padding:0;
	background-color:#263D7A;
	z-index:10;
	transition: top 0.5s;
}
.floating-bar.show{
	top:0px;
}
.floating-bar-logo{
	position: absolute;
	top:-6px;
	left:0;
	display:block;
    width:150%;
	max-width:110px;
	height:auto;
}
.floating-bar p{
	margin:0px 0;
	font-size:0.875em;
    font-weight:700;
    line-height:1.1em;
	letter-spacing:0.0075em;
	text-align:left;
	color:#ffffff;
}
.floating-bar p span{
	position: relative;
	display: inline-block;
	width: auto;
	padding:4px 4px 0 6px;
}
.floating-bar p span strong{
	display:block;
}
.floating-bar p a{
	position: static;
	top:8px;
	right:0;
    min-width:100px;
    margin: 0.5em 0;
    padding: 8px 14px;
	font-size:0.75em;
	letter-spacing:0.111em;
}

@media screen and (min-width: 40em) {

	.floating-bar p{
		font-size:1.125em;
	}
	
	.floating-bar p span{
		padding:18px 170px 30px 0px;
	}	

}

@media screen and (min-width: 48em) {

	.floating-bar-logo{
		top:-14px;
		left:0;
		right:auto;
		max-width:149px;
	}
	.floating-bar p{
		font-size:1.25em;
		line-height:1.142857em;
	}
	
	.floating-bar p span{
		display: block;
		padding:18px 170px 30px 0px;
	}
	
	.floating-bar p span strong{
		height:54px;
	}
	
	.floating-bar p a{
		position: absolute;
		top:16px;
        right:30px;
		font-size:0.75rem;
		letter-spacing:0.111em;
		min-width:155px;
		padding:12px 12px 10px 12px;
	}

}

@media screen and (min-width: 64em) {

	.floating-bar-logo{
		top:-14px;
		left:0;
		right:auto;
		max-width:149px;
	}
	.floating-bar p{
		font-size: 1.25em;
		line-height:1.142857em;
	}
	
	.floating-bar p span{
		padding:24px 200px 24px 20px;
	}
	
	.floating-bar p span strong {
		height: auto;
	}

	.floating-bar p span strong em {
		font-style:normal;
		font-weight:800;
	}

	.floating-bar p a{
		position: absolute;
		top:16px;
        right:30px;
		font-size:0.75rem;
		letter-spacing:0.111em;
		min-width:135px;
		padding:12px 12px 10px 12px;
	}

	.floating-bar p{
		font-size:1.35em;
		line-height:1.142857em;
	}

	.floating-bar p span{
		padding:20px 200px 20px 0px;
	}

}




/* GLOBAL - FLOATING BAR end */ 

/* GLOBAL - PRE-HEADER BAR  start */ 

.global-bar{
	height:auto;
	min-height:60px;
	padding:1px 0;
	background-color:#263D7A;
}
.global-bar-logo{
	position: absolute;
	top:-6px;
	left:0;
	display:block;
	width:149px;
	height:auto;
}

.global-bar p{
	margin:9px 0;
	font-size:0.75em;
	font-weight:500;
	line-height:1.142857em;
	letter-spacing:0.05em;
	text-align:right;
	color:#ffffff;
	text-transform: uppercase;
}

@media screen and (min-width: 30em) {

	.global-bar-logo{
		top:-10px;
	}

}

@media screen and (min-width: 48em) {

	.global-bar-logo{
		top:-14px;
	}

	.global-bar p{
		margin:13px 0;
		font-size:0.875em;
		line-height:1.2142857em;
		letter-spacing:0.072em;
	}

}

/* GLOBAL - PRE-HEADER BAR end */ 

/* COMMON CONTENT STYLES start */

.margin-no-collapse{padding-top:1px !important;padding-bottom:1px !important;}
.margin-none{margin:0 !important;}
.margin-bottom-none{margin-bottom:0 !important;}
.margin-bottom-half{margin-bottom:0.88em !important;}
.margin-top-none{margin-top:0 !important;}
.margin-top-half{margin-top:0.88em !important;}
.margin-top-double{margin-top:3em !important;}
.responsive-img .img-desktop{display:none;}
.responsive-img .img-mobile{display:block;}

@media only screen and (min-width:48em){
	.responsive-img .img-desktop{display:block;}
	.responsive-img .img-mobile{display:none;}
}

/* TYPOGRAPHY */
.font-rubik{}
.font-inter{font-family: 'Inter', sans-serif;}
.font-kanit{font-family: 'Kanit', sans-serif;}
.font-montserrat{font-family: 'Montserrat', sans-serif;}
.font-roboto{font-family: 'Roboto', sans-serif;}

.weight-300{font-weight:300 !important;}
.weight-400{font-weight:400 !important;}
.weight-500{font-weight:500 !important;}
.weight-700{font-weight:700 !important;}
.weight-900{font-weight:900 !important;}
.underline{text-decoration: underline;}

.mobile-hide{display:none;}

@media only screen and (min-width:48em){
	
	.mobile-hide{display:block;}

}

/* SECTION HEADER start */

.site-header{
	background-color:#bde2ff;
}

.site-header h1{
	margin:3rem auto 0 auto;
	font-family: 'Roboto Condensed', sans-serif;
	font-size:2.25em;
	font-weight: 700;
	line-height:1.2em;
	color:#263D7A;
	text-align: center;
}

.site-header .header-image{
	max-width:973px;
}

.site-header .header-image-2{
	display:inline-block;
	margin-top:2rem;
	margin-bottom:2rem;
	max-width:300px;
}

.site-header p{
	max-width:1070px;
	margin:0em auto 2rem auto;
	font-size:1.0625em;
	line-height:1.2em;
	color:#263D7A;
	text-align: center;
}

.header-icon-content{
	margin-bottom:3rem;
}

.header-icon-content > div:first-child img{
	display:block;
	margin:0 auto 1rem auto;
	width:220px;
}

@media only screen and (min-width:26.25em){

	.site-header h1{
		margin:3rem auto 0 auto;
	}

}

@media only screen and (min-width:30em){

	.site-header h1{
		font-size:3.5rem;
	}

	.site-header .header-image-2{
		margin-top:3rem;
		margin-bottom:3rem;
		max-width:531px;
	}

	.site-header p{
		margin:0em auto 2rem auto;
		font-size:1.375em;
	}

}
	
@media only screen and (min-width:48em){

	.header-icon-content{
		align-items:center;
		display:flex;
		justify-content:space-between;
		margin:0 auto 3rem auto;
		max-width:960px;
	}

	.header-icon-content div:first-child{
		width:267px;
	}

	.header-icon-content > div:first-child img{
		display:block;
		margin:0;
		width:auto;
	}

	.header-icon-content p{
		margin:0 0 0 40px;
		text-align:left;
	}

}



/* SECTION HEADER end */

/* GLOBAL - FOOTER start */ 

.site-footer{
	position: relative;
	box-sizing:border-box;
	height:auto;
	min-height:120px;
	padding:30px 0;
	background-color:#263D7A;
	color:#ffffff;
}

.footer-nav ul{
	list-style-type:none;
	margin:0;
	font-size:1em;
	line-height:1em;
	letter-spacing:0.03125em;
}

.footer-nav ul li{
	margin:0 0 24px 0;
	text-align:center;
}

.footer-nav ul li a{
	color:#ffffff;
}
.footer-nav ul li a:hover{
	text-decoration: underline;
}

.footer-text{
	margin:20px 0 0 0;
	font-size:0.875em;
	text-align:center;
	line-height:1.2em;
	letter-spacing:0.0333em;
}

.footer-logo{
	text-align:center;
}

.footer-logo img{
	display:inline-block;
	margin-top:20px;
	width:100%;
	max-width:111px;
}

@media screen and (min-width: 48em) {

	.site-footer{
		padding:36px 0px;
	}
	
	.footer-nav ul li{
		display:inline-block;
		margin:0 18px 0 0;
		text-align:left;
	}
	
	.footer-text{
		margin:20px 0 0 0;
		text-align:left;
	}

	.footer-logo{
		text-align:right;
	}
	
	.footer-logo img{
		margin-top:0px;
	}
	
}

/* GLOBAL - FOOTER end */ 



/* SECTIONS LAYOUTS start */

.section-icon{
	margin:28px auto;
	text-align:center;
}

.section-container{
	margin:28px auto;
	padding:1px 0;
}

.section-content{
	padding:0 16px;
}

.section-1 .section-content h1{
	color:#EC065C;
	font-size:1.7rem;
	font-weight:700;
	line-height:1.14em;
	margin:2.25rem auto 1rem auto;
}

.section-1 .section-container{
	border:1px solid #75C1FB;
	/*border-bottom:0;*/
	background-color:#F1FBFF;
	box-shadow:0 2px 4px #777777;
}

.section-1 .section-ribbon{
	position: relative;
	margin:15px -29px 0 -29px;
	padding-top:15px;
}

.section-1 .section-ribbon .ribbon-tip-left{
	position:absolute;
	top:0;
	left:0;
	width:29px;
	height:15px;
	overflow: hidden;
	background:url('../images/ribbon-tip-left@2x.png') bottom right no-repeat;
	background-size:100% auto;
}

.section-1 .section-ribbon .ribbon-tip-right{
	position:absolute;
	top:0;
	right:0;
	width:29px;
	height:15px;
	overflow: hidden;
	background:url('../images/ribbon-tip-right@2x.png') bottom left no-repeat;
	background-size:100% auto;
}

.section-1 .section-ribbon .section-ribbon-inner{
	padding:36px 40px 20px 40px;
	background-color:#263D7A;
	box-shadow:0 2px 4px #777777;
}

.section-ribbon-content{
	max-width:910px;
	margin-left:auto;
	margin-right:auto;
}
.ribbon-divider img{
	max-width:230px;
}

.section-1 .section-question{
	padding:20px 12px 10px 12px;
	background-color:#bee1fc;
}

.question-design{
	position:relative;
	background:url('../images/metalic-short-no-rivets-mobile@2x.png') center center no-repeat;
	padding:36px;
	padding: 40px 24px 56px 24px;
	background-size:100% 100%;
}
.question-design.results-section{
	background:url('../images/metalic-no-rivets-mobile@2x.png') center center no-repeat;
	background-size:100% 100%;
}

.rivet{
	position:absolute;
	display:block;
	width:34px;
	height:34px;
	background:url('../images/rivet@2x.png') center center no-repeat;
	background-size:34px auto;
}
.rivet-tl{top:8px;left:8px;}
.rivet-tr{top:8px;right:8px;}
.rivet-bl{bottom:16px;left:8px;}
.rivet-br{bottom:16px;right:8px;}

.intro-question .cell{
	padding-left:2px;
	padding-right:2px;
}
.intro-question a{
	position: relative;
	display:block;
	width:100%;
	max-width:139px;
	margin:0 auto 0.5em auto;
	font-size:0.75em;
	font-weight:700;
	line-height:1.4375em;
	text-align:center;
	color:#EC065C;
}
.intro-question a img{
	display:block;
	width:100%;
	height: auto;
	padding-bottom:10px;	
}
.intro-question a span{
	display:block;
}
.intro-question a span.hover{
	position:absolute;
	top:0;
	left:0;
	display:block;
	width:100%;
	height:auto;
	opacity:0;	
	transition: opacity 0.1s;
}
.intro-question a:hover{
	opacity:0.7;
}
.intro-question a.on span.hover{
	opacity:1;
}

.section-2{
	background-color:#ffffff;
}

.site-container > section.section-3{
	margin-top:-100px;
	padding:130px 0 40px 0;
	background-color:#aedbfd;
}

.learn-more-containers{

}

.learn-more-container{
	position: relative;
	width:100%;
	max-width:517px;
	margin:30px auto 0 auto;
	background:url('../images/metalic-short-no-rivets@2x.png') center center no-repeat;
	background-size:100% 100%;
}

.learn-more-container .learn-more-box{
	padding:40px 50px;
}

.learn-more-2-boxes{
	
}

.learn-more-2-boxes .learn-more-container{
	margin:2rem auto;
	max-width:356px;
	width:100%;
}

.learn-more-2-boxes .learn-more-container h1{
	color:#3A91D3;
	font-size:1.5625rem;
	font-weight:700;
	letter-spacing:-0.0075em;
	line-height:1.2em;
}

@media screen and (min-width: 36em) {

	.intro-question a{
		font-size:0.875em;
	}

}

@media screen and (min-width: 48em) {

	.rivet-tl{top:20px;left:20px;}
	.rivet-tr{top:20px;right:20px;}
	.rivet-bl{bottom:48px;left:20px;}
	.rivet-br{bottom:48px;right:20px;}
	.learn-more-box .rivet-tl{top:10px;left:12px;}
	.learn-more-box .rivet-tr{top:10px;right:12px;}
	.learn-more-box .rivet-bl{bottom:24px;left:12px;}
	.learn-more-box .rivet-br{bottom:24px;right:12px;}

	.section-icon{
		margin:40px auto;
	}
	
	.section-container{
		margin:74px auto;
	}

	.section-1 .section-content h1{
		font-size:2.625rem;
	}

	.section-1 .section-ribbon{
		margin:15px -29px 0 -29px;
		padding-top:15px;
	}

	.section-1 .section-ribbon .ribbon-tip-left{
		width:29px;
		height:15px;
	}

	.section-1 .section-ribbon .ribbon-tip-right{
		width:29px;
		height:15px;
	}

	.section-1 .section-ribbon .section-ribbon-inner{
		padding:40px 29px;
	}

	.section-1 .section-question{
		padding:30px 24px 20px 24px;
	}
	
	.question-design{
		padding:50px 56px 60px 56px;
		background:url('../images/metalic-no-rivets@2x.png') center center no-repeat;
		background-size:100% 100%;
	}
	.question-design.results-section{
		background:url('../images/metalic-no-rivets@2x.png') center center no-repeat;
		background-size:100% 100%;
	}	

	.ribbon-divider{
		padding-right:20px;
		border-right:1px solid #75C1FB;
	}
	.ribbon-divider img{
		max-width:331px;
	}

	.intro-question .cell{
		padding-left:8px;
		padding-right:8px;
	}

	.intro-question a{
		font-size:1em;
	}
	.intro-question a img{
		padding-bottom:12px;	
	}

	.learn-more-2-boxes{
		align-items: stretch;
		display:flex;
	}

	.learn-more-2-boxes .learn-more-container{
		width:356px;
	}

	.learn-more-2-boxes .learn-more-container h1{
		color:#3A91D3;
		font-size:1.5625rem;
		font-weight:700;
		letter-spacing:-0.0075em;
		line-height:1.2em;
	}

	.learn-more-containers{
		align-items: stretch;
		display:flex;
		justify-content: space-around;
	}

	.learn-more-container{
		margin:30px auto 0 auto;
		background:url('../images/metalic-short-no-rivets@2x.png') center center no-repeat;
		background-size:100% 100%;
	}

	.learn-more-container .learn-more-box{
		padding:40px 50px;
	}

}

@media screen and (min-width: 64em) {

	.intro-question .cell{
		padding-left:16px;
		padding-right:16px;
	}

}

/* SECTIONS LAYOUTS end */

/* TYPOGRAPHY start */

.section-content h1{
	margin:0em auto 0.5em auto;
	font-family: 'Roboto', sans-serif;
	font-size:1.75em;
	font-weight:700;
	line-height:1.14em;
	color:#3A91D3;
	text-align:center;
}

.section-content h2{
	margin:0.5em auto 0em auto;
	font-family: 'Roboto', sans-serif;
	font-size:1.4em;
	font-weight:900;
	line-height:1.33em;
	color:#EC065C;
	text-align:center;
}

.section-content p{
	max-width:970px;
	margin:0.2em auto 1em auto;
	font-size:1.0625em;
	line-height:1.3em;
	font-weight:500;
	color:#263D7A;
	text-align:center;
}
.section-ribbon-content p{
	margin:1em 0;
	font-size:1.0625em;
	line-height:1.4em;
	font-weight:500;
	color:#ffffff;
}

.question-design h1{
	margin:0em auto 0.5rem auto;
	font-family: 'Roboto', sans-serif;
	font-size:1.75em;
	font-weight:700;
	line-height:1.14em;
	color:#EC065C;
	text-align:center;
}
.question-design p{
	max-width:970px;
	margin:0.2em auto 1em auto;
	font-size:1.0625em;
	line-height:1.4em;
	font-weight:500;
	color:#263D7A;
	text-align:center;
	letter-spacing: -0.02em;
}

.question-design p.quiz-section-text{
	color:#263D7A;
	font-size:1.125em;
	font-weight:700;
	letter-spacing:0em;
	line-height:1.4em;
	margin-bottom:0rem;
	margin-top:2rem;
	text-align:center;
}

.question-design p.quiz-section-text + p{
	font-size:1rem;
}

.question-design p.quiz-section-text span{
	color:#EC065C;
}

.learn-more-container h1{
	margin:0em auto 0.5em auto;
	font-family: 'Roboto', sans-serif;
	font-size:1.5em;
	font-weight:700;
	line-height:1.0789em;
	letter-spacing:-0.0075em;
	color:#3A91D3;
	text-align:center;
}
.learn-more-container p{
	margin:1em auto;
	font-size:1.0625em;
	line-height:1.4em;
	font-weight:500;
	color:#263D7A;
	text-align:center;
	letter-spacing: -0.028em;
}

.section-3 p{
	margin:0em auto 1em auto;
	font-size:0.875em;
	line-height:1.42857em;
	font-weight:500;
	color:#263D7A;
}
.section-3 p:last-child{
	margin-bottom:0em;
}

.checker-intro-content .section-content p{
	font-size:1em;
	line-height:1.36em;
}

.checker-intro-content .section-content p.footnote{
	font-size:0.875em;
	line-height:1.14em;
}

.question-design.results-section .h0{
	margin:0 0 0.5em 0;
	font-size:1.55em;
	font-weight:700;
	line-height:1.333em;
	color:#3A91D3;
}

.question-design.results-section h1{
	font-size:1.25em;
}

.question-design.results-section a.button-pink{
	min-width:200px;
}

@media screen and (min-width: 48em) {
		
	.section-content h1{
		font-size:2.25em;
	}

	.section-content h2{
		font-size:1.875em;
	}

	.section-content p{
		font-size:1.25em;
	}
	.section-ribbon-content p{
		font-size:1.25em;
	}

	.question-design h1{
		font-size:2.25em;
	}
	.question-design p{
		font-size:1.25em;
	}
	
	.question-design p.quiz-section-text{
		font-size:1.3125em;
	}

	.question-design p.quiz-section-text + p{
		font-size:1.125rem;
	}

	.learn-more-container h1{
		font-size:2.375em;
	}
	.learn-more-container p{
		font-size:1.25em;
	}

	.section-3 p{
		font-size:0.9375em;
	}

	.checker-intro-content .section-content p{
		font-size:1.5625em;
		line-height:1.36em;
	}
	
	.checker-intro-content .section-content p.footnote{
		font-size:1.125em;
		line-height:1.14em;
	}

	.question-design.results-section .h0{
		font-size:2.25em;
	}

	.question-design.results-section h1{
		font-size: 1.625em;
	}
	
	.question-design.results-section a.button-pink{
		min-width:280px;
	}

}

/* TYPOGRAPHY end */

/* ELEMENT - PINK BUTTON start */

a.button-pink,
input.button-pink{
	display: inline-block;
	min-width:155px;
	margin:0.5em 12px;
	padding:8px 12px;
	border:3px solid #FFFFFF;
	background-color:#EC065C;
	border-radius:4px;
	font-size:1em;
	font-weight:700;
	line-height:1em;
	text-align:center;
	color:#FFFFFF;
	box-shadow:0 1px 3px #626060;
	transition: all 0.1s;
	appearance: none;
	-webkit-appearance: none;
	cursor:pointer;
}

a.button-pink:hover,
input.button-pink:hover{
	border:3px solid #EC065C;
	background-color:#FFFFFF;
	color:#EC065C;
}

@media screen and (min-width: 48em) {

	a.button-pink,
	input.button-pink{
		min-width:155px;
		margin:0.5em 12px;
		padding:12px 12px;
		border:5px solid #FFFFFF;
		font-size:1.125em;
	}

	a.button-pink:hover,
	input.button-pink:hover{
		border:5px solid #EC065C;
	}

}

/* ELEMENT - PINK BUTTON end */

/* SYMPTOM CHECKER PAGE start */ 

.symptom-checker-page .global-bar{
	height:100px;
	background-color:#75C1FB;
}

.section-tab{
	position: relative;
	top:-36px;
	margin-bottom:-52px;
	text-align:center;
}

.section-tab img {
    width:100%;
    height:auto;
}

.checker-intro-content{
	padding:1px 0 30px 0;
	position: relative;
	background-color:#d2ecfe;
}

.site-container.symptom-checker-page > section.section-3{
	margin-top:0px;
	padding:30px 0 30px 0;
}

.site-container.symptom-checker-page .section-question{
	background-color:#F6FCFF;
}

.error-message{
	height:auto;
	min-height:10px;
	margin:30px 12px 0 12px;
	border-radius:10px;
	border:3px solid #EC065C;
	padding: 12px 12px 12px 52px;
	background:url('../images/symptom-checker/artwork-alert-large.svg') 6px 12px no-repeat rgba(178,178,178,0.18);
	background-size:40px auto;
}

.error-message p{
	margin:0.25em 0 0 0;
	padding:0 0px;
	font-family: 'Roboto', sans-serif;
	font-size:0.875em;
	font-weight:500;
	line-height:1.5em;
	color:#263D7A;
}
.error-message p:first-child{
	margin:0 0 0.1em 0;
	padding:0;
	font-family: 'Roboto', sans-serif;
	font-size:1em;
	font-weight:900;
	line-height:1.32em;
	color:#EC065C;
}

.section-form-inner{
	max-width:950px;
	margin:0 auto;
}

.section-form-inner h1{
	margin:1em auto 0.1em auto;
	padding:0 20px;
	font-family: 'Roboto', sans-serif;
	font-size:1.35em;
	font-weight:900;
	line-height:1.33em;
	color:#EC065C;
}
.section-form-inner h1 span{
	display:inline-block;
	width:28px;
}

.section-form-question p{
	font-size:1em;
	line-height:1.4em;
	font-weight:500;
	color:#263D7A;
}

.section-form-question-inner{
	margin-bottom: 28px;
    padding: 0 20px;
}

.section-form-question p{
	margin-bottom:0px;
}

.section-form-question-inner ul{
	margin-bottom:0px;
}

.section-form-question-inner ul li{
	color:#263D7A;
}

.field-group-input{margin-top:14px;}

.clearfix > .field-group-input{
	width:100%;
	float:none;
}

.field-group-input:nth-child(2n+1){
	clear:left;
}

.section-form-question-inner.error{
	border-radius:10px;
	border:3px solid #EC065C;
	margin:0 12px 28px 12px;
	padding: 12px 12px 12px 42px;
	background:url('../images/symptom-checker/artwork-alert-small.svg') 6px 12px no-repeat rgba(178,178,178,0.18);
	background-size:28px 28px;
}

@media screen and (min-width: 48em) {
		
	.symptom-checker-page .global-bar{
		height:140px;
	}

	.section-tab{
		top:-70px;
		margin-bottom:-100px;
	}

	.section-tab img{
		width:auto;
		height:140px;
	}

	.checker-intro-content{
		padding:1px 0 40px 0;
	}

	.site-container.symptom-checker-page > section.section-3{
		padding:40px 0 40px 0;
	}

	.error-message{
		height:auto;
		min-height:138px;
		margin:40px 12px 0 12px;
		padding:12px 40px 12px 200px;
		background:url('../images/symptom-checker/artwork-alert-large.svg') 50px 50% no-repeat rgba(178,178,178,0.18);
		background-size:95px auto;
	}

	.error-message p{
		font-size:1.25em;
		line-height:1.5em;
	}
	.error-message p:first-child{
		font-size:1.5625em;
		line-height:1.32em;
	}

	.section-form-inner h1{
		margin:1em auto 0.1em auto;
		padding:0 20px;
		font-size:1.875em;
		line-height:1.33em;
	}
	.section-form-inner h1 span{
		width:40px;
	}

	.section-form-question p{
		font-size:1.25em;
		line-height:1.4em;
	}

	.section-form-question-inner{
		margin-bottom:32px;
		padding:0px 60px;
	}

	.field-group-input{margin-top:14px;}

	.clearfix > .field-group-input{
		width:50%;
		float:left;
	}

	.section-form-question-inner.error{
		margin:0 12px 28px 12px;
		padding:12px 60px;	
		background:url('../images/symptom-checker/artwork-alert-small.svg') 12px 11px no-repeat rgba(178,178,178,0.18);
		background-size:30px 30px;
	}

}

@media screen and (min-width: 64em) {

	.error-message{
		height:130px;
	}
	
	.section-tab{
		top:-90px;
		margin-bottom:-110px;
	}

	.section-tab img{
		width:auto;
		height:183px;
	}

}

@media screen and (min-width: 80em) {

	.error-message{
		margin:40px 0 0 0;
	}

	.section-form-question-inner.error{
		margin:0 0 28px 0;
	}

}

/* SYMPTOM CHECKER PAGE end */ 

/* FORM INPUTS start */

.checkbox-container{
	display: block;
	position: relative;
	padding-left: 32px;
	padding-right: 0%;
	margin-bottom: 0px;
	cursor: pointer;
	font-size:1em;
	line-height:1.4em;
	font-weight:500;
	color:#263D7A;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.checkbox-container input{
	position: absolute;
	opacity: 0;
	cursor: pointer;
	height: 0;
	width: 0;
}

.checkbox-container .checkmark{
	position: absolute;
	top: 0;
	left: 0;
	height: 22px;
	width: 22px;
	background-color: #F6FCFF;
	border:3px solid #263D7A;
}

.checkbox-container:hover input ~ .checkmark{background-color: rgba(178,178,178,0.18);}
.checkbox-container input:checked ~ .checkmark{background-color: #75C1FB;}
.checkbox-container .checkmark:after {content: "";position: absolute;display: none;}
.checkbox-container input:checked ~ .checkmark:after {display: block;}

/* Checkmark
.checkbox-container .checkmark:after {
	left: 9px;
	top: 5px;
	width: 5px;
	height: 10px;
	border: solid white;
	border-width: 0 3px 3px 0;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}
*/

.radio-btn-container {
	display: block;
	position: relative;
	padding-left: 32px;
	padding-right: 0%;
	margin-bottom: 0px;
	cursor: pointer;
	font-size:1em;
	line-height:1.4em;
	font-weight:500;
	color:#263D7A;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.radio-btn-container input {
	position: absolute;
	opacity: 0;
	cursor: pointer;
	height: 0;
	width: 0;
}

.radio-btn-container .radio-check{
	position: absolute;
	top: 0;
	left: 0;
	height: 22px;
	width: 22px;
	background-color: #F6FCFF;
	border-radius: 50%;
	border:3px solid #263D7A;
}

.radio-btn-container:hover input ~ .radio-check {background-color: rgba(178,178,178,0.18);}
.radio-btn-container input:checked ~ .radio-check {background-color: #75C1FB;}
.radio-btn-container .radio-check:after {content: "";position: absolute;display: none;}
.radio-btn-container input:checked ~ .radio-check:after {display: block;}

/* Checked Circle
.radio-btn-container .checkmark:after {
	top: 9px;
	left: 9px;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: white;
}
*/

@media screen and (min-width: 48em) {

	.checkbox-container{
		padding-left: 40px;
		padding-right: 15%;
		font-size:1.25em;
	}

	.checkbox-container .checkmark{
		height: 26px;
		width: 26px;
	}

	.radio-btn-container {
		padding-left: 40px;
		font-size:1.25em;
	}

	.radio-btn-container .radio-check{
		height: 26px;
		width: 26px;
	}

}

/* FORM INPUTS end */

/* EMAIL FORM start */

#symptomCheckerEmailResults{
	display: none;
}

.email-form{
	background:rgba(117,193,251,0.28);
	border-radius:5px;
	width:100%;
	max-width:736px;
	margin:1em auto;
	padding:14px 12px 8px 12px;
}

.email-form-after{
	width:100%;
	max-width:736px;
	margin:1em auto;
	padding:0px 12px 8px 12px;
}

.email-form > div{
	margin-bottom:12px;
}

.email-form > div > span{
	box-sizing: border-box;
	display:block;
	float:none;
	width:100%;
	text-align: center;
	color:#263D7A;
	font-size:1em;
	line-height:1.05em;
	padding-bottom:6px;
	vertical-align: middle;
}

.email-form > div .field-div{
	float:none;
	box-sizing: border-box;
	width:100%;
    padding: 0px 14px;
}

.email-form input{
	display:block;
	height: auto;
    margin: 0;
	padding: 6px 8px;
    border: 1px solid #fefefe;
    background-color: #fefefe;
	font-family: 'Inter', sans-serif;
    font-size: 1em;
    font-weight: 400;
    line-height: 1em;
    color: #121212;
}

.question-design.results-section .email-form .btn-div{
	box-sizing: border-box;
	float:none;
	width:100%;
}

.question-design.results-section .email-form a.button-pink{
	display:block;
	max-width:90px;
	min-width:90px;	
    margin: 10px auto 0 auto;
    font-size: 0.75em;
    padding: 10px 14px;
}

.question-design.results-section .btn-div a.button-pink{
	display:block;
	margin-left:auto;
	margin-right:auto;
	min-width:140px;
	max-width:140px;
}

.email-form-error{
	clear:left;
	width:100%;
	text-align:center;
	line-height:1.14em;
	font-size:19px;
	font-weight:700;
	padding:0.5em 0 0 0;
}

.email-form-after > p{
	font-size:1.0625em;
	font-weight:700;
	line-height:1.4em;
	margin:2.25rem 0 1rem 4rem;
	max-width:970px;
	position: relative;
	text-align:left;
}

@media screen and (min-width: 48em) {

	.email-form-after > p{
		font-size:16px;
	}

}



.sc-opt-in-container{
	display: block;
	position: relative;
	padding-left: 64px;
	margin-bottom:1.5rem;
	cursor: pointer;
	color: #263D7A;
	font-size:1.0625em;
	font-weight:500;
	line-height:1.4em;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.sc-opt-in-container a{
	color: #263D7A;
	text-decoration: underline;
}

.sc-opt-in-container input {
	position: absolute;
	opacity: 0;
	cursor: pointer;
	height: 0;
	width: 0;
}

.sc-opt-in-container .checkmark {
	background-color:#FFFFFF;
	border:3px solid #263D7A;	
	height: 23px;
	left: 0;
	position: absolute;
	top: 0;
	width: 23px;
}

.sc-opt-in-container:hover input ~ .checkmark {
	background-color:#FFFFFF;
}

.sc-opt-in-container .checkmark:after {
	content: "";
	position: absolute;
	display: none;
}

.sc-opt-in-container input:checked ~ .checkmark:after {
	display: block;
}

.sc-opt-in-container .checkmark:after {
	left: 6px;
    top: 1px;
    width: 6px;
    height: 13px;
	border: solid #263D7A;
	border-width: 0 3px 3px 0;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
}

@media screen and (min-width: 48em){

	.email-form{
		width:100%;
		padding:14px 12px 8px 12px;
	}

	.email-form-after{
		width:100%;
		padding:0px 12px 8px 12px;
	}
	
	.email-form > div > span{
		float:left;
		width:28%;
		font-size:1em;
		line-height:46px;
		padding-bottom:0;
	}
	
	.email-form > div .field-div{
		float:left;
		width:72%;
	}
	
	.email-form input{
		padding: 10px 14px;
		font-size: 1em;
	}
	
	.question-design.results-section .email-form a.button-pink{
		font-size:0.75em;
		max-width:90px;
		min-width:90px;
		margin:0 auto;
		padding:10px 14px;
	}
	
	.question-design.results-section .btn-div a.button-pink{
		min-width:160px;
		max-width:160px;
	}

}

@media screen and (min-width: 64em){
	
	.email-form{
		width:100%;
		padding:14px 12px 8px 12px;
	}

	.email-form-after{
		width:100%;
		padding:0px 12px 8px 12px;
	}
	
	.email-form > div > span{
		float:left;
		width:24%;
		font-size:1.25em;
		line-height:46px;
	}
	
	.email-form > div .field-div{
		width:76%;
	}
	
	.email-form input{
		padding: 10px 14px;
		font-size: 1.25em;
	}
	
	.question-design.results-section .email-form .btn-div{
		width:22%;
	}
	
	.question-design.results-section .email-form a.button-pink{
		font-size:0.875em;
		max-width:90px;
		min-width:90px;
		padding:10px 14px;
	}
	
	.question-design.results-section .btn-div a.button-pink{
	}

}

/* EMAIL FORM end */






/* ELEMENT - PARAGRAPH ICONS start */

.icon-exclamation{
	padding-left:50px;
	background:url('/assets/images/global/icon-exclamation.png') left center no-repeat;
	background-size:30px auto;
}

.icon-exclamation.bg-top{
	margin-top:2em;
	background-position: top left;
}

@media screen and (min-width: 48em) {

	.icon-exclamation{
		padding-left:84px;
		background:url('/assets/images/global/icon-exclamation.png') left center no-repeat;
		background-size:40px auto;
	}

}

/* ELEMENT - PARAGRAPH ICONS end */

/* COMPOENTS - COTENT WITH NUMBER AND INDENT start */

.numbered-content{
	position: relative;
	margin-bottom:40px;
	padding-left:40px;
	padding-top:2px;
}

.numbered-content .number{
	position: absolute;
	top:0;
	left:0;
	display:block;
	width:30px;
	height:30px;
	border-radius:100%;
	background-color:#0075BC;
	color:#FFE55A;
	line-height:30px;
	vertical-align: middle;
	text-align:center;
	font-size:1em;
}

@media only screen and (min-width:48em){

	.numbered-content{
		margin-bottom:70px;
		padding-left:90px;
	}

	.numbered-content .number{
		width:40px;
		height:40px;
		line-height:40px;
		font-size:1.0625em;
	}

}

/* COMPOENTS - COTENT WITH NUMBER AND INDENT end */

.back-to-menu{
	text-align:center;
}
.back-to-menu a{
	color:#263D7A;
	display:block;
	font-size:1.325rem;
	font-weight:700;
	line-height:1.15384em;
	margin:0 auto 2rem auto;
	max-width:200px;
}
.back-to-menu a img{
	display:block;
	margin:0 auto 1rem auto;
}

@media only screen and (min-width:48em){

	.back-to-menu a{
		font-size:1.625rem;
	}

}

.dyk-content{
	align-items: center;
	display:flex;
	
}

.content-bottom-box{
	background-color: #d2ecfe;
    margin-top: -340px;
    padding-top: 340px;
}

.content-bottom-box p{
	font-size:1rem;
	line-height:1.4em;
	margin:0rem auto;
	max-width:810px;
	padding:0 0 2rem 0;
	text-align: center;
	width:88%;
}

@media only screen and (min-width:48em){

	.content-bottom-box p{
		font-size:1.25rem;
		width:80%;
	}


}