body { color: #ffffff; font-size: 20px; direction: rtl; letter-spacing: normal; font-family: 'HelveticaHebrew'; font-family: 'HelveticaHebrew', 'NespressoLucas',Helvetica, Arial, sans-serif !important; font-size: 20px; background: #000000; }
@import url('https://fonts.googleapis.com/css?family=Open+Sans');

@media(max-width:991px) and (min-width:768px) {
    body { font-size: 25px; }
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-family: 'HelveticaHebrew', 'NespressoLucas', 'Open Sans',Helvetica, Arial, sans-serif !important; }
body.overFlowHidden { overflow-y: hidden; }
.scn-reader-only { width: 1px; height: 1px; overflow: hidden; position: absolute; }

@font-face { font-family: 'NespressoLucas'; font-weight: bold; src: url(fonts/NespressoLucas-XtraBd.eot); src: url(fonts/NespressoLucas-XtraBd.eot?#iefix) format('embedded-opentype'), url(fonts/NespressoLucas-XtraBd.woff) format('woff'), url(fonts/NespressoLucas-XtraBd.ttf) format('truetype'); }
@font-face { font-family: 'NespressoLucas'; font-style: italic, oblique; src: url(fonts/NespressoLucas-Italic.eot); src: url(fonts/NespressoLucas-Italic.eot?#iefix) format('embedded-opentype'), url(fonts/NespressoLucas-Italic.woff) format('font-woff')}

.toFade { position: relative; opacity: 0; -webkit-transition: all 1s ease-in-out; -moz-transition: all 1ms ease-in-out; -o-transition: all 0s ease-in-out; -ms-transition: all 0s ease-in-out; transform: translateY(-10px); -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); }
    .toFade.faded { animation: fadeElements .5s forwards; -webkit-animation: fadeElements .5s forwards }
::-webkit-scrollbar { width: 6px; height: 2px; }
::-webkit-scrollbar-button { width: 6px; height: 0px; }
::-webkit-scrollbar-thumb { background: #929292; border: 0px none #ffffff; border-radius: 0px; }
    ::-webkit-scrollbar-thumb:hover { background: #929292; }
    ::-webkit-scrollbar-thumb:active { background: #929292; }
::-webkit-scrollbar-track { background: #ffffff; border: 0px none #ffffff; border-radius: 0px; }
    ::-webkit-scrollbar-track:hover { background: #ffffff; }
    ::-webkit-scrollbar-track:active { background: #ffffff; }
::-webkit-scrollbar-corner { background: transparent; }

@font-face { font-family: 'HelveticaHebrew'; src: url(fonts/HelveticaHebrew-Regular.ttf) format('truetype'); src: url(fonts/HelveticaHebrew-Regular.eot?#iefix) format('embedded-opentype'),  url(fonts/HelveticaHebrew-Regular.ttf) format('truetype'); unicode-range: U+590-5ff,U+000-03F; }
@font-face { font-family: 'NespressoLucas-Regular'; src: url(fonts/NespressoLucas-Regular.ttf) format('truetype'); src: url(fonts/NespressoLucas-Regular.eot?#iefix) format('embedded-opentype'), url(fonts/NespressoLucas-Regular.woff) format('woff'), url(fonts/NespressoLucas-Regular.ttf) format('truetype'); }
@font-face { font-family: 'NespressoLucas-Bold'; src: url(fonts/NespressoLucas-Bold.ttf) format('truetype'); src: url(fonts/NespressoLucas-Bold.eot?#iefix) format('embedded-opentype'), url(fonts/NespressoLucas-Bold.woff) format('woff'), url(fonts/NespressoLucas-Bold.ttf) format('truetype'); }

.breadcrumbs { text-align: center; width: 100%; font-size: 70%; position: fixed; pointer-events: none; z-index: 1; top: 540px; }
    .breadcrumbs.faded { pointer-events: auto; }
    .breadcrumbs .previous { left: 0; position: absolute; font-size: 1em; line-height: 2.14286em; letter-spacing: .10714em; }
    .breadcrumbs .link { font-weight: 400; text-decoration: none; color: #fff; margin: 0; cursor: pointer; position: absolute; left: 50%; top: 50px; line-height: 1; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); }
    .breadcrumbs .ol { display: inline-block; position: relative; margin: 0 auto; padding: 0; list-style: none; direction: ltr; }
        .breadcrumbs .ol .line { content: ""; display: block; position: absolute; top: 50%; left: 1px; right: 1px; height: 2px; margin-top: -3px; background: url(images/doted.svg) repeat-x; width: 32px; left: 30px; }
        .breadcrumbs .ol .line-2 { left: 94px; }
        .breadcrumbs .ol .line-3 { left: 157px; }
        .breadcrumbs .ol .line-4 { left: 220px; }
        .breadcrumbs .ol .line-5 { left: 284px; }
        .breadcrumbs .ol .stepNum { position: relative; z-index: 10; display: inline-block; margin: 0 16px; border: 1px solid #fff; border-radius: 100%; text-shadow: 0 0 #979797; overflow: hidden; box-sizing: border-box; transition: none; width: 28px; height: 28px; }
            .breadcrumbs .ol .stepNum:first-child { margin-left: 0; }
            .breadcrumbs .ol .stepNum:last-child { margin-right: 0; }
            .breadcrumbs .ol .stepNum.checked { background: #fff; }
            .breadcrumbs .ol .stepNum.active { background: #fff; transition: all 0s ease-in-out .6s; }
            .breadcrumbs .ol .stepNum span:before { content: ""; position: absolute; }
            .breadcrumbs .ol .stepNum.active span.roundNum { color: #000; transition: all .4s ease-in-out; }
            .breadcrumbs .ol .stepNum.active:after, .breadcrumbs .ol .stepNum.active span.before { transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); }
            .breadcrumbs .ol .stepNum.active span.before { transition: all .4s ease-in-out; }
            .breadcrumbs .ol .stepNum:after, .breadcrumbs .ol .stepNum span.before { content: ""; display: block; position: absolute; left: 50%; top: 50%; width: 28px; height: 28px; transform: translate(-150%,-50%); -webkit-transform: translate(-150%,-50%); -moz-transform: translate(-150%,-50%); -ms-transform: translate(-150%,-50%); -o-transform: translate(-150%,-50%); border-radius: 100%; background: #fff; content: ""; display: block; position: absolute; left: 50%; top: 50%; width: 28px; height: 28px; transform: translate(-150%,-50%); -webkit-transform: translate(-150%,-50%); -moz-transform: translate(-150%,-50%); -ms-transform: translate(-150%,-50%); -o-transform: translate(-150%,-50%); border-radius: 100%; background: #fff; }
            .breadcrumbs .ol .stepNum.checked:before { transition: all .4s ease-in-out; transform: translate(150%,-50%); -webkit-transform: translate(150%,-50%); -moz-transform: translate(150%,-50%); -ms-transform: translate(150%,-50%); -o-transform: translate(150%,-50%); }

            .breadcrumbs .ol .stepNum:after { z-index: 1; transition: transform .4s ease-in-out; }
            .breadcrumbs .ol .stepNum.checked:after { background: #fff; transform: translate(100%,-50%); -webkit-transform: translate(100%,-50%); -moz-transform: translate(100%,-50%); -ms-transform: translate(100%,-50%); -o-transform: translate(100%,-50%); transition: transform .4s ease-in-out; }
            .breadcrumbs .ol .stepNum i, .breadcrumbs .ol .stepNum span.roundNum { position: relative; z-index: 10; display: block; width: 26px; line-height: 26px; font-size: 1em; text-align: center; transition: all .4s ease-in-out; top: 1px; background-color: re; }
            .breadcrumbs .ol .stepNum.checked i, .breadcrumbs .ol .stepNum.checked span { color: #000; }
            .breadcrumbs .ol .stepNum img { height: 10px; position: relative; top: 3px; }

@media(max-width:991px) {
    .breadcrumbs { top: 470px; }
        .breadcrumbs .ol .stepNum i, .breadcrumbs .ol .li span.roundNum { top: 3px; }
        .breadcrumbs .ol .stepNum img { top: 5px; }
        .breadcrumbs .ol .line { display: none }

    .breadcrumbs { height: 75px; top: 0; text-align: center; margin-top: 0; padding-top: 20px; /*background: -webkit-linear-gradient(top,rgba(0,0,0,.9),rgba(0,0,0,.3),transparent); background-image: -moz-linear-gradient(top,rgba(0,0,0,.52),rgba(0,0,0,.3),rgba(0,0,0,.2),transparent); background-image: -ms-linear-gradient(top,rgba(0,0,0,.52),rgba(0,0,0,.3),rgba(0,0,0,.2),transparent); background-image: -o-linear-gradient(top,rgba(0,0,0,.52),rgba(0,0,0,.3),rgba(0,0,0,.2),transparent); background-image: linear-gradient(top,rgba(0,0,0,.52),rgba(0,0,0,.3),rgba(0,0,0,.2),transparent);*/ position: absolute; }
        .breadcrumbs .link { top: 60px; }
        .breadcrumbs .ol .stepNum span.roundNum { display: none; }
        .breadcrumbs .ol:before { display: none; }
        .breadcrumbs .ol .stepNum { margin: 0 5px; width: 15px; height: 15px; }
            .breadcrumbs .ol .stepNum:last-child { display: none; }
        .breadcrumbs .ol { width: 100%; }
}

@media(max-width:991px) and (min-width:768px) {
    .breadcrumbs { padding-top: 35px; }
        .breadcrumbs .link { top: 80px; }
}

section { width: 100%; transition: all .4s ease-in-out .4s; overflow: hidden; top: 0; height: 100%; pointer-events: none; }
    section.active { display: block; opacity: 1; pointer-events: auto; }
.stepSection { opacity: 0; background-position: center bottom; background-repeat-y: no-repeat; background-size: cover; }
a.generalBtn, .generalBtn { width: 163px; height: 48px; border-radius: 3px; background-color: #3d8705; display: inline-block; color: #fff; line-height: 48px; text-decoration: none; transition: .25s ease; transition-property: all; transition-duration: 0.25s; transition-timing-function: ease; font-size: 90%; }
    a.generalBtn img { width: 14px; animation-iteration-count: 5 !important; -webkit-animation: rightLeft 1s infinite !important; animation: rightLeft 1s infinite !important; -webkit-animation-timing-function: ease-in-out !important; animation-timing-function: ease-in-out !important; }
.container { max-width: 993px; background-color: #000000; background-repeat: no-repeat; background-position: top center; background-attachment: fixed; position: relative; overflow: hidden; padding: 0; /*max-height: 620px;*/ }
    .container:before { content: ""; position: fixed; background: rgba(0, 0, 0, 0.5); z-index: 0; width: 100%; height: 100%; display: block; opacity: 1; left: 0; }

@media(min-width:992px) {
    section { position: absolute; }
}

@media(max-width:991px) {
    .container { padding: 0; }
    a.generalBtn, .generalBtn { height: 42px; line-height: 42px; width: 160px; }
    section { position: absolute; }
}

.introSection { height: 100%; background-position: bottom center; background-repeat: no-repeat; opacity: 0; background-color: #000; }
    .answerSection:before, .introSection:before { content: ""; position: absolute; background: rgba(0, 0, 0, 0.5); z-index: 0; width: 100%; height: 100%; display: block; opacity: 1; left: 0; z-index: 1; pointer-events: none; }
.answerSection:before { background: rgba(0, 0, 0, 0.3); }
.introSection video { width: 100%; position: absolute; bottom: 0; pointer-events: none; }
.introSection .content { text-align: center; z-index: 1; }
    .introSection .content .titleImg { width: 360px; }
    .introSection .content p { font-size: 90%; }
    .introSection .content p strong { font-size: 120%; }
    .introSection .content h1 { margin: 0; font-family: NespressoLucas-Bold !important; text-transform: uppercase; direction: ltr; font-size: 90%; font-weight: normal; font-family: 'HelveticaHebrew', 'NespressoLucas',Helvetica, Arial, sans-serif !important; font-weight: bold; }
    .introSection .content h2 { font-size: 170%; margin: 30px 0 0 0; transition-delay: 0ms; transition-delay: 800ms; font-family: 'NespressoLucas-Bold' !important; text-transform: uppercase; direction: ltr; }
    .introSection .content .btnWrapper { margin-top: 35px; display: block; transition-delay: 0ms; }
.introSection.active .content .btnWrapper { transition-delay: 1100ms; }
.introSection.fadeOut .content { transform: translate(-50%, -70%); -webkit-transform: translate(-50%, -70%); -moz-transform: translate(-50%, -70%); -ms-transform: translate(-50%, -70%); -o-transform: translate(-50%, -70%); opacity: 0; transition: all .4s ease-in-out .4s; }
.sectionsWarpper { color: #fff; overflow: hidden; padding-bottom: 0; transition: all .4s ease-in-out; width: 100%; }
    .sectionsWarpper.resultOn { height: 777px; }
.introSection ul.capsList { position: absolute; width: 100%; padding: 0; bottom: 43px; direction: ltr; z-index: 1; margin-bottom: 0; }
    .introSection ul.capsList li { width: 13.8%; display: inline-block; padding: 0 32px; }
        .introSection ul.capsList li .capTitle { position: relative; max-height: 28px; }
        .introSection ul.capsList li .capsImg { width: 85px; }

@media(min-width:992px) {
    .swiper-container { display: none; }
    .introSection .content { position: absolute; top: 58px; left: 50%; width: 100%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); max-width: 510px; }
    .sectionsWarpper { height: 620px; }
}

@media(max-width:991px) {
    .introSection { padding-bottom: 50px;
	/*height: -o-calc(100vh - 55px); height: -webkit-calc(100vh - 55px ); height: calc(100vh - 55px); height: -moz-calc(100vh - 55px); */}
        .introSection .content h1 { font-size: 80%; }
    .sectionsWarpper.resultOn { height: auto; }
    .introSection ul.capsList { display: none; }
    .introSection .content .btnWrapper{margin-top:20px;}
    .capsImg { display: block; margin: 0 auto; width: 130px; }
    .capTitle { display: block; margin: 0 auto; max-height: 28px; }
    .introSection .content .titleImg { max-width: 90%; }
    .introSection .content { padding: 20px 20px; position: relative; height: -o-calc(100vh - 55px - 170px); height: -moz-calc(100vh - 55px - 170px); height: calc(100vh - 55px - 170px); height: -webkit-calc(100vh - 55px - 170px); }
        .introSection .content .contentWrapper { position: absolute; top: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); width: 100%; left: 50%; padding: 0 30px; max-width: 520px; }
        .introSection .content p { font-size: 80%; }
    .sectionsWarpper { /*min-height: -o-calc(100vh - 55px); min-height: -webkit-calc(100vh - 55px); min-height: calc(100vh - 55px); min-height: -moz-calc(100vh - 55px); */height: auto; }
    .introSection video { width: auto; min-width: 100%; min-height: 100%; height: 110%; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); }
}

@media(max-width:991px) and (min-width:768px) {
    .introSection { min-height: calc(100vh - 55px); min-height: -o-calc(100vh - 55px); min-height: -moz-calc(100vh - 55px); min-height: -webkit-calc(100vh - 55px); }
        .introSection .content { height: -o-calc(100vh - 55px - 300px); height: -webkit-calc(100vh - 55px - 300px); height: calc(100vh - 55px - 300px); height: -moz-calc(100vh - 55px - 300px); }
}

@media(max-width:767px) {
    .introSection .content h2 { font-size: 120%; margin-bottom: 10px; }
}

@media(max-width:320px) {
    .introSection .content { height: -o-calc(100vh - 55px - 70px); height: -webkit-calc(100vh - 55px - 70px); height: calc(100vh - 55px - 70px); height: -moz-calc(100vh - 55px - 70px); }
    .swiper-container { display: none; }
    .sectionsWarpper { min-height: 100vh; }
}

.quest, .quest:hover, .quest:focus { text-align: center; width: 560px; display: block; margin: 0 auto 18px; }
    .quest:hover .quest-text, .quest:focus .quest-text { color: #cb9c49; }
    .quest .quest-text { background-color: #000; display: block; font-size: 90%; position: relative; border-radius: 36px; box-shadow: -7.1px 7.1px 30px 0 rgba(0, 0, 0, 0.6); border: solid 2px #cc9d49; background: rgb(27,27,27); background: -moz-linear-gradient(0deg, rgba(27,27,27,1) 0%, rgba(15,15,15,1) 100%, rgba(255,255,255,0.2) 100%); background: -webkit-linear-gradient(0deg, rgba(27,27,27,1) 0%, rgba(15,15,15,1) 100%, rgba(255,255,255,0.2) 100%); background: linear-gradient(0deg, rgba(27,27,27,1) 0%, rgba(15,15,15,1) 100%, rgba(255,255,255,0.2) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#1b1b1b",endColorstr="#ffffff",GradientType=1); color: #fff; -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; -ms-transition: all .2s ease-in-out; }

.questWarpper { max-width: 740px; position: relative; z-index: 1; }
.quest-title { margin-top: 70px; margin-bottom: 20px; font-weight: bold; text-align: center; height: 71px; line-height: 1.27; }
.quest .quest-text span.qs { width: 100%; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); }

@media(min-width:992px) {
    .questWarpper { margin: 0 auto; }
    .quest .quest-text span.qs { padding: 0 20px; }
    .quest .quest-text { min-height: 72px; }
}

@media(max-width:991px) {
    .quest { padding: 0 10px; }
        .quest .quest-text { padding: 10px 12px; font-size: 80%; height: 68px; }
        .quest, .quest:hover, .quest:focus { padding: 0; width: 100%; }
    .quest-title { margin-top: 90px; /* max-width: 280px; */ margin: 100px auto 45px; height: auto; font-size: 110%; line-height: 1.3; }
    .questWarpper { padding: 0 5%; max-width: 600px; margin: 0 auto; }
    .quest .quest-text span.qs { line-height: 1.3; text-align: center; max-width: 85%; }
        .quest .quest-text span.qs span { display: block; }
}

@media(max-width:991px) and (min-width:768px) {
    .questWarpper { margin-top: 210px; }
}

@media(max-width:767px) {
    .quest-title { max-width: 280px }
}

.resultWrapper { background: #fff; color: #000; text-align: right; padding: 72px 97px; position: relative; }
    .resultWrapper .resultImg img { width: 100%; }
    .resultWrapper .down-arrow { position: absolute; width: 62px; height: 62px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); top: -31px; background: #fff; border-radius: 50%; }
        .resultWrapper .down-arrow img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); width: 22px; }
.answerSection .topSection { position: relative; z-index: 1; }
.answerSection h2 { font-size: 230%; margin-top: 40px; margin-bottom: 0; font-weight: bold; text-align: center; }
    .answerSection h2 span { display: block; font-size: 78%; }
.answerSection h3 { font-size: 140%; margin-top: 0; font-weight: bold; }
.answerSection h4 { font-size: 140%; padding-left: 20px; text-align: center; font-weight: bold; margin-top: 0; margin-bottom: 18px; }
.answerSection .resultText { font-size: 80%; max-width: 320px; }
.answerSection a { display: block; font-size: 90%; color: #000; margin-top: 10px; text-decoration: none; }
    .answerSection a.find-more { text-decoration: underline; }
    .answerSection a.purchase { background: #3d8705; display: inline-block; color: #fff; margin-top: 17px; margin-bottom: 20px; width: 140px; height: 40px; line-height: 40px; }
        .answerSection a.purchase img { width: 14px; animation-iteration-count: 5 !important; -webkit-animation: rightLeft 1s infinite !important; animation: rightLeft 1s infinite !important; -webkit-animation-timing-function: ease-in-out !important; animation-timing-function: ease-in-out !important; }
    .answerSection a.reset { font-size: 70%; }
        .answerSection a.reset img { width: 10px; margin-left: 4px; }
.answerSection { opacity: 0; transition: all 1s ease-in-out .4s; }
    .answerSection video { width: 100%; position: absolute; top: 0; }
    .answerSection .resBig .resRightWrapper { pointer-events: auto; }
    .answerSection .resTitle { text-align: center; }
        .answerSection .resTitle svg { max-width: 278px; margin-top: 8px; }
    .answerSection .resBig { max-width: 800px; margin: 23px auto 0; height: 400px; display: table; direction: ltr; width: 100%; }
        .answerSection .resBig > div { display: inline-block; background-size: cover; position: relative; height: 400px; width:400px;}
            .answerSection .resBig > div.resRight {  background-color: #fff; color: #000; text-align: center; position: relative; direction: rtl; }
                .answerSection .resBig > div.resRight p { font-size: 75%; }
            .answerSection .resBig > div.resLeft {  }
    .answerSection .bottomSection { max-width: 750px; margin: 30px auto 0; position: relative; z-index: 1; text-align: center; display: none }
    .answerSection.active .bottomSection { display: block; }
    .answerSection .recom-div { display: none; vertical-align: top; padding: 7px 10px; width: 240px; background-color: #fff; height: 130px; margin: 0 10px; position: relative; }
        .answerSection .recom-div.active{display:inline-block;}
        .answerSection .recom-div .capsImg { display: inline-block; vertical-align: middle; width: 82px; }
            .answerSection .recom-div .capsImg img { max-width: 83px }
        .answerSection .recom-div .recom-text { display: inline-block; vertical-align: middle; width: 114px; }
        .answerSection .recom-div a.purchase { margin-bottom: 0; font-size: 65%; width: 79px; height: 26px; padding: 0; text-align: center; margin: 8px auto 0; display: block; line-height: 26px; }
    .answerSection .capsSmallTitle { display: inline-block; width: 100%; }
        .answerSection .capsSmallTitle svg { display: block; }
            .answerSection .capsSmallTitle svg path { fill: #131313; }
    .answerSection .recom-div h5 { padding: 0; color: #131313; font-size: 62.5%; width: 100%; display: block; margin-top: 0; margin-bottom: 0; }

@media(min-width:992px) {
    .answerSection.active { opacity: 1; transform: translateY(0px); -webkit-transform: translateY(0); -moz-transform: translateY(0); -ms-transform: translateY(0); -o-transform: translateY(0); }
    .answerSection .resBig .resRightWrapper { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); width: 100%; padding: 0 45px; }
    .answerSection .recom-div .recom-divWrapper { position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); }
}

@media(max-width:991px) and (min-width:768px) {
    .introSection .content { height: -o-calc(100vh - 55px - 300px); height: -webkit-calc(100vh - 55px - 300px); height: calc(100vh - 55px - 300px); height: -moz-calc(100vh - 55px - 300px); }
    .answerSection .recom-div .recom-text { width: 200px; }
    .answerSection .recom-div { width: 310px; height: 160px; }
}

@media(max-width:991px) {
    .answerSection video { width: auto; min-width: 100%; min-height: 100%; height: 110%; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); }
    .resultWrapper { padding: 50px 97px; }
    .answerSection .resBig > div { display: block; }
        .answerSection .resBig > div.resLeft { width: 100%; padding-bottom: 100%; background-position: top center; height:auto;}
        .answerSection .resBig > div.resRight { width: auto; height:auto}
    .answerSection .resBig { height: auto; padding: 0 26px; max-width: 500px; }
        .answerSection .resBig .resRightWrapper { padding: 20px 35px; }
    .answerSection .recom-div { margin-bottom: 10px; width: 270px; }
        .answerSection .recom-div .recom-text { width: 145px; }
    .answerSection .capsSmallTitle { max-width: 100%; width: 130px; }
    .resultWrapper { padding: 15px; text-align: center; padding-bottom: 0px; padding-bottom: 20px; }
    .answerSection .bottomSection { padding-bottom: 20px; }
    .answerSection.active { height: auto; max-height: none; position: relative; }
    .answerSection h4 { padding: 0 26px; }
    .resultWrapper .resultImg { padding: 0px }
        .resultWrapper .resultImg img { /* max-width: 290px; */ }
    .answerSection a { margin-top: 0; margin-bottom: 10px; }
        .answerSection a.purchase { }
    .answerSection .resultText { max-width: 290px; margin: 0 auto; }
    .answerSection h3 { font-size: 120%; }
    .answerSection h2 { font-size: 116%; padding: 0 20px; }
}


@keyframes fadeElements {
    100% { opacity: 1; transform: translateY(0px); -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0); -o-transform: translateY(0); }
}

@-webkit-keyframes fadeElements {
    100% { opacity: 1; transform: translateY(0px); -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); -o-transform: translateY(0px); }
}


@-webkit-keyframes rightLeft {
    from { transform: translateX(0); }
    50% { transform: translateX(-5px); }
    to { transform: translateX(0); }
}

@keyframes upAnddown {
    from { transform: translateX(0); }
    50% { transform: translateX(-5px); }
    to { transform: translateX(0); }
}


.sectionBg { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-position: center bottom; background-repeat-y: no-repeat; background-size: cover; }
.videoBgImg { display: none; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background-size: cover; }
.ios7 video { display: none; }
.ios7 .videoBgImg { display: block; }


html[data-useragent*='MSIE 10.0'] .answerSection .resBig > div,
html[data-useragent*='MSIE 9.0'] .answerSection .resBig > div,
html[IE11='true'] .answerSection .resBig > div { margin: 0 -2px; }
html[data-useragent*='MSIE 10.0'] .answerSection .recom-div .recom-divWrapper,
html[data-useragent*='MSIE 9.0'] .answerSection .recom-div .recom-divWrapper,
html[IE11='true'] .answerSection .recom-div .recom-divWrapper { height: 130px; top: 0px; transform: none; -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; background-color: #fff; padding-top:10px;}
html[data-useragent*='MSIE 10.0'] .answerSection .capsSmallTitle svg,
html[data-useragent*='MSIE 9.0'] .answerSection .capsSmallTitle svg,
html[IE11='true'] .answerSection .capsSmallTitle svg { height: 32px; }