180 lines
2.7 KiB
CSS
180 lines
2.7 KiB
CSS
@font-face {
|
|
font-family: "LondonBetween";
|
|
src: url("../fonts/LondonBetween.woff") format("woff");
|
|
}
|
|
|
|
@font-face {
|
|
font-family: "JosefinSans-Regular";
|
|
src: url("../fonts/JosefinSans-Regular.woff") format("woff");
|
|
}
|
|
@font-face {
|
|
font-family: "Sofia-Pro-Light";
|
|
src: url("../fonts/SofiaProLight.woff") format("woff");
|
|
}
|
|
|
|
@font-face {
|
|
font-family: "Sofia-Pro-Medium";
|
|
src: url("../fonts/SofiaProMedium.woff") format("woff");
|
|
}
|
|
|
|
@font-face {
|
|
font-family: "SourceCodePro-Semibold";
|
|
src: url("../fonts/SourceCodePro-Semibold.woff") format("woff");
|
|
}
|
|
|
|
* {
|
|
padding: 0px;
|
|
margin: 0px;
|
|
background-color: #1a1a2e;
|
|
}
|
|
|
|
#content-center {
|
|
margin-left: 10%;
|
|
margin-right: 10%;
|
|
}
|
|
|
|
#header {
|
|
display: flex;
|
|
background-color: #1a1a2e;
|
|
width: auto;
|
|
height: 6rem;
|
|
|
|
}
|
|
|
|
.header {
|
|
background-color: #1a1a2e;
|
|
}
|
|
|
|
#header-logo-div {
|
|
width: 240px;
|
|
}
|
|
|
|
|
|
|
|
#header-logo {
|
|
width: auto;
|
|
height: 100%;
|
|
}
|
|
|
|
#header-links {
|
|
display: flex;
|
|
padding-top: 15%;
|
|
width: 260px;
|
|
}
|
|
|
|
#header-links-div {
|
|
margin-left: auto;
|
|
padding-right: 10rem;
|
|
}
|
|
|
|
.header-link {
|
|
color: #cfe8f6;
|
|
font-family: "LondonBetween";
|
|
font-size: 20px;
|
|
text-decoration: none;
|
|
transition: transform 0.2s;
|
|
}
|
|
|
|
|
|
|
|
.text-para-link:hover {
|
|
color: aquamarine;
|
|
font-size: 28px;
|
|
}
|
|
|
|
.text-para-link {
|
|
color: #cfe8f6;
|
|
font-size: 22px;
|
|
transition: font-size 0.2s;
|
|
}
|
|
#header-link-install {
|
|
margin-left: 10%;
|
|
}
|
|
#header-link-configure {
|
|
margin-left: 10%;
|
|
}
|
|
|
|
|
|
|
|
.header-link:hover {
|
|
transform: scale(1.3);
|
|
border-bottom: 2px solid aquamarine !important;
|
|
color: aquamarine;
|
|
}
|
|
|
|
#links-out {
|
|
margin-left: auto;
|
|
}
|
|
|
|
#github {
|
|
margin-top: 50%;
|
|
}
|
|
|
|
#link-github {
|
|
padding: 15px;
|
|
background-color: aquamarine;
|
|
font-family: "LondonBetween";
|
|
color: #1a1a2e;
|
|
text-decoration: none;
|
|
}
|
|
|
|
#github {
|
|
transition: transform 0.2s;
|
|
}
|
|
|
|
#github:hover {
|
|
transform: scale(1.2);
|
|
}
|
|
|
|
|
|
#div-img {
|
|
width: fit-content;
|
|
height: fit-content;
|
|
margin-left: 38%;
|
|
margin-top: 5%;
|
|
|
|
}
|
|
|
|
#div-img img {
|
|
width: 300px;
|
|
height: 300px;
|
|
}
|
|
|
|
#div-text {
|
|
width: fit-content;
|
|
height: fit-content;
|
|
margin-left: 35%;
|
|
}
|
|
|
|
#div-text p {
|
|
font-family: "Sofia-Pro-Medium";
|
|
color: #cfe8f6;
|
|
font-size: 18px;
|
|
}
|
|
|
|
#div-text h1 {
|
|
font-family: "JosefinSans-Regular";
|
|
color: #cfe8f6;
|
|
font-size: 32px;
|
|
margin-left: 60px;
|
|
}
|
|
|
|
#div-text a button {
|
|
padding: 20px;
|
|
padding-left: 80px;
|
|
padding-right: 80px;
|
|
margin-left:60px;
|
|
margin-top: 20px;
|
|
background-color: aquamarine;
|
|
border: none;
|
|
cursor: pointer;
|
|
font-family: "sofia-pro-medium";
|
|
font-size: 18px;
|
|
border-radius: 15px;
|
|
transition: background-color 0.2s;
|
|
}
|
|
|
|
#div-text a button:hover {
|
|
background-color: aqua;
|
|
}
|