/*// X-Small devices (portrait phones, less than 576px)*/
/*// No media query for `xs` since this is the default in Bootstrap*/
.user .navbar-toggler-icon{
    display: none;
}

/*// `xxl` applies to x-large devices (large desktops, less than 1400px)*/
@media (max-width: 1399.98px) {
}
/*// `xl` applies to large devices (desktops, less than 1200px)*/
@media (max-width: 1199.98px) {
}

/*// `lg` applies to medium devices (tablets, less than 992px)*/
@media (max-width: 991.98px) {

    :root{
        zoom: 0.85 !important;
        --bs-navbar-color: white;
    }

    .navbar-brand{
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translateX(-50%) translateY(-50%);
        margin: 0!important;
        padding: 0!important;
    }
    .navbar-brand img{
        height: 148px;
        width: 148px;
    }
    .navbar-toggler{
        padding: 0.25rem 1.75rem;
        font-size: 1.25rem;
        line-height: 1;
        background-color: transparent;
        border: 1px solid transparent;
        border-radius: 0.25rem;
        transition: box-shadow .15s ease-in-out;
    }
    .navbar-toggler-icon {
        width: 1.5em;
        height: 1.5em;
        vertical-align: middle;
        background: unset;
    }
    .bar{
          -webkit-text-size-adjust: 100%;
          tab-size: 4;
          --ghost-accent-color: #ffc93d;
          line-height: inherit;
          font-family: proxima-nova,sans-serif;
          color: #4c6078;
          box-sizing: border-box;
          border: 0 solid #f9fcff;
          background: rgba(255, 255, 255, 0.5);
          border-radius: var(--std-radius);
          height: 5px;
          width: 36px;
          transition-property: all;
          transition-timing-function: cubic-bezier(.4,0,.2,1);
          transition-duration: .3s;
          position: relative;
          opacity: 1;
    }
    .navbar-toggler-icon .bar:nth-of-type(2) {
         margin: 8px 0;
    }
    #root{
        padding: 9px 12px;
    }
    .slider{
        min-height: 550px;
    }
    .slider-item{
        padding: 24px;
        height: 100%;
    }

    .slider-item .row{
        flex-direction: column-reverse;
    }
    .slider-item .slider-title{
        font-size: 32px;
    }
    .slider .slider-image{
        position: unset;

        max-width: unset;
        min-width: unset;
        width: 50%;
        margin: 0 auto;
    }
    .slider .slider-hr{
        margin: 10px 0;
    }
    .slider .slider-button{
        margin-top: 15px;
    }
    .products{
        padding: 12px;
        margin-top: 25px;
    }
    .products .product{
        margin-bottom: 15px;
    }
    .section-title .title{
        font-size: 32px;
    }
    .section-title .description{
        font-size: 18px;
    }
    .introduction{
        margin-top: 25px;
    }
    .introduction img{
        max-width: 100%;
    }
    .introduction .introduction-content{
        padding: 15px 14px;
    }
    .introduction .introduction-content .introduction-title{
        font-size: 34px;
        text-align: center;
    }
    .introduction .introduction-content .introduction-description{
        text-align: center;
    }
    .introduction .introduction-rocket{
        display: none;
    }
    .introduction .introduction-button{
        display: block;
        text-align: center;
        margin-top: 15px;
        margin-bottom: 15px;
    }
    .records{
        margin-top: 125px;
    }
    .records .record{
        margin-bottom: 100px;
    }
    .records .row div:last-child .record{
        margin-bottom: 0px;
    }
    .footer{
        padding: 24px;
        margin-top: 25px;
    }
    .footer .footer-title{
        font-size: 34px;
    }
    .footer .footer-text{
        font-size: 16px;
    }
    .footer .footer-nav{
        margin: 12px 0;
        padding: 0;
    }
    .footer .footer-nav li:first-child{
        margin-bottom: 0;
        font-size: 18px;
    }
    .footer-bottom{
        flex-direction: column;
    }
    .footer-bottom .footer-brand img{
        float: left;
        margin-right: 15px;
    }
    .footer-bottom .footer-brand{
        float: right;
    }
    .footer-bottom .footer-socials{
        text-align: center;
        margin: 15px 0;
    }

    .xbg-glass{
        background: rgba(255, 255, 255, 0.30);
        /*backdrop-filter: blur( 20px );*/
        /*-webkit-backdrop-filter: blur( 20px );*/
        -moz-box-shadow:    inset 0 0 10px #fff;
        -webkit-box-shadow: inset 0 0 10px #fff;
        box-shadow:         inset 0 0 20px rgba(255,255,255,.4);
        border-bottom: 5px solid rgba(255,255,255,.3);
        border-top: 5px solid rgba(255,255,255,.3);
    }

    .panel{
        border: 0;
        overflow: hidden;
        margin: 0 0;
    }
    .panel .user{
        border-radius: 0;
        border-top: 0;
        margin-bottom: 20px;
    }
    .kurs-hero{
        padding: 15px;
        flex-direction: column-reverse;
        display: flex;
    }

    .kurs-buttons{
        align-items: center;
    }

    .kurs-hero .kurs-buttons .kurs-button,.kurs-hero .kurs-buttons .kurs-button-2{
        font-size: 18px!important;
        text-align: center;
        padding-left: 0;
        padding-right: 0;
        width: 99%;
    }

    .kurs-tab-section{
        padding: 15px;
    }


    .programs {
        padding: 15px;
        padding-bottom: 0;
        background-image: linear-gradient(-15deg, rgba(70, 218, 255, 0.5), rgba(70, 218, 255, 0.1), rgba(70, 218, 255, 0.5));
    }
    .program .program-image{
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
    }
    .program {
        flex-direction: column;
        justify-content: center;
    }
    .program .program-content {
        flex: 60%;
        padding-left: 0px;
        text-align: center;
        color: #290043;
    }

    .nav-tabs{
        border: 0;
        padding: 0;
        margin-bottom: 20px;
        flex-direction: column;
        gap: 15px;
    }

    #videoModal iframe{
        max-width: 100%;
        height: 282px;
    }

    .sinav{
        height: unset!important;
    }
    .promotion-card{
        flex-direction: column;
        gap: 20px;
    }
    .kurs-banner{
        height: 200px;
    }
    .paket-card-wrap{
        height: unset!important;
    }
    .sinav-badge {
        position: absolute;
        top: 0;
        right: -10px;
    }
    .navbar{
        position: relative;
    }
    .navbar-brand img{
        max-width: unset;
    }
    .navbar-collapse {
        position: absolute;
        top: 115px;
        left: 0;
        width: 100%;
        border-radius: var(--std-radius);
        overflow: hidden;
        background: linear-gradient(
                to bottom,
                rgb(40 81 163),
                rgb(118 128 147),
                rgb(22 55 119)
            );
        backdrop-filter: blur( 5px );
        -webkit-backdrop-filter: blur( 5px );
        -moz-box-shadow: inset 0 0 10px #fff;
        -webkit-box-shadow: inset 0 0 10px #fff;
        box-shadow: inset 0 0 20px rgba(255,255,255,.5);
        border-bottom: 5px solid rgba(255,255,255,.3);
        border-top: 5px solid rgba(255,255,255,.3);
    }
    .navbar .nav-link{
        display: block;
        color: #000;
        margin:3px 20px;

        background: linear-gradient(to bottom,
            rgba(255,255,255,.9),
            rgba(255,255,255,.7),
            rgba(255,255,255,.8)
        );
        padding:9px 12px;
        border-radius: var(--std-radius);
        box-shadow: 0 5px 6px rgba(0,0,0,.5);
    }
    .navbar .nav-link.active{
        display: block;
        margin: 3px 20px;
        background: linear-gradient(
            to left,
            var(--kurumsal_koyu),
            var(--kurumsal_acik)
        );
        color: white;
        box-shadow: 0 5px 6px rgba(0,0,0,.5);
    }
    /* .nav-item .nav-link:hover{
        display: block;
        color: #333;
        margin: 3px 20px;

        background: linear-gradient(to bottom,
        rgba(255,255,255,.9),
        rgba(255,255,255,.7),
        rgba(255,255,255,.8)
        );
        padding: 10px 12px;
        border-radius: var(--std-radius);
        box-shadow: 0 5px 6px rgba(0,0,0,.5);
    } */
    .nav-item .nav-link.active {
        display: block;
        margin: 3px 20px;
        background: linear-gradient(
            to left,
            var(--kurumsal_koyu),
            var(--kurumsal_acik)
        );
        color: white;
        box-shadow: 0 5px 6px rgba(0,0,0,.5);
    }

    .navbar .nav-item{
        display: block;
    }
    .navbar .nav-right{
        /* background-color: #2851a3; */
        background: linear-gradient(to bottom,#293a5a,#142851);
        justify-content: space-evenly;
        padding: 10px 0;
    }
    .navbar .nav-right span{
        display: inline-block;
    }
    
    .dropdown-toggle.show{
        margin-bottom: 0!important;
        z-index: 1;
        position: relative;
    }
    .navbar .dropdown-menu {
        background: transparent;
        border-radius: 0;
        /* border-top: 1px solid black; */
        /* border-bottom: 1px solid black; */
        box-shadow: unset;
        background: white;

        border-radius: 0 0 var(--std-radius) var(--std-radius);
        margin: 0px 30px;
        position: relative;
        /*top: -10px;*/
        z-index: 0;
    }
    .dropdown-toggle::after {
        display: inline-block;
        margin-left: 0.255em;
        vertical-align: 0.255em;
        content: "";
        color: #000 !important;
        border-top: 0.6em solid;
        border-right: 0.3em solid transparent;
        border-bottom: 0;
        border-left: 0.3em solid transparent;
        position: relative;
        right: unset;
        left: unset;
        transform: unset;
        top: 4px;
    }
    .user .user_image{
        max-width: 64px;
    }
    .user .user_name{
        max-width: 150px;
    }
    .navbar-toggler-icon {
        width: 1.5em;
        height: 1.5em;
        vertical-align: middle;
        background: unset;
        position: absolute;
        left: 15px;
        top: 50%;
        transform: translateY(-50%);
    }
    .user .navbar-toggler-icon{
        display: inline-block;
        position: absolute;
        left: unset;
        top: unset;
        right: 0;
        width: 64px;
        transform: unset;
    }
    #root.panel{
        padding-top: 5px;
    }

    .mobile-navigation{
        padding: 15px;
        z-index: 55;
    }
    
    .mobile-navigation.active{
        display: block;
        transform: translateX(-50%) translateY(0%);
    }


    .hakkimizda .image-container img{
        display: none;
    }
    .hakkimizda .image-container{
        overflow: visible;
        box-shadow: unset;
    }
    .hakkimizda .ana-yazi{
        font-size: 44px;
        position: unset;
        color: white;
        top: 0;
        transform: unset;
    }

    .okul-title{
        font-size: 42px!important;
    }
    .okul-row{
        flex-direction: column-reverse;
    }
    .okul-image{
        padding: 42px;
    }
    .sepet-item{
        display: block;
    }
    .sepet-item .image{
        width: 100%!important;
    }
    .sepet-item .image img{
        width: 100%;
    }
    .sepet-item .remove_item{
        top: unset;
        bottom: 0;
    }

    
}

/*// `md` applies to small devices (landscape phones, less than 768px)*/
@media (max-width: 767.98px) {


}
/*// `sm` applies to x-small devices (portrait phones, less than 576px)*/
@media (max-width: 575.98px) {
}

@media only screen and (max-width: 990px) {

    #account_menu{
        display: none !important;
    }

    .mobil_tablo table {
      border: 0;
    }
  
    .mobil_tablo table caption {
      font-size: 1.3em;
    }
    
    .mobil_tablo table thead {
      border: none;
      clip: rect(0 0 0 0);
      height: 1px;
      margin: -1px;
      overflow: hidden;
      padding: 0;
      position: absolute;
      width: 1px;
    }
    
    .mobil_tablo table tr {
      display: block;
      margin-bottom: .625em;
    }
    
    .mobil_tablo table td {
      display: block;
      font-size: .8em;
      text-align: right;
      width: 100%;
      margin-top:3px;
    }
    
    .mobil_tablo table td::before {
      float: left;
      color: #CCC;
      font-size: .9em;
      font-style: italic;
    }
    
    .mobil_tablo table td:last-child {
      border-bottom: 0;
    }
  
    .mobil_tablo table td::before {
      content:attr(data-label);
      float: left;
      color: #CCC;
      font-size: .9em;
      font-style: italic;
    }
  }

