:root{
    --background-color: #d7e9ed;
    --elements-color: #72b2c3;
    --wintermint: #98d0c8;
    --neptunes-Realm:#91c4d4;
    --endless-horizon:#b4d6f9;

    --Deep-Sea-Teal: #0C3846;
    --Arctic-Ocean-Blue: #2A7387;
    --Cerulean-Ripple: #5EB0C8;
    --Icy-Glaze: #9FD3E3;
    --Frost-White: #E4F4F8 ;
}

a{
    text-decoration: none;
}

body{
    background-color: var(--Frost-White);
}

.main-screen{
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
}

.links-header{
    color: var(--Deep-Sea-Teal);

    
}

h2.links-header{
        margin-left: 20px;
}

a {
    text-decoration: none;
}

ul {
    list-style: none;
    padding: 0;
}

.Links {
    display: inline-block;
    width: 90px;
    margin: 1vh;
    padding: 0;
    background-color: var(--Arctic-Ocean-Blue);
    border-radius: 10%;
    text-align: center;
}

.Links a {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: 1.8vh 2vh;
    color: var(--Icy-Glaze);
}

.links-div{
    display: flex;
    margin-left: 40px;
}

.links-div p{
    margin: 0;
}

.Links:hover {
    background-color: var(--Deep-Sea-Teal);
}

.Links a:focus-visible {
    outline: 3px solid var(--Cerulean-Ripple);
    outline-offset: 3px;
}

button, input[type="submit"], input[type="reset"] {
	background: none;
	color: inherit;
	border: none;
	padding: 0;
	font: inherit;
	cursor: pointer;
	outline: inherit;
}