:root{
    --primary-color: #5F401B;
    --secondary-color: #9CC03C;
    --yellow-color: #F9C113;
    --solid-color: #F9C113;
    --light-color: #f2f5f7;
    --green-color: #0b8744;
    --transition: .2s ease all;
}

body{
    font-family: "Fellix", sans-serif;
    font-size: 15px;
    background: url(../images/pattern.png) repeat #f4f4f4;
}

a { text-decoration: none; }
.border-0{ border: 0; }
.border-dashed{ border-style: dashed !important; }
.radius{ border-radius: 5px; }
.shadow-m { box-shadow: 0 0 .5rem rgba(0,0,0,.3)!important;}
.rounded-5 { border-radius: .5rem!important; }
.form-label{ font-weight: 500; }
.form-control{ padding: .899rem 1.875rem; font-size: 16px;}
.form-control-solid, .form-select-solid{  background-color: #f4f4f4; transition: all .3s ease; outline: 0; border: 2px solid transparent; }
.form-control-solid:focus, .form-select-solid:focus{ box-shadow: 5px 5px 20px rgba(0,0,0,.1);  }
.form-select-solid{ padding: .899rem 1.875rem; font-size: 16px;}

/* breadcrumb */
#breadcrumb{ z-index: 999; padding: 35px 0; display: flex; justify-content: center; color: #fff; }
#breadcrumb > .container{ display: flex; flex-direction: column; align-items: center; }
#breadcrumb h1{ position: relative; font-size: 2rem; font-weight: 700; margin-bottom: 10px; }
#breadcrumb h1{ position: relative; margin: 0 0 15px; padding-bottom: 15px; color: var(--primary-color);  font-size: 2rem; font-weight: 700; letter-spacing: -1px; }
#breadcrumb h1:after{ content: ''; position: absolute; background: var(--yellow-color); height: 1px; width: 100px; top: 100%; left: 50%; margin-left: -50px; }

.breadcrumb{ border: 0; margin-bottom: 0; border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; font-weight: 300; font-size: 0.925rem; color: #999; }
.breadcrumb a{ color: #666; }
.breadcrumb a:hover{ color: #000; text-decoration: none; }

/**/
.shadow{ box-shadow: 0 0 5px rgba(0,0,0,.05) !important; }
.rounded{ border-radius: 7px !important; -webkit-border-radius: 7px !important; -moz-border-radius: 7px !important; }

/* header */
header{ border-bottom: 2px solid #F9C113; padding: 20px 0; background: #fff; }
header .right{ display: flex; flex-direction: column; justify-content: center; }
header .logos{ display: flex; gap: 10px; }
header .logos img{ height: 50px; }

.navbar-brand{ }
.navbar-brand img { height: 50px; }

/* navbar */
.navbar-collapse{ justify-content: right; }
.navbar-nav{ display: flex; flex-direction: row; gap: 10px; align-items: center; }
.nav-item{ display: flex; font-weight: 500; font-size: 16px; }
.nav-link{ color: var(--primary-color); padding: 5px 10px !important; }
.nav-link:hover{ color: var(--secondary-color); }
.nav-link:focus, .nav-link:hover{ color: var(--secondary-color); }
.nav-item .dropdown-menu{ padding: 5px; min-width: 300px; max-width: 100%; }
.nav-item .dropdown-menu > .nav-item{ border-bottom: 1px solid #efefef; font-size: 14px; font-weight: 500; padding: 5px 10px; }
.nav-item .dropdown-menu > .nav-item > .nav-link{ color: #000; display: block; }
.nav-item .dropdown-menu > .nav-item > .nav-link:hover{ color: var(--primary-color); }
.nav-item .dropdown-toggle::after{ transition: all .2s ease-in-out; -webkit-transition: all .2s ease-in-out; border: 0; vertical-align: inherit; margin-left: 8px; content: '\f078'; font-family: "Font Awesome 6 Pro"; }
.nav-item .dropdown-toggle.show::after{ transform: rotate(180deg); transition: all .2s ease-in-out; -webkit-transition: all .2s ease-in-out; }
.nav-planting{ border: 2px solid var(--primary-color); border-radius: 21px; padding: 5px 30px !important; transition: var(--transition); -webkit-transition: var(--transition); -moz-transition: var(--transition); }
.nav-planting:hover{ background: var(--primary-color); color: #fff; transition: var(--transition); -webkit-transition: var(--transition); -moz-transition: var(--transition); }

.nav-login{ background:#f4f4f4; color: #000; border-radius: 5px; padding: 8px 15px !important; transition: var(--transition); -webkit-transition: var(--transition); -moz-transition: var(--transition); }
.nav-login:hover{ background: var(--secondary-color); color: #fff; transition: var(--transition); -webkit-transition: var(--transition); -moz-transition: var(--transition); }
.nav-account{ background:#f4f4f4; color: #000; border-radius: 5px; padding: 8px 15px !important; transition: var(--transition); -webkit-transition: var(--transition); -moz-transition: var(--transition); }
.nav-account:hover{ background: var(--secondary-color); color: #fff; transition: var(--transition); -webkit-transition: var(--transition); -moz-transition: var(--transition); }

.nav-register{ background:#198754; color: #fff; border-radius: 5px; padding: 8px 15px !important; transition: var(--transition); -webkit-transition: var(--transition); -moz-transition: var(--transition); }
.nav-register:hover{ background: var(--secondary-color); color: #fff; transition: var(--transition); -webkit-transition: var(--transition); -moz-transition: var(--transition); }

/**/
.subnav{ background: #ebebeb; box-shadow: 0 0 5px rgba(0,0,0,.2); }
.subnav ul{ list-style: none; margin: 0; padding: 0; display: flex; justify-content: end; }
.subnav li a{ font-weight: 500; padding: 15px; display: flex; color: #444; font-size: 15px; }
.subnav li a:hover, .subnav li.active a{ color: var(--primary-color); }

/**/
.section{ padding: 60px 0; position: relative; }

/**/
.card{ box-shadow: 0 0 10px rgba(0,0,0,.05); border: 0; border-radius: 7px; overflow: hidden; }
.card .card-header{ border-bottom: 0; background: #fff; border-radius: 0; padding: 20px 30px; border-bottom: 1px solid #efefef; }
.card .card-header .card-title{ margin: 0; font-size: 18px; font-weight: 600; }
.card .card-body{ padding: 2.5rem; }
.card .card-footer{ background: #fff; padding: 1.5rem 2.5rem; border-top: 1px solid #efefef; }

/**/
.account-home{ text-align: center; }

.account-actions{}
.account-actions a{ margin-bottom: 30px; display: flex; flex-direction: column; gap: 10px; align-items: center; font-size: 16px; border: 1px solid #ddd; border-radius: 5px; padding: 20px; justify-content: center; }
.account-actions a:hover{ background: #fff; }
.account-actions a i{ font-size: 30px; color: var(--primary-color); }
.account-actions a span{ font-weight: 500; color: #000; }

/* contact */
.contact-item { background: #fff; padding: 20px; display: flex; align-items: center; height: 120px; }
.contact-item > i{ flex: 0 0 40px; text-align: left; border-right: 1px solid #efefef; margin-right: 10px; font-size: 24px; }
.contact-item strong{ font-weight: 600; }
.contact-item p{ margin: 0; }

#contact { padding-top: 0; }
#contact > iframe{ margin-bottom: 30px; }
#contact .contact-form{ padding: 40px; border-radius: 5px; background: rgb(242,245,247);
    background: -moz-linear-gradient(180deg, rgba(242,245,247,1) 0%, rgba(255,255,255,1) 50%);
    background: -webkit-linear-gradient(180deg, rgba(242,245,247,1) 0%, rgba(255,255,255,1) 50%);
    background: linear-gradient(180deg, rgba(242,245,247,1) 0%, rgba(255,255,255,1) 50%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f2f5f7",endColorstr="#ffffff",GradientType=1); }
#contact .contact-form .form-control{ border: 1px solid #dadfe0; box-shadow: 3px 3px 0 rgba(0,0,0,.05); padding: .75rem 1.25rem;  }

#contact .contact{ font-size: 15px; }
#contact .contact strong{ font-weight: 600; display: block; margin-bottom: 5px; }

/**/
#page{}
#page .page-header{ margin-bottom: 20px; }
#page .page-header h2{ font-size: 24px; }
#page .page-header span{ font-size: 16px; font-weight: 400; color: #999; }
#page .page-body{ font-size: 18px; line-height: 1.7;}

/**/
#error404{ width: 100%; position: relative; text-align: center; margin: 100px 0; }
#error404 .code {  z-index: -1; }
#error404 .code h1 { color: #ddd; font-weight: 500; font-size: 80px;  margin: 0;}
#error404 h2 { font-size: 30px; color: #000;  margin: 0;}
#error404 p { font-size: 20px; font-weight: 300; color: #000; margin-top: 15px; }
#error404 a { margin-top: 50px; display: inline-block; font-size: 20px; text-decoration: none; color: #29A9E1; font-weight: 400; -webkit-transition: 0.2s all; transition: 0.2s all;}

/**/
footer{ margin-top: 40px; }
footer .footer-top{ }
footer .footer-bottom{ background: #fff; padding: 15px 0; }
footer .container{ display: flex; justify-content: space-between; align-items: center; }
footer .logos{ display: flex; gap: 10px; }
footer .logos img{ height: 60px; }
footer .social{ display: flex; gap: 20px; }
footer .social .kvkk{ display: flex; background: rgba(0,0,0,.2); padding: 0 30px; justify-content: center; align-items: center; border-radius: 15px; height: 30px; color: #fff; font-weight: 400; }
footer .social .url{ display: flex; background: var(--primary-color); padding: 0 30px; justify-content: center; align-items: center; border-radius: 15px; height: 30px; color: #fff; font-weight: 600; }
footer .social .social-accounts{ display: flex; gap: 5px; }
footer .social .social-accounts a{ display: flex; align-items: center; justify-content: center; background: var(--primary-color); color: #fff; width: 30px; height: 30px; border-radius: 100%; }

/**/
#upload-zone{}
#upload-zone .remove{ border-radius: 100%; width: 30px; height: 30px; padding: 0; line-height: 100%; position: absolute; right: 0; top: -10px; }

/* HERO */
.hero { min-height: 400px;  position: relative; z-index: 10; color: var(--secondary-color); text-align: center; padding-top: 60px; }
@media (max-width: 991px) {
    .hero {
        min-height: 280px; } }

.hero--sm {
    min-height: 280px; }

.hero--xs {
    min-height: 180px; }

.hero--has-overlay:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: rgba(51, 33, 79, 0.72);
    z-index: -1; }

/**/
.competition{ overflow: hidden; display: block; position: relative; border-radius: 10px; box-shadow: 0 0 10px rgba(0,0,0,.05); }
.competition img{ width: 100%; height: 250px; object-fit: cover; border-radius: 5px; }
.competition strong{ font-size: 1.125rem; text-align: center; font-weight: 500;  position: absolute; bottom: 0; left: 0; right: 0; padding: 30px 20px 20px; color: #fff; background: rgb(0,0,0);background: linear-gradient(0deg, rgba(0,0,0,0.75) 0%, rgba(0,0,0,0) 100%); }

.photo{ }
.photo a{ margin-bottom: 10px; overflow: hidden; display: block; position: relative; border-radius: 7px; box-shadow: 0 0 10px rgba(0,0,0,.05); }
.photo a img{ width: 100%; height: 300px; object-fit: cover; border-radius: 5px; }
.photo a strong{ font-size: 1.125rem; text-align: center; font-weight: 500;  position: absolute; bottom: 0; left: 0; right: 0; padding: 30px 20px 20px; color: #fff; background: rgb(0,0,0);background: linear-gradient(0deg, rgba(0,0,0,0.75) 0%, rgba(0,0,0,0) 100%); }
.photo .photographer{ display: flex; gap: 5px; color: #666; align-items: center; padding: 0 10px; }
.photo .photographer span{ height: 20px; }

.photo-info{ background: rgba(255,255,255,.25); text-align: left !important; padding: 20px 40px; display: flex; gap: 20px; justify-content: space-between; align-items: center; }
.photo-info .photo-title{ font-weight: 400; font-size: 1rem; margin-bottom: 2px; }
.photo-info .photo-description{ color: #ccc; margin-bottom: 10px; }
.photo-info .photo-photographer{ color: #aaa; }

/**/
.swal2-container{ z-index: 10000000 !important; }