/*
Theme Name: WP-Emawebdesign
Theme URI: https://www.emawebdesign.com/wp-emawebdesign/
Description: WP-Emawebdesign is a free WordPress theme (based on Bootstrap 5) characterized by a clean design and professional image. Developed according to the responsive design technique, it offers an excellent UX on both desktop and mobile. The design was carried out with the best SEO practices, which is why it is a suitable theme for blogs, personal or professional projects and for those who, in general, deal with online writing.
Author: Emawebdev
Author URI: https://www.emaweb.dev
Tags: blog, custom-logo, custom-menu, featured-images, full-width-template, theme-options, translation-ready, threaded-comments, right-sidebar
Version: 2.2
Tested up to: 7.3
Requires PHP: 7.0
Domain Path: 	/languages
License: GNU General Public License v3 or later
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Text Domain: wp-emawebdesign
*/

/* source-code-pro-regular - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Source Code Pro';
    font-style: normal;
    font-weight: 400;
    src: url('assets/fonts/source-code-pro-v23-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
  
  /* source-code-pro-italic - latin */
  @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Source Code Pro';
    font-style: italic;
    font-weight: 400;
    src: url('assets/fonts/source-code-pro-v23-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
  
  /* source-code-pro-600 - latin */
  @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Source Code Pro';
    font-style: normal;
    font-weight: 600;
    src: url('assets/fonts/source-code-pro-v23-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
  
  /* source-code-pro-600italic - latin */
  @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Source Code Pro';
    font-style: italic;
    font-weight: 600;
    src: url('assets/fonts/source-code-pro-v23-latin-600italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
  
  /* source-code-pro-700 - latin */
  @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Source Code Pro';
    font-style: normal;
    font-weight: 700;
    src: url('assets/fonts/source-code-pro-v23-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
  
  /* source-code-pro-700italic - latin */
  @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Source Code Pro';
    font-style: italic;
    font-weight: 700;
    src: url('assets/fonts/source-code-pro-v23-latin-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
  
  /* source-code-pro-800 - latin */
  @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Source Code Pro';
    font-style: normal;
    font-weight: 800;
    src: url('assets/fonts/source-code-pro-v23-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
  
  /* source-code-pro-800italic - latin */
  @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Source Code Pro';
    font-style: italic;
    font-weight: 800;
    src: url('assets/fonts/source-code-pro-v23-latin-800italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
  
  /* martel-sans-regular - latin */
  @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Martel Sans';
    font-style: normal;
    font-weight: 400;
    src: url('assets/fonts/martel-sans-v12-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
  
  /* martel-sans-700 - latin */
  @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Martel Sans';
    font-style: normal;
    font-weight: 700;
    src: url('assets/fonts/martel-sans-v12-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
  
  /* martel-sans-800 - latin */
  @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Martel Sans';
    font-style: normal;
    font-weight: 800;
    src: url('assets/fonts/martel-sans-v12-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
  
  /* martel-sans-900 - latin */
  @font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Martel Sans';
    font-style: normal;
    font-weight: 900;
    src: url('assets/fonts/martel-sans-v12-latin-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

:root {
  --text-primary: #018ad1;
  --hover-primary: #5cacd3;
  --bg-primary: #018ad1;
  --text-secondary: #f2c041;
  --hover-secondary: #f6d990;
  --bg-secondary: #f2c041;
  --bg-main: #f7f5f5;
  --text: #6b6d6e;
}

body {
    font-family: "Martel Sans", sans-serif;
    color: var(--text);
    background-color: var(--bg-main);
    line-height: 1.9;
    font-size: 16px;
}

.alignnone {
margin: 5px 20px 20px 0;
}

.aligncenter,
div.aligncenter {
display: block;
margin: 5px auto 5px auto;
}

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

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

.has-text-align-center {
    text-align: center;
}

a img.alignright {
float: right;
margin: 5px 0 20px 20px;
}

a img.alignnone {
margin: 5px 20px 20px 0;
}

a img.alignleft {
float: left;
margin: 5px 20px 20px 0;
}

a img.aligncenter {
display: block;
margin-left: auto;
margin-right: auto;
}

.wp-caption {
background: #fff;
border: 1px solid #f0f0f0;
max-width: 96%; /* Image does not overflow the content area */
padding: 5px 3px 10px;
text-align: center;
}

.wp-caption.alignnone {
margin: 5px 20px 20px 0;
}

.wp-caption.alignleft {
margin: 5px 20px 20px 0;
}

.wp-caption.alignright {
margin: 5px 0 20px 20px;
}

.wp-caption img {
border: 0 none;
height: auto;
margin: 0;
max-width: 98.5%;
padding: 0;
width: auto;
}

.wp-caption p.wp-caption-text {
font-size: 11px;
line-height: 17px;
margin: 0;
padding: 0 4px 5px;
}

/* Text meant only for screen readers. */
.screen-reader-text {
border: 0;
clip: rect(1px, 1px, 1px, 1px);
clip-path: inset(50%);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute !important;
width: 1px;
word-wrap: normal !important; /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}

.screen-reader-text:focus {
background-color: #eee;
clip: auto !important;
clip-path: none;
color: var(--text-primary);
display: block;
font-size: 1em;
height: auto;
left: 5px;
line-height: normal;
padding: 15px 23px 14px;
text-decoration: none;
top: 5px;
width: auto;
z-index: 100000;
/* Above WP toolbar. */
}
  

.wp-caption, .wp-caption-text, .gallery-caption, .bypostauthor {
    color: var(--text-primary);
}

.bg-primary {
    background-color: var(--bg-primary) !important;
}

.btn:active, a:active {
    transform: translateY(+2px) !important;
  }

.btn-primary, .btn-primary:active {
    color: #fff;
    background-color: var(--bg-primary) !important;
    border-color: var(--bg-primary) !important;
}
.btn-primary:hover {
    color: #fff;
    background-color: var(--hover-primary) !important;
    border-color: var(--hover-primary) !important;
}
.btn-primary.disabled,
.btn-primary:disabled {
    color: #fff;
    background-color: var(--hover-primary) !important;
    border-color: var(--hover-primary) !important;
}

.btn-success, .btn-success:active {
    color: #fff !important;
    background-color: #36b17c !important;
    border-color: #36b17c !important;
}
.btn-success:hover {
    color: #fff !important;
    background-color: #6dcca3 !important;
    border-color: #36b17c !important;
}
.btn-success.disabled,
.btn-success:disabled {
    color: #fff !important;
    background-color: #36b17c !important;
    border-color: #36b17c !important;
}

.card-author {
    background-color: #eee;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 5px 0px, rgba(0, 0, 0, 0.1) 0px 0px 1px 0px !important;
    width: 100% !important;
    clear: both;
    margin-top: 50px;
}

.card-author img {
    border: solid 3px var(--bg-primary);
}

.content .card, .sidebar .card {
    box-shadow: rgba(0, 0, 0, 0.2) 0px 4px 12px;
}

.content .card h3, .content .card h1 {
    font-size: 1.5rem;
    font-weight: 600;
}

.content .card h3 a {
    color: var(--text-primary);
    text-decoration: none;
}

.content .card p {
    color:var(--text);
    margin-bottom: 1.5rem;
}

.content .card p a {
    color:var(--text-primary);
    text-decoration: underline;
}

.content .card p strong {
    font-weight: 800;
}

.content .card small {
    font-weight: 600;
}

.card-img-top {
    width: 100%;
    height: 25vw;
    object-fit: cover;
}

@media (max-width: 768px) {
    .card-img-top {
        width: 100%;
        height: 50vw;
        object-fit: cover;
    }
}

.comments-area label:not(.comment-form-cookies-consent label) {
    width: 100% !important;
}

.comment-list .media-heading {
    font-size: 18px;
}

.comment-list .media-heading a {
    color: var(--text-primary);
    text-decoration: none;
    font-size: 18px;
}

.comment-list .comment-metadata a {
    color: var(--text-primary);
    text-decoration: none;
    font-size: 14px;
}

.comment-list .media-body .comment-reply-link {
    color: #fff !important;
    text-decoration: none;
    font-size: 14px;
}

.comment-list li {
    background: var(--bg-main);
    padding: 20px;
    margin-bottom: 20px;
}

.content form label {
    color: var(--text-primary);
}

.footer-shadow {
    box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 5px 0px, rgba(0, 0, 0, 0.1) 0px 0px 1px 0px;
}

footer p, footer a {
    color: #ffffff !important;
}

footer a {
    text-decoration: none;
}

footer a:hover {
    text-decoration: underline;
}

.fadein-img {
    opacity:1;
    transition: 1s ease;
}

.fadein-img:hover{
    opacity:0.5;
    transition: 1s ease;
}    

.hr-divider {
    display: flex;
    margin-bottom: 30px;
}
.hr-line {
    width: 100%;
    position: relative;
    margin: 15px;
    border-bottom: 2px solid #ccc;
}
.hr-divider .fa, .hr-divider a {
    color: var(--text)
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Source Code Pro", monospace;
  font-weight: 600;
  text-transform: uppercase;
  color: var(--text-primary);
  line-height: 1.5;
}

.header {
    /*background: rgb(1,138,209);
    background: linear-gradient(180deg, rgba(1,138,209,1) 0%, rgba(48,139,186,1) 35%, rgba(5,107,159,1) 100%); */
    background-color: var(--bg-primary);
    box-shadow: #9d9c9c 0px 0px 5px 0px, #9d9c9c 0px 0px 1px 0px;
}

.header img {
    border: solid 3px #ffffff;
}

.header h2 {
    font-size: 1.5rem;
    color: var(--text-secondary) !important;
    font-style: italic;
    text-shadow: 2px 1px 0 #836313;
}

.h2-page {
    font-size: 1.3rem;
    color: var(--text-secondary) !important;
    font-style: italic;
}

.header p {
    font-size: 1rem;
    color: #f2f2f2;
    text-shadow: 2px 1px 0 #7e7c7c;
}

.header a:not(.btn-success) {
    color: var(--text-primary) !important;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.logo {
    background-color: #ffffff;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 5px 0px, rgba(0, 0, 0, 0.1) 0px 0px 1px 0px;
}

@media (min-width: 992px) {
    .logo-page a {
        float:left;
        margin-left: 20px;
    }
    .logo-page .h2-page {
        float:right;
        margin-right: 25px;
    }
}

#main-content .card-body .badge {
    margin-bottom: 5px !important;
}

#nav-content ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

#nav-content ul li {
    position: relative;
}

#nav-content ul ul {
    display: none;
    position: absolute;
    top: 100%;
}

#nav-content ul li:hover > ul {
    display: block;
}

#nav-content .dropdown-menu .nav-item:not(:last-child) {
    border-bottom: solid 2px #eee;
    width: 100%;
}


.page-numbers {
    color: var(--bg-primary);
    text-decoration: none;
    margin-right: 10px;
}

.page-numbers.current {
    font-weight: bold;
}

.sidebar h4 {
    font-size: 1.2rem;
    font-weight: 600;
}

.sidebar input, form input[type=text], form input[type=email], form input[type=url], form textarea {
    background-color: var(--bg-main) !important;
}

.sidebar .list-group-item:first-child {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.sidebar .list-group-item {
    color: var(--text);
}

.single-page-logo {
    font-family: "Source Code Pro", monospace;
    font-weight: 600;
    text-transform: uppercase;
    color: var(--text-primary);
    line-height: 1.5;
    font-size: 2rem;
    padding-left: 10px;
}

.single-page-logo:hover {
    color: var(--hover-primary) !important;
}

#tagline { 
    display: inline-block; 
}

.text-primary {
    color: var(--text-primary) !important;
}

.top-nav {
    box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 5px 0px, rgba(0, 0, 0, 0.1) 0px 0px 1px 0px;
    font-size: 0.95rem;
    font-family: "Source Code Pro", monospace;
    background-color: var(--bg-main) !important;
}

.top-nav a {
    color: var(--text-primary) !important;
}

.top-nav a:hover {
    background-color: #fff;
    border-radius: 10px;
}

.top-nav .nav-item {
    margin-right: 1rem;
}

.top-nav .mobile-menu .btn-link {
    text-decoration: none;
    color: var(--text-primary);
}

.top-nav .dropdown-toggle::after {
    content: none;
}

@media (max-width: 992px) {
    .top-nav .left-menu, .top-nav .right-menu {
        display: none;
    }
    .top-nav .mobile-menu {
        display: block;
    }
    .main-content {
        padding: 1.5rem !important;
        margin-top: 20px;
    }
    .main-content .btn {
        width: 100%;
    }
}

@media (min-width: 992px) {
    .top-nav .mobile-menu {
        display: none;
    }
    .sidebar {
        padding-left: 50px;
    }
}

.ityped-cursor {
    font-size: 2.2rem;
    opacity: 1;
    -webkit-animation: blink 0.3s infinite;
    -moz-animation: blink 0.3s infinite;
    animation: blink 0.3s infinite;
    animation-direction: alternate;
}

@keyframes blink {
    100% {
        opacity: 0;
    }
}

@-webkit-keyframes blink {
    100% {
        opacity: 0;
    }
}

@-moz-keyframes blink {
    100% {
        opacity: 0;
    }
}

ul li { clear: both; }

/* clearfix for post float images */
.clearfix:after {
    visibility: hidden;
    display: block;
    content: "";
    clear: both;
    height: 0;
}
* html .clearfix            { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */

.widget {
    margin-bottom: 20px;
}

.widget-title {
    color: var(--text-primary) !important;
    font-size: 20px;
    margin-bottom: 10px;
}