*{
	text-decoration: none;
	box-sizing: border-box;
	outline: none;
	border: none;
	margin: 0;
	padding: 0;
	min-width: 0;
}

:root{
    --background: #333;
    --color-bg: #78b66e;
    --color-text: #000;
    --color-text2: #fff;
    --colorButton-text: #fff;
    --color-link: #000000;
    --color-link-hover: ;
    --color-button-bg: #8b8b8b;

    --transition-ease-5s: all 0.5s ease;
    --shadow-blue: 30px 30px 200px #5c5ca0,-30px -30px 200px #3333ff;
}

body{
    background: var(--background);
    
}

.main{
    width: 70%;
    height: 100vh;
    margin: auto;
}

.section-container{
    padding: 100px 0px;
    height: 100%;
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    grid-template-rows: repeat(auto-fit, minmax(150px, 1fr));
}

a {	
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    color: var(--color-text2);
}

.article--box{
    border-radius: 20px;
    background: var(--color-bg);
    transition: 500ms;
    box-shadow: 10px 10px 10px 0px #00000052;
    
    a{
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        text-decoration: none;
    }
    
    &:hover{
        scale: 1.05;
        box-shadow: 0px 0px 10px 0px #ffffff52;
    }
}