/*
================================================================================

  Theme Name : Dilek Makine
  Version    : 1.0.0
  Author     : Arda Gedik
  Date       : 25/01/2023

================================================================================
  CSS Documentation
================================================================================

  1.0.0     - General Options
  1.1.0     - Box Shadows
  1.1.1     - Breadcrumb
  1.1.2     - Post Categories & Date
  1.1.3     - Slider

  1.2.0     - Layouts
    1.2.1   - Header
    1.2.2   - Content
    1.2.3   - Footer
  1.3.0     - Colors

  2.0.0     - Pages
    2.1.0   - Home
      2.1.1 - Products (Landscape & Portrait)
      2.1.2 - News
    2.2.0   - Single
      2.2.1 - Author
      2.2.2 - Comments
      2.2.3 - Write Comments

================================================================================
  1.0.0 - General Options
================================================================================
*/

@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700&subset=latin-ext');
body {

  font-family: 'Source Sans Pro', sans-serif;
  font-size  : 14px;
  font-weight: 400;
  line-height: 2;
  background: #FFF;
  text-align : justify;

}

.head-logo {
  width: 85px;
  height: 80px;
  margin-top: 6px;
}

.container{
  max-width: 960px;
}

html {
  scroll-behavior: smooth;
}


/*
================================================================================
  1.1.0 - Box Shadows
================================================================================
*/

.raised-shadow {
  -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.10);
          box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.10);
}

.overlay-shadow {
  -webkit-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.10);
          box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.10);
}

.sticky-nav-shadow {
  -webkit-box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.10);
          box-shadow: 0 6px 12px 0 rgba(0, 0, 0, 0.10);
}

.temporary-nav-shadow {
  -webkit-box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.10);
          box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.10);
}

.pop-out-shadow {
  -webkit-box-shadow: 0 12px 24px 0 rgba(0, 0, 0, 0.10);
          box-shadow: 0 12px 24px 0 rgba(0, 0, 0, 0.10);
}

.shadow {
  -webkit-box-shadow: 0 12px 24px 0 rgba(0, 0, 0, 0.30);
          box-shadow: 0 12px 24px 0 rgba(0, 0, 0, 0.30);
}

/*
================================================================================
  1.1.1 - Breadcrumb
================================================================================
*/

.bread-crumb a {

  display        : inline-block;
  text-decoration: none;
  color          : #7D7D7D;
  font-size      : 14px;
  font-weight    : 400;

}

.bread-crumb a:after {
  content: " »";
}

.bread-crumb a:last-child:after {
  content: "";
}

/*
================================================================================
  1.1.2 - Post Categories & Date
================================================================================
*/

.post-categories,
.post-date {
  display: inline-block;
}

.post-categories .post-category {

  background : #2196F3;
  padding    : 5px 10px;
  color      : #FFF;
  font-weight: 400;
  font-size  : 11px;
  display    : inline-block;

}

.post-date span {

  display    : block;
  font-size  : 13px;
  font-weight: 300;
  padding    : 3px 0px;
  color      : #7D7D7D;

}


/*
================================================================================
  1.1.3 - Slider
================================================================================
*/

.carousel {

  margin-bottom: 30px;
  background   : #FFF;
  padding      : 5px;

}

.carousel,
.carousel .carousel-item img {
  width: 100%;
}

.carousel-indicators li {
  cursor: pointer;
}

/*
================================================================================
  1.2.0 - Layouts
================================================================================
  1.2.1 - Header
================================================================================
*/

.header > .container,
.header > .container-fluid {

  background   : #FFF;
  margin-bottom: 30px;

}

.header .container .row {

  padding-left : 15px;
  padding-right: 15px;

}

.header .logo {

  text-transform: uppercase;
  padding-bottom: 15px;
  text-align    : center;

}

.header .logo a {

  display        : block;
  text-decoration: none;

}

.logo-subtitle{
  display: block;
  width: 100%;
  text-align: center;
}

.header .logo h1,
.header .logo h2,
.header .logo h3,
.header .logo h4,
.header .logo h5,
.header .logo h6 {

  color      : #2196F3;
  font-weight: 700;
  font-size  : 30px;
  padding    : 15px 0 0 0;
  margin     : 0;

}

.header .logo span {

  color      : #000;
  font-size  : 11px;
  font-weight: 700;

}

.header ul {

  margin    : 0;
  padding   : 0;
  list-style: none;

}

/* Top Menu */
.header .top-menu ul li {

  padding: 3px 20px 0px 0px;
  display: inline-block;

}

.header .top-menu ul li:last-child {
  padding-right: 0;
}

.header .top-menu ul li,
.header .top-menu ul li a {

  font-size  : 13px;
  font-weight: 400;
  color      : #FFF;

}

.header .top-menu ul li span {
  margin-left: 10px;
}

.header .top-menu ul li i:hover{

  -webkit-transition: all .5s;
    -o-transition   : all .5s;
    transition      : all .5s;
  -webkit-transform : rotate(360deg);
      -ms-transform : rotate(360deg);
          transform : rotate(360deg);

}


/* Navigation Menu */
.header .navigation-menu ul {
  font-size: 0;
}

.header .navigation-menu ul li {

  display : inline-block;
  position: relative;

}

.header .navigation-menu ul li a {

  position       : relative;
  display        : inline-block;
  width          : 100%;
  text-decoration: none;
  text-transform : uppercase;
  color          : #7D7D7D;
  font-size      : 15px;
  font-weight    : 600;
  padding        : 32.5px 15px;

}

.header .navigation-menu ul li a > i {

  font-size  : 10px;
  font-weight: 300;
  float      : right;
  line-height: 2;
  padding    : 3px;
  margin-left: 5px;
  min-width  : 10px;

}

.header .navigation-menu ul li a i.dropdown-icon:before {
  content: "\f067";
}

.header .navigation-menu ul li ul li:hover > a > i:before {
  content: "\f068";
}

.header .navigation-menu ul li a:after,
.header .navigation-menu ul li:hover a:after,
.header .navigation-menu ul li.active a:after {

  content   : "";
  position  : absolute;
  bottom    : 0;
  left      : 0;
  right     : 0;
  margin    : auto;
  width     : 0;
  color     : transparent;
  height    : 3px;

}

.header .navigation-menu ul li a:hover:after,
.header .navigation-menu ul li:hover a:after,
.header .navigation-menu ul li.active a:after {
  width: 100%;
}

.header .navigation-menu ul li a:hover ,
.header .navigation-menu ul li:hover > a {
  color: #000;
}

.header .navigation-menu ul li.active a {
  color: #000;
}

/* Dropdown Menu */
.header .navigation-menu ul li ul {

  display   : none;
  position  : absolute;
  left      : 0;
  z-index   : 1;
  width     : 100%;
  background: #FFF;

}

.header .navigation-menu ul li:hover > ul {
  display: block;
}

.header .navigation-menu ul li ul li {

  width     : 100%;
  text-align: center;

}

.header .navigation-menu ul li ul li a {

  padding      : 13px;
  border-bottom: 1px solid #DDD;
  font-size    : 14px;
  font-weight  : 600;

}


.header .navigation-menu ul li ul li ul {

  top : 0;
  left: 100%;

}

/* Search Box */
.search-box-toggler {

  border-right : 1px solid #FFF;
  padding-right: 20px;

}

@media (max-width: 992px) {
  .search-box-row,
  .search-box {
    display: block !important;
  }
}

/* Bottom Menu */
.header .bottom-menu {
  border-top : 1px solid #DDD;
}

.hamburger,
.hamburger:focus,
.hamburger:active,
.hamburger:hover {

  outline      : 0;
  opacity      : 1;
  overflow     : hidden;
  border-right : 1px solid #DDD;
  padding-right: 20px;
  padding-left : 20px;

}

.hamburger-box {
  width        : 30px;
  margin-bottom: -5px;
}

.hamburger-inner,
.hamburger-inner:after,
.hamburger-inner:before {

  width        : 30px;
  border-radius: 0;
}


.custom-search-input {

  margin    : 12px 0;
  padding   : 0;
  position  : relative;

}

.custom-search-input .input-group-btn {

  position: absolute;
  right   : 0;
  top     : 0;
  z-index : 10;

}

.custom-search-input .input-group-btn button {

  background: none;
  padding   : 2px 12px;

}

.custom-search-input .search-query {
  padding-right: 40px;
}

.custom-search-input .search-query:focus {
  border-color: #CED4DA;
}

.custom-search-input .search-query,
.custom-search-input button,
.custom-search-input button:focus,
.custom-search-input button:active,
.custom-search-input button:hover {

  outline      : 0;
  box-shadow   : 0 0 0 0;
  border-radius: 0;

}

/* Navigation Mobile Menu */
.navigation-mobile-menu {

  display   : none;
  border-top: 1px solid #DDD;

}

.navigation-mobile-menu ul li {

  border-bottom: 1px solid #DDD;
  padding      : 0 15px;

}

.navigation-mobile-menu ul li:last-child {
  border-bottom: 0;
}

.navigation-mobile-menu ul li a {

  text-decoration: none;
  display        : block;
  color          : #7D7D7D;
  padding        : 15px 0px;
  font-size      : 14px;
  font-weight    : 600;

}

.navigation-mobile-menu ul li:hover > a,
.navigation-mobile-menu ul li.active > a {
  color: #000;
}

.navigation-mobile-menu ul li a > i {

  font-size  : 13px;
  line-height: 2;
  min-width  : 20px;
  float      : right;
  padding    : 3px;

}

.navigation-mobile-menu ul li a > i:before {
  content: "\f067";
}

.navigation-mobile-menu ul li.active > a > i:before {
  content: "\f068";
}

.navigation-mobile-menu ul li ul {

  display   : none;
  margin    : 0 -15px;
  border-top: 1px solid #DDD;
  padding   : 0 20px;

}

/* Sticky Header */
body.sticky header.header {

  position: fixed;
  top     : 0;
  right   : 0;
  left    : 0;
  z-index : 1030;

}

body.sticky > .main-wrapper {
  margin-top: 157px;
}

@media (max-width: 992px) {
  body.sticky > .main-wrapper {
    margin-top: 215px;
  }
}

@media (max-width: 576px) {
  body.sticky > .main-wrapper {
    margin-top: 186px;
  }
}

/*
================================================================================
  1.2.2 - Content
================================================================================
*/

.content {

  background   : #FFF;
  padding      : 30px;
  margin-bottom: 30px;
  padding      : 30px 30px 0px 30px;

}

.content.pad30 {
  padding: 30px;
}

.content.pad15 {
  padding: 15px 30px;
}

.content .content-header {

  border-bottom : 1px solid #DDD;
  padding-bottom: 15px;
  margin-bottom : 20px;
  text-align    : center;

}

.content .content-header .content-header-title {

  text-transform: uppercase;
  font-size     : 20px;
  color         : #000;

}

.content .content-header .content-header-subtitle {

  font-size: 14px;
  color    : #7D7D7D;

}

.content .content-body .content-item {
  margin-bottom: 30px;
}

.content .content-body .content-item a {

  display        : block;
  text-decoration: none;

}

.content .content-body .content-item figure {
  margin: 0;
}

.content .content-body .content-image-wrapper {
  position: relative;
}

.content .content-body .content-image {
  margin: 0;
}

.content .content-body .content-video{
  margin-top: 11px !important;
}

.content .content-body .content-icon{
  line-height: 25px;
  text-align: center;
  display: inline-block;
  padding: 0px 100px;
  margin: 30px 0px;
}
.content .content-body .content-icon i{
  font-size: 50px;
  padding-bottom: 10px;
  color: #242556;
}
.content .content-body .content-icon span{
  display: block;
  color: #7e7777;
}
.content .content-body .content-icon span, .content .content-body .content-icon strong{
  font-size: 15px;
}
.content .content-body .content-icon strong{
  font-weight: 600;
  font-size: 22px;
  color: #363a3c;
}


.content .content-body .content-video video{
  width: 100%;
  height: 100%;
  border: 1px solid black;
}

.content .content-body .content-details {

  margin-top    : 20px;
  text-transform: uppercase;
  text-align    : center;

}

.content .content-body .content-details strong,
.content .content-body .content-details span {
  display: block;
}

.content .content-body .content-details strong {

  font-size    : 16px;
  font-weight  : 600;
  color        : #000;
  margin-bottom: 5px;

}

.content .content-body .content-details span {

  font-size  : 12px;
  font-weight: 400;
  color      : #7D7D7D;

}

.content .content-footer {

  border-top    : 1px solid #DDD;
  padding-top   : 30px;
  margin-bottom : 30px;

}

/*
================================================================================
  1.2.3 - Footer
================================================================================
*/

.footer .container {
  margin-bottom: 30px;
}

.footer .container,
.footer .container-fluid {
  background: #FFF;
}

.footer .container .row:last-child {

  padding-left : 15px;
  padding-right: 15px;

}

.footer .container .row div,
.footer .container-fluid .row div {
  margin-bottom: 15px;
}

.footer .logo {

  border-bottom : 1px solid #DDD;
  text-transform: uppercase;
  padding-bottom: 15px;

}

.footer .logo a {

  display        : block;
  text-decoration: none;

}

.footer .logo h1,
.footer .logo h2,
.footer .logo h3,
.footer .logo h4,
.footer .logo h5,
.footer .logo h6 {

  color      : #2196F3;
  font-weight: 700;
  font-size  : 30px;
  padding    : 15px 15px 0px 15px;
  margin     : 0;

}

.footer .logo span {

  color      : #000;
  font-size  : 11px;
  font-weight: 600;

}

.footer strong {

  font-size     : 16px;
  font-weight   : 700;
  text-transform: uppercase;
  margin-bottom : 10px;
  display       : block;

}

.footer p {

  color        : #888;
  font-size    : 14px;
  font-weight  : 300;
  margin-bottom: 0;

}

.footer nav ul {

  margin    : 0;
  padding   : 0;
  list-style: none;

}

.footer ul li {

  cursor : default;
  padding: 0px 0px 10px 0px;

}

.footer ul li:last-child {
  padding-bottom: 0;
}

.footer ul li a {

  text-transform : uppercase;
  text-decoration: none;
  display        : block;
  cursor         : pointer;

}

.footer ul li,
.footer ul li a {

  color      : #7D7D7D;
  font-size  : 14px;
  font-weight: 600;

}

.footer ul li:hover,
.footer ul li a:hover {
  color: #000;
}

.footer ul li i {
  min-width: 25px;
}

/*
================================================================================
  1.3.0 - Colors
================================================================================
*/

.primary-color,
.primary-color-hover:hover,
.primary-before-color:before,
.primary-after-color:after,
.page-item:not(.active):not(.disabled) .page-link {
  color: #242556 !important;

}

.primary-bgcolor,
.primary-bgcolor-hover:hover,
.primary-before-bgcolor:before,
.primary-after-bgcolor:after,
.page-item.active .page-link {
  background: #242556 !important;
}

.page-item.active .page-link {
  border-color: #242556 !important;
}

.primary-border {
  border: 1px solid #242556 !important;
}

.primary-border-top {
  border-top: 3px solid #242556 !important;
}

.primary-border-bottom {
  border-top: 3px solid #242556 !important;
}

/*
================================================================================
  2.0.0 - Pages
================================================================================
  2.1.0 - Home
================================================================================
  2.1.1 - Products (Landscape & Portrait)
================================================================================
*/

.product-landscape .hover,
.product-portrait .hover {

  opacity   : 0;
  background: rgba(0, 0, 0, 0.8);
  position  : absolute;
  top       : 0;
  left      : 0;
  right     : 0;
  bottom    : 0;
  padding   : 10px;
  transition: opacity 1s ease-out;

}

.product-portrait .hover {
  background: transparent;
}

.product-landscape .hover .hover-inner,
.product-portrait .hover .hover-inner {

  display: table;
  width  : 100%;
  height : 100%;

}

.product-landscape .hover .hover-text,
.product-portrait .hover .hover-text {

  border        : 2px solid #FFF;
  color         : #FFF;
  padding       : 20px;
  height        : 100%;
  width         : 100%;
  font-size     : 18px;
  text-transform: uppercase;
  text-align    : center;
  display       : table-cell;
  vertical-align: middle;

}

.product-landscape .hover .hover-text span,
.product-portrait .hover .hover-text span {
  font-weight: 300;
}

/* Hover Effect */
.product-landscape .content-item:hover .hover,
.product-portrait .content-item:hover .hover {
  opacity: 1;
}

.product-landscape .content-item:hover figure img {
  -webkit-filter: blur(5px);
          filter: blur(5px);
}

/*
================================================================================
  2.1.2 - News
================================================================================
*/

.news-content .news-image {
  position: relative;
}

.news-content .news-details strong {

  font-size    : 20px;
  font-weight  : 700;
  color        : #000;
  margin-bottom: 7px;
  display      : block;

}

@media (max-width: 768px) {
  .news-content .news-details strong {

    margin-top: 15px;
    text-align: center;

  }
}

.news-content .news-details p, .news-informations p {

  font-size    : 14px;
  font-weight  : 400;
  color        : #7D7D7D;
  margin-bottom: 0;
  display      : block;

}

.news-content .news-details .news-informations {
  margin-bottom: 50px;
}

.news-content .news-details .fix-bottom {

  position: absolute;
  left    : 15px;
  right   : 15px;
  bottom  : 0;

}

/* Hover */
.news-content .news-image .hover {
  height: 100%;
}

.news-content .news-image .hover .hover-text {
  font-size: 15px;
}

/*
================================================================================
  2.2.0 - Single
================================================================================
*/

.single-content {

  background   : #FFF;
  padding      : 30px;
  margin-bottom: 30px;
  padding      : 30px 30px 0px 30px;

}

.single-content .content-header {

  border-bottom : 1px solid #DDD;
  padding-bottom: 15px;
  margin-bottom : 20px;
  text-align    : center;

}

.single-content .content-header .content-header-title {

  font-size     : 20px;
  font-weight   : 700;
  color         : #000;

}

.single-content .content-header .content-header-subtitle {

  font-size  : 14px;
  font-weight: 300;
  color      : #7D7D7D;

}

.single-content .content-body {
  margin-bottom: 30px;
}

.single-content .content-body .embed-responsive {
  margin-bottom: 30px;
}

.single-content .content-body p {

  font-size    : 14px;
  font-weight  : 400;
  color        : #7F7F7F;
  margin-bottom: 0;

}

/*
================================================================================
  2.2.1 - Author
================================================================================
*/

.post-author {

  background   : #FFF;
  padding      : 30px;
  margin-bottom: 30px;
  padding      : 30px 30px 15px 30px;

}

.post-author .author-image {
  margin-bottom: 15px;
}

.post-author .author-image figure {
  margin-bottom: 0;
}

.post-author .author-details-header {

  border-bottom: 1px solid #DDD;
  margin-bottom: 15px;

}

.post-author .author-name h1,
.post-author .author-name h2,
.post-author .author-name h3,
.post-author .author-name h4,
.post-author .author-name h5,
.post-author .author-name h6 {

  font-size    : 20px;
  font-weight  : 700;
  color        : #000;
  margin-bottom: 15px;

}

.post-author .author-social ul {

  margin    : 0;
  padding   : 0;
  list-style: none;

}

.post-author .author-social ul li {
  display: inline-block;
}

.post-author .author-social ul li a {

  color  : #000;
  padding: 0px 10px;
  display: block;

}

.post-author .author-social ul li a:hover i {

  -webkit-transition: all .5s;
    -o-transition   : all .5s;
    transition      : all .5s;
  -webkit-transform : rotate(360deg);
      -ms-transform : rotate(360deg);
          transform : rotate(360deg);

}

.post-author .author-details-body p {

  font-size  : 14px;
  font-weight: 400;
  color      : #7F7F7F;

}


/*
================================================================================
  2.2.2 - Comments
================================================================================
*/

.post-comments {

  background   : #FFF;
  padding      : 30px;
  margin-bottom: 30px;

}

.post-comments .post-comments-header,
.post-comments .post-comments-body .post-comment {

  border-bottom : 1px solid #DDD;
  padding-bottom: 30px;
  margin-bottom : 30px;

}

.post-comments .post-comments-header-title {

  text-transform: uppercase;
  font-size     : 20px;
  color         : #000;
  margin-bottom : 0;

}

.post-comments .post-comments-body .post-comment .comment-author-image figure {
  margin-bottom: 0;
}

@media (max-width: 768px) {
  .post-comments .post-comments-body .post-comment .comment-author-image figure {
    margin-bottom: 30px;
  }
}

.post-comments .post-comments-body .post-comment:last-child {

  border-bottom : 0;
  margin-bottom : 0;
  padding-bottom: 0;

}

.post-comments .post-comments-body .post-comment .comment-details .comment-author-title {

  text-transform: uppercase;
  font-size     : 15px;
  font-weight   : 700;
  color         : #000;
  margin-bottom : 5px;

}

.post-comments .post-comments-body .post-comment .comment-details .comment-date {

  display      : block;
  font-size    : 13px;
  font-weight  : 300;
  padding      : 3px 0px;
  color        : #7D7D7D;
  margin-bottom: 5px;

}

.post-comments .post-comments-body .post-comment .comment-details .comment-text {

  font-size    : 14px;
  font-weight  : 400;
  color        : #7F7F7F;
  margin-bottom: 0;

}

.post-comments .post-comments-footer {

  border-top: 1px solid #DDD;
  padding-top: 30px;
  margin-top: 30px;

}

/*
================================================================================
  2.2.3 - Write Comments
================================================================================
*/

.post-write-comments {

  background   : #FFF;
  padding      : 30px;
  margin-bottom: 30px;

}

.post-write-comments .comments-form textarea,
.post-write-comments .comments-form input,
.post-write-comments .comments-form button {

  outline: 0;
  display: block;
  border : 1px solid #DDD;
  width  : 100%;

}

.post-write-comments .comments-form input {

  padding      : 10px 20px;
  margin-bottom: 15px;

}

.post-write-comments .comments-form textarea {

  resize : none;
  height : 100%;
  padding: 20px;

}

@media (max-width: 768px) {
  .post-write-comments .comments-form textarea {

    margin-bottom: 15px;
    height       : auto;


  }
}

.post-write-comments .comments-form button {

  text-transform: uppercase;
  cursor        : pointer;
  color         : #FFF;
  padding       : 10px;

}

.post-write-comments .comments-form textarea::-webkit-input-placeholder,
.post-write-comments .comments-form input::-webkit-input-placeholder { /* WebKit, Blink, Edge */

  text-transform: uppercase;
  color         : #000;
  font-size: 12px;

}

.post-write-comments .comments-form textarea:-moz-placeholder,
.post-write-comments .comments-form input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */

  text-transform: uppercase;
  font-weight: bold;
  color         : #000;
  opacity:  1;
  font-size: 12px;

}

.post-write-comments .comments-form textarea::-moz-placeholder,
.post-write-comments .comments-form input::-moz-placeholder { /* Mozilla Firefox 19+ */

  text-transform: uppercase;
  font-weight: bold;
  color         : #000;
  font-size: 12px;
  opacity:  1;

}

.post-write-comments .comments-form textarea:-ms-input-placeholder,
.post-write-comments .comments-form input:-ms-input-placeholder { /* Internet Explorer 10-11 */

  text-transform: uppercase;
  font-weight: bold;
  color         : #000;
  font-size: 12px;

}
.post-write-comments .comments-form textarea::-ms-input-placeholder,
.post-write-comments .comments-form input::-ms-input-placeholder { /* Microsoft Edge */

  text-transform: uppercase;
  font-weight: bold;
  color         : #000;
  font-size: 12px;

}

.post-write-comments .comments-form textarea::placeholder,
.post-write-comments .comments-form input::placeholder { /* Most modern browsers support this now. */

  text-transform: uppercase;
  font-weight: bold;
  font-size: 12px;
  color         : #000;

}