/*
StarKids Website
@Author: IT Tick
@Author URI: http://www.it-tick.com/
@Version: 1.0.0
*/

/*
 * Table Of contents
 * 1.  General Styling
 * 2.  themes
 * 3.  menu
 * 4.  General-Sections
 * 5.  Footer
 * 6.  Secondary-Sections
 * 7.  Content Styling
 * 8.  Forms
 * 9.  Settings Page
 * 10. contacts page
 * 11. courses
 * 12. kids
 */

/*------------------------------
 * 	General Styling
 *-----------------------------*/
/* Regular Flat Font */

/* new style */
:root {
    --primary: #fe5d37;
    --light: #fff5f3;
    --dark: #103741;
    --second: #134abf;
    --homeColor: #198754;
    --contactColor: #fe5d37;
    --nurseryColor: #134abf;
    --cvColor: #6fbae7;
}

.btn {
    font-weight: 500;
    transition: 0.5s;
}

.btn.btn-primary {
    color: #ffffff;
}

.btn-square {
    width: 38px;
    height: 38px;
}

.btn-sm-square {
    width: 32px;
    height: 32px;
}

.btn-lg-square {
    width: 48px;
    height: 48px;
}

.btn-square,
.btn-sm-square,
.btn-lg-square {
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: normal;
    border-radius: 50px;
}

.font-secondary {
    font-family: "Lobster Two", cursive;
}

h1,
h2,
h3,
h4,
.h1,
.h2,
.h3,
.h4,
.display-1,
.display-2,
.display-3,
.display-4,
.display-5,
.display-6 {
    font-family: "Lobster Two", cursive;
    font-weight: 700;
}

/* navbar style */
.header .second-navbar.header-inner {
    position: absolute;
    top: 107px;
    left: 50%;
    transform: translate(-50%, 0);
    width: 90%;
    z-index: 99;
    background-color: #fff;
    transition-duration: 0.8s;
}

.header .second-navbar .nav-item .nav-link {
    display: block;
    line-height: 36px;
    text-transform: capitalize;
    font-weight: 800;
    color: #6d6b6b;
    transition: 0.15s;
    padding: 5px !important;
    margin-bottom: 0 !important;
}

.header .second-navbar .nav-item .nav-link:hover {
    color: #fe4066;
}

.header .navbar-scroll {
    background-color: #ffffff;
    padding: 0;
    position: fixed !important;
    top: 0 !important;
    z-index: 99;
    box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.4);
    transition-duration: 0.8s;
    width: 100% !important;
}

.header .navbar-scroll .header-btn {
    color: #ffffff;
    background-color: #fe4066;
}

.header .navbar-scroll .logo {
    color: #000;
    font-weight: 500;
}

.header .second-navbar .navbar-toggler {
    padding: 0;
}

.header .first-navbar.header-inner {
    position: absolute;
    background-color: var(--primary);
    top: 50px;
    left: 50%;
    transform: translate(-50%, 0);
    width: 90%;
    z-index: 99;
}

.header .first-navbar .nav-item .nav-link {
    display: block;
    line-height: 36px;
    text-transform: capitalize;
    font-size: 16px;
    font-weight: 500;
    color: #fff;
    transition: 0.15s;
}

.header .second-navbar .nav-item .nav-link:hover {
    color: var(--primary)
}

.header .btn.btn-social {
    margin-right: 5px;
    font-size: 15px;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 50%;
    transition: .3s;
}

/* .header .first-navbar .social-links a {
    font-size: 20px !important;
    color: #fff;
} */

.header .setting-links li a {
    margin: 0;
    padding: 0 10px;
}

.header .setting-links .pro-img {
    border-radius: 50%;
    width: 40px;
    height: 40px;
}

.header .nav-content-social ul li a {
    color: #fff;
}

.header .nav-content-social .setting-links li a {
    color: #fff !important;
}

@media only screen and (min-width: 1200px) {
    .header .nav-item>.nav-link {
        padding: 5px 20px !important;
        display: block !important;
    }
}

@media (min-width: 992px) {
    .header .mob-logo {
        display: none;
    }

    .header .des-logo {
        margin: 0 20px;
    }

    .header .margin-right-links {
        margin: 0 8px;
    }
}

@media only screen and (max-width: 992px) {
    .header .second-navbar.header-inner {
        background-color: white !important;
        top: 77px;
        width: 100% !important;
    }

    .header .first-navbar.header-inner {
        width: 100%;
        top: 25px;
    }

    .header .second-navbar .content-banner .first-title {
        font-size: 30px !important;
    }

    .header .des-logo {
        display: none;
    }

    .header .mob-logo {
        margin: 0 !important;
    }

    .header .first-navbar ul li a {
        font-size: 12px;
        padding: 0 5px;
    }

    .header .first-navbar ul li {
        padding: 0;
    }

    .header .first-navbar .social-links {
        display: none;
    }

    .header .first-navbar .container-fluid .container-fluid {
        padding: 0;
    }
}

@media (max-width: 300px) {
    .header .setting-links .pro-img {
        width: 30px;
        height: 30px;
    }

    .header .setting-links li a {
        margin: 0;
        padding: 0 4px !important;
        font-size: 11px !important;
    }
}

/* end navbar style */
/* home page colors */
.blue-theme.home .header .second-navbar .nav-item .nav-link:hover {
    color: var(--homeColor)
}

.blue-theme.home .header .first-navbar.header-inner {
    background-color: var(--homeColor);
}

.blue-theme.home .section-title h1.section-title-h1 {
    color: var(--homeColor);
}

.blue-theme.home .section-title p::after {
    background: var(--homeColor);
}

.blue-theme.home .contact .php-email-form button[type=submit] {
    background: #22b972;
}

.blue-theme.home .contact .php-email-form button[type=submit]:hover {
    background: #22b972;
}

.blue-theme.home .contact .info .social-links a:hover {
    background: var(--homeColor);
}

.blue-theme.home .contact .info .email:hover i,
.blue-theme.home .contact .info .address:hover i,
.blue-theme.home .contact .info .phone:hover i {
    background: var(--homeColor);
}

.blue-theme.home .contact .php-email-form {
    border-top: 3px solid var(--homeColor);
    border-bottom: 3px solid var(--homeColor);
}

.blue-theme.home .contact .info {
    border-top: 3px solid var(--homeColor);
    border-bottom: 3px solid var(--homeColor);
}

.blue-theme.home .contact .info i {
    color: var(--homeColor);
}

/* work with us page colors */
.cv-page .header .second-navbar .nav-item .nav-link:hover {
    color: var(--cvColor)
}

.cv-page .header .first-navbar.header-inner {
    background-color: var(--cvColor);
}

.cv-page .header .second-navbar.header-inner{
    border-bottom: 1px solid var(--cvColor);
}

.cv-page .section-title h1.section-title-h1 {
    color: var(--cvColor);
}

.cv-page .section-title p::after {
    background: var(--cvColor);
}

.cv-page .contact .php-email-form button[type=submit] {
    background: #22b972;
}

.cv-page .contact .php-email-form button[type=submit]:hover {
    background: #22b972;
}

.cv-page .contact .info .social-links a:hover {
    background: var(--cvColor);
}

.cv-page .contact .info .email:hover i,
.cv-page .contact .info .address:hover i,
.cv-page .contact .info .phone:hover i {
    background: var(--cvColor);
}

.cv-page .contact .php-email-form {
    border-top: 3px solid var(--cvColor);
    border-bottom: 3px solid var(--cvColor);
}

.cv-page .contact .info {
    border-top: 3px solid var(--cvColor);
    border-bottom: 3px solid var(--cvColor);
}

.cv-page .contact .info i {
    color: var(--cvColor);
}

.cv-page .btn-cv{
    background-color: var(--cvColor) !important;
    color: #fff;
}
.cv-page .btn-cv:hover{
    background-color: #54aee6 !important;
}
.cv-bgcolor{
    background-color: #54aee6 !important;
}
.cv-color{
    color: #54aee6 !important;
}

/* contact page colors */
.blue-theme.contact-page .header .first-navbar.header-inner {
    background-color: var(--contactColor);
}

.blue-theme.contact-page .header .second-navbar .nav-item .nav-link:hover {
    color: var(--contactColor)
}

.blue-theme.contact-page .section-title h1.section-title-h1 {
    color: var(--contactColor);
}

.blue-theme.contact-page .section-title p::after {
    background: var(--contactColor);
}

.blue-theme.contact-page .contact .php-email-form button[type=submit] {
    background: var(--contactColor);
}

.blue-theme.contact-page .contact .php-email-form button[type=submit]:hover {
    background: #f35d3c;
}

.blue-theme.contact-page .contact .php-email-form button[type=submit]:hover {
    background: #f35d3c;
}

.blue-theme.contact-page .contact .info .social-links a:hover {
    background: var(--contactColor);
}

.blue-theme.contact-page .contact .info .email:hover i,
.blue-theme.contact-page .contact .info .address:hover i,
.blue-theme.contact-page .contact .info .phone:hover i {
    background: var(--contactColor) !important;
}

.blue-theme.contact-page .contact .php-email-form {
    border-top: 3px solid var(--contactColor);
    border-bottom: 3px solid var(--contactColor);
}

.blue-theme.contact-page .contact .info {
    border-top: 3px solid var(--contactColor);
    border-bottom: 3px solid var(--contactColor);
}

.blue-theme.contact-page .contact .info i {
    color: var(--contactColor);
}

/* nursery page colors */
.pink-theme.nursery .header .first-navbar.header-inner {
    background-color: var(--nurseryColor);
}

.pink-theme.nursery .header .second-navbar .nav-item .nav-link:hover {
    color: var(--nurseryColor)
}

/* end colors for pages */
.section-title {
    text-align: center;
    padding-bottom: 30px;
}

.section-title h1.section-title-h1 {
    padding-bottom: 0;
    margin: 15px 0;
}

.section-title p {
    padding-bottom: 15px;
    margin: 15px 0;
    position: relative;
    font-size: 25px;
    font-weight: 700;
    color: #4e4039;
}

.section-title p::after {
    content: "";
    position: absolute;
    display: block;
    width: 60px;
    height: 2px;
    bottom: 0;
    left: calc(50% - 30px);
}

/* nursery page */
.nursery-page .header-carousel::before,
.nursery-page .header-carousel::after {
    position: absolute;
    content: "";
    width: 100%;
    height: 10px;
    top: 0;
    left: 0;
    background: url(../libs/images/bg-header-top.png) center center repeat-x;
    z-index: 1;
}

.nursery-page .header-carousel::after {
    height: 19px;
    top: auto;
    bottom: 0;
    background: url(../libs/images/bg-header-bottom.png) center center repeat-x;
}

@media (max-width: 768px) {
    .nursery-page .header-carousel .owl-carousel-item {
        position: relative;
        min-height: 500px;
    }

    .nursery-page .header-carousel .owl-carousel-item img {
        position: absolute;
        width: 100%;
        height: 100%;
    }

    .nursery-page .header-carousel .owl-carousel-item p {
        font-size: 16px !important;
        font-weight: 400 !important;
    }

    .nursery-page .header-carousel .owl-carousel-item h1 {
        font-size: 30px;
        font-weight: 600;
    }
}

.nursery-page .header-carousel .owl-nav {
    position: absolute;
    top: 50%;
    right: 8%;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;
}

.nursery-page .header-carousel .owl-nav .owl-prev,
.nursery-page .header-carousel .owl-nav .owl-next {
    margin: 7px 0;
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF !important;
    background: transparent;
    border: 3px solid #FFFFFF !important;
    border-radius: 45px;
    font-size: 22px !important;
    transition: .5s;
}

.nursery-page .header-carousel .owl-nav .owl-prev:hover,
.nursery-page .header-carousel .owl-nav .owl-next:hover {
    background: var(--nurseryColor) !important;
}

.nursery-page .facility-item .facility-icon {
    position: relative;
    margin: 0 auto;
    width: 100px;
    height: 100px;
    border-radius: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.nursery-page .facility-item .facility-icon::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(255, 255, 255, .9);
    transition: .5s;
    z-index: 1;
}

.nursery-page .facility-item .facility-icon span {
    position: absolute;
    content: "";
    width: 15px;
    height: 30px;
    top: 0;
    left: 0;
    border-radius: 50%;
}

.nursery-page .facility-item .facility-icon span:last-child {
    left: auto;
    right: 0;
}

.nursery-page .facility-item .facility-icon i {
    position: relative;
    z-index: 2;
}

.nursery-page .facility-item .facility-text {
    position: relative;
    min-height: 250px;
    padding: 30px;
    border-radius: 100%;
    display: flex;
    text-align: center;
    justify-content: center;
    flex-direction: column;
}

.nursery-page .facility-item .facility-text::before {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(255, 255, 255, .9);
    transition: .5s;
    z-index: 1;
}

.nursery-page .facility-item .facility-text * {
    position: relative;
    z-index: 2;
}

.nursery-page .facility-item:hover .facility-icon::before,
.nursery-page .facility-item:hover .facility-text::before {
    background: transparent;
}

.nursery-page .facility-item * {
    transition: .5s;
}

.nursery-page .facility-item:hover * {
    color: #FFFFFF !important;
}

.nursery-page .about-img img {
    transition: .5s;
}

.nursery-page .about-img img:hover {
    background: var(--second) !important;
}

/* end nursery page */
/* tail page */
.form-data {
    width: 100%;
    margin-bottom: 10px
}

.main-heading {
    font-size: 30px
}

.form-data label {
    font-size: 13px;
    margin-left: 2px
}

.form-data input {
    height: 50px;
    border: 2px solid #eee;
    transition: all 1s;
    border-radius: 5px
}

.form-data input:focus {
    outline: none;
    border: 2px solid #000;
    box-shadow: none
}

.forgot-text {
    color: red
}

.signin-btn .btn {
    width: 100%;
    height: 46px;
    margin-top: 10px
}

/* .footer .btn.btn-social:hover {
    border-color: var(--primary);
    background: var(--primary);
} */

.footer .btn.btn-social {
    margin-right: 5px;
    font-size: 30px;
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FFFFFF;
    border: 1px solid rgba(255, 255, 255, 0.5);
    border-radius: 50%;
    transition: .3s;
}

.footer .form-control {
    border-color: rgba(255, 255, 255, 0.5);
}

.footer .copyright {
    padding: 25px 0;
    font-size: 15px;
    border-top: 1px solid rgba(256, 256, 256, .1);
}

.footer .copyright a {
    color: #FFFFFF;
    text-decoration: none;
}

.footer .footer-menu a {
    margin-right: 15px;
    padding-right: 15px;
    border-right: 1px solid rgba(255, 255, 255, .1);
}

.footer .copyright a:hover,
.footer .footer-menu a:hover {
    color: var(--primary) !important;
}

.footer .footer-menu a:last-child {
    margin-right: 0;
    padding-right: 0;
    border-right: none;
}

.footer .social-footer img {
    width: 400px;
}

@media (max-width: 600px) {
    .footer .social-footer img {
        width: 250px;
    }

    .footer .btn.btn-social {
        font-size: 20px;
        width: 50px;
        height: 50px;
    }
}

@media (max-width: 300px) {
    .footer .social-footer img {
        width: 200px;
    }

    .footer .btn.btn-social {
        font-size: 15px;
        width: 40px;
        height: 40px;
    }
}

/* end tail page */
/* contact page */
.contact .info {
    padding: 30px;
    background: #fff;
    width: 100%;
    box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.12);
}

.contact label {
    color: #333;
}

.contact .info i {
    font-size: 20px;
    float: left;
    width: 44px;
    height: 44px;
    background: #fdf1ec;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50px;
    transition: all 0.3s ease-in-out;
}

.contact .info h4 {
    padding: 0 0 0 60px;
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 5px;
    color: #7a6960;
}

.contact .info p {
    padding: 0 0 10px 60px;
    margin-bottom: 20px;
    font-size: 16px;
    color: #ab9d95;
}

.contact .info a {
    padding: 0;
    padding: 0 0 10px 30px;
    margin-bottom: 20px;
    font-size: 16px;
    color: #ab9d95;
    text-decoration: none;

}

.contact .info a:hover {
    text-decoration: underline;
    color: blue;
}

.contact .info .email p {
    padding-top: 5px;
}

.contact .info .social-links {
    padding-left: 60px;
}

.contact .info .social-links a {
    font-size: 18px;
    display: inline-block;
    background: #333;
    color: #fff;
    line-height: 1;
    padding: 8px 0;
    border-radius: 50%;
    text-align: center;
    width: 36px;
    height: 36px;
    transition: 0.3s;
    margin-right: 10px;
}

.contact .info .social-links a:hover {
    color: #fff;
}

.contact .info .email:hover i,
.contact .info .address:hover i,
.contact .info .phone:hover i {
    color: #fff;
}

.contact .php-email-form {
    width: 100%;
    padding: 30px;
    background: #fff;
    box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.12);
    margin: 0;
}

.contact .php-email-form .form-group {
    padding-bottom: 8px;
}

.contact .php-email-form .error-message br+br {
    margin-top: 25px;
}

.contact .php-email-form input,
.contact .php-email-form textarea {
    border-radius: 0;
    box-shadow: none;
    font-size: 14px;
}

.contact .php-email-form input {
    height: 44px;
}

.contact .php-email-form textarea {
    padding: 10px 12px;
}

.contact .php-email-form button[type=submit] {
    border: 0;
    padding: 10px 24px;
    color: #fff;
    transition: 0.4s;
    border-radius: 4px;
}

@-webkit-keyframes animate-loading {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

@keyframes animate-loading {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.contact .msg {
    font-size: 14px;
}

/* end contact page */
/* end new style */
@import url("https://www.w3schools.com/w3css/4/w3.css");

@font-face {
    font-family: "JF Flat Regular";
    src: url("./fonts/JF-Flat-regular.eot");
    src: url("./fonts/JF-Flat-regular.eot?#iefix") format("embedded-opentype"),
        url("./fonts/JF-Flat-regular.svg#JF Flat Regular") format("svg"),
        url("./fonts/JF-Flat-regular.woff") format("woff"),
        url("./fonts/JF-Flat-regular.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}

/* --------------------- loading --------------- */
#spinner {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.5s ease-out, visibility 0s linear 0.5s;
    z-index: 99999;
}

#spinner.show {
    transition: opacity 0.5s ease-out, visibility 0s linear 0s;
    visibility: visible;
    opacity: 1;
}

.bootstrap-datetimepicker-widget table {
    direction: ltr;
}

/* --------------------- end loading ---------------  */

body {
    background-color: #fff;
    font-family: "JF Flat Regular";
    font-size: 20px;
    font-weight: normal;
    font-style: normal;
    overflow-x: hidden;
    direction: rtl;
    margin: 0;
}



ul,
ol {
    padding: 0;
}

.form-control {
    color: #666;
}

.ytp-watermark {
    display: none !important;
}

h1.section-head {
    font-size: 45px;
    margin-top: 0;
    margin-bottom: 20px;
}

.centered {
    text-align: center;
}

.pad-bot {
    padding-bottom: 20px;
}

h1.section-head.centered-head {
    text-align: center;
}

svg.section-border {
    display: block;
    width: 100%;
    height: 100px;
    background: transparent;
}

@media (max-width: 992px) {
    .sm-disappear {
        display: none;
    }
}

@media (max-width: 767px) {
    .xs-disappear {
        display: none;
    }

    .xs-center {
        text-align: center;
    }
}

@media (max-width: 350px) {
    .xxs-disappear {
        display: none;
    }

    .xxs-center {
        text-align: center;
    }

    .xxs-block {
        display: block;
        width: 100%;
    }
}

/*fancyBox*/
.row.fancy-box {
    margin: 0;
}

@media (max-width: 767px) {
    .row.fancy-box {
        font-size: 14px;
    }
}

#fancy-magnifier {
    text-align: center;
}

a.fancybox.magnifier span {
    display: none;
}

.fancy-box {
    margin: 0;
}

/* section separator */
.section-separator {
    position: relative;
    margin: 30px 0 20px;
}

.section-separator .sep-title {
    position: relative;
    z-index: 10;
    background-color: #fff;
    font-size: 24px;
    display: inline-block;
    padding-left: 10px;
}

.section-separator hr.sep {
    position: absolute;
    width: 100%;
    top: 25%;
    z-index: 5;
    border-top: 2px solid #ccc;
}

.section-separator hr.sep:after {
    content: "☆";
    display: inline-block;
    position: absolute;
    top: -32px;
    left: 10%;
    padding: 0 3px;
    background: #fff;
    color: #666;
    font-size: 40px;
}

/*------------------------------
 * 	themes
 *-----------------------------*/
.call-to-action.cta-styled a,
.call-to-action.cta-styled a:hover,
.call-to-action.cta-styled a:active,
.call-to-action.cta-styled a:focus {
    color: #fff;
}

.call-to-action.cta-styled a i.fa {
    position: relative;
    right: 0;
    top: 0;
    font-size: 1em;
    -webkit-transition: all 1s;
    transition: all 1s;
}

.call-to-action.cta-styled a:hover i.fa,
.call-to-action.cta-styled a:active i.fa,
.call-to-action.cta-styled a:focus i.fa {
    font-size: 1.2em;
    right: -2%;
    top: 2px;
}

.btn.btn-styled {
    background-image: none;
    border: 0;
    color: #fff;
    padding: 10px 40px;
}

.btn.btn-styled-big {
    background-image: none;
    border: 0;
    color: #fff;
    padding: 10px 40px;
    font-size: 25px;
    margin-top: 50px;
}

/* .pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
    color: #999999 !important;
} */

/*blue*/
/* .blue-theme a,
.blue-theme a:hover,
.blue-theme a:active,
.blue-theme a:focus,
.blue-theme .menuu a:hover,
.blue-theme .menuu li.selected a,
.blue-theme .pagination > li > a,
.blue-theme .pagination > li > span {
    color: #57cff2;
} */

.blue-theme .header-section,
.blue-theme .btn.btn-styled,
.blue-theme .select-image-btn,
.blue-theme .select-image-large-btn,
.blue-theme .select-image-raw-btn,
.blue-theme .submit-pic,
.blue-theme .select-pic,
.blue-theme .select-auth-image-large-btn {
    background-color: #57cff2;
}

.blue-theme .header-section,
.blue-theme .btn.btn-styled-big,
.blue-theme .select-image-btn,
.blue-theme .select-image-large-btn,
.blue-theme .select-image-raw-btn,
.blue-theme .submit-pic,
.blue-theme .select-pic,
.blue-theme .select-auth-image-large-btn {
    background-color: #57cff2;
}

/* .blue-theme .call-to-action.cta-styled a {
    background-image: none;
    background-color: #57cff2;
    border: 0;
} */

.call-to-action.cta-styled.cta--force-blue a {
    background-color: #57cff2 !important;
}

.call-to-action.cta-styled.cta--force-red a {
    background-color: #f26d5c !important;
}

.call-to-action.cta-styled.cta--force-green a {
    background-color: #a7d163 !important;
}

.blue-theme .main-section h1.h-styled,
.blue-theme .main-section h2.h-styled,
.blue-theme .main-section h3.h-styled,
.blue-theme .main-section h4.h-styled,
.blue-theme .main-section h5.h-styled,
.blue-theme .main-section h6.h-styled,
.blue-theme .main-section .h1.h-styled,
.blue-theme .main-section .h2.h-styled,
.blue-theme .main-section .h3.h-styled,
.blue-theme .main-section .h4.h-styled,
.blue-theme .main-section .h5.h-styled,
.blue-theme .main-section .h6.h-styled {
    color: #57cff2;
}

/*green*/
/* .green-theme a,
.green-theme a:hover,
.green-theme a:active,
.green-theme a:focus,
.green-theme .menu a:hover,
.green-theme .menu li.selected a,
.green-theme .pagination > li > a,
.green-theme .pagination > li > span {
    color: #a7d163;
} */

.green-theme .header-section,
.green-theme .btn.btn-styled,
.green-theme .select-image-btn,
.green-theme .select-image-large-btn,
.green-theme .select-image-raw-btn,
.green-theme .submit-pic,
.green-theme .select-pic,
.green-theme .select-auth-image-large-btn {
    background-color: #a7d163;
}

.green-theme .call-to-action.cta-styled a {
    background-image: none;
    background-color: #a7d163;
    border: 0;
}

.green-theme .main-section h1.h-styled,
.green-theme .main-section h2.h-styled,
.green-theme .main-section h3.h-styled,
.green-theme .main-section h4.h-styled,
.green-theme .main-section h5.h-styled,
.green-theme .main-section h6.h-styled,
.green-theme .main-section .h1.h-styled,
.green-theme .main-section .h2.h-styled,
.green-theme .main-section .h3.h-styled,
.green-theme .main-section .h4.h-styled,
.green-theme .main-section .h5.h-styled,
.green-theme .main-section .h6.h-styled {
    color: #a7d163;
}

/*pink*/
/* .pink-theme a,
.pink-theme a:hover,
.pink-theme a:active,
.pink-theme a:focus,
.pink-theme .menu a:hover,
.pink-theme .menu li.selected a,
.pink-theme .pagination > li > a,
.pink-theme .pagination > li > span {
    color: #27c0b8;
} */

.pink-theme .header-section,
.pink-theme .btn.btn-styled,
.pink-theme .select-image-btn,
.pink-theme .select-image-large-btn,
.pink-theme .select-image-raw-btn,
.pink-theme .submit-pic,
.pink-theme .select-pic,
.pink-theme .select-auth-image-large-btn {
    background-color: #27c0b8;
}

.pink-theme .call-to-action.cta-styled a {
    background-image: none;
    background-color: #27c0b8;
    border: 0;
}

.pink-theme .main-section h1.h-styled,
.pink-theme .main-section h2.h-styled,
.pink-theme .main-section h3.h-styled,
.pink-theme .main-section h4.h-styled,
.pink-theme .main-section h5.h-styled,
.pink-theme .main-section h6.h-styled,
.pink-theme .main-section .h1.h-styled,
.pink-theme .main-section .h2.h-styled,
.pink-theme .main-section .h3.h-styled,
.pink-theme .main-section .h4.h-styled,
.pink-theme .main-section .h5.h-styled,
.pink-theme .main-section .h6.h-styled {
    color: #27c0b8;
}

/*orange*/
/* .orange-theme a,
.orange-theme a:hover,
.orange-theme a:active,
.orange-theme a:focus,
.orange-theme .menu a:hover,
.orange-theme .menu li.selected a,
.orange-theme .pagination > li > a,
.orange-theme .pagination > li > span {
    color: #f5ad3a;
} */

.orange-theme .header-section,
.orange-theme .btn.btn-styled,
.orange-theme .select-image-btn,
.orange-theme .select-image-large-btn,
.orange-theme .select-image-r-btn,
.orange-theme .submit-pic,
.orange-theme .select-pic,
.orange-theme .select-auth-image-large-btn {
    background-color: #f5ad3a;
}

.orange-theme .call-to-action.cta-styled a {
    background-image: none;
    background-color: #f5ad3a;
    border: 0;
}

.orange-theme .main-section h1.h-styled,
.orange-theme .main-section h2.h-styled,
.orange-theme .main-section h3.h-styled,
.orange-theme .main-section h4.h-styled,
.orange-theme .main-section h5.h-styled,
.orange-theme .main-section h6.h-styled,
.orange-theme .main-section .h1.h-styled,
.orange-theme .main-section .h2.h-styled,
.orange-theme .main-section .h3.h-styled,
.orange-theme .main-section .h4.h-styled,
.orange-theme .main-section .h5.h-styled,
.orange-theme .main-section .h6.h-styled {
    color: #f5ad3a;
}

/* Adjust links color on header */
/* .header-section a {
    color: #fff;
} */

/* .header-section a:hover {
    color: #fff;
    text-decoration: underline;
} */

/*------------------------------
 * 	Menu
 *-----------------------------*/
.container-fluid.menu {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}

.container-fluid.menu .menu-content {
    background-color: #fff;
    position: relative;
    z-index: 60;
}

@media (min-width: 768px) {
    .container-fluid.menu .menu-content {
        display: block !important;
    }
}

.menu .row.personal-menu,
.menu .row.main-menu {
    padding-top: 20px;
}

.menu a {
    color: #666;
}

.menu a:hover,
.menu a:active,
.menu a:focus {
    text-decoration: none;
}

.menu li a {
    position: relative;
}

/* personal menu */
.menu .row.personal-menu {
    height: 50px;
}

.menu .row.personal-menu a:hover {
    text-decoration: none;
}

.menu .row.personal-menu .right ul,
.menu .row.main-menu ul {
    font-size: 0;
    /* Eliminate spacing between inline block elements */
    text-align: justify;
    width: 100%;
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 18px;
}

.menu .row.personal-menu .right ul:after,
.menu .row.main-menu ul:after {
    content: "";
    display: inline-block;
    width: 100%;
    height: 0;
}

.menu .row.personal-menu .right li,
.menu .row.main-menu li {
    display: inline-block;
}

/* Social media */
.menu .row.personal-menu .left ul {
    font-size: 0;
    /* Eliminate spacing between inline block elements */
    text-align: left;
    width: 100%;
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 20px;
}

.menu .row.personal-menu .left ul:after {
    content: "";
    display: inline-block;
    width: 100%;
    height: 0;
}

.menu .row.personal-menu .logo img {
    width: 75%;
    position: absolute;
    left: 12.5%;
    z-index: 100;
}

@media (max-width: 991px) {
    .menu .row.personal-menu .logo img {
        width: 90%;
        left: 5%;
    }
}

@media (max-width: 767px) {
    .menu .row.personal-menu .logo img {
        display: none;
    }
}

.social {
    display: inline-block;
    padding-right: 10px;
}

.social.facebook a:hover,
.social.facebook a:active,
.social.facebook a:focus {
    color: #3b78e7;
}

.social.twitter a:hover,
.social.twitter a:active,
.social.twitter a:focus {
    color: #5ea9dd;
}

.social.youtube a:hover,
.social.youtube a:active,
.social.youtube a:focus {
    color: #ee1c1b;
}

.social.google-plus a:hover,
.social.google-plus a:active,
.social.google-plus a:focus {
    color: #dc4b3e;
}

.social.instagram a:hover,
.social.instagram a:active,
.social.instagram a:focus {
    color: #cb0074;
}

.social.linkedin a:hover,
.social.linkedin a:active,
.social.linkedin a:focus {
    color: #0077b5;
}

.btn-social.facebook:hover,
.btn-social.facebook:active,
.btn-social.facebook:focus {
    color: #3b78e7;
}

.btn-social.twitter:hover,
.btn-social.twitter:active,
.btn-social.twitter:focus {
    color: #5ea9dd;
}

.btn-social.youtube:hover,
.btn-social.youtube:active,
.btn-social.youtube:focus {
    color: #ee1c1b;
}

.btn-social.google-plus:hover,
.btn-social.google-plus:active,
.btn-social.google-plus:focus {
    color: #dc4b3e;
}

.btn-social.instagram:hover,
.btn-social.instagram:active,
.btn-social.instagram:focus {
    color: #cb0074;
}

.btn-social.linkedin:hover,
.btn-social.linkedin:active,
.btn-social.linkedin:focus {
    color: #0077b5;
}

/* end footer social media */


/* main menu */
.menu .row.main-menu {
    height: 60px;
}

.menu .row.main-menu div {
    position: relative;
    top: -25%;
}

.menu .row.main-menu ul {
    line-height: 1;
    font-size: 20px;
}

@media (max-width: 991px) {
    .menu .row.main-menu {
        height: 40px;
        padding-top: 10px;
    }
}

/* menu separator */
.menu .separator {
    position: relative;
    z-index: 50;
}

.menu .separator .container {
    position: relative;
}

.menu .separator .right-angle,
.menu .separator .left-angle {
    height: 100px;
    position: relative;
    z-index: -1;
    top: -90px;
    background: #fff;
}

.menu .separator .right-angle {
    transform: skew(0deg, -3deg);
    -ms-transform: skew(0deg, -6deg);
    -webkit-transform: skew(0deg, -3deg);
}

.menu .separator .left-angle {
    transform: skew(0deg, 3deg);
    -ms-transform: skew(0deg, 6deg);
    -webkit-transform: skew(0deg, 3deg);
}

.menu .separator img {
    width: 17%;
    position: absolute;
    top: 0;
    left: 41.5%;
    z-index: 50;
}

/* Hamburger */
/* #hamburger {
    display: none;
} */

/* @media (max-width: 767px) {
    .menu .separator .right-angle,
    .menu .separator .left-angle {
        height: 40px;
        top: -20px;
    }

    .menu .separator img {
        width: 30%;
        left: 35%;
    }

    #hamburger {
        display: block;
        margin: 0;
        position: absolute;
        top: -20%;
        left: 44%;
        z-index: 100;
    }

    .container-fluid.menu .menu-content {
        display: none;
    }
} */

@media (max-width: 600px) {
    .menu .separator img {
        width: 40%;
        left: 31%;
    }

    /* #hamburger {
        left: 45%;
    } */
}

/* @media (max-width: 500px) {
    #hamburger {
        left: 43%;
    }
} */

@media (max-width: 450px) {
    .menu .separator img {
        width: 43%;
        left: 31%;
    }

    /* #hamburger {
        left: 44%;
    } */
}

@media (max-width: 400px) {
    .menu .separator img {
        width: 48%;
        left: 30%;
    }
}

@media (max-width: 350px) {
    .menu .separator img {
        width: 50%;
        left: 30%;
    }
}

@media (max-width: 300px) {
    .menu .separator img {
        width: 70%;
        left: 20%;
    }

    #hamburger {
        left: 40%;
    }
}

/*------------------------------
 * 	General Sections
 *-----------------------------*/
/* Header-section */
.header-section {
    position: relative;
    /* margin-top: 100px; */
    padding-top: 250px;
    padding-bottom: 100px;
    color: #fff;
    overflow: hidden;
}

.header-section .container {
    position: relative;
    padding-top: 30px;
    padding-bottom: 20px;
}

.header-section .container .row {
    position: relative;
    z-index: 10;
}

@media (max-width: 767px) {
    .header-section {
        margin: 0;
    }
}

/* Header-section */
.main-section {
    position: relative;
    background-color: #fff;
}

.main-section .container {
    padding-top: 20px;
    padding-bottom: 30px;
}

/* .main-section h1,
.main-section h2,
.main-section h3,
.main-section h4,
.main-section h5,
.main-section h6,
.main-section .h1,
.main-section .h2,
.main-section .h3,
.main-section .h4,
.main-section .h5,
.main-section .h6 {
    font-family: "JF Flat Regular";
    color: #666;
} */

/* .secondary-section h1,
.secondary-section h2,
.secondary-section h3,
.secondary-section h4,
.secondary-section h5,
.main-section h6,
.secondary-section .h1,
.secondary-section .h2,
.secondary-section .h3,
.secondary-section .h4,
.secondary-section .h5,
.secondary-section .h6 {
    font-family: "JF Flat Regular";
    color: #fff;
} */

.secondary-section h1.black-color,
.secondary-section h2.black-color,
.secondary-section h3.black-color,
.secondary-section h4.black-color,
.secondary-section h5.black-color,
.main-section h6.black-color,
.secondary-section .h1.black-color,
.secondary-section .h2.black-color,
.secondary-section .h3.black-color,
.secondary-section .h4.black-color,
.secondary-section .h5.black-color,
.secondary-section .h6.black-color {
    color: #000000;
}

/* .secondary-section.contact-us .contact-us-data-container h1 {
    color: #000000;
} */

.main-section svg.section-border {
    position: absolute;
    top: -100px;
}

/*------------------------------
 * 	Footer
 *-----------------------------*/
/* footer section */

.footer-section {
    position: relative;
    background-color: #666666;
    color: #fff;
    padding-bottom: 20px;
}

.footer-section svg.section-border {
    background: #fff;
}

.footer-section .kids-abacus {
    display: none;
}

.footer-section .kids-cup {
    display: none;
}

.footer-section .container {
    position: relative;
}

.footer-section .footer-content ul {
    list-style: none;
    margin: 0;
}

.footer-section .footer-content ul li a {
    color: #fff;
}

.footer-section .footer-content .footer-social {
    text-align: center;
}

.footer-section .footer-content .footer-social ul li {
    font-size: 24px;
}

.footer-section .footer-logo img {
    width: 18%;
    position: absolute;
    top: -100px;
    left: 40px;
    max-height: 220px;
    max-width: 220px;
}

@media (max-width: 991px) {
    .footer-section .footer-logo img {
        width: 20%;
    }
}

.footer-section .footer-copyrights {
    font-size: 18px;
    padding-top: 30px;
}

@media (max-width: 767px) {
    .footer-section {
        text-align: center;
    }

    .footer-section .footer-content .footer-social {
        margin-top: 20px;
    }

    .footer-section .footer-logo img {
        left: auto;
        right: 3%;
        top: -70px;
    }
}

/*------------------------------
 * 	Secondary Styling
 *-----------------------------*/
/*header home section */
/* .home .header-section {
    margin-top: 8rem;
} */

.home .header-section .container {
    position: relative;
}

.home .header-section #park svg {
    width: 100% !important;
    height: auto !important;
    position: absolute;
    left: 0;
    bottom: 0;
}

.home .header-section #up-teady img {
    /* width: 40%; */
    height: auto;
    position: absolute;
    bottom: -100px;
    left: 50%;
    transform: translate(-52.5%, 0);
}

.home .header-section .achievements .content {
    text-align: center;
    padding: 50px 0;
}

.home .header-section .achievements .content .number {
    display: block;
    font-size: 90px;
    line-height: 1;
}

.home .header-section .achievements .content .text {
    display: block;
    font-size: 50px;
}

@media (max-width: 991px) {
    .home .header-section .achievements .content {
        padding: 30px 0;
    }

    .home .header-section .achievements .content .number {
        font-size: 80px;
    }

    .home .header-section .achievements .content .text {
        font-size: 40px;
    }
}

@media (max-width: 767px) {
    .home .header-section #up-teady img {
        width: 50%;
        left: -10px;
        transform: translate(0, 0);
    }

    .home .header-section .achievements .content {
        padding: 40px 0;
    }

    .home .header-section .achievements .content .number {
        font-size: 50px;
    }

    .home .header-section .achievements .content .text {
        font-size: 30px;
    }
}

/*secondary home sections*/
.secondary-section .container {
    position: relative;
    min-height: 300px;
    padding-top: 10px;
    padding-bottom: 10px;
}

.home .main-section.home-about {
    background-color: #f5ad3a;
    color: #fff;
}

.secondary-section.home-courses {
    background-color: #a7d163;
    color: #fff;
}

.secondary-section.home-courses svg.section-border {
    background-color: #27c0b8;
}

.secondary-section.contact-us svg.section-border {
    background-color: #a7d163;
}

.secondary-section.home-nursery {
    background-color: #27c0b8;
    color: #fff;
}

.secondary-section.home-nursery svg.section-border {
    background-color: #fff;
}

.secondary-section.home-testimonials svg.section-border {
    background-color: #f5ad3a;
}

.secondary-section.home-testimonials h1 {
    color: #666;
}

/* teddies */
.teddy img {
    position: absolute;
    max-width: 400px;
    z-index: 1;
    width: 40%;
    pointer-events: none;
}

.secondary-section .teddy img {
    z-index: 60;
}

.teddy.left img {
    left: 0;
    bottom: -20px;
}

.teddy.right img {
    right: 0;
    bottom: -40px;
}

.teddy.teddy-boss img {
    max-height: 150%;
    width: auto;
    top: -30px;
    left: 0;
}

@media (max-width: 991px) {
    .teddy.teddy-boss img {
        max-height: 100%;
    }
}

.teddy.teddy-boss.teddy-amplify img {
    max-height: 220%;
}

@media (max-width: 767px) {
    .teddy img {
        max-width: 130px;
    }

    .teddy.right img,
    .teddy.teddy-boss img {
        left: 0;
        top: auto;
        right: auto;
        bottom: -100px;
    }
}

.secondary-section.contact-us .contact-us-data-container .teddy.teddy-boss img {
    z-index: 0;
}

/*------------------------------
 * 	Content Styling
 *-----------------------------*/
.data-with-icon {
    margin-bottom: 30px;
    position: relative;
    z-index: 70;
}

.data-with-icon .icon {
    font-size: 80px;
    line-height: 1;
    display: block;
    float: right;
    padding: 0 30px;
    width: 180px;
    text-align: center;
}

.data-with-icon .icon img {
    width: 100%;
}

.data-with-icon .data {
    text-align: justify;
    word-wrap: break-word;
}

@media (max-width: 767px) {
    .data-with-icon .icon {
        float: none;
        margin: 0 auto;
    }

    .data-with-icon,
    .data-with-icon .data {
        text-align: center;
    }
}

.all-courses {
    text-align: center;
}

.all-courses a {
    font-size: 24px;
    margin-top: 20px;
    padding: 5px 25px;
    color: #666;
}

.all-courses a:hover,
.all-courses a:focus,
.all-courses a:active {
    color: #a7d163;
}

/* Testimonials */
.home-testimonials .user {
    text-align: center;
    z-index: 60;
}

.home-testimonials .user .avatar,
.avatar-container {
    width: 100%;
    max-width: 214px;
    border: solid #666 2px;
    background-color: #fff;
    padding: 10px;
    margin: 0 auto;
}

.home-testimonials .user .avatar img,
.avatar-container img {
    width: 100%;
    max-width: 190px;
}

.home-testimonials .user .user-name {
    text-align: center;
    margin-top: 10px;
    text-shadow: -1px -1px 0 #fff, 1px -1px 0 #fff, -1px 1px 0 #fff,
        1px 1px 0 #fff;
}

.home-testimonials .testimonial .test-body {
    background-color: #57cff2;
    border-radius: 10px;
    padding: 20px;
    color: #fff;
    position: relative;
    z-index: 60;
}

.home-testimonials .testimonial .test-body .arrows {
    font-size: 60px;
    color: #57cff2;
}

.home-testimonials .testimonial .test-body .arrows .up {
    display: none;
}

.home-testimonials .testimonial .test-body .arrows .right {
    display: block;
    position: absolute;
    right: -20px;
    top: 0px;
}

.home-testimonials .testimonial .user-name-first {
    display: block;
    width: 100%;
    text-align: center;
}

@media (max-width: 991px) {
    @media (min-width: 768px) {
        .home-testimonials .testimonial .user-name {
            display: block;
            text-align: center;
        }
    }

    .home-testimonials .testimonial .test-body .arrows .right {
        display: none;
    }
}

@media (max-width: 768px) {
    .home-testimonials .testimonial .test-body .arrows .up {
        display: block;
        position: absolute;
        left: 0px;
        top: -40px;
        width: 100%;
        text-align: center;
    }

    .home-testimonials .user {
        margin-bottom: 20px;
    }
}

/* Call to Action */
.call-to-action {
    text-align: center;
    margin-top: 20px;
    margin-bottom: -20px;
}

.call-to-action.cta-inner {
    margin-bottom: 0;
}

.call-to-action.cta-inner a {
    padding: 10px 30px;
    font-size: 20px;
}

.call-to-action.cta-big a {
    width: 100%;
    padding-top: 15px;
    padding-bottom: 15px;
    font-size: 24px;
    display: block;
    margin-bottom: 20px;
    color: #fff;
}

@media (max-width: 767px) {
    .call-to-action.cta-big a {
        font-size: 18px;
    }
}

/* testimonials carousel*/
.testimonials-carousel {
    width: 100%;
    max-width: 660px;
    margin: 0 auto;
}

.testimonial-cell {
    width: 100%;
    margin-left: 0.5%;
    margin-right: 0.5%;
    margin-bottom: 1%;
    padding: 10px;
}

/*------------------------------
 * 	Forms
 *-----------------------------*/
/*checkbox*/
.checkbox-container {
    display: inline-block;
}

.checkbox-container span.selection-name {
    display: inline-block;
    margin-right: 10px;
}

.checkbox-container label.cmn-label {
    display: inline-block;
    vertical-align: middle;
}

/* Sign Up page */
/*gender*/
input#gender.cmn-toggle-round+label.cmn-label:before {
    background-color: #57cff2;
}

input#gender.cmn-toggle-round:checked+label.cmn-label:before {
    background-color: #f6b1d0;
}

.gender label.control-label {
    display: inline-block;
    margin-left: 10px;
}

/* source */
form .form-group table td {
    padding-left: 10px;
}

/*general*/
.input-group-btn:last-child>.btn,
.input-group-btn:last-child>.btn-group {
    padding: 8px 12px;
    font-size: 14px;
}

.hidden-control {
    display: none;
}

.preform-text {
    text-align: center;
}

#pwd2 {
    margin-top: 10px;
}

.form-control {
    padding: 4px 12px;
    line-height: normal;
}

/* feedback */
.form-control-feedback.glyphicon-ok,
.form-control-feedback.glyphicon-remove {
    color: #fff;
}

.form-group.has-success .form-control-feedback.glyphicon-remove,
.form-group.has-error .form-control-feedback.glyphicon-ok {
    display: none;
}

.msg.has-success,
.form-message.has-success,
.form-message.has-success .form-control-feedback.glyphicon-ok,
.has-success .help-block,
.has-success .control-label,
.has-success .radio,
.has-success .checkbox,
.has-success .radio-inline,
.has-success .checkbox-inline,
.has-success.radio label,
.has-success.checkbox label,
.has-success.radio-inline label,
.has-success.checkbox-inline label {
    color: #7ed000;
}

.msg.has-error,
.form-message.has-error,
.form-message.has-error .form-control-feedback.glyphicon-remove,
.has-error .help-block,
.has-error .control-label,
.has-error .radio,
.has-error .checkbox,
.has-error .radio-inline,
.has-error .checkbox-inline,
.has-error.radio label,
.has-error.checkbox label,
.has-error.radio-inline label,
.has-error.checkbox-inline label {
    color: #ff4340;
}

.msg {
    padding: 10px;
    display: none;
}

.form-message {
    padding: 0 10px;
}

button.submit {
    padding: 10px 25px;
    font-size: 18px;
}

/* Country Picker */
.bfh-selectbox .bfh-selectbox-options,
.bfh-datepicker-calendar {
    left: auto;
    right: 0;
}

.bfh-selectbox .bfh-selectbox-toggle .bfh-selectbox-option {
    float: right;
}

.bfh-selectbox .bfh-selectbox-toggle {
    padding: 6px 12px 6px 24px;
}

.bfh-selectbox .bfh-selectbox-toggle .selectbox-caret {
    margin-right: -10px;
    margin-left: -16px;
    margin-top: 11px;
}

/* Date Picker */
.bfh-datepicker-toggle>input[readonly] {
    background: #fff;
    padding-top: 8px;
}

.bfh-datepicker-calendar {
    color: #000;
}

.wickedpicker {
    z-index: 10000;
    height: 160px !important;
    direction: ltr;
}

.timepicker {
    direction: ltr;
    text-align: right;
}

/* Image Upload */
.fancybox-overlay {
    background: rgba(0, 0, 0, 0.3);
}

input.cropit-image-input,
input.cropit-image-large-input,
input.raw-image-input,
input.cropit-kid-image-large-input,
input.cropit-auth-image-large-input {
    display: none;
}

.zoomer {
    margin: 40px 0 0 0;
    text-align: center;
    vertical-align: middle;
}

.zoomer .small-icon {
    transform: translateY(25%);
}

.zoomer .zoom-range {
    transform: translateY(350%);
}

.zoomer .zoom-range input[type="range"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    height: 5px;
    background: #eee;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    outline: none;
}

.options {
    padding: 3px 0;
}

.options hr {
    margin: 10px 0;
}

.select-image-btn:hover,
.remove-image-btn:hover,
.submit-pic:hover,
.cancel-pic:hover,
.cancel-raw-pic:hover,
.select-image-large-btn:hover,
.select-image-raw-btn:hover,
.select-auth-image-large-btn:hover {
    color: #fff;
}

.select-image-btn,
.select-image-large-btn,
.select-image-raw-btn,
.submit-pic,
.select-pic,
.select-auth-image-large-btn {
    background: #57cff2;
    color: #fff;
    padding: 10px 15px;
    text-align: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
    display: inline-block;
    position: relative;
}

.remove-image-btn,
.cancel-pic,
.cancel-raw-pic {
    background: #f26d5c;
    color: #fff;
    padding: 10px 15px;
    text-align: center;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
    display: inline-block;
    position: relative;
}

/*form image btns*/
form .avatar.uploaded .cancel-pic,
form .uploaded .cancel-raw-pic,
form .avatar.empty .select-image-btn,
form .avatar.empty .select-image-large-btn,
form .empty .select-image-raw-btn,
form .avatar.empty .select-auth-image-large-btn {
    display: inline-block;
}

form .avatar.empty .cancel-pic,
form .empty .cancel-raw-pic,
form .avatar.uploaded .select-image-btn,
form .avatar.uploaded .select-image-large-btn,
form .uploaded .select-image-raw-btn,
form .avatar.uploaded .select-auth-image-large-btn {
    display: none;
}

form .avatar input#avatar-control[type="checkbox"],
form input.pic-checker[type="checkbox"] {
    display: none;
}

.cropit-image-preview {
    background-color: #f8f8f8;
    background-size: cover;
    border: 5px solid #ccc;
    border-radius: 3px;
    margin: 7px auto 0;
    width: 200px;
    height: 200px;
    cursor: move;
}

/* Translucent background image */
.cropit-image-background {
    opacity: 0.2;
}

/*
 * If the slider or anything else is covered by the background image,
 * use relative or absolute position on it
 */
input.cropit-image-zoom-input {
    position: relative;
}

/* Limit the background image by adding overflow: hidden */
#image-cropper,
#image-cropper-large {
    overflow: hidden;
}

/*------------------------------
 * 	Settings Page
 *-----------------------------*/
.pass-settings {
    display: none;
}

.avatar-settings {
    text-align: center;
    border-left: #ecedef 1px solid;
}

@media (max-width: 767px) {
    .avatar-settings {
        border-left: 0;
        padding-bottom: 30px;
    }
}

.avatar-settings .btn {
    margin: 10px 0 0 5px;
}

/* sub-page-menu*/
.sub-page-menu {
    background: #ecedef;
    border-top: #dcddde solid 1px;
    border-bottom: #dcddde solid 1px;
    padding: 8px 0;
    margin: 22px auto 10px;

    color: #409fd5;
    text-align: center;
    font-size: 17px;
}

.sub-page-menu .sub-page-menu-item {
    border-left: 1px solid #57cff2;
    cursor: pointer;
}

.sub-page-menu .sub-page-menu-item a {
    text-decoration: none;
}

.sub-page-menu .sub-page-menu-item .fa {
    font-size: 1.3em;
    position: relative;
    top: 4px;
}

.sub-page-menu .sub-page-menu-item.passive {
    cursor: default;
}

.sub-page-menu .sub-page-menu-item.shown,
.sub-page-menu .sub-page-menu-item.shown a {
    color: #666;
    cursor: default;
}

.sub-page-menu .sub-page-menu-item.last {
    border-left: 0;
}

/*------------------------------
 * 	contacts page
 *-----------------------------*/
/* Branches list */
.branches-list,
.select-container {
    position: relative;
}

.branches-list .caret-down-addon,
.select-container .caret-down-addon {
    position: absolute;
    top: 1px;
    left: 1px;
    color: #666;
    height: 36px;
    border-right: 1px solid #cccccc;
    border-bottom-left-radius: 5px;
    border-top-left-radius: 5px;
    background-color: #fff;
    padding: 4px 12px;
    font-size: 18px;
    line-height: normal;
    pointer-events: none;
}

/*contacts */
.contact-table .row {
    margin-bottom: 10px;
    word-break: break-all;
}

.phone-number {
    direction: ltr;
}

/*map*/
.map {
    overflow: hidden;
    padding-bottom: 250px;
    position: relative;
    height: auto;
    background-color: #fff;
}

.map iframe {
    left: 1%;
    top: 2%;
    height: 96%;
    width: 98%;
    position: absolute;
}

@media (min-width: 768px) {
    .table-row-title {
        text-align: left;
    }
}

/*------------------------------
 * 	Courses
 *-----------------------------*/

/* carousel cells */
.courses-carousel {
    width: 100%;
    max-width: 660px;
    margin: 0 auto;
}

.courses-carousel.large-carousel {
    width: 100%;
    max-width: 990px;
    margin: 0 auto;
}

.courses-container {
    text-align: center;
    padding-top: 30px;
}

.course-cell {
    width: 49%;
    max-width: 300px;
    max-height: 280px;
    margin-left: 0.5%;
    margin-right: 0.5%;
    margin-bottom: 1%;
    padding: 10px;
    background-color: #fff;
    color: #666;
    display: inline-block;
}

.courses-carousel.large-carousel .course-cell {
    width: 32.333333333333%;
}

.offer-border {
    border: 5px solid #91a0ed;
    border-radius: 10px;
}

@media (max-width: 950px) {

    .course-cell,
    .courses-carousel.large-carousel .course-cell {
        width: 48%;
    }
}

@media (max-width: 600px) {

    .course-cell,
    .courses-carousel.large-carousel .course-cell {
        width: 96%;
    }
}

.courses-carousel .course-cell {
    max-width: none;
    margin-left: 1%;
    margin-right: 0;
    margin-bottom: 0;
    float: right;
    margin-bottom: 0;
}

.course-cell .cell-image {
    width: 100%;
    padding-bottom: 10px;
}

.course-cell .cell-image img {
    width: 100%;
}

.course-cell .cell-title {
    text-align: center;
}

.course-cell a {
    color: #666;
    text-decoration: none;
}

.course-cell.selected {
    border-bottom: 4px #93b757 solid;
}

.course-cell.selected a {
    color: #a7d163;
}

.course-cell a:active,
.course-cell a:hover,
.course-cell a:focus {
    color: #a7d163;
}

.kids .course-cell.selected {
    border-bottom: 4px #db9b34 solid;
}

.kids .course-cell.selected a {
    color: #f5ad3a;
}

.kids .course-cell a:active,
.kids .course-cell a:hover,
.kids .course-cell a:focus {
    color: #f5ad3a;
}

/* course level*/
.levels-container {
    margin-top: 20px;
    margin-bottom: 30px;
}

.levels-offers-container {
    margin-top: 20px;
    margin-bottom: 30px;
}

.levels-container .course-level {
    margin-bottom: 10px;
}

.levels-offers-container .course-level {
    margin-bottom: 10px;
}

.levels-container .poster-data {
    margin-bottom: 10px;
}

.levels-container .course-level .header {
    color: #fff;
    background-color: #a7d163;
    border-radius: 5px;
    position: relative;
    z-index: 10;
    cursor: pointer;
}

.levels-offers-container .course-level .header {
    color: #fff;
    background-color: #a7d163;
    border-radius: 5px;
    position: relative;
    z-index: 10;
    cursor: pointer;
}

.levels-container .poster-data .header {
    color: #fff;
    background-color: #a7d163;
    border-radius: 5px;
    position: relative;
    z-index: 10;
}

.levels-container .course-level .call-to-action.cta-styled a {
    color: #fff;
}

.levels-offers-container .course-level .call-to-action.cta-styled a {
    color: #fff;
}

.levels-container .poster-data .call-to-action.cta-styled a {
    color: #fff;
}

.levels-container .course-level.styled-gray .header,
.levels-container .course-level.styled-gray .call-to-action.cta-styled a {
    background-color: #cccccc;
}

.levels-container .poster-data.styled-gray .header,
.levels-container .poster-data.styled-gray .call-to-action.cta-styled a {
    background-color: #cccccc;
}

.levels-container .course-level.styled-gray a {
    color: #cccccc;
}

.levels-container .poster-data.styled-gray a {
    color: #cccccc;
}

.levels-container .course-level.styled-green .header,
.levels-container .course-level.styled-green .call-to-action.cta-styled a {
    background-color: #a7d163;
}

.levels-offers-container .course-level.styled-green .header,
.levels-container .course-level.styled-green .call-to-action.cta-styled a {
    background-color: #a7d163;
}

.levels-container .poster-data.styled-green .header,
.levels-container .poster-data.styled-green .call-to-action.cta-styled a {
    background-color: #a7d163;
}

.levels-container .course-level.styled-green a {
    color: #a7d163;
}

.levels-container .poster-data.styled-green a {
    color: #a7d163;
}

.levels-container .course-level.styled-orange .header,
.levels-container .course-level.styled-orange .call-to-action.cta-styled a {
    background-color: #f5ad3a;
}

.levels-container .poster-data.styled-orange .header,
.levels-container .poster-data.styled-orange .call-to-action.cta-styled a {
    background-color: #f5ad3a;
}

.levels-container .course-level.styled-orange a {
    color: #f5ad3a;
}

.levels-container .poster-data.styled-orange a {
    color: #f5ad3a;
}

.levels-container .course-level.styled-pink .header,
.levels-container .course-level.styled-pink .call-to-action.cta-styled a {
    background-color: #f26d5c;
}

.levels-container .poster-data.styled-pink .header,
.levels-container .poster-data.styled-pink .call-to-action.cta-styled a {
    background-color: #f26d5c;
}

.levels-container .course-level.styled-pink a {
    color: #f26d5c;
}

.levels-container .poster-data.styled-pink a {
    color: #f26d5c;
}

.levels-container .course-level.styled-blue .header,
.levels-container .course-level.styled-blue .call-to-action.cta-styled a {
    background-color: #57cff2;
}

.levels-container .poster-data.styled-blue .header,
.levels-container .poster-data.styled-blue .call-to-action.cta-styled a {
    background-color: #57cff2;
}

.levels-container .course-level.styled-blue a {
    color: #57cff2;
}

.levels-container .poster-data.styled-blue a {
    color: #57cff2;
}

.levels-container .course-level.styled-brown .header,
.levels-container .course-level.styled-brown .call-to-action.cta-styled a {
    background-color: #d39761;
}

.levels-container .poster-data.styled-brown .header,
.levels-container .poster-data.styled-brown .call-to-action.cta-styled a {
    background-color: #d39761;
}

.levels-container .course-level.styled-brown a {
    color: #d39761;
}

.levels-container .poster-data.styled-brown a {
    color: #d39761;
}

.levels-container .course-level .header div {
    text-align: center;
    padding: 10px 0;
    min-height: 54px;
    vertical-align: middle;
}

.levels-offers-container .course-level .header div {
    text-align: center;
    padding: 10px 0;
    min-height: 54px;
    vertical-align: middle;
}

.levels-container .poster-data .header div {
    text-align: center;
    padding: 10px 0;
    min-height: 54px;
    vertical-align: middle;
}

.levels-container .course-level .header div.sign {
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    font-size: 24px;
}

.levels-offers-container .course-level .header div.sign {
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    font-size: 24px;
}

.levels-container .poster-data .header div.sign {
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    font-size: 24px;
    padding-right: 20px;
    padding-left: 5px;
}

.levels-container .course-level .header div.sign.warning {
    background-color: #f5ad3a;
}

.levels-container .poster-data .header div.sign.warning {
    background-color: #f5ad3a;
}

.levels-container .course-level .header div.sign.times {
    background-color: #ff0000;
}

.levels-container .poster-data .header div.sign.times {
    background-color: #ff0000;
}

.levels-container .course-level .header div.arrow {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

.levels-offers-container .course-level .header div.arrow {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

.levels-container .poster-data .header div.arrow {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

.levels-container .course-level .header div i.fa {
    vertical-align: middle;
}

.levels-offers-container .course-level .header div i.fa {
    vertical-align: middle;
}

.levels-container .poster-data .header div i.fa {
    vertical-align: middle;
}

.levels-container .course-level .header div.title {
    text-align: right;
    font-size: 24px;
    border-right: #fff solid 1px;
    padding-right: 10px;
}

.levels-offers-container .course-level .header div.title {
    text-align: right;
    font-size: 24px;
    border-right: #fff solid 1px;
    padding-right: 10px;
}

.levels-container .poster-data .header div.title {
    text-align: right;
    font-size: 24px;
    border-right: #fff solid 1px;
    padding-right: 10px;
}

.levels-container .course-level .content {
    display: none;
    border-radius: 5px;
    position: relative;
    z-index: 5;
    top: -10px;
    padding: 30px 20px 20px;
    border: 1px #666 solid;
}

.levels-offers-container .course-level .content {
    display: none;
    border-radius: 5px;
    position: relative;
    z-index: 5;
    top: -10px;
    padding: 30px 20px 20px;
    border: 1px #666 solid;
}

.levels-container .poster-data .content {
    display: block;
    border-radius: 5px;
    position: relative;
    z-index: 5;
    top: -10px;
    padding: 30px 20px 20px;
    border: 1px #666 solid;
}

.levels-container .course-level .content img {
    float: left;
    width: 35%;
    max-width: 280px;
    max-height: 180px;
}

.levels-offers-container .course-level .content img {
    float: left;
    width: 35%;
    max-width: 280px;
    max-height: 180px;
}

.levels-container .poster-data .content img {
    float: left;
    width: 35%;
    max-width: 280px;
    max-height: 180px;
}

@media (max-width: 767px) {
    .levels-container .course-level .content img {
        float: none;
        width: 100%;
    }

    .levels-offers-container .course-level .content img {
        float: none;
        width: 100%;
    }

    .levels-container .poster-data .content img {
        float: none;
        width: 100%;
    }

    .xs-center {
        text-align: center;
    }
}

/*------------------------------
 * 	kids
 *-----------------------------*/
.kids .data {
    margin-bottom: 20px;
}

@media (max-width: 767px) {
    .kids .contact-table .row {
        text-align: center;
    }
}

/* img */
.kid-pic-container {
    text-align: center;
}

.kid-pic-container img.kid-pic {
    width: 100%;
    max-width: 440px;
    padding: 10px;
    background-color: #fff;
    border: 1px solid #666;
}

.kids .back-to-data {
    display: block;
    margin-bottom: 20px;
}

.row.auth {
    padding: 15px 0;
    border-radius: 10px;
    color: #fff;
    margin-bottom: 20px;
    background: #aaa;
}

.row.auth.active {
    background: #f5ad3a;
}

.row.auth .auth-pic-container {
    text-align: center;
}

.row.auth img.auth-pic {
    width: 100%;
    max-width: 300px;
}

.row.auth .auth-data .data-row {
    margin-top: 15px;
}

.row.auth .options-container {
    border-right: 1px solid #fff;
    text-align: center;
    padding-top: 15px;
    padding-bottom: 15px;
}

.row.auth .options-container .options {
    margin-top: 10px;
}

.row.auth .options-container .options a {
    color: #fff;
}

.row.auth .options-container .options div.right {
    border-left: 1px solid #fff;
}

@media (max-width: 767px) {
    .row.auth .auth-data {
        text-align: center;
    }

    .row.auth .options-container {
        border-right: 0;
        border-top: 1px solid #fff;
        margin-top: 15px;
        padding-top: 15px;
    }
}

/* Nuresery and courses in kids page */
@media (min-width: 768px) {
    .levels-container .course-level .content .right {
        border-left: 1px solid #666;
    }

    .levels-offers-container .course-level .content .right {
        border-left: 1px solid #666;
    }

    .levels-container .poster-data .content .right {
        border-left: 1px solid #666;
    }
}

.levels-container .course-level .content .row {
    margin-bottom: 10px;
}

.levels-offers-container .course-level .content .row {
    margin-bottom: 10px;
}

.levels-container .poster-data .content .row {
    margin-bottom: 10px;
}

.levels-container .course-level .content .centered {
    text-align: center;
    margin-bottom: 20px;
}

.levels-offers-container .course-level .content .centered {
    text-align: center;
    margin-bottom: 20px;
}

.levels-container .poster-data .content .centered {
    text-align: center;
    margin-bottom: 20px;
}

.levels-container .course-level .content .level-message {
    background-color: #ffeebc;
    border-top: 1px solid #f5ad3a;
    border-bottom: 1px solid #f5ad3a;
    padding-top: 10px;
    padding-bottom: 10px;
}

.levels-offers-container .course-level .content .level-message {
    background-color: #ffeebc;
    border-top: 1px solid #f5ad3a;
    border-bottom: 1px solid #f5ad3a;
    padding-top: 10px;
    padding-bottom: 10px;
}

.levels-container .poster-data .content .level-message {
    background-color: #ffeebc;
    border-top: 1px solid #f5ad3a;
    border-bottom: 1px solid #f5ad3a;
    padding-top: 10px;
    padding-bottom: 10px;
}

.levels-container .course-level .content .level-message li {
    list-style: none;
}

.levels-offers-container .course-level .content .level-message li {
    list-style: none;
}

.levels-container .poster-data .content .level-message li {
    list-style: none;
}

.levels-container .course-level .content .row-title {
    padding-left: 0px;
}

.levels-offers-container .course-level .content .row-title {
    padding-left: 0px;
}

.levels-container .poster-data .content .row-title {
    padding-left: 0px;
}

.levels-container .course-level .content .row-data {
    padding-right: 10px;
}

.levels-offers-container .course-level .content .row-data {
    padding-right: 10px;
}

.levels-container .poster-data .content .row-data {
    padding-right: 10px;
}

.levels-container .course-level .content .row-data-item {
    display: block;
}

.levels-offers-container .course-level .content .row-data-item {
    display: block;
}

.levels-container .poster-data .content .row-data-item {
    display: block;
}

.levels-container .course-level .content .state i.fa.fa-check,
.kids .table i.fa.fa-check {
    color: #a7d163;
}

.levels-container .poster-data .content .state i.fa.fa-check,
.kids .table i.fa.fa-check {
    color: #a7d163;
}

.levels-container .course-level .content .state i.fa.fa-times,
.kids .table i.fa.fa-times {
    color: #ff0000;
}

.levels-container .poster-data .content .state i.fa.fa-times,
.kids .table i.fa.fa-times {
    color: #ff0000;
}

.levels-container .course-level .content .state i.fa.fa-warning,
.kids .table i.fa.fa-warning {
    color: #f5ad3a;
}

.levels-container .poster-data .content .state i.fa.fa-warning,
.kids .table i.fa.fa-warning {
    color: #f5ad3a;
}

.levels-container .course-level .content .row-title a i.fa {
    padding-left: 5px;
}

.levels-container .poster-data .content .row-title a i.fa {
    padding-left: 5px;
}

.levels-container .course-level .content .table {
    margin-bottom: 0;
    border-bottom: 1px solid #ddd;
}

.levels-container .poster-data .content .table {
    margin-bottom: 0;
    border-bottom: 1px solid #ddd;
}

.kids .table th,
.kids .table td {
    text-align: center;
}

/* teacher notes */
.kids .note-row {
    margin-bottom: 10px;
    background-color: #f5f5f5;
    border: 1px solid #666;
    border-radius: 5px;
    padding: 10px;
}

.kids .note-row.new {
    background-color: #fff;
    border: 1px solid #f5ad3a;
}

.kids .note-row .row {
    margin-bottom: 10px;
}

.kids .note-row .note {
    padding: 20px;
    border: 1px solid #666;
    border-radius: 5px;
    background-color: #fff;
}

.kids .note-row.new .note {
    border: 1px solid #f5ad3a;
}

.badge.badge-warning {
    background-color: #f5ad3a;
}

.kids .note-row .badge.badge-warning {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 18px;
    padding: 5px 10px;
    border-radius: 50px;
}

/* teacher notes */

span.fa-comment {
    position: absolute;
    font-size: 0.95em;
    top: -1px;
    color: red;
    right: -6px;
}

.message-row .pr-message-replies {
    margin: 10px 0;
    padding-right: 10px;
    border-right: 2px solid #000;
}

.msgs-number {
    position: absolute;
    font-size: 0.7em;
    right: -1px;
    top: 1px;
    color: #666;
}

.message-row {
    margin-bottom: 10px;
    background-color: #f5f5f5;
    border: 1px solid #666;
    border-radius: 5px;
    padding: 10px;
}

.message-row.new {
    background-color: #fff;
    border: 1px solid #57cff2;
}

.message-row .row {
    margin-bottom: 10px;
}

.message-row .note {
    padding: 20px;
    border: 1px solid #666;
    border-radius: 5px;
    background-color: #fff;
}

.message-row.new .note {
    border: 1px solid #57cff2;
}

.badge-msg.badge-warning {
    background-color: #fff;
}

.message-row .badge.badge-warning {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 18px;
    padding: 5px 10px;
    border-radius: 50px;
}

.pag-container {
    text-align: center;
}

/* financials table */
tr.has-completion {
    cursor: pointer;
}

tr.financial-completion {
    display: none;
}

tr.financial-completion,
tr.has-completion {
    border-right: 2px solid #000;
    border-left: 2px solid #000;
}

/* jobs */
.open-position {
    text-decoration: none;
}

.open-position:hover .job-position .note .icon {
    transform: translate(-50%, -50%);
}

.job-position .row {
    margin-bottom: 10px;
    cursor: pointer;
}

.job-position .note {
    position: relative;
    display: block;
    color: #fff;
    padding: 20px;
    border: 2px solid #57cff2;
    border-radius: 5px;
    background-color: #666;
}

.job-position .note .icon {
    position: absolute;
    left: 25px;
    top: 50%;
    transform: translateY(-50%);
    color: #fff;

    font-size: 40px;
    font-weight: 200;
    transition: transform 1s;
}

.job-position .note .description {
    display: block;
    width: 80%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

/* offers */
/* .offer-text {
    font-size: 24px;
    font-weight: bold;
}

.offer-img {
    float: left;
    width: 35%;
    max-width: 280px;
    max-height: 180px;
}

a {
    display: block;
    margin-bottom: 10px;
}

@media (max-width: 767px) {
    .offer-img {
        float: none;
        width: 100%;
    }
} */

/*===========================competition theme ==============================*/

.competition-theme {
    background-image: url("compbackground.jpg");
}

.competition-theme .btn.btn-styled {
    background-color: #5f9ea0;
}

.albums {
    background-image: url("albumsbg.jpg");
}

.competition-theme .footer-section {
    position: relative;
    background-color: #5f9ea0;
    color: #fff;
    padding-bottom: 20px;
}

.competition-theme .footer-section polygon {
    fill: #5f9ea0;
}

.competition-theme .comp {
    /*background-image: url("button.png");
	background-size: cover;*/

    margin-left: 100px;
}

.competition-theme .footer-section .section-border {
    display: none;
}

.competition-theme .kids-pics {
    position: absolute;
    top: -230px;
    display: flex;
    width: 100%;
    justify-content: space-around;
}

@media (max-width: 667px) {
    .competition-theme .kids-pics {
        top: -180px;
    }
}

.competition-theme .kids-abacus {
    display: block;
    width: 430px;
    height: 230px;
}

@media (max-width: 667px) {
    .competition-theme .kids-abacus {
        width: 260px;
        height: 180px;
    }
}

.competition-theme .kids-cup {
    display: block;
    width: 220px;
    height: 230px;
}

@media (max-width: 667px) {
    .competition-theme .kids-cup {
        width: 130px;
        height: 180px;
    }
}

.competition-theme .flex-container {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.compit {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
}

.competition-theme .albums-container {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-around;
}

.competition-theme .albums-container .flex-con {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.competition-theme .albums-container .flex-con .item .album-photo {
    width: 200px;
    height: 207px;
    position: absolute;
    top: 24px;
    left: 35px;
    z-index: 1;
    -ms-transform: rotate(-6deg);
    transform: rotate(-6deg);
}

.album-background {
    background-image: url(albbg.png);
    width: 282px;
    height: 287px;
    position: relative;
}

.album-name-bg {
    background-image: url(album-year.png);
    width: 151px;
    height: 47px;
    text-align: center;
}

@media only screen and (min-width: 300px) and (max-width: 768px) {
    .competition-theme .comp {
        margin-left: 0px;
    }

    .competition-theme .compit .compitem img {
        width: 160px;
    }

    .competition-theme .flex-container .item img {
        height: 300px;
    }
}

.competition-theme .footer-section .footer-logo img {
    display: none;
}

.competition-theme .img-gallery {
    width: 80%;
    margin: 100px auto 50px;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    grid-gap: 30px;
}

.competition-theme .img-gallery img {
    width: 250px;
    height: 250px;
    cursor: pointer;
}

.competition-theme .img-gallery img:hover {
    transform: scale(0.8) rotate(-15deg);
    border-radius: 20px;
    box-shadow: 0 32px 7px rgba(68, 77, 136, 0.2);
}

.competition-theme .full-img {
    width: 100%;
    height: 100vh;
    background: rgba(0, 0, 0, 0.9);
    position: fixed;
    top: 0;
    left: 0;
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 100;
}

.competition-theme .full-img img {
    width: 90%;
    max-width: 500px;
}

.competition-theme .full-img span {
    position: absolute;
    top: 5%;
    right: 5%;
    font-size: 30px;
    color: #fff;
    cursor: pointer;
}

.competition-theme .video-container {
    position: relative;
    display: flex;
    justify-content: center;
    width: 360px;
    height: 300px;
}

.competition-theme iframe {
    position: absolute;
    top: 5px;
    border-top: 1px solid black;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;

    width: 320px;
    height: 170px;
}

.competition-theme .video-container img {
    position: absolute;
    bottom: 70px;
    left: 40px;
    width: 62px;
    height: 39px;
}

.competition-theme .video-container .videologo {
    position: absolute;
    bottom: 70px;
    left: 40px;
    width: 62px;
    height: 39px;
}

.competition-theme .video-container .videotitle {
    position: absolute;
    bottom: 70px;
    text-align: center;
    width: 100%;
    height: 39px;
    color: #409fd5;
}

.competition-theme .video-container .subscribe {
    position: absolute;
    bottom: 50px;
    right: 40px;
    width: 57px;
    height: 13px;
}

@media (max-width: 991px) {
    .footer-section .footer-logo img {
        width: 20%;
    }
}

.competition-theme .kid-regs {
    background-image: url("comp_regs_btn.png");
    background-size: cover;
    border: none;
    width: 425px;
    height: 33px;
}

.btncontainer {
    text-align: center;
    padding: 50px;
}

#btn {
    font-size: 25px;
}

.rounded-button {
    width: 100px;
    height: 100px;

    margin: 20px;
    background: #ffffff;
    color: gray;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border-radius: 50%;
    border: 1px solid #bbbbbb;
    text-decoration: none;
    outline: none;
    letter-spacing: 1px;
    text-shadow: 0;
}

.rounded-button:hover {
    color: white;
    background: #fff4cc;
}

.rounded-button:active {
    letter-spacing: 2px;
}

.onclic {
    border: 3px solid #17bd3b;
    border-width: 3px;
    font-size: 0;
}

.onclic:after {
    content: "";
}

to {
    color: #00fa9a;
}

.select2-results__group {
    color: #550022;
}

.select2-results__option--disabled {
    color: #1b8098 !important;
    font-size: 14px;
    font-style: italic;
}

.select2-container .select2-search--inline .select2-search__field {
    height: 30px !important;
    width: 100% !important;
    font-size: 14px !important;
}