* { margin: 0px; padding: 0px; -webkit-font-smoothing: antialiased; box-sizing: border-box; -webkit-box-sizing: border-box; -webkit-text-size-adjust: none; }
html, body { width: 100%; font-size: 20px; line-height: 1.25; color: #000; font-family: 'Verlag'; background: #f8f8f6; }
*::-webkit-input-placeholder { opacity:1; color: #000; }
*::-moz-placeholder {opacity:1;color: #000; }
*:-ms-input-placeholder {opacity:1;color: #000;}

input[type=checkbox]{ -webkit-appearance: checkbox; margin: 5px 0 0 5px; display: inline-block; vertical-align: top;}
button, input, textarea, select { -webkit-appearance: none; -webkit-border-radius: 0px; font-family: 'Source Sans Pro', sans-serif;  }

:focus,input:focus, textarea:focus { outline: none; }
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; vertical-align: baseline; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
:focus { outline: none; }

/* common */
b,strong { font-weight:600;}
a { transition: all 0.3s; -webkit-transition: all 0.3s; -ms-transition: all 0.3s; text-decoration: none; outline: none; color: #809c68; }
ul { list-style: none; }
.clear { clear: both; overflow: hidden; font-size:0; line-height:0; }
img { border: 0px; outline: none; display: block; max-width: 100%; }
p { font-weight:300; letter-spacing: 0.01em; }
p a { display: inline-block; vertical-align: top; color: #809c68; text-decoration:none; font-style:italic; font-weight:400; }
p a:hover { text-decoration:none; }
.mob-show { display: none !important; }

.layout_wrapper { max-width: 1170px; padding: 0 15px; margin: auto; position: relative; }
.flex-row { display: flex; -webkit-display: flex; flex-wrap:wrap; -webkit-flex-wrap:wrap; }

/* wrapper */
#wrapper { overflow: hidden; /*padding-top:61px;*/ /*padding-top:163px;*/ width: 100%; min-height: 100%; position: relative; }
.cont_wrapper { width: 100%; max-width: 1120px; padding: 0 15px; margin: auto; position: relative; }
.layout_wrapper { max-width:1280px; margin:0 auto; position:relative; }
.flex-wrap { display: flex; -webkit-display: flex; flex-wrap:wrap; -webkit-flex-wrap:wrap; }


.head-wrap { width: 100%; position: relative; left:0; top:0; padding-bottom:61px; background: #fff; z-index:99; }
.ad_container { width: 100%; min-height:110px; background-color: #fff}
.ad_container .ad { display: block; width: 100%; text-align: center; max-width: 100%; margin: 0px auto; padding: 10px 0; max-height: 110px; }
.ad_container .ad img { vertical-align: top; }

/*********Header Css*********/
header { width:100%; background:#151515; text-align:center;  position:absolute; z-index:999999; left:0; bottom:0;   }
/*header { width:100%; background:#151515; text-align:center;  position:fixed; z-index:999999; left:0; top:0;  }*/
header .header_inner{float:left; width:100%; padding:0 15px; border-top:4px solid #bce2f1; position:relative; min-height:55px; z-index:99;}
header.show { position: fixed; top:0; bottom: auto; }
.ad iframe { background: rgba(0,0,0,0.05); }

.logobar { float: left; padding: 5px 0 3px 0px; }
.logobar a.site-logo { display:inline-block; max-width: 114px; vertical-align: middle; margin-bottom: 6px; }
.logobar a.brand-logo { display:inline-block; max-width: 114px; vertical-align: middle; }
.logobar .plus { display:inline-block; max-width: 12px; margin: 0 3px; vertical-align: middle; }

header a.paid_logo{ display:inline-block;width:auto;  margin:0 auto;vertical-align:top; color:#000; text-transform:uppercase; font-family: 'Source Sans Pro', sans-serif; font-size:13px; line-height: 18px; font-weight:600; background:#bce2f1; padding:0 10px 3px 10px; position:absolute; top:0; left:50%; transform:translateX(-50%); -webkit-transform:translateX(-50%); -moz-transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%);}
a.paid_logo i{ padding:0 0 0 5px; font-size:13px; }
header .show_text { float:left; width:100%; font-family: 'Source Sans Pro', sans-serif; font-size:11px; font-weight:600; color:#151515; text-transform:uppercase; text-align:center; background:#fff; padding:8px 20px; margin:0; position:relative; display:none; line-height:14px; position:absolute; left:0; top:100%; width:100%; box-shadow: 0px 2px 2px rgba(0,0,0,0.1); }
header .show_text a { color: #003865; font-style: normal; font-weight: bold; }
header .show_text span.close{ position:absolute; right:2px; top:10px; width:20px; height:20px; cursor:pointer;}
header .show_text span.close:before, header .show_text span.close:after { position:absolute; left:10px; content:""; height:13px; width:1px; background-color:#151515; }
header .show_text span.close:before { transform: rotate(45deg); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); }
header .show_text span.close:after { transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); }
header ul.social_icon{ list-style:none; float:right; width:auto; margin-top:14px;}
header ul.social_icon li{ list-style:none; display:inline-block; float:left; margin-left:10px;  }
header ul.social_icon li:first-child{ margin-left:0; }
header ul.social_icon li a{ display:block; width:32px; height:32px; border-radius:50%; border:2px solid #fff; opacity:1; transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease;}
header ul.social_icon li a i{ font-size:15px; line-height:28px; vertical-align: top; color:#fff; display:inline-block; }
header ul.social_icon li a:hover{opacity:0.7; }

/*content-part*/
#content-part { width: 100%; position: relative; }

/*intro_sec*/
.intro_sec { position: relative; padding: 70px 0 55px; text-align: center; color:#fff; width: 100%; background:#ffc5c9; }
.intro_sec:after,
.intro_sec:before { width: 270px; height: 504px; content:''; position:absolute; left:0; top:49.5%; transform: translate(0,-50%); -webkit-transform: translate(0,-50%); background:url(../images/hand-left.png) left top no-repeat; background-size:contain; }
.intro_sec:after { left:auto; right:0; background-image:url(../images/hand-right.png); background-position: right top; }

.intro_sec .inner { width: 100%; max-width: 785px; margin:0 auto; position: relative; }
.intro_sec h1 { font-size: 54px; line-height: 1.4; font-family: 'Corben'; font-weight:700; padding-bottom: 20px; }
.intro_sec .title { position: relative; }
.intro_sec .title .label { max-width: 130px; position:absolute; right:60px; top:-50px; } 
.intro_sec h2 { padding: 17px 0 20px; letter-spacing:0.01em; color: #ffffff; font-family: 'Verlag'; font-size: 30px; font-weight: 900; line-height: 1; text-transform: uppercase; } 
.intro_sec p { color: #ffffff; font-family: "Verlag"; font-size: 26px; font-weight: 900; line-height: 1.12; letter-spacing: 0em; }
.intro_sec .brands { text-align: center; padding:40px 0 0; }
.intro_sec .brands li { padding: 0 5px; display: inline-block; vertical-align: middle; }
.intro_sec .brands li img { max-height:34px; } 
.intro_sec .brands li a { display: inline-block; vertical-align: middle; } 
.intro_sec .brands li span.plus-icon { margin: 0 5px 0 0; display: inline-block; vertical-align: middle; max-width: 11px; } 

/*activity_sec*/
.activity_sec { color:#ffbedc; text-align: center; width: 100%; position: relative; } 
.activity_sec .inner_section { padding: 20px 0; min-height:485px; align-items:center; -webkit-align-items:center; display:none; }
.activity_sec .inner_section.active { display: flex !important; -webkit-display: flex !important; }
.activity_sec .quiz_opener { background:#d1113a; }
.activity_sec h2 { font-size: 58px; line-height: 1.2; font-family: 'Corben'; font-weight:700; }
.activity_sec h3 { padding: 17px 0 20px; letter-spacing:0.01em; font-family: 'Verlag'; font-size: 32px; font-weight: 700; font-style:italic; line-height: 1; } 
.activity_sec p { color: #ffffff; font-family: "Verlag"; font-size: 26px; font-weight: 900; line-height: 1.12; }
.activity_sec .button { font-size: 35px; line-height:1.1; color:#ffbedc; border: 3px solid #ffbedc; font-weight:900; border-radius: 8px; -webkit-border-radius: 8px; display: table; margin: 0 auto 25px; padding: 11px 20px; }
.activity_sec a.button:hover { background: #ffbedc; color: #d1113a; }
.activity_sec .arrow-icon { max-width: 38px; display: inline-block; vertical-align: top; animation: bounce 2s infinite; -webkit-animation: bounce 2s infinite; }



/*quiz_steps*/
.activity_sec .quiz_steps { padding-top:40px; }
.activity_sec .quiz_steps h2 { font-size: 40px; padding-bottom: 35px; } 
.activity_sec .quiz_steps .quiz_list li { padding-bottom: 16px;  font-size: 30px; line-height: 1.1; font-weight:700; }
.activity_sec .quiz_steps .quiz_list li strong { font-weight:900; } 
.activity_sec .quiz_steps .arrows { padding: 23px 0 0 0; display: none; }
.activity_sec .quiz_steps .arrows .arrow { margin: 0 75px; width: 120px; height: 30px; position: relative; font-size:0; line-height:0; display: inline-block; vertical-align: top; }
.activity_sec .quiz_steps .arrows .arrow:before { width: calc(100% - 5px); height: 3px; content:''; position:absolute; left:5px; top:50%; margin-top:-1px; background:#fff; } 
.activity_sec .quiz_steps .arrows .arrow:after { width: 0; height:0; content:''; position:absolute; left:-10px; top:50%; margin-top: -10px; border: 10px solid transparent; border-right: 19px solid #fff; } 
.activity_sec .quiz_steps .arrow.next { transform: scale(-1); -webkit-transform: scale(-1); pointer-events: none; opacity:0.5; }
.activity_sec .quiz_steps .arrow.next.enable { pointer-events: initial; opacity:100; }


/*step1*/
.activity_sec .quiz_steps.step1 { background: #f6cc56; color: #5575d5; }
.activity_sec .quiz_steps.step1 .quiz_list li a { color: #5575d5; }
.activity_sec .quiz_steps.step1 .arrow:before { background:#5575d5; } 
.activity_sec .quiz_steps.step1 .arrow:after { border-right-color:#5575d5; } 

/*step2*/
.activity_sec .quiz_steps.step2 { background: #ffa8a6; color: #c1393b; }
.activity_sec .quiz_steps.step2 .quiz_list li a { color: #c1393b; }
.activity_sec .quiz_steps.step2 .arrow:before { background:#c1393b; } 
.activity_sec .quiz_steps.step2 .arrow:after { border-right-color:#c1393b; } 

/*step3*/
.activity_sec .quiz_steps.step3 { background: #94a8e3; color: #f3d5d7; }
.activity_sec .quiz_steps.step3 .quiz_list li a { color: #f3d5d7; }
.activity_sec .quiz_steps.step3 .arrow:before { background:#f3d5d7; } 
.activity_sec .quiz_steps.step3 .arrow:after { border-right-color:#f3d5d7; } 

/*step4*/
.activity_sec .quiz_steps.step4 { background: #d1113a; color: #ffbedc; }
.activity_sec .quiz_steps.step4 .quiz_list li a { color: #ffbedc; }
.activity_sec .quiz_steps.step4 .arrow:before { background:#ffbedc; } 
.activity_sec .quiz_steps.step4 .arrow:after { border-right-color:#ffbedc; } 

/*step5*/
.activity_sec .quiz_steps.step5 { background: #f6cc56; color: #5575d5; }
.activity_sec .quiz_steps.step5 .quiz_list li a { color: #5575d5; }
.activity_sec .quiz_steps.step5 .arrow:before { background:#5575d5; } 
.activity_sec .quiz_steps.step5 .arrow:after { border-right-color:#5575d5; } 

.activity_sec .result { background-position: right center; background-repeat:no-repeat; background-size:auto 100%; display:none; }
/*.activity_sec .result .text { max-width: 580px; width:100%; }*/
.activity_sec .result .text { max-width: 580px; display: table; }
.activity_sec .result5 .text { max-width: 770px; }
.activity_sec .result5 .cont_wrapper { max-width: 1200px; }

.activity_sec .result .text .explore_more {
    color: #fff;
    font-size: 20px;
    line-height: 1.2;
    display: table;
    margin: 20px auto 0;
    border: 1px solid;
    padding: 10px 20px;
}

.activity_sec .result .text h2 { padding-bottom: 10px; font-size: 60px; line-height:1.35; color: #fff; }
.activity_sec .result .text h2.small { font-size:40px; } 
.activity_sec .result .text h3 { padding: 0 0 20px 0; font-size: 29px; line-height:1.1; color: #fff; font-style:normal; }
.activity_sec .result .text h3 a { font-style:italic; color: #fff; }
.activity_sec .result .text h3 a:hover { text-decoration:underline; }

.activity_sec .result .text .logo { display: inline-block; vertical-align: top; }
.activity_sec .result .text .logo.hg { max-width: 257px; }
.activity_sec .result .text .logo.rs { max-width: 251px; }
.activity_sec .result .text .logo.bhg { max-width: 206px; }
.activity_sec .result .text .logo.instyle { max-width: 196px; }
.activity_sec .result .text .logo.people { max-width: 147px; }
.activity_sec .result .checkout { display: block;color: #fff; font-size: 20px; line-height:1.2; padding-top:20px; }


.activity_sec .result1 { background-color:#fcc5c8; }
.activity_sec .result1 .text .explore_more,
.activity_sec .result1 .checkout,
.activity_sec .result1 .text h3 a,
.activity_sec .result1 .text h3 ,
.activity_sec .result1 .text h2 { color: #d82a34; }

.activity_sec .result2 { background-color:#a8012d; }

.activity_sec .result3 { background-color:#f9cf63; }
.activity_sec .result3 .text .explore_more,
.activity_sec .result3 .checkout,
.activity_sec .result3 .text h3 a,
.activity_sec .result3 .text h3 ,
.activity_sec .result3 .text h2 { color: #d82a35; }

.activity_sec .result4 { background-color:#e67b8d; }

.activity_sec .result5 { background-color:#9fcbfa; }

.activity_sec .result .text .explore_more:hover { color: #000; }
.activity_sec .quiz_steps .quiz_list li a.active,
.activity_sec .quiz_steps .quiz_list li a:hover { color: #000 ; }
.activity_sec .quiz_steps .arrow:hover:before { background:#000; } 
.activity_sec .quiz_steps .arrow:hover:after { border-right-color:#000; } 
.activity_sec #result.active .result1.active ,
.activity_sec #result.active .result2.active ,
.activity_sec #result.active .result3.active ,
.activity_sec #result.active .result4.active ,
.activity_sec #result.active .result5.active { display: flex !important; -webkit-display: flex !important; }

/*explore_sec*/
.explore_sec { width: 100%; }
.explore_sec .explore { padding: 65px 0; width: 100%; position: relative; display:none; }
.explore_sec .explore.active { display: block !important; }
.explore_sec .cont_wrapper { max-width: 1000px; }
.explore_sec .explore1 { background: #ffa8a6; }
.explore_sec .explore2 { background: #d1113a; }


.explore_sec .explore1 .top .left { padding:30px 0 0 0px; width: 33.7%; }
.explore_sec .explore1 .top .right { width: 66.3%; }
.explore_sec .explore1 .top .left img { border-radius: 0 0 0 40px; -webkit-border-radius: 0 0 0 40px; }
.explore_sec .explore2 .top { background: #c00224; }
.explore_sec .explore2 .top .left { padding:0px 0 0 0px; width: 37.5%; margin-right:-15px; }
.explore_sec .explore2 .top .left img { float: right; margin: 0 -22px 0 0; }
.explore_sec .explore3 { background: #f6cc56; }
.explore_sec .explore3 .top { background: #f7c854; height:530px; }
.explore_sec .explore3 .top .left { vertical-align: top; position:relative; padding:0px 0 0 0px; width: 40%; }
.explore_sec .explore3 .top .left img { height: 100%; width:auto; max-width:inherit; position:absolute; left:0; top:0; border-radius: 40px 0 0 0; -webkit-border-radius: 40px 0 0 0; }
.explore_sec .explore3 .top .right { width: 60%; }
.explore_sec .explore3 .top h2 { font-size: 56px; }
.explore_sec .explore3 .top p { max-width: inherit; }
.explore_sec .explore4 { background: #ebbbbb; }
.explore_sec .explore4 .top { background: #ff7e94; }
.explore_sec .explore4 .top .left { padding:0px 15px 0 0px; }
.explore_sec .explore4 .top .left img { float: right; margin: 10px -40px 0 0; }
.explore_sec .explore4 .top p { max-width: inherit; }
.explore_sec .explore5 { background: #94a8e3; }
.explore_sec .explore5 .top { background: #9bc4f6; }
.explore_sec .explore5 .top h2 { font-size: 57px; }
.explore_sec .explore5 .top p { max-width: inherit; font-size: 21px; }
.explore_sec .explore5 .top .left { padding:0px 0 0 20px; }
.explore_sec .explore5 .top .left img { float: left; margin-right:-70px; max-width: 375px; float: left; }
.explore_sec .explore5 .top .right { padding-top:20px; padding-bottom: 20px; }



.explore_sec .top { overflow: hidden; position: relative; margin-bottom:45px; color: #fff; width: 100%; display: table; border: 4px solid #fff; border-radius: 40px; -webkit-border-radius: 40px; background: #fec2c4; }
.explore_sec .top .image_title { z-index:1; position: absolute; left: 15px; top: 28px; font-size: 22px; line-height: 1.1; display: block; }
.explore_sec .top .image_title a { color: #fff; font-style:italic; }
.explore_sec .top .image_title a:hover { text-decoration:underline; }
  
.explore_sec .explore2 .top .image_title { top:auto; bottom: 25px; left:25px; }
.explore_sec .explore3 .top .image_title { top:auto; bottom: 25px; left:15px; }
.explore_sec .explore4 .top .image_title { top:auto; bottom: 25px; left:15px; }
.explore_sec .explore5 .top .image_title { top:auto; bottom: 30px; left:30px; }

.explore_sec .top .left { display: table-cell; vertical-align: bottom; width: 35%; padding: 40px 40px 0; }
.explore_sec .top .right { padding: 35px 20px 35px 30px; display: table-cell; vertical-align: middle; width: 65%; }
.explore_sec .top h2 { padding: 0 0 15px 0; font-size: 60px; line-height: 1.1; font-family: 'Corben'; font-weight:700; }
.explore_sec .top h3 { padding: 5px 0 10px; color: #ffffff; font-family: 'Verlag'; font-size: 29px; font-weight: 700; line-height: 1.1; } 
.explore_sec .top h4 { padding: 0px 0 10px; color: #ffffff; font-family: 'Verlag'; font-size: 22px; font-weight: 700; font-style:italic; line-height: 1.1; } 
.explore_sec .top h4 a { color: #fff; }
.explore_sec .top h4 a:hover { text-decoration:underline; }

.explore_sec .brand { margin-bottom: 25px; display: inline-block; vertical-align: top; }
.explore_sec .hg-logo { max-width: 257px; }
.explore_sec .rs-logo { max-width: 252px; }
.explore_sec .top p { font-size:22px; line-height: 1.25; letter-spacing:-0.01em; } 
.explore_sec .content_list { max-width: 860px; margin:0 auto; width:100%; }
.explore_sec .content_list .flex-row { margin-top:-10px; align-items:center; -webkit-align-items:center; }
.explore_sec .content_list .image { width: 408px; height:408px; position: relative; }
.explore_sec .content_list .image img { width: 100%; height:100%; object-fit:cover; border: 4px solid #fff; border-radius: 50%; -webkit-border-radius: 50%; } 
.explore_sec .content_list .text { color: #fff; width: calc(100% - 408px); padding: 30px 25px 30px 35px; text-align:  center; } 
.explore_sec .content_list .flex-row:nth-of-type(odd) .text { order:-1; padding: 30px 35px 30px 25px; } 
.explore_sec .content_list .text h4 { margin:0 -15px; padding-bottom: 13px; font-size: 40px; line-height: 1.1; font-family: 'Corben'; font-weight:700; } 
.explore_sec .content_list .text p { font-size: 20px; line-height:1.1; letter-spacing:normal; }
.explore_sec .btn_group { justify-content: center; -webkit-justify-content: center; margin: 0 -25px; padding-top:90px; }
.explore_sec .btn_group .col3 { padding: 0 25px; width: 33.33%; }
.explore_sec .btn_group .button { font-size: 35px; line-height:1.2; font-family: 'Verlag'; font-weight:900; color: #fff; border: 2px solid #fff; border-radius: 7px; -webkit-border-radius: 7px; display: block; text-align: center; padding: 10px; }
.explore_sec .btn_group .button:hover { background: rgba(0,0,0,0.1); }


/*color_sec*/
.color_sec { text-align: center; width: 100%; display: flex; -webkit-display: flex; flex-wrap:wrap; -webkit-flex-wrap:wrap; }
.color_sec .col5 { padding: 5px; width: 20%; background:#ffa8a6; }
.color_sec .col5 img { transition:all 0.3s; -webkit-transition:all 0.3s; display: inline-block; vertical-align: top; width: 100%; max-width: 240px; }
.color_sec .col5 img.hover { opacity:0; position:absolute; left:50%; top:50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); }
.color_sec .col5 a:hover img.hover { opacity: 100; }
.color_sec .col5 a:hover img.main { opacity: 0; }
.color_sec .col5:nth-of-type(2) { background: #d1113a; }
.color_sec .col5:nth-of-type(3) { background: #f6cc56; }
.color_sec .col5:nth-of-type(4) { background: #ebbbbb; }
.color_sec .col5:nth-of-type(5) { background: #94a8e3; }
/*.color_sec .col5 a:hover { transform: scale(0.95); }*/
.color_sec .col5 a { display: inline-block; vertical-align: top; position: relative; } 



/*footer*/
.footer { width: 100%; background: #151515; padding: 25px 0 20px; text-align: center; z-index: 9999; line-height: 20px; }
.footer a.footer_logo { display: inline-block; line-height: 20px; vertical-align: top; }
.footera.footer_logo img { vertical-align: top; width: 169px; }
.footer ul { list-style: none; padding: 16px 0 0; line-height: 20px; }
.footer ul li { display: inline-block; vertical-align: top; font-family: 'Source Sans Pro', sans-serif; font-size: 11px; line-height: 16px; font-weight: 600; color: #fff; padding: 0 2px 0 6px; position: relative; }
.footer ul li:not(:first-child):after { width: 1px; height:10px; content:''; position:absolute; left: 0; top:5px; background:#fff; }
.footer ul li:first-child { background: none; }
.footer ul li a { display: block; color: #fff; }
.footer ul li a:hover, footer ul li a:focus { color: #888888; }


@keyframes bounce {
  0%    { transform: translateY(0); }
  50%   { transform: translateY(10px); }
  100%  { transform: translateY(0); }
}

@-webkit-keyframes bounce {
  0%    { -webkit-transform: translateY(0); }
  50%   { -webkit-transform: translateY(10px); }
  100%  { -webkit-transform: translateY(0); }
}
