@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;700&display=swap");
@font-face {
    font-family: 'Philosopher';
    src:  url('fonts/Philosopher-Regular.ttf') format('truetype');
  }

  .rezervasyon{
       background-color: #f6f9fd;
       font-family: 'Cabin', sans-serif;
       margin-top: 0;
       --font-weight: bold;
    }
.secim {
    border-radius: 1.5rem;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 3rem;
    background-color: #587074;
    color: #fff;
}
.secim label{
    color:white;
}
.secim_inputs {
    display: flex;
    align-items: center;
}
.far {
    font-weight: 400;
}
.fal, .far {
    font-family: "Font Awesome 5 Pro";
}
.fa, .fab, .fad, .fal, .far, .fas {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
}

.secim_alani{
    background-color: #587074;
    margin: 0;
    -border-radius: 1em 1em 0 0;
    padding: 2em;
    margin-top: 0.5em;

}
.secim_ic{
        width: 100%;
    max-width: 900px;
}
.secim_alani label{
    color:white;
}
.input_ikon{
    background-color: white;
    color: #346168;
    font-weight: bold;
    border-radius: 0.6rem 0 0 0.6rem;
    border:none;
    width: 30%;
    max-width: 50px;
}
.giris{
    width: 70%;
    max-width: 150px;
    border:none;
    border-radius: 0 0.6rem 0.6rem 0;
    padding: 0.6em;
}
.baslik{
    font-size: 1.5em;
    color:white
}
.detay{
   background-image: linear-gradient( 109.5deg, rgba(229,233,177,1) 11.2%, rgba(223,205,187,1) 100.2% );
   border: 3px double #deeee6 !important;
   color:#212529 !important;
   padding: 20px;
}
.dudp__calendar-header {
    background-color: #587074!important;
}
.dudp__wrapper{
    font-family: 'Philosopher', sans-serif !important;
}
.ara_butonu{
    background-color: #346168;
    border: none;
    border-radius: 3px;
    padding: 5px;
    min-width: 70px;
    color: white;
}
.ara_butonu:hover{ background-color: #0b7486; color:#fff;border:1px solid #fff;}

.odalar{
    border:1px solid #587074;
    margin-top: 0;
    padding-top: 1.5em;
    padding-bottom: 2em;
}
.oda{
    -margin:10px;
    padding: 0px;
    -border: 1px solid #6f7c76  !important;
    border-radius: 10px;
    box-shadow: 0 .5rem 1rem #dadada;
    transition: all 0.3s ease-out 0s;
    box-sizing:content-box;
    width: 85%;
    -background-image: radial-gradient( circle farthest-corner at 50.7% 54%,  rgba(204,254,152,1) 0%, rgba(229,253,190,1) 92.4% );
    background-color: #fff;
    transition: 0.3s;
    -webkit-transition: background-image 0.3s ease-in-out;
    transition: background-image 0.3s ease-in-out;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
}
.oda:hover{
    background-color: #587074;
    background-image: linear-gradient(132deg, #c8e3e7 0%, #67cfbb 100%);
    color:#202d2e;
    -border:#3461689d 1px solid !important;
    box-shadow: 0 .5rem 1rem #3461689d;
}
.dolu_oda{
    background-image: linear-gradient( 109.5deg,  rgba(229,233,177,1) 11.2%, rgba(223,205,187,1) 100.2% ) !important;
    color:#212529 !important;
    border: 3px double #deeee6 !important;
    box-shadow: 0 .5rem 1rem #dadada !important;
}
.dolu_oda:hover{
    background-image: linear-gradient( 109.5deg,  rgba(229,233,177,1) 11.2%, rgba(223,205,187,1) 100.2% ) !important;
    color:#212529 !important;
    border: 3px double #deeee6 !important;
    box-shadow: 0 .5rem 1rem #dadada !important;
}
.olanaklar{
    margin-top: 30px;
}
.olanaklar ul{
    padding-inline-start : 5px;
    list-style: none;
    display: block;
    float: left;
}
.olanaklar li{
    display: inline; padding: 0 10px;
}
.olanaklar .ikon{
    width: 20px;
}
.oda_resim{
    width: 100%;
    -padding: 5px;
    border-radius: 10px 10px  0 0 ;
    -webkit-border-radius: 10px 10px  0 0 ;
    -moz-border-radius: 10px 10px  0 0 ;
    -ms-border-radius: 10px 10px  0 0 ;
    -o-border-radius: 10px 10px  0 0 ;
}
.oda_detay{
    margin:20px;
    height: 200px;
}
.musaitlik{
    display: block;
    background-color: #346168;
    color: white;
    padding: 10px;
    height: 50px;
    padding-left: 15px;
    border-radius: 0 0 10px 10px;
    -webkit-border-radius: 0 0 10px 10px;
    -moz-border-radius: 0 0 10px 10px;
    -ms-border-radius: 0 0 10px 10px;
    -o-border-radius: 0 0 10px 10px;
    position: absolute;
    width: 100%;
    bottom: 0;
}
.musaitlikx{
    display: block;
    background-color: #869597;
    border-radius: 0 0 10px 10px;
    color: #333;
    padding: 10px;
    height: 50px;
    padding-left: 15px;
    position: absolute;
    width: 100%;
    bottom: 0;
}
.musaitlik img{
    width: 24px;
}
.musaitlik span{
    vertical-align:middle;
}
.uyari{
    background-color: rgb(107, 83, 39);
}
.dolu{
  filter: grayscale(100%);
  opacity: 0.7;
}

.alt{
    background-color: #202d2e;
    min-height: 50px;
    color:white;
    text-align: center;
    padding: 10px;
    margin-top: 1em;
}
.baslik{
    font-size: 2em;
    color: #202d2e !important;
    -text-shadow: #666 1px 1px;
}

.detaylar{
    border: 1px solid #dee2e6;
    max-height: 380px;
}
.f_baslik{font-size: 25px; font-weight:600; width:100%; border-bottom:2px solid #e6e6e6; padding-bottom:5px;}
.f16{font-size: 16px;}
.f18{font-size: 18px;}
.f20{font-size: 20px;}
.f25{font-size: 25px;}
.f28{font-size: 28px;}
#wrap {
width: 80%;
margin: 1em auto;
padding: 1em 5%;
position: relative;
height: 180px;
}

.inner {
position: relative;
z-index: 2;
}

#wrap:after {
content: "\f133";
font-family: 'Font Awesome\ 5 Free';
font-style: normal;
font-weight: normal;
text-decoration: inherit;
position: absolute;
font-size: 100px;
color: #8e8f91;
top: 10px;
left: 0px;
-margin: -300px 0 0 -200px;
z-index: 1;
}
.tarihx{
padding-top: 43px;
padding-left: 5px;
font-size: 35px;
width: 73px;
border:0px #333 solid;
text-align: center;
float: left;
}
.ay{
margin-top: -5px;
font-size: 15px;
}

.fiyat{
font-size: 1em;
text-align: end;
font-weight: bold;
padding-right: 20px;
bottom:50px;
position: absolute;
}
.oda:hover .fiyat{background-image: radial-gradient( circle 588px at 31.7% 40.2%,  rgba(225,200,239,1) 21.4%, rgba(163,225,233,1) 57.1% );}

.inputt{
border:1px solid #c5c5c5;
padding:5px;
}

.detay_ust{padding-top: 10px; background-image: linear-gradient( 174.2deg,  rgba(240,246,238,1)  7.1%, rgba(255,244,228,1) 67.4% );}
.detay_alt{border-top:dashed 2px #666; background-image: linear-gradient( 174.2deg,  rgba(255,244,228,1) 7.1%, rgba(240,246,238,1) 67.4% );}
@media screen and (min-width: 576px) and (max-width: 992px) {
.detay_alt{ margin-top:20px; border-top:none; background-image: linear-gradient( 174.2deg,  rgba(240,246,238,1)  7.1%, rgba(255,244,228,1) 67.4% );}
}

.detay_baslik{
border-top: 1px solid gray;
border-bottom: 1px solid gray;
padding: 5px 0;
}
font-weight: 700;
color:#d83565;