/*
Theme Name: Opseques Blog
Theme URI:
Author: Celebi Selli
Author URI: https://celebiselli.com
Description: Seo compatible and fast wordpress blog/magazine theme.
Version: 1.4
*/

h1.site-title {
    width: fit-content;
    float: left;
    margin: 32px 0 20px 5px
}

.sub-menu {
    padding: 0 0 0 15px
}

img.searchicon {
    margin: 4px 0 -8px -33px;
    position: absolute;
    width: 20px;
    height: 20px;
    border: none
}



h1 {
    font-size: 28px;
    margin: 20px 0
}

h2 {
    font-size: 25px;
    margin: 35px 0 15px 0
}

h3 {
    font-size: 22px;
    margin: 35px 0 15px 0
}

h4 {
    font-size: 19px;
    margin: 35px 0 15px 0
}

h5 {
    font-size: 16px;
    margin: 35px 0 15px 0
}

h6 {
    font-size: 14px;
    margin: 35px 0 15px 0
}

p {
    font-family: inherit;
    font-weight: 400;
    font-size: 17px;
    color: #393e46;
    line-height: 26px;
    display: block
}

img.attachment-post-thumb.size-post-thumb.wp-post-image {
    max-width: 100%;
    height: auto
}

.footerc a {
    color: #fff;
    font-weight: 400;
    font-size: 14px
}

a.singlesitetitle {
    margin: 32px 0 0 55px;
    display: table-cell;
    font-size: 28px;
    position: absolute;
    font-weight: 700
}

li {
    line-height: 22px;
    margin: 15px 0;
    color: #2c2f34
}

.comment {
    margin: 20px 0;
    border: 1px solid #e4e4e4;
    padding: 10px 10px 10px 10px;
    border-radius: 5px
}

cite.fn {
    margin: 0 0 15px 15px;
    position: absolute;
    font-size: 18px;
    text-transform: capitalize
}

.comment-meta.commentmetadata {
    position: absolute;
    margin: -45px 0 0 83px
}

ol.comment-list {
    padding: 0
}

.top {
    --offset: 50px;
    position: sticky;
    bottom: 20px;
    margin-left: 100%;
    place-self: end;
    margin-top: calc(100vh + var(--offset));
    text-decoration: none;
    padding: 7px;
    font-family: sans-serif;
    color: #fff;
    background: #065c8e;
    border-radius: 5px;
    white-space: nowrap;
    font-size: 20px
}

h3#reply-title {
    padding: 10px 0 10px 20px;
    border-radius: 4px;
    border-left: 15px solid #065c8e;
    background-color: #f7f7f7 !important
}

ul#menu-footer {
    margin: -10px 5px 5px 5px
}

a.comment-reply-link {
    background-color: #818181;
    color: #fff;
    padding: 5px 10px;
    border-radius: 5px;
    margin: 0 0 10px 0;
    display: inline-block
}

.saat {
    width: 16px;
    height: 16px;
    margin: 0 5px -2px 0
}

a.footertext {
    color: #fff
}

span.says {
    display: none
}

a.url {
    color: #16cc62 !important;
    font-size: 20px;
    font-weight: 200
}

.alignright {
    float: right;
    margin: 0 0 10px 20px
}

.rand-title {
    margin: 8px 0 0 0;
    font-size: 17px;
    display: block;
    font-weight: 600
}

p.comment-form-author,
p.comment-form-email,
p.comment-form-url,
p.form-submit {
    margin: 15px 0
}

.post-wrap {
    text-align: left
}

.relatedpost {
    padding: 10px 0 10px 20px;
    border-radius: 4px;
    border-left: 15px solid #065c8e;
    background-color: #f7f7f7 !important;
    padding: 15px 10px 15px 10px
}

.alignleft {
    float: left;
    margin: 0 20px 10px 0
}

.aligncenter {
    display: block;
    margin: 0 auto 1px auto;
    clear: both
}

.related-post {
    width: 350px;
    height: 275px;
    margin: 7px 5px;
    padding: 7px 7px 13px 7px;
    display: inline-grid;
    border: 1px solid #f5f5f5
}

.wp-caption p.wp-caption-text {
    font-size: 12px;
    font-style: italic;
    line-height: 20px;
    padding: 0 5px;
    margin: 5px 0
}

nav {
    display: flex;
    float: right;
    margin: 10px 0 0 0
}

textarea#comment {
    width: 80%
}

ul {
    list-style: none
}

.menu-item::before {
    display: none
}

ul li::before {
    content: "\2022";
    color: #16cc62;
    font-weight: 700;
    display: inline-block;
    width: 25px;
    font-size: 48px;
    position: relative;
    left: 0;
    top: 10px
}

ul {
    padding: 0 15px
}

ul#menu-head {
    width: fit-content;
    margin: 31px 0
}



img.attachment-post-thumbnail.size-post-thumbnail.wp-post-image {
    max-width: 100%
}

body {
    font-family: sans-serif
}

.wp-caption {
    max-width: 100%
}

.postdesc {
    color: #666;
    padding: 0 0;
    line-height: 20px;
    font-size: 13px
}

.postdesc p {
    color: #666;
    padding: 0 0;
    line-height: 20px;
    font-size: 13px
}

.fipost {
    float: left;
    margin: 0 10px 0 0;
    max-width: 100%
}

div#primary {
    display: flex
}

span.entry-date {
    font-size: 13px;
    color: #767676;
    display: inherit;
    margin: 10px 0
}

.more-link {
    background-color: #065c8e;
    padding: 8px 15px;
    color: #fff;
    display: inline-block;
    3px 0 12px 0;
    border-radius: 3px;
    font-size: 13px
}

a {
    text-decoration: none;
    color: #333
}

.menuimg {
    margin: 25px 5px
}

span.page-numbers.current {
    background-color: #065c8e;
    color: #fff;
    padding: 5px 10px;
    border-radius: 5px;
    margin: 15px 3px;
    display: inline-block
}

a.page-numbers {
    color: #003f00;
    padding: 5px 10px;
    border-radius: 5px;
    margin: 15px 3px;
    display: inline-block;
    border: 1px solid #333
}

input {
    height: 26px;
    border: 1px solid #d0d0d0
}

textarea#comment {
    border: 1px solid #d0d0d0
}

p.comment-notes {
    font-size: 13px;
    line-height: 30px
}

p.comment-form-cookies-consent {
    font-size: 13px;
    display: flex;
    line-height: 30px
}

.footerc {
    background-color: #191919;
    color: #fff;
    padding: 10px 15px;
    font-size: 15px;
    max-width: 100%
}

.post-wrap {
    border: 1px solid #e9e9e9;
    clear: both;
    margin: 12px 0;
    height: 197px;
    display: block;
    max-height: 197px;
    border-radius: 5px;
    width: inherit
}

.page-nav-container {
    clear: both;
    text-align: center;
    margin: 15px 0 30px 0
}

img.custom-logo {
    float: left;
    margin: 20px 0 0 5px
}

@media only screen and (max-width:971px) {
    .top {
        margin-left: 90%
    }
    .titlecat {
        margin: 20px 10px
    }
    ul#menu-footer {
        margin: 5px 5px 5px 5px
    }
    .footerc {
        text-align: center;
        padding: 10px 0
    }
    .footerc li a {
        color: #000;
        font-weight: 600;
        font-size: 17px;
        border: 1px solid #333;
        padding: 5px 10px
    }
    .footerc li {
        border: none;
        display: inline-block;
        padding: 5px 5px;
        margin: 10px 5px
    }
    div#footer-menu {
        margin: 20px 0 10px 0
    }
    h1.site-title {
        margin: 32px 0 20px 10px
    }
    html {
        max-width: 100%
    }
    article.box {
        padding: 0 10px
    }
    .postdesc {
        padding: 0 0
    }
    .showhide {
        margin-bottom: .4em
    }
    .showhide .show {
        display: none
    }
    .showhide:target .show {
        display: block
    }
    .showhide:target .hide {
        display: none
    }
    nav {
        display: block;
        float: left;
        background-color: #e6f7d1;
        max-width: 100%;
        text-align: center;
        width: 100%
    }
    ul#menu-head {
        margin: 33px 0;
        width: auto
    }
    a.menux {
        float: right;
        margin: 0 15px
    }
    .menu-item {
        margin: 10px 0;
        list-style: none
    }
    form.searchbox {
        margin: 25px 0 35px 10px;
        height: 20px;
        float: initial;
        text-align: center
    }
}

.breadcrumb {
    font-size: 13px;
    line-height: 20px;
    padding: 10px 2px 10px 0;
    opacity: .9
}

@media only screen and (max-width:760px) {
    img {
        max-width: 100%;
        height: auto
    }
    h2.h2tit {
        margin: 15px 0;
        width: 100%
    }
    div#comments {
        padding: 5px 10px
    }
    .breadcrumb {
        padding: 5px 3px 0 5px
    }
    .relatedpost {
        padding: 15px 10px 15px 10px;
        max-width: 90%;
        margin: 30px 10px 20px 13px
    }
    .related-post {
        width: 350px;
        margin: 15px 0;
        padding: 0;
        border: none
    }
    .rposts {
        max-width: 350px;
        margin: 0 auto
    }
}

@media only screen and (max-width:1300px) {
    .menu-item {
        font-size: 20px;
        line-height: 20px;
        margin: 20px 0;
        font-weight: 600;
        padding: 0
    }
    .post-wrap {
        border: none;
        padding: 5px 10px 25px 10px;
        display: table-row;
        margin: 0;
        max-width: 350px
    }
}

@media only screen and (max-width:460px) {
    .post-wrap {
        padding: 5px 10px 25px 10px;
        display: inline-table
    }
    body {
        margin: 0;
        padding: 0 12px
    }
    .fipost {
        float: left;
        margin: 0;
        max-width: 100%
    }
}

.homeic {
    width: 14px;
    height: 14px;
    margin: 0 5px -1px 0
}

label {
    display: block
}

input#submit {
    background-color: #065c8e;
    color: #fff;
    padding: 15px 15px;
    border-radius: 5px;
    display: inline-block;
    border: none;
    font-size: initial;
    height: 45px !important
}

@media only screen and (min-width:972px) {
    div#content {
        width: 800px;
    }
    header#masthead {
        margin: -10px 0 20px 0
    }
    .post-wrap {
        margin: 5px 0
    }
    img.custom-logo {
        margin: 20px 0 0 10px
    }
    div#respond {
        border: 1px solid #e2e2e2;
        margin: 20px 0 20px 0;
        padding: 10px 25px
    }
    .h2tit {
        margin: 11px 0;
        font-size: 20px
    }
    div#content {
        border: 1px solid #f4f4f4;
        padding: 10px 20px;
        margin: 25px 0
    }
    a.menux {
        display: none !important
    }
    .menu-item {
        display: inline-flex;
        list-style: none;
        margin: 0 10px;
        font-size: 15px;
        font-weight: 600
    }
    .fipost {
        margin: 0 20px 0 -10px
    }
    .post-wrap {
        padding: 0 10px
    }
    body {
        max-width: 84%;
        margin: 0 auto
    }
}

.post-tags {
    margin-top: 15px;
    border-top: 1px solid #eee;
    padding-top: 10px;
}

.post-tags a {
    background: #f5f5f5;
    color: #333;
    padding: 5px 10px;
    margin: 3px;
    border-radius: 4px;
    text-decoration: none;
    display: inline-block;
}

.post-tags a:hover {
    background: #333;
    color: #fff;
}



/* enes */
/* === Header düzeni (3'lü hizalama: logo - arama - menü) === */
header#masthead {
  display: flex !important;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  border-bottom: 1px solid #e9e9e9;
  padding: 20px 15px;
}

/* Sol taraf (logo + site başlığı) */
header#masthead .custom-logo,
header#masthead .site-title,
header#masthead .singlesitetitle {
  float: none !important;
  margin: 0;
}

/* Orta: arama alanı */
.header-search-wrapper {
  flex: 1;
  text-align: center;
  position: relative;
}
/* Arama formu */
form.searchbox {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  margin: 0 auto;
}

/* Input */
input#search {
  height: 32px;
  border: 3px solid rgb(0 0 0);
  border-radius: 6px;
  padding: 4px 36px 4px 10px; /* buton için sağ boşluk */
  font-size: 14px;
  width: 240px;
  outline: none;
  transition: border-color 0.2s;
}

input#search:focus {
  border-color: #0073aa; /* WP mavi */
}

/* Buton */
button.searchicon {
  position: absolute;
  right: 5px;
  background: transparent;
  border: none;
  padding: 4px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px;
  transition: background 0.2s;
}

button.searchicon:hover {
  background: rgba(0, 115, 170, 0.1);
}

button.searchicon img {
  width: 18px;
  height: 18px;
  opacity: 0.7;
  transition: opacity 0.2s;
}

button.searchicon:hover img {
  opacity: 1;
}
@media (max-width: 768px) {
  header#masthead {
    flex-direction: column;
    align-items: center;
  }

  .header-search-wrapper {
    width: 100%;
    margin: 12px 0;
  }

  input#search {
    width: 90%;
    max-width: 400px;
  }

  form.searchbox img.searchicon {
    right: 25px; /* mobilde biraz içeri gelsin */
  }

  nav.main-navigation {
    margin-top: 10px;
  }
}