@font-face {
    font-family: ptBoldItalic;
    src: url(../fonts/PT_Serif/PTSerif-BoldItalic.ttf);
}
@font-face {
    font-family: ptBold;
    src: url(../fonts/PT_Serif/PTSerif-Bold.ttf);
}
@font-face {
    font-family: ptItalic;
    src: url(../fonts/PT_Serif/PTSerif-Italic.ttf);
}
@font-face {
    font-family: ptRegular;
    src: url(../fonts/PT_Serif/PTSerif-Regular.ttf);
}
@font-face {
    font-family: nav;
    src: url(../fonts/Rosario/Rosario-VariableFont_wght.ttf);
}
@font-face {
    font-family: titleFont;
    src: url(../fonts/Satisfy/Satisfy-Regular.ttf);
}
@font-face {
    font-family: rosarioBold;
    src: url(../fonts/static/Rosario-Bold.ttf);
}
@font-face {
    font-family: rosarioBoldItalic;
    src: url(../fonts/static/Rosario-BoldItalic.ttf);
}
@font-face {
    font-family: rosarioItalic;
    src: url(../fonts/static/Rosario-Italic.ttf);
}
@font-face {
    font-family: rosarioLight;
    src: url(../fonts/static/Rosario-Light.ttf);
}
@font-face {
    font-family: rosarioLightItalic;
    src: url(../fonts/static/Rosario-LightItalic.ttf);
}
@font-face {
    font-family: rosarioMedium;
    src: url(../fonts/static/Rosario-Medium.ttf);
}
@font-face {
    font-family: rosarioMediumItalic;
    src: url(../fonts/static/Rosario-MediumItalic.ttf);
}
@font-face {
    font-family: rosarioRegular;
    src: url(../fonts/static/Rosario-Regular.ttf);
}
@font-face {
    font-family: rosarioSemiBold;
    src: url(../fonts/static/Rosario-SemiBold.ttf);
}
@font-face {
    font-family: rosarioSemiBoldItalic;
    src: url(../fonts/static/Rosario-SemiBoldItalic.ttf);
}
@font-face {
    font-family: rasorioBold;
    src: url(../fonts/static/Rosario-Bold.ttf);
}
@font-face {
    font-family: rasorioLight;
    src: url(../fonts/static/Rosario-Light.ttf);
}
@font-face {
    font-family: rasorioRegular;
    src: url(../fonts/static/Rosario-Regular.ttf);
}
@font-face {
    font-family: rasorioMedium;
    src: url(../fonts/static/Rosario-Medium.ttf);
}
/* ------------common styles */
.about-nyoga h1,.yoga-home h1, .teacher-training h1, .our-team-title h1, .instructor-title h4, .testimonials h1, .bussiness-title h1, .newsletter-title h1, .testimonials span {
    font-family: titleFont;
}
a.nav-link, .training-content h3 {
    font-family: 'rosarioSemibold';
}
h1, .yoga-dubai h4, footer, .letter-content h3, .talk-instructor1 h1, .talk-instructor2 h1, .newsletter-subscribe p  {
    font-family: satisfy;
} 
.instructor-title h2 {
    font-family: 'rosarioSemiBold';
}
.timings h3, .contact-us h3{
    font-family: ptBold;
}
.about-nyoga p, .yoga-at p, .about-instructor p, .testimonials p, .letter-content p, .training-content p {
    font-family: rasorioRegular;
}
button.btn.about-read, button.btn.home-read, button.btn.team-read  {
    background-color: #fbc77e;
    font-family: 'rosarioSemiBold';
    border-radius: 0px;
    font-size: 20px;
    padding: 12px 30px;
}
/* wtsapp scroll */
.whatsappscroll{
    background-color:#f6efe5;
}
marquee a{
    text-decoration: none;
    color: #000;
}
 marquee .app:hover{
    color:blue;
} 
/* ---------header */
ul.navbar-nav {
    gap: 50px;
}
.nyoga-nav {
    align-items: center;
}
header {
    background: #ffca1e;
}
a.nav-link {
    color: black;
}
a.nav-link.spl-menu {
    border-radius:15px;
}
.spl-menu1, .spl-menu2{ 
    background-color:#2a56a4 !important;

}
.special-menu1, .special-menu2{
    animation: blinker 1s infinite;
}
header:hover .special-menu1, header:hover .special-menu2{
    animation: blinker 0s infinite;

}
@keyframes blinker {
    50%{
        order: 6;
    }
   
}

ul li ul {
    position: absolute;
top:60px;
    margin: 0px;
    padding: 0px;
    display: none;
    z-index: 10;

}
ul li ul li {
    display: block;
    margin: 10px 0px;
}
ul li ul {
    background: bisque;
}
ul li ul li a {
    text-decoration: none;
    color: black;
    padding: 5px 12px;
    border-radius: 12px;
}
ul li ul li a:hover{

    color:#fff;
}
ul li ul li:hover{
    
    background-color: rgb(132, 132, 130);
    color:#fff;
}
ul li:hover ul{
display : block;
}

/* -------------banner */
.desktop-banners .carousel-caption h1 .with-yoga {
    color: #ff9900;
}
.online-hrs h1{
    color: #8d1d1c;
}
.desktop-banners .online-hrs {
    right: -2%!important;
    bottom: 25%!important;
    left: -22%!important;
}
.social {
    list-style: none;
    position: fixed;
    z-index: 999;
    right: 10px;
    font-size: 30px;
}
.social a{
    color: #000;
}
.bi-facebook,.bi-instagram,.bi-linkedin,.bi-pinterest,.bi-twitter,.bi-whatsapp,.bi-youtube{
    transition: color .6s ease;
}
.bi-whatsapp:hover{
    color:#008000;

}
.bi-facebook:hover{
    color:#00f;
}
.bi-twitter:hover{
    color:#87ceeb;

   
}
.bi-instagram:hover{
    color: #00f;
}
.bi-pinterest:hover{
    color: #f00;
}
.bi-youtube:hover{
    color: #f00;
}
.bi-linkedin:hover{
    color: #00f;
}
.social .bi-whatsapp:hover,.bi-facebook:hover,.bi-twitter:hover,.bi-instagram:hover,.bi-pinterest:hover,.bi-youtube:hover,.bi-linkedin:hover{
    display: block;
    transform: scale(1.3) !important;

}
.carousel-caption {
    right: -11%;
    bottom: 45%;
    left: 15%;
}
.carousel-caption p {
    margin: auto;
}
button.slide {
    width: 20px !important;
    height: 20px !important;
    background-color: gray !important;
    border-radius: 100%;
}
.enroll-btn button.btn.about-read {
    color: black;
    border: none;
}
/* -------------about yoga */
.about-nyoga {
    background-color: #f6efe5;
}
.about-nyoga p {
    text-align: justify;
    line-height: 30px;
}
/* --------------yoga@ Home */
.yoga-home {
    background-color: #f2d5c5;
}
.yoga-home p {
    text-align: justify;
    line-height: 30px;
}
.our-instructor, .our-instructor1 {
    position: relative;
    overflow: hidden;
}
.talk-instructor1, .talk-instructor2 {
    background-color: rgba(132, 132, 130, .7);
}
 .talk-instructor2 {
    background-color:rgba(188, 33, 41, .7);
} 
.talk-instructor1 button,.talk-instructor2 button  {
    color: #fff;
    border: none;
    width: 100%;
    border-radius: 0px !important;
    padding: 27px;
}
.talk-instructor1 button:hover{
    background: rgba(132, 132, 130, .7);
    border-left: 2px solid rgba(132, 132, 130, 1);
}
.talk-instructor2 button:hover{
    background: rgba(188, 33, 41, 1);
    border-left: 2px solid rgba(188, 33, 41, 1)
}
.talk-instructor1, .talk-instructor2 {
    position: absolute !important;
    bottom: -105px;
    transition: bottom .2s;
    width: 100%;
    color: #fff;
    display: flex;
    justify-content: space-evenly;
}
.our-instructor:hover .talk-instructor1, .our-instructor1:hover .talk-instructor2{
    bottom: 0px;
    padding: 0px !important;
}
.yoga-home{
    position: relative;
}
.floral-design {
    position: absolute;
}
.design{
    animation: spin 15s ease infinite;
}
@keyframes spin {
    100%{
        transform: rotate(360deg);
    }
}
.yoga-home-quote1,.yoga-home-quote2 {
    display: block;
    text-align: center;
    font-size: 23px;
    font-weight: bold;
}
/* --------------Teacher Training */
.modal-content {
    background: #f8eae7 !important;
}
.modal-body label {
    font-weight: 700;
}
.modal-body button.btn.btn-primary, .teach-content button.btn.btn-primary {
    border-radius: 0px;
    background-color: #fbc77e;
    color: black;
    border: none;
    font-family: 'rosarioSemiBold';
}
.teacher-left{
    background-color: #caebf2;
    /* flex-basis:25%; */
    transition:flex-basis .9s ease!important; 
}
.teacher-right{
    display: flex;
    align-items: center;
    background-color: #efcce0;
    flex-basis:25%;
   transition:flex-basis .9s ease!important; 
}
.teacher-img3{
    background-color: #efcce0;
}
.teacher-title {
    background-color: #f8eae7;
}
.teacher-img1 img, .teacher-img2 img, .teacher-img3 img{
    width: 100%;
    transition: transform .5s ease;
}
.teacher-img1, .teacher-img2, .teacher-img3 {
    overflow: hidden;
}
.teacher-img1:hover .enlarge_img, .teacher-img2:hover .enlarge_img, .teacher-img3:hover .enlarge_img{
    transform: scale(1.3);
}

.teach-content{
    opacity: 1;
    transition: all 1s ease-in-out;
    padding: 15px 30px;
}
.teach-content span {
    display: flex;
    justify-content: end;
    font-size: 16px;
    /* font-weight: bold; */
    font-family: 'nav';
}
.teach-content p {
    margin-top: 25px;
}
/* -------------Our Team */
.ourteam-row {
    justify-content: space-evenly;
}

.our-team {
    background: #f0e8d1;
}

.teamcard p {
    text-align: justify;
    font-family: nav;
    height: 200px;
}

.team h1 {
    font-family: titleFont;
}

.teamcard h1 {
    font-family: nav;
    font-size: 2rem;
}

.teamcard button {
    font-family: nav;
    border: none;
    background: #fbc77e;
    color: #000;
    font-size: 20px;
}

.our-team .card {
    position: relative !important;
    width: 290px !important;
    border-radius: 0px!important;
}

.miam {
    background-color: #e5dbc0 !important;
    margin: 0px -16px !important;
    padding: 0% 0% 50% 0% !important;
    border-radius: 0px !important;
    border-bottom: 2px dashed #000 !important;
    transition: background-color 1s;
}

.miam h3 {
    font-family: nav;
}

.miam h4 {
    font-family: titleFont;
    font-size: 17px;
}

.imageteam {
    border: 2px dashed #000;
    border-radius: 100%;
    background: #fff;
    height: 250px;
}

.teamimage1,
.teamimage2 {
    position: absolute !important;
    left: 25px !important;
    top: 145px;
    right: 25px;
}

.teamimage3,
.teamimage4 {
    position: absolute !important;
    left: 25px !important;
    top: 145px;
    right: 25px;
}

.teamcard {
    padding: 55% 10% 0% 10% !important;
    margin: 0px -16px;
    background-color: #fff;
    transition: background-color 1s;
}

/* .card {
    transition: 1s box-shadow;
} */

.ourteam-row .card:hover {
    .miam {
        background-color: #96d6df !important;
    }

    box-shadow: 10px 10px #cfc9b3 !important;

    .teamcard {
        padding: 55% 10% 0% 10% !important;
        margin: 0px -16px;
        background-color: #fbf17e !important;
    }

    .teammember p {
        text-align: justify;
        font-family: nav;
    }

    .teammember {
        justify-content: center;
    }
}
/* testimonials */
.Testimonials{
    background-color: #f6efe5;
}
.Testimonials h4{
    font-family:Satisfy-Regular;
}
.carousel-indicators .btn2 button{
    background-color: #000 !important;
    height: 6px !important;
}
.testimonials-slides button {
    width: 50px!important;
    height: 10px!important;
    background-color: #6a5345!important;
}
img.quote {
    width: 2.3em;
}
/* -----------------location */
.Business{
    background-color: #c7e9f3;
}
.bussiness-title {
    background-color: #c7e9f3;
}
/* -------------- newsletter*/
.newsletter-content {
    background-color: #fed96e;
}
.newsletter-left {
    position: relative;
    bottom: 145px;
}
.news-letter {
    background-color: #f0e8d1;
}
.letter-content {
    padding-bottom: 0px !important;
}
.email-input {
    background: none;
    font-size: 18px;
    padding: 10px 20px;
    border:1px solid #c9a470;
}
.email-input::placeholder {
    
    background: url(../bootstrap-icons/icons/envelope-fill.svg) no-repeat right;
    color: black;
    background-size: 24px;
}
.newsletter-subscribe h1 {
    letter-spacing: 3px;
    width: 24ch;
}
.newsletter-subscribe p {
    font-size: 20px;
}
.letter-content h3 {
    padding: 15px 0 30px 0;
}
/* --------------footer */
.timings,.contact-us {
    background-color: #d6af78;
}
.footer-content {
    background-color: #c9a470;
}
.yoga-dubai {
    background-color: #56462f;
    color: #c9a470;
}
.timings ul,.contact-us ul {
    list-style: none;
}
.contact-us a {
    text-decoration: none;
    color: #49423c;
}
.next-line {
    display: block;
    padding: 0 0 0 33px;
}

.timings {
    display: flex;
    justify-content: end;
    text-align: end;
}
.contact-us {
    justify-content: start;
    display: flex;
}
li.borders2, li.borders1 {
    border-top: 1px solid black;
    border-bottom: 1px solid black;
}
footer{
    color: #49423c;
}
.timings h3, .contact-us h3, .yoga-dubai h4 {
    font-size: 28px;
}
span.ams {
    font-size: 18px;
    color: #e9c797;
    transition: color .4s ;
}
footer a {
    text-decoration: none;
}
.yoga-dubai h4 {
    display: inline-block;
}
span.ams:hover {
    color: #c9a470;
}
.enrol-click {
    color: #000;
    text-align: center;
    font-weight: bold;
    text-transform: uppercase;
    display: block;
    font-size: 18px;
    position: fixed;
    right: 20px !important;
    bottom: 5vh;
    z-index: 100;
    line-height: 1.3;
    border: 10px solid #2a56a4;
    padding: 16px 0px;
    width: 150px;
    height: 150px;
    border-radius: 50%;
    background: #f6efe5;
    transition: all ease 0.2s;
    font-family: 'nav';
}
.enrol-click:hover {
    background:#2a56a4 !important;
    color: #fff !important;
}