/*.path-frontpage .dialog-off-canvas-main-canvas {
    padding-right: 0 !important;
}*/

/*Currcula*/
.para-curricula {
    /*padding-bottom: 10vw;*/
    padding-top: 0;
    margin-top: -100vh;
    background-color: #fff;
    z-index: 3;
    position: relative;
}

.para-curricula>.container {
    height: 450vh;
}

.para-curricula .para-desc {
    /*height: 200vh;*/
    display: flex;
    flex-direction: column;
}

.para-curricula .curricula-border {
    border-radius: 100%;
    margin: 0 auto;
    background-color: rgba(0, 38, 82, .4);
    width: 60vh;
    height: 60vh;
    transform: scale(0);
    /*position: relative;*/
    text-align: left;
    /*transition: .5s all ease-in-out;*/
    /*    -webkit-animation: reverseBounceScale .5s forwards ease-in-out;
    -o-animation: reverseBounceScale .5s forwards ease-in-out;
    animation: reverseBounceScale .5s forwards ease-in-out;*/
}

/*.para-curricula .para-body.aos-animate .curricula-border {
    width: 560px;
    height: 560px;
    -webkit-animation: bounceScale .5s forwards ease-in-out;
    -o-animation: bounceScale .5s forwards ease-in-out;
    animation: bounceScale .5s forwards ease-in-out;
}*/
.curricula-heading {
    display: flex;
    align-items: center;
}

.curricula-heading>img {
    margin-right: 1rem;
}

.curricula-image {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    overflow: hidden;
    width: 100%;
    height: 100%;
    border-radius: 100%;
    z-index: 2;
    text-align: center;
}

.curricula-image img {
    transform: translateY(40px);
}


.curricula-wrapper {
    position: absolute;
    border-radius: 5px;
    padding: 25px 45px;
    width: 465px;
    transition: .5s ease-out;
    opacity: 0;
}

#curricula-ontario {
    left: -450px;
    top: 35%;
    padding-right: 100px;
}

#curricula-ib {
    right: -450px;
    top: 13%;
    padding-left: 100px;
}

#curricula-cambridge {
    bottom: -330px;
    right: -220px;
}

.para-curricula .curricula-heading {
    transition-delay: 1s;
    transition: .5s all ease-in;
}

.para-curricula .list-arrow {
    transition-delay: 1.5s;
    transition: .5s all ease-in;
}

.para-curricula .para-desc .desc-wrapper .list-arrow>li {
    margin-top: 10px;
}

/*.para-curricula #curricula-ontario .curricula-heading,
.para-curricula #curricula-ontario .list-arrow {
    transform: translateX(-30px);
    opacity: 0;
}*/

/*.para-curricula #curricula-ib .curricula-heading,
.para-curricula #curricula-ib .list-arrow {
    transform: translateX(30px);
    opacity: 0;
}*/

.para-curricula.show-detail .curricula-wrapper {
    opacity: 1;
}


.para-curricula.show-detail #curricula-cambridge {
    bottom: -300px;
    right: -220px;
}

.para-curricula.show-detail #curricula-ontario {
    left: -360px;
}

.para-curricula.show-detail #curricula-ib {
    right: -360px;
}

.para-curricula.show-detail .curricula-heading,
.para-curricula.show-detail .list-arrow {
    transform: translateX(0);
    opacity: 1;
}

.subtle {
    position: absolute;
}

#subtle_a {
    top: 100vh;
    left: -100px;
}

#subtle_b {
    bottom: 0;
    right: -100px;
}

@media(min-width: 1200px) {
    .para-curricula .para-desc {
        position: sticky;
        top: 85px;
        height: calc(100vh - 85px);
        display: flex;
        align-items: center;
        justify-content: center;
    }
}

@media(max-width: 1199px) {
    .para-curricula {
        margin-top: 6rem;
        overflow: hidden;
    }

    .para-curricula>.container {
        height: auto;
    }

    .para-curricula .curricula-border {
        width: auto;
        height: auto;
        background-color: transparent;
        transform: scale(1);
    }

    .curricula-image {
        position: relative;
        margin-bottom: 3rem;
        border-radius: 100%;
        background-color: rgba(0, 38, 82, .4);
        padding-top: 70%;
        width: 70%;
    }

    .curricula-image>p {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

    .curricula-image img {
        width: 80%;
    }

    .curricula-wrapper {
        position: static;
        width: 100%;
        opacity: 1;
        margin-bottom: 30px;
    }

    #curricula-ontario,
    #curricula-ib {
        padding: 30px;
    }
}

/*Logo*/
.para-sisLogo .para-desc {
    height: 500vh;
}


.para-sisLogo .para-body {
    position: sticky;
    top: 85px;
    height: calc(100vh - 85px);
    display: flex;
    align-items: center;
    justify-content: center;
}

.para-sisLogo .para-body .desc-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
}

.para-sisLogo .para-body img {
    transform: scale(0) translate(-50%, -50%);
    position: absolute;
    left: 50%;
    top: 50%;
    transform-origin: left;
}

.para-sisLogo .para-body img.new-logo {
    opacity: 0;
}

/*Sustainable School*/
.bg-sustainable-schools {
    position: relative;
    padding-top: 250px !important;
    background-image: url('/sites/default/files/dev/new-campus-1.jpg');
    background-size: auto 120%;
    background-position: center;
    background-attachment: fixed;
    background-repeat: no-repeat;
    padding-bottom: 50vh;
}

.bg-sustainable-schools::before {
    content: "";
    display: block;
    position: absolute;
    top: -10vw;
    left: -13%;
    width: 120%;
    padding-top: 20%;
    background-image: url(/sites/default/files/dev/sustainability-cover.png);
    background-size: cover;
    z-index: 2;
    background-repeat: no-repeat;
    background-position: left bottom;
}

.bg-sustainable-schools .bg-overlay {
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 1);
    transition: .25s all ease-in;
}


.bg-sustainable-schools>.container {
    position: relative;
    z-index: 1;
}

.para-sustainable .para-title {
    font-size: 2.5rem;
    font-family: var(--futura-heavy);
    color: #fff;
    position: relative;
    z-index: 1;
    margin-bottom: 2rem;
}

.para-sustainable .para-sustainable-title {
    height: 50vh;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    color: #fff;
}

.para-sustainable .para-body {
    display: flex;
    justify-content: center;
    flex-direction: column;
    font-size: 2rem;
}

.school-wrapper {
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.school-wrapper:nth-child(odd) {
    margin-left: auto;
}

.school-wrapper img {
    border-radius: 100%;
    width: 300px;
    height: 300px;
    border: 8px solid var(--dark-blue);
}


.school-wrapper>div {
    position: sticky;
    top: calc(50vh - 85px);
    color: #fff;
    display: inline-flex;
    align-items: center;
    font-size: 1.5rem;
    text-align: left;
    font-weight: bold;
}

.school-wrapper>div>.school-desc {
    padding-left: 100px;

}

.school-wrapper>div>.school-desc>h2 {
    position: relative;
    display: inline-block;
}


.para-sustainable .para-title::after,
.school-wrapper>div>.school-desc>h2::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    transform: translate(-50%, -50%);
    width: 0;
    opacity: 0;
    height: 0;
    background-image: url(/sites/default/files/dev/stroke.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-color: transparent;
    background-position: center;
    z-index: -1;
    transition: .5s all ease-in-out;
    transition-delay: .5s;
}

.para-sustainable .para-sustainable-title.aos-animate .para-title::after,
.school-wrapper.aos-animate>div>.school-desc>h2::after {
    width: 140%;
    height: 180%;
    opacity: 1;
}

.school-wrapper>div>a {
    display: inline-block;
    position: sticky;
    top: calc(50vh - 85px);
    filter: drop-shadow(0 0 0 #fff);
    order: 0;
    flex: 0 0 300px;
}


.school-wrapper>div>a:hover {
    filter: drop-shadow(0 0 10px #fff);

}

.school-wrapper:nth-child(odd)>div>a {
    order: 1;
}

.school-wrapper:nth-child(odd)>div>.school-desc {
    padding-left: 0;
    padding-right: 100px;
    text-align: right;
}

.school-title {
    border-radius: 50px;
    padding: 1rem;
    font-weight: bold;
    text-transform: uppercase;
    position: absolute;
    right: -70px;
    top: 150px;
    font-size: 1rem;
    display: block;
}

.school-title a {
    color: #fff;
}

.school-title a:hover {
    text-decoration: none;
}

@media(max-width: 1199px) {

    .bg-sustainable-schools::before {
        left: 0;
        width: 100%;
    }

    .para-sustainable .para-sustainable-title {
        height: auto;
        margin-bottom: 6rem;
    }


    .school-wrapper {
        height: auto;
        margin-bottom: 4rem;
    }


    .school-wrapper>div {
        flex-direction: column;
        position: static;
    }

    .school-wrapper>div>a {
        position: static;
        margin-bottom: 4rem;
        order: initial !important;
        flex: auto;
    }

    .school-wrapper>div>.school-desc {
        padding-left: 0 !important;
        padding-right: 0 !important;
        text-align: center !important;
    }

}

@media(max-width: 575px) {
    .para-sustainable .para-title {
        font-size: 1.5rem;
    }

    .para-sustainable .para-body {
        font-size: 1rem;
    }

    .school-wrapper>div>.school-desc {
        font-size: 1rem;
    }

    .school-wrapper>div>.school-desc>h2 {
        font-size: 1.5rem;
    }

    .para-sustainable .para-sustainable-title.aos-animate .para-title::after,
    .school-wrapper.aos-animate>div>.school-desc>h2::after {
        width: 100%;
    }

    .school-wrapper>div>a {
        margin-bottom: 2rem;
    }

    .school-wrapper img {
        width: 150px;
        height: 150px;
    }

    .school-title {
        font-size: .875rem;
        position: static;
        transform: translateY(-20px);
    }
}

/*Worldwide Recognition*/
/*.para-worldwide>.container>.row {
    height: 300vh;
}*/

.para-worldwide>.container>.row>.col-12 {
    position: sticky;
    top: 85px;
    height: calc(100vh - 85px);
    /*    display: flex;
    align-items: center;
    flex-wrap: wrap;*/
    /*    position: sticky;
    top: 85px;
    height: calc(100vh - 85px);*/
    /*display: flex;*/
}


.para-worldwide .para-desc {
    width: 40%;
    height: 100%;
    left: 0;
    text-align: left;
    opacity: 0;
    visibility: hidden;
}

/*.para-worldwide .para-desc.aos-animate {
    opacity: 1;
    visibility: visible;
}*/

.para-worldwide .para-body {
    position: relative;
    height: 100%;
}

.para-worldwide .para-desc ul {
    padding-left: 0;
    list-style: none;
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
}

.para-worldwide .para-desc ul>li {
    /*
    opacity: 0;
    visibility: hidden;*/
    transform: translateY(calc(-50% + 10px));
    transition: .5s all ease-in-out;
    position: absolute;
    top: 0;
    width: 100%;
    position: absolute;
    top: 50%;
    padding-left: 0;
}

.para-worldwide .para-desc ul>li::before {
    content: normal;
}

.para-worldwide .para-desc ul>li.active {
    opacity: 1;
    visibility: visible;
    transform: translateY(calc(-50%));
}

.para-worldwide .para-viewReference {}

.para-worldwide .para-viewReference .views-element-container {
    /*    max-width: 100%;
    flex: 0 0 100%;*/
    position: absolute;
    /*width: calc(100% - 30px);*/
    height: 100%;
    top: 50%;
    left: 50%;
    transition: .5s all ease-in-out;
    text-align: center;
    display: flex;
    align-items: center;

    /*    padding-left: 15px;
    padding-right: 15px;
    margin-left: auto;*/
}

/*.para-worldwide .column-second .paragraph {
    width: 100%;
}*/
.para-worldwide .globe {
    position: relative;
    text-align: center;
    display: inline-block;
}

.para-worldwide .globe-base {
    padding-top: 100%;
    width: 40vw;
    background-color: #508CD5;
    border-radius: 0;
    transition: .5s all ease-in-out;
    margin: 0 auto;
}

.para-worldwide .globe-continent {
    position: absolute;
    top: 10%;
    display: block;
    width: 100%;
    height: 80%;
    transition: .5s left ease-in-out, .2s transform ease-out, .5s right ease-in-out;
    filter: drop-shadow(-8px 5px 10px rgba(0, 0, 0, .5));
}

.para-worldwide .globe-continent>img {
    width: auto;
    height: 100%;
}

.para-worldwide .left-continent {
    left: -20%;
    width: 40%;

}

.para-worldwide .right-continent {
    right: -20%;
    width: 70%;
}

/*.para-worldwide .globe-continent {
    z-index: 1;
    position: absolute;
    top: 0;
    left: 3%;
    display: block;
    width: 94%;
    height: 100%;
    margin: 0 auto;
    opacity: 0;
    transform: translateY(30px);
    transition: .5s opacity ease-in-out, .5s transform ease-in-out;
    transition-delay: unset;
    display: none;
}

.para-worldwide .globe-continent img {
    width: 100%;
    height: 100%;
    filter: drop-shadow(-3px 10px 5px rgba(0, 0, 0, .5));
}

.para-worldwide.aos-animate .globe-continent {
    opacity: 1;
    transform: translateY(0);
    transition-delay: 1s;
}*/


/*
.para-worldwide.aos-animate .view-countries .globe-base {
    -webkit-animation: bounceScale .5s forwards ease-in-out;
    -o-animation: bounceScale .5s forwards ease-in-out;
    animation: bounceScale .5s forwards ease-in-out;
}*/

.para-worldwide .view-countries {
    position: relative;
}

.para-worldwide .view-countries .view-content {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    z-index: 2;
    /*    background-image: url(/sites/default/files/dev/globe-continent.svg);
    background-size: 94%;
    background-repeat: no-repeat;
    background-position: center;
    filter: drop-shadow(-3px 10px 5px rgba(0, 0, 0, .5));*/
    /*opacity: 0;*/
    /*transform: translateY(30px);*/
    transition: opacity 1s ease-in-out .5s, .2s transform ease-out;
}

.para-worldwide.aos-animate .view-countries .view-content {
    /*opacity: 1;*/
    transform: translateY(0);
}

/*.para-worldwide .view-countries .view-footer {
    position: absolute;
    left: 50%;
    bottom: -3vw;
    transform: translateX(-50%);
    width: 100%;
    text-align: center;
    transition: opacity .5s ease-in-out;
}

.para-worldwide .view-countries .view-footer.show {
    opacity: 1;
    -webkit-animation: blinking 2s infinite ease-in-out;
    -o-animation: blinking 2s infinite ease-in-out;
    animation: blinking 2s infinite ease-in-out;

}*/


.para-worldwide .globe-marker {
    position: absolute;
    transform: translateY(0);
    transition: .2s ease-in;

}

.para-worldwide .globe-marker:hover {
    transform: translateY(-10px);
}

.para-worldwide .globe-marker>a {
    color: #fff;
    position: relative;
    font-size: 1vw;
}

.para-worldwide .globe-marker>a:hover {
    text-decoration: none;
}

.para-worldwide .globe-marker>a>span {
    opacity: 0;
    transition: .25s all ease-in;
    position: absolute;
    top: -2rem;
    transform: translateX(-50%);

}

.para-worldwide .globe-marker .description {
    position: absolute;
    left: -100%;
    bottom: -50px;
    white-space: nowrap;
    background-color: var(--orange);
    padding: .5rem;
    opacity: 0;
    transition: .25s all ease-in;
}

.para-worldwide .globe-marker .pointer {
    position: relative;
    line-height: 0;
}


.para-worldwide .globe-marker .pointer::before {
    content: "";
    height: 1vw;
    width: 1vw;
    border-radius: 100%;
    background-color: var(--orange);
    display: inline-block;
    position: absolute;
    left: 50%;
    transform: translateX(-50%) scale(0);
    top: 5vw;
    transition: .2s ease-in;
    transition-delay: .5s;
}

.para-worldwide .globe-marker .pointer::after {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 1px;
    height: 0;
    display: inline-block;
    background-color: var(--orange);
    transition: .2s ease-in;
    transition-delay: 1s;
}

.para-worldwide .globe-marker .pointer>span {
    background-color: rgba(245, 137, 6, .5);
    display: block;
    width: 4vw;
    height: 4vw;
    border-radius: 100%;
    position: absolute;
    left: 50%;
    top: 3.5vw;
    opacity: 0;
    transform: translateX(-50%) scale(0);
    transition: .25s ease-in;
}

.para-worldwide .view-content.active .globe-marker>a>span {
    opacity: 1;
    font-weight: bold;
    white-space: nowrap;
}

.para-worldwide .view-content.active .globe-marker .description {
    opacity: 1;
}

.para-worldwide .view-content.active .globe-marker .pointer::before {
    transform: translateX(-50%) scale(1);
}


.para-worldwide .view-content.active .globe-marker .pointer::after {
    height: 5vw;
}


.para-worldwide .view-content.active .globe-marker .pointer>span {
    transform: translateX(-50%) scale(1);
    -webkit-animation: pulsing 1s infinite linear;
    -o-animation: pulsing 1s infinite linear;
    animation: pulsing 1s infinite linear;
}

/*Canada*/
.para-worldwide #wwMarker_53 {
    top: 13%;
    left: 13%;
}

/*USA*/
.para-worldwide #wwMarker_54 {
    left: 8%;
    top: 24%;
}

/*South East Asia*/
.para-worldwide #wwMarker_55 {
    top: 38%;
    left: 90%;
}

/*Australasia*/
.para-worldwide #wwMarker_56 {
    top: 55%;
    left: 92%;
}

/*Europe*/
.para-worldwide #wwMarker_57 {
    top: 13%;
    left: 52%;
}

/*UK*/
.para-worldwide #wwMarker_58 {
    top: 18%;
    left: 40%;
}

/*India*/
.para-worldwide #wwMarker_60 {
    top: 34%;
    left: 82%;
}

/*East Asia*/
.para-worldwide #wwMarker_61 {
    top: 23%;
    left: 85%;
}

/*Middle East*/
.para-worldwide #wwMarker_62 {
    top: 30%;
    left: 68%;
}

/*Animation*/
/*@-webkit-keyframes bounceScale {
    0% {
        transform: scale(0);
    }

    80% {
        transform: scale(1.05);
    }

    100% {
        transform: scale(1);
    }
}

@-o-keyframes bounceScale {
    0% {
        transform: scale(0);
    }

    80% {
        transform: scale(1.05);
    }

    100% {
        transform: scale(1);
    }
}



@keyframes bounceScale {
    0% {
        transform: scale(0);
    }

    80% {
        transform: scale(1.05);
    }

    100% {
        transform: scale(1);
    }
}*/
@keyframes pulsing {
    0% {
        transform: translateX(-50%) scale(0);
        opacity: 0;
    }

    50% {
        transform: translateX(-50%) scale(1);
        opacity: 1;
    }

    100% {
        transform: translateX(-50%) scale(1.5);
        opacity: 0;
    }
}

@-webkit-keyframes pulsing {
    0% {
        transform: translateX(-50%) scale(0);
        opacity: 0;
    }

    50% {
        transform: translateX(-50%) scale(1);
        opacity: 1;
    }

    100% {
        transform: translateX(-50%) scale(1.5);
        opacity: 0;
    }
}

@-o-keyframes pulsing {
    0% {
        transform: translateX(-50%) scale(0);
        opacity: 0;
    }

    50% {
        transform: translateX(-50%) scale(1);
        opacity: 1;
    }

    100% {
        transform: translateX(-50%) scale(1.5);
        opacity: 0;
    }
}

@keyframes reverseBounceScale {
    0% {
        transform: scale(1);
    }

    80% {
        transform: scale(1.05);
    }

    100% {
        transform: scale(0);
    }
}

@-webkit-keyframes reverseBounceScale {
    0% {
        transform: scale(1);
    }

    80% {
        transform: scale(1.05);
    }

    100% {
        transform: scale(0);
    }
}

@-o-keyframes reverseBounceScale {
    0% {
        transform: scale(1);
    }

    80% {
        transform: scale(1.05);
    }

    100% {
        transform: scale(0);
    }
}


@-webkit-keyframes blinking {
    0% {
        opacity: 0;
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@-o-keyframes blinking {
    0% {
        opacity: 0;
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@keyframes blinking {
    0% {
        opacity: 0;
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

@media(max-width: 1199px) {
    .para-worldwide>.container>.row { height: auto !important; }
    .para-worldwide>.container>.row>.col-12 {
        position: unset;
        height: auto;
        margin-bottom: 3rem;
        flex-direction: column;
        display: flex;
    }

    .para-worldwide .para-desc {
        width: auto;
        opacity: 1;
        visibility: visible;
        margin-bottom: 3rem;
        text-align: center;
    }

    .para-worldwide .para-desc ul {
        position: static;
    }

    .para-worldwide .para-desc ul>li {
        position: static;
        transform: translateY(0);
    }

    .para-worldwide .para-viewReference .views-element-container {
        position: static;
        height: auto;
        justify-content: center;
        transform: translate(0) !important;
    }

    .para-worldwide .globe-base {
        width: 60vw;
        border-radius: 50%;
    }

    .para-worldwide .globe-marker>a {
        font-size: 1.5vw;
    }

    .para-worldwide .left-continent {
        left: 5%;
    }

    .para-worldwide .right-continent {
        right: 5%;
    }

    .para-worldwide .view-countries .view-content {
        transform: translateY(5%);
    }
}

@media(max-width: 575px) {

    .para-worldwide .globe-base {
        width: 80vw;
    }

    .para-worldwide .globe-marker>a {
        font-size: 2vw;
    }

    .para-worldwide .globe-marker .pointer::before {
        width: 2vw;
        height: 2vw;
    }
}

/*Recognitions*/
.para-recognition {
    background-color: #ededed;
}

/*Scholarship*/
.para-scholarship .para-title {
    color: #fff;
}

/*.para-scholarship .column-first .para-desc {
    font-family: var(--futura-heavy);
    text-align: center;
    transform: rotate(-15deg);
    padding: 3rem;
}

.para-scholarship .column-first .para-desc .desc-wrapper>p:first-child {
    background-color: #438FE3;
    margin: 0;
    font-size: var(--font-xl);
    padding: 1rem;
}

.para-scholarship .column-first .para-desc .desc-wrapper>p:last-child {
    background-color: var(--dark-blue);
    font-size: var(--font-l);
    padding: 1rem;
}*/