/*
Theme Name: Astra Child
Description: A child theme of Astra for MF
Version: 1.0.0
Text Domain: astra
Template: astra
*/

:root {
	--blue: #0CC4FF;
	--grey: #938E8A;
}

.ast-logo-title-inline .site-logo-img {padding: 0 !important;}

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

.flex-row {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;	
}
.flex-row.align-center {
	-webkit-justify-content: center;
	-ms-justify-content: center;
	justify-content: center;
	-webkit-align-items: center;
	-ms-align-items: center;
	align-items: center;	
}
.flex-row.align-justify {
	-webkit-justify-content: space-between;
	-ms-justify-content: space-between;
	justify-content: space-between;
}
.flex-row.align-center-justify {
	-webkit-justify-content: space-between;
	-ms-justify-content: space-between;
	justify-content: space-between;
	-webkit-align-items: center;
	-ms-align-items: center;
	align-items: center;	
}
.flex-row.wrap {flex-wrap: wrap;}

.padding-content {padding: 70px 0;}
.padding-top0 {padding-top: 0;}
.padding-bottom0 {padding-bottom: 0;}

.button-back {display: inline-block; text-transform: uppercase; font-weight: bold; position: relative; line-height: 60px; padding: 0 0 0 30px;}
.button-back:before {content: " "; display: block; width: 8px; height: 8px; border: solid 2px var(--blue); border-top: 0; border-right: 0;
	position: absolute; left: 0; top: 26px; transform: rotate(45deg);
	transition: all .2s linear
}
.button-back:hover {color: var(--ast-global-color-3) !important;}

.ast-container.block {display: block !important;}

#blog-top {border-top: solid 1px var(--blue); border-bottom: solid 1px var(--blue); padding: 20px 0;}
#blog-top .left {width: calc(100% - 380px); padding: 0 30px 0 0;}
#blog-top .right {width: 380px; border-left: solid 1px var(--blue); font-size: 0; padding: 0 0 0 30px;}

.blog-featured-posts {margin: 0; padding: 0; list-style: none; display: table;}
.blog-featured-posts li {display: table-cell; padding: 0 40px 0 0;}
.blog-featured-posts a {display: inline-block; vertical-align: middle; color: var(--grey); font-weight: 600; font-size: 0.938rem; line-height: 120%;}
.blog-featured-posts a:hover {color: var(--blue);}

.blog-dropdown {display: inline-block; vertical-align: middle; position: relative; font-size: 1rem; width: calc(50% - 15px);}
.blog-dropdown .value {color: var(--grey); font-weight: 600; font-size: 0.938em; margin: 0; padding: 0 15px; line-height: 60px; cursor: pointer; position: relative;
	transition: all .2s linear
}
.blog-dropdown .value:after {content: " "; display: block; width: 8px; height: 8px; border: solid 2px var(--blue); border-top: 0; border-left: 0;
	position: absolute; right: 0; top: 24px; transform: rotate(45deg);
	transition: all .2s linear
}
.blog-dropdown nav {position: absolute; left: 0; top: 100%; z-index: 2;
	opacity: 0; pointer-events: none; width: 100%; background: #fff;
	border-radius: 3px; padding: 15px 10px 15px 15px;
	transition: all .2s linear
}
.blog-dropdown ul {list-style: none; margin: 0; padding: 0; height: 216px; overflow: auto; -webkit-overflow-scrolling: touch;}
.blog-dropdown ul a {display: block; font-weight: 600; font-size: 0.875em; 
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 36px; color: var(--ast-global-color-3);
}
.blog-dropdown ul a:hover {color: var(--blue);}
.blog-dropdown.active .value, .blog-dropdown .value:hover {color: var(--blue);}
.blog-dropdown.active .value:after {transform: rotate(225deg); top: 27px;}
.blog-dropdown.active nav {opacity: 1; pointer-events: auto;}

.post-listing .post-blog + .post-blog {margin: 70px 0 0 0;}
.post-image {display: block; width: 50%;}
.post-image-bg {display: block; padding: 56% 0 0 0; background: var(--ast-global-color-3) no-repeat center center / cover;}
.post-align {width: 50%; padding: 0 0 0 50px;}
.post-date-tags {margin: 0 0 25px 0;}
.post-date {font-size: 0.875em; font-weight: 600; color: #938E8A; text-transform: uppercase; width: 110px;}
.post-tags {margin: 0 0 -9px 0; padding: 0; list-style: none; font-size: 0; width: calc(100% - 110px); text-align: right;}
.post-tags li {display: inline-block; vertical-align: middle; font-size: 1rem; margin: 0 0 9px 9px;}
.post-tags a {display: block; background: var(--blue); color: #fff; font-weight: 600; font-size: 0.75em; line-height: 24px; padding: 0 8px;
	border-radius: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.post-tags a:hover {background: var(--ast-global-color-3); color: #fff;}
.entry-content .post-tags {width: 100%; text-align: left; margin: 0 0 21px 0;}
.entry-content .post-tags li {margin: 0 9px 9px 0;}
.post-title {display: block; font-size: 1.5rem !important; font-weight: 600; color: #393A3A; line-height: 140%; margin: 0 0 20px 0;}
a.post-title:hover {color: var(--ast-global-color-3);}
.post-excerpt {font-weight: 600; color: #979797; line-height: 140%; margin: 0 0 20px 0; font-size: 1rem !important;}
.post-more {font-weight: bold; text-transform: uppercase; color: var(--blue);}
a.post-more:hover {color: var(--ast-global-color-3);}
.post-comments span {display: inline-block; vertical-align: middle; font-size: 0.875em; font-weight: 600; color: #979797; margin: 0 3px 0 0;
	transition: all .2s linear
}
.post-comments strong {display: inline-block; vertical-align: middle; width: 32px; line-height: 32px; text-align: center; background: #fff;
	font-size: 0.875em; font-weight: 600; color: var(--blue);
	border-radius: 100%;
	transition: all .2s linear
}
a.post-comments:hover span {color: var(--ast-global-color-3);}
a.post-comments:hover strong {background: var(--blue); color: #fff;}
.blog-main-content {background: #fff;}
.blog-main-content .post-comments strong {background: #EAF9FE;}

.wp-pagenavi {font-size: 0; text-align: center; margin: 60px 0 0 0;}
.wp-pagenavi .page, .wp-pagenavi .current {display: inline-block; vertical-align: middle; margin: 10px 8px 0 8px;
	font-size: 1.125rem; color: var(--blue); width: 42px; line-height: 38px; border: solid 2px var(--blue);
	-webkit-border-radius: 3px;
	border-radius: 3px;	
}
.wp-pagenavi .page:hover {color: var(--ast-global-color-3); border-color: var(--ast-global-color-3);}
.wp-pagenavi .current {background: var(--blue); color: #fff; cursor: default;}
.wp-pagenavi .previouspostslink, .wp-pagenavi .nextpostslink {display: inline-block; vertical-align: middle; position: relative; margin: 10px 8px 0 8px;
	width: 41px; height: 38px; text-indent: -9999px;
}
.wp-pagenavi .previouspostslink:before, .wp-pagenavi .nextpostslink:before {content: " "; display: block; width: 100%; height: 100%;
	position: absolute; top: 0; left: 0; background: url(images/icon-arrow-1.svg) no-repeat 0 0;
	-webkit-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease;
}
.wp-pagenavi .nextpostslink:before {-webkit-transform: rotate(180deg); transform: rotate(180deg);}
.wp-pagenavi .previouspostslink:hover:before {left: -3px;}
.wp-pagenavi .nextpostslink:hover:before {left: 3px;}

.blog-single-post-content {text-align: center; position: relative;}
.blog-single-post-content .content {display: inline-block; width: 670px; text-align: left;}
.blog-single-post-content .the-content > figure:first-child {display: none;}

#post-share {position: absolute; top: 0; pointer-events: none; z-index: 1000; width: 48px;}
#post-share p {writing-mode: vertical-rl; line-height: 48px; font-size: 0.875em; margin: 0; padding: 0;}
#post-share ul {margin: 0; padding: 0; list-style: none;}
#post-share li {display: block; margin: 20px 0 0 0}
#post-share li a {display: inline-block; width: 48px; line-height: 48px; background: var(--blue); pointer-events: auto; font-size: 0;
	-webkit-border-radius: 100%;
	border-radius: 100%;	
}
#post-share li a:hover {background: var(--ast-global-color-3);}
#post-share li img {max-height: 20px; width: auto;}


#header-order-button {display: inline-block; background: var(--blue); color: #fff; line-height: 45px;
	border-radius: 3px; padding: 0 25px; font-size: 0.875em; font-weight: 600; text-transform: uppercase; white-space: nowrap;
}
#header-order-button:hover {background: var(--ast-global-color-3); color: #fff;}

.ast-comment-content.comment p {font-size: 0.875em;}

.ast-separate-container .ast-archive-description, .ast-separate-container .ast-author-box {background: none; padding: 70px 0;}

body.blog #primary,
body.single-post #primary,
body.search #primary,
body.archive #primary {margin-bottom: 0;}

body.blog #content > .ast-container,
body.single-post #content > .ast-container, 
body.search #content > .ast-container,
body.archive #content > .ast-container {max-width: 100%; padding: 0 !important;}

/*body.blog #header-order-button,
body.single-post #header-order-button,
body.search #header-order-button,
body.archive #header-order-button {display: inline-block;}*/

.ast-theme-transparent-header .ast-builder-menu .main-header-menu .menu-item:hover > .menu-link,
.ast-theme-transparent-header .ast-builder-menu .main-header-menu .menu-item:hover > .ast-menu-toggle,
.ast-theme-transparent-header .ast-builder-menu .main-header-menu .ast-masthead-custom-menu-items a:hover,
.ast-theme-transparent-header .ast-builder-menu .main-header-menu .focus > .menu-link,
.ast-theme-transparent-header .ast-builder-menu .main-header-menu .focus > .ast-menu-toggle,
.ast-theme-transparent-header .ast-builder-menu .main-header-menu .current-menu-item > .menu-link,
.ast-theme-transparent-header .ast-builder-menu .main-header-menu .current-menu-ancestor > .menu-link,
.ast-theme-transparent-header .ast-builder-menu .main-header-menu .current-menu-item > .ast-menu-toggle,
.ast-theme-transparent-header .ast-builder-menu .main-header-menu .current-menu-ancestor > .ast-menu-toggle,
.ast-theme-transparent-header [CLASS*="ast-builder-menu-"] .main-header-menu .current-menu-item > .menu-link,
.ast-theme-transparent-header [CLASS*="ast-builder-menu-"] .main-header-menu .current-menu-ancestor > .menu-link,
.ast-theme-transparent-header [CLASS*="ast-builder-menu-"] .main-header-menu .current-menu-item > .ast-menu-toggle,
.ast-theme-transparent-header [CLASS*="ast-builder-menu-"] .main-header-menu .current-menu-ancestor > .ast-menu-toggle,
.ast-theme-transparent-header .main-header-menu .menu-item:hover > .menu-link,
.ast-theme-transparent-header .main-header-menu .current-menu-item > .menu-link,
.ast-theme-transparent-header .main-header-menu .current-menu-ancestor > .menu-link
{color: inherit;}

#blog-top-before {text-align: center; margin: -30px 0 50px 0;}
#blog-top-before h1 {font-size: 2rem; margin: 0 0 15px 0;}
#blog-top-before p {font-weight: 600; color: var(--grey);}