/* Contuctus */
.contact-modal-overlay {
    --contact-blue: #005fa8;
    --contact-bg-dark: rgba(0, 0, 0, 0.75);
    --contact-border: #ccc;
    --contact-radius: 8px;
    --contact-white: #ffffff;

    display: none;
    position: fixed;
    z-index: 10001;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: var(--contact-bg-dark);
    backdrop-filter: blur(4px);
    align-items: center;
    justify-content: center;
    padding: 15px;
    font-family: sans-serif;
    box-sizing: border-box;
}

.contact-modal-container {
    background: var(--contact-white);
    width: 100%;
    max-width: 650px;
    padding: 30px;
    border-radius: 12px;
    position: relative;
    box-shadow: 0 20px 50px rgba(0,0,0,0.4);
    animation: contactEntry 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
    
    max-height: 95vh;
    overflow-y: auto;
    box-sizing: border-box;
}

@keyframes contactEntry {
    from { opacity: 0; transform: scale(0.9) translateY(20px); }
    to { opacity: 1; transform: scale(1) translateY(0); }
}

.contact-close-icon {
    position: absolute;
    top: 15px;
    right: 20px;
    font-size: 34px;
    color: #bbb;
    cursor: pointer;
    line-height: 1;
    transition: color 0.2s;
    z-index: 10;
}
.contact-close-icon:hover { color: #333; }

.contact-header {
    margin-top: 0;
    color: var(--contact-blue);
    border-bottom: 2px solid #f0f0f0;
    padding-bottom: 12px;
    font-size: 26px;
}

.contact-subtext {
    font-size: 14px;
    color: #666;
    margin-bottom: 25px;
    line-height: 1.5;
}

.contact-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
}

.contact-grid-full { grid-column: span 2; }

.contact-field-label {
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 6px;
    color: #444;
    display: block;
}

.contact-field-input, .contact-field-area {
    padding: 11px;
    border: 1px solid var(--contact-border);
    border-radius: var(--contact-radius);
    font-size: 14px;
    width: 100%;
    box-sizing: border-box;
}

.contact-field-input:focus, .contact-field-area:focus {
    border-color: var(--contact-blue);
    outline: none;
    box-shadow: 0 0 0 3px rgba(0, 95, 168, 0.1);
}

.contact-field-area { height: 110px; resize: none; }

.contact-legal-info { font-size: 12px; color: #888; margin-top: 15px; }
.contact-legal-link { color: var(--contact-blue); text-decoration: none; }

.contact-footer-actions {
    margin-top: 25px;
    display: flex;
    gap: 12px;
    padding-bottom: 5px;
}

.contact-btn-send {
    background: var(--contact-blue);
    color: white;
    border: none;
    padding: 14px 20px;
    border-radius: var(--contact-radius);
    cursor: pointer;
    font-weight: 700;
    flex: 2;
    transition: background 0.2s;
}
.contact-btn-send:hover { background: #004a84; }

.contact-btn-clear {
    background: #f4f4f4;
    color: #555;
    border: none;
    padding: 14px 20px;
    border-radius: var(--contact-radius);
    cursor: pointer;
    flex: 1;
}

@media (max-width: 550px) {
    .contact-modal-overlay { align-items: flex-start; padding: 10px; }
    .contact-modal-container { padding: 20px; margin-top: 20px; }
    .contact-form-grid { grid-template-columns: 1fr; }
    .contact-grid-full { grid-column: span 1; }
}

/** Pagination ***/
/* Ana kapsayıcıyı tam merkezlemek için */
.pagination-section {
    display: flex;
    justify-content: center; /* Yatayda ortalar */
    align-items: center;
    width: 100%;
    margin: 30px 0; /* Üstten ve alttan 80px boşluk - Çok daha belirgin! */
}

.pagination-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px; /* Butonlar arası boşluğu biraz açtık */
}

.page-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 45px; /* Biraz daha büyüttük, tıklaması kolay olsun */
    height: 45px;
    border: 1px solid #dee2e6;
    border-radius: 50%; 
    color: #333;
    text-decoration: none;
    font-weight: 600; /* Yazıları biraz daha kalınlaştırdık */
    transition: all 0.3s ease;
    background-color: #fff;
}

.page-btn.active {
    background-color: #ff5722; 
    color: white;
    border-color: #ff5722;
    box-shadow: 0 6px 15px rgba(255, 87, 34, 0.4); /* Gölgeyi derinleştirdik */
    transform: translateY(-3px); /* Aktif olanı hafif yukarı kaldırdık */
}

.page-btn:hover:not(.active) {
    background-color: #fff5f2; /* Turuncuya yakın çok hafif bir arka plan */
    border-color: #ff5722;
    color: #ff5722;
    transform: translateY(-2px);
}

.page-dots {
    color: #adb5bd;
    padding: 0 8px;
    font-size: 1.2rem;
    letter-spacing: 2px;
}
/* --- Invoice Modern (Compact Version) --- */

.invoice_container {
    padding: 10px; 
    background-color: #f4f7f6;
    min-height: 100vh;
}

.invoice_card {
    background: #fff;
    max-width: 1000px;
    margin: 0 auto;
    padding: 15px; /* 20px'den 15px'e düşürüldü */
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
    border-radius: 8px;
}

.invoice_header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 2px solid rgb(0, 51, 102);
    padding-bottom: 8px; /* Biraz daha daraltıldı */
    margin-bottom: 12px; /* 15px'den 12px'e düşürüldü */
}

.invoice_title h1 {
    margin: 0;
    color: rgb(0, 51, 102);
    font-size: 20px; /* 22px'den 20px'e düşürüldü */
    letter-spacing: 1px;
    font-weight: 800;
}

.invoice_info_row {
    display: flex;
    justify-content: space-between;
    gap: 15px; 
    margin-bottom: 12px;
}

.invoice_company_details h4 {
    margin: 0 0 3px 0; 
    color: #333;
    font-size: 14px;
}

.invoice_company_details p {
    margin: 0; /* Satır boşluğu sıfırlandı */
    font-size: 11px; /* 12px'den 11px'e düşürüldü */
    color: #666;
    line-height: 1.3;
}

.invoice_meta_details {
    background: #f9f9f9;
    padding: 8px; 
    border-radius: 6px;
    min-width: 200px;
    border: 1px solid #eee;
}

.invoice_meta_item {
    display: flex;
    justify-content: space-between;
    font-size: 11px;
    margin-bottom: 2px;
}

.invoice_customer_section {
    display: flex;
    gap: 10px;
    margin-bottom: 12px;
}

.invoice_customer_box, .invoice_passengers_box {
    flex: 1;
    padding: 8px; 
    border: 1px solid #eee;
    border-radius: 6px;
}

.invoice_customer_box label, .invoice_passengers_box label {
    display: block;
    font-size: 9px; 
    color: #999;
    font-weight: bold;
    margin-bottom: 3px;
    text-transform: uppercase;
}

/* Tablo Tasarımı */
.invoice_table_wrapper {
    margin-bottom: 12px;
}

.invoice_table {
    width: 100%;
    border-collapse: collapse;
}

.invoice_table th {
    background-color: rgb(0, 51, 102);
    color: white;
    text-align: left;
    padding: 6px 8px; /* 8px'den 6px'e düşürüldü */
    font-size: 11px;
}

.invoice_table td {
    padding: 5px 8px; /* 8px'den 5px'e düşürüldü */
    border-bottom: 1px solid #eee;
    font-size: 11px;
    vertical-align: top;
}

.invoice_text_right { 
    text-align: right !important; 
}

.invoice_total_row td {
    border: none;
    padding: 3px 12px; /* 5px'den 3px'e düşürüldü */
}

.invoice_main_total td {
    background: #f9f9f9;
    font-weight: bold;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
}

.invoice_balance_row td {
    font-size: 14px; /* 16px'den 14px'e düşürüldü */
    color: #d32f2f;
    border-top: 1px solid #ddd;
    padding-top: 5px;
}

/* Footer (Bottom Note) */
.invoice_footer {
    margin-top: 15px; /* 30px'den 15px'e düşürüldü */
    padding-top: 10px;
    border-top: 1px solid #eee;
    text-align: center;
    font-size: 10px;
    color: #999;
}

/* Print Ayarı - Sayfada görünen o gereksiz marginleri öldürür */
@media print {
    @page { 
        margin: 0; /* Yazıcı kenar boşluklarını sıfırlar */
    }
    body { 
        margin: 0.8cm; /* Sadece içeriğin etrafında güvenli bir boşluk bırakır */
    }
    .invoice_container { padding: 0; background: white; }
    .invoice_card { box-shadow: none; padding: 0; max-width: 100%; }
}

/* --- Invoice Action Buttons --- */

.invoice_actions {
    text-align: center;
    margin-top: 30px;
    margin-bottom: 30px;
    display: flex;
    justify-content: center;
    gap: 15px;
    flex-wrap: wrap; /* Mobilde alt alta gelmesi için */
}

.invoice_btn {
    padding: 12px 24px;
    border-radius: 6px;
    border: none;
    cursor: pointer;
    font-size: 14px;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    gap: 8px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

/* Print Butonu (Yeşil Tonu) */
.btn_print {
    background-color: #2e7d32;
    color: white;
}

/* PDF Butonu */
.btn_pdf {
    background-color: #1976d2;
    color: white;
}

/* Link Kopyalama Butonu */
.btn_copy {
    background-color: #546e7a;
    color: white;
}

/* Hover Efektleri */
.invoice_btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
    filter: brightness(1.1);
}

.invoice_btn:active {
    transform: translateY(0);
}

/* Yazdırırken butonları gizle */
@media print {
    .invoice_actions {
        display: none !important;
    }
}

/* --- My Reservations Ek CSS --- */
.myreservation_container {
    max-width: 1200px; 
    margin: 0 auto;
    padding: 20px;
    font-family: sans-serif;
}

.myreservation_item {
    padding: 10px 0;
}

/* Satır Yapısı ve Dikey Üste Hizalama */
.myreservation_item .userentry_row {
    display: flex;
    gap: 20px;
    align-items: flex-start; /* İçerikleri en üste dayar */
    margin-bottom: 10px;
}

/* İçerik Metinleri */
.myreservation_content {
    font-size: 14px;
    color: #444;
    line-height: 1.6;
    word-break: break-word;
}

/* Linkler */
.myreservation_link {
    text-decoration: none;
    color: #007bff;
    font-weight: 500;
    transition: color 0.2s;
}

.myreservation_link:hover {
    color: rgb(0, 51, 102);
    text-decoration: underline;
}

/* Buton Grubu Düzeni */
.myreservation_button_group {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
}

/* --- MOBIL UYUM (800px altı için) --- */
@media (max-width: 800px) {
    .myreservation_item .userentry_row {
        flex-direction: column; /* Kolonları alt alta dizer */
        gap: 0;
    }

    .myreservation_item .loginmodal_input_group {
        width: 100% !important;
        margin-bottom: 20px;
        padding-bottom: 15px;
        border-bottom: 1px solid #f9f9f9; 
    }

    .myreservation_item .loginmodal_input_group:last-child {
        border-bottom: none;
        margin-bottom: 0;
    }

    .myreservation_item hr {
        border-top: 2px solid #eee; 
        margin: 30px 0;
    }
}

/* Login Modal ***/

.userentry_row {
    display: flex;
    gap: 20px;
    align-items: flex-end; /* Label boyları farklı olsa bile alt hizayı korur */
}

/* Hem input hem select için ortak kurallar */
.loginmodal_input_group input, 
.userentry_select {
    width: 100%;
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 6px;
    outline: none;
    box-sizing: border-box; /* Padding'in genişliği bozmasını engeller */
    height: 45px; /* İkisini de aynı yüksekliğe sabitler */
    font-size: 14px;
    background-color: #fff;
    transition: border-color 0.2s;
}

.loginmodal_input_group input:focus,
.userentry_select:focus {
    border-color: rgb(0, 51, 102);
}

.userentry_required {
    color: #ff4d4d;
}

.userentry_agent_box {
    background: #f8f9fa;
    padding: 15px;
    border-radius: 8px;
    margin-bottom: 20px;
}

@media (max-width: 480px) {
    .userentry_row {
        flex-direction: column;
        gap: 0;
    }
}

.loginmodal_close_wrapper {
    text-align: right;
    margin-top: -10px;
    margin-right: -10px;
    margin-bottom: 5px;
}

.loginmodal_close_btn {
    font-size: 28px;
    font-weight: 300;
    color: #aaa;
    cursor: pointer;
    line-height: 1;
    display: inline-block;
    padding: 5px 10px;
    transition: all 0.2s ease;
    user-select: none;
}

.loginmodal_close_btn:hover {
    color: #f44336;
    transform: scale(1.1);
}

.loginmodal_cancel_wrapper {
    margin-top: 15px;
    padding-top: 15px;
    border-top: 1px solid #eee;
    text-align: left;
}

.loginmodal_cancel_btn {
    background: #9e9e9e; /* Modern nötr gri */
    color: white;
    border: none;
    padding: 8px 18px;
    border-radius: 6px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    transition: background 0.2s ease;
    outline: none;
}

.loginmodal_cancel_btn:hover {
    background: #757575; /* Hover durumunda biraz daha koyu gri */
}

.loginmodal_cancel_btn:active {
    transform: translateY(1px); /* Tıklama hissi için hafif çökme */
}

.loginmodal_container {
    display: flex;
    justify-content: center;
    padding: 20px;
    font-family: sans-serif;
}

.loginmodal_card {
    background: #ffffff;
    width: 100%;
    max-width: 380px;
    border-radius: 10px;
    box-shadow: 0 8px 30px rgba(0,0,0,0.08);
    padding: 30px;
    border: 1px solid #f0f0f0;
}

.loginmodal_title {
    text-align: center;
    color: #222;
    font-weight: 600;
    margin-bottom: 25px;
    font-size: 1.5rem;
}

.loginmodal_input_group {
    margin-bottom: 18px;
}

.loginmodal_input_group label {
    display: block;
    margin-bottom: 6px;
    font-size: 13px;
    font-weight: 600;
    color: #444;
}

.loginmodal_input_group input {
    width: 100%;
    padding: 12px;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    outline: none;
    transition: all 0.2s ease;
    box-sizing: border-box;
}

.loginmodal_input_group input:focus {
    border-color: rgb(0, 51, 102);
    box-shadow: 0 0 0 3px rgba(0, 51, 102, 0.1);
}

.loginmodal_submit_btn {
    width: 100%;
    padding: 12px;
    background: rgb(0, 51, 102);
    color: #fff;
    border: none;
    border-radius: 6px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s;
    margin-top: 10px;
}

.loginmodal_submit_btn:hover {
    background: rgb(0, 40, 80);
}

.loginmodal_remember_label {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 15px;
    font-size: 13px;
    color: #666;
    cursor: pointer;
}

.loginmodal_footer {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #eee;
    display: flex;
    flex-direction: column;
    gap: 10px;
    text-align: center;
}

.loginmodal_register_link {
    text-decoration: none;
    color: rgb(0, 51, 102);
    font-size: 14px;
    font-weight: 500;
}

.loginmodal_forgot_link {
    text-decoration: none;
    color: #999;
    font-size: 12px;
}

.loginmodal_register_link:hover, .loginmodal_forgot_link:hover {
    text-decoration: underline;
}


/*** Ship Modal ****/
.ship-grid-wrapper {
    display: grid;
    /* Her satırda tam 4 adet eşit genişlikte sütun oluşturur */
    grid-template-columns: repeat(4, 1fr); 
    gap: 12px;
    padding: 10px 0;
    width: 100%;
}

.ship-container {
    /* Container artık genişlik hesaplaması yapmaz, grid onu yönetir */
    border: 1px solid #e0e0e0;
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
    display: flex; /* İçindeki header'ın tam yayılması için */
}

.ship-header {
    /* flex: 1 1 calc... kısmını sildik, çünkü grid-item artık container */
    width: 100%; 
    min-height: 50px; /* Kutuların çok basık durmaması için alt sınır */
    background-color: #007BFF;
    color: #ffffff !important;
    padding: 10px !important;
    text-align: center !important;
    cursor: pointer !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    transition: all 0.3s ease !important;
}
.ship-header span {
    font-size: 13px; /* Yazı boyutunu 4'lü dizilim için optimize ettik */
    font-weight: 500;
    color: #fff; /* Header mavi olduğu için yazıyı beyaz yaptık */
    line-height: 1.2;
    /* Çok uzun isimlerde kutu patlamasın diye kelime kaydırma */
    word-break: break-word; 
    display: -webkit-box;
    -webkit-line-clamp: 2; /* Maksimum 2 satır, sonra ... koyar (isteğe bağlı) */
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.ship-header:hover {
    background-color: #0056b3;
}

.ship-header.active {
    background: #004a99;
    box-shadow: inset 0 2px 5px rgba(0,0,0,0.2);
}

@media (max-width: 768px) {
    .ship-grid-wrapper {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 480px) {
    .ship-grid-wrapper {
        grid-template-columns: 1fr;
    }
}
    .status-icon {
        font-size: 18px;
        color: #888;
        transition: transform 0.3s ease;
    }

    .ship-header.active .status-icon {
        transform: rotate(45deg); /* + işaretini x yapar veya yönünü değiştirir */
        color: #d32f2f;
    }

    /* Detay Paneli (Expand Area) */
    .ship-content {
        display: none; /* JS ile kontrol edilecek */
        padding: 20px;
        border-top: 1px solid #eee;
        animation: fadeIn 0.4s ease;
    }

    @keyframes fadeIn {
        from { opacity: 0; transform: translateY(-10px); }
        to { opacity: 1; transform: translateY(0); }
    }

    /* Tekne Slider Alanı */
.ship-slider-wrapper {
        position: relative;
        width: 100%;
        height: 350px; /* EKLE: Slider'ın toplam yüksekliğini sabitledik */
        background: #000;
        border-radius: 6px;
        overflow: hidden;
        margin-bottom: 15px;
        box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    }

.ship-slides {
        display: none; 
        width: 100%;
        height: 100%;    /* GÜNCELLE: 'auto' yerine '100%' yaparak wrapper'a eşitledik */
        object-fit: cover; /* ÖNEMLİ: Resim ne boyutta olursa olsun kutuyu zıplatmaz, kırparak doldurur */
        object-position: center; /* EKLE: Resmi ortalar */
    }

    /* Slider Okları (Önceki-Sonraki) */
    .modal-img-prev, .modal-img-next {
        cursor: pointer;
        position: absolute;
        top: 50%;
        width: auto;
        padding: 16px;
        margin-top: -22px;
        color: white;
        font-weight: bold;
        font-size: 20px;
        transition: 0.6s ease;
        border-radius: 0 3px 3px 0;
        user-select: none;
        background-color: rgba(0,0,0,0.3);
        text-decoration: none;
    }

    .modal-img-next {
        right: 0;
        border-radius: 3px 0 0 3px;
    }

    .modal-img-prev:hover, .modal-img-next:hover {
        background-color: rgba(0,0,0,0.8);
    }

    /* Açıklama Metni */
    .ship-description {
        font-size: 14px;
        line-height: 1.6;
        color: #444;
        text-align: justify;
    }






/** info - button **/
.info-btn:hover {
    filter: brightness(0) grayscale(1);
}

/***** upload hotelimages */

.loader {
    border: 3px solid #f3f3f3;
    border-top: 3px solid #3498db;
    border-radius: 50%;
    width: 20px;
    height: 20px;
    animation: spin 1s linear infinite;
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.upload-section {
    max-width: 900px;
    margin: 30px auto;
    padding: 20px;
    background: #ffffff;
    border-radius: 12px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08);
}

/* Otel Başlığı (Delphi'den gelen h1 için) */
.upload-section h1 {
    font-weight: 300;
    margin-bottom: 25px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* Modern Drop Zone (Sürükle-Bırak/Seçim Alanı) */
.modern-drop-zone {
    border: 2px dashed #cbd5e0;
    border-radius: 12px;
    padding: 50px 20px;
    text-align: center;
    background: #f8fafc;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    color: #64748b;
    margin-bottom: 30px;
}

.modern-drop-zone:hover {
    background: #f1f5f9;
    border-color: #3498db;
    color: #3498db;
    transform: translateY(-2px);
}

.modern-drop-zone p {
    margin: 0;
    font-size: 1.1rem;
}

.modern-drop-zone strong {
    color: #3498db;
    font-weight: 600;
}

/* Galeri Alanı (Küçük resimlerin dizildiği yer) */
.gallery-grid {
    display: flex;
    flex-wrap: wrap;       /* Yan yana dizilir, sığmazsa alta geçer */
    gap: 12px;             /* Resimlerin arasındaki jilet gibi boşluk */
    justify-content: flex-start; /* Sola yaslı başlar */
    padding: 10px 0;
}

/* Küçük Resimler (Thumbnails) */
.gallery-grid img {
    width: 100px;          /* Kibar, küçük boyut */
    height: 100px;         /* Kare görünüm */
    object-fit: cover;     /* Resim bozulmadan kareye sığar */
    border-radius: 8px;    /* Hafif yuvarlak köşeler */
    border: 1px solid #e2e8f0;
    background-color: #fff;
    transition: all 0.2s ease;
}

/* Resimlerin üzerine gelince büyüme efekti */
.gallery-grid img:hover {
    transform: scale(1.1);
    z-index: 10;
    box-shadow: 0 8px 15px rgba(0,0,0,0.2);
    border-color: #3498db;
}

/* Mobil uyum: Ekran daralınca resimler ortalansın */
@media (max-width: 600px) {
    .gallery-grid {
        justify-content: center;
    }
}

/* Konteynerin buton için referans olması şart */
.hotel-gal-image-container { 
    position: relative; 
    display: inline-block; 
}

/* X Butonu - Tam sağ üst köşe */
.hotel-gal-delete-btn {
    position: absolute;
    top: -8px;    /* Resmin biraz üstüne taşar, daha belirgin olur */
    right: -8px;  /* Resmin biraz sağına taşar */
    background: #ff4757; /* Canlı bir kırmızı */
    color: white;
    border: 2px solid #ffffff; /* Beyaz çerçeve X'i patlatır */
    border-radius: 50%;
    width: 24px;
    height: 24px;
    cursor: pointer;
    display: none; /* Sadece hover olunca çıksın */
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-family: Arial, sans-serif;
    font-weight: bold;
    box-shadow: 0 2px 6px rgba(0,0,0,0.2);
    z-index: 100;
    line-height: 1;
    padding: 0;
}

/* Mouse ile üzerine gelince X çıksın */
.hotel-gal-image-container:hover .hotel-gal-delete-btn {
    display: flex;
}

.hotel-gal-delete-btn:hover {
    background: #ff0000;
    transform: scale(1.1);
}



/**** Modal Container **************************/
.modal-container{
  max-width: 800px;
  margin: 0 auto;
  padding: 20px 24px;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0,0,0,.08);
}
.modal-h3 {font-size:20px; font-weight:600;color:#004c7a; text-align:center; margin-bottom:25px;}
.modal-h4 {font-size:20px; font-weight:600;color:#004c7a; text-align:left; margin-bottom:25px;}
.modal-h5 {font-size:16px; font-weight:600;color:#004c7a; text-align:left;margin-bottom:5px;}

.modal-info-box{
  background:#fafafa;
  border: 1px solid #dddddd;
  border-radius: 6px;
  padding: 12px 14px;
  margin-bottom: 18px;
}
.modal-info-box p{ 
  margin: 2px 0; 
  font-size: 14px;
  line-height: 1.4;
}
.modal-image-box{
  background: #ffffff;
  border: 1px solid #dddddd;
  border-radius: 6px;
  padding: 18px;
  margin: 14px 0 20px;
  box-shadow: 0 0 5px rgba(0,0,0,0.05);
}

.modal-slider{
  position: relative;
  width: 100%;
  height: 400px; 
  border-radius: 8px;
  overflow: hidden;
  margin-bottom: 10px;
  background:#0002;
}
.modal-dots{ text-align:center; margin:6px 0 0 ;}

.modal-img-prev, .modal-img-next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  transform: translateY(-50%); /* Tam dikey orta */
  width: auto;
  padding: 16px;
  color: white;
  font-weight: bold;
  font-size: 20px;
  background-color: rgba(0,0,0,0.3);
  user-select: none;
  z-index: 100;
  text-decoration: none;
}

.modal-img-next { right: 0; border-radius: 3px 0 0 3px; }
.modal-img-prev { left: 0; border-radius: 0 3px 3px 0; }

.modal-img-prev:hover, .next:hover {
  background-color: rgba(0,0,0,0.8);
}

/*** Booking Cart **************************/

.cart-dynamictour {
  background:#FFFBEF;
  border:1px solid #F3EBD0;
  border-radius:12px;
  padding:14px 20px;
  margin:16px auto 18px;
}

.cart-dynamictour-header{ display:flex; justify-content:center; gap:20px; flex-wrap:wrap; }
.cart-dynamictour-title { font-weight:600; color:#6b3a00; }

.bookingcart-tot-price{
  background:#f9f5e9;
  border-top:2px solid #e3d39c;
  font-weight:700;
  font-size:18px;
  color:#705b2f;
}

.booking-chart-user input::placeholder {
  color: #d1d1d1;
  opacity: 1; /* Firefox varsayılan olarak opaklığı düşürür, bunu 1 yaparak rengi netleştiriyoruz */
}
.booking-chart-user {display:grid;grid-template-columns:1fr 1fr;gap:12px 20px;}
.booking-chart-user label{display:flex;flex-direction:column;font-weight:450;color:#6b3a00;font-size:14px;}
.booking-chart-user input,.booking-chart-user select{margin-top:4px;padding:8px 10px;border:1px solid #e6d8a3;border-radius:6px;font-size:15px;font-weight:300;}
.booking-chart-user input:focus,.booking-chart-user select:focus{outline:2px solid #bfa76f;}
@media (max-width: 600px) {
  .booking-chart-user {
    grid-template-columns: 1fr;
  }
}
.col-nr { flex: 0.3; font-weight: bold; color: #bfa76f; text-align: center; }
.col-mini { flex: 0.6; }
.col-wide { flex: 1.5; }
.col-medium { flex: 1.2; }
.bookingcart-passenger-header {
  background:#fffaf0;
  display: flex;
  gap: 10px;
  font-weight: bold;
  font-size: 14px;
  color: #6b3a00;
  padding: 10px 0;
  border-bottom: 2px solid #e6d8a3;
  margin-bottom: 15px;
}

.bookingcart-passenger-row {
  display: flex;
  gap: 10px;
  margin-bottom: 10px;
  align-items: center;
}

.bookingcart-passenger-row input, 
.bookingcart-passenger-row select {
  width: 100%; 
  margin-top: 4px;
  padding: 8px 10px;
  border: 1px solid #e6d8a3;
  border-radius: 6px;
  font-size: 15px;
  background-color: white; 
  height: 40px; 
  box-sizing: border-box; 
}

.bookingcart-passenger-row input:focus,
.bookingcart-passenger-row select:focus {
  outline: 2px solid #bfa76f;
}

@media (max-width: 768px) {
  .bookingcart-passenger-header { display: none; }
  .bookingcart-passenger-row {
    flex-direction: column;
    align-items: flex-start;
    border: 1px solid #e6d8a3;
    padding: 15px;
    border-radius: 10px;
    margin-bottom: 20px;
  }
  .bookingcart-passenger-row > div { width: 100%; }
  .col-nr { text-align: left; border-bottom: 1px solid #eee; padding-bottom: 5px; margin-bottom: 10px; }
}
/*** Tou Page **************************/

.tour-page-title {background: #fffdf4;border: 1px solid #fef3c7;border-radius: 10px;padding-bottom:4px;margin: 10px 0px;box-shadow: 0 3px 6px rgba(0,0,0,0.05);text-align: center;}
.tour-page-h1 { font-size: 24px; font-weight: 800; color: #0f172a;}
.tour-page-tab-title { font-size: 24px; font-weight: 700; margin: 24px 0 12px; color: #92400e; }
.tour-page-card-h3 {font-size: 18px; font-weight: 700; margin: 16px 0 8px; color: #1f2937;}
.tour-page-title-id {}
.tour-page-card {background: #ffffff;border-radius: 14px;box-shadow: 0 4px 14px rgba(0,0,0,0.08);overflow: hidden;display: flex;gap: 12px;align-items: stretch;margin-bottom:20px;}
.tour-page-card-image {flex: 0 0 26%;max-width: 480px;object-fit: cover;object-position: center;height: 100%;display: block;}
.tour-page-card-price {font-size: 18px; font-weight: 700; color: #92400e;}
.tour-page-card-body {flex: 1;padding: 16px 24px;display: flex;flex-direction: column;gap: 8px;}
.tour-page-muted {padding: 5px 0;color:#6b7280;}
.tour-page-card-body {flex: 1;padding: 16px 24px;display: flex;flex-direction: column;gap: 8px;}
.tour-page-hotel-list-item {display: grid;grid-template-columns: 1fr auto;align-items: center;width: 100%;column-gap: clamp(40px, 8vw, 200px);background: #fffdf4;border: 1px solid #fef3c7;border-radius: 10px;padding: 8px 10px;}
.tour-page-hotel-info {font-size: 14px;font-weight: 400;color: #0f172a;}
.tour-page-hotel-meta {justify-self: end;text-align: right;font-size: 14px;white-space: nowrap;}
.tour-page-card-footer {display: flex;align-items: center;justify-content: space-between;gap: 16px;margin-top: auto;padding-top: 8px;}
.tour-page-btn-primary {border: none;border-radius: 8px;padding: 12px 20px;font-weight: 700;cursor: pointer;width: 220px;text-align: center;display: inline-block;text-decoration: none;background:#d97706;color: #fff;}
.tour-page-btn-primary { background:#003366; }
.tour-page-btn-similar {border: 1px solid #fcd34d;border-radius: 8px;padding: 12px 20px;font-weight: 700;cursor: pointer;width: 180px;text-align: center;display: inline-block;text-decoration: none;background: transparent;color: #92400e;}
.tour-page-btn-similar:hover { background:#fef9c3; }
.tour-page-tabs {position: sticky;display: grid;top:0px;z-index:101;grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));background: #fef9c3;border-radius: 10px 10px 0 0;padding: 12px 20px;margin-top: 30px;}
.tour-page-tab {background: none;border: none;font-size: 14px;font-weight: 600;color: #444;cursor: pointer;padding: 10px 0;position: relative;text-align: center;}
.tour-page-tab.active { color: #000; }
.tour-page-tab.active::after {content: "";position: absolute;left: 20%;right: 20%;bottom: -2px;height: 3px;background: #d97706;border-radius: 2px;}
.tour-page-tab-content { display: none; }
.tour-page-info-box {background: #fff;border: 1px solid #e5e7eb;border-radius: 0 0 12px 12px;padding: 20px;margin-bottom: 20px;box-shadow: 0 4px 14px rgba(0,0,0,0.08);color: #0F172A;}
.tour-page-info-box.active, .tour-page-tab-content.active { display: block; }
.tour-page-tab-group {padding:16px 0; border-top:1px solid #ccc; cursor:pointer;}
.tour-page-tab-grpcontent {font-weight:bold; display:flex; justify-content:space-between; align-items:center;}


/*** Tour Pdf **************************/

.pdf-letterhead {width: 100%;margin-bottom: 20px;margin-top: 20px;padding-bottom: 20px;}
.brand-container::after {content: "";clear: both;display: table;}
.brand-logo {float: left;height: 65px;width: auto;margin-right: 20px;}
.brand-details {float: right;text-align: right;}
.brand-name {font-size: 20px;font-weight: bold;color: #000;margin: 0 0 5px 0;}
.brand-contact {font-size: 13px;line-height: 1.5;color: #333;}
.brand-contact p {margin: 0;}
.brand-contact a {text-decoration: none;color: inherit;}

@media print {

@page {
    size: auto; 
    margin: 40px 40px 40px 40px !important; /* cm yerine px deneyelim */
  }

.tour-page-tab-group {
    display: none !important;
  }

.tour-page-card-footer {
        margin-top: 0 !important;      
        padding-top: 0 !important;
        gap: 8px !important;
        border-top: none !important;
 }

.tour-page-card {
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}
.tour-page-info-box {
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

  .tour-page-tab-title {font-size: 15px;}
  .tour-page-card-h3 {font-size: 14px;padding:0px;margin:0px;}
  .tour-page-h1 {font-size:15px;padding:0px;margin:2px;}
  .tour-page-card-image {flex: 0 0 auto;height: 380px;width: auto;object-fit: contain;display: block;}
  .tour-page-card-price {font-size: 14px;}
  .tour-page-card-body {padding: 2px 4px;}
  .tour-page-muted {padding: 0px 0px;}
  .tour-page-hotel-list-item {padding: 1px 10px !important;
    display: flex !important;
    justify-content: space-between !important;
  }
}

@media (max-width: 950px) {
  .tour-page-card { flex-direction: column; }
  .tour-page-card-image {
    flex: 1 1 auto;
    width: 100%;
    max-width: none;
  }
  .tour-page-hotel-list-item {
    grid-template-columns: 1fr;
    column-gap: 0;
  }
  .tour-page-hotel-meta {
    justify-self: start;
    text-align: left;
    margin-top: 4px;
  }
}

/*** Tour Page Son **************************/

/************* Slide ***************************/

#slider {position: relative;overflow: hidden;}
#slide-image {width: 100%;height: 100%;object-fit: cover;filter: brightness(0.6);transition: opacity 0.3s ease;z-index: 0;}
.slider-arrow {position: absolute;top: 50%;transform: translateY(-50%);width: 40px;height: 40px;background-color: white;border-radius: 50%;display: flex;align-items: center;
  justify-content: center;cursor: pointer;box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);z-index: 10;user-select: none;transition: all 0.2s ease;}
#prev {left: 20px;}
#next {right: 20px;}
.slider-arrow:hover {background-color: #f0f0f0;transform: translateY(-50%) scale(1.1);}
.arrow-icon {width: 24px;height: 24px;}
@media (max-width: 600px) {
  #prev {
    left: 10px;
  }
  #next {
    right: 10px;
  }
}

@media (max-width: 850px) {
  #slide-text {
    display: none;
  }
.slider-arrow {
    display: none;
  }
}
#slide-caption {position: absolute;top: 40%;left: 50%;transform: translate(-50%, -50%);color: white;font-size: 1rem;font-weight: bold;text-shadow: 0 0 10px rgba(0,0,0,0.6);
  transition: opacity 0.3s ease;pointer-events: none;text-align: center;white-space: nowrap;}
.line1 {display: inline-block;font-weight: bold;font-size:40px;padding-block: 20px;}
.line2 {display: inline-block;font-style: bold;font-size:18px;padding-block: 20px;}
.line3 {display: inline-block;font-weight: normal;font-size:18px;}
.slide-button {padding:10px 18px;border-radius:999px;font-weight:700;transition:transform .2s ease,background .2s ease;position: absolute;top: calc(50% + 6vw);left: 50%;
  transform: translateX(-50%);text-decoration: none;box-shadow: 0 2px 6px rgba(0,0,0,0.2);display: none;font-size: 16px;color: #fff;}

/************* Slide Son ***************************/
 
/************ Top Scrooll ****************/

#scrollToTop {position: fixed;bottom: 20px;right: 20px;width: 30px;height: 30px;font-size: 12px;background-color: rgb(17, 24, 39);color: white;border: 2px solid white;       
  border-radius: 50%;cursor: pointer;display: none;z-index: 1000;box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);transition: background-color 0.3s ease;}

/************ Top Scrooll son ****************/

/*********** COOKIE BAR  *************************/

.cookiebar{position:fixed;bottom:10px;left: 50%;transform: translateX(-50%);background:#111827;color:#fff;padding:12px;border-radius:10px;display:none;z-index:1500;width:90%;}
.cookiebar .actions{display:flex;gap:10px;margin-top:8px}
.cookiebar button{padding:8px 12px;border:none;border-radius:6px;cursor:pointer}
.cookie-ok{background:#10b981;color:#fff}
.cookie-more{background:#374151;color:#fff}

/*********** COOKIE BAR  *************************/

/* Home Card */

.card{border:1px solid #e5e7eb;border-radius:12px;overflow:hidden;background:#fff;display:flex;flex-direction:column;box-shadow:0 2px 6px rgba(0,0,0,0.06);transition:transform .2s ease,box-shadow .2s ease}
.card:hover{transform:translateY(-4px);box-shadow:0 6px 16px rgba(0,0,0,0.12)}
.card-media img{width:100%;height:200px;object-fit:cover;display:block}
.card-body{padding:16px;flex:1}
.card-body h3{font-size:16px;margin:0 0 8px;color:#111827}
.card-body p.intro{font-size:14px;margin:0 0 12px;color:#374151}
.card-body ul{margin:0;padding-left:18px;font-size:13px;color:#4b5563}
/* Footer mit Dauer | Preis | Button */
.card-footer {
  display: flex;
  align-items: center;
  padding: 14px 16px;
  border-top: 1px solid #e5e7eb;
  background: #fafafa;
}

.card-footer .duration {
  font-size: 14px;
  color: #374151;       /* gleiche Farbe wie Intro */
  font-family: inherit; /* gleiche Schrift wie Intro */
  flex: 1;
  text-align: left;
}

.card-footer .price {
  font-weight: 700;
  color: #d97706;
  font-size: 15px;
  flex: 1;
  text-align: center;
}

.card-footer .btn {
  background: #d97706;
  border-radius: 8px;
  padding: 8px 14px;
  font-size: 13px;
  text-decoration: none;
  color: #fff;
  flex: 1;
  text-align: right;
}

.card-footer .btn:hover {
  background: #b45309;
}

/* Root Category Card */
.categoty-list-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  padding: 20px 2px;
}

@media (max-width: 1100px) {
  .categoty-list-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 900px) {
  .categoty-list-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 650px) {
  .categoty-list-grid {
    grid-template-columns: repeat(1, 1fr);
  }
}


/* Root Most popular Card */
.popular-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  padding: 20px 2px;
}
.popular-card{border:1px solid #e5e7eb;border-radius:12px;overflow:hidden;background:#fff;display:flex;flex-direction:column;box-shadow:0 2px 6px rgba(0,0,0,0.06);transition:transform .2s ease,box-shadow .2s ease}
.popular-card:hover{box-shadow:0 6px 16px rgba(0,0,0,0.12)}
.popular-card-media {position: relative;}
.popular-card-media img{width:100%;height:200px;object-fit:cover;display:block;}
.popular-card-body{padding:16px;flex:1}
.popular-card-body h3{font-size:16px;margin:0 0 8px;color:#111827}
.popular-card-body p.intro{font-size:14px;margin:0 0 12px;color:#374151}
.popular-card-body ul{margin:0;padding-left:18px;font-size:13px;color:#4b5563}
.popular-h3 {
  font-weight:700;
  line-height:25.6px;
}

.popular-card-description {
  line-height:22.4px;
  font-size:14px;
  color:rgb(55, 65, 81);
}

.popular-card-footer {
  display: flex;
  align-items: center;
  padding: 14px 16px;
  border-top: 1px solid #e5e7eb;
  background: #fafafa;
}

.popular-card-footer .duration {
  font-size: 14px;
  color: #374151;       /* gleiche Farbe wie Intro */
  font-family: inherit; /* gleiche Schrift wie Intro */
  flex: 1;
  text-align: left;
}

.popular-card-footer .price {
  font-weight: 700;
  color: #d97706;
  font-size: 15px;
  flex: 1;
  text-align: left ;
}

.popular-card-footer .btn {
  background: #d97706;
  border-radius: 8px;
  padding: 8px 14px;
  font-size: 13px;
  text-decoration: none;
  color: #fff;
  flex: 1;
  text-align: right;
}

.popular-card-footer .btn:hover {
  background: #b45309;
}

.popular-card-overlay-icon {
  position: absolute;
  top: 8px;
  left: 8px;
  z-index: 2;
  width: 28px;
  height: 28px;
}

.popular-card-overlay-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

@media (max-width: 1000px) {
  .popular-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 750px) {
  .popular-grid {
    grid-template-columns: 1fr;
  }
}

/* ------------------------Footer kısmı ------------------------ */
/* Footer white */

.footer-white {padding: 20px 10px;font-size: 14px;border-top:1px solid #d1d5db;margin-top:30px;}
.footer-container-white {max-width: 1300px;margin: 0 auto;padding: 0 20px;}
.footer-grid-white {display: grid;flex-wrap: wrap;gap: 20px;grid-template-columns: repeat(3, 1fr);}
.footer-col-white {background:#f9fafb;padding:10px;border-radius:8px;}

.social-icons{display:flex;gap:12px;margin-top:12px;align-items:center;flex-wrap:wrap}
.social-icons a{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:9999px;background:#f3f4f6;color:#1f2937;text-decoration:none}
.social-icons a:hover{background:#e5e7eb}
.social-icons svg{width:20px;height:20px;fill:currentColor}

.contact-button svg{width:18px;height:18px;fill:currentColor;margin-right:8px;}

.newsletter-box input {width:100%;padding:10px 14px;font-size:14px;border-radius:6px;background:#fff;color:#111827;border:1px solid #d1d5db;box-sizing:border-box;margin:3px;}

.footer-button {display: inline-flex;flex-direction: row;justify-content: flex-start;gap: 8px;padding: 10px 14px;font-size: 14px;font-weight: 500;border-radius: 6px;
  background: #f3f4f6;color: #111827;border: 1px solid #d1d5db;cursor: pointer;transition: background .2s ease, border-color .2s ease;margin: 3px;text-decoration: none;width:100%;}

.contact-button {font-size: 14px;border-radius: 6px;display: flex;flex-direction: column;align-items: left;}

.contact-iframe {width:100%;height:187px;border:0;border-radius:6px;}

.footer-button:hover {background:#e5e7eb;border-color:#9ca3af;text-decoration:underline;}

@media (max-width: 1100px) {
  .footer-grid-white {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 850px) {
  .footer-grid-white {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 550px) {
  .footer-grid-white {
    grid-template-columns: 1fr;
  }
}

/* Footer */

.site-footer {padding: 20px 10px;font-size: 12px;background: #111827;color:#e5e7eb;}
.footer-grid {display: flex;flex-wrap: wrap;gap: 20px;}
.footer-col {flex: 1 1 220px;background:#1f2937 ;padding:7px;border-radius:8px;}
.footer-links {list-style: none;padding: 0;margin: 0;}
.footer-col li {list-style-type:none;padding-left:0;}
.footer-col ul {list-style-type:none;padding-left:0;margin-left:0;columns:2;column-gap:20px;}
.footer-col p {margin:6px 0;}
.site-footer a {text-decoration: none;}
.site-footer a:hover {text-decoration:underline;}
.footer-bottom {text-align: center;color: rgb(177, 177, 177);font-size: 12px;padding: 20px 0;}
.footer-container {max-width: 1300px;margin: 0 auto;padding: 0 20px;}
@media (max-width: 1100px) {
  .footer-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 850px) {
  .footer-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 550px) {
  .footer-grid {
    grid-template-columns: 1fr;
  }
}

/****************************** Footer Buraya kadar *************************/

/******************** Header *************************/

header {position:sticky;top:0;z-index:100;background:#ffffffcc;backdrop-filter:blur(8px);border-bottom:1px solid #e5e7eb;transition:all .25s ease;}
.header-wrap {max-width:1300px;margin:0 auto;padding:14px 16px;display:flex;align-items:center;justify-content:space-between;gap:16px;}
.header-image {display:flex;align-items:center; gap:10px;}
nav{position:relative;display: flex;margin-right:90px;}
nav ul{list-style:none;display:flex;gap:16px;margin:0;padding:0;align-items:center}
nav a{color:#111827;font-weight:500;font-size:15px;position:relative;padding:6px 0}
nav a::after{content:"";position:absolute;left:0;bottom:-3px;width:0;height:2px;background:#d97706;transition:width .3s ease}
nav a:hover::after{width:100%}
nav ul li.dropdown{position:relative}
nav ul li .dropdown-menu{display:none;position:absolute;top:100%;left:0;border:1px solid #e5e7eb;border-radius:6px;box-shadow:0 4px 10px rgba(0,0,0,.1);padding:8px 0;min-width:240px;white-space:nowrap;z-index:1000;background:#fff;}
nav ul li.dropdown:hover > .dropdown-menu{display:block}
nav ul li .dropdown-menu li{list-style:none}
nav ul li .dropdown-menu li a{display:block;padding:10px 14px;color:#111827;font-size:14px;font-weight:400;text-decoration:none;white-space:nowrap}
nav ul li .dropdown-menu li a:hover{background:#f3f4f6;color:#d97706;border-radius:4px}
nav ul li .dropdown-menu:empty{display:none!important}
.menu-toggle {display:none;font-size:20px;font-weight:700;cursor:pointer;padding:8px 12px;margin-left:auto;border: none;background: transparent;}
.menu-close {position: absolute;top: 20px;right: 20px;background: transparent;border: none;padding: 0;cursor: pointer;z-index: 102;display:none;}
body.menu-open::before {content: "";position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,0.4);z-index: 99;}
.dropdown-arrow {margin-left: auto;transition: transform 0.3s ease;display:none;}
@media (max-width:1100px){
	.menu-toggle {display: block;}
	.dropdown-arrow {display: block;}
	nav {margin-right:10px;}
	.menu-list {position: fixed;top: 70px;height: auto ;left: -100%;width: 100%;flex-direction: column;background: #fff;padding: 40px 20px;box-shadow: -4px 0 10px rgba(0,0,0,.15);transition: left .3s ease;display: flex;}
	.menu-list.active {left: 0;}
	nav ul li.dropdown:hover > .dropdown-menu {display: none;}
	.dropdown {cursor: pointer;}
	nav ul li.dropdown.open > .dropdown-menu {display: block;}
	nav {display: block !important;}
	nav ul li.dropdown {text-align: left;width: 100%;}
	nav ul li .dropdown-menu {position: static;display: none;padding-left: 16px;border: none;box-shadow: none;background: transparent;min-width: auto;}
	.menu-close {display: block;}
}

/******************** Header buraya kadar ******************/

/* Search ------------------------------------------- */
.search-wrapper {
  width: 90%;
  max-width: 1250px;
  margin: 0 auto; /* Ortalamak için */
  margin-top:-3rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 16px;
  padding: 12px;
  border: 0px;
  border-radius: 12px;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.1);
  background: #fff;
  position: relative;
  z-index: 2;
}

@media (max-width: 900px) {
  .search-wrapper {
    margin-top: 20px;
  }
}

/* Şehir kutuları */
.city-box {
  flex: 1 1 300px;
  padding: 10px;
  border-radius: 8px;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Başlık */
.city-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}

.city-header label {
  font-weight: 600;
}
.select-nights,
.select-hotel {
  width: 100%;
  padding: 0.5rem 2.5rem 0.5rem 0.75rem; /* Sağda ok için boşluk */
  border: 1px solid #ccc;
  border-radius: 6px;
  background-color: #fff;
  color: #333;
  appearance: none; /* Tarayıcı varsayılan stilini kaldırır */
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 140 140' xmlns='http://www.w3.org/2000/svg'%3E%3Cpolyline points='30,50 70,90 110,50' stroke='%23333' stroke-width='15' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  background-size: 1rem;
  cursor: pointer;
}

/* Gece sayısı kutusu özel genişlik */
.select-nights {
  max-width: 140px;
}


/**************** Search son ******************/

/************* Tour Category Card / Similar / Favorite ******************/ 

.tourdet-grid {display: grid;grid-template-columns: repeat(1, 1fr);gap: 16px;padding: 1px;width: 100%;box-sizing: border-box;}
.tour-card {display:flex;align-items: stretch;gap:20px;background: #ffffff;border-radius: 14px;box-shadow: 0 4px 14px rgba(0,0,0,0.08);overflow:hidden;margin: 0 auto 24px;width: 100%;}
.tour-card-media {flex:0 0 300px;min-height:auto;background: #fef9c3;position:relative;}
.tour-card-media img {width:100%;height:100%;object-fit:cover;display:block;}
.tour-card-content {padding:18px;flex:1;display:flex;flex-direction:column;gap:12px;}
.tour-card-title {font-size:18px;font-weight:700;line-height:1.4;color:#92400e;}
.tour-card-route {color: #6b7280;font-size:13px;}
.tour-card-highlights {display:flex;gap:10px;flex-wrap:wrap;}
.tour-card-hl {background:#fff8e1;border:1px solid #fde68a;padding:6px 10px;border-radius:10px;font-size:13px;color:#92400e;display:flex;align-items:center;gap:6px;}
.tour-card-footer {display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:6px;margin-top:auto;padding-bottom:10px;}
.tour-card-duration {font-size:13px;color: #6b7280;display:flex;align-items:center;gap:12px;}
.tour-card-footer-actions {display:flex;align-items:center;gap:30px;}
.tour-card-btn {border: none;border-radius: 8px;padding: 12px 20px;font-weight: 700;cursor: pointer;min-width: 160px;width: auto;text-align: center;display: inline-block;white-space: nowrap;background: #d97706;color: #fff;}
.tour-card-btn:hover {background: #b45309;}
.tour-card-price {font-weight: 800;color: #d97706;white-space: nowrap;font-size: 19px;}
.tour-card-duration {white-space: nowrap;}
.tour-card-hotel {display:flex;align-items:center;justify-content:space-between;padding:8px 10px;border-radius:10px;background:#fffdf4;border:1px solid #fef3c7;font-size:14px;}
.tour-card-stars {color:#fbbf24;font-weight:700;}
.tour-card-meal {font-size: 14px;color: #6b7280;font-weight: 500;}
.tour-card-hotels {display:flex;flex-direction:column;gap:6px;color:#3c4860;}
.tourdet-fav {position: absolute;top: 10px;left: 10px;display: block;z-index: 2;}

@media (max-width: 500px) {
  .tour-card-footer {
    flex-direction: column;
    align-items: flex-start; 
    gap: 8px;
  }

  .tour-card-footer-actions {
    width: 100%;
    justify-content: space-between;
    border-top: 1px solid #e5e7eb;
    padding-top: 8px;
  }
}

@media (max-width:768px){
  .tour-card { flex-direction:column; }
  .tour-card-media { flex:1 1 auto; width:100%; min-height:180px; }

  /* Buttons auf Handy: volle Breite & untereinander */
  .tour-card-footer-actions {
    flex-direction: column;
    gap: 10px;
    width: 100%;
  }
  .tour-card-btn {
    width: 100%;
  }
}

/************* Tour Category Card / Similar / Favorite Son ******************/ 

/****** Tour Category Page Description *****************************************/

.page-description {width: 100%;background: #f5f5f5;border-radius: 8px;padding: 20px;box-shadow: 0 2px 8px rgba(0,0,0,0.05);color: #333;margin: 30px auto;position: relative;}
.page-description p {margin-bottom: 1em;transition: all 0.3s ease;}
.page-description button.detail-toggle {background-color: #d97706;color: white;border: none;padding: 4px 10px;margin-left: 8px;margin-top: 5px;border-radius: 4px;font-size: 0.75em;cursor: pointer;transition: background-color 0.3s ease;}
.page-description button.detail-toggle:hover {background-color: #b45309;}

/****** Tour Category Page Description Son *****************************************/

/* Tour Detail */

.TourTitle-wrapper {
  display: flex;
  gap: 16px;
  align-items: stretch;
  margin-bottom: 20px;
  flex-wrap: wrap;
}

.TourTitle-left,
.TourTitle-right {
  flex: 1 1 0;
  margin: 4px;
  background: #f6f4f0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

@media (max-width: 940px) {
  .TourTitle-left,
  .TourTitle-right {
    flex: none;
    width: 100%;
  }
}

.card-info {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 14px;
  font-weight: 400; /* Normal ağırlık */
  background: #fff;
  color: #000;
}

.card-left,
.card-right,
 {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.card-right {
  text-align: left;
  margin: 0;
  padding: 0;
}

.day-title {
  font-weight: 700;
  color: #222;
  padding: 12px 0;
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}

.day-row {
  padding: 16px 0;
  border-top: 1px solid #ccc;
  cursor: pointer;
  transition: background-color 0.2s ease;
}

.day-row:hover {
  background-color: #f9f9f9;
}

#tour-included ul > li,
#tour-optional ul > li,
#tour-excluded ul > li {
  list-style: none;
  padding-left: 28px;
  background-repeat: no-repeat;
  background-position: 0px center;
  background-size: 18px 18px;
}

#tour-included ul > li {
  background-image: url('/images/check.png');
  background-repeat: no-repeat;
  background-position: top left;
  padding-left: 24px;
  min-height: 24px;
  line-height: 1.6;
}

#tour-excluded ul > li {
  background-image: url('/images/uncheck.png');
  background-repeat: no-repeat;
  background-position: top left;
  padding-left: 24px;
  min-height: 24px;
  line-height: 1.6;
}

#tour-optional ul > li {
  background-image: url('/images/cart.png');
  background-repeat: no-repeat;
  background-position: top left;
  padding-left: 24px;
  min-height: 24px;
  line-height: 1.6;
}

.custom-table {
  border-collapse: collapse;
  width: 100%;
}

.custom-table td, th {
  padding: 18px 12px;
}

.custom-table tr {
  border-bottom: 1px dotted #ccc;
}

.custom-table tr:last-child td {
  border-bottom: none;
}

/* Genel bar yapısı */
.tourdettab-bar {
  position: sticky;
  top: 0;
  z-index: 999;
  background: #f6f4f0;
  padding: 10px;
}

/* Sekme kapsayıcısı */
.tourdettab-container {
  display: flex;
  gap: 10px;
  flex-wrap: nowrap; /* Masaüstünde tek satır */
}

/* Sekme öğeleri */
.tourdettab-item {
  flex: 1;
  padding: 12px;
  text-align: center;
  cursor: pointer;
  font-weight: bold;
  color: #666;
  border-bottom: 3px solid transparent;
  transition: all 0.3s ease;
}

/* Aktif sekme */
.tourdettab-item.active {
  border-bottom: 3px solid #ff2800;
  color: #000;
}

@media (max-width: 800px) {
  .tourdettab-container {
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .tourdettab-container > .tourdettab-item {
    flex: 0 0 48%;
    max-width: 48%;
    margin-bottom: 10px;
  }
}

@media print {
  @page {
    margin: 0;
  }
  body {
    margin: 0;
  }
}

/************ Pdf, Yazdir buttonları *********************/
.pdf-actions {display: flex;flex-wrap: wrap;justify-content: center;gap: 12px;margin-top: 40px;padding: 16px 0;background-color: #f5f5f5;border-radius: 8px;border: none;}
.pdf-button {display: inline-block;padding: 10px 16px;font-size: 15px;font-weight: 600;color: #fff;background-color: #d97706;border-radius: 8px;text-decoration: none;transition: background-color 0.2s ease;}
.pdf-button:hover {background-color: #b45309;}

@media (max-width: 650px) {
  .pdf-actions {
    flex-direction: column;
    align-items: center;
  }

  .pdf-button {
    width: 80%;
    text-align: center;
    font-size: 14px;
  }
}
/************ Pdf, Yazdir buttonları son *********************/

/********************* Dynamic Tour Booking ************************/

.booking-intro {
  font-size: 15px;
  color: #6b7280;
  text-align: center;
  margin-bottom: 18px;
}

.booking-box {
  background: #fff;
  border-radius: 12px;
  padding: 20px;
  box-shadow: 0 4px 8px rgba(0,0,0,0.05);
}

.booking-section {
  background: #fffdf4;
  border: 1px solid #fef3c7;
  border-radius: 10px;
  padding: 20px;
  margin-bottom: 25px;
  box-shadow: 0 3px 6px rgba(0,0,0,0.05);
}

.booking-row { display: flex; gap: 16px; margin-bottom: 16px; }
.booking-col { flex: 1;}

.booking-box label {
  display: flex;              
  align-items: center;        
  font-size: 14px;
  font-weight: 600;
  gap: 0.5em;                 
  color: #92400e;
}

.booking-box input:not([type="checkbox"]), 
.booking-box select {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid #ddd;
  border-radius: 8px;
  margin-top:6px;
}
.booking-rooms-control {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
}

.booking-rooms-control button {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  border: 1px solid #ddd;
  background: #fff;
  cursor: pointer;
  font-weight: 700;
}

.booking-rooms-control .num {
  min-width: 28px;
  text-align: center;
  font-weight: 700;
}

.booking-room-title {
  font-size: 18px;
  font-weight: 700;
  color: #0f172a;
  margin-bottom: 4px;
}

.booking-next-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 20px;
}

.child-age-selects {
  display: flex;
  flex-direction: row;
  gap: 12px;
  margin-top: 20px;
}

.child-age-selects label {
  font-size: 14px;
  color: #6b7280;
  margin-bottom: 4px;
  display: block;
}

.child-age-selects select {
  width: 100%;
  padding: 6px;
  font-size: 14px;
}

.booking-flight-description {
  background: #fffbea;
  border: 1px solid #fde68a;
  border-radius: 12px;
  padding: 16px 24px;
  box-shadow: 0 3px 6px rgba(0,0,0,0.06);;
  font-size: 13px;
  margin-bottom:16px;
}

.booking-rooms-detail {
  background: #fff7ed;
  border: 1px solid #fde68a;
  border-radius: 12px;
  padding: 16px 24px;
  font-weight: 600;
  font-size: 16px;
  color: #92400e;
  margin-bottom:16px;
}

/* Boxen */
.booking-flight-table {
  width: 100%;
  box-sizing: border-box;
  margin: 0 auto 20px;
}

.booking-flight-table-header {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr auto;
  background: #fffdf4;
  border: 1px solid #fef3c7;
  padding: 14px 30px;
  font-weight: 700;
  border-radius: 12px;
  margin-bottom:5px;
}

.booking-step2-row {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr auto;
  align-items: center;
  background: #fff;
  border: 1px solid #d5d7db;
  border-radius: 12px;
  padding: 14px 30px;
  margin-bottom: 12px;
  transition: all 0.25s ease;
  font-size:13px;
  color:#6B7280;
}
.booking-step2-row:hover { transform: translateY(-2px); background: #fffef4; }

.booking-airline-img { height: 25px; object-fit: contain; }

.booking-flight-toggle {
  border: none;
  background: none;
  color: #92400e;
  font-size: 13px;
  text-decoration: underline;
  cursor: pointer;
}

.booking-flight-toggle-detail {
  display: none;
  margin-top: 10px;
  border: 1px solid #fde68a;
  background: #fffdf4;
  border-radius: 8px;
  padding: 10px;
  box-shadow: 0 4px 10px rgba(217,119,6,0.15);
  overflow-x: auto;
}

.booking-flight-table-details {
  width: 100%;
  border-collapse: collapse;
  min-width: 520px;
}
.booking-flight-table-details th, .booking-flight-table-details td {
  text-align: left;
  padding: 8px 12px;
  border-bottom: 1px solid #eee;
  font-size: 13px;
  white-space: nowrap;
}
.booking-flight-table-details th {
  background: #fef9c3;
  color: #92400e;
  font-weight: 700;
}

.booking-step2-price { font-weight: 800; color: #d97706; font-size: 18px; margin-bottom: 6px; }

.booking-step2-book {
  background:#d97706;
  border:0px;
  color: #fff;
  font-weight: 700;
  border-radius: 8px;
  padding: 10px 20px;
  text-decoration: none;
  display: inline-block;
  transition: background 0.2s;
}
.booking-step2-book:hover { background: #b45309;transform: translateY(-2px);box-shadow: 0 6px 12px rgba(217, 119, 6, 0.25);}

@media (max-width: 768px) {

  /* Başlık ve Uçuş Satırları İçin Grid Yapısını Güncelle */
  .booking-flight-table-header,
  .booking-step2-row {
    /* 1. Sütun sayısını 1'e düşürerek içeriklerin alt alta yığılmasını sağla. 
      2. Otomatik (auto) satır yüksekliği kullan.
    */
    grid-template-columns: 1fr; 
    padding: 15px; /* Mobil cihazlarda daha yumuşak padding */
    row-gap: 15px; /* Satırlar arasına boşluk ekle */
  }

  /* Başlık (Header) kısmını mobilde gizle, çünkü veriyi etiketleyeceğiz. */
  .booking-flight-table-header {
    display: none;
  }

  /* Her Bir Uçuş Bilgisi (Sütunlar) */
  .booking-step2-row > div {
    width: 100%;
    /* Metin hizalamasını sola çek */
    text-align: left !important;
  }
  
  /* Mobil Görünümde İçerik Başlıklarını Ekleme (Data-Attribute Kullanımı) */
  /* Bu, hangi bilginin gösterildiğini belirtmek için önemlidir (Abflugdatum, vb.) */
  .booking-step2-row > div:nth-child(1)::before {
    content: "Abflugdatum";
    font-weight: 700; 
    display: block;
    color: #92400e; /* Başlık rengini marka rengiyle eşleştir */
    margin-bottom: 4px;
    font-size: 13px;
    text-transform: uppercase;
  }

  .booking-step2-row > div:nth-child(2)::before {
    content: "Rückflugdatum";
    font-weight: 700; 
    display: block;
    color: #92400e;
    margin-bottom: 4px;
    font-size: 13px;
    text-transform: uppercase;
  }

  /* Hava Yolu ve Detaylar Kısmı (3. Sütun) */
  .booking-step2-row > div:nth-child(3) {
    /* Hava yolu logosu ve butonun mobil görünümde daha iyi görünmesi için */
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-top: 1px solid #f3f4f6; /* Ayırıcı çizgi ekle */
    padding-top: 15px;
  }
  
  /* Fiyat ve Rezervasyon Butonu Kısmı (4. Sütun) */
  .booking-step2-row > div:nth-child(4) {
    display: flex;
    justify-content: space-between; /* Fiyat ve butonu yan yana ayır */
    align-items: center;
    border-top: 1px solid #f3f4f6;
    padding-top: 15px;
  }
  
  .booking-step2-price {
    margin-bottom: 0; /* Butonla aynı hizada olması için */
  }

  /* Butonun mobil görünümde daha küçük ve estetik olması */
  .booking-step2-book {
    padding: 8px 16px;
    font-size: 13px;
  }
  
  /* Detay tablosunun tüm satırı kaplaması için */
  .booking-flight-toggle-detail {
    /* 4 sütunlu grid yapısından 1 sütunluya geçtiğimiz için 
       detay tablosunun satırın geri kalanını kapsaması için: */
    grid-column: 1 / -1; 
  }
}

.booking-step3-box{
  background:#fff;
  border:1px solid #eee3c4;
  border-radius:10px;
  box-shadow:0 2px 8px rgba(0,0,0,.05);
  padding:16px 20px;
  color:#3F3F3F;
  margin-bottom:20px;
}

.booking-step3-h2{
  margin:0 0 8px;
  font-size:22px;
  font-weight:700;
  color:#6b3a00;
  border-bottom:1px solid #f1e5c5;
  padding-bottom:6px;
}

.booking-step3-flight-card{
  display:flex;
  align-items:center;
  gap:14px;
  background:#fff;
  border:1px solid #f1e5c5;
  border-radius:12px;
  padding:14px 18px;
  margin-bottom:10px;
  box-shadow:0 2px 6px rgba(0,0,0,0.05);
  transition:all .2s;
}
.booking-step3-flight-card:hover{ transform:translateY(-2px); box-shadow:0 3px 10px rgba(0,0,0,0.08); }

.booking-step3-airline-logo{
  height: 28px;
  width:auto;
  object-fit:contain;
  display:inline-block;
  vertical-align:middle;
}

.booking-step3-selection-summary{
  background:#fffaf0;
  border:1px solid #e6d8a3;
  border-radius:8px;
  padding:6px 10px;
  margin:6px 0 10px;
  color:#705b2f;
  font-weight:600;
}

.booking-step3-hotel-table{ width:100%; border-collapse:collapse; }
.booking-step3-hotel-table th{
  background:#fffaf0;
  border-bottom:1px solid #f1e5c5;
  text-align:left;
  padding: 16px 8px;
  font-weight:700;
  vertical-align: top;
}
.booking-step3-hotel-table td{
  padding:10px 8px;
  border-bottom:1px solid #eee3c4;
}
.booking-step3-hotel-table tr:hover{background:#fffbee;}

.booking-step3-insurance-card{
  display:flex; gap:12px; align-items:flex-start;
  padding:12px 14px;
  border:1px solid #f1e5c5;
  border-radius:10px;
  background:#fff;
  margin-bottom:10px;
  box-shadow:0 1px 4px rgba(0,0,0,0.04);
}

.booking-step3-insurance a {
    text-decoration: none !important;
}

.booking-step3-insurance-title{ font-weight:600; margin-bottom:4px; }

.booking-step3-price-container {
  display: flex;
  justify-content: space-between; 
  align-items: center;
  flex-wrap: wrap;                
  gap: 10px;
  background:#f9f5e9;
  border:2px solid #e3d39c;
  font-weight:700;
  font-size:18px;
  color:#705b2f;
  padding:12px;
  border-radius:10px;
}

.booking-step3-book{
  text-align:center;
  flex: 0 0 100%;   
  margin-top: 10px;
}

.booking-step3-book-botton{
  background-color:#0E1B3F;
  color:#fff;
  padding:12px 80px;
  border:none;
  border-radius:8px;
  font-weight:600;
  cursor:pointer;
  transition:background-color .2s, transform .05s;
}

.booking-step3-book-botton:hover{ background-color:#162b6a; }

/********************* Dynamic Tour Booking Son ************************/

/* Sayfalardaki Modallar */

  .modal {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    display: none;
    z-index: 9999;
    box-sizing: border-box;
  }

.modal-content-wrapper {
  margin: auto;
  max-width: 800px;
  width: 100%;
  max-height: 90vh;
  overflow: hidden;
  border-radius: 8px;
  animation: fadeZoom 0.3s ease;
  position: relative;
  background: #fff;
}


.modal-content {
  max-height: 90vh;
  overflow-y: auto;
  box-sizing: border-box;
}

.close-btn {
  position: absolute;
  top: 12px;
  right: 12px;
  background: none;
  border: none;
  font-size: 32px; /* Daha büyük */
  cursor: pointer;
  color: #e00000; /* Kırmızı */
  line-height: 1;
}

  @keyframes fadeZoom {
    from { opacity: 0; transform: scale(0.95); }
    to { opacity: 1; transform: scale(1); }
  }

  body.modal-open {
    overflow: hidden;
  }

.bookingstep2 {
  width: 100%;
  border-collapse: collapse;
}

/* Masaüstü görünüm */
.bookingstep2 th,
.bookingstep2 td {
  padding: 12px;
  border-bottom: 1px solid #ddd;
  text-align: left;
  vertical-align: middle;
}

/* Book butonu */
.bookingstep2-btn {
  background-color: #00539D;
  color: #fff;
  width: 100%;
  font-size: 14px;
  font-weight: 600;
  padding: 10px;
  border: none;
  border-radius: 8px;
  cursor: pointer;
}

/* Airway hücresindeki resim */
.bookingstep2 td img {
  display: block;
  max-height: 24px;
  margin: 0 auto;
}

/* Mobil görünüm */
@media (max-width: 840px) {
  .bookingstep2 thead {
    display: none;
  }

  .bookingstep2 tr {
    display: block;
    margin-bottom: 20px;
    border-radius: 12px;
    padding: 10px;
    background: #fff;
    box-shadow: 0 2px 6px rgba(0,0,0,0.05);
  }

  .bookingstep2 td {
    display: block;
    padding: 8px 12px;
    border: none;
  }

  .bookingstep2 td::before {
    content: attr(data-label);
    display: block;
    font-weight: bold;
    color: #555;
    margin-bottom: 4px;
  }

  .bookingstep2-btn {
    font-size: 16px;
    padding: 12px;
  }

  .bookingstep2 td img {
    display: block;
    max-height: 24px;
    margin: 0 auto;
  }
}

.bookingstep3-table {
  border-collapse: collapse;
  width: 100%;
}

/* Masaüstü görünüm */
.bookingstep3-table th,
.bookingstep3-table td {
  padding: 12px;
  text-align: left;
}

.bookingstep3-table tr {
  border-bottom: 1px dotted #ccc;
}

.bookingstep3-table tr:last-child td {
  border-bottom: none;
}

/* Mobil görünüm */
@media (max-width: 650px) {
  .bookingstep3-table thead {
    display: none;
  }

  .bookingstep3-table tr {
    display: block;
    margin-bottom: 0;
    padding: 10px 12px;
    background: #fff;
    border-bottom: 1px solid #ddd;
  }

  .bookingstep3-table td {
    display: block;
    padding: 8px 0;
    border: none;
  }

  .bookingstep3-table td::before {
    content: attr(data-label);
    display: block;
    font-weight: 600;
    color: #555;
    margin-bottom: 4px;
  }
}

.bookingstep3-table td.cell-align-end {
  text-align: right;
}



/* W3.CSS 4.15 December 2020 by Jan Egil and Borge Refsnes */
html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}
/* Extract from normalize.css by Nicolas Gallagher and Jonathan Neal git.io/normalize */
html{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}
article,aside,details,figcaption,figure,footer,header,main,menu,nav,section{display:block}summary{display:list-item}
audio,canvas,progress,video{display:inline-block}progress{vertical-align:baseline}
audio:not([controls]){display:none;height:0}[hidden],template{display:none}
a{background-color:transparent}a:active,a:hover{outline-width:0}
abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}
b,strong{font-weight:bolder}dfn{font-style:italic}mark{background:#ff0;color:#000}
small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}
sub{bottom:-0.25em}sup{top:-0.5em}figure{margin:1em 40px}img{border-style:none}
code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}hr{box-sizing:content-box;height:0;overflow:visible}
button,input,select,textarea,optgroup{font:inherit;margin:0}optgroup{font-weight:bold}
button,input{overflow:visible}button,select{text-transform:none}
button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}
button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}
button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}
fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:.35em .625em .75em}
legend{color:inherit;display:table;max-width:100%;padding:0;white-space:normal}textarea{overflow:auto}
[type=checkbox],[type=radio]{padding:0}
[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}
[type=search]{-webkit-appearance:textfield;outline-offset:-2px}
[type=search]::-webkit-search-decoration{-webkit-appearance:none}
::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}
/* End extract */
html,body{font-family:Arial, Verdana,sans-serif;font-size:14px;line-height:1.3;}html{overflow-x:hidden}
h1{font-size:30px}h2{font-size:26px}h3{font-size:24px}h4{font-size:20px}h5{font-size:18px}h6{font-size:16px}
.w3-serif{font-family:serif}.w3-sans-serif{font-family:sans-serif}.w3-cursive{font-family:cursive}.w3-monospace{font-family:monospace}
h1,h2,h3,h4,h5,h6{font-weight:400;margin:10px 0}.w3-wide{letter-spacing:4px}
hr{border:0;border-top:1px solid #eee;margin:20px 0}
.w3-image{max-width:100%;height:auto}img{vertical-align:middle}a{color:inherit}
.w3-table,.w3-table-all{border-collapse:collapse;border-spacing:0;width:100%;display:table}.w3-table-all{border:1px solid #ccc}
.w3-bordered tr,.w3-table-all tr{border-bottom:1px solid #ddd}.w3-striped tbody tr:nth-child(even){background-color:#f1f1f1}
.w3-table-all tr:nth-child(odd){background-color:#fff}.w3-table-all tr:nth-child(even){background-color:#f1f1f1}
.w3-hoverable tbody tr:hover,.w3-ul.w3-hoverable li:hover{background-color:#ccc}.w3-centered tr th,.w3-centered tr td{text-align:center}
.w3-table td,.w3-table th,.w3-table-all td,.w3-table-all th{padding:8px 8px;display:table-cell;text-align:left;vertical-align:top}
.w3-table th:first-child,.w3-table td:first-child,.w3-table-all th:first-child,.w3-table-all td:first-child{padding-left:16px}
.w3-btn,.w3-button{border:none;display:inline-block;padding:8px 16px;vertical-align:middle;overflow:hidden;text-decoration:none;color:inherit;background-color:inherit;text-align:center;cursor:pointer;white-space:nowrap}
.w3-btn:hover{box-shadow:0 8px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19)}
.w3-btn,.w3-button{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}   
.w3-disabled,.w3-btn:disabled,.w3-button:disabled{cursor:not-allowed;opacity:0.3}.w3-disabled *,:disabled *{pointer-events:none}
.w3-btn.w3-disabled:hover,.w3-btn:disabled:hover{box-shadow:none}
.w3-badge,.w3-tag{background-color:#000;color:#fff;display:inline-block;padding-left:8px;padding-right:8px;text-align:center}.w3-badge{border-radius:50%}
.w3-ul{list-style-type:none;padding:0;margin:0}.w3-ul li{padding:8px 16px;border-bottom:1px solid #ddd}.w3-ul li:last-child{border-bottom:none}
.w3-tooltip,.w3-display-container{position:relative}.w3-tooltip .w3-text{display:none}.w3-tooltip:hover .w3-text{display:inline-block}
.w3-ripple:active{opacity:0.5}.w3-ripple{transition:opacity 0s}
.w3-input{padding:4px;display:block;border:1px solid #ccc;width:100%}
.w3-select{padding:9px 0;width:100%;border:none;border-bottom:1px solid #ccc}
.w3-dropdown-click,.w3-dropdown-hover{position:relative;display:inline-block;cursor:pointer}
.w3-dropdown-hover:hover .w3-dropdown-content{display:block}
.w3-dropdown-hover:first-child,.w3-dropdown-click:hover{background-color:#ccc;color:#000}
.w3-dropdown-hover:hover > .w3-button:first-child,.w3-dropdown-click:hover > .w3-button:first-child{background-color:#ccc;color:#000}
.w3-dropdown-content{cursor:auto;color:#000;background-color:#fff;display:none;position:absolute;min-width:160px;margin:0;padding:0;z-index:1}
.w3-check,.w3-radio{width:24px;height:24px;position:relative;top:6px}
.w3-sidebar{height:100%;width:200px;background-color:#fff;position:fixed!important;z-index:1;overflow:auto}
.w3-bar-block .w3-dropdown-hover,.w3-bar-block .w3-dropdown-click{width:100%}
.w3-bar-block .w3-dropdown-hover .w3-dropdown-content,.w3-bar-block .w3-dropdown-click .w3-dropdown-content{min-width:100%}
.w3-bar-block .w3-dropdown-hover .w3-button,.w3-bar-block .w3-dropdown-click .w3-button{width:100%;text-align:left;padding:8px 16px}
.w3-main,#main{transition:margin-left .4s}
.w3-modal{z-index:3;display:none;padding-top:100px;position:fixed;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:rgb(0,0,0);background-color:rgba(0,0,0,0.4)}
.w3-modal-content{margin:auto;background-color:#fff;position:relative;padding:0;outline:0;width:600px}
.w3-bar{width:100%;overflow:hidden}.w3-center .w3-bar{display:inline-block;width:auto}
.w3-bar .w3-bar-item{padding:8px 16px;float:left;width:auto;border:none;display:block;outline:0}
.w3-bar .w3-dropdown-hover,.w3-bar .w3-dropdown-click{position:static;float:left}
.w3-bar .w3-button{white-space:normal}
.w3-bar-block .w3-bar-item{width:100%;display:block;padding:8px 16px;text-align:left;border:none;white-space:normal;float:none;outline:0}
.w3-bar-block.w3-center .w3-bar-item{text-align:center}.w3-block{display:block;width:100%}
.w3-responsive{display:block;overflow-x:auto}
.w3-container:after,.w3-container:before,.w3-panel:after,.w3-panel:before,.w3-row:after,.w3-row:before,.w3-row-padding:after,.w3-row-padding:before,
.w3-cell-row:before,.w3-cell-row:after,.w3-clear:after,.w3-clear:before,.w3-bar:before,.w3-bar:after{content:"";display:table;clear:both}
.w3-col,.w3-half,.w3-third,.w3-twothird,.w3-threequarter,.w3-quarter{float:left;width:100%}
.w3-col.s1{width:8.33333%}.w3-col.s2{width:16.66666%}.w3-col.s3{width:24.99999%}.w3-col.s4{width:33.33333%}
.w3-col.s5{width:41.66666%}.w3-col.s6{width:49.99999%}.w3-col.s7{width:58.33333%}.w3-col.s8{width:66.66666%}
.w3-col.s9{width:74.99999%}.w3-col.s10{width:83.33333%}.w3-col.s11{width:91.66666%}.w3-col.s12{width:99.99999%}
@media (min-width:601px){.w3-col.m1{width:8.33333%}.w3-col.m2{width:16.66666%}.w3-col.m3,.w3-quarter{width:24.99999%}.w3-col.m4,.w3-third{width:33.33333%}
.w3-col.m5{width:41.66666%}.w3-col.m6,.w3-half{width:49.99999%}.w3-col.m7{width:58.33333%}.w3-col.m8,.w3-twothird{width:66.66666%}
.w3-col.m9,.w3-threequarter{width:74.99999%}.w3-col.m10{width:83.33333%}.w3-col.m11{width:91.66666%}.w3-col.m12{width:99.99999%}}
@media (min-width:993px){.w3-col.l1{width:8.33333%}.w3-col.l2{width:16.66666%}.w3-col.l3{width:24.99999%}.w3-col.l4{width:33.33333%}
.w3-col.l5{width:41.66666%}.w3-col.l6{width:49.99999%}.w3-col.l7{width:58.33333%}.w3-col.l8{width:66.66666%}
.w3-col.l9{width:74.99999%}.w3-col.l10{width:83.33333%}.w3-col.l11{width:91.66666%}.w3-col.l12{width:99.99999%}}
.w3-rest{overflow:hidden}.w3-stretch{margin-left:-16px;margin-right:-16px}
.w3-content,.w3-auto{margin-left:auto;margin-right:auto}.w3-content{max-width:980px}.w3-auto{max-width:1140px}
.w3-cell-row{display:table;width:100%}.w3-cell{display:table-cell}
.w3-cell-top{vertical-align:top}.w3-cell-middle{vertical-align:middle}.w3-cell-bottom{vertical-align:bottom}
.w3-hide{display:none!important}.w3-show-block,.w3-show{display:block!important}.w3-show-inline-block{display:inline-block!important}
@media (max-width:1205px){.w3-auto{max-width:95%}}
@media (max-width:600px){.w3-modal-content{margin:0 10px;width:auto!important}.w3-modal{padding-top:30px}
.w3-dropdown-hover.w3-mobile .w3-dropdown-content,.w3-dropdown-click.w3-mobile .w3-dropdown-content{position:relative}	
.w3-hide-small{display:none!important}.w3-mobile{display:block;width:100%!important}.w3-bar-item.w3-mobile,.w3-dropdown-hover.w3-mobile,.w3-dropdown-click.w3-mobile{text-align:center}
.w3-dropdown-hover.w3-mobile,.w3-dropdown-hover.w3-mobile .w3-btn,.w3-dropdown-hover.w3-mobile .w3-button,.w3-dropdown-click.w3-mobile,.w3-dropdown-click.w3-mobile .w3-btn,.w3-dropdown-click.w3-mobile .w3-button{width:100%}}
@media (max-width:768px){.w3-modal-content{width:500px}.w3-modal{padding-top:50px}}
@media (min-width:993px){.w3-modal-content{width:900px}.w3-hide-large{display:none!important}.w3-sidebar.w3-collapse{display:block!important}}
@media (max-width:992px) and (min-width:601px){.w3-hide-medium{display:none!important}}
@media (max-width:992px){.w3-sidebar.w3-collapse{display:none}.w3-main{margin-left:0!important;margin-right:0!important}.w3-auto{max-width:100%}}
.w3-top,.w3-bottom{position:fixed;width:100%;z-index:1}.w3-top{top:0}.w3-bottom{bottom:0}
.w3-overlay{position:fixed;display:none;width:100%;height:100%;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,0.5);z-index:2}
.w3-display-topleft{position:absolute;left:0;top:0}.w3-display-topright{position:absolute;right:0;top:0}
.w3-display-bottomleft{position:absolute;left:0;bottom:0}.w3-display-bottomright{position:absolute;right:0;bottom:0}
.w3-display-middle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%)}
.w3-display-left{position:absolute;top:50%;left:0%;transform:translate(0%,-50%);-ms-transform:translate(-0%,-50%)}
.w3-display-right{position:absolute;top:50%;right:0%;transform:translate(0%,-50%);-ms-transform:translate(0%,-50%)}
.w3-display-topmiddle{position:absolute;left:50%;top:0;transform:translate(-50%,0%);-ms-transform:translate(-50%,0%)}
.w3-display-bottommiddle{position:absolute;left:50%;bottom:0;transform:translate(-50%,0%);-ms-transform:translate(-50%,0%)}
.w3-display-container:hover .w3-display-hover{display:block}.w3-display-container:hover span.w3-display-hover{display:inline-block}.w3-display-hover{display:none}
.w3-display-position{position:absolute}
.w3-circle{border-radius:50%}
.w3-round-small{border-radius:2px}.w3-round,.w3-round-medium{border-radius:4px}.w3-round-large{border-radius:8px}.w3-round-xlarge{border-radius:16px}.w3-round-xxlarge{border-radius:32px}
.w3-row-padding,.w3-row-padding>.w3-half,.w3-row-padding>.w3-third,.w3-row-padding>.w3-twothird,.w3-row-padding>.w3-threequarter,.w3-row-padding>.w3-quarter,.w3-row-padding>.w3-col{padding:0 8px}
.w3-container,.w3-panel{padding:0.01em 16px}.w3-panel{margin-top:16px;margin-bottom:16px}
.w3-code,.w3-codespan{font-family:Consolas,"courier new";font-size:16px}
.w3-code{width:auto;background-color:#fff;padding:8px 12px;border-left:4px solid #4CAF50;word-wrap:break-word}
.w3-codespan{color:crimson;background-color:#f1f1f1;padding-left:4px;padding-right:4px;font-size:110%}
.w3-card,.w3-card-2{box-shadow:0 1px 3px 0 rgba(0,0,0,0.16),0 1px 6px 0 rgba(0,0,0,0.12)}
.w3-card-4,.w3-hover-shadow:hover{box-shadow:0 4px 10px 0 rgba(0,0,0,0.2),0 4px 20px 0 rgba(0,0,0,0.19)}
.w3-spin{animation:w3-spin 2s infinite linear}@keyframes w3-spin{0%{transform:rotate(0deg)}100%{transform:rotate(359deg)}}
.w3-animate-fading{animation:fading 10s infinite}@keyframes fading{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
.w3-animate-opacity{animation:opac 0.8s}@keyframes opac{from{opacity:0} to{opacity:1}}
.w3-animate-top{position:relative;animation:animatetop 0.4s}@keyframes animatetop{from{top:-300px;opacity:0} to{top:0;opacity:1}}
.w3-animate-left{position:relative;animation:animateleft 0.4s}@keyframes animateleft{from{left:-300px;opacity:0} to{left:0;opacity:1}}
.w3-animate-right{position:relative;animation:animateright 0.4s}@keyframes animateright{from{right:-300px;opacity:0} to{right:0;opacity:1}}
.w3-animate-bottom{position:relative;animation:animatebottom 0.4s}@keyframes animatebottom{from{bottom:-300px;opacity:0} to{bottom:0;opacity:1}}
.w3-animate-zoom {animation:animatezoom 0.6s}@keyframes animatezoom{from{transform:scale(0)} to{transform:scale(1)}}
.w3-animate-input{transition:width 0.4s ease-in-out}.w3-animate-input:focus{width:100%!important}
.w3-opacity,.w3-hover-opacity:hover{opacity:0.60}.w3-opacity-off,.w3-hover-opacity-off:hover{opacity:1}
.w3-opacity-max{opacity:0.25}.w3-opacity-min{opacity:0.75}
.w3-greyscale-max,.w3-grayscale-max,.w3-hover-greyscale:hover,.w3-hover-grayscale:hover{filter:grayscale(100%)}
.w3-greyscale,.w3-grayscale{filter:grayscale(75%)}.w3-greyscale-min,.w3-grayscale-min{filter:grayscale(50%)}
.w3-sepia{filter:sepia(75%)}.w3-sepia-max,.w3-hover-sepia:hover{filter:sepia(100%)}.w3-sepia-min{filter:sepia(50%)}
.w3-tiny{font-size:10px!important}.w3-small{font-size:12px!important}.w3-medium{font-size:15px!important}.w3-large{font-size:18px!important}
.w3-xlarge{font-size:24px!important}.w3-xxlarge{font-size:36px!important}.w3-xxxlarge{font-size:48px!important}.w3-jumbo{font-size:64px!important}
.w3-left-align{text-align:left!important}.w3-right-align{text-align:right!important}.w3-justify{text-align:justify!important}.w3-center{text-align:center!important}
.w3-border-0{border:0!important}.w3-border{border:1px solid #ccc!important}
.w3-border-top{border-top:1px solid #ccc!important}.w3-border-bottom{border-bottom:1px solid #ccc!important}
.w3-border-left{border-left:1px solid #ccc!important}.w3-border-right{border-right:1px solid #ccc!important}
.w3-topbar{border-top:6px solid #ccc!important}.w3-bottombar{border-bottom:6px solid #ccc!important}
.w3-leftbar{border-left:6px solid #ccc!important}.w3-rightbar{border-right:6px solid #ccc!important}
.w3-section,.w3-code{margin-top:16px!important;margin-bottom:16px!important}
.w3-margin{margin:16px!important}.w3-margin-top{margin-top:16px!important}.w3-margin-bottom{margin-bottom:16px!important}
.w3-margin-left{margin-left:16px!important}.w3-margin-right{margin-right:16px!important}
.w3-padding-small{padding:4px 8px!important}.w3-padding{padding:8px 16px!important}.pl-padding{padding:4px 8px!important}.w3-padding-large{padding:12px 24px!important}
.w3-padding-16{padding-top:16px!important;padding-bottom:16px!important}.w3-padding-24{padding-top:24px!important;padding-bottom:24px!important}
.w3-padding-32{padding-top:32px!important;padding-bottom:32px!important}.w3-padding-48{padding-top:48px!important;padding-bottom:48px!important}
.w3-padding-64{padding-top:64px!important;padding-bottom:64px!important}
.w3-padding-top-64{padding-top:64px!important}.w3-padding-top-48{padding-top:48px!important}
.w3-padding-top-32{padding-top:32px!important}.w3-padding-top-24{padding-top:24px!important}
.w3-left{float:left!important}.w3-right{float:right!important}
.w3-button:hover{color:#000!important;background-color:#ccc!important}
.w3-transparent,.w3-hover-none:hover{background-color:transparent!important}
.w3-hover-none:hover{box-shadow:none!important}
.pl-maxwidth{max-width:1350px!important}
.pl-check{list-style-image:url('/images/check.png');}
.pl-uncheck{list-style-image:url('/images/uncheck.png');}
/* Colors */
.w3-amber,.w3-hover-amber:hover{color:#000!important;background-color:#ffc107!important}
.w3-aqua,.w3-hover-aqua:hover{color:#000!important;background-color:#00ffff!important}
.w3-blue,.w3-hover-blue:hover{color:#fff!important;background-color:#2196F3!important}
.pl-navbar,.w3-hover-blue:hover{color:#fff!important;background-color:#00539d!important}
.w3-light-blue,.w3-hover-light-blue:hover{color:#000!important;background-color:#87CEEB!important}
.pl-light-blue,.w3-hover-light-blue:hover{color:#000!important;background-color:#BBCEEB!important}
.w3-brown,.w3-hover-brown:hover{color:#fff!important;background-color:#795548!important}
.w3-cyan,.w3-hover-cyan:hover{color:#000!important;background-color:#00bcd4!important}
.w3-blue-grey,.w3-hover-blue-grey:hover,.w3-blue-gray,.w3-hover-blue-gray:hover{color:#fff!important;background-color:#607d8b!important}
.w3-green,.w3-hover-green:hover{color:#fff!important;background-color:#4CAF50!important}
.nt-brown{color:#fff!important;background-color:#d97706!important} 
.nt-brown:hover{color:#fff!important;background-color:#b45309!important} 
.w3-light-green,.w3-hover-light-green:hover{color:#000!important;background-color:#8bc34a!important}
.w3-indigo,.w3-hover-indigo:hover{color:#fff!important;background-color:#3f51b5!important}
.w3-khaki,.w3-hover-khaki:hover{color:#000!important;background-color:#f0e68c!important}
.w3-lime,.w3-hover-lime:hover{color:#000!important;background-color:#cddc39!important}
.w3-orange,.w3-hover-orange:hover{color:#000!important;background-color:#ff9800!important}
.w3-deep-orange,.w3-hover-deep-orange:hover{color:#fff!important;background-color:#ff5722!important}
.w3-pink,.w3-hover-pink:hover{color:#fff!important;background-color:#e91e63!important}
.w3-purple,.w3-hover-purple:hover{color:#fff!important;background-color:#9c27b0!important}
.w3-deep-purple,.w3-hover-deep-purple:hover{color:#fff!important;background-color:#673ab7!important}
.w3-red,.w3-hover-red:hover{color:#fff!important;background-color:#f44336!important}
.pl-red,.w3-hover-red:hover{color:#fff!important;background-color:#b51010!important}
.w3-sand,.w3-hover-sand:hover{color:#000!important;background-color:#fdf5e6!important}
.w3-teal,.w3-hover-teal:hover{color:#fff!important;background-color:#009688!important}
.w3-yellow,.w3-hover-yellow:hover{color:#000!important;background-color:#ffeb3b!important}
.w3-white,.w3-hover-white:hover{color:#000!important;background-color:#fff!important}
.w3-black,.w3-hover-black:hover{color:#fff!important;background-color:#000!important}
.w3-grey,.w3-hover-grey:hover,.w3-gray,.w3-hover-gray:hover{color:#000!important;background-color:#ccc!important}
.w3-light-grey,.w3-hover-light-grey:hover,.w3-light-gray,.w3-hover-light-gray:hover{color:#000!important;background-color:#f1f1f1!important}
.w3-dark-grey,.w3-hover-dark-grey:hover,.w3-dark-gray,.w3-hover-dark-gray:hover{color:#fff!important;background-color:#616161!important}
.w3-pale-red,.w3-hover-pale-red:hover{color:#000!important;background-color:#ffdddd!important}
.w3-pale-green,.w3-hover-pale-green:hover{color:#000!important;background-color:#ddffdd!important}
.w3-pale-yellow,.w3-hover-pale-yellow:hover{color:#000!important;background-color:#ffffcc!important}
.w3-pale-blue,.w3-hover-pale-blue:hover{color:#000!important;background-color:#ddffff!important}
.w3-text-amber,.w3-hover-text-amber:hover{color:#ffc107!important}
.w3-text-aqua,.w3-hover-text-aqua:hover{color:#00ffff!important}
.w3-text-blue,.w3-hover-text-blue:hover{color:#2196F3!important}
.pl-text-navbar,.w3-hover-text-blue:hover{color:#162D5D!important}
.w3-text-light-blue,.w3-hover-text-light-blue:hover{color:#87CEEB!important}
.w3-text-brown,.w3-hover-text-brown:hover{color:#795548!important}
.w3-text-cyan,.w3-hover-text-cyan:hover{color:#00bcd4!important}
.w3-text-blue-grey,.w3-hover-text-blue-grey:hover,.w3-text-blue-gray,.w3-hover-text-blue-gray:hover{color:#607d8b!important}
.w3-text-green,.w3-hover-text-green:hover{color:#4CAF50!important}
.w3-text-light-green,.w3-hover-text-light-green:hover{color:#8bc34a!important}
.w3-text-indigo,.w3-hover-text-indigo:hover{color:#3f51b5!important}
.w3-text-khaki,.w3-hover-text-khaki:hover{color:#b4aa50!important}
.w3-text-lime,.w3-hover-text-lime:hover{color:#cddc39!important}
.w3-text-orange,.w3-hover-text-orange:hover{color:#ff9800!important}
.w3-text-deep-orange,.w3-hover-text-deep-orange:hover{color:#ff5722!important}
.w3-text-pink,.w3-hover-text-pink:hover{color:#e91e63!important}
.w3-text-purple,.w3-hover-text-purple:hover{color:#9c27b0!important}
.w3-text-deep-purple,.w3-hover-text-deep-purple:hover{color:#673ab7!important}
.w3-text-red,.w3-hover-text-red:hover{color:#f44336!important}
.w3-text-sand,.w3-hover-text-sand:hover{color:#fdf5e6!important}
.w3-text-teal,.w3-hover-text-teal:hover{color:#009688!important}
.w3-text-yellow,.w3-hover-text-yellow:hover{color:#d2be0e!important}
.w3-text-white,.w3-hover-text-white:hover{color:#fff!important}
.w3-text-black,.w3-hover-text-black:hover{color:#000!important}
.w3-text-grey,.w3-hover-text-grey:hover,.w3-text-gray,.w3-hover-text-gray:hover{color:#757575!important}
.w3-text-light-grey,.w3-hover-text-light-grey:hover,.w3-text-light-gray,.w3-hover-text-light-gray:hover{color:#f1f1f1!important}
.w3-text-dark-grey,.w3-hover-text-dark-grey:hover,.w3-text-dark-gray,.w3-hover-text-dark-gray:hover{color:#3a3a3a!important}
.w3-border-amber,.w3-hover-border-amber:hover{border-color:#ffc107!important}
.w3-border-aqua,.w3-hover-border-aqua:hover{border-color:#00ffff!important}
.w3-border-blue,.w3-hover-border-blue:hover{border-color:#2196F3!important}
.w3-border-light-blue,.w3-hover-border-light-blue:hover{border-color:#87CEEB!important}
.w3-border-brown,.w3-hover-border-brown:hover{border-color:#795548!important}
.w3-border-cyan,.w3-hover-border-cyan:hover{border-color:#00bcd4!important}
.w3-border-blue-grey,.w3-hover-border-blue-grey:hover,.w3-border-blue-gray,.w3-hover-border-blue-gray:hover{border-color:#607d8b!important}
.w3-border-green,.w3-hover-border-green:hover{border-color:#4CAF50!important}
.w3-border-light-green,.w3-hover-border-light-green:hover{border-color:#8bc34a!important}
.w3-border-indigo,.w3-hover-border-indigo:hover{border-color:#3f51b5!important}
.w3-border-khaki,.w3-hover-border-khaki:hover{border-color:#f0e68c!important}
.w3-border-lime,.w3-hover-border-lime:hover{border-color:#cddc39!important}
.w3-border-orange,.w3-hover-border-orange:hover{border-color:#ff9800!important}
.w3-border-deep-orange,.w3-hover-border-deep-orange:hover{border-color:#ff5722!important}
.w3-border-pink,.w3-hover-border-pink:hover{border-color:#e91e63!important}
.w3-border-purple,.w3-hover-border-purple:hover{border-color:#9c27b0!important}
.w3-border-deep-purple,.w3-hover-border-deep-purple:hover{border-color:#673ab7!important}
.w3-border-red,.w3-hover-border-red:hover{border-color:#f44336!important}
.w3-border-sand,.w3-hover-border-sand:hover{border-color:#fdf5e6!important}
.w3-border-teal,.w3-hover-border-teal:hover{border-color:#009688!important}
.w3-border-yellow,.w3-hover-border-yellow:hover{border-color:#ffeb3b!important}
.w3-border-white,.w3-hover-border-white:hover{border-color:#fff!important}
.w3-border-black,.w3-hover-border-black:hover{border-color:#000!important}
.w3-border-grey,.w3-hover-border-grey:hover,.w3-border-gray,.w3-hover-border-gray:hover{border-color:#9e9e9e!important}
.pl-border-navbar,.pl-hover-border-plnavbar:hover,.pl-border-navbar,.pl-hover-border-navbar:hover{border-color:#00539d!important}
.w3-border-light-grey,.w3-hover-border-light-grey:hover,.w3-border-light-gray,.w3-hover-border-light-gray:hover{border-color:#f1f1f1!important}
.w3-border-dark-grey,.w3-hover-border-dark-grey:hover,.w3-border-dark-gray,.w3-hover-border-dark-gray:hover{border-color:#616161!important}
.w3-border-pale-red,.w3-hover-border-pale-red:hover{border-color:#ffe7e7!important}.w3-border-pale-green,.w3-hover-border-pale-green:hover{border-color:#e7ffe7!important}
.w3-border-pale-yellow,.w3-hover-border-pale-yellow:hover{border-color:#ffffcc!important}.w3-border-pale-blue,.w3-hover-border-pale-blue:hover{border-color:#e7ffff!important}

/* calendar style */

#calendarDiv {
	display: block;
	display: none;
	position: relative;
	border: 1px solid #777;
}
#calendarDiv a {
	cursor: pointer;
}
#calendar {
	background:white;
	clear: both;
	text-align: center;
	font-size: 90%;
}
#calendar, #linksTable {
	width: 270px;
}
#calendar .weekDaysCell {
	background: #fff;
}
#calendar .weekDaysCellOver {
	background: #4CAF50 ;
}
#closeCalender {
	position: absolute;
	right: 0;
	bottom: 100%;
	margin-bottom: 1px;
	padding:2px;
	display: block;
	cursor: pointer;
	border-top:1px solid #777;
	border-right:1px solid #777;
	border-left:1px solid #777;
}
#closeCalender:hover {
	background: #777777;
	color: #fff;
}
#linksTable {
	background: white;
	padding: 6px;
}
#linksTable a {
	display: block;
}
#linksTable a:hover {
	color: #000;
}
#prevMonth {
	float: left;
}
#nextMonth {
	float: right;
}

.plan-calendar {
  position: absolute;
  background: #fff;
  border: 1px solid #ddd;
  padding: 10px;
  display: none;
  z-index: 100;
}
.plan-calendar table {
  border-collapse: collapse;
  width: 100%;
}
.plan-calendar th, .plan-calendar td {
  text-align: center;
  width: 32px;
  height: 32px;
  cursor: pointer;
  border-radius: 4px;
}
.plan-calendar th {
  background: #f0f0f0;
  font-weight: bold;
  cursor: default;
}
.plan-calendar td:hover {
  background: #eee;
}
.plan-calendar .selected {
  background: #007bff;
  color: #fff;
}
.plan-calendar .header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 5px;
}
.plan-calendar .nav {
  cursor: pointer;
  font-weight: bold;
  padding: 0 8px;
}