@font-face {
    font-family: 'Inter 18pt';
    src: url('/css/fonts/Inter18pt-Light.eot');
    src: url('/css/fonts/Inter18pt-Light.eot?#iefix') format('embedded-opentype'),
        url('/css/fonts/Inter18pt-Light.woff2') format('woff2'),
        url('/css/fonts/Inter18pt-Light.woff') format('woff'),
        url('/css/fonts/Inter18pt-Light.ttf') format('truetype'),
        url('/css/fonts/Inter18pt-Light.svg#Inter18pt-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Inter 18pt';
    src: url('/css/fonts/Inter18pt-Regular.eot');
    src: url('/css/fonts/Inter18pt-Regular.eot?#iefix') format('embedded-opentype'),
        url('/css/fonts/Inter18pt-Regular.woff2') format('woff2'),
        url('/css/fonts/Inter18pt-Regular.woff') format('woff'),
        url('/css/fonts/Inter18pt-Regular.ttf') format('truetype'),
        url('/css/fonts/Inter18pt-Regular.svg#Inter18pt-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
.blogArticle img {
    max-width: 100%;
}
@font-face {
    font-family: 'Inter 18pt';
    src: url('/css/fonts/Inter18pt-Bold.eot');
    src: url('/css/fonts/Inter18pt-Bold.eot?#iefix') format('embedded-opentype'),
        url('/css/fonts/Inter18pt-Bold.woff2') format('woff2'),
        url('/css/fonts/Inter18pt-Bold.woff') format('woff'),
        url('/css/fonts/Inter18pt-Bold.ttf') format('truetype'),
        url('/css/fonts/Inter18pt-Bold.svg#Inter18pt-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}



*, *:before, *:after {-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;}
*,*:hover,*:focus{outline:none;}
html body .slider {margin-bottom: 2em;}
html body .slider img {max-width: 100%;border-radius: 5px;}
html body {margin: 0;padding: 0;font-family: 'Inter 18pt';font-weight: normal;}
html body .wrapper {max-width: 1400px;margin: 0 auto;padding: 1em;box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;}
html body .logo img {max-width: 100%;}
html body a {color: #6ab023;}
html body .navigation {
    display: flex;
    justify-content: space-between;
    padding: 2em 3em;
    background: #fff;
    border-radius: 8px 8px 0 0;
}
html body .navigation ul {list-style: none;margin: 0;padding: 0;display: flex;gap: 20px;align-items: center;}
html body .navigation ul li a {text-decoration: none;color: #111;font-weight: bold;font-size: 17px;}
html body .navigation ul li a.active {color: #6ab023;}
html body .content {background: #f5f5f5;padding: 4em;}
html body .links {display: flex;}
html body .background {height: 100vh;position: fixed;opacity: 0.1;width: 100%;z-index:-1;background: url('/images/slider_2.webp');background-size: cover;}

html body .footerRow {background: #f5f5f5;padding: 1em;margin-top: 10px;border-radius: 5px;}
html body .footerRow ul {list-style: none;margin: 0;padding: 0;}

.blogArticle {margin-bottom: 1em;background: #fff;padding: 1em;border-radius: 5px;}
.blogArticle .blogTopBar {color: #717171;font-weight: 300;font-size: 14px;}
.blogArticle .blogHeader {margin: 10px 0;font-weight: 600;}
.blogArticle .blogContent {margin-bottom: 1em;}
.blogArticle .blogLink {display: flex;justify-content: space-between;}

.blogArticle .blogLink {
    display: flex;
    justify-content: space-between;
    background: #629150;
    width: 200px;
    padding: 10px;
    margin-bottom: 1em;
    border-radius: 5px;
    color: #000;
    text-align: center;
    justify-content: center;
}
.blogArticle .blogLink a {font-weight: bold;text-decoration: none;color: #fff;}

.heading {
    padding: 1em;
    border-radius: 5px;
    background: #f5f5f5;
}
.distance {
    height: 13px;
}

.blogDiv {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
    container-type: inline-size;
    grid-template-rows: auto 1fr auto auto;
    gap: 1em;
}
.blogDiv > *:first-child {
    grid-column: span 2;
    grid-row: span 2;
}
@media (max-width: 1391.98px) {
    .blogArticle img {width: 100%;}
}
@media (max-width: 1200.98px) {
    .blogDiv > *:first-child {grid-column: unset;grid-row: unset;}
}
@media (max-width: 1015.98px) {
    html body .navigation {display: block;}
    html body .links {margin-top: 2em;}
}
@media (max-width: 730.98px) {
    html body .navigation ul {display: block;}
    html body .content,
    html body .navigation {padding: 1em 2em;}
}
@media (max-width: 485.98px) {
    .blogDiv {grid-template-columns: auto;}
}
@media (max-width: 450.98px) {
    html body .content,
    html body .navigation {padding: 1em 1em;}
}