.section { color:#fff; text-align: center; overflow: hidden;} 
@font-face { font-family: 'plutoblack'; src: url('../fonts/plutoblack-webfont.woff2') format('woff2'), url('../fonts/plutoblack-webfont.woff') format('woff'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'plutolight'; src: url('../fonts/plutolight-webfont.woff2') format('woff2'), url('../fonts/plutolight-webfont.woff') format('woff'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'plutomedium'; src: url('../fonts/plutomedium-webfont.woff2') format('woff2'), url('../fonts/plutomedium-webfont.woff') format('woff'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'pluto_regularregular'; src: url('../fonts/plutoregular-webfont.woff2') format('woff2'), url('../fonts/plutoregular-webfont.woff') format('woff'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'plutothin'; src: url('../fonts/plutothin-webfont.woff2') format('woff2'), url('../fonts/plutothin-webfont.woff') format('woff'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'plutobold'; src: url('../fonts/plutobold-webfont.woff2') format('woff2'), url('../fonts/plutobold-webfont.woff') format('woff'); font-weight: normal; font-style: normal; }


/* Scroll Nav */
#fp-nav ul { left: 50px; top: 60% !important; -webkit-transform: translateY(-50%); transform: translateY(-50%); margin: 0 !important; z-index: 50; transition: opacity .5s; position: fixed; z-index: 999; opacity: 1; background: none; display: block; list-style: none; padding: 12px 0; border: 2px solid #54bceb; border-radius: 16px; transition: border .5s; }
#fp-nav ul li { display: block; margin: 0; padding: 0; width: auto; height: auto;}
#fp-nav ul li a { display: block; position: relative; width: 28px; height: 20px; }
#fp-nav ul li a span { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 4px; height: 4px; background: #54bceb; border: 2px solid transparent; border-radius: 100%; -webkit-transition: border .2s, background .2s; transition: border .2s, background .2s; margin: 0 !important;}
#fp-nav ul li a.active span { width: 8px; height: 8px; background: transparent; border-color: #54bceb; -webkit-animation: .4s 1 pagePlop; animation: .4s 1 pagePlop; margin: 0 !important; }
.viewing-5.fp-viewing-what-needs-to-be-done-0 #fp-nav ul li a span, .viewing-2 #fp-nav ul li a span, .viewing-3 #fp-nav ul li a span, .viewing-5 #fp-nav ul li a span, .viewing-5-0 #fp-nav ul li a span { background: #fff; }
.viewing-5.fp-viewing-what-needs-to-be-done-0 #fp-nav ul li a.active span, .viewing-2 #fp-nav ul li a.active span, .viewing-3 #fp-nav ul li a.active span, .viewing-5 #fp-nav ul li a.active span, .viewing-5-0 #fp-nav ul li a.active span { background: none; border-color: #fff; }
.viewing-5.fp-viewing-what-needs-to-be-done-0 #fp-nav ul, .viewing-2 #fp-nav ul, .viewing-3 #fp-nav ul, .viewing-3 #fp-nav ul, .viewing-5 #fp-nav ul, .viewing-5-0 #fp-nav ul { border-color:#fff; }
.viewing-5 #fp-nav ul li a span { background: #004989; }
.viewing-5 #fp-nav ul li a.active span { background: none; border-color: #004989; }
.viewing-5 #fp-nav ul, .viewing-5 #fp-nav ul, .viewing-5 #fp-nav ul { border-color:#004989; }
.viewing-5 .cd-nav-trigger .cd-icon::before, .viewing-5 .cd-nav-trigger .cd-icon:after, .viewing-5 .cd-nav-trigger .cd-icon { background-color: #004989; } 
.viewing-5 .cd-nav-trigger.close-nav .cd-icon { background: none; }
.viewing-5 #fp-nav ul { border-color:#004989; }


/* Menu */
.cd-nav-trigger { top: 30%; right: 4.5%; height: 50px; width: 50px; z-index: 5; overflow: hidden; text-indent: 100%; white-space: nowrap; position: absolute; }
.cd-nav-trigger .cd-icon { position: absolute; left: 50%; top: 50%; bottom: auto; right: auto; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); display: inline-block; width: 50px; height: 6px; background-color: #52b8e4; z-index: 10; border-radius: 25px; }
.cd-nav-trigger .cd-icon::before, .cd-nav-trigger .cd-icon:after { position: absolute; top: 0; right: 0; width: 100%; height: 100%; background-color: #52b8e4; border-radius: 25px; -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transition: -webkit-transform .3s; -moz-transition: -moz-transform .3s; transition: transform .3s; }
.cd-nav-trigger .cd-icon { top: 25px; }
.cd-nav-trigger .cd-icon::before { top: -10px; }
.cd-nav-trigger .cd-icon::after { top:11px; }
.cd-nav-trigger .cd-icon::before { -webkit-transform: translateY(-6px) rotate(0deg); -moz-transform: translateY(-6px) rotate(0deg); -ms-transform: translateY(-6px) rotate(0deg); -o-transform: translateY(-6px) rotate(0deg); transform: translateY(-6px) rotate(0deg); }
.cd-nav-trigger .cd-icon::after { -webkit-transform: translateY(6px) rotate(0deg); -moz-transform: translateY(6px) rotate(0deg); -ms-transform: translateY(6px) rotate(0deg); -o-transform: translateY(6px) rotate(0deg); transform: translateY(6px) rotate(0deg); }
.cd-nav-trigger::before, .cd-nav-trigger::after { position: absolute; top: 0; left: 0; border-radius: 50%; height: 100%; width: 100%; -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transition-property: -webkit-transform; -moz-transition-property: -moz-transform; transition-property: transform; }
.cd-nav-trigger::before { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-delay: 0.4s; -moz-transition-delay: 0.4s; transition-delay: 0.4s; }
.cd-nav-trigger::after { -webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); -webkit-transition-duration: 0s; -moz-transition-duration: 0s; transition-duration: 0s; -webkit-transition-delay: 0s; -moz-transition-delay: 0s; transition-delay: 0s; }
.cd-nav-trigger.close-nav::before { -webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); }
.cd-nav-trigger.close-nav::after { -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); -webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-delay: 0.4s; -moz-transition-delay: 0.4s; transition-delay: 0.4s; }
.cd-nav-trigger.close-nav .cd-icon { background-color: rgba(255, 255, 255, 0); }
.cd-nav-trigger.close-nav .cd-icon::after { top: 0; }
.cd-nav-trigger.close-nav .cd-icon::before { top: 0; }
.cd-nav-trigger.close-nav .cd-icon::before, .cd-nav-trigger.close-nav .cd-icon::after { background-color: white; }
.cd-nav-trigger.close-nav .cd-icon::before { -webkit-transform: translateY(0) rotate(45deg); -moz-transform: translateY(0) rotate(45deg); -ms-transform: translateY(0) rotate(45deg); -o-transform: translateY(0) rotate(45deg); transform: translateY(0) rotate(45deg); }
.cd-nav-trigger.close-nav .cd-icon::after { -webkit-transform: translateY(0) rotate(-45deg); -moz-transform: translateY(0) rotate(-45deg); -ms-transform: translateY(0) rotate(-45deg); -o-transform: translateY(0) rotate(-45deg); transform: translateY(0) rotate(-45deg); }
.cd-nav-trigger.close-nav { position: fixed; top:60px;}
.cd-nav-trigger::after, .cd-nav-trigger::before, .cd-icon::after, .cd-icon::before {  content: ''; }
.cd-primary-nav {  position: fixed; right: 7%; left: inherit; top: 8%; height: 100%; width: 100%; padding: 80px 5%; z-index: 99; overflow: auto; color:#fff; -webkit-overflow-scrolling: touch; visibility: hidden; opacity: 0; -webkit-transition: visibility 0s, opacity 0.3s; -moz-transition: visibility 0s, opacity 0.3s; transition: visibility 0s, opacity 0.3s; z-index: 9999; max-width: 30%; margin: 0; }
.cd-primary-nav li { cursor: pointer;  margin: 20px 0; text-align: center; text-transform: capitalize; letter-spacing: -0.05em; float: right; text-align: right; width: 100%;}
.cd-primary-nav a { font-family: 'plutoblack'; letter-spacing: -2px; font-size: 20px; font-size: 30px; margin-bottom: 5%; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-transition: color 0.2s; -moz-transition: color 0.2s; transition: color 0.2s; }
.cd-primary-nav a:hover { color: #54bceb; transition: all 0.3s ease-in-out; }
.no-touch .cd-primary-nav a:hover { color: #ffffff; }
.cd-primary-nav.fade-in { visibility: visible; opacity: 1; }
.cd-overlay-nav, .cd-overlay-content { position: fixed; top: 18px; right: 5%; height: 4px; width: 4px; -webkit-transform: translateX(-20px) translateY(20px); -moz-transform: translateX(-20px) translateY(20px); -ms-transform: translateX(-20px) translateY(20px); -o-transform: translateX(-20px) translateY(20px); transform: translateX(-20px) translateY(20px); }
.cd-overlay-nav span, .cd-overlay-content span { display: inline-block; position: absolute; border-radius: 50%; -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; will-change: transform; -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); }
.cd-overlay-nav.is-hidden, .cd-overlay-content.is-hidden { opacity: 0; visibility: hidden; -webkit-transition: opacity .3s 0s, visibility 0s .3s; -moz-transition: opacity .3s 0s, visibility 0s .3s; transition: opacity .3s 0s, visibility 0s .3s; }
.cd-overlay-nav { z-index: 2; font-family: 'plutoblack'; }
.cd-overlay-nav span { background-color: #023561; }
.cd-overlay-content { z-index: 4; }
.cd-overlay-content span { background-color: #023561; }
.cd-content { padding: 80px 0; width: 90%; max-width: 768px; margin: 0 auto; z-index: 1; }
.cd-content .cd-intro { height: 200px; padding-top: 4.6em; }
.cd-content h1 { text-align: center; font-size: 20px; font-size: 1.25rem; }
.cd-content p { line-height: 1.5; color: #a76500; }
.viewing-3 .cd-nav-trigger .cd-icon::before, .viewing-3 .cd-nav-trigger .cd-icon:after, .viewing-3 .cd-nav-trigger .cd-icon, .viewing-5 .cd-nav-trigger .cd-icon::before, .viewing-5 .cd-nav-trigger .cd-icon:after, .viewing-5 .cd-nav-trigger .cd-icon, .viewing-5-0 .cd-nav-trigger .cd-icon::before, .viewing-5-0 .cd-nav-trigger .cd-icon:after, .viewing-5.fp-viewing-what-needs-to-be-done-0 .cd-nav-trigger .cd-icon  { background-color: #fff; } 
.viewing-3 .cd-nav-trigger.close-nav .cd-icon, .viewing-5 .cd-nav-trigger.close-nav .cd-icon, .viewing-5-0 .cd-nav-trigger.close-nav .cd-icon  { background: none; }
.viewing-5 .cd-nav-trigger .cd-icon::before, .viewing-5 .cd-nav-trigger .cd-icon:after, .viewing-5 .cd-nav-trigger .cd-icon { background-color: #004989; } 
.viewing-5 .cd-nav-trigger.close-nav .cd-icon { background: none; }
.viewing-5.fp-viewing-what-needs-to-be-done-0 .cd-nav-trigger .cd-icon::before, .viewing-5.fp-viewing-what-needs-to-be-done-0 .cd-nav-trigger .cd-icon:after { background-color: #fff; } 
.viewing-5.fp-viewing-what-needs-to-be-done-0 { background: none; }
.fp-controlArrow { display: none !important; }


/* HOME */
header { position: absolute; top: 0; left:0; width: 100%; z-index: 999; }
header .logotype { width: 150px; display: inline-block; }
header .content-header { max-width: 93%; margin: 0 auto; padding: 3% 0 0; }
h2 { font-size: 57px; line-height: 55px; text-transform: uppercase; color: #54bceb; font-family: 'plutoblack'; }
h2 span { color: #fff; }
h3 { font-size: 40px; line-height: 40px; color: #fff; font-family: 'plutobold'; }
h4 { font-size: 28px; line-height: 31px; color: #fff; font-family: 'plutobold'; text-align: left;display: inline-block;}
h4 .arrow { width: 40px; transform: rotate(270deg); top: 10px; position: relative; margin-left: 5px; }
p { font-family: "museo-sans",sans-serif; font-style: normal; font-weight: 300; font-size: 18px; line-height: 30px; text-align: left; } 
p strong { font-weight: 900; }
.start-header { text-align: left; }
.start-header h4 { width: 80%; vertical-align: middle;}
.content-section .header .col-12 { text-align: left; }

.line-dot {max-width: 11px; margin: 4px auto 0; height: 70px;}
.line-dot img {width: 100%}

#section-home { background-image: url('../img/background-home.jpg'); background-size: cover; background-position: 0 30%; } 
.st0, .viewing-5.fp-viewing-what-needs-to-be-done-0 .st0 { fill: #fff !important; } 
.viewing-0 .st0, .viewing-5-1 .st0, .viewing-5 .st0 { fill: #004988 !important; } 
.bubble-one { text-transform: uppercase; font-family: 'plutoblack'; background: #004b8d; width: 600px; height: 600px; border-radius: 50%; bottom: -15%; left: 11%; display: inline-block; position: absolute;-webkit-box-shadow: 6px 14px 59px -13px rgba(0,0,0,0.3); -moz-box-shadow: 6px 14px 59px -13px rgba(0,0,0,0.3); box-shadow: 6px 14px 59px -13px rgba(0,0,0,0.3); z-index: 9; display: flex; justify-content: center; align-items: center; padding: 0; box-sizing: border-box; text-align: left;}
.bubble-two { cursor: pointer; text-transform: uppercase; font-family: 'plutobold'; background: #54bceb; width: 200px; height: 200px; border-radius: 50%; bottom: 35%; right: 18%; display: inline-block; position: absolute;-webkit-box-shadow: 6px 14px 59px -13px rgba(0,0,0,0.3); -moz-box-shadow: 6px 14px 59px -13px rgba(0,0,0,0.3); box-shadow: 6px 14px 59px -13px rgba(0,0,0,0.3); z-index: 9; display: flex; justify-content: center; align-items: center; padding: 2%; box-sizing: border-box;}
.bubble-one p { font-size: 53px; line-height: 51px; text-align: left;  font-family: 'plutoblack'; margin-left: 80px; letter-spacing: -2px; }
.bubble-one p span { color:#54bceb }
.bubble-two p { font-size: 22px; line-height: 23px; padding-top: 20px; text-align: center;  font-family: 'plutoblack';}
.bubble-two .arrow { width: 30px; margin-bottom: -20px;}
.content-section { max-width: 870px; margin: 0 auto; }
.content-section .header { font-family: 'plutoblack'; text-align: middle; margin-top: 30px; position: relative; }
.content-section .header .number { width: 180px; height: 180px; border-radius: 50%; background: #54bceb; color:#fff;  display: flex; justify-content: center; align-items: center; font-size: 70px; -webkit-box-shadow: 6px 6px 59px 1px rgba(0,0,0,0.2); -moz-box-shadow: 6px 6px 59px 1px rgba(0,0,0,0.2); box-shadow: 6px 6px 59px 1px rgba(0,0,0,0.2);}
.content-section .header .col-3 { text-align: center; float: inherit; display: inline-block; width: 24%; vertical-align: middle; }
.content-section .header .col-9 { text-align: left; float: inherit; display: inline-block; vertical-align: middle; padding: 0 10px; box-sizing: border-box; }
.content-section .header p { text-align: left; margin: 20px 0; }
.section-bluelight h2 { color:#fff; }
.section-bluelight .content-section .header .number { background: #004989; }
.bubble { background: #023664; width: 130px; height: 130px; border-radius: 50%; display: inline-flex; justify-content: center; align-items: center; color:#fff; font-family: 'plutobold'; letter-spacing: -2px;}
.bubble.start { cursor: pointer; margin-left: 10px; font-size: 30px; }
.bubble.blue { background: #004b8d; color:#fff; }
.section-purple .bubble.next-slider { background: #54bceb; color:#fff; }
.bubble.white { background: #fff; color:#54bceb; }
.bubble.purple { background: #7e4098; color:#fff; }
.brain-right { position: absolute !important; right: -26%; top: 17%; width: 40%; }
.bg-texture { background-image: url('../img/bg.png'); background-blend-mode: multiply; }
.btn-arrow { width: 50px; height: 50px; background: #fff; display: inline-flex; justify-content: center; align-items: center; border-radius: 50%;}
.btn-arrow i { color:#004b8d; font-size: 24px; }
.scroll-bottom { cursor: pointer; text-align: center; bottom: 10px; position: absolute; left: 0; right: 0; }
.line { height: 90px; width: 1px; display: block; margin: 0 auto; border-left: 6px dotted; margin-top: 7px; }
.line { height: 90px; display: block; margin: 0 auto; margin-top: 7px; }
.question { margin: 40px 0; width: 80%; margin: 80px auto 30px; }
.answer .bubble { width: 120px; height: 120px; margin:0 10px; font-size: 25px;}
.brain-right-2 { position: absolute !important; right: -13%; top: 27%; width: 36%; } 
.number-slider ul::before { content: ''; height: 60px; border-right: 1px solid #e0e0e0; position: absolute; left: 50%; top: 50%; bottom: 40px; -webkit-transform: translateY(-50%) rotate(30deg); transform: translateY(-50%) rotate(30deg); }
.number-slider { margin: 40px 0 0 !important; bottom: 0px; position: relative; left: 0; z-index: 99; }
.number-slider ul { width: 100px; left: 0; margin: 0; height: 54px; position: relative; }
.number-slider ul li { cursor: pointer; display: block; position: absolute; left: calc(50% - 50px); top: 0; font-size: 17px; color: #fff; font-family: 'plutolight'; }
.number-slider ul li:nth-child(2) { position: absolute; left: calc(50% + 9px); bottom: 0; content: counter(slideCount); font-size: 17px; font-weight: 300; bottom: 0; top: inherit; opacity: 1;}
.arrow-right { position: absolute; right: -10px; font-size: 24px; top: -4px; }
.arrow-left { position: absolute; left: -6px; font-size: 24px; bottom: -5px; }
.question-mark { width: 100%; margin: 0 auto; }
.content-qmark { position: absolute; width: 100%; margin: 0; text-align: center; bottom: 40px; left: 0; overflow: hidden; height: 300px; }
.content-qmark svg {max-width: 1600px; margin:0 auto;}
.viewing-3 .content-qmark:before, .viewing-3 .content-qmark:after { width: 91%;} 
.qmarkfill {fill:#FFFFFF;}
.title { text-transform: uppercase; color: #54bceb; font-family: 'plutobold'; display: block; width: 100%; font-size: 15px; margin-bottom: 10px;}
.header h2 { margin-top: 0 !important; }
.how-big-is-dementia .title { color:#fff; } 
.content-section-white .title { color:#004988; text-align: left; } 
.header.center .title, .title.center { text-align: center; } 
.header.left .title { text-align: left !important; } 



/* DEMENTIA Slider  */
.telescope { width: 309px; margin: 70px 0px 0 -30px; }
.line-telescope { width: 345px; float: left; }
.slider-two-dementia .bubble.blue { font-size: 60px; width: 280px; height: 280px;display: inline-flex; vertical-align: top;}
.slider-two-dementia .bubble.purple { font-size: 30px; width: 135px; height: 135px; margin: 16% 19px 0 10px; display: inline-flex; vertical-align: top; }
.slider-two-dementia .bubble.white { font-size: 22px; width: 100px; height: 100px; margin-top: 29%; display: inline-flex; vertical-align: top;}
.slider-two-dementia .col-8 { margin-top: 50px; }
.number-tip.women { font-family: 'plutomedium'; background-image: url(../img/bubble-women.png); background-repeat: no-repeat; background-size: cover; width: 200px; font-size: 34px; padding: 25px 0 43px; margin-right: 0; position: absolute; left: 33%; color: #7e4098; }
.number-tip.men { font-family: 'plutomedium'; background-image: url(../img/bubble-men.png); background-repeat: no-repeat; background-size: contain; width: 164px; font-size: 29px; padding: 20px 0 42px; margin-right: 0; position: absolute; right: 35%; color: #004b8d;}
.porcent-canvas .col-4, .porcent-canvas .col-6 { padding: 0 40px 0 0; box-sizing: border-box; vertical-align: top; margin: 10px 0 0; }
.how-big-is-dementia .porcent-canvas .col-6 { min-height: 200px; }
.porcent-canvas .col-6 .porcent-number { color: #023460; }
.porcent-canvas .col-4 { margin-top:50px;}
.porcent-canvas .col-4:nth-child(2) { margin-top: 80px; }
.porcent-number, .porcent-canvas p.porcent-number span { width: 100%;font-family: 'plutoblack'; font-size: 70px; text-align: left;}
.swiper-slide .header .col-12, .swiper-slide .header { text-align: left; }
.swiper-slide h4 { line-height: 40px; margin-top: 10px; }
.bubble-one.big-bubble-right { width: 500px; height: 500px; position: absolute; right: -4%; padding: 5rem 6rem 5rem 0; box-sizing: border-box; font-size: 37px; left:auto;}
.big-bubble-right span { display: inline-block; margin: 0 5px; }
.big-bubble-right { position: absolute; right: -2%; left: inherit; bottom: 19%; height: 550px; width: 550px; }
.big-bubble-right p { font-size: 30px; text-align: right; line-height: 34px; margin-left: 40px;}
.middle-size { height: 430px; width: 430px; }
.big-bubble-right.middle-size p {font-size: 30px; line-height: 33px;}
.arrow-slider-right, .arrow-slider-left { cursor: pointer; }
.disable { cursor: initial !important; opacity: 0.5; }
.quiz-page .disable:hover, .arrow-right:hover i:before, .arrow-left:hover i:before { color:#fff; opacity: 0.5; }
.container-quiz h2, .container-quiz h3, .container-quiz .answer { text-align: center; font-size: 44px; line-height: 44px; }
.container-quiz .swiper-slide { overflow: hidden; box-sizing: border-box;}
.content-section .header.move-up-100 {margin-top: -100px;}
.move-up-100 {margin-top: -100px !important;}
.absolute {position: absolute; top: 330px; left: -30px;}

/* QUIZ */
.quiz-page .slide h3 { margin: 30px 0; text-align: center; }
.quiz-page .slide .big-bubble-right { top: 28%; right: -2%; }
.quiz-page .slide.left h2 { text-align: left; }
.quiz-page .slide .porcent-number { color: #fff; text-align: left; }
.quiz-page .slide .content-section .header .porcent-canvas p { color: #fff; text-align: left; font-size: 18px; line-height: 28px; margin-top: 0;}
.quiz-page .slide .content-section .header .porcent-canvas .col-4 { margin-top: 0; padding: 0 30px 0 0;}
.content-answer { position: fixed; width: 100%; height: 100%; top: 0; display: flex; justify-content: center; align-items: center; overflow: hidden; }
.next-quiz, .prev-quiz  { text-align:left; font-size: 20px; font-family: 'plutobold';}
.next-quiz img, .prev-quiz img { transform: rotate(270deg); width: 27px; top: 6px; position: relative; left: 5px; cursor: pointer;} 
.prev-slider img, .prev-quiz img { transform: rotate(90deg); } 
.prev-quiz img  { left: -4px; }
.nav .next-quiz, .nav .prev-quiz { width: 100px; display: inline-block; }
.nav.left { text-align: left; }
.quiz-page .number-slider ul li:hover, .quiz-page .number-slider ul .arrow-right:hover i:before, .quiz-page .number-slider ul .arrow-left:hover i:before { color: #54bceb; transition:all 0.3s ease-in-out; }
.quiz-page .number-slider ul .arrow-right.disable:hover i:before, .quiz-page .number-slider ul .arrow-left.disable:hover i:before { color:#fff; opacity: 0.5; }
.header.center .number-slider { text-align: center; }
.header.center .number-slider ul { right: 0; margin: 0 auto; }
.content-benefits { position: relative; top: -12%; margin: -17% 0  5% -20%; } 
.save-money { width: 260px; position: relative; left: -4%; display: block; top: -45px; }  
.money-count { font-family: 'plutolight'; font-size: 45px; position: absolute; bottom: 25%; z-index: 9; left: 30%; }
.money-count span { font-size: 16px; vertical-align: super; } 
.benefits-substituting {width: 102%; position: relative; margin: 47% 0 -24% 24%; } 
.hand { width: 230px; position: relative; margin-right: -87%; margin-top: 75%; } 
.delay-mounth { font-family: 'plutolight'; position: absolute; bottom: 0; font-size: 14px; line-height: 19px; text-align: left;}
.delay-mounth span { font-family: 'plutobold'; }
.delay-mounth.one { right: -25%; top: 51%; } 
.delay-mounth.two {  bottom: -1%; left: 37%; }
.delay-mounth.three { bottom: -5%; right: -28%; }
.quiz-sect .prev-quiz { text-align: center; padding-top: 50px; }
.economic-cost { margin: 10px 0 0; text-align: left; display: flex; max-width: 650px;} 
.economic-cost h2 {font-size: 74px; padding-right: 20px; margin-top: 10px;} 
.dots {border-right: 6px dotted; }
.economic-cost .small { font-size: 16px; text-align: left; font-family: 'plutolight';  vertical-align: middle; padding-right: 20px;}
.economic-cost p {margin:0 30px !important;}


.content-section .header p span { color:#023460; } 
.coins { display: inline-block; vertical-align: bottom; margin-right: -7%; text-align: center; font-family: 'plutomedium'; margin-top: 5%; margin-bottom: 30px; }
.coins img { width: 81%; display: block; margin: 0 auto; } 
.coins.one {  }
.coins.two {  color: #7e4098;}
.coins.three { color: #004b8d; }
.coins .year { font-size: 24px; font-family: 'plutomedium'; }
.coins.one .year { margin-bottom: -32%; }
.coins.two .year { margin-bottom: -33%; }
.coins.three .year { margin-bottom: -11%; margin-left: 9%; font-size: 35px; }
.swiper-container { width: 100%; height: 100%; margin-left: auto; margin-right: auto; }
.swiper-slide { overflow: hidden;  display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; }
.quiz-page .slide.left h2, .quiz-page .slide.left h3, .quiz-page .slide.left h4 { text-align: left; width: 100%; margin: 20px 0; }

/* 03 SLIDER */
.white-hand { position: absolute; bottom: 8%; right: -1%; width: 400px; } 
.support-people .porcent-canvas { margin-top: 20px; }
.support-people .porcent-canvas .col-4 { min-height: 270px; margin-top: 0px !important; } 
.support-people .big-bubble-right { background: #51b5e1; color: #fff; }
.support-people .big-bubble-right p span { color:#004a89; }
.how-big-is-dementia .bubble.start { width: 130px; }
.support-people .swiper-slide h4 { line-height: 15px; margin-top: 10px; }
.how-big-is-dementia .next-slider { text-align: right; }
.how-big-is-dementia .next-slider { text-align: right; }
.how-big-is-dementia .header .col-12 {text-align: left; }
.support-people .header h2 {text-align: left !important; } 
.support-people .move-up-100 { margin-top: -60px !important; } 
.bubble.start i { font-size: 40px; }
.porcent-canvas p.porcent-number span { color:#fff; }

/* Purple Slider */
.big-bubble { width: 600px; height: 600px; background: #fff; text-align: center; padding: 20%; box-sizing: border-box; color: #7e4098;}
.big-bubble h2 { color: #7e4098; font-size: 95px; line-height: 83px; text-align: center; letter-spacing: -0.03em; padding-top: 30px; }
.big-bubble h2 img { margin: 0 auto; display: block; }
.section-purple .content-section .header .number { color: #7e4098; background:#fff; }
.section-purple .content-section { max-width: 80%; }
.section-purple .content-section .header .col-3 { position: absolute; left: 5.5%; }
.section-purple .content-section .header .col-3 .number { box-shadow: none; margin-left: 89%;}
.section-purple .content-section .header .col-12 { vertical-align: top; text-align: center;}
.section-purple .bubble.next-slider { font-size: 29px; line-height: 28px; margin-top: 20px; } 
.section-purple .bubble.next-slider:hover { color: #54bceb; background:#fff; transition:all 0.3s ease-in-out; }
.color-2 { background: #fff; background-image: url('../img/bg.png'); background-blend-mode: multiply; color:#004989; }
.fp-controlArrow { display: none; }
.content-section-white { max-width: 870px; margin:0 auto; }
.content-section-white .col-6 { padding-right: 30px; box-sizing: border-box; }
.content-section-white h4 { color:#004988; font-size: 24px; line-height: 30px; margin-bottom: 20px; font-family: "museo-sans",sans-serif; font-weight: 900; } 
.content-section-white p, .content-section-white li { color:#414444; font-size: 18px; line-height: 27px; margin: 10px 0 20px; text-align: left; font-family: "museo-sans",sans-serif; font-style: normal; font-weight: 300;}
.content-section-white li { list-style-type: disc; padding-left: 6px; margin-left: 21px !important; margin-bottom: 5px !important; }
.content-section-white .number-slider li { margin: 0 !important; } 
.content-section-white .number-slider ul li:nth-child(2) { bottom: -4px; }
.content-section-white p span { color:#54bceb; font-size: 39px; line-height: 38px; font-family: 'plutoblack'; }
.content-section-white .porcent-canvas .col-12 { margin-bottom: 20px; }
.content-section-white .porcent-canvas .porcent-number { width: 14%; display: inline-block; vertical-align: top; text-align: left; }
.content-section-white .porcent-canvas p { width: 85%; display: inline-block; vertical-align: top;  }
.content-section-white .arrow-right:hover i:before, .content-section-white .arrow-left:hover i:before, .content-section-white .prev-slider:hover, .content-section-white .next-slider:hover { color:#004989; opacity: 1; transition: all 0.5s ease;}
.bubble.lightblue.next-slider { width: 130px; text-align: center; cursor: pointer;}
.final-slider p { text-align: center; }
.final-slider p.link { color: #54bceb; font-family: 'plutoblack'; font-size: 20px; }
.final-slider p.phone { font-family: 'plutoblack'; color: #004988; font-size: 20px;}
.final-slider p.phone a { font-family: 'plutoblack'; width: 100%; display: block; font-size: 40px; margin-top: 10px;}
.final-slider p.phone a:hover {color: #54bceb; transition: all 0.3s ease-in-out; }
.new-zealand-img  { position: absolute; top: 22%; right: -6%; transform: scale(0.9); }
.section-purple .fp-tableCell { position: relative; overflow: hidden; }
.section-purple .nav { float: left; color: #004988; }
.section-purple .nav ul { width: 78px; left: 0; margin: 0 0 0 10px; }
.section-purple .nav li { color: #54bceb; margin-left: -7px !important; }
.section-purple .nav .arrow-right { text-align: right; }
.section-purple .nav .arrow-right, .section-purple .nav .arrow-left { color: #54bceb;  cursor: pointer;}
.section-purple #slide5 .nav { width: 100px; display: block; margin: 30px auto !important; float: inherit; }
.fp-tableCell  { position: relative !important; }

.flex {display: flex; justify-content: space-between;}
.flex > div {width: 48%}

/* ANIMATION */
.next-quiz, .answer .bubble.blue, .answer .bubble.white { cursor: pointer; }
.answer .bubble.blue:hover { color: #004b8d; background: #fff; transition: all 0.3s ease-in-out } 
.answer .bubble.white:hover { color: #fff; background: #54bceb; transition: all 0.3s ease-in-out;}
.next-quiz:hover, .prev-quiz:hover { color:#54bceb; transition: all 0.3s ease-in-out; }
.quiz-page { overflow: hidden; }
.active .quiz-page #slide1 .brain-right-2, .active .quiz-page .scroll-bottom, .active .quiz-page .header { animation: showslow 3.5s ease;}
.quiz-page .fp-tableCell { position: relative; } 
.container-quiz .fp-tableCell { position: relative; }
.quiz-page { position: absolute; top: 0; bottom: 0; display: flex; justify-content: center; align-items: center; }
.fp-viewing-quiz-0 .quiz-container {  animation: turntwo 2.5s forwards; overflow:  hidden; height: 2px; margin: 0 auto; }
.money-count .counter { display: inline-block !important; }
.mobile-img img { display: block; width: 100%; height: auto; }
.heart { animation: beat 1.5s ease 0s infinite; }
.heart:before, .heart:after { content: ""; position: absolute; width: 100%; height: 100%; top: 0; left: 0; opacity: 0.4; border-radius: inherit; }
.heart:before { z-index: -2; animation: beat-before 1.5s ease 100ms infinite; }
.heart:after { z-index: -1; animation: beat-after 1.5s ease 200ms infinite; }
.heart-white { animation: beat 1.5s ease 0s infinite; }
.heart-white:before, .heart-white:after { content: ""; position: absolute; width: 100%; height: 100%; top: 0; left: 0; opacity: 0.4; border-radius: inherit; }
.heart-white:before { z-index: -2; animation: beat-before 1.5s ease 100ms infinite; }
.heart-white:after { z-index: -1; animation: beat-after 1.5s ease 200ms infinite; }
@keyframes beat {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.1);
  }
}
@keyframes beat-before {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.15);
  }
}
@keyframes beat-after {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.3);
  }
}
@keyframes turn {
  0%    {
  	background: #05233d; height: 4px; width: 0px; margin: 0 auto; left: 0; right: 0;
  }
  20%    {
  	background: #05233d; width: 20px; height: 4px;width: 0px; 
  }
  80%    {
  	 background: #05233d; top: 0%; height: 4px;
  }
  100% {
	background: none; width: 100%; height: 100%;  margin: 0 auto; left: 0; right: 0;
  }
}
@keyframes turntwo {
  0%    {
  	background: #05233d; height: 4px; width: 0px; margin: 0 auto; left: 0; right: 0;
  }
  20%    {
  	background: #05233d; width: 20px; height: 4px;width: 0px; 
  }
  70%    {
  	 background: #05233d; top: 0%; height: 4px;width: 100%;
  }
  100% {
	  height: 500px;  margin: 0 auto; left: 0; right: 0;width: 100%;
  }
}
@keyframes showslow {
  0%    {
  	opacity: 0;
  }
  70%    {
  	opacity: 0;
  }
  100% {
	opacity: 1;
  }
}
@keyframes pagePlop {
0%,
100% {
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%); }
33% {
	-webkit-transform: translate(-50%, -50%) scale(1.3);
	transform: translate(-50%, -50%) scale(1.3); }
66% {
	-webkit-transform: translate(-50%, -50%) scale(0.95);
	transform: translate(-50%, -50%) scale(0.95); } 
}

.float { animation: float 6s ease-in-out infinite; }
.float2 { animation: float 5s ease-in-out infinite; }
@keyframes float {
	0% {
		box-shadow: 0 5px 15px 0px rgba(0,0,0,0.6);
		transform: translatey(0px);
	}
	50% {
		box-shadow: 0 25px 15px 0px rgba(0,0,0,0.2);
		transform: translatey(-20px);
	}
	100% {
		box-shadow: 0 5px 15px 0px rgba(0,0,0,0.6);
		transform: translatey(0px);
	}
}

.floating  {
  -webkit-animation-name: floating;
  -webkit-animation-duration: 3s;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-timing-function: ease-in-out;
}
@keyframes floating {
  0% {
    -webkit-transform: translate(0, 0px);
  }
  65% {
    -webkit-transform: translate(0, 15px);
  }
  100% {
    -webkit-transform: translate(0, 0px);
  }
}

.mobile-active { display: none; }
.mobile-hidden {  }


/* ==========================================================================
    Media Queries
   ========================================================================== */


@media only screen and (min-width: 2000px)  { 
header .logotype { width: 215px; }
.home .bubble-one { width: 700px; height: 700px;     bottom: -11%; }
.home .bubble-one p { font-size: 64px; line-height: 65px;  }
.bubble-two { width: 300px; height: 300px; }
.bubble-two p { font-size: 31px; line-height: 33px; }
.bubble-two .arrow { width: 40px; margin-bottom: -23px; }
#fp-nav ul { left: 80px; padding: 34px 0;     border-radius: 28px;}
#fp-nav ul li a { width: 42px; height: 30px; }
#fp-nav ul li a.active span { width: 12px; height: 12px; }
#fp-nav ul li a span { width: 9px; height: 9px; }
.answer .bubble { width: 165px; height: 165px; margin: 20px 10px 0; font-size: 33px; }
.bubble-one.big-bubble-right { right: -2%; }
.bubble-one.big-bubble-right { width: 455px; height: 455px; }
.cd-primary-nav a { font-size: 45px; }
.cd-primary-nav li { margin: 30px 0; }
.cd-primary-nav { top: 0; }
}

@media only screen and (max-width: 1750px) {
.home .bubble-one p { font-size: 45px; line-height: 47px; }
.home .bubble-one { width: 550px; height: 550px; }
}	

@media only screen and (max-width: 1550px) {
.section-purple .content-section .header .col-3 .number { box-shadow: none; margin-left: 57%; }
.big-bubble-right p { font-size: 23px; line-height: 34px; margin-left: 60px; } 
.big-bubble-right { bottom: 1%; } 
.bubble-one.big-bubble-right { width: 440px; height: 440px; padding:5rem 5rem 5rem 0 ;} 
.porcent-number, .porcent-canvas p.porcent-number span { font-size: 50px; }
.quiz-page .slide .big-bubble-right { right: -4%; }
.number-tip.women { left: 29%; }
.number-tip.men { right: 30%; }
.economic-cost h2 { font-size: 40px; padding-right: 40px; margin-top: -5px; }
h4 { font-size: 28px; line-height: 39px; } 
.white-hand { width: 355px; }
h2 { font-size: 46px; line-height: 50px; }
.content-section .header .number { font-size: 53px; }
.start-header h4 { font-size: 28px; line-height: 24px; }
.support-people .porcent-canvas .col-4 { min-height: 230px; }
.move-up-100 { margin-top: -80px !important; }
.big-bubble h2 { font-size: 76px; line-height: 68px; } 
.content-section-white p span { font-size: 34px; line-height: 38px; }
.content-section-white p, .content-section-white li { font-size: 16px; line-height: 31px; }
.content-section-white .porcent-canvas .porcent-number { width: 11%; font-size: 6em; }
.home .bubble-one	{ width: 500px; height: 500px; }
.home .bubble-one p { font-size: 45px; line-height: 48px; margin-left: 64px; }
.container-quiz h2, .container-quiz h3, .container-quiz .answer { font-size: 37px; line-height: 43px; }
.question { margin: 40px auto 30px; }
.cd-primary-nav { padding: 0 5%; }
.cd-primary-nav a { font-size: 22px; }
}	

@media only screen and (max-width: 1490px) { 
.bubble-one {width: 500px; height: 500px; left: 5%}
.bubble-one p { font-size: 48px; line-height: 48px; margin-left: 60px;}
.cd-primary-nav a { font-size: 28px; }
.cd-primary-nav { max-width: 45%; top: 2%; }
.content-section .header p { max-width: 90%;}
.bubble-one.big-bubble-right {width: 400px; height: 400px;}
.bubble-one.big-bubble-right p { font-size: 30px; line-height: 30px; margin-left: 50px; }
.white-hand { width: 275px; }
h2 { font-size: 45px; line-height: 49px; } 
p { font-size: 13px; line-height: 19px; margin: 10px 0; } 
.start-header h4 { font-size: 24px; line-height: 36px; } 
.bubble-one.big-bubble-right p { font-size: 20px; line-height: 24px; } 
.big-bubble h2 { font-size: 81px; line-height: 66px; }
.section-purple .content-section .header .col-3 .number { box-shadow: none; margin-left: 48%; } 
.section-purple .big-bubble { width: 550px; height: 550px;} 
.content-section-white p, .content-section-white li { font-size: 16px; line-height: 26px; }
.content-section-white p span { font-size: 34px; line-height: 36px; } 
.number-tip.women { left: 28%; }
.number-tip.men { right: 30%; }
.quiz-page .slide .big-bubble-right { right: -5%; }
.porcent-number, .porcent-canvas p.porcent-number span { font-size: 50px; }
.economic-cost h2 { font-size: 39px; padding-right: 39px; margin-top: 0px; } 
}

@media only screen and (max-width: 1390px) {
.porcent-number, .porcent-canvas p.porcent-number span { font-size: 50px; }
.telescope { width: 242px; margin: 60px 0px 0 9px; }
.slider-two-dementia .col-8 { margin-top: 0; }
.big-bubble h2 { font-size: 64px; line-height: 55px; } 
.content-section-white p span { font-size: 28px; line-height: 32px; } 
.cd-primary-nav { padding: 24px 5%; }
}

@media only screen and (max-width: 1280px) { 
.cd-primary-nav a { font-size: 24px; }
.home .bubble-one { width: 400px; height: 400px;left: 10%; bottom: -11%; }
.home .bubble-one p {font-size: 34px; line-height: 36px;}
.bubble-one { width: 465px; height: 465px; left: 8%; bottom: -11%; }
.bubble-one p {font-size: 42px; line-height: 42px;}
header .logotype {width: 110px;}
.big-bubble-right p {margin-left: 40px;}
.bubble-one.big-bubble-right {width: 300px; height: 300px; padding: 5rem 3rem 5rem 0;}
.bubble-one.big-bubble-right p {font-size: 16px; line-height: 21px; font-family: 'plutobold'; letter-spacing: -1px}
.quiz-page .slide .content-section .header .porcent-canvas .col-4 {padding:0 20px 0 0;}
.quiz-page .slide .content-section .header .porcent-canvas p { font-size: 14px; line-height: 25px;}
.porcent-number, .porcent-canvas p.porcent-number span { font-size: 30px; }
.quiz-page .slide .big-bubble-right {top: 32%; right: -1%; }
.content-qmark {bottom: -3%; left: 0}
.how-big-is-dementia .telescope-wrapper {margin-top: -100px; }
.white-hand {width: 200px;}
.support-people .porcent-canvas .col-4 {min-height: 160px; }
.big-bubble {width: 500px; height: 500px; font-size: 65px; line-height: 50px;}
.section-purple .content-section .header .col-3 .number {margin-left: 50%}
.content-section-white p, .content-section-white li {font-size: 15px; line-height: 26px;}
.content-section-white p span {font-size: 30px; line-height: 30px;}
.home .bubble-one { bottom: -15%; } 
.content-section .header .number { width: 150px; height: 150px; font-size: 50px; margin: 0 0 0 -10px; } 
.content-section .header .col-3 {  width: 20%; }
.number-tip.women { left: 25%; width: 139px; background-size: contain; left: 31%; font-size: 19px; line-height: 12px; } 
.number-tip.men {  width: 139px; background-size: contain; left: 31%; font-size: 19px; line-height: 23px;right: 31%; left: inherit; } 
.content-benefits { margin: -6% 0 -8% 0%; } 
.save-money { width: 224px; left: 32%; top: 22px; } 
.benefits-substituting { margin: 18% 0 -24% 24%; } 
.money-count { bottom: 7%; left: 65%; }
.hand { width: 189px; position: relative; margin-right: -62%; margin-top: 89%; } 
h2 { font-size: 36px; line-height: 40px; }
h4 { font-size: 24px; line-height: 28px; } 
h4 .arrow { width: 29px; top: 7px; margin-left: -1px; } 
.about-dementia h4 {  }
.about-dementia .content-section .col-12 { text-align: left; }
.about-dementia .bubble.start { display: inline-flex; margin: 0;text-align: center; }
.bubble.start { font-size: 25px; }
.container-quiz h2, .container-quiz h3, .container-quiz .answer { font-size: 23px; line-height: 30px; text-align: center; } 
.answer .bubble { width: 110px; height: 110px; margin: 0 5px; font-size: 21px; }
.question { margin: 30px auto 30px; }
.quiz-page .slide.left h2, .quiz-page .slide.left h3, .quiz-page .slide.left h4 { margin: 10px 0; }
.content-section { max-width: 745px; }
.woman-mobile { width: 450px; } 
.save-active-mobile { width: 600px !important; margin: -8% 0 0 11%; } 
.economic-cost h2 { font-size: 40px; }
.economic-cost p { padding-top: 20px; }
.coins-mobile {width: 600px !important; margin-left: 13%; }
.how-big-is-dementia #slide8 .porcent-canvas { width: 95%; }
.start-header h4 { font-size: 19px; line-height: 29px; }
.support-people #slide4 .number-slider.move-up-100 { margin-top:  -50px !important;}
.arrow-right, .arrow-left { font-size: 16px; }
.content-section-white .porcent-canvas .porcent-number { font-size: 55px; width: 10%; }
.next-quiz img { width: 22px; top: 5px; left: 1px; } 
.slider-two-dementia .bubble.blue { font-size: 35px; width: 180px; height: 180px; } 
.telescope { width: 219px; margin: 114px 0px 0 0px; } 
.delay-mounth.three { bottom: -8%; right: -33%; }
.delay-mounth.two { bottom: -4%; left: 41%; } 
.delay-mounth.one { right: -30%; top: 41%; }
.coins.three { margin-left: -17%; }
.coins.two { margin-left: -13%; }
.coins.one { margin-right: 22px; }
.how-big-is-dementia .bubble-one, .support-people .bubble-one { bottom: 8%; right: -2%; }
.big-bubble h2 { font-size: 58px; line-height: 53px; } 
.cd-primary-nav li { margin: 17px 0; }
.cd-primary-nav { padding: 20px 5% 32%; overflow: scroll !important; position: absolute; }
.cd-primary-nav li:last-child { margin-bottom: 15%; }
.number-slider ul li, .number-slider ul li:nth-child(2) { font-size: 13px; }
.number-slider ul { width: 85px; height: 40px; }
.slider-two-dementia .col-8 { margin-top: 45px; } 
.women-men img { width: 300px; }
.coins img { width: 60%; display: block; margin: 0 22%; } 
.coins .year { font-size: 15px;  }
.coins.one .year { margin-bottom: -22%; }
.coins.two .year { margin-bottom: -24%; } 
.coins.three .year { margin-bottom: -8%; margin-left: 11%; font-size: 24px; } 
.absolute { position: absolute; top: 248px; left: -30px; } 
.how-big-is-dementia .porcent-canvas .col-6 { min-height: 110px; } 
.bubble.start { width: 100px;  height: 100px; }
.bubble.start i { font-size: 28px; }
.support-people #slide4 .number-slider.move-up-100 { margin-top: 0 !important; }
.section-purple .big-bubble { width: 420px; height: 420px; } 
.section-purple .bubble.next-slider { font-size: 18px; line-height: 16px; margin-top: 10px; width: 100px; height: 100px; } 
.content-section-white .porcent-canvas .porcent-number { font-size: 39px; width: 6%; } 
}  

@media only screen and (max-width: 1200px) {
.content-section { max-width: 720px; }
.bubble.start { float:right; line-height: 130px; margin-top: 10px; }
.content-section .header .number {width: 150px; height: 150px; font-size: 60px; }
.brain-right-2 { right: -18%; }
header .logotype { width: 90px;}
.bubble-one.big-bubble-right { width: 260px; height: 260px; }
.quiz-page .slide .big-bubble-right { bottom: 5%; top: auto; padding: 5rem 3.5rem 5rem 0; }
.quiz-page .slide .content-section .header .porcent-canvas p { font-size: 15px; line-height: 22px; }
.content-qmark { bottom:8%; }
.slider-two-dementia .bubble.blue { font-size: 40px; width: 200px; height: 200px; }
.number-tip.men { right: 22%; }
.number-tip.women { left:21%; }
.economic-cost .small { margin-top: 10px; display: block; }
.content-section-white { max-width: 720px; }
.content-section-white h4 { font-size: 21px; line-height: 34px; }
.content-section-white p, .content-section-white li { font-size: 14px; }
.new-zealand-img { right: -10%; }
h2 { font-size: 30px; line-height: 33px; } 
h4 { font-size: 15px; line-height: 20px; }  
h4 .arrow { width: 17px; top: 4px; margin-left: 1px; }
.start-header h4 { font-size: 20px; line-height: 31px; } 
p { font-size: 13px; line-height: 20px; margin: 8px 0; }  
.bubble.start { display: inline-block; margin: 0 0 0 13px !important; text-align: center; float: initial; font-size: 20px; width: 90px; height: 90px; }
.btn-arrow { width: 35px; height: 35px; }
.line-dot { max-width: 9px; margin: 4px auto 0; height: 47px; } 
.container-quiz h2, .container-quiz h3, .container-quiz .answer { font-size: 25px; line-height: 30px; }
.container-quiz h3 { font-size: 20px; line-height: 25px; }
.answer .bubble { width: 100px; height: 100px; margin: 0 0px; font-size: 18px; } 
.number-slider ul li, .number-slider ul li:nth-child(2) { font-size: 12px; }
.number-slider ul li { left: calc(74% - 57px); top: -5px;}
.number-slider ul { width: 70px; height: 38px; }
.title { font-size: 10px; margin-bottom: 5px; }
.bubble-one.big-bubble-right p { font-size: 13px; line-height: 20px; } 
.telescope { width: 195px; margin: 106px 0px 0 0px; } 
.slider-two-dementia .bubble.blue { font-size: 24px; width: 150px; height: 150px; }
.slider-two-dementia .bubble.purple { font-size: 18px; width: 110px; height: 110px; margin: 11% -1px 0 0px; } 
.slider-two-dementia .bubble.white { font-size: 16px; width: 85px; height: 85px; margin-top: 22%; } 
.slider-two-dementia .col-8 { margin-top: 8%; }
.women-men img { width: 300px; }
.number-tip.women { left: 31%; width: 145px; background-size: contain; font-size: 21px; line-height: 17px; }
.number-tip.men { width: 145px; background-size: contain; font-size: 21px; line-height: 25px; right: 29%;}
.save-money { width: 196px; left: 32%; top: 22px; }
.hand { width: 165px; position: relative; margin-right: -54%; margin-top: 84%; } 
.money-count { bottom: 9%; left: 65%; font-size: 30px; }
.coins.three { margin-left: -27%; }
.coins img { width: 50%; }
.coins.one .year { margin-bottom: -19%; font-size: 13px; } 
.coins.three .year { margin-bottom: -7%; margin-left: 6%; font-size: 18px; }
.coins.two .year { margin-bottom: -21%; font-size: 15px; }  
.economic-cost h2 { font-size: 28px; padding-right: 19px; }
.economic-cost .small { margin-top: 2px; font-size: 11px; }	 
.how-big-is-dementia .porcent-canvas .col-6 { min-height: 115px; } 
.bubble.start i { font-size: 22px; } 
.col-12.start-header .bubble.start { vertical-align: middle; display: inline-flex; }
.col-12.start-header h4 { vertical-align: middle; }
.col-12.start-header { vertical-align: middle; }
.support-people .porcent-canvas .col-4 { min-height: 175px; } 
.big-bubble h2 { font-size: 56px; line-height: 48px; }
.big-bubble h2 img { width: 30px; } 
.section-purple .big-bubble { width: 390px; height: 390px; }
.section-purple .bubble.next-slider {  font-size: 17px; margin-top: 10px; width: 115px; height: 115px; } 
.content-section-white h4 { font-size: 18px; line-height: 26px; margin-bottom: 10px; font-family: "museo-sans",sans-serif; font-weight: 900;} 
.content-section-white p, .content-section-white li { font-size: 12px; line-height: 22px; } 
.content-section-white p span { font-size: 21px; line-height: 29px; } 
.content-section-white .porcent-canvas .porcent-number { font-size: 27px; width: 6%; vertical-align: middle; } 
.content-section-white .porcent-canvas p { vertical-align: middle; } 
}


@media only screen and (max-width: 800px) { 
.new-zealand-img {display: none}
.bubble-two {display: none}
.home .bubble-one, .bubble-one  {width: 300px; height: 300px; left: 15%; bottom: -10%; }
.home .bubble-one p, .bubble-one p { font-size: 23px; line-height: 22px; letter-spacing: -1px; }
#fp-nav ul {left:0;}
#section-home {background-position: 20%}
.cd-primary-nav { max-width: 300px; right: 15%; top: 8%; padding: 6px 5%; overflow: scroll; } 
.cd-nav-trigger.close-nav { position: fixed; top: 30px; }
.cd-primary-nav a { font-size: 1.8em; }
.cd-primary-nav li {margin:1em 0;}
.content-section { max-width: 63%; }
.content-section .header .col-9 {padding:0;}
h2 { font-size: 22px; line-height: 22px; }
h4 {font-size: 18px; line-height: 20px;}
h4 .arrow {display: none}
p { font-size: 14px; line-height: 24px; } 
.fp-tableCell {overflow: hidden;}
.content-section .header .number {display: none}
.bubble.start { float: left; line-height: 130px; margin-top: 10px; margin-left: 0; font-size: 22px; }
.bubble {width: 90px; height: 90px;}
.btn-arrow {width: 30px; height: 30px;}
.content-section .header p {margin:10px 0;max-width: 100%; }
.line-dot {height: 40px}
.container-quiz h2, .container-quiz h3, .container-quiz .answer { font-size: 20px; line-height: 20px; }
.question { margin: 40px 0; width: 100%; margin: 30px auto 30px; }
.answer .bubble { width: 100px; height: 100px; margin: 0 5px; font-size: 25px; }
.container-quiz h2 {margin-top: 0px;}
.content-section {margin-top: 120px;}
.content-section .header.move-up-100 {margin-top: 0}
.move-up-100 {margin-top: 0}
.content-qmark {bottom: 0; left: 0; height: 100px;}
.women-men img {width: 100%}
.number-tip.women {left: 10%; margin-top: 10px;}
.number-tip.women {background-size: contain; width: 100px; font-size: 18px; padding: 12px 0 43px; }
.number-tip.men { right: 0%; }
.number-tip.men {width: 125px; padding: 15px 0 42px; font-size: 25px;}
.start-header h4 { font-size: 24px; line-height: 26px; width: 100%; }
.content-section { margin-top: 0px; }
.active .quiz-page #slide1 .brain-right-2, .active .quiz-page .scroll-bottom, .active .quiz-page .header { animation: none;}
.about-dementia .bubble.start { margin: 20px auto; text-align: center; float: inherit; display: block; display: flex; }
.fp-controlArrow { display: none !important; }
.fp-responsive .quiz-sect,
.fp-responsive .quiz-sect .fp-slide,
.fp-responsive .quiz-sect .fp-tableCell{
  height: auto !important;
  min-height: 720px;
}
.fp-responsive .support-people,
.fp-responsive .support-people .fp-slide,
.fp-responsive .support-people .fp-tableCell{
  height: auto !important;
  min-height: 900px;
}
.fp-responsive .how-big-is-dementia,
.fp-responsive .how-big-is-dementia .fp-slide,
.fp-responsive .how-big-is-dementia .fp-tableCell{
  height: auto !important;
  min-height: 650px;  
}
.fp-responsive .section-purple,
.fp-responsive .section-purple .fp-slide,
.fp-responsive .section-purple .fp-tableCell{
  height: auto !important;
  min-height: 900px;
}
.content-section-white p span { font-size: 14px; line-height: 18px; }
.content-section-white p, .content-section-white li { font-size: 12px; margin-bottom: 10px; line-height: 20px; }
.fp-viewing-quiz-0 .quiz-container { animation: none; height: auto !important; } 
.bubble-one.big-bubble-right { display: none; }
.number-porcent-news { font-size: 21px; }
.quiz-page .slide .content-section .header .porcent-canvas .col-4 { padding: 0; }
.mobile-active { display: block; }
.mobile-hidden { display: none; }
.telescope-mobile-active { width: 400px !important; margin-left: -6%; }
.woman-mobile {width: 300px; }
.move-up-100 { margin-top: 0px !important; }
.content-section .header { margin-top: 0; }
.how-big-is-dementia .porcent-canvas .col-6 { min-height: inherit; }
.mobile-img img { display: block; width: 400px !important; height: auto; margin-left: -6%; }
.economic-cost h2 { font-size: 35px; padding-right: 20px; margin-top: 10px; }
.dots { border-right: 0; width: 100%; float: left; }
.economic-cost p { max-width: 100%; width: 100%; margin: 0 !important; }
.absolute { top: 395px; }
.porcent-canvas .col-4 { margin-top: 0; }
.porcent-canvas .col-4:nth-child(2) { margin-top: 00px; }
.porcent-canvas .col-4, .porcent-canvas .col-6 { padding: 0; }
.white-hand { display: none; }
.big-bubble h2 { font-size: 53px !important; line-height: 47px !important; }
.section-purple .big-bubble { width: 320px !important; height: 320px !important; }
.bubble.next-slider { width: 130px; height: 130px; }
#fp-nav { display: none; }
.content-section { max-width: 85%; }
.quiz-page {position:relative;}
.quiz-container {min-height:600px; display: table; }
.quiz-container .content-section {display: table-cell; vertical-align: middle; }
.brain-right-2 { top: 1%; width: 49%; }
.absolute { left: 0; }
.support-people .porcent-canvas .col-4 { min-height: auto; margin-bottom: 20px; }
.content-section-white { max-width: 85%; }
.content-section-white h4 { font-size: 15px; line-height: 22px; margin-bottom: 0; }
.arrow-right, .arrow-left { font-size: 15px; }
.content-section-white .porcent-canvas .porcent-number { width: 12%; display: inline-block; vertical-align: top; text-align: left; font-size: 30px; margin-top: 19px; }
.content-section-white .porcent-canvas .col-12 { margin-bottom: 0; }
.final-slider p.phone { font-size: 16px; }
.final-slider p.phone a { font-size: 35px; margin-top: 7px; } 
.final-slider p.link { font-size: 18px; } 
.support-people .bubble.start { display: flex; margin: 20px auto; float: initial; }
.bubble.start { width: 120px; height: 120px; }
.support-people .start-header h4 { font-size: 17px; line-height: 26px; } 
.support-people #slide4 .number-slider.move-up-100 { margin-top: 0px !important; }

}

@media only screen  and (max-width: 600px) {
	.bubble.start { width: 70px; height: 70px; margin-top: 20px !important; font-size: 13px; letter-spacing: 0.03em; margin-left: 0 !important; }
}

@media only screen  and (max-width: 400px) {
.brain-right { right: -11%; top: 1%; }
.content-section { padding: 0 30px; }
.telescope-mobile-active { width: 345px !important; }
.mobile-img img { margin-left: -12%; }
.economic-cost p { padding-top: 0; } 
.economic-cost { margin: 26px 0 0; }
.dots { width: 30%; }
.economic-cost .small { margin-top: 5px; font-size: 14px; } 
.arrow-right { right: 3px; }
.arrow-left { left: 3px; }
.cd-primary-nav { right: 7%; top: 13%; }

}

@media only screen  and (max-width: 320px) {
.home .bubble-one, .bubble-one { width: 265px; height: 265px; left: 11%; bottom: -9%; } 
.home .bubble-one p { margin-left: 16%; font-size: 22px; line-height: 22px; }
.brain-right { right: -28%; }
.bubble.start { width: 90px; height: 90px; } 
.container-quiz h2, .container-quiz h3, .container-quiz .answer { font-size: 16px; line-height: 20px; } 
.title { font-size: 12px; margin-bottom: 0px; }
.quiz-page .slide .content-section .header .porcent-canvas p, p { line-height: 19px; font-size: 12px; }
.next-quiz { font-size: 15px; }
.next-quiz img { width: 19px; }
.answer .bubble { font-size: 18px; letter-spacing: 0; }
.porcent-number, .porcent-canvas p.porcent-number span { font-size: 19px; } 
.telescope-mobile-active { width: 290px !important; }
.number-slider ul li, .number-slider ul li:nth-child(2) {  font-size: 16px; }
.mobile-img img { display: block; width: 330px !important; }
.economic-cost h2 { font-size: 21px; }  
.economic-cost .small { margin-top: 2px; font-size: 8px; } 
.fp-responsive .support-people, 
.fp-responsive .support-people .fp-slide, 
.fp-responsive .support-people .fp-tableCell { height: auto !important; min-height: 770px; }
.big-bubble h2 { font-size: 28px !important; line-height: 28px !important; }
.section-purple .big-bubble { width: 255px !important; height: 255px !important; } 
.section-purple .bubble.next-slider { font-size: 19px; line-height: 19px; letter-spacing: 0; padding: 0 19px; box-sizing: border-box; }  
.flex > div { width: 100%; display: block; } 
.flex { display: block; }
.content-section-white { padding: 40px 0 20px; }
.content-section-white .number-slider { margin: 0 !important; position: relative; }
.content-section-white .section-purple .nav { float: inherit; }
.final-slider p.phone { font-size: 13px; }
.final-slider p.phone a { font-size: 28px; margin-top: 4px; } 
.final-slider p.link { font-size: 14px; } 
.scroll-bottom { bottom: -10px;  }
.woman-mobile { width: 294px; margin-left: -9%; } 
.cd-primary-nav a { font-size: 20px; }
.cd-primary-nav li { margin: 7px 0; top: 17%; }

}


/* Portrait  IPAD */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) {
header .logotype { width: 130px; }
.content-section { margin-top: 0; }
.content-section .header .col-9 { width: 100%; }
.content-section .header .col-12 { text-align: left; }
.mobile-active { display: block; }
.mobile-hidden { display: none; }
.start-header h4 { font-size: 24px; line-height: 27px; float: left; }
.how-big-is-dementia #slide5 .absolute { top: inherit; left: -30px; bottom: -58px; }
.how-big-is-dementia #slide4 .move-up-100 { margin-top: 0px !important; } 
.content-section { max-width: 76%; }
.bubble-one.big-bubble-right { bottom: 7%; height: 280px; width: 280px; }
.support-people .porcent-canvas .col-4 { min-height: 175px; }
.bubble.next-slider { width: 130px; height: 130px; }
.content-section-white { max-width: 80%; } 
.home .bubble-one { bottom: -7%; } 
.about-dementia h4 { width: 70%; float: left; margin-top: 37px; }
.quiz-page .slide .content-section .header .porcent-canvas .col-4 { padding: 0 10px 0 0; } 
.content-qmark { bottom: 17%; left: 0; height: 154px; } 
.telescope-mobile-active { width: 500px !important; margin-left: 0; margin: 0 auto; display: block; } 
.woman-mobile { width: 400px; } 
.mobile-img img { display: block; width: 600px !important; height: auto; margin-left: 0; margin: 0 auto; }
.economic-cost h2 { font-size: 27px; }
.dots { width: 17%; border-right: 6px dotted; margin-right: 10px;}
.economic-cost p { padding-top: 5px; }
.porcent-canvas .col-4, .porcent-canvas .col-6 { padding: 0 10px 0 0; } 
.how-big-is-dementia .porcent-canvas .col-6 { min-height: 135px; } 
.support-people .bubble.start { width: 100px; height: 100px; margin: 20px 0 0 !important; }
.bubble-one.big-bubble-right { display: block; padding: 3.5rem 3.5rem 5rem 0 ; } 
.bubble-one.big-bubble-right p { font-size: 14px; line-height: 21px; } 
.quiz-sect .quiz-container { display: inline-table; }
.answer .bubble { font-size: 19px; }
.section { overflow: hidden; }
}

/* Portrait IPAD PRO  */
@media only screen and (min-device-width: 1024px) and (max-device-width: 1366px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) {
.home .bubble-one { bottom: -8%; }
header .logotype { width: 180px; }
.about-dementia .bubble.start { line-height: 130px; margin-top: 10px; margin: 27px auto; display: block; float: initial; } 
.bubble-one.big-bubble-right { width: 450px; height: 450px ; bottom: -5% ; right: -2% ; padding: 5rem 3.5rem 5rem 0 ;}
.bubble-one.big-bubble-right p { font-size: 25px; line-height: 35px; } 
.content-benefits { position: relative; top: 0; margin: 0 0 5% 0%; }
.money-count { left: 36%; }
.coins img { width: 100%; }
.mobile-active { display: block; }
.mobile-hidden { display: none; }
.big-bubble h2 { color: #7e4098; font-size: 74px; line-height: 66px; } 
.new-zealand-img { right: -18%; }
.final-slider p.phone a { margin-top: 17px; }
h2 { font-size: 40px; line-height: 45px; }
h4, .content-section-white h4 { font-size: 20px; line-height: 25px; }
.start-header h4 { font-size: 24px; line-height: 37px; width: 74%;} 
p, .quiz-page .slide .content-section .header .porcent-canvas p, .content-section-white p, .content-section-white li { font-size: 21px; line-height: 34px; } 
.about-dementia { overflow: hidden; }
.home .bubble-two { display: none; }
.home .bubble-one { bottom: 7%; width: 480px; height: 480px; }
.home .bubble-one p { font-size: 43px; line-height: 41px; }
.about-dementia .bubble.start { display: inline-flex; }
.about-dementia h4 { width: 65%; } 
#fp-nav ul { left: 27px; }
.btn-arrow { width: 50px; height: 50px; } 
.line-dot { max-width: 14px; height: 80px; }
.container-quiz h3 { font-size: 29px; line-height: 42px; } 
.answer .bubble { width: 125px; height: 125px; font-size: 25px; }
.brain-right-2 { right: -11%; top: 10%; } 
.fp-controlArrow.fp-next, .fp-controlArrow.fp-prev { display: none !important; }
.quiz-page .slide .big-bubble-right { bottom: -5%; }
.content-section .header p { max-width: 100%; }  
.number-slider ul li, .number-slider ul li:nth-child(2) { font-size: 20px; } 
.number-slider ul li { left: calc(47% - 57px); }
.number-slider ul { width: 102px; height: 53px; }  
.telescope-mobile-active { width: 635px; margin: 0 auto; display: block; } 
.woman-mobile { width: 530px; } 
.save-active-mobile { width: 700px !important; margin: -3% 0 0 11%; } 
.economic-cost p { padding-top: 0; } 
.how-big-is-dementia .porcent-canvas .col-6 { min-height: 200px !important; } 
.title { font-size: 18px; margin-bottom: 10px; } 
.section-purple .bubble.lightblue { font-size: 28px; margin-top: 21px;  }  
.support-people .porcent-canvas .col-4 { min-height: 310px !important; }
}

/* Portrait  IPAD */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1) {
	.brain-right-2 { right: -12%; top: 8%; width: 31%; }
}