:root {
    /* Rihle marka renkleri */
    --color-primary: #4e7587; /*#2E4A54;   /* koyu petrol lacivert - logo, başlık */
    --renk-bir: #4e7587;
    --renk-iki: #1d323a;
    --renk-bir-koyu1: #2E4A54;
    --color-accent: #C9A24B;    /* antik altın - buton, vurgu */
    --color-secondary: #7FA9B8; /* toz mavi - hover, ikincil vurgu */
    --color-sand: #C9B79C;      /* kum bej - sıcak nötr, az kullanım */
    --color-bg: #E7EBEE;        /* sis gri-mavi - sayfa zemini */
    --color-surface: #F4F1EA;   /* kırık beyaz - kart/bölüm zemini */
    --color-text: #4A4A4A;      /* koyu gri - gövde metni */
    --renk-beyaz: #fff;
    --renk-krem: #eeedea;
    --renk-altin: #C9A24B;
    --renk-soluk-yesil: #dbe7e5;
    --gold-gradient: linear-gradient(135deg, #bf953f 0%, #fcf6ba 25%, #b38728 50%, #fbf5b7 75%, #aa771c 100%);
    --bs-body-font-size: 1rem;
    --menu-zemin: linear-gradient(to bottom, rgba(255,255,255,.95) 0%, rgba(255,255,255,0) 100%); /*linear-gradient(8deg,rgba(250, 250, 250, 1) 18%, rgba(245, 251, 252, 1) 100%);*/
    --menu-radius: 14px;
    --mobilmenu-zemin: linear-gradient(135deg, rgba(46, 74, 84, 0.95) 0%, rgba(127, 169, 184, 0.85) 100%); /*#2E4A54;*/
    --mobil-menu-aktif-zemin: tranparent;
    --mobil-menu-isagretci-renk:#C9A24B;
    --renk-acik-gri1: #F7F6F3;
    --box-shadow1: 0 2px 15px color-mix(in srgb, var(--color-primary), #0000001a 90%);
    --box-shadow1-hover: 0 6px 25px color-mix(in srgb, var(--color-secondary), #0000001a 94%);
}
/** {
    transition: all 3s ease-out;
}*/

/*--font-barlow-condensed: "Barlow Condensed", "Barlow Condensed Fallback";*/

@font-face {
    font-family: "Jost";
    src: url(/html/font/Jost/Jost-VariableFont_wght.ttf) format("truetype");
}
@font-face {
    font-family: "Chinzel";
    src: url(/html/font/CinzelComfortaa/Cinzel/static/Cinzel-Regular.ttf) format("truetype");
}
@font-face {
    font-family: "Comfortaa";
    src: url(/html/font/CinzelComfortaa/Comfortaa/static/Comfortaa-Regular.ttf) format("truetype");
}
@font-face {
    font-family: "Roboto-Regular";
    src: url(/html/font/Roboto/Roboto-Regular.ttf) format("truetype");
}
/*
@font-face {
    font-family: "OpenSans";
    src: url(/html/font/Open_Sans/static/OpenSans-Regular.ttf) format("truetype");
}/*
@font-face {
    font-family: "TrebucetMS";
    src: url(/html/font/TrebuchetMS.ttf) format("truetype");
}
.FontTrebucetMS {
    font-family: TrebucetMS;
}
@font-face {
  font-family: "OswaldRegular";
  src: url(/html/font/Oswald/Oswald-Regular.ttf) format("truetype");
}*/
@font-face {
    font-family: "OswaldLight";
    src: url(/html/font/Oswald/Oswald-Light.ttf) format("truetype");
}/*
@font-face {
    font-family: "RobotoCondensed-Regular";
    src: url(/html/font/Roboto_Condensed/RobotoCondensed-Regular.ttf) format("truetype");
}
.FontRobotoCondensed {
    font-family: RobotoCondensed-Regular;
}
/*@font-face {
    font-family: 'HelveticaNeueItalic';
    font-style: normal;
    font-weight: normal;
    src: local('Helvetica Neue Italic'), url('/html/font/helvetica-neue-5/HelveticaNeueItalic.woff') format('woff');
}
@font-face {
font-family: 'HelveticaNeueMedium';
font-style: normal;
font-weight: normal;
src: local('Helvetica Neue Medium'), url('/html/font/helvetica-neue-5/HelveticaNeueMedium.woff') format('woff');
}
/*@font-face {
    font-family: "Segoe";
    src: url(/html/font/SegoeUI/segoeui.ttf) format("truetype");
}
@font-face {
    font-family: "Lato";
    src: url(/html/font/Lato/Lato-Regular.ttf) format("truetype");
}*/
html, body {
    /*font-family: Tahoma, Arial, sans-serif;*/
    font-family: 'Oswald', Arial, sans-serif !important;
    color: var(--color-text);
    /*color: #444;*/
}
a {
    text-decoration: none !important;
    outline: 0;
    color: var(--renk-bir) !important;
}
a:hover {
    color: var(--renk-altin) !important;
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    font-family: Roboto-Regular, Jost, Tahoma, Arial;
}

h1, .h1 {
    font-size: clamp(1.6rem, 1.2rem + 2.5vw, 3.125rem);
}
h2, .h2 {
    font-size: clamp(1.5rem, 1.1rem + 1.8vw, 2.5rem);
}
h3, .h3 {
    font-size: clamp(1.4rem, 1rem + 1.3vw, 2rem);
}
h4, .h4 {
    font-size: clamp(1.3rem, 0.95rem + 1vw, 1.6rem);
}
h5, .h5 {
    font-size: clamp(1.2rem, 0.9rem + 0.6vw, 1.3rem);
}
h6, .h6 {
    font-size: clamp(1.1rem, 0.9rem + 0.3vw, 1.1rem);
}

.SiteResimleri {
    background-image: url("resimler/rihle_org_tr.png");
}
.genel {
    background-image:url(resimler/rihle_org_tr.png);
    background-repeat:no-repeat;
    background-color:transparent;
}
.ResimYukleniyor {
    background: #333 url(/html/arkaplanlar/1s.jpg) no-repeat fixed center/cover;
}

@media(max-width:767px){
    .YukardanBosluk{
        padding-top: 45px;
    }
    #Logo {
        background-repeat: no-repeat;
        display: block;
        height: 40px;
        margin-top: 2px;
        overflow: hidden;
        text-decoration: none;
        text-indent: -1000px;
        width: 50px;
        background-position: -261px -12px;
    }

    .container {
        padding-left: 1px;
        padding-right: 1px;
    }
}
@media(min-width:768px){
    .YukardanBosluk{
        padding-top: 125px;
    }
    #Logo {
        background-repeat: no-repeat;
        display: block;
        height: 40px;
        /*margin-top: 5px;*/
        overflow: hidden;
        text-decoration: none;
        text-indent: -1000px;
        width: 195px;
        background-position: -19px -16px;
    }
}

#LogoAlt {
    background-repeat: no-repeat;
    display: block;
    height: 42px;
    margin-top: 5px;
    overflow: hidden;
    text-decoration: none;
    text-indent: -1000px;
    width: 293px;
    background-position: -17px -413px;
}

.IcerikListeOge3 {
    min-height: 90px;
    background-size: cover;
}

.icerik_resim_stil {
    border: 1px solid #D4D4D4;
    margin: 5px 15px 15px 5px;
    /*padding: 10px;
    img-responsive*/
    display: block;
    height: auto;
    max-width: 100%;
}

/*.GaleriListeOge {
    background-color: #f7f4f4;
    margin-bottom: 15px;
    padding: 15px;
}
.GaleriListeOge h5 {
    text-shadow: -1px 0 1px rgba(80, 0, 0, 0.3);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.GaleriListeOge h5:hover {
    color: #337ab7;
}
.GaleriListeOge a{
    text-decoration: none;
}
.GaleriListeOge figure:hover img {
    -webkit-transform:scale(1.1) rotate(-2deg);
    transform:scale(1.1) rotate(-2deg);
}
.GaleriListeOge figure {
    overflow:hidden;
}
.GaleriListeOge img {
    -webkit-transition: all 0.7s ease;
    transition: all 0.7s ease;
}*/

.YukleniyorBar1 {
    width: 0;
    animation-name: YukleniyorBar1;
    animation-duration: 4s;
    animation-iteration-count: infinite;
}
@keyframes YukleniyorBar1 {
    0%   {
        width: 0;
    }
    25%  {
        width: 25%;
    }
    50%  {
        width: 50%;
    }
    100% {
        width: 100%
    }
}

.Sirala::before {
    font-family: "Font Awesome 5 Free";
    position: relative;
    content: "\f0dc";
    opacity:.5;
    margin-right: 3px;
}
.Sirala:hover {
    cursor: pointer;
}

.btn {
    border-radius: 5px !important;
}

/*
    animation: pulse 2s infinite;
}

.error-message {
    color: rgba(255, 255, 255, 0.9);
}

@keyframes pulse {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.05);
    }

    100% {
        transform: scale(1);
    }
}*/



#TopMenuOncesi {
    /*background-color: transparent !important;*/
    /*background-color: var(--renk-soluk-yesil) !important;*/
}

#TopMenu {
    /*background-color: transparent !important;*/
}

.TopMiniIkon {
    color: var(--color-primary);
}

.btn-rihle {
    background-color: var(--color-accent);
    border-color: var(--color-accent);
    color: var(--color-primary);
}
.btn-rihle:hover {
    background-color: #b38f3f;
    border-color: #b38f3f;
}

/* Mevcut HoverX class'ların için */
.HoverLacivert:hover {
    color: var(--color-primary) !important;
}
.HoverMavi1:hover {
    color: var(--color-secondary) !important;
}

#MobilMenu {
    background: var(--mobilmenu-zemin); /*#222d32;#2A3F54*/
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(201, 162, 75, 0.3); /* Altın rengi ince şık bir çizgi */
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
}

#Tepe {
    --bs-btn-color: #3b2a05;
    --bs-btn-hover-color: #3b2a05;
    --bs-btn-active-color: #3b2a05;
    --bs-btn-border-color: transparent;
    --bs-btn-hover-border-color: transparent;
    --bs-btn-active-border-color: transparent;
    --bs-btn-focus-shadow-rgb: 201, 162, 75;
    font-weight: 600;
    background: linear-gradient(110deg, #b38728 0%, #fcf6ba 30%, #bf953f 50%, #fbf5b7 70%, #aa771c 100%);
    background-size: 200% 100%;
    background-position: 0 0;
    transition: background-position .6s ease;
}

#Tepe:hover {
    background: linear-gradient(110deg, #b38728 0%, #fcf6ba 30%, #bf953f 50%, #fbf5b7 70%, #aa771c 100%);
    background-position-x: 0%;
    background-position-y: 0%;
    background-size: auto;
    background-size: 200% 100%;
    background-position: 100% 0;
}

#FAciklama h1,
#FAciklama h2 {
    background: linear-gradient(135deg, #bf953f, #fcf6ba, #b38728, #fbf5b7, #aa771c);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    font-family: Chinzel, Jost;
    font-size: 50px;
    font-weight: 600;
    filter:
        drop-shadow(0 1px 0 rgba(60, 40, 5, .6))
        drop-shadow(0 1px 2px rgba(0, 0, 0, .35));
}

@media(max-width:767px){
    #FAciklama h1, h2 {
        font-size: 35px;
    }
    #FAciklama h3 {
        font-size: 15px;
    }
    #FAciklama {
        margin-left: 1rem !important;
    }
}

#FAciklama h3 {
    color: var(--color-primary);
    font-size: 30px;
    font-family: Jost;
    text-shadow: 0 1px 2px rgba(255,255,255,.6), 0 2px 8px rgba(0,0,0,.25);
}

#FYuzey {
    background: linear-gradient( to bottom, rgba(46, 74, 84, 0) 70%, rgba(46, 74, 84, .9) 100% );
}