/* base.css dev **/
html, body
{
    padding: 0;
    margin: 0;

    -webkit-font-smoothing: subpixel-antialiased;
}

body
{
    font-size: 16px;
    font-family: 'Open Sans', sans-serif;
    line-height: 1.4em;

    background-color: #fff;
    background-color: #b0c3d1;

    color: #000;
    color: rgb(13, 41, 62);

    -webkit-font-smoothing: subpixel-antialiased;
}

.accentColor
{
    color: #000;
    color: rgb(255, 203, 0);
}

a img
{
    border: 0;
}

h1, h2, h3
{
    line-height: normal;
}

h3.formMessage
{
    margin: 0;
    padding: 0;
}

h3.formMessage.error
{
    padding: 0 0 15px 0;
    color: #ff6347;
    color: rgb(255, 203, 0);
}

h3#errorMessage
{
    margin: 0;
    padding: 0;
    color: #ff6347;
    color: rgb(255, 203, 0);
}

ul.questions
{
    position: relative;
    margin: 0;
    padding: 0;

    text-align: left;
    white-space: nowrap;
    list-style-type: none;

    overflow: hidden;

    user-select: none;
}

ul.questions h3
{
    white-space: normal;
}

ul.questions li
{
    width: 100%;
    display: inline-block;
    vertical-align: top;
}

ul.answers
{
    list-style-type: none;
    margin: 0;
    padding: 0;
    width: 100%;

    white-space: normal;
}

ul.answers li
{
    display: block;
    float: left;
    width: 50%;
    padding-right: 7.5px;
    margin-top: 15px;

    box-sizing: border-box;
}

ul.answers li a
{
    cursor: pointer;
}

ul.answers li:nth-child(even)
{
    padding-left: 7.5px;
    padding-right: 0;
}


.setting-eye
{
    position: fixed;
    right: 40px;
    top: 40px;
    z-index: 10;

    opacity: 0;
    transform: translate(200px, 0);

    transition: opacity 0.5s, transform 0.8s cubic-bezier(0.12,0.98,0.3,1.0);
}

.setting-eye.init
{
    opacity: 1;
    transform: translate(0, 0);
}

.setting-eye .blue-eye
{
    background-color: #2a9ed8;
    box-shadow: 2px 1px 7px rgba(0,0,0,0.3);
    border-radius: 50%;
    height: 100px;
    width: 100px;
    text-align: center;
    line-height: 115px;
    padding: 0;
}

.setting-eye .blue-eye img
{
    left: 1px;
    position: relative;
    top: 9px;
    width: 45px;
}

.afterForm
{
    display: none !important;
}

.clear
{
    clear: both;
}

div.form
{
    background: #efefef;
    padding: 15px;
}

div.form label,
div.form .inputLabel,
div.form div.termsConditionsLabel
{
    display: block;
    position: relative;
    padding: 0;
    margin: 0 0 5px 0;

    text-align: left;
}
div.form label {
    top: 50%;
}

div.form label
{
    font-weight: bold;
    font-size: 0.9em;
    transition: color 0.4s ease;
}

div.form div.termsConditionsLabel a
{
    text-decoration: underline;
}

div.form div.termsConditionsLabel a
{
    text-decoration: underline;
    color: rgb(13, 41, 62);
}

div.form .inputLabel
{
    display: block;
    height: 35px;
    margin: 0 0 15px 0;
}

div.form .inputLabel span
{
    position: relative;
    display: inline-block;
    width: 28%;
    top: 50%;
    float: left;
    padding-right: 10px;
    box-sizing: border-box;
    overflow: hidden;

    transform: translate(0,-50%);
}

div.form .inputLabel input
{
    width: 72%;
    height: 35px;
    padding: 5px;
    float: left;

    background: #fff;
    border: 1px solid rgba(0,0,0,0.15);
    border-radius: 4px;
    box-shadow: inset 0 0 2px #efefef;
    box-sizing: border-box;
    outline: none;

    font-size: 16px;
    font-family: 'Open Sans', sans-serif;

    color: #000;
    color: rgb(13, 41, 62);

    transition: border-bottom 0.25s ease;
}

div.form .inputLabel input:focus
{
    box-shadow: inset 0 0 2px #ccc;
    border: 1px solid rgba(0,0,0,0.25);
}

div.form .inputLabel input.city,
div.form .inputLabel input.streetName
{
    width: 35%;
}

div.form .inputLabel input.postalCode
{
    width: 24%;
    margin: 0 3px 0 0;
}

div.form .inputLabel input.houseNumber
{
    width: 13%;
    margin: 0 3px 0 0;
}

div.form .inputLabel input.houseNumberAdd
{
    width: 13%;
}

div.form .inputLabel input.city
{
    float: right;
}

div.form .inputLabel input.birthday
{
    width: 15%;
    margin: 0 3px 0 0;
    text-align: center;
}

div.form .inputLabel.radio
{
    margin-bottom: 0;
    height: auto;
}

div.form .inputLabel.radio span
{
    height: 40px;
    top: 0;
    transform: none;
}

div.form label.radioLabel
{
    display: inline-block;
    padding-right: 15px;
}

div.form label.radioLabel input
{
    width: auto;
    height: auto;
    padding: 0;
    float: none;
    background: initial;
    border: initial;
    border-radius: initial;
    box-shadow: initial;
    box-sizing: initial;
    outline: initial;
}

div.form label.error span,
div.form div.error span,
div.form div.termsConditionsLabel.error
{
    color: rgb(255, 203, 0);
}

div.form label.error span.noError,
div.form div.error span.noError
{
    color: rgb(13, 41, 62);
}

div.form label.error input,
div.form div.error input
{
    background: rgba(255,0,0,0.05);
    border: 1px solid #ba8a82;
}

div.form label.error input.noError,
div.form div.error input.noError
{
    background: #fff;
    border: 1px solid rgba(0,0,0,0.15);
}

div.form select
{
    position: relative;
    top: 5px;
    font-size: 16px;
}

div.form .textLabel
{
    display: block;
    margin: 15px 0;
}

a.toTermsAndConditions
{
    cursor: pointer;
    text-decoration: underline;
}

a.toPrivacyPolicy
{
    cursor: pointer;
    text-decoration: underline;
}

/**
 * Cookie notice
 */
div#__EUNotice
{
    display: block;
    position: fixed;
    top: 0;
    width: 100%;
    padding: 15px;

    background-color: #ffffff;
    box-shadow: 0 0 6px rgba(0,0,0,0.2);
    box-sizing: border-box;

    font-size: 16px;
    z-index: 9999;
}

div#__EUNotice p
{
    margin: 0;
    padding: 0;

    color: @(quizLayout_textColor);
}

div#__EUNotice a.__EUNotice--okBtn
{
    display: inline-block;
    padding: 0 25px;
    height: 40px;
    float: right;

    background-color: rgb(255, 203, 0);
    border-radius: 20px;

    white-space: nowrap;

    text-align: center;
    text-decoration: none;
    line-height: 38px;
    color: #FFFFFF;

    transition: opacity 0.3s ease-out 0s;
}

div#__EUNotice a.__EUNotice--okBtn:hover
{
    opacity: 0.8;
}

@media screen and (max-width: 600px) {
    div#__EUNotice p
    {
        display: block;
    }

    div#__EUNotice a.__EUNotice--okBtn
    {
        display: block;
    }
}

@media screen and (max-width: 530px) {

    div.form .inputLabel
    {
        display: block;
        margin: 0 0 8px 0;
        height: auto;
    }

    div.form .inputLabel span
    {
        position: relative;
        display: block;
        width: 100%;
        top: 0;
        float: none;
        padding: 0;

        transform: none;
    }

    div.form .inputLabel.radio
    {
        margin-bottom: 0;
        height: auto;
    }

    div.form .inputLabel.radio span
    {
        height: auto;
        top: 0;
        transform: none;
    }

    div.form .inputLabel input
    {
        width: 100%;
        float: none;
    }

    div.form .inputLabel input.city,
    div.form .inputLabel input.streetName
    {
        width: 49%;
    }

    div.form .inputLabel input.postalCode
    {
        width: 44%;
        margin: 0 3px 0 0;
    }

    div.form .inputLabel input.houseNumber
    {
        width: 20%;
        margin: 0 3px 0 0;
    }

    div.form .inputLabel input.houseNumberAdd
    {
        width: 20%;
    }

    div.form .inputLabel input.birthday
    {
        width: 25%;
    }

    div.form .textLabel
    {
        display: block;
        margin: 8px 0;
    }
}
.cookieWrapper {
    position:fixed;
    width:100vw;
    height:100vh;
    background-color: rgba(100,100,100,0.9);

    top: 0;
    left: 0;
    pointer-events: all;
    z-index: 9;
    display:none;
}

@media only screen and (min-width: 600px) {
    .cookieWrapper > div {
        margin: 40px;
        text-align: -webkit-center;
        text-align: -moz-center;
        justify-content: center;
        display: flex;
    }
}

.coockieWrapper .cookieHeaderLogo {
    max-height: 100px;
    margin: 20px;
}
.cookieWrapper.visible {
    display: block;
}
.cookieContainer {
    position: relative;
    overflow:auto;

    margin-top: 10px;
    max-height: 80vh;

    max-width: 96%;
    left:2%;

    background: white;
    -moz-box-shadow: 0 0 13px #ccc;
    -webkit-box-shadow: 0 0 13px #ccc;
    box-shadow: 0 0 13px 5px #999;
    text-align: left;


}
@media only screen and (min-width: 600px) {
    .cookieContainer {
        max-width: 560px;
    }
}
.cookieHeaderLogo {
    position: relative;

    min-width: 80%;
    text-align: center;

}
.cookieHeaderLogo img {
    max-height: 100px;
}

.cookieHeader {
    height: 65px;
    background-color: #efefef;
    border-bottom: 3px solid rgb(255, 203, 0);
    text-align: center;
    display: flex;
    justify-content: left;
    padding-left: 20px;
    font-size: 120%;
}
@media only screen and (max-width: 600px) {
    .hideOnMobile {
        display:none;
    }
}
@media only screen and (min-width: 600px) {
    .hideOnDesktop {
        display:none;
    }
}

@media only screen and (max-width: 600px) {
    .cookieHeader h2 {
        font-size: 100%;
    }
    .cookieContent {
        font-size: 80%;
    }
}


.cookieContent {
    margin-left: 20px;
    margin-right: 20px;
}

.cookieButtonWrapper {
    margin-left: 20px;
    margin-bottom: 20px;
    padding-top: 20px;


}
.cookieButton {
    border-radius: 4px;
    display: inline-block;
    background-color: rgb(255, 203, 0);
    color: rgb(255, 255, 255);
    padding-left: 35px;
    padding-right: 35px;
    padding-top: 15px;
    padding-bottom: 15px;
    text-align: center;
    font-weight: bolder;;
    user-select: none;

}
.cookieButton:hover {
  opacity: .7;
  cursor: pointer;
}
.cookieButton:active {
  opacity: .9;
  cursor: pointer;
}body,html{min-height:100%;-webkit-font-smoothing:subpixel-antialiased}body{background-image:url('img/7da7ea08b9@2x.jpg');background-position:center;background-repeat:no-repeat;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover;background-attachment:fixed;-webkit-font-smoothing:subpixel-antialiased}.wrapper{margin:0 auto;max-width:600px;padding:15px;display:none}.wrapper.showingTopBanner{padding-top:120px!important}.dropShadow{-webkit-box-shadow:0 2px 8px rgba(0,0,0,.2);-moz-box-shadow:0 2px 8px rgba(0,0,0,.2);box-shadow:0 2px 8px rgba(0,0,0,.2)}hr{height:1px;border:0;margin:15px 0;background:rgb(13, 41, 62);opacity:.2}nav{position:relative;padding:10px 15px;background:#fff;background:#ffffff;text-align:center;-webkit-transform:translate(0,-110%);-moz-transform:translate(0,-110%);-ms-transform:translate(0,-110%);-o-transform:translate(0,-110%);transform:translate(0,-110%);-webkit-animation-duration:.6s;-moz-animation-duration:.6s;-o-animation-duration:.6s;animation-duration:.6s;-webkit-animation-fill-mode:forwards;-moz-animation-fill-mode:forwards;-o-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-timing-function:cubic-bezier(.12,.78,.41,1);-moz-animation-timing-function:cubic-bezier(.12,.78,.41,1);-o-animation-timing-function:cubic-bezier(.12,.78,.41,1);animation-timing-function:cubic-bezier(.12,.78,.41,1);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}nav.showsButtons{padding:10px 40px}.wrapper.bottomIn nav,.wrapper.topIn nav{-webkit-animation-name:animateNavIn;-moz-animation-name:animateNavIn;-o-animation-name:animateNavIn;animation-name:animateNavIn}.wrapper.bottomIn.bottomOut nav,.wrapper.bottomIn.topOut nav,.wrapper.bottomOut nav,.wrapper.topIn.bottomOut nav,.wrapper.topIn.topOut nav,.wrapper.topOut nav{-webkit-animation-name:animateNavOut;-moz-animation-name:animateNavOut;-o-animation-name:animateNavOut;animation-name:animateNavOut}nav h2{margin:0;font-size:1.33em;font-weight:300}nav h2 img{max-height:50px}nav button{position:absolute;top:50%;height:40px;min-width:40px;margin-top:-21px;background:0 0;border:0;font-family:'Open Sans',sans-serif;font-size:.8em;font-weight:600;text-transform:uppercase;color:rgb(255, 203, 0);cursor:pointer;outline:0}nav button.previousQuestion{left:0}nav button.nextQuestion{right:0}nav button svg{position:relative;top:4px;height:25px;fill:rgb(255, 203, 0);-webkit-transition:-webkit-transform .25s ease;transition:-webkit-transform .25s ease;-o-transition:-o-transform .25s ease;-moz-transition:transform .25s ease,-moz-transform .25s ease;transition:transform .25s ease;transition:transform .25s ease,-webkit-transform .25s ease,-moz-transform .25s ease,-o-transform .25s ease}nav button.previousQuesion:active svg{-webkit-transform:translate(-3px,0);-moz-transform:translate(-3px,0);-ms-transform:translate(-3px,0);-o-transform:translate(-3px,0);transform:translate(-3px,0)}nav button.nextQuesion{display:none;opacity:0}nav button.nextQuesion:active svg{-webkit-transform:translate(3px,0);-moz-transform:translate(3px,0);-ms-transform:translate(3px,0);-o-transform:translate(3px,0);transform:translate(3px,0)}.animate{-webkit-animation-duration:.6s;-moz-animation-duration:.6s;-o-animation-duration:.6s;animation-duration:.6s;-webkit-animation-fill-mode:forwards;-moz-animation-fill-mode:forwards;-o-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-timing-function:cubic-bezier(.12,.78,.41,1);-moz-animation-timing-function:cubic-bezier(.12,.78,.41,1);-o-animation-timing-function:cubic-bezier(.12,.78,.41,1);animation-timing-function:cubic-bezier(.12,.78,.41,1)}.wrapper.topIn .animate{-webkit-animation-name:animationFromTop;-moz-animation-name:animationFromTop;-o-animation-name:animationFromTop;animation-name:animationFromTop}.wrapper.bottomIn.topOut .animate,.wrapper.topIn.topOut .animate,.wrapper.topOut .animate{-webkit-animation-name:animationToTop;-moz-animation-name:animationToTop;-o-animation-name:animationToTop;animation-name:animationToTop}.wrapper.bottomIn .animate{-webkit-animation-name:animationFromBottom;-moz-animation-name:animationFromBottom;-o-animation-name:animationFromBottom;animation-name:animationFromBottom}.wrapper.bottomIn.bottomOut .animate,.wrapper.bottomOut .animate,.wrapper.topIn.bottomOut .animate{-webkit-animation-name:animationToBottom;-moz-animation-name:animationToBottom;-o-animation-name:animationToBottom;animation-name:animationToBottom}.framework{position:relative;padding:15px;margin:30px 0;background:#fff;background:#ffffff;text-align:center;opacity:0}.wrapper[data-questions]{padding:0;max-width:960px}.framework img{max-width:100%}.framework h1{margin:0;padding:15px 0;font-weight:300;font-size:3em;-webkit-hyphens:auto;-moz-hyphens:auto;-ms-hyphens:auto;hyphens:auto}#learnable button,.framework button{display:inline-block;padding:0 40px;height:44px;margin:15px 0;border:2px solid;-webkit-border-radius:22px;-moz-border-radius:22px;border-radius:22px;font-family:'Open Sans',sans-serif;line-height:40px;font-size:22px;font-weight:600;color:#fff;cursor:pointer;-webkit-transition:background-color .15s ease,color .15s ease,-webkit-transform .15s ease;transition:background-color .15s ease,color .15s ease,-webkit-transform .15s ease;-o-transition:background-color .15s ease,color .15s ease,-o-transform .15s ease;-moz-transition:background-color .15s ease,color .15s ease,transform .15s ease,-moz-transform .15s ease;transition:background-color .15s ease,color .15s ease,transform .15s ease;transition:background-color .15s ease,color .15s ease,transform .15s ease,-webkit-transform .15s ease,-moz-transform .15s ease,-o-transform .15s ease;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;outline:0}#learnable button:hover,.framework button:hover{background-color:transparent}#learnable button.back,.framework button.back{padding:0;width:44px}#learnable button.back svg,.framework button.back svg{-webkit-transform:rotate(270deg);-moz-transform:rotate(270deg);-ms-transform:rotate(270deg);-o-transform:rotate(270deg);transform:rotate(270deg)}button.back:hover{-webkit-transform:scale(1.1,1.1);-moz-transform:scale(1.1,1.1);-ms-transform:scale(1.1,1.1);-o-transform:scale(1.1,1.1);transform:scale(1.1,1.1)}#learnable button svg,.framework button svg{position:relative;top:2px;width:20px;height:20px;fill:#fff}.framework .timeRemaining{position:absolute;width:100%;top:-3px;left:0;height:3px;background:#fff;background:#ffffff}.framework .timeRemaining span{display:block;height:3px;width:0;background:#000;background:rgb(255, 203, 0);-webkit-transition:width .9s ease;-o-transition:width .9s ease;-moz-transition:width .9s ease;transition:width .9s ease}h1.progressionIndicator{padding:0 15px;margin:15px 0 -15px 0;font-weight:700;font-size:1.5em;line-height:2em;color:#fff;color:#ffffff;text-shadow:0 0 10px rgba(0,0,0,.5);text-align:right;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}h1.progressionIndicator span{font-size:2em}ul.questions h3{margin:0;padding:0 0 10px 0;font-size:2.3em}ul.questions p{margin:0;padding:0}ul.questions div.questionHead{white-space:normal}ul.questions div.questionHead:after{content:"";display:block;width:100px;height:2px;background:#ccc;margin:15px 0}ul.questions div.questionHead img{float:left;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;margin-right:15px;margin-bottom:15px}ul.answers.noImages li{float:none;width:auto;padding:0;border-bottom:2px solid rgba(0,0,0,.1);-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px}ul.answers.noImages li.wasHit{border-bottom:2px solid rgb(255, 203, 0)}ul.answers.noImages li .noImg h4{padding:5px 0;background:0 0;text-align:left}ul.answers.noImages li .noImg:before{content:'\203A';float:right;font-size:2em;opacity:.5}ul.answers li div.media{position:relative;width:100%;padding:0;background-position:center;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover;background-color:transparent;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;overflow:hidden;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}ul.answers.hasImages li div.media img{width:100%;height:auto;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px}ul.answers.hasImages li.wasHit .media:before{content:"";position:absolute;width:100%;height:100%;top:0;left:0;background:rgb(255, 203, 0);-webkit-border-radius:8px;-moz-border-radius:8px;border-radius:8px;opacity:.5}ul.answers li{position:relative}ul.answers li h4{position:absolute;bottom:0;margin:0;padding:15px;width:100%;font-weight:400;font-size:1.2em;text-align:center;-webkit-hyphens:auto;-moz-hyphens:auto;-ms-hyphens:auto;hyphens:auto;-webkit-border-bottom-left-radius:5px;-moz-border-radius-bottomleft:5px;border-bottom-left-radius:5px;-webkit-border-bottom-right-radius:5px;-moz-border-radius-bottomright:5px;border-bottom-right-radius:5px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;background:#000;background:rgba(0,0,0,.5);background:-webkit-gradient(linear,left bottom,left top,from(rgba(0,0,0,.8)),to(rgba(0,0,0,0)));background:-webkit-linear-gradient(bottom,rgba(0,0,0,.8),rgba(0,0,0,0));background:-moz-linear-gradient(bottom,rgba(0,0,0,.8),rgba(0,0,0,0));background:-o-linear-gradient(bottom,rgba(0,0,0,.8),rgba(0,0,0,0));background:linear-gradient(to top,rgba(0,0,0,.8),rgba(0,0,0,0));color:#fff;z-index:2}ul.answers li .imgWrap{display:block;width:100%;height:345px;background-position:center;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover}ul.answers li h4.noTitle{background:0 0}ul.answers li .noImg h4{position:relative;background:rgba(0,0,0,.1);-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;color:rgb(13, 41, 62)}ul.answers li .noImg .imgWrap{display:none}ul.answers li .noImg img{height:30px;opacity:0}ul.answers li{-webkit-transition:opacity .25s ease,-webkit-transform .25s cubic-bezier(.54,1.46,1,.9);transition:opacity .25s ease,-webkit-transform .25s cubic-bezier(.54,1.46,1,.9);-o-transition:opacity .25s ease,-o-transform .25s cubic-bezier(.54,1.46,1,.9);-moz-transition:transform .25s cubic-bezier(.54,1.46,1,.9),opacity .25s ease,-moz-transform .25s cubic-bezier(.54,1.46,1,.9);transition:transform .25s cubic-bezier(.54,1.46,1,.9),opacity .25s ease;transition:transform .25s cubic-bezier(.54,1.46,1,.9),opacity .25s ease,-webkit-transform .25s cubic-bezier(.54,1.46,1,.9),-moz-transform .25s cubic-bezier(.54,1.46,1,.9),-o-transform .25s cubic-bezier(.54,1.46,1,.9)}ul.answers li:hover{opacity:.9;-webkit-transform:translate(0,-2px);-moz-transform:translate(0,-2px);-ms-transform:translate(0,-2px);-o-transform:translate(0,-2px);transform:translate(0,-2px)}ul.answers.hasImages li h4{padding:30px 15px 15px 15px}ul.answers.hasImages li .noImg h4{padding:15px}li.question{-webkit-animation-duration:.3s;-moz-animation-duration:.3s;-o-animation-duration:.3s;animation-duration:.3s;-webkit-animation-fill-mode:forwards;-moz-animation-fill-mode:forwards;-o-animation-fill-mode:forwards;animation-fill-mode:forwards;-webkit-animation-timing-function:cubic-bezier(.12,.78,.41,1);-moz-animation-timing-function:cubic-bezier(.12,.78,.41,1);-o-animation-timing-function:cubic-bezier(.12,.78,.41,1);animation-timing-function:cubic-bezier(.12,.78,.41,1)}li.question.animateIn{-webkit-animation-name:animationFromRight;-moz-animation-name:animationFromRight;-o-animation-name:animationFromRight;animation-name:animationFromRight}li.question.animateIn.backwards{-webkit-animation-name:animationFromLeft;-moz-animation-name:animationFromLeft;-o-animation-name:animationFromLeft;animation-name:animationFromLeft}li.question.animateOut{-webkit-animation-name:animationToLeft;-moz-animation-name:animationToLeft;-o-animation-name:animationToLeft;animation-name:animationToLeft}li.question.animateOut.backwards{-webkit-animation-name:animationToRight;-moz-animation-name:animationToRight;-o-animation-name:animationToRight;animation-name:animationToRight}ul.social{display:block;width:100%;margin:0;padding:0;list-style-type:none;text-align:center}ul.social li{width:10%;max-width:50px;padding:2.5%;margin:0;display:inline-block;cursor:pointer}ul.social li svg{fill:rgb(13, 41, 62);opacity:.5;-webkit-transition:fill .25s linear,opacity .25s linear;-o-transition:fill .25s linear,opacity .25s linear;-moz-transition:fill .25s linear,opacity .25s linear;transition:fill .25s linear,opacity .25s linear}ul.social li.facebook:hover svg{fill:#3f5ba0;opacity:1}ul.social li.twitter:hover svg{fill:#75cff5;opacity:1}ul.social li.pinterest:hover svg{fill:#B9031D;opacity:1}ul.social li.googleplus:hover svg{fill:#CE3530;opacity:1}#grade,#points,#score{font-size:5em;line-height:1em}#learnableBox{position:fixed;width:100%;height:100%;top:0;left:0;background:#fff;background:rgba(255,255,255,.7);-webkit-backdrop-filter:blur(5px);z-index:-2;opacity:0;-webkit-transition:opacity .5s ease;-o-transition:opacity .5s ease;-moz-transition:opacity .5s ease;transition:opacity .5s ease}#learnableBox #learnable{position:relative;padding:15px;margin:0 auto;max-width:600px;top:50%;background-color:#fff;background-color:#ffffff;-webkit-box-shadow:0 2px 5px #ccc;-moz-box-shadow:0 2px 5px #ccc;box-shadow:0 2px 5px #ccc;-webkit-box-shadow:0 2px 5px rgba(0,0,0,.15);-moz-box-shadow:0 2px 5px rgba(0,0,0,.15);box-shadow:0 2px 5px rgba(0,0,0,.15);text-align:center;-webkit-transform:translate(0,0);-moz-transform:translate(0,0);-ms-transform:translate(0,0);-o-transform:translate(0,0);transform:translate(0,0);-webkit-transition:-webkit-transform .5s ease;transition:-webkit-transform .5s ease;-o-transition:-o-transform .5s ease;-moz-transition:transform .5s ease,-moz-transform .5s ease;transition:transform .5s ease;transition:transform .5s ease,-webkit-transform .5s ease,-moz-transform .5s ease,-o-transform .5s ease}#learnable img{max-width:100%}#learnableBox.visible #learnable{-webkit-transform:translate(0,-50%);-moz-transform:translate(0,-50%);-ms-transform:translate(0,-50%);-o-transform:translate(0,-50%);transform:translate(0,-50%)}#learnableBox.visible{z-index:1;opacity:1}div.bannerHolder{position:absolute;top:0;left:0;width:100%}.bannerBlock{width:auto;height:auto;text-align:center}.bannerBlock div{margin:0 auto}.bannerBlock.top{position:relative;display:inline-block;margin:20px 0;width:100%}.bannerBlock.left{float:left;width:300px;margin-left:20px;margin-top:15px}.bannerBlock.right{float:right;width:300px;margin-right:20px;margin-top:15px}.noTopBanner .bannerBlock.left,.noTopBanner .bannerBlock.right{margin-top:45px}.bannerBlock.bottom{position:relative;margin:20px 0;width:100%}.bannerHolder div.midSpace{width:2px;float:left}@media screen and (max-width:1650px){body.showingQuestions .bannerBlock.left,body.showingQuestions .bannerBlock.right{display:none}}@media screen and (max-width:1260px){body{padding-bottom:300px}.bannerBlock.left,.bannerBlock.right{float:none;width:300px;margin-right:20px;margin-top:15px;position:absolute;bottom:-250px;left:50%;margin-left:-150px}body.showingQuestions .bannerBlock.left,body.showingQuestions .bannerBlock.right{display:block}}@media screen and (max-width:1000px){ul.answers li .imgWrap{height:34.5vw}}@media screen and (max-width:800px){ul.questions h3{font-size:1.6em}ul.answers li h4{font-size:1em}}@-webkit-keyframes animationFromTop{0%{-webkit-transform:translate(0,-40px);transform:translate(0,-40px);opacity:0}100%{-webkit-transform:translate(0,0);transform:translate(0,0);opacity:1}}@-moz-keyframes animationFromTop{0%{-moz-transform:translate(0,-40px);transform:translate(0,-40px);opacity:0}100%{-moz-transform:translate(0,0);transform:translate(0,0);opacity:1}}@-o-keyframes animationFromTop{0%{-o-transform:translate(0,-40px);transform:translate(0,-40px);opacity:0}100%{-o-transform:translate(0,0);transform:translate(0,0);opacity:1}}@keyframes animationFromTop{0%{-webkit-transform:translate(0,-40px);-moz-transform:translate(0,-40px);-o-transform:translate(0,-40px);transform:translate(0,-40px);opacity:0}100%{-webkit-transform:translate(0,0);-moz-transform:translate(0,0);-o-transform:translate(0,0);transform:translate(0,0);opacity:1}}@-webkit-keyframes animationToTop{0%{-webkit-transform:translate(0,0);transform:translate(0,0);opacity:1}100%{-webkit-transform:translate(0,-40px);transform:translate(0,-40px);opacity:0}}@-moz-keyframes animationToTop{0%{-moz-transform:translate(0,0);transform:translate(0,0);opacity:1}100%{-moz-transform:translate(0,-40px);transform:translate(0,-40px);opacity:0}}@-o-keyframes animationToTop{0%{-o-transform:translate(0,0);transform:translate(0,0);opacity:1}100%{-o-transform:translate(0,-40px);transform:translate(0,-40px);opacity:0}}@keyframes animationToTop{0%{-webkit-transform:translate(0,0);-moz-transform:translate(0,0);-o-transform:translate(0,0);transform:translate(0,0);opacity:1}100%{-webkit-transform:translate(0,-40px);-moz-transform:translate(0,-40px);-o-transform:translate(0,-40px);transform:translate(0,-40px);opacity:0}}@-webkit-keyframes animationFromBottom{0%{-webkit-transform:translate(0,40px);transform:translate(0,40px);opacity:0}100%{-webkit-transform:translate(0,0);transform:translate(0,0);opacity:1}}@-moz-keyframes animationFromBottom{0%{-moz-transform:translate(0,40px);transform:translate(0,40px);opacity:0}100%{-moz-transform:translate(0,0);transform:translate(0,0);opacity:1}}@-o-keyframes animationFromBottom{0%{-o-transform:translate(0,40px);transform:translate(0,40px);opacity:0}100%{-o-transform:translate(0,0);transform:translate(0,0);opacity:1}}@keyframes animationFromBottom{0%{-webkit-transform:translate(0,40px);-moz-transform:translate(0,40px);-o-transform:translate(0,40px);transform:translate(0,40px);opacity:0}100%{-webkit-transform:translate(0,0);-moz-transform:translate(0,0);-o-transform:translate(0,0);transform:translate(0,0);opacity:1}}@-webkit-keyframes animationToBottom{0%{-webkit-transform:translate(0,0);transform:translate(0,0);opacity:1}100%{-webkit-transform:translate(0,40px);transform:translate(0,40px);opacity:0}}@-moz-keyframes animationToBottom{0%{-moz-transform:translate(0,0);transform:translate(0,0);opacity:1}100%{-moz-transform:translate(0,40px);transform:translate(0,40px);opacity:0}}@-o-keyframes animationToBottom{0%{-o-transform:translate(0,0);transform:translate(0,0);opacity:1}100%{-o-transform:translate(0,40px);transform:translate(0,40px);opacity:0}}@keyframes animationToBottom{0%{-webkit-transform:translate(0,0);-moz-transform:translate(0,0);-o-transform:translate(0,0);transform:translate(0,0);opacity:1}100%{-webkit-transform:translate(0,40px);-moz-transform:translate(0,40px);-o-transform:translate(0,40px);transform:translate(0,40px);opacity:0}}@-webkit-keyframes animationFromLeft{0%{-webkit-transform:translate(-40px,0);transform:translate(-40px,0);opacity:0}100%{-webkit-transform:translate(0,0);transform:translate(0,0);opacity:1}}@-moz-keyframes animationFromLeft{0%{-moz-transform:translate(-40px,0);transform:translate(-40px,0);opacity:0}100%{-moz-transform:translate(0,0);transform:translate(0,0);opacity:1}}@-o-keyframes animationFromLeft{0%{-o-transform:translate(-40px,0);transform:translate(-40px,0);opacity:0}100%{-o-transform:translate(0,0);transform:translate(0,0);opacity:1}}@keyframes animationFromLeft{0%{-webkit-transform:translate(-40px,0);-moz-transform:translate(-40px,0);-o-transform:translate(-40px,0);transform:translate(-40px,0);opacity:0}100%{-webkit-transform:translate(0,0);-moz-transform:translate(0,0);-o-transform:translate(0,0);transform:translate(0,0);opacity:1}}@-webkit-keyframes animationToLeft{0%{-webkit-transform:translate(0,0);transform:translate(0,0);opacity:1}100%{-webkit-transform:translate(-40px,0);transform:translate(-40px,0);opacity:0}}@-moz-keyframes animationToLeft{0%{-moz-transform:translate(0,0);transform:translate(0,0);opacity:1}100%{-moz-transform:translate(-40px,0);transform:translate(-40px,0);opacity:0}}@-o-keyframes animationToLeft{0%{-o-transform:translate(0,0);transform:translate(0,0);opacity:1}100%{-o-transform:translate(-40px,0);transform:translate(-40px,0);opacity:0}}@keyframes animationToLeft{0%{-webkit-transform:translate(0,0);-moz-transform:translate(0,0);-o-transform:translate(0,0);transform:translate(0,0);opacity:1}100%{-webkit-transform:translate(-40px,0);-moz-transform:translate(-40px,0);-o-transform:translate(-40px,0);transform:translate(-40px,0);opacity:0}}@-webkit-keyframes animationFromRight{0%{-webkit-transform:translate(40px,0);transform:translate(40px,0);opacity:0}100%{-webkit-transform:translate(0,0);transform:translate(0,0);opacity:1}}@-moz-keyframes animationFromRight{0%{-moz-transform:translate(40px,0);transform:translate(40px,0);opacity:0}100%{-moz-transform:translate(0,0);transform:translate(0,0);opacity:1}}@-o-keyframes animationFromRight{0%{-o-transform:translate(40px,0);transform:translate(40px,0);opacity:0}100%{-o-transform:translate(0,0);transform:translate(0,0);opacity:1}}@keyframes animationFromRight{0%{-webkit-transform:translate(40px,0);-moz-transform:translate(40px,0);-o-transform:translate(40px,0);transform:translate(40px,0);opacity:0}100%{-webkit-transform:translate(0,0);-moz-transform:translate(0,0);-o-transform:translate(0,0);transform:translate(0,0);opacity:1}}@-webkit-keyframes animationToRight{0%{-webkit-transform:translate(0,0);transform:translate(0,0);opacity:1}100%{-webkit-transform:translate(40px,0);transform:translate(40px,0);opacity:0}}@-moz-keyframes animationToRight{0%{-moz-transform:translate(0,0);transform:translate(0,0);opacity:1}100%{-moz-transform:translate(40px,0);transform:translate(40px,0);opacity:0}}@-o-keyframes animationToRight{0%{-o-transform:translate(0,0);transform:translate(0,0);opacity:1}100%{-o-transform:translate(40px,0);transform:translate(40px,0);opacity:0}}@keyframes animationToRight{0%{-webkit-transform:translate(0,0);-moz-transform:translate(0,0);-o-transform:translate(0,0);transform:translate(0,0);opacity:1}100%{-webkit-transform:translate(40px,0);-moz-transform:translate(40px,0);-o-transform:translate(40px,0);transform:translate(40px,0);opacity:0}}@-webkit-keyframes animateNavIn{0%{-webkit-transform:translate(0,-110%);transform:translate(0,-110%)}100%{-webkit-transform:translate(0,0);transform:translate(0,0)}}@-moz-keyframes animateNavIn{0%{-moz-transform:translate(0,-110%);transform:translate(0,-110%)}100%{-moz-transform:translate(0,0);transform:translate(0,0)}}@-o-keyframes animateNavIn{0%{-o-transform:translate(0,-110%);transform:translate(0,-110%)}100%{-o-transform:translate(0,0);transform:translate(0,0)}}@keyframes animateNavIn{0%{-webkit-transform:translate(0,-110%);-moz-transform:translate(0,-110%);-o-transform:translate(0,-110%);transform:translate(0,-110%)}100%{-webkit-transform:translate(0,0);-moz-transform:translate(0,0);-o-transform:translate(0,0);transform:translate(0,0)}}@-webkit-keyframes animateNavOut{0%{-webkit-transform:translate(0,0);transform:translate(0,0)}100%{-webkit-transform:translate(0,-110%);transform:translate(0,-110%)}}@-moz-keyframes animateNavOut{0%{-moz-transform:translate(0,0);transform:translate(0,0)}100%{-moz-transform:translate(0,-110%);transform:translate(0,-110%)}}@-o-keyframes animateNavOut{0%{-o-transform:translate(0,0);transform:translate(0,0)}100%{-o-transform:translate(0,-110%);transform:translate(0,-110%)}}@keyframes animateNavOut{0%{-webkit-transform:translate(0,0);-moz-transform:translate(0,0);-o-transform:translate(0,0);transform:translate(0,0)}100%{-webkit-transform:translate(0,-110%);-moz-transform:translate(0,-110%);-o-transform:translate(0,-110%);transform:translate(0,-110%)}}@media screen and (max-width:630px){.framework h1{font-size:2.5em}ul.questions div.questionHead{text-align:center}ul.questions div.questionHead:after{margin:15px auto}ul.questions div.questionHead img{float:none;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;max-width:100%}#learnable button,.framework button{padding:0 25px;font-family:'Open Sans',sans-serif;line-height:40px;font-size:19px}}