/* font-sizes */
@import url("../fonts/font.css");

.fs-45{
    font-size: 45px
}

.fs-35{
    font-size: 35px
}

.fs-25{
    font-size: 25px;
}

.fs-20{
    font-size: 20px;
}

.fs-18{
    font-size: 18px;
}

.fs-16{
    font-size: 16px
}

.fs-15{
    font-size: 15px
}

.fs-13{
    font-size: 13px
}

/* Colors */

.header-color{
    color: #0C3959;
}

.white-color{
    color: #FFFFFF !important;
}

.index-header-bg{
    background-color: white;
}
.article-color{
    color: #575757;
}

.black-color{
    color: #000000;
}

.p-color{
    color: #464646;
}

.calender-color{
    color: #777777;
}

.search-color{
    color: #BFBFBF;
}
.login-placeholder-color::placeholder{
    color: #BCD8DD;
}

.placeholder-color{
    color: #9B9B9B;
}
.underline-color{
    color: #0D68A8;
}

.bg-talep{
    background-color: #F8F8F8;
}




*{
    box-sizing: border-box;
  }

  html, body {
    width: 100%;
    height: 100%;
  }

  main{
    background-color: #F8F8F8;
  }
    main div .bannerSlide swiper-slide {
        width: 100% !important;
        height: 100% !important;
    }

        main div .bannerSlide swiper-slide img {
            width: 100% !important;
            height: 100% !important;
            object-fit: scale-down;
        }

    main div div .mySwiper {
        margin-left: 0px;
        margin-right: 0px;
        width: 100%;
        height:450px;
    }

  .profil-button{
    
    bottom: 0px;   
    transform: translateY(50%);
    
  }

  .dropdown-item.active, .dropdown-item:active{
    background-color: #f8f9fa !important;
    color: #000000 !important;
}
.index.dropdown-divider{
    border: 1px solid #ae41bb;
}
.anasyf.dropdown-divider{
    border: 1px solid #d0d2d5;
}

  .profil-input{
    width: 250px;
    height: 30px;
  }

  .profil-resim{  
    width:292px;
    height:310px ;
   
  }

  .profil-resim-icon{
    position: absolute;
    bottom: 0px;
    right: 0px;
  }

  .resim-container{
    position: relative; 
    display: inline-block;  
  }


 
  .profil-cerceve{
    width: 1240px;
  }

  .profil-form{
    margin-bottom: 230px;
  }

  .profil-textarea{
    resize: none;
  }

  .iletisim-textarea{
    resize: none;

  }

  .line{
    height: 5px;
    background-color: #0C3959;
  }

.haberler-cerceve {
    padding: 10px;
    background-color: rgba(12, 57, 89, 0.1);
    border-radius: 10px;
    min-width:100%;
    max-width:100%;
}

.haberler-cerceve .card, .etkinlikler-cerceve .card, .duyurular-cerceve .card {
  
    border-radius: 15px;
}

.etkinlikler-cerceve {
    padding: 10px;
    background-color: rgba(12, 57, 89, 0.1);
    border-radius: 10px;
    min-width: 100%;
    max-width: 100%;
}
.duyurular-cerceve {
    padding: 10px;
    background-color: rgba(12, 57, 89, 0.1);
    border-radius: 10px;
    margin-bottom: 10%;
    min-width: 100%;
    max-width: 100%;
} 

  .girl-margin{
    margin-bottom: 35%;
  }

.myEventCards {
    margin-bottom: 10%;
}

  .foto-galeri-modal{
  margin-top: 10%;
  }

  

.text-opacity{
    opacity: 50%;
}

.plc-opacity{
    opacity: 100%;
}

.login-tc::placeholder{
    opacity: 100% !important;
}
#btn-login{
   color: #FFFFFF;
   padding: 8px;
   border-radius: 8px;
}
#btn-login.btn:hover{
    color: #FFFFFF;
}

.mt-200{
    margin-top: 200px;
}

.mt-50{
    margin-top: 50px;
}

nav > div > a{
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0;
}

nav > div {
    margin-right: 0 !important;
    margin-left: 0 !important;
}

.logo{
    width: -webkit-fill-available;
}

.margin-0{
    margin: 0px;
}
.ortala{
    height: 100px;
    position:absolute;
    left: 25%;
    top: 40%;
    margin-left: -50px;
    margin-top: -50px;
}

.ortala-birth{
    height: 100px;
    position:absolute;
    left: 40%;
    top: 40%;
    margin-left: -50px;
    margin-top: -50px;
}

.mb-rectangle{
    margin-top: -14px;
}
.swiper-pagination-bullet:active{
   background-color: #f5f8fc !important;
  
}

.swiper-pagination-bullet {
    margin-top: 5% !important;
    padding-top: 5% !important;
} 
body.bg-talep:root {
    --swiper-theme-color: #f5f8fc !important;
}
#shadow-root:host {
    --swiper-theme-color: #f5f8fc !important;
}
.mb-ok{
    /* margin-top: -30px; */
    position:absolute;
    /* bottom: 0px; */
    transform: translateY(-50%);
   z-index: 2;
    
}
.header {
    background-color: #333;
    color: #fff;    
    text-align: center;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1000; /* Header'ın diğer elementlerin üzerinde olmasını sağlar */
}
.pop-up-style{
    font-size: 100px;
    color: #1A4787;
}

.saat{
    color: #6C757D;
}

.ilk-baslik{
    margin-bottom: 3rem;
    margin-top: 3rem;    
}

#addon-wrapping.input-group-text{
   background-color: white;
}
.dropdown-item.active, .dropdown-item:active{
    background-color: #f8f9fa !important;
    color: #000000 !important;
}
.index.dropdown-divider{
    border: 1px solid #ae41bb;
}
.anasyf.dropdown-divider{
    border: 1px solid #d0d2d5;
}
.input-style .form-control:focus{
    box-shadow: none !important;
    border-color: #ced4da !important;
 }

.right-foot{
    position: absolute !important;   
    right: 20px !important; 
    height: 100vh; 
}

.footer-ust{
    background-color: #ffffff !important;
    
}

.footer {
    width: 100% !important;
    background-color:#33546A;
    color: #fff;
    padding-top: 48px !important;
    padding-bottom: 48px !important;
    text-align: start;
    position: relative;
    bottom: 0;
    margin-left: 0px;
    margin-right: 0px;
    
}

.index-border{
   /* background-image: url('../img/Rectangle288.png'); */
   border-color:linear-gradient(#0C3959, #8D66A0);;
}

.copyright{
    background-color:#0C3959;
}

.girl{
    top: -113%;   
    position: absolute !important;
    bottom: 0 !important;
    right: 0 !important;    
}

.girl>img{
    width: 342.94px !important; 
    height: 408.32px !important; 
}
@media (min-width: 2560px) { 
    .navbar-expand-lg {
        justify-content: center !important;
 }}
@media screen and (min-width:1440px) {
   
    .girl>img{
        width: 320.94px !important; 
        height: 380.32px !important; 
    }
    .menu >ul>li>a{
        font-size: 18px !important;
    }
}

@media screen and (min-width:1024px) and (max-width:1440px) {
    .girl{
        top: -113%;     
        position: absolute !important;
        bottom: 0px !important;
        right:150px !important;   
        
    }

    .girl>img{
        width: 302.94px !important; ;
        height: 368.32px !important; 
    }
    
    .menu >ul>li>a{
        font-size: 16px !important;
    }

   
}

@media screen and (min-width:992px) and (max-width:1024px) {
    .girl{
        top: -110%;     
        position: absolute !important;
        bottom: 0px !important;
        right: 120px !important;   
        
    }
    .girl-margin{
        margin-bottom: 25%;
      }
    .girl>img{
        width: 280.94px !important; ;
        height: 348.32px !important; 
    }
    
    .menu >ul>li>a{
        font-size: 14px !important;
    }
   
}


@media screen and (max-width: 991px){
    .profil-button div {
   display: none;
 }
}

@media screen and (min-width:769px) and (max-width:992px) {
    .girl{
        top: -68%;       
        position: absolute !important;
        bottom: 0px !important;
        right: 205px !important;   
        
    }

    .girl>img{
        width: 260.94px !important; ;
        height: 328.32px !important; 
    }
    

    .carousel-inner .carousel-item>div {
        display: none;
    }

    .carousel-inner .carousel-item>div:first-child {
        display: block;
    }

    .menu >ul>li>a{
        font-size: 12px !important;
    }
}

#myCarousel {
    margin-top: 31px;
}
#myCarousel.indexCarousel{
    margin-top: 0px;
}
#myCarousel2 {
    margin-top: 31px;
}
#myCarousel3 {
    margin-top: 31px;
}
#myCarousel4 {
    margin-top: 31px;
}

.kart-baslik{
    font-size: 20px;
    color: #000000;
}
.pop-up-style-birth{
    font-size: 80px;
    color: #1A4787;
}

@media (max-width: 768px) {
    .carousel-inner .carousel-item.active,
.carousel-inner .carousel-item-start,
.carousel-inner .carousel-item-next,
.carousel-inner .carousel-item-prev {
    display: flex;
}

    .girl{
        display: none;        
    }

    .pop-up-style{
        font-size: 50px;
        color: #1A4787;
    }
    .ortala-birth{
        height: 100px;
        position:absolute;
        left: 40%;
        top: 25%;
        margin-left: -50px;
        margin-top: -50px;
    }

    .girl-margin{
        margin-bottom: 0px;
    }
    .fs-mobil{
        font-size: 16px;
    }
    .right-foot{
        display: none;
    }
}

@media (max-width: 576px) { 
    .pop-up-style-birth{
        font-size: 25px;
    }

    .ortala-birth{
        height: 100px;
        position:absolute;
        left: 50%;
        top: 20%;
        margin-left: -50px;
        margin-top: -50px;
    }
    .index-baslik{
        font-size: 25px;
    }
    .index-align{
        text-align: center;
    }

    ilk_baslik {font:25px 'Montserrat_Regular', Arial, sans-serif;color:#0C3959;white-space:nowrap; text-align:-webkit-center}
 }

 .index-header-bg{
    background-color: white;
}
 
 .carousel-inner .carousel-item.active,
.carousel-inner .carousel-item-start,
.carousel-inner .carousel-item-next,
.carousel-inner .carousel-item-prev {
    display: flex;
}  

 @media (min-width: 768px) {

    .carousel-inner .carousel-item-right.active,
    .carousel-inner .carousel-item-next,
    .carousel-item-next:not(.carousel-item-start) {
        transform: translateX(25%) !important;
    }

    .carousel-inner .carousel-item-left.active,
    .carousel-item-prev:not(.carousel-item-end),
    .active.carousel-item-start,
    .carousel-item-prev:not(.carousel-item-end) {
        transform: translateX(-25%) !important;
    }

    .carousel-item-next.carousel-item-start,
    .active.carousel-item-end {
        transform: translateX(0) !important;
    }

    .carousel-inner .carousel-item-prev,
    .carousel-item-prev:not(.carousel-item-end) {
        transform: translateX(-25%) !important;
    }
}

/* --------------------------------- */

/* --------------------------------- */

.carousel-indicators{
    flex-direction: column;
    bottom: 43% !important;
    left: 85% !important;
    width: 0px !important;
    padding-left: 42% !important; 

  }

  .carousel-indicators li {
    margin: 5px !important;
    background-color: #eae2e2 !important;
  }
   
  @media (max-width: 768px){
    .carousel-indicators {
      bottom: 20px;
      padding-left: 39% !important;
  }
  }
   
  @media (max-width: 576px){
    .carousel-indicators {
      padding-left: 37% !important;
      bottom: 20px !important;
  }
  }