/* Common styles */

#dle-content {
   padding: 0 15px;
   width: 100%;
}
.cat #dle-content {
   display: flex;
   flex-wrap: wrap;
   flex: 1;
   width: 100%;
   padding: 0;
}

.block.story {
   background-color: #ffffff !important;
   padding: 30px;
   border-radius: 20px !important;
   margin-bottom: 50px;
   -webkit-box-shadow: 0px 5px 20px 0px rgba(69, 67, 96, 0.1);
   box-shadow: 0px 5px 20px 0px rgba(69, 67, 96, 0.1);
   -webkit-transition: all 0.9s ease-in-out;
   transition: all 0.9s ease-in-out;
   margin-top: -30px;
}


/* ---------------------------------------------------- */
/* Modal
/* ---------------------------------------------------- */
.modal {
   position: fixed;
   top: 0;
   left: 0;
   display: flex;
   align-items: center;
   justify-content: center;
   height: 0vh;
   background-color: transparent;
   overflow: hidden;
   transition: background-color 0.25s ease;
   z-index: 9999;
}

.modal.open {
   position: fixed;
   width: 100%;
   height: 100vh;
   background-color: rgba(0, 0, 0, 0.5);
   transition: background-color 0.25s;
}

.modal.open>.content-wrapper {
   transform: scale(1);
}

.modal .content-wrapper {
   position: relative;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: flex-start;
   width: auto;
   margin: 0;
   box-shadow: 0 5px 20px 0 rgba(69, 67, 96, .1);
   transform: scale(0);
   transition: transform 0.25s;
   transition-delay: 0.15s;
}

.modal .content-wrapper .close {
   position: absolute;
   top: 0.5rem;
   right: 0.5rem;
   display: flex;
   align-items: center;
   justify-content: center;
   width: 2.5rem;
   height: 2.5rem;
   border: none;
   background-color: transparent;
   font-size: 1.5rem;
   transition: 0.25s linear;
}

.modal .content-wrapper .close:before,
.modal .content-wrapper .close:after {
   position: absolute;
   content: "";
   width: 1.25rem;
   height: 0.125rem;
   background-color: black;
}

.modal .content-wrapper .close:before {
   transform: rotate(-45deg);
}

.modal .content-wrapper .close:after {
   transform: rotate(45deg);
}

.modal .content-wrapper .close:hover {
   transform: rotate(360deg);
}

.modal .content-wrapper .close:hover:before,
.modal .content-wrapper .close:hover:after {
   background-color: #e22c2f;
}

.modal .content-wrapper .content {
   position: relative;
   display: flex;
}

.modal a {
   color: #506172;
}
.modal a:hover {
   color: #e22c2f;
}


/* ---------------------------------------------------- */
/* Shortstory
/* ---------------------------------------------------- */
.post-card-content p {
   hyphens: auto;
}
.post-card-content .category {
   font-size: 0;
}
.post-card-content .category a {
   background-color: #506172;
   color: #fff;
   padding: 2px 15px;
   display: none;
   margin: auto;
   margin-bottom: 20px;
   text-align: center;
   font-size: 13px;
   border-radius: 20px;
   font-weight: 800;
   text-transform: capitalize;
   transition: all .5s ease-in-out;
}
.post-card-content .category a:hover {
   background-color: #e22c2f;
   color: #fff !important;
}
.post-card-content .category a:first-child {
   display: inline-block;
}
.post-card-image img {
   height: 220px;
   width: 100%;
   object-fit: cover;
}
.post-card-image.big img {
   height: 443px;
   width: 100%;
   object-fit: cover;
}
.post-card-image.small img {
   height: 180px;
   width: 100%;
   object-fit: cover;
}
.post-card-image.pop_cat {
   height: 145px;
   width: 100%;
   object-fit: cover;
}
.post-single {
   margin-top: 0;
}
@media only screen and (max-width:640px) {
   .post-card-image img,
   .post-card-image.big img,
   .post-card-image.small img,
   .post-card-image.pop_cat {
      height: auto;
   }
   .top-navbar-left {
      display: none;
   }
   .top-navbar-right {
      width: 100%;
      text-align: center;
   }
}

.widget-latest-posts .last-post .image img {
   object-fit: cover;
}


/* ---------------------------------------------------- */
/* Fullstory
/* ---------------------------------------------------- */
.post-single-body {
   margin-top: 30px;
   hyphens: auto;
}
.post-single .category {
   font-size: 0;
}
.post-single .category a {
   background-color: #506172;
   color: #fff;
   padding: 2px 15px;
   display: inline-block;
   margin: auto;
   margin-bottom: 20px;
   text-align: center;
   font-size: 13px;
   border-radius: 20px;
   font-weight: 800;
   text-transform: capitalize;
   transition: all .5s ease-in-out;
   margin-right: 5px;
}
.post-single .category a:hover {
   background-color: #e22c2f;
   color: #fff !important;
}
.post-single h1 {
   line-height: 1;
   margin-bottom: 20px;
}
.post-single-body .quote {
   background-color: #f9f9ff;
   padding: 20px;
   border-radius: 20px;
   text-align: left;
   border-left: 4px solid #e22c2f;
   margin-top: 10px;
   margin-bottom: 10px;
   font-size: 16px;
   color: #152035;
   font-weight: 700;
}
.post-single-body ul {
   padding-left: 40px;
}
.post-single-body li {
   list-style: disc !important;
}

/* ---------------------------------------------------- */
/* Other
/* ---------------------------------------------------- */
.edit {
   margin-bottom: 0;
   font-size: 13px;
   color: #506172;
   text-transform: capitalize;
   font-weight: 400;
   display: inline-block;
}
.fr-element.fr-view li {
   list-style: disc !important;
}

.usinf li {
   display: flex;
   flex-wrap: wrap;
}
.usinf .ui-c1 {
   flex: 0 0 150px;
}
.ui-button {
   font-size: 13px;
}
.gray-theme.fr-toolbar.fr-top {
   border-top: 4px solid #e22c2f;
}
.bb-editor textarea {
   width: 100% !important;
   border: 1px solid #dde0e2;
   padding: 10px;
}
.mass_comments_action {
   display: none;
}
.moder_block {
   display: flex;
   justify-content: right;
   flex-wrap: wrap;
}
.moder_block a {
   font-size: 12px;
}

.widget-comments .quote {
   background: #f9f9ff;
   border-left: 3px solid #e22c2f;
   padding: 10px 15px;
   font-weight: 700;
   font-size: 15px;
   color: #152035;
   border-radius:0 20px 20px 20px;
}
.widget-comments .title_quote  {
   font-size: 13px;
   padding: 5px 15px;
   background: #fff;
   border: 0;
   border-left: 3px solid #e22c2f;
   color: #e22c2f;
   font-weight: 700;
   /* border-radius:20px 20px 20px 0; */
}

.bbcodes,
.btn,
#pm-menu span,
.section-header .section-view a,
.user_tab a {
   cursor: pointer;
   display: inline-flex;
   align-items: center;
   position: relative;
   text-align: center;
   white-space: nowrap;
   vertical-align: middle;
   font-size: 16px;
   font-weight: 600;
   padding: 10px 20px;
   text-transform: none;
   border-radius: 8px;
   background-color: #e22c2f;
   color: #fff !important;
   border: 0;
   transition: all .5s ease-in-out;
   box-shadow: 0 1rem 3rem rgba(0, 0, 0, .175) !important;
}
.bbcodes:hover,
.btn:hover,
#pm-menu span:hover,
.section-header .section-view a:hover,
.user_tab a:hover {
   color: #fff !important;
   background-color: #506172;
   outline: none;
}
.wide,
select,
#sec_code {
   display: block;
   height: calc(1.5em + .75rem + 2px);
   padding: .375rem .75rem;
   font-size: 1rem;
   font-weight: 400;
   line-height: 1.5;
   color: #495057;
   background-color: #fff;
   background-clip: padding-box;
   border: 1px solid #ced4da;
   border-radius: .25rem;
   transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}
.checkbox label input {
   margin-right: 7px;
}
.custom-control-label::before {
   top: 0.12rem;
}
#allow_subscribe {
   margin-right: 5px;
}
.userstop {
   font-size: 12px;
}
#userinfo + .alert_info {
   margin: 0;
}
.avatar img {
   width: 120px;
   height: 120px;
   display: inline-block;
   object-fit: cover;
}
.user_tab {
   display: flex;
   justify-content: center;
   flex-wrap: wrap;
}
.user_tab li {
   margin: 5px;
}
.tab-content .usinf .ui-c1 {
   flex: 0 0 200px;
   font-weight: 700;
   color: #152035;
}
.tab-content .usinf li {
   display: flex;
   flex-wrap: wrap;
   border-bottom: 1px solid #e0e5ea;
   padding: 7px 0;
   align-items: center;
}

/* ---------------------------------------------------- */
/* Instagram
/* ---------------------------------------------------- */
.instagram_gallery {
   margin: -2.5px;
}
.instagram_gallery img {
   border-radius: 5px;
}


/* ---------------------------------------------------- */
/* Tags
/* ---------------------------------------------------- */
span[class*="clouds_"] a,
.tags a {
   background-color: #f9f9ff;
   padding: 4px 11px;
   margin-bottom: 5px;
   margin-right: 2px;
   border-radius: 20px;
   font-size: 13px;
   text-transform: capitalize;
   color: #506172;
   font-weight: 700;
   display: inline-block;
   transition: all ease-in-out .3s;
}
span[class*="clouds_"] a:hover,
.tags a:hover {
   background-color: #e22c2f;
   color: #fff;
}
.tags {
   font-size: 0;
}
.tags a {
   margin:0 5px 5px 0;
}


/* ---------------------------------------------------- */
/* Pagination
/* ---------------------------------------------------- */
.pagination {
   justify-content: center;
}
.pagination span,
.pagination a:hover {
   display: block;
   background-color: #e22c2f;
   box-shadow: 0px 5px 20px 0px rgba(69, 67, 96, 0.1);
   min-width: 40px;
   height: 40px;
   border-radius: 8px;
   border: 2px solid #e22c2f;
   text-align: center;
   margin-right: 8px;
   line-height: 35px;
   transition: all 0.7s ease-in-out;
   font-weight: 700;
   color: #fff;
   padding: 0 12px;
}
.pagination a {
   font-weight: 700;
   display: block;
   min-width: 40px;
   height: 40px;
   border-radius: 8px;
   background-color: transparent;
   border: 2px solid #e22c2f;
   text-align: center;
   margin-right: 8px;
   line-height: 35px;
   transition: all 0.7s ease-in-out;
   color: #e22c2f;
   padding: 0 12px;
}

/* ---------------------------------------------------- */
/* Search Result
/* ---------------------------------------------------- */
.searchpage {
   margin-bottom: 60px !important;
}
#fullsearch {
   width: 100%;
   padding: 0 15px;
}

/* ---------------------------------------------------- */
/* Info block
/* ---------------------------------------------------- */
.alert_info {
   background-color: #fff;
   padding: 30px;
   border-radius: 20px;
   box-shadow: 0 5px 20px 0 rgba(69, 67, 96, .1);
   width: 100%;
   margin: -30px 15px 30px;
}

/* ---------------------------------------------------- */
/* User Panel
/* ---------------------------------------------------- */
.avatar_user {
   width: 80px;
   height: 80px;
   border-radius: 50%;
   display: inline-block;
   object-fit: cover;
}
.pm_progress_bar {
   background: #f0f0f8;
   margin-bottom: 10px;
   border-radius: 25px;
   overflow: hidden;
}
.pm_status .grey {
   font-size: 12px;
}