main.blog .search-form {
width: 100%;
max-width: 600px;
position: relative;
}
main.blog .search-form .search-field {
width: 100%;
font-family: 'TeleGrotesk Next', Arial, Helvetica, sans-serif;
font-weight: normal;
font-size: 16px;
color: #222;
padding: 13px 36px 13px 15px;
border-radius: 4px;
border: 1px solid #a90056;
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iNjQiIGhlaWdodD0iNjQiIHZpZXdCb3g9IjAgMCA2NCA2NCI+ICAgIDxkZWZzPiAgICAgICAgPHBhdGggaWQ9ImEiIGQ9Ik0zNyA3YzExLjA0NiAwIDIwIDguOTU0IDIwIDIwcy04Ljk1NCAyMC0yMCAyMGExOS40NiAxOS40NiAwIDAgMS0xMS42LTMuODJoLS4xMmExOC41NyAxOC41NyAwIDAgMS00LjU0LTQuNDdBMjAgMjAgMCAwIDEgMzcgN3ptMC0zYTIzIDIzIDAgMCAwLTE4LjcgMzYuNCAyMS44MSAyMS44MSAwIDAgMCA1LjMgNS4yQTIyLjQxIDIyLjQxIDAgMCAwIDM3IDUwYzEyLjcwMyAwIDIzLTEwLjI5NyAyMy0yM1M0OS43MDMgNCAzNyA0ek0xNy4zNyA0Mi40MUw0LjkgNTQuODdBMy4wMDMgMy4wMDMgMCAxIDAgOSA1OS4yNmwuMTUtLjE1IDEyLjUtMTIuNDlhMjMuODggMjMuODggMCAwIDEtNC4yOC00LjIxeiIvPiAgICA8L2RlZnM+ICAgIDxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+ICAgICAgICA8bWFzayBpZD0iYiIgZmlsbD0iI2ZmZiI+ICAgICAgICAgICAgPHVzZSB4bGluazpocmVmPSIjYSIvPiAgICAgICAgPC9tYXNrPiAgICAgICAgPHVzZSBmaWxsPSIjRTIwMDc0IiBmaWxsLXJ1bGU9Im5vbnplcm8iIHhsaW5rOmhyZWY9IiNhIi8+ICAgICAgICA8ZyBmaWxsPSIjRTIwMDc0IiBtYXNrPSJ1cmwoI2IpIj4gICAgICAgICAgICA8cGF0aCBkPSJNMCAwaDY0djY0SDB6Ii8+ICAgICAgICA8L2c+ICAgIDwvZz48L3N2Zz4=);
background-position: right 10px center;
background-repeat: no-repeat;
background-size: 16px;
}
main.blog .search-form .search-submit {
cursor: pointer;
opacity: 0;
position: absolute;
right: 0;
top: 0;
height: 100%;
width: 36px;
} main.blog .featured-post {
box-shadow: 0px 0px 0px 1px #e6e6e6;
padding: 0 !important;
}
main.blog .featured-post .featured-image {
height: 100%;
}
main.blog .featured-post .c8 {
min-height: 330px;
padding-right: 10px !important;
}
main.blog .featured-post .c4 {
padding: 30px 30px 30px 25px !important;
}
main.blog .featured-post .read-more-link {
margin-top: auto;
}
@media all and (max-width: 639px) {
main.blog .featured-post .c8 {
min-height: auto;
padding-right: 0px !important;
}
main.blog .featured-post .c8 .featured-image {
height: 0;
padding-bottom: 48.5%;
}
main.blog .featured-post .c4 {
padding: 15px !important;
}
}
main.blog aside ul,
main.blog aside li {
padding: 0;
} main.blog aside .social-link-list {
display: flex;
justify-content: space-between;
} main.blog aside .feed-list {
border: 1px solid #e6e6e6;
}
main.blog aside .feed-list li {
padding: 15px;
border-bottom: 1px solid #e6e6e6;
}
main.blog aside .feed-list li:last-child {
border-bottom: none;
}
main.blog aside .feed-list li .featured-image {
flex: 0 0 44px;
margin-right: 20px;
}
main.blog aside .feed-list li > a {
display: flex;
}
main.blog aside .feed-list p {
margin-top: 0;
color: #222;
}
main.blog aside .feed-list li > a:hover p {
color: #e20074;
}
@media all and (min-width: 640px) and (max-width: 860px) {
main.blog aside .feed-list li > a {
flex-direction: column;
}
main.blog aside .feed-list li .featured-image {
max-width: 44px;
margin-bottom: 20px;
}
} main.blog .article-list {
display: flex;
flex-wrap: wrap;
}
main.blog .article-list .article {
display: flex;
flex-direction: column;
width: calc(50% - 15px);
margin-right: 30px;
border: 1px solid #e6e6e6;
}
main.blog .article-list .article .featured-image {
position: relative;
height: 0;
padding-bottom: 48.48%;
}
main.blog .article-list .article:nth-child(2n) {
margin-right: 0;
}
main.blog .article-list .article:nth-child(n+3) {
margin-top: 60px;
}
main.blog .article-list .article .article-content {
display: flex;
flex-direction: column;
align-items: flex-start;
flex-grow: 1;
padding: 20px;
}
main.blog .article-list .article .article-content .read-more-link {
margin-top: auto;
}
@media all and (max-width: 768px) {
main.blog .article-list .article {
width: 100%;
margin-right: 0;
}
main.blog .article-list .article:not(:first-child) {
margin-top: 30px;
}
} main.blog .author-box {
display: flex;
align-items: center;
border: 1px solid #e6e6e6;
padding: 20px;
}
main.blog .author-box .author-avatar {
flex: 0 0 90px;
width: 90px;
margin-right: 30px;
border-radius: 50%;
}
@media all and (max-width: 420px) {
main.blog .author-box {
flex-direction: column;
}
main.blog .author-box .author-avatar {
margin-right: 0;
margin-bottom: 20px;
}
} main.blog article .post-thumbnail {
width: 100%;
height: auto;
}
main.blog article h1 {
font-size: 48px;
line-height: 48px;
font-weight: 900;
}
main.blog article h2 {
font-size: 32px;
line-height: 32px;
font-weight: 900;
}
main.blog article h3 {
font-size: 26px;
line-height: 26px;
font-weight: bold;
}
main.blog article h4 {
font-size: 21px;
line-height: 21px;
font-weight: bold;
}
main.blog article h5 {
font-size: 18px;
line-height: 21px;
font-weight: 900;
}
main.blog article p + figure,
main.blog article h2 + figure,
main.blog article h3 + figure,
main.blog article p + img,
main.blog article p + .fb-video,
main.blog article .fb-video + h2,
main.blog article .fb-video + h3,
main.blog article p + .video-container,
main.blog article .video-container + p,
main.blog article .video-container + h2,
main.blog article .video-container + h3 {
margin-top: 1em;
}
main.blog article p iframe {
display: block;
margin: 0 auto;
}
main.blog article .wp-block-embed-youtube {
text-align: center;
}
main.blog article .wp-block-embed-youtube .wp-block-embed__wrapper,
main.blog article .video-container {
height: 0;
position: relative;
padding-bottom: 56.25%;
}
main.blog article .wp-block-embed-youtube .wp-block-embed__wrapper iframe,
main.blog article .video-container iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
main.blog article figure {
position: relative;
max-width: 100%;
height: auto;
}
main.blog article figure figcaption,
main.blog .thumbnail-caption {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
background-color: rgba(255,255,255,0.75);
font-size: 12px;
font-weight: 900;
line-height: 16px;
padding: 4px 10px;
text-align: left;
margin: 0;
}
@media all and (max-width: 639px) {
main.blog article h1 {
font-size: 40px;
line-height: 36px;
}
main.blog article h2 {
font-size: 28px;
line-height: 29px;
}
main.blog article h3 {
font-size: 22px;
line-height: 24px;
}
main.blog article h4 {
font-size: 19px;
line-height: 21px;
}
main.blog article h5 {
font-size: 16px;
line-height: 18px;
}
main.blog article h6 {
font-size: 14px;
line-height: 16px;
}
} main.blog .article-share .social-link-list li {
display: inline-block;
margin-right: 15px;
}
main.blog .article-share .social-link-list li:last-child {
margin-right: 0;
}
main.blog .article-share.article-share-top {
justify-content: space-between;
align-items: flex-end;
}
main.blog .article-share .shariff svg * {
fill: #e20074 !important;
} main.blog .related-articles .article-list .article {
width: calc(33% - 20px);
}
main.blog .related-articles .article-list .article:nth-child(2n) {
margin-right: 30px;
}
main.blog .related-articles .article-list .article:nth-child(3n) {
margin-right: 0;
}
main.blog .related-articles .article-list .article:nth-child(n+3) {
margin-top: 0;
}
@media all and (max-width: 768px) {
main.blog .related-articles .article-list .article,
main.blog .related-articles .article-list .article:nth-child(2n) {
width: 100%;
margin-right: 0;
}
main.blog .related-articles .article-list .article:not(:first-child) {
margin-top: 30px;
}
} main.blog .comments .comment-reply-link {
text-decoration: underline;
}
main.blog .comments .comment-list li {
padding-left: 30px;
border-left: 1px solid #d0d0d0;
}
main.blog .comments .comment-list li + li {
margin-top: 60px;
}
main.blog .comments .comment-list .children li {
border-left: 1px solid #e6e6e6;
margin-top: 50px;
}
main.blog .comments .comment-list .children li + li {
margin-top: 50px;
} main.blog .sidebar-main .media .media-list {
margin-top: 20px;
}
main.blog .sidebar-main .media .media-box {
display: flex;
}
main.blog .sidebar-main .media .media-box + .media-box {
margin-top: 30px;
}
main.blog .sidebar-main .media .media-box .media-img {
width: 90px;
height: 90px;
margin-right: 30px;
background-position: center;
background-size: cover;
}
@media all and (min-width: 640px) and (max-width: 860px) {
main.blog .sidebar-main .media .media-box {
flex-direction: column;
}
main.blog .sidebar-main .media .media-box .media-img {
width: 44px;
height: 44px;
margin-bottom: 20px;
}
} main.blog .additional-links a + a {
margin-top: 15px;
} .detect-ie main.blog .content a,
.detect-ie main.blog h2,
.detect-ie main.blog h3,
.detect-ie main.blog h4,
.detect-ie main.blog h5,
.detect-ie main.blog h6 {
max-width: 100%;
}