﻿body {
    width: 100%;
    background-color: rgb(255, 0, 0);
}

.btn-white-border {
    border-color: white !important;
    color: white !important;
/*    padding-left: 25px !important;
    padding-right: 25px !important;*/
}

    /*70
48
40
39
38
37
36
31
28
24
18
16

70 - h1
48 - h2
40 - h3
36 - h4
31 - h5
28 - h6
24*/

    body .menuPanel {
        background-color: transparent;
        padding-top: 1.2vw;
        padding-bottom: 1.4vw;
        border-style: none;
        box-shadow: none;
    }

        body .menuPanel.highlighted {
            background-color: rgba(0, 136, 255, 1);
            box-shadow: .1rem .125rem 1.25rem rgba(0, 0, 0,.5);
        }

    body main
    {
        padding-top: 140px;
    }

    body .container-fluid {
        max-width: 1020px;
        padding: 0px;
        margin-left: auto;
        margin-right: auto;
    }

    body .internal-container {
        max-width: 990px;
        margin-left: auto;
        margin-right: auto;
    }

h1 {
    font-size: 4.1vw;
}

h2 {
    font-size: 4vw;
}

h3 {
    font-size: 4vw;
}

h4 {
    font-size: 3.2vw;
}

h5 {
    font-size: 3.09vw;
}

h6 {
    font-size: 1.9vw;
}

.title1 {
    font-size: 1.8vw;
}

.title2 {
    font-size: 2.1vw;
}

.title12 {
    font-size: 1.2vw;
}

.title14 {
    font-size: 1.4vw;
}

.title16 {
    font-size: 1.6vw;
}

.title20 {
    font-size: 2vw;
}

.ctrlLang {
    padding: 0 !important;
}

.ddLanguage .dropdown-toggle {
    min-width: 10px;
}

.ddLanguage .dropdown-menu {
    min-width: 10px;
    border: none;
    border-radius: 1.8vw;
}

    .ddLanguage .dropdown-menu a {
        padding: 0.6vw;
        border-radius: 50% !important;
    }

.ddLanguage .btn {
    font-size: inherit !important;
    padding: 0.6vw;
    border-radius: 50% !important;
}

.ddLanguage .dropdown-item {
    font-size: inherit !important;
}

.pageLng {
    margin-bottom: -5px;
}

.appLng {
    margin-top: -5px;
}

    .appLng .ctrlLang {
        margin-left: -10px;
    }

.pageLng .ddLanguage .btn {
    color: rgb(255, 0, 0);
    background-color: rgb(255, 255, 255);
    font-size: 1.6vw !important;
}

.pageLng .ddLanguage .show > .btn-secondary.dropdown-toggle {
    color: rgb(255, 255, 255);
    background-color: rgb(255, 0, 0);
    border-color: rgb(255, 255, 255);
}

.pageLng .ddLanguage .dropdown-menu.show {
    color: rgb(255, 0, 0);
    background-color: rgb(255, 255, 255);
    /*font-size: 2vw;*/
    font-size: inherit;
}

    .pageLng .ddLanguage .dropdown-menu.show .dropdown-item {
        color: rgba(255, 0, 0,1);
        background-color: rgb(255, 255, 255);
    }

        .pageLng .ddLanguage .dropdown-menu.show .dropdown-item.active {
            color: rgb(255, 255, 255);
            background-color: rgb(255, 0, 0);
        }

        .pageLng .ddLanguage .dropdown-menu.show .dropdown-item:hover {
            color: rgb(255, 255, 255);
            background-color: rgb(255, 0, 0);
        }


.appLng .ddLanguage .btn {
    color: rgb(255, 255, 255);
    background-color: rgb(255, 0, 0);
    font-size: 1.2vw !important;
}

.appLng .ddLanguage .show > .btn-secondary.dropdown-toggle {
    color: rgb(255, 0, 0);
    background-color: rgb(255, 255, 255);
    border-color: rgb(255, 0, 0);
}

.appLng .ddLanguage .dropdown-menu.show {
    color: rgb(255, 0, 0);
    background-color: rgb(255, 255, 255);
    /*font-size: 1.4vw;*/
    font-size: inherit;
}

    .appLng .ddLanguage .dropdown-menu.show .dropdown-item {
        color: rgba(255, 0, 0,1);
        background-color: rgb(255, 255, 255);
    }

        .appLng .ddLanguage .dropdown-menu.show .dropdown-item.active {
            color: rgb(255, 255, 255);
            background-color: rgb(255, 0, 0);
        }

        .appLng .ddLanguage .dropdown-menu.show .dropdown-item:hover {
            color: rgb(255, 255, 255);
            background-color: rgb(255, 0, 0);
        }

body > footer section.links
{
    width: 100%;
    padding: 0;
    font-size: 1.8vw !important;
}
body > footer .banner {
    padding-left: 0;
    padding-right: 0;
    padding-top: 5vw;
    padding-bottom: 5vw;
}
    body > footer .banner img {
        width: 55%;
        padding-top: 0.75vw;
    }
body > footer .tradeMark {
    padding-top: 10px;
    font-size: 1.2vw !important;
}

body > header {
    background-color: rgba(0, 136, 255, 1);
    color: rgb(255, 255, 255);
    padding-top: 48px;
}

body header .logo {
    width: 100%;
    height: 5vw;
    background-image: url("../img/main/headerLogoTitle@2x.webp");
    background-repeat: no-repeat;
    background-position: left center;
    background-size: auto 100%;
}

body header .mainMenu {
    /*padding-left: calc(100% * 0.094);
        padding-right: calc(100% * 0.094);*/
    height: 100%;
}

    body header .mainMenu nav {
        background-color: transparent !important;
        color: rgb(255, 255, 255) !important;
        justify-content: flex-start;
    }

    body header .mainMenu .navbar-nav {
        margin-top: 1vw;
    }

    body header .mainMenu nav .nav-link {
        color: rgb(255, 255, 255) !important;
        padding: 0.8vw;
        font-size: 1.6vw;
        letter-spacing: 0.31pt;
    }



.AIeKidz .header {
    background-color: rgb(255, 0, 0);
    color: rgb(255, 255, 255);
    padding: 20px 0 5vw 0;
}



.AIeKidz .voiceAI {
    padding-top: 6vw;
    padding-bottom: 24vw;
    background-color: rgb(255, 0, 0);
    color: rgb(255, 255, 255);
}

    .AIeKidz .voiceAI.bgImage {
        background-image: url("../img/eKidzAI/main_image@2x.webp");
        background-repeat: no-repeat;
        background-position: left bottom;
        background-size: 42vw auto;
    }


.AIeKidz .futureAI {
    padding-top: 12vw;
    background-color: rgba(243, 83, 255, 1);
    color: rgb(255, 255, 255);
}

    .AIeKidz .futureAI img {
        margin-top: -30px;
    }



.AIeKidz .oneModel {
    padding-top: 8vw;
    padding-bottom: 3vw;
    background-color: rgba(0, 136, 255, 1);
    color: rgb(255, 255, 255);
    font-size: 1.8vw;
    font-weight: bold;
}

.AIeKidz .removeTopGap {
    margin-top: -5vw;
}

.AIeKidz .buildingWithAI {
    padding-top: 8vw;
    padding-bottom: 0;
    background-color: rgba(193, 247, 255, 1);
    color: rgba(0, 16, 71, 1);
    font-size: 1.8vw;
    font-weight: bold;
}

    .AIeKidz .buildingWithAI .btn-secondary.btnLink {
        border-color: rgba(0, 16, 71, 1) !important;
        color: rgba(0, 16, 71, 1) !important;
    }




.AIeKidz .peoplesBringIt {
    padding-top: 9vw;
    padding-bottom: 6vw;
    background-color: rgb(255, 255, 255);
    color: rgba(0, 16, 71, 1);
    font-size: 1.1vw;
}

    .AIeKidz .peoplesBringIt .people {
        padding-bottom: 15px;
    }
    .AIeKidz .peoplesBringIt h1 {
        padding-bottom: 3vw;
    }
    .AIeKidz .peoplesBringIt h6 {
        line-height: 1.3;
    }


.voiceAI .btnLink.btn-secondary,
.futureAI .btnLink.btn-secondary,
.oneModel .btnLink.btn-secondary,
.buildingWithAI .btnLink.btn-secondary {
    border-width: 2px;
    padding: 20px 48px;
    margin-top: 20px;
    margin-bottom: 20px;
}

.AIeKidz .peoplesBringIt .textMarginBottom {
    margin-bottom: 10px;
}


.imgLinkedIn {
    width: 30px;
    height: auto;
}

@media (min-width: 1020px) {
    body > footer section.links {
        font-size: calc(1.8vw - (100vw - 990px) * 0.018) !important;
    }
        body > footer section.links a {
            font-size: calc(1.8vw - (100vw - 990px) * 0.018) !important;
        }
    body > footer .tradeMark {
        font-size: calc(1.2vw - (100vw - 990px) * 0.012) !important;
    }

    body .menuPanel {
        padding-top: calc(1.2vw - (100vw - 990px) * 0.012) !important;
        padding-bottom: calc(1.4vw - (100vw - 990px) * 0.014) !important;
    }

    h1 {
        font-size: calc(4.1vw - (100vw - 990px) * 0.042);
        line-height: 1.2;
    }

    h2 {
        font-size: calc(4vw - (100vw - 990px) * 0.04);
        line-height: 1.3;
    }

    h3 {
        font-size: calc(4vw - (100vw - 990px) * 0.04);
    }

    h4 {
        font-size: calc(3.2vw - (100vw - 990px) * 0.032);
    }

    h5 {
        font-size: calc(3.09vw - (100vw - 990px) * 0.0309);
    }

    h6 {
        font-size: calc(1.9vw - (100vw - 990px) * 0.0239);
    }

    .title1 {
        font-size: calc(1.8vw - (100vw - 990px) * 0.018);
    }

    .title2 {
        font-size: calc(2.1vw - (100vw - 990px) * 0.021);
    }

    .title12 {
        font-size: calc(1.2vw - (100vw - 990px) * 0.012);
    }

    .title14 {
        font-size: calc(1.4vw - (100vw - 990px) * 0.014);
    }

    .title16 {
        font-size: calc(1.6vw - (100vw - 990px) * 0.016);
    }

    .title20 {
        font-size: calc(2vw - (100vw - 990px) * 0.02);
    }

    .header .languages label {
        padding-top: calc(1vw - (100vw - 990px) * 0.01);
        font-size: calc(1.8vw - (100vw - 990px) * 0.018) !important;
    }

    .pageLng .ctrlLang .btn {
        font-size: calc(1.6vw - (100vw - 990px) * 0.016) !important;
    }

    .appLng .ctrlLang .btn {
        font-size: calc(1.2vw - (100vw - 990px) * 0.012) !important;
    }

    .ddLanguage .btn {
        font-size: calc(1.8vw - (100vw - 990px) * 0.018) !important;
        padding: calc(1vw - (100vw - 990px) * 0.01);
        border-radius: calc(4vw - (100vw - 990px) * 0.04) !important;
    }

    .ddLanguage .dropdown-menu {
        border-radius: calc(2vw - (100vw - 990px) * 0.02) !important;
    }

        .ddLanguage .dropdown-menu a {
            padding: calc(0.6vw - (100vw - 990px) * 0.006);
            border-radius: calc(2vw - (100vw - 990px) * 0.02) !important;
        }

    body header .logo {
        height: calc(5vw - (100vw - 990px) * 0.05);
    }

    body header .mainMenu nav .nav-link {
        font-size: calc(1.6vw - (100vw - 990px) * 0.016);
    }

    body > footer .links {
        padding-left: 1.1vw;
        padding-right: 30vw;
    }

    .AIeKidz .header {
        padding-bottom: calc(4vw - (100vw - 990px) * 0.04);
    }


    .voiceAI .btnLink.btn-secondary,
    .futureAI .btnLink.btn-secondary,
    .oneModel .btnLink.btn-secondary,
    .buildingWithAI .btnLink.btn-secondary {
        font-size: 1.3vw;
        font-weight: 600;
    }
}

@media (max-width: 1024px) {

    .AIeKidz .voiceAI.bgImage {
        background-size: calc(38vw - (100vw - 990px) * 0.04);
        /*background-size: calc(40vw + (100vw - 40vw) * ((100vw - 596px) / 596)) auto;*/
    }
    .AIeKidz .voiceAI{
        padding-bottom: calc( 20vw + 44vw * (596px - 100vw) / 596 );
    }

    body .internal-container {
        margin-left: 5vw;
        margin-right: 5vw;
    }

    .ctrlEventWebinarPopup .content .labelMain {
        font-size: 1rem;
    }

    .ctrlEventWebinarPopup .btn-primary.btnLink {
        font-size: 0.75rem;
    }
}

@media (max-width: 992px) {
    body > footer section.links a {
        font-size: 1.8vw !important;
    } 
}

@media (max-width: 709.98px) {
    .awardBages {
        max-width: inherit;
            
        margin-bottom: 5rem;
    }

    body > footer section.links a {
        font-size: 1.8vw !important;
    }

    .voiceAI .btnLink.btn-secondary,
    .futureAI .btnLink.btn-secondary,
    .oneModel .btnLink.btn-secondary,
    .buildingWithAI .btnLink.btn-secondary {
        font-size: 2.4vw;
        padding: 15px 48px !important;
    }

    .AIeKidz .peoplesBringIt .textMarginBottom {
        margin-bottom: 30px;
    }
}

@media (max-width: 650px) {
    .AIeKidz .voiceAI {
        padding-top: 2vw;
        padding-bottom: 47vw;
        background-color: rgb(255, 0, 0);
        color: rgb(255, 255, 255);
    }

        .AIeKidz .voiceAI.bgImage {
            background-size: 66vw auto;
        }


    .AIeKidz .futureAI {
        padding-top: 15vw;
    }
    .AIeKidz .oneModel,
    .AIeKidz .buildingWithAI {
        padding-top: 10vw;
        _padding-bottom: 10vw;
    }
    .AIeKidz .peoplesBringIt {
        padding-top: 12vw;
    }



    .AIeKidz .futureAI img,
    .AIeKidz .oneModel img,
    .AIeKidz .buildingWithAI img
    {
        width: 100%;
    }

    .AIeKidz .peoplesBringIt .people {
        width: 90%;
    }
    

    body main {
        padding-top: 100px;
    }








}

@media (max-width: 568.98px) {
    body header .mainMenu {
        margin-top: -30px;
    }

    .AIeKidz .voiceAI.bgImage {
        background-size: 92vw auto;
    }
    .AIeKidz .voiceAI {
        padding-bottom: 64vw;
    }

    .AIeKidz .futureAI img {
        width: 100%;
    }

        body header .mainMenu .navbar-nav {
            margin-left: 0;
        }

    .ctrlEventWebinarPopup .content .labelMain {
        font-size: 0.85rem;
    }

    .ctrlEventWebinarPopup .btn-primary.btnLink {
        font-size: 0.7rem;
    }
}



/*@media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait), only screen and (min-device-width: 375px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait), only screen and (min-device-width: 375px) and (max-device-width: 812px) and (-webkit-min-device-pixel-ratio: 3) and (orientation: portrait) {*/
@media (max-width: 568.98px) {

    .awardBages {
        max-width: inherit;
        margin-bottom: 1rem;
    }

    .awardsDefaultRow {
        display: none;
    }

    .awardsHideResolutionRow {
        display: flex;
        _margin-right: 5px;
    }

        .awardsHideResolutionRow img {
            width: 100%;
        }

    body > footer .tradeMark {
        padding-top: 15px;
    }

    body .menuPanel {
        background-color: rgb(255, 0, 0);
        padding-top: 28px;
        padding-bottom: 2vw;
    }

    .pageLng .ddLanguage .btn {
        font-size: 3vw !important;
    }

    .appLng .ddLanguage .btn {
        font-size: 2.6vw !important;
    }


    body main {
        padding-top: 60px;
    }

    body .internal-container {
        margin-left: 7vw;
        margin-right: 7vw;
    }

    body header .mainMenu {
        padding-left: calc(100vw * 0.064);
        padding-top: calc(100vw * 0.022);
    }

        body header .mainMenu .navbar-nav {
            margin-left: 0;
            /*background-color: rgb(255, 0, 0);*/
        }

        body header .mainMenu nav .nav-link {
            color: rgb(255, 255, 255) !important;
            font-size: 3.4vw;
        }

    .btnLink.btn-secondary {
        font-size: 2.4vw;
    }
    .voiceAI .btnLink.btn-secondary,
    .futureAI .btnLink.btn-secondary,
    .oneModel .btnLink.btn-secondary,
    .buildingWithAI .btnLink.btn-secondary {
        font-size: 3.5vw;
    }

    h1 {
        font-size: 6vw;
    }

    h2 {
        font-size: 6vw;
    }

    h3 {
        font-size: 6vw;
    }

    h4 {
        font-size: 4.1vw;
    }

    h5 {
        font-size: 4vw;
    }

    h6 {
        font-size: 3.9vw;
    }

    .title1 {
        font-size: 1.8vw;
    }

    .title2 {
        font-size: 2.1vw;
    }

    .title12 {
        font-size: 2.6vw;
    }

    .title14 {
        font-size: 2.4vw;
    }

    .title16 {
        font-size: 3vw;
    }

    .title20 {
        font-size: 2.8vw;
    }

    .AIeKidz .header {
        padding: 20px 0 7vw 0;
    }

        .AIeKidz .header .btnLink.btn-secondary {
            font-size: 2.8vw;
            padding: 8px 16px;
        }
}
