/*Responsive Styles*/


/* Smartphones S ---------------- */
@media only screen and (max-width : 320px) {
    h1 {
        font-size: 5rem;
    }

    h2 {
        font-size: 3rem;
    }

    .cont {
        font-size: 14px;
        max-width: 280px;
        margin: 0 auto;
    }

    .navbar-brand img {
        width: 60vw;
    }

    #nav1 .btn {
        font-size: 5rem;
        height: auto;
        left: 55%;
        top: 0px;
        padding: 2px 6px;
    }

    .navbar-toggler-icon {
        width: 7.5em;
        height: 5.5em;
    }

    #nav2 .dropdown-menu {
        font-size: 4rem;
    }

    .formAreaModal {
        width: 320px;
    }

    .formTitle2 {
        font-size: 7rem;
    }

    .formTitle,
    .msgs {
        font-size: 5.2rem;
    }

    .formTitle3 {
        font-size: 5.7rem;
    }

    .ui-input input+label span {
        font-size: 2.2rem;
    }

    .ui-input input {
        font-size: 4rem;
    }

    select.form-control:not([size]):not([multiple]) {
        height: 40px;
    }

    .ui-input select {
        font-size: 3rem;
    }


    .style-btn-sch {
        font-size: 4.6rem;
    }

    .style-btn {
        font-size: 4.6rem;
    }



    #top-baner {
        display: none;
    }

    .about p {
        font-size: 4rem;
        line-height: 5rem;
        padding: 5px 5px;
    }

    .about iframe {
        min-height: 200px;
    }

    .style-item .style-item-content p {
        margin-top: 10px;
        font-size: 8rem;
    }


    /* teachers*/
    .teachers .img1 {
        position: inherit;
        width: 100%;

    }

    .teachers .img2 {
        position: inherit;
        bottom: 0;
        width: 100%;

    }

    .teachers .img3 {
        position: inherit;
        width: 100%;

    }

    .teachers .img4 {
        position: inherit;
        width: 100%;
    }

    .teachers .img5 {
        position: inherit;
        width: 100%;
    }

    .teachers .img6 {
        position: inherit;
    }

    .teachers .img7 {
        position: inherit;
        width: 50%;
        left: 25%;
        bottom: 0%;
    }

    .teachers .img8 {
        position: inherit;
        width: 100%;

    }

    .teachers .img9 {
        position: inherit;
        width: 100%;
    }

    .teachers .img10 {
        position: inherit;
        width: 100%;
    }


    .teachers .left p {
        font-size: 4.5rem;
        line-height: 5.5rem;
    }

    .teachers .right p {
        font-size: 4.5rem;
        line-height: 5.5rem;
    }


    #openform {
        display: none;
    }


    .sch table {
        font-size: 0.7rem;
    }

    .sch .nav>li>a {
        font-size: 0.85rem;
        padding: 10px 3px;
    }

    /*  STYLES  */

    .street img {
        position: inherit;
        margin-left: 0;
        margin-bottom: 10px;
        margin-top: 40px;
    }

    .east-kids .img1 {
        position: initial;
        width: 100%;
    }

    .east-kids .img2 {
        position: initial;
        width: 100%;
    }


    .classic .img1 {
        position: initial;
        width: 100%;
    }

    .classic .img2 {
        position: initial;
        width: 100%;
    }

    .hip-hop .img1 {
        position: initial;
        width: 100%;
    }

    .hip-hop .img2 {
        position: initial;
        width: 100%;
    }

    .gogo .img1 {
        position: initial;
        width: 100%;
    }

    .gogo .img2 {
        position: initial;
        width: 100%;
    }

    .jazz-funk .img1 {
        position: initial;
        width: auto;
        display: block;
        margin: 0 auto;
    }

    .jazz-funk .img2 {
        position: initial;
        width: auto;
        display: block;
        margin: 0 auto;
    }

    .kids .img1 {
        position: initial;
        width: 100%;
    }

    .kids .img2 {
        position: initial;
        width: 100%;
    }

    .contemporary .img1 {
        position: initial;
        width: 100%;
    }

    .contemporary .img2 {
        position: initial;
        width: 100%;
    }

    .jazz-modern .img1 {
        position: initial;
        width: 100%;
    }

    .jazz-modern .img2 {
        position: initial;
        width: 100%;
    }

    .east-adult .img1 {
        position: initial;
        width: 100%;
    }

    .east-adult .img2 {
        position: initial;
        width: 100%;
    }

    .strip .img1 {
        position: initial;
        width: 100%;
    }

    .strip .img2 {
        position: initial;
        width: 100%;
    }

    .pilates .img1 {
        position: initial;
        width: 100%;
    }

    .pilates .img2 {
        position: initial;
        width: 100%;
    }

    .marrige .img1 {
        position: initial;
        width: 100%;
    }

    .marrige .img2 {
        position: initial;
        width: 100%;
    }

    .discount {
        position: inherit;
        right: 0;
    }

    .discount img {
        width: 100%;
        position: inherit;
        margin: 0 auto;
        right: 0;
    }

    footer .col-md-5 {
        display: none;
    }

    .footer-social {
        display: none;
    }

    /* Add Your CSS Styling Here */
}



/* Tablets S ---------------- */
@media only screen and (min-width : 321px) and (max-width : 767px) {


    h1 {
        font-size: 5rem;
    }

    h2 {
        font-size: 4rem;
    }




    #nav2 .dropdown-menu {
        font-size: 14px;
    }

    .social {
        margin-left: 3%;
        font-size: 22px;
    }

    .social i {
        font-size: 18px;
    }

    .cont {
        font-size: 14px;
        max-width: 386px;
        margin: 0 auto;
        margin-top: 3px;
    }


    #nav1 .btn {
        font-size: 16px;
        height: auto;
        left: auto;
        top: 0;
        padding: 0px 10px;
        padding-top: 5px;
    }

    .navbar-brand img {
        width: 60vw;

    }

    .navbar-toggler-icon {
        width: 7.5em;
        height: 5.5em;
    }

    #openform {
        display: none;
    }

    .formTitle2 {
        font-size: 7rem;
    }

    .formTitle,
    .msgs {
        font-size: 5.2rem;
    }

    .formTitle3 {
        font-size: 5.7rem;
    }

    .ui-input input+label span {
        font-size: 2.2rem;
    }

    .ui-input input {
        font-size: 4rem;
    }

    select.form-control:not([size]):not([multiple]) {
        height: 40px;
    }

    .ui-input select {
        font-size: 3rem;
    }







    .about p {
        font-size: 4rem;
        line-height: 5rem;
    }

    .style-item .style-item-content p {
        font-size: 6rem;
    }

    .teachers .img1 {
        position: inherit;
        width: 100%;

    }

    .teachers .img2 {
        position: inherit;
        bottom: 0;
        width: 100%;

    }

    .teachers .img3 {
        position: inherit;
        width: 100%;

    }

    .teachers .img4 {
        position: inherit;
        width: 100%;
    }

    .teachers .img5 {
        position: inherit;
        width: 100%;
    }

    .teachers .img6 {
        position: inherit;
    }

    .teachers .img7 {
        position: inherit;
        width: 50%;
        left: 25%;
        bottom: 0%;
    }

    .teachers .img8 {
        position: inherit;
        width: 100%;

    }

    .teachers .img9 {
        position: inherit;
        width: 100%;
    }

    .teachers .img11 {
        position: inherit;
        width: 100%;
    }

    .teachers .img10 {
        position: inherit;
        width: 100%;
    }




    .teachers .left p, .teachers .right p {
        font-size: 3.5rem;
        line-height: 2;
    }

    .teachers .nameleft, .teachers .nameright {
        width: 70%;
    }

    .teachers .nameleft span, .teachers .nameright span  {
        font-size: 4rem;
    }

    .teachers .nameright p, .teachers .nameleft p {
        font-size: 6rem;
    }
    .teachers img {
        max-height: 50vh !important;
        bottom: 0 !important;
    }

    .discount {
        position: inherit;
        margin: 0 auto;
        right: 0;
    }

    .discount img {
        max-width: 320px;
    }




    .sch table {
        font-size: 1rem;
    }

    .sch .nav>li>a {
        font-size: 1rem;
        padding: 10px 8px;
    }

    /*  STYLES  */
    .street img {
        position: inherit;
        margin-left: 0;
        margin-bottom: 10px;
        margin-top: 40px;
    }

    .east-kids .img1 {
        position: initial;
        width: inherit;
        display: block;
        margin: 0 auto;
    }

    .east-kids .img2 {
        position: initial;
        width: inherit;
        display: block;
        margin: 0 auto;
    }


    .classic .img1 {
        position: initial;
        width: inherit;
        display: block;
        margin: 0 auto;
    }

    .classic .img2 {
        position: initial;
        width: inherit;
        display: block;
        margin: 0 auto;
    }

    .hip-hop .img1 {
        position: initial;
        width: inherit;
        display: block;
        margin: 0 auto;
    }

    .hip-hop .img2 {
        position: initial;
        width: inherit;
        display: block;
        margin: 0 auto;
    }

    .gogo .img1 {
        position: initial;
        width: inherit;
        display: block;
        margin: 0 auto;
    }

    .gogo .img2 {
        position: initial;
        width: inherit;
        display: block;
        margin: 0 auto;
    }

    .jazz-funk .img1 {
        position: initial;
        width: inherit;
        display: block;
        margin: 0 auto;
    }

    .jazz-funk .img2 {
        position: initial;
        width: inherit;
        display: block;
        margin: 0 auto;
    }

    .kids .img1 {
        position: initial;
        width: inherit;
        display: block;
        margin: 0 auto;
    }

    .kids .img2 {
        position: initial;
        width: inherit;
        display: block;
        margin: 0 auto;
    }

    .contemporary .img1 {
        position: initial;
        width: inherit;
        display: block;
        margin: 0 auto;
    }

    .contemporary .img2 {
        position: initial;
        width: inherit;
        display: block;
        margin: 0 auto;
    }

    .jazz-modern .img1 {
        position: initial;
        width: inherit;
        display: block;
        margin: 0 auto;
    }

    .jazz-modern .img2 {
        position: initial;
        width: inherit;
        display: block;
        margin: 0 auto;
    }

    .east-adult .img1 {
        position: initial;
        width: inherit;
        display: block;
        margin: 0 auto;
    }

    .east-adult .img2 {
        position: initial;
        width: inherit;
        display: block;
        margin: 0 auto;
    }

    .strip .img1 {
        position: initial;
        width: inherit;
        display: block;
        margin: 0 auto;
    }

    .strip .img2 {
        position: initial;
        width: inherit;
        display: block;
        margin: 0 auto;
    }

    .pilates .img1 {
        position: initial;
        width: inherit;
        display: block;
        margin: 0 auto;
    }

    .pilates .img2 {
        position: initial;
        width: inherit;
        display: block;
        margin: 0 auto;
    }

    .marrige .img1 {
        position: initial;
        width: inherit;
        display: block;
        margin: 0 auto;
    }

    .marrige .img2 {
        position: initial;
        width: inherit;
        display: block;
        margin: 0 auto;
    }

    .street .row {
        margin-bottom: 70px;
    }


    footer h1 {
        font-size: 24px;
        padding-top: 15px;
    }

    footer p {
        text-align: right;
        font-size: 13px;
        padding-top: 0;
    }

    footer span {
        font-size: 10px;
    }

    .footer-social {
        font-size: 24px;
        bottom: 0px;
        position: auto;
        text-align: center;
        left: -50px;
    }

    /* Add Your CSS Styling Here */
}


/* Tablets M  -------------------- */
@media only screen and (min-device-width : 767px) and (max-device-width : 991px) {
    .cont {
        font-size: 16px;
        right: 35px;
    }

    legend {
        font-size: 15px;
    }

    legend span {
        font-size: 22px;
    }

    legend p {
        font-size: 19px;
        margin-bottom: 0rem;
    }


    .social i {
        font-size: 18px;
    }

    .social {
        margin-bottom: 3%;
        margin-left: 3%;
    }

    #nav1 .btn {
        height: 50%;
        left: 1%;
        bottom: 0;
    }

    .navbar-toggler-icon {
        width: 4.5em;
        height: 4.5em;
    }

    .discount {
        width: 30%;
        position: inherit;
        margin: 0 auto;
        right: 0;
    }

    .discount img {
        width: 100%;
    }

    .footer-social i {
        font-size: 18px;
    }

    .style-item .style-item-content p {
        font-size: 27px;
        margin-top: 15px;
    }


    .teachers img {
        top: -8%;
    }

    .teachers .left p {
        font-size: 16px;
        line-height: 16px;
    }

    .teachers .right p {
        font-size: 16px;
        line-height: 16px;
    }

    .teachers .img6 {
        top: inherit;
    }

    .teachers .img7 {
        top: inherit;
    }

    .street p {
        font-size: 14px;
    }


    /*  STYLES  */

    .east-kids .img1 {
        position: initial;
        width: 100%;
    }

    .east-kids .img2 {
        position: initial;
    }

    .hip-hop .img1 {
        position: absolute;
        width: 88%;
        bottom: -7%;
        left: 9%;
    }

    .hip-hop .img2 {
        position: absolute;
        bottom: -5%;
        width: 84%;
        right: 10%;
    }

    .jazz-modern .img1 {
        position: absolute;
        width: 63%;
        bottom: -5%;
        left: 19%;
    }

    .jazz-modern .img2 {
        position: absolute;
        width: 100%;
        bottom: -2%;
        left: 0%;
    }


    .formArea {
        position: absolute;
        top: 0;
        right: 30px;
        width: 230px;
        margin: 0 auto;
        padding: 20px 15px 10px 15px;
    }

    .form-footer {
        margin-top: 20px;
    }

    footer h1 {
        font-size: 24px;
    }

    footer p {
        font-size: 20px;
    }

    .footer-social {
        font-size: 30px;
        bottom: 0px;
        right: 0px;
    }


}



/* Tablets L -------------------- */
@media only screen and (min-device-width : 992px) and (max-device-width : 1024px) {
    .cont {
        margin: 0 -15px;
    }

    #nav1 .btn {
        right: 3%;
    }

    #nav2 img {
        width: 30vw;
    }

    .social {
        margin-bottom: 15px;
        margin-left: 5px;
    }

    .social i {
        font-size: 18px;
    }

    .cont {
        font-size: 18px;
        right: 35px;
    }


    .nav1 .btn {
        font-size: 10px;
        height: auto;
        left: 30px;
        bottom: 0;
    }

    .navbar-toggler-icon {
        width: 7.5em;
        height: 5.5em;
    }



    .about iframe {
        min-height: 370px;
    }

    #top-baner {}

    legend {
        font-size: 2rem;
    }

    legend span {
        font-size: 36px;
    }

    legend p {
        font-size: 27px;
    }

    .form-horizontal {
        padding: 1em 1em;
    }

    #slider .form-btn {}



    .teachers img {
        top: -20%;
    }

    .teachers .left p {
        font-size: 18px;
        line-height: 22px;
    }

    .teachers .right p {
        font-size: 18px;
        line-height: 22px;
    }

    .teachers .img6 {
        top: inherit;
    }

    .teachers .img7 {
        top: inherit;
    }


    .formArea {

        width: 280px;
    }

    .form-footer {
        margin-top: 20px;
    }

    /* Add Your CSS Styling Here */
}


/* Old Desktops and laptops ------------------ */
@media only screen and (min-width : 1025px) and (max-width : 1440px) {
    .cont {
        margin: 10px;
    }

    #nav1 .btn {
        right: 3%;
    }

    #nav2 img {
        width: 30vw;
    }

    #top-baner {}

    legend {
        font-size: 22px;
    }

    legend span {
        font-size: 36px;
    }

    legend p {
        font-size: 27px;
    }

    .form-horizontal {
        padding: 1em 1em;
    }

    #slider .form-btn {}

    /* Add Your CSS Styling Here */
}

/* large Desktops ------------------ */
@media only screen and (min-width : 1441px) and (max-width : 2560px) {
    .cont {
        margin: 10px;
    }

    #nav1 .btn {
        right: 3%;
    }

    #nav2 img {
        width: 30vw;
    }

    /* Add Your CSS Styling Here */
}