/* 
Theme name: Conex theme
Version: 1.0
Description: Conexperience own wordpress theme. Full customization
Author: Guilherme Xavier
*/

:root {
    --blue: #1c6295;
    --indigo: #6610f2;
    --purple: #6f42c1;
    --pink: #ee3577;
    --red: #dc3545;
    --orange: #f68e62;
    --yellow: #ffc107;
    --green: #28a745;
    --teal: #20c997;
    --cyan: #17a2b8;
    --white: #fff;
    --gray: #767575;
    --gray-dark: #434242;
    --primary: #6f42c1;
    --secondary: #4f4f4f;
    --success: #28a745;
    --info: #17a2b8;
    --warning: #ffc107;
    --danger: #dc3545;
    --light: #c2c2c2;
    --lightgray: #eeeeee;
    --dark: #434242;
    --breakpoint-xs: 0;
    --breakpoint-sm: 576px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1200px;
    --font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    /* Font Sizes */
    --font-normal: 1em;
    --font-small: 0.8125rem;
    /* Sidebar */
    --sidebar-width: 280px;
    --content-max-width: 860px;
}

*,
*::before,
*::after {
    box-sizing: border-box;
    color: #145C92;
}

html {
    line-height: 1.15;
}
body {
    color: var(--secondary);
    overflow-x: hidden;
    min-height: 100vh;
}
a{
    color: var(--gray);
}
h1,
h2,
h4,
h5,
h6 {
    color: var(--gray-dark);
    font-weight: bold;
    font-family: "Calibri";
}

h3 {
    color: var(--gray-dark);
    font-weight: 300;
    font-size: 1.2rem;
    font-family: "Calibri";
}

#header-button {
    font-family: "Calibri";
    font-size: medium;
}

p {
    font-family: "Calibri";
    text-align: justify;
}

.copyright {
    text-align: center;
}

#formTitle {
    font-family: "Calibri" !important;
    font-weight: 400;
    font-size: 2rem;
    color: #145c92;
    margin: 1rem;
}

#section-title {
    margin: 2rem;
    font-family: "Calibri" !important;
    color: #145C92;
}

#blog-title {
    font-size: 38px;
    font-weight: 500;
    margin-top: 2rem;
    margin-bottom: 0;
}

label {
    font-family: "Calibri" !important;
    color: #145C92;
}

.error-page-text {
    text-align: center;
    color: var(--blue);
    padding-bottom: 1rem;
}

.searchform, #s {
    text-align: center;
    color: var(--blue);
    padding: 5px;
    border-radius: 5px;
}

#searchsubmit {
    padding: 5px;
    border-radius: 5px;
    background-color: var(--blue);
    color: white;
}

.btn {
    font-weight: bold;
    padding: .375rem 1rem;
    height: 2.75rem;
    transition: all 0.4s ease-in-out
}


.btn:focus,
.btn.focus {
    box-shadow: none !important
}

.btn-primary {
    color: #fff
}

.form-control {
    padding-top: 0.875rem;
    padding-bottom: 0.875rem;
    height: 2.75rem;
    border-color: var(--light);
}

.theme-bg-light {
    background: var(--light) !important;
}

.theme-bg-dark {
    background: var(--blue) !important;
}

.header {
    position: relative;
    display: flex;
    justify-content: space-around;
    height: 5rem;
    width: 100vw;
    background: #f8f9fa;
    color: #fff;
}

/* Quando o menu hamburger for ativado */
.navbar-collapse.collapsing .navbar-nav.flex-column,
.navbar-collapse.flex-column.collapse.show .navbar-nav.flex-column {
    display: block !important;
}

#button-anchor {
    margin: auto 0;
}

.header .site-title {
    font-family: poppins;
    font-weight: 300;
    color:var(--blue);
    font-size:1.2em;
    display:block;
}

.header .btn-primary {
    background: rgba(0, 0, 0, 0.3);
    border-color: transparent;
    font-size: 1rem;
    padding-top: 0.5rem
}

.header .btn-primary:hover {
    background: rgba(0, 0, 0, 0.4);
    border-color: transparent
}

.header .navbar {
    padding: 2rem 1rem
}

.cadastro {
    border-radius: 9px;
    background-color: var(--blue) !important;
    color: white;
}

div ul {
    display: -webkit-inline-box !important;
} 

.site-content__wrap {
    margin: auto;
}

.posts-list.posts-list--grid.list-style-default,.posts-list.posts-list--grid.list-style-v2,.posts-list.posts-list--grid.list-style-v6 {
    display:-webkit-box;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;
    -webkit-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    margin-left:-.9375rem;
    margin-right:-.9375rem;
}

.posts-list.posts-list--grid.list-style-v6 {
    justify-content: center;
}

/* Container dos posts individuais da pagina de arquivo */
.grid-item-inner {
    min-height: 500px;
}

/* Thumbnail dos containers de posts */
.posts-list.posts-list--grid.list-style-v3 .posts-list__item.grid-item .grid-item__thumbnail{
    -webkit-border-radius:4px;
    border-radius:4px;
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    -webkit-background-size:cover;
    background-size:cover;
    background-position:center;
    z-index:-1
}

.entry-title {
    margin-bottom: 1.5rem !important;
}

.entry-title a,
.entry-meta p {
    color: white;
}

/* Animação dos containers de posts */
/* .posts-list.posts-list--grid.list-style-v7 .posts-list__item.grid-item .grid-item-wrap__animated,.posts-list.posts-list--grid.list-style-v6 .posts-list__item.grid-item .grid-item-wrap__animated {
    width:100%;
    -webkit-transition:all 0.42s cubic-bezier(0.68, 0.125, 0, 0.995);
    -o-transition:all 0.42s cubic-bezier(0.68, 0.125, 0, 0.995);
    transition:all 0.42s cubic-bezier(0.68, 0.125, 0, 0.995);
    -webkit-transition-delay:0.22s;
    -o-transition-delay:0.22s;
    transition-delay:0.22s;
} */

.grid-item-wrap__animated {
    display: none; /* Oculta inicialmente o conteúdo */
    position: absolute; /* Define a posição absoluta */
    top: 100%; /* Posiciona abaixo do título */
    left: 0;
    width: 100%;
    
    background-color: rgba(255, 255, 255, 0.9); /* Fundo semi-transparente */
    z-index: 1000; /* Coloca o conteúdo sobre os outros elementos */
    padding: 20px; /* Espaçamento interno */
    box-sizing: border-box;
}

/* Animação do container ao passar o mouse por cima */
.grid-item-inner:hover .grid-item-wrap__animated {
    display: contents; /* Exibe o conteúdo ao passar o mouse sobre o post */
}

/* Animação do titulo e meta info dos posts ao passar o mouse em cima */
.grid-item-inner:hover .entry-title,
.grid-item-inner:hover .entry-meta {
    margin-bottom: 0 !important;
    transform: translateY(-50%); /* Move o título para cima */
    transition: transform 1.5s ease; /* Adiciona uma transição suave */
}

/* Efeito de opacidade nos cards dos posts */
.posts-list.posts-list--grid.list-style-v7 .posts-list__item.grid-item:hover .grid-item-inner, .posts-list.posts-list--grid.list-style-v6 .posts-list__item.grid-item:hover .grid-item-inner {
    background-color: rgba(0, 0, 0, 0.5);
    -webkit-transition: all 0.25s ease;
    -o-transition: all 0.25s ease;
    transition: all 0.25s ease;
}

.entry-content p {
    color: #fff;
    font-size: 17px;
}
/* Botão ler mais dos cards de posts */
.space-between-content {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin: 1rem 0;
}

.card-button {
    font-family: Poppins !important;
    font-weight: 500;
    color: #fff;
    background-color: transparent;
    line-height: 1;

    padding: 10px 15px;    
    border: 1px solid #f1f4f6;
    border-radius: 4px;
    text-decoration: none !important;
}

.space-between-content:hover .card-button {
    color: #398ffc; 
}

/* Elementos dos containers animados */
.posts-list.posts-list--grid .grid-item .entry-header .entry-meta{
    display:-webkit-box;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;
    -webkit-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    margin-bottom:2px
}

/* Info Meta dos posts */
.posts-list.posts-list--grid .grid-item .entry-meta {
    font-size: 14px;
    font-size: .875rem;
}

/* Info data do post */
.post-date {
    font-weight: 600;
    font-size: 16px;
}

/* Titulo dos posts */
.posts-list.posts-list--grid .grid-item .entry-title {
    margin: 0 0 10px;
}

/* Posicionamento do grid */
.posts-list.posts-list--grid.list-style-v7 .posts-list__item.grid-item .grid-item-wrap,.posts-list.posts-list--grid.list-style-v6 .posts-list__item.grid-item .grid-item-wrap{
    position:absolute;
    text-align:left;
    top:0;
    left:0;
    right:0;
    bottom:0;
    padding:30px 28px 0;
    overflow:hidden;
    display:-webkit-box;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
    -webkit-flex-direction:column;
    -ms-flex-direction:column;
    flex-direction:column;
    -webkit-flex-wrap:nowrap;-ms-flex-wrap:nowrap;flex-wrap:nowrap;-webkit-box-pack:end;-webkit-justify-content:flex-end;-ms-flex-pack:end;justify-content:flex-end;-webkit-align-content:flex-start;-ms-flex-line-pack:start;align-content:flex-start;-webkit-box-align:start;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start;z-index:1;-webkit-transition:all 0.42s cubic-bezier(0.68, 0.125, 0, 0.995);-o-transition:all 0.42s cubic-bezier(0.68, 0.125, 0, 0.995);transition:all 0.42s cubic-bezier(0.68, 0.125, 0, 0.995);
    -webkit-transition-delay:0.22s;
    -o-transition-delay:0.22s;
    transition-delay:0.22s
}

/* Espaçamento e tamanho do grid de posts */
.posts-list.posts-list--grid.list-style-default .grid-item,.posts-list.posts-list--grid.list-style-v2 .grid-item,.posts-list.posts-list--grid.list-style-v6 .grid-item{
    padding-left:.9375rem;
    padding-right:.9375rem;
    max-width:calc(100%);
    width:calc(100%);
    -webkit-box-flex:0;
    -webkit-flex:0 0 calc(100%);
    -ms-flex:0 0 calc(100%);
    flex:0 0 calc(100%);
}

/* Container pai dos cards de posts */
.posts-list.posts-list--grid.list-style-v6 article {
    /* flex-basis: calc(33.33% - 20px) !important; */
}

/* Containers e espaçamentos */
.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12 {
	position: relative;
	min-height: 1px;
	padding-left: 0.9375rem;
	padding-right: 0.9375rem;
}

.col-xs-12 {
	-webkit-box-flex: 0;
	-webkit-flex: 0 0 100%;
	-ms-flex: 0 0 100%;
	flex: 0 0 100%;
	max-width: 100%;
}

.posts-list.posts-list--grid.list-style-v7 .posts-list__item.grid-item:not(.has-post-thumbnail) .grid-item-inner,.posts-list.posts-list--grid.list-style-v6 .posts-list__item.grid-item:not(.has-post-thumbnail) .grid-item-inner{background-color:#3b3d42}.posts-list.posts-list--grid.list-style-v7 .posts-list__item.grid-item .grid-item-inner,.posts-list.posts-list--grid.list-style-v6 .posts-list__item.grid-item .grid-item-inner {
    position:relative;
    overflow:hidden;
    background-color:rgba(0,0,0,0.1);
    -webkit-transition:all 0.25s ease;
    -o-transition:all 0.25s ease;
    transition:all 0.25s ease;
    -webkit-border-radius:4px;
    border-radius:4px
}

.posts-list.posts-list--grid.list-style-v7 .posts-list__item.grid-item,.posts-list.posts-list--grid.list-style-v6 .posts-list__item.grid-item{margin-bottom:1.875rem}.posts-list.posts-list--grid.list-style-v7 .posts-list__item.grid-item .grid-item__thumbnail,.posts-list.posts-list--grid.list-style-v6 .posts-list__item.grid-item .grid-item__thumbnail{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    -webkit-background-size:cover;
    background-size:cover;
    background-position:center;
    z-index:-1;
}

/* Container dos posts individuais */
#singlepost-container {
    max-width: 772px;
    padding: 3rem 0 !important;
    margin: auto;
}

.single-container p {
    font-size: 20px;
    line-height: 2rem;
}

/* Título das páginas individuais dos blog */
.single-title {
    text-align: center;
    font-weight: 400;
    font-size: 2.65rem;
}

@media (min-width: 940px){
    .posts-list.posts-list--grid.list-style-default .grid-item,
    .posts-list.posts-list--grid.list-style-v2 .grid-item,
    .posts-list.posts-list--grid.list-style-v6 .grid-item{
        /* max-width:calc(100% / 3); */
        width:calc(100% / 3);-webkit-box-flex:0;
        -webkit-flex:0 0 calc(100% / 3);
        -ms-flex:0 0 calc(100% / 3);
        flex:0 0 calc(100% / 3)
    }

    .posts-list.posts-list--grid.list-style-v6 {
        justify-content: normal;
    }
}

.header .navbar-dark .navbar-toggler {
    border: none;
    padding: .25rem .6rem;
    background-color: darkgray;
    
}

.header .navbar-dark .navbar-toggler:hover {
    -webkit-opacity: 1;
    -moz-opacity: 1;
    opacity: 1
}

.header .navbar-dark .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(256,256,256, 1)' stroke-width='3' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

.header .nav-item {
    font-weight: bold
}

.header .nav-item.active a {
    color: rgba(0, 0, 0, 0.5)
}

.header .nav-item.active a:hover {
    text-decoration: none
}

.header .nav-item a {
    font-family: poppins;
    font-weight: 300;
    color: var(--blue);
    margin-left: 2rem;
}

.header .nav-item a:hover {
    text-decoration: underline;
    color: rgba(0, 0, 0, 0.6)
}
.logo{
    width:78px;
}
.social-list a {
    width: 32px;
    height: 32px;
    padding-top: 5px;
    display: inline-block;
    text-align: center;
    border-radius: 50%;
    transition: all 0.2s ease-in-out;
    background-color: #fff
}

.social-list a:hover {
    color: var(--secondary);
    background-color: rgba(255, 255, 255, 0.8)
}

.main-wrapper {
    /* margin-left: var(--sidebar-width); */
    background: #fff;
    min-width: 100vw;
}

.main-wrapper .container {
    max-width: var(--content-max-width);
}

.page-title {
    height: 5rem;
    position: sticky;
    top: 0;

    display: flex;
    justify-content: center;
    align-items: center;

    z-index: 9999;
    transition: all .2s;
}

#page-title {
    margin: 40px 0 0 0;
}

.page-title .heading {
    font-family: poppins;
    font-size: 2rem;
    font-weight: 200;
    color:white !important;
    margin: 0;
}

.post-image {
    max-width: 100vw;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

.post-image img {
    display: block;
    margin: 1rem auto 2rem;
    position: relative;
    object-fit: cover;
    width: 100%;
    height: auto;
}

.sticky {
    padding: 1em 0 !important;
}

.main-section {
    background-image: url('assets/images/001_home_v3.jpg');
    background-size: cover;
}

.footer {
    color: rgba(255, 255, 255, 0.7);
    position: fixed;
    width: 100vw;
    bottom: 0;
}

.footer a {
    color: #fff
}

#footer-social {
    display: block !important;
}

#footer-social a {
    color: #145C92;
}

.gradient{
    /* background: rgb(43,43,43); */
    background: var(--blue) !important;
}
.content .post .title {
    font-family: poppins;
    font-size: 1.275rem;
}

.content .post .title a {
    color: var(--blue);
    font-weight: 400;
}

.content .post .title a:hover {
    color: var(--gray-dark)
}

.content .post .post-thumb {
    max-width: 160px;
    border-radius: 2px
}

.content .post .intro {
    font-size: 0.875rem
}

.content .post .more-link {
    font-size: var(--font-small);
}

.meta {
    color: #8f8f8f;
    font-size: var(--font-small);
}

.reply {
    background-color: var(--blue);
    margin-top: 1rem;
}

.meta span {
    display: inline-block;
    margin-right:.25em;
}

.meta span a {
    color: #8f8f8f
}
.meta span.tag {
    background-color: var(--lightgray);
    padding:0 .5em;
    border-radius:5px;
}
.meta span a:hover {
    color: var(--secondary)
}



.meta span:last-child:after {
    display: none
}

.blog-nav a {
    background: var(--primary);
    color: #fff;
    font-size: 1rem;
    padding: 1rem;
    font-weight: bold;
    position: relative
}

.blog-nav a:hover {
    background: var(--secondary);
}

.blog-nav .nav-link-prev {
    border-right: 1px solid var(--secondary);
}

.blog-nav .arrow-prev {
    position: absolute;
    left: 1rem;
    top: 1.25rem;
    color: #fff
}

.blog-nav .arrow-next {
    position: absolute;
    right: 1rem;
    top: 1.25rem;
    color: #fff
}

.content .title {
    font-weight: bold;
    font-size: 2rem
}

.content .content-body p,
.content .content-body li {
    font-size: 1.125rem;
    line-height: 1.6
}

.content .content-body h1 {
    font-size: 2.125rem
}

.content .content-body h2 {
    font-size: 2rem
}

.content .content-body h3 {
    font-size: 1.75rem
}

.content .content-body h4 {
    font-size: 1.5rem
}

.content .content-body h5 {
    font-size: 1.25rem
}

.content .content-body h6 {
    font-size: 1.125rem
}

.content .image-caption {
    color: #8f8f8f;
    font-size: 0.875rem
}

.content .image-caption a {
    color: #8f8f8f;
    text-decoration: underline
}

.content .image-caption a:hover {
    color: var(--secondary)
}

.content .blockquote {
    font-family: Georgia, "Times New Roman", Times, serif;
    border-left: 2px solid var(--gray-dark);
    font-size: 1.5rem
}

.content .blockquote p {
    font-size: 1.5rem
}

@media (prefers-reduced-motion: reduce) {
    .social-list a {
        transition: none
    }
    .btn {
        transition: none
    }
}

@media (max-width: 600px) {
    #profissional-info p {
        padding: 0 2rem 0 0;
    }
    
}

@media (max-width: 991.98px) {
    .header {
        position: sticky;
        width: inherit;
        height: auto;
    }
/* 
    .header .site-title {
        width: 100%;
        left: 0;
        top: 1.2rem;
        color:var(--blue);
        font-size:1.5em;
        display:none;
    } */

    .header .btn-primary {
        width: 100%
    }

    .header .navbar {
        padding: 1rem
    }

    .main-wrapper {
        margin-left: 0
    }
}

@media screen and (max-width: 390px) {
    .header .site-title {
        display: none;
    }

    .heading {
        font-size: 1.2rem !important;
    }

    .grid-item-inner:hover .entry-title,
    .grid-item-inner:hover .entry-meta {
        margin-bottom: 0 !important;
        transform: translateY(-20%) !important; /* Move o título para cima */
        transition: transform 1.5s ease; /* Adiciona uma transição suave */
    }

    #singlepost-container {
        max-width: 300px !important;
        padding: 3rem 3rem !important;
        margin: auto !important;
    }

    .single-title {
        font-size: 2.3rem !important;
    }
}

@media screen and (min-width: 391px) and (max-width: 600px) {
    .header {
        justify-content: space-between;
    }

    .header .site-title {
        display: none;
    }

    #button-anchor {
        margin-right: 1rem;
    }

    .heading {
        font-size: 1.5rem !important;
    }

    .grid-item-inner{
        min-height: 380px;
    }

    .grid-item-inner:hover .entry-title,
    .grid-item-inner:hover .entry-meta {
        margin-bottom: 0 !important;
        transform: translateY(-20%) !important; /* Move o título para cima */
        transition: transform 1s ease; /* Adiciona uma transição suave */
    }

    #singlepost-container {
        max-width: 500px !important;
        padding: 3rem 3rem !important;
        margin: auto !important;
    }

    .entry-meta p {
        margin-bottom: 2px !important;
    }

    .single-title {
        font-size: 2.3rem !important;
    }
}

@media only screen and (min-width: 601px) and (max-width: 640px) {
    .site-content__wrap {
        max-width: 90% !important;
    }

    article {
        max-width: 600px !important;
    }

    .grid-item-inner{
        min-height: 420px;
        max-width: 500px !important;
    }
}

@media only screen and (min-width: 640px) and (max-width: 721px) {
    .site-content__wrap {
        max-width: 100% !important;
    }

    article {
        max-width: 290px !important;
    }
}

@media only screen and (min-width: 722px) and (max-width: 768px) {
    article {
        max-width: 320px !important;
    }
}

@media only screen and (min-width: 601px) and (max-width: 768px) {
    .header .site-title {
        display: none;
    }

    .site-content__wrap {
        max-width: 95%;
    }

    .grid-item-inner{
        min-height: 390px !important;
        max-width: 290px;
    }

    article {
        max-width: 320px;
    }

    #singlepost-container {
        max-width: 772px !important;
        padding: 3rem 3rem !important;
        margin: auto !important;
    }
}

@media only screen and (min-width: 769px) and (max-width: 938px) {
    .posts-list.posts-list--grid.list-style-v6 {
        gap: 0 !important;
    }

    .grid-item-inner {
        max-width: 290px !important;
    }

    article {
        max-width: 350px !important;
    }

    #singlepost-container {
        max-width: 772px !important;
        padding: 3rem 0 !important;
        margin: auto !important;
    }
}

@media only screen and (min-width: 769px) and (max-width: 992px) {
    .header .site-title {
        display: none;
    }
    
    #blog-main {
        margin-top: 3rem;
    }

    .site-content__wrap {
        max-width: 95%;
    }

    .posts-list.posts-list--grid.list-style-v6 {
        /* gap: 10rem; */
    }

    .grid-item-inner{
        min-height: 450px;
    }
}

@media only screen and (min-width: 993px) and (max-width: 1440px) {
    #blog-main {
        margin-top: 3rem;
    }

    .site-content__wrap {
        max-width: 90% !important;
    }

    .single-title {
        font-size: 2.8rem !important;
    }
}

@media only screen and (min-width: 1441px) and (max-width: 1700px) {
    #blog-main {
        margin-top: 3rem;
    }
}

@media only screen and (min-width: 1701px) {
    #blog-main {
        margin-top: 4rem;
    }

    .site-content__wrap {
        max-width: 1250px !important;
    }
}