/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------

	0. 	CSS Reset
	1. 	Document Setup
	2. 	Element Base
	3. 	Helper Classes
	4. 	Site Header
	5. 	Menu Modal
	6. 	Search Modal
	7. 	Page Templates
		a. 	Template: Cover Template
		c. 	Template: Full Width
	8.  Post: Archive
	9.  Post: Single
	10. Blocks
	11. Entry Content
	12. Comments
	13. Site Pagination
	14. Error 404
	15. Widgets
	16. Site Footer
	17. Media Queries

----------------------------------------------------------------------------- */


/*	0. CSS Reset
/* -------------------------------------------------------------------------- */

html,
body {
	border: none;
	margin: 0;
	padding: 0;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
address,
big,
cite,
code,
em,
font,
img,
small,
strike,
sub,
sup,
li,
ol,
ul,
fieldset,
form,
label,
legend,
button,
table,
caption,
tr,
th,
td {
	border: none;
	font-size: inherit;
	line-height: inherit;
	margin: 0;
	padding: 0;
	text-align: inherit;
}

blockquote::before,
blockquote::after {
	content: "";
}

/*	1. Document Setup
/* -------------------------------------------------------------------------- */

:root {
    --black: #2C2C2C;
    --dark-grey: #555555;
    --blue: #18A0FB;
    --white: #F9F9F9;
    --grey: #F1F1F1;
    --total-black: #222;
}

body {
    font-size: 1.1em;
    background-color: var(--dark-grey);
}

/* -------------------------------------------------------------------------- */

/*	2. Element Base
/* -------------------------------------------------------------------------- */


h1,
h2,
h3,
h4,
h5,
h6,
p,
time,
figcaption,
ol,
em,
cite,
strong,
ul,
.wp-caption-text,
.wp-caption,
.gallery-caption,
.bypostauthor,
.screen-reader-text   {
    color: var(--white);
    word-break:break-all;
}
.alignright {
    text-align: right;
}

.alignleft {
    text-align: left;
}

.aligncenter {
    text-align: center;
}

a {
    color: var(--blue);
    opacity: .8;
}

ul {
    padding-left: 0;
}

ul li {
    list-style-type: none;
}

a:hover {
    opacity: 1;
    text-decoration: none;
}

h1,
.heading-size-1 {
	font-size: 3.6rem;
	font-weight: 800;
	line-height: 1.138888889;
}

h2,
.heading-size-2 {
	font-size: 2.2rem;
}

h3,
.heading-size-3 {
	font-size: 1.8rem;
}

h4,
.heading-size-4 {
    font-size: 1.5rem;
    line-height: 1.1em;
}

h5,
.heading-size-5 {
	font-size: 1.3rem;
}

h6,
.heading-size-6 {
	font-size: 1.1rem;
	letter-spacing: 0.03125em;
}

blockquote {
    background-color: var(--dark-grey);
    border-radius: 10px;
    padding: 15px;
    margin: 14px;
}

p {
	line-height: 1.5;
}

time {
    font-size: .8em;
    opacity: .8;
}

/* Clearing ---------------------------------- */

.group::after,
.entry-content::after {
	clear: both;
	content: "";
	display: block;
}

/* -------------------------------------------------------------------------- */

/*	3. Site header
/* -------------------------------------------------------------------------- */

.header {
    background-color: var(--black);
    padding: 10px;
}

/* -------------------------------------------------------------------------- */

/*	4. Helper classes
/* -------------------------------------------------------------------------- */

.blog-card {
    background-color: var(--black);
    border-radius: 10px;
    padding: 22px;
    margin: 10px;
}

.blog-card .author {
    top: -20px;
    left: 30px;
    background-color: var(--blue);
    border-radius: 10px;
    padding: 5px 12px;
}

.next-link {
    border-radius: 50%;
    background-color: var(--blue);
    width: 50px;
    height: 50px;
}

.next-link i {
    color: var(--white);
    font-size: 1.4em;
}

.shadow {
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15) !important;
}

.muted {
    opacity: .8;
}

.dividor {
    background-color: var(--dark-grey);
    height: 1px;
    width: 100%;
    margin-top: 10px;
    margin-bottom: 10px;
}

.widget-content {
    background-color: var(--black);
    border-radius: 10px;
    padding: 22px;
    margin: 10px;
    margin-top: 3rem;
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15) !important;
}

/* -------------------------------------------------------------------------- */

/*	5. Main menu
/* -------------------------------------------------------------------------- */

.menu {
    margin: 10px;
    float: left;
    position: fixed;
    background-color: var(--black);
    padding: 10px;
    border-radius: 10px;
}

.menu li {
    margin-top: 10px;
}

.page_item_has_children {
    position: relative;
}

.page_item_has_children .children {
    width: auto;
    margin-left: 10px;
    transition: .4s;
}

.page_item_has_children > .children {
    display: none;
    transition: 1s ease all;
    opacity: 0;
}

.page_item_has_children:hover > .children {
    display: block;
    transition: 1s ease all;
    opacity: 1;
}

/* -------------------------------------------------------------------------- */

/*	6. Category items icon
/* -------------------------------------------------------------------------- */

.cat-item {
    color: var(--white);
}

/* -------------------------------------------------------------------------- */

/*	6. Block buttons
/* -------------------------------------------------------------------------- */
.wp-block-button {
    margin: 10px;
    color: var(--white);
} 

.wp-block-button__link {
    color: var(--white) !important;
    background-color: var(--dark-grey);
}

.is-style-outline .wp-block-button__link  {
    color: var(--white);
    border: 2px solid var(--white);
}

/* -------------------------------------------------------------------------- */

/*	7. Blocks
/* -------------------------------------------------------------------------- */
.wp-block-cover-text {
    color: var(--white) !important;
}

.wp-block-cover {
    max-height: 500px !important;
}

/* -------------------------------------------------------------------------- */

/*	8. tags
/* -------------------------------------------------------------------------- */

.tags a {
    background-color: var(--blue);
    color: var(--white);
    border-radius: 10px;
    padding: 6px;
}

.bg-black {
    background-color: var(--total-black);
}