
:root {

	/**
	 * COLORS
	 */
  
	--gold-crayola: #f6cf8c;
	--quick-silver: hsla(0, 0%, 65%, 1);
	--davys-grey: hsla(30, 3%, 34%, 1);
	--smoky-black-1: hsla(40, 12%, 5%, 1);
	--smoky-black-2: hsla(30, 8%, 5%, 1);
	--smoky-black-3: hsla(0, 3%, 7%, 1);
	--eerie-black-1: hsla(210, 4%, 9%, 1);
	--eerie-black-2: hsla(210, 4%, 11%, 1);
	--eerie-black-3: hsla(180, 2%, 8%, 1);
	--eerie-black-4: hsla(0, 0%, 13%, 1);
	--white: hsla(0, 0%, 100%, 1);
	--white-alpha-20: hsla(0, 0%, 100%, 0.2);
	--white-alpha-10: hsla(0, 0%, 100%, 0.1);
	--black: hsla(0, 0%, 0%, 1);
	--black-alpha-80: hsla(0, 0%, 0%, 0.8);
	--black-alpha-15: hsla(0, 0%, 0%, 0.15);
  
	/**
	 * GRADIENT COLOR
	 */
  
	--loading-text-gradient: linear-gradient(90deg, transparent 0% 16.66%, var(--smoky-black-3) 33.33% 50%,  transparent 66.66% 75%);
	--gradient-1: linear-gradient(to top,hsla(0, 0%, 0%, 0.9),hsla(0, 0%, 0%, 0.7),transparent);
  
	/**
	 * TYPOGRAPHY
	 */
  
	/* font-family */
	--fontFamily-forum: 'Forum', cursive;
	--fontFamily-dm_sans: 'DM Sans', sans-serif;
  
	/* font-size */
	--fontSize-display-1: calc(1.3rem + 6.7vw);
	--fontSize-headline-1: calc(2rem + 2.5vw);
	--fontSize-headline-2: calc(1.3rem + 2.4vw);
	--fontSize-title-1: calc(1.6rem + 1.2vw);
	--fontSize-title-2: 2.2rem;
	--fontSize-title-3: 2.1rem;
	--fontSize-title-4: calc(1.6rem + 1.2vw);
	--fontSize-body-1: 2.4rem;
	--fontSize-body-2: 1.6rem;
	--fontSize-body-3: 1.8rem;
	--fontSize-body-4: 1.6rem;
	--fontSize-label-1: 1.4rem;
	--fontSize-label-2: 1.2rem;
  
	/* font-weight */
	--weight-regular: 400;
	--weight-bold: 700;
  
	/* line-height */
	--lineHeight-1: 1em;
	--lineHeight-2: 1.2em;
	--lineHeight-3: 1.5em;
	--lineHeight-4: 1.6em;
	--lineHeight-5: 1.85em;
	--lineHeight-6: 1.4em;
  
	/* letter-spacing */
	--letterSpacing-1: 0.15em;
	--letterSpacing-2: 0.4em;
	--letterSpacing-3: 0.2em;
	--letterSpacing-4: 0.3em;
	--letterSpacing-5: 3px;
  
	/**
	 * SPACING
	 */
  
	--section-space: 70px;
  
	/**
	 * SHADOW
	 */
  
	--shadow-1: 0px 0px 25px 0px hsla(0, 0%, 0%, 0.25);
  
	/**
	 * BORDER RADIUS
	 */
  
	--radius-24: 24px;
	--radius-circle: 50%;
  
	/**
	 * TRANSITION
	 */
  
	--transition-1: 250ms ease;
	--transition-2: 500ms ease;
	--transition-3: 1000ms ease;
  
  }
  
  

@font-face {
    font-family: 'helvetica';
    src: url('../fonts/helvetica/Helvetica.ttf');
    src: url('../fonts/helvetica/Helvetica-Bold.ttf') format('truetype'),
         url('../fonts/helvetica/helvetica-rounded-bold-5871d05ead8de.otf') format('opentype'),
        url('../fonts/helvetica/Helvetica-BoldOblique.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}
@font-face {
 font-family: 'helvetica';
    src: url('../fonts/helvetica/Helvetica.ttf');
   src: url('../fonts/helvetica/Helvetica-Oblique.ttf') format('truetype'),
         url('../fonts/helvetica/helvetica-compressed-5871d14b6903a.otf') format('opentype'),
        url('../fonts/helvetica/helvetica-light-587ebe5a59211.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}


h1, h2, h3, h4, h5, h6 {
    font-family: 'helvetica', sans-serif;
    font-weight: 700;

}
li,a,
strong,p{
font-family: 'helvetica', sans-serif;
}
/*--- PLACE YOUR CUSTOM STYLES HERE ---*/

/*--- Background Images ---*/
.bg-shortcodes {
    background-image: url(../img/backgrounds/bg-shortcodes.jpg);  
}
.bg-light {
    background-image: url(../img/backgrounds/bg-light.jpg);  
}
.bg-shop {
    background-image: url(../img/backgrounds/bg-shop.jpg);  
}
.bg-about-me {
    background-image: url(../img/backgrounds/bg-about-me.jpg);  
}
.bg-restaurant-1 {
    background-image: url(../img/restaurant/bg-restaurant-1.jpg);  
}
.bg-restaurant-2 {
    background-image: url(../img/restaurant/bg-restaurant-2.jpg);  
}
.bg-pattern-1 {
    background-image: url(../img/backgrounds/bg-pattern-1.jpg);
}
.bg-pattern-2 {
    background-image: url(../img/backgrounds/bg-pattern-2.jpg);
}
.bg-pattern-3 {
    background-image: url(../img/backgrounds/bg-pattern-3.jpg);
}
.bg-pattern-4 {
    background-image: url(../img/backgrounds/bg-pattern-4.jpg);
}
.bg-music-1 {
    background-image: url(../img/music/bg-music-1.jpg);
}
.bg-photography-1 {
    background-image: url(../img/photography/bg-photography-1.jpg);
}
.bg-photography-2 {
    background-image: url(../img/photography/bg-photography-2.jpg);
}
.bg-photography-3 {
    background-image: url(../img/photography/bg-photography-3.jpg);
}
.bg-fitness-1 {
    background-image: url(../img/fitness/bg-fitness-1.jpg);
}
.bg-fitness-2 {
    background-image: url(../img/fitness/bg-fitness-2.jpg);
}
.bg-fitness-3 {
    background-image: url(../img/fitness/bg-fitness-3.jpg);
}
.bg-fitness-4 {
    background-image: url(../img/fitness/bg-fitness-4.jpg);
}
.bg-event-1 {
	background-image: url(../img/event/bg-event-1.jpg);  
}
.bg-event-2 {
	background-image: url(../img/event/bg-event-2.jpg);  
}
.bg-food-1 {
    background-image: url(../img/food/bg-food-1.jpg);  
} 
.bg-food-2 {
    background-image: url(../img/food/bg-food-2.jpg);  
} 
.bg-food-3 {
    background-image: url(../img/food/bg-food-3.jpg);  
}  
.bg-agency-1 {
	background-image: url(../img/agency/bg-agency-1.jpg);  
} 
.bg-agency-2 {
	background-image: url(../img/agency/bg-agency-2.jpg);  
} 
.bg-launching-1 {
    background-image: url(../img/launching/bg-launching-1.jpg);  
}
.bg-launching-2 {
    background-image: url(../img/launching/bg-launching-2.jpg);  
}
.bg-product-1 {
    background-image: url(../img/product/bg-product-1.jpg);  
}
.bg-product-2 {
    background-image: url(../img/product/bg-product-2.jpg);  
} 
.bg-education-1 {
    background-image: url(../img/education/bg-education-1.jpg);  
}
.bg-education-2 {
    background-image: url(../img/education/bg-education-2.jpg);  
} 
.bg-concepts-1 {
    background-image: url(../img/concepts/bg-concepts-1.jpg);  
}
.bg-video-1 {
    background-image: url(../img/video/bg-video-1.jpg); 
}
.bg-img-1 {
    background-image: url(../img/backgrounds/bg-1.jpg); 
}
.bg-img-2 {
    background-image: url(../img/backgrounds/bg-2.jpg); 
}
.bg-img-3 {
    background-image: url(../img/backgrounds/bg-3.jpg); 
}
.bg-img-4 {
    background-image: url(../img/backgrounds/bg-4.jpg);  
}
.bg-img-5 {
    background-image: url(../img/backgrounds/bg-5.jpg); 
} 
.bg-img-6 {
    background-image: url(../img/backgrounds/bg-6.jpg);  
}
.bg-img-7 {
    background-image: url(../img/backgrounds/bg-7.jpg); 
} 
.bg-img-8 {
    background-image: url(../img/backgrounds/bg-8.jpg);  
}    
.bg-img-9 {
    background-image: url(../img/backgrounds/bg-9.jpg);  
} 
.bg-img-10 {
    background-image: url(../img/backgrounds/bg-10.jpg);  
} 
.bg-img-11 {
    background-image: url(../img/backgrounds/bg-11.jpg);  
} 
.bg-img-12 {
    background-image: url(../img/backgrounds/bg-12.jpg);  
} 
.bg-img-13 {
    background-image: url(../img/backgrounds/bg-13.jpg);  
} 
.bg-img-14 {
    background-image: url(../img/backgrounds/bg-14.jpg);  
} 
.bg-img-15 {
    background-image: url(../img/backgrounds/bg-15.jpg);  
} 
.kategori-baslik{
font-size:20px;
  text-transform:uppercase;
  position:relative;
  color:#fff;
  letter-spacing:3px;
  width:max-content;
  margin:0 auto;
  padding: 10px;
  background-color: #000;
}


.urun-liste{
list-style:none;
  margin:50px 0;
  padding:0 70px;
    
  position:relative;
}
.urun-liste li {
  position:relative;
  display:block;
  text-align:left;
  padding:5px 10px;
  margin-bottom:3px;
}
.urun-liste li h5{
margin:0;
}
.urun-liste li strong{
 float:right;
  font-size:24px;
  color:#444;
    padding: 2px 4px;
        border-radius: 6px;
        border: 2px solid #444;
        line-height: 20px;
  
}
.urun-liste li small *{
margin:5px 0 0 0;
  font-size:12px;
  font-weight:600;
  line-height:14px;
  color:#333;
}
.iletisim-liste{
list-style:none; 
  position:relative;
  margin-top:100px;
}
.iletisim-liste li{
    display: inline-block;
    position: relative;
    padding: 5px;
}
.iletisim-liste li a{
font-size:16px;
  font-weight:600;
      font-style: italic;
color:#fff;
}

.iletisim-liste li a i{
margin-right:10px;

color:#f6cf8c;
}
@media (max-width:768px){
.hero-fullscreen {
 top:  0 !important;
 margin-bottom: 20px !important; 
}

  .urun-liste {
    list-style: none;
    margin: 50px 0;
    padding: 0 0px;
    position: relative;
}
  .urun-liste li strong {
 
    font-size: 20px;

}
  .kategori-baslik {
    font-size: 14px;
  }
}

.urun-liste li img{

    max-width: 100%;
    border-radius: 12px;
}
.urun-liste li .row{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
@media (min-width:768px){
.urun-liste li .row .col-md-2{

    width: 12%;
    flex:0 0 12%;

}

.urun-liste li .row .col-md-7{

    width: 78%;
    flex:0 0 78%;

}
.urun-liste li .row .col-md-3{

    width: 10%;
    flex:0 0 10%;

}
}

@media (min-width:768px){
section .row.text-center{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
  
}
#loading-area.menu-loading {
    background-size: 100% 100%;
}

#loading-area.menu-loading {
  
    background-image: url(../img/loadingg.jpg);
    background-color: #E6E3E3;
}
#loading-area {
    width: 100%;
    height: 100%;
    background-color: #E6E3E3;
    position: fixed;
    left: 0;
    top: 0;
    opacity: 1;
    z-index: 999999999;
    background-repeat: no-repeat;
    /* background-size: 60px; */
    /* background-size: 90%; */
    background-position: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

@media (max-width:768px){

    .urun-liste li h5 {

    font-size: 14px;
}

.urun-liste li .row .col-md-2{

    width: 20%;
    flex:0 0 20%;
padding: 0 5px;
}

.urun-liste li .row .col-md-7{

    width: 55%;
    flex:0 0 55%;
    padding: 0 5px;

}
.urun-liste li .row .col-md-3{

    width: 25%;
    flex:0 0 25%;
    padding: 0 5px;

}
.urun-liste li small * {
    font-size: 11px;
    line-height: 12px;
}
}
.scroll-efect{
padding: 5px;
    position: relative;
}
.scroll-efect .sol-icon{

    position: absolute;
    top: 10px;
    left: 10px;
}
.scroll-efect .sag-icon {

    position: absolute;
    top: 10px;
    right: 10px;
}


.scroll-efect .altsol-icon {

    position: absolute;
    bottom: 10px;
    left: 10px;
    transform: rotate(270deg);
}

.scroll-efect .altsag-icon {

    position: absolute;
    bottom: 10px;
    right: 10px;
        transform: rotate(90deg);
}
.left-panel {
    background: transparent;
    position: fixed;
    width: 40px;
    height: auto;
    left: 0;
    bottom: 0;
    z-index: 11;
}
.social-left {
    display: block;
    margin: 0;
    padding: 10px 0;
    list-style: none;
    text-align: center;
    position: absolute;
    left: 0;
    width: 100%;
    bottom: 0;
    background: transparent;
    z-index: 10;
}
.social-left li {
    display: block;
    margin: 15px 0 0 0;
    padding: 0;
}
.social-left li a {
    display: inline-block;
    text-decoration: none;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    font-size: 13px;
    /* border: 1px solid #231f20; */
    color: #ffffff;
    border-radius: 3%;
    -webkit-transition: all .4s;
    -o-transition: all .4s;
    transition: all .4s;
    background: #13362d;
}

.preload {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: var(--gold-crayola);
    z-index: 10;
    display: grid;
    place-content: center;
    justify-items: center;
    transition: var(--transition-2);
  }
  
  .preload > * { transition: var(--transition-1); }
  
  .preload.loaded > * { opacity: 0; }
  
  .preload.loaded {
    transition-delay: 250ms;
    transform: translateY(100%); 
    display:none !important;
  }
  
  .circle {
    width: 112px;
    height: 112px;
    border-radius: var(--radius-circle);
    border: 3px solid var(--white);
    border-block-start-color: var(--smoky-black-3);
    margin-block-end: 45px;
    animation: rotate360 1s linear infinite;
  }
  
  @keyframes rotate360 {
    0% { transform: rotate(0); }
    100% { transform: rotate(1turn); }
  }
  
  .preload .text {
    background-image: var(--loading-text-gradient);
    background-size: 500%;
    font-size: calc(2rem + 3vw);
    font-weight: var(--weight-bold);
    line-height: 1em;
    text-transform: uppercase;
    letter-spacing: 16px;
    padding-inline-start: 16px;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-stroke: 0.5px var(--eerie-black-3);
    animation: loadingText linear 2s infinite;
  }
  
  @keyframes loadingText {
    0% { background-position: 100%; }
    100% { background-position: 0%; }
  }
  .heading .heading--subtitle {
	color: #f6cf8c;
	font-family: 'Ruthie', cursive;
	font-size: 24px;
	font-weight: 400;
	line-height: 1;
	margin-bottom: 5px;
	text-transform: capitalize;
}

.heading .heading--title {
	font-family: 'Abril Fatface', cursive;
	color: #fff;
	font-size: 30px;
	font-weight: 400;
	line-height: 1;
	margin-bottom: 25px;
}
.heading .heading--desc *,

.heading .heading--desc {
	font-family: 'Poppins', sans-serif;
	color: #ddd;
	font-size: 14px;
	font-weight: 400;
	line-height: 24px;
	margin-bottom: 0;
	padding: 0 20px;
}

  
.d-grid-list {
    display: grid;
    gap: 36px;
}
@media (min-width: 768px) {
    .d-grid-list {
        grid-template-columns: 1fr 1fr;
    }
}
 .d-grid-list {
    margin-block-end: 50px;
}
@media (min-width: 992px) {
.d-grid-list {
        position: relative;
        column-gap: 90px;
    }
}
@media (min-width: 1200px) {
.d-grid-list {
        gap: 25px 200px;
        margin-block-end: 55px;
    }
}

@media (min-width: 992px) {
.d-grid-list::before {
        content: "";
        position: absolute;
        top: 0;
        left: 50%;
        height: 100%;
        border-inline-start: 1px solid var(--white-alpha-20);
    }
}
.grid-list-item {
    display: flex;
    align-items: flex-start;
    gap: 20px;
}
.img-holder {
    aspect-ratio: var(--width) / var(--height);
    /* overflow: hidden; */
    background-color: var(--eerie-black-4);
}
.grid-list-item:hover .card-banner {
    background-color: #f6cf8c;
}
.grid-list-item .card-banner {
    flex-shrink: 0;
    border-radius: 24px;
}

.img-cover {

    object-fit: cover;
}
.grid-list-item .card-banner .img-cover {
    transition: var(--transition-2);
	border-radius: 24px;
}
.grid-list-item:is(:hover, :focus-within) .card-banner .img-cover {
    opacity: 0.7;
    transform: scale(1.05);
}
ul li{

	list-style: none;
}

	.grid-list-item  .title-wrapper {
        display: flex;
        justify-content: flex-start;
        align-items: center;
        gap: 15px;
    }

.grid-list-item .title-wrapper h3{

	font-size: 20px;
	font-weight: 400;
	color: #fff;
	margin: 0;
}
.grid-list-item .title-wrapper h3 a{

	transition: 250ms ease;
}
.grid-list-item .title-wrapper h3 a:is(:hover, :focus-visible) {
    color: #f6cf8c;
}

.grid-list-item .title-wrapper span {
    font-size: 25px;
	color:  #f6cf8c;
	margin-block: 10px;
}
.grid-list-item .title-wrapper span {
    flex-grow: 1;
    display: flex;
    align-items: center;
    gap: 15px;
    position: relative;
}


	.grid-list-item .title-wrapper span::before {
        content: "";
        height: 6px;
        flex-grow: 4;
        border-block: 1px dashed rgba(255,255,255,.2);
    }

.card-text{

	display: block;
	width:100%;
    text-align: left;
    color: #aaa;
    font-size: 12px;
}

.divider--shape-4 {
	width: 100%;
	height: 16px;
	background: url(../img/shapes.png) center no-repeat;
	margin-bottom: 25px;
	margin-top: 22px;
}
@media (max-width: 575px) {
    .grid-list-item .title-wrapper h3{

        font-size: 16px;
      
    }
    .grid-list-item .title-wrapper span {
        font-size: 16px;
    }
}
.border-sec{

    position: relative;
   display:block;
}
.border-sec:before{

    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    content: "";
    border-width: 1px;
    border-style: dashed;
    border-color: rgb(205, 175, 128);
    border-image: initial;
    padding: 20px;
 
}