/* Blog styles */

/* Category tag */
.category { font-size: 14px; }

/* Title sections */
.content .title-section {
    color: #4c4c4c;
    font-family: 'Open Sans Hebrew Light', 'opensanshebrew-light', sans-serif;
    font-size: 23px;
    font-weight: 400;
    letter-spacing: 1px;
    margin-bottom: 35px;
}

.content .title-section.t-end {
    display: flex;
    font-size: 28px;
    justify-content: end;
    margin-bottom: 15px;
    margin-top: 60px;
}

.title-section.t-end.t-mobile { display: none; }
.t-mobile { display: none; }

/* Search input */
.content input {
    border: 1px solid #33342f;
    border-radius: 5px;
    color: #000;
    font-family: 'Open Sans Hebrew Light', 'opensanshebrew-light', sans-serif;
    font-size: 18px;
    height: 45px;
    margin-bottom: 30px;
    padding: 0 10px;
    width: 100%;
    outline: none;
    transition: border-color 0.3s;
}

.content input:focus {
    border-color: #00acb0;
}

/* Blog slider item */
.box-blog-slider {
    background: #fff;
    border: 1px solid #00adae;
    border-radius: 6px;
    margin-left: 15px;
    padding: 20px 10px;
}

.box-blog-slider .row {
    align-items: center;
}

.box-blog-slider img {
    border: 2px solid #00acae;
    width: 100%;
}

.box-blog-slider .category {
    color: #4c4c4c;
    text-transform: uppercase;
}

.box-blog-slider h4 {
    color: #4c4c4c;
    font-family: 'Open Sans Hebrew Light', 'opensanshebrew-light', sans-serif;
    font-size: 24px;
    letter-spacing: 1px;
    line-height: 29px;
    margin-bottom: 20px;
    margin-top: 15px;
}

.box-blog-slider .resume-article {
    color: #4c4c4c;
    font-size: 15px;
    line-height: 26px;
}

.box-blog-slider a h4 {
    line-height: 150%;
    font-family: 'Open Sans Hebrew Light', 'opensanshebrew-light', sans-serif !important;
    font-size: 22px !important;
    color: #4c4c4c !important;
}

.box-blog-slider a .line-post {
    font-family: 'Open Sans Hebrew Light', 'opensanshebrew-light', sans-serif;
    font-size: 18px;
    color: #000;
}

@media screen and (max-width: 768px) {
    .box-blog-slider { margin-left: 0; }
}

/* Blog grid item */
.box-blog {
    background: #fff;
    border: 1px solid #00acb0;
    border-radius: 5px;
    margin: 20px 0 10px 15px;
    padding: 8px 12px 15px;
}

.box-blog .d-flex { justify-content: space-between; }

.box-blog img {
    border: 3px solid #00acae;
    width: 100%;
}

.box-blog .category {
    color: #4c4c4c;
    margin-bottom: 7px;
    text-transform: uppercase;
}

.box-blog .date { color: #4c4c4c; }

.box-blog .resume {
    color: #4c4c4c;
    font-family: 'Open Sans Hebrew Light', 'opensanshebrew-light', sans-serif;
    font-size: 22px;
    line-height: 34px;
    margin: 8px 0;
}

.box-blog a h1 {
    font-size: 18px !important;
    color: #4c4c4c !important;
    font-family: 'Open Sans Hebrew Light', 'opensanshebrew-light', sans-serif !important;
}

.box-blog h1, .box-blog h2, .box-blog h3, .box-blog h4 {
    font-size: 16px;
    font-family: 'open_sans_hebrewregular', sans-serif;
    line-height: 1.4;
    color: #4C4C4C;
}

@media screen and (max-width: 768px) {
    .box-blog { margin-left: 0; }
}

/* Recommended sidebar */
.box-recommended {
    background: #007c7e;
    border-radius: 5px;
    margin: 20px 0 30px;
    padding: 15px 12px;
}

.box-recommended img {
    border: 3px solid #00adae;
    width: 100%;
}

.box-recommended .category {
    color: #fff;
    display: table;
    margin-bottom: 12px;
    text-transform: uppercase;
}

.box-recommended .resume-recommended {
    color: #fff;
    font-family: 'Open Sans Hebrew Light', 'opensanshebrew-light', sans-serif;
    font-size: 24px;
    line-height: 34px;
}

.box-recommended h1 {
    font-family: 'Open Sauce Sans', 'open_sauce_sansregular', sans-serif;
    font-size: 18px;
    color: #fff;
}

.resume-recommended a h1,
.box-recommended a h1 {
    font-family: 'Open Sauce Sans', 'open_sauce_sansregular', sans-serif !important;
    font-size: 18px !important;
    color: #fff !important;
}

.box-recommended h2, .box-recommended h3, .box-recommended h4 {
    font-size: 14px;
    font-family: 'open_sans_hebrewregular', sans-serif;
    line-height: 1.4;
    color: #fff;
}

/* Content blog area */
.content .content-blog {
    margin-top: 50px;
}

@media screen and (max-width: 768px) {
    .content input { margin-top: 60px; }
    .content .title-section.t-end.t-desktop { display: none; }
    .content .title-section.t-end.t-mobile { display: block; }
}

/* Blog post detail */
.post-header {
    background: #00acb0;
    background: linear-gradient(90deg, #00acb0 12%, #cf2e2e);
    margin-bottom: 25px;
    padding-top: 150px;
}

.post-header a {
    color: #fff;
    display: table;
    font-family: 'Open Sauce Sans Light', 'opensanshebrew-light', sans-serif;
    font-size: 16px;
    padding-bottom: 10px;
    padding-top: 10px;
    transition: 0.8s;
}

.post-header a:hover { color: #ccc; transition: 0.8s; }

.post-header h1, .post-header h2, .post-header h3, .post-header h4 {
    color: #fff !important;
    font-family: 'Open Sans', sans-serif !important;
    font-size: 36px !important;
    font-weight: 700 !important;
}

.post-header .container h1 {
    font-size: 38px;
    color: #fff;
    font-family: 'league_spartanbold', 'League Spartan Bold', sans-serif !important;
}

.line-post {
    color: #4c4c4c;
    font-family: 'Open Sans Hebrew Light', 'opensanshebrew-light', sans-serif;
    font-size: 24px;
}

.post-author { margin: 20px 0; }
.post-author > p:first-child, .post-author > p:last-child {
    color: #00acaf;
    font-family: 'Open Sauce Sans Light', 'opensanshebrew-light', sans-serif;
    font-size: 16px;
}

.post-body {
    padding: 40px 0;
}

.post-body iframe { border: none; height: 500px; width: 100%; }
.post-body .line-post {
    color: #4c4c4c;
    font-family: 'Open Sans Hebrew Light', 'opensanshebrew-light', sans-serif;
    font-size: 24px;
}

.post-content {
    font-family: 'Open Sans Hebrew Light', 'opensanshebrew-light', sans-serif;
    line-height: 150%;
}

.post-content p {
    margin-bottom: 16px;
    color: #000;
}

.post-content img {
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    margin: 15px 0;
}

.post-content h2, .post-content h3 {
    margin: 25px 0 10px;
}

@media (max-width: 767px) {
    .post-body iframe { height: 320px; }
}
