Difference between revisions of "Template:Vilnius-Lithuania/CSS/Engineering"

(Created page with "body, html { margin: 0; padding: 0; color: #222222; font-family: "lato-regular"; } .introContainer { height: 100vh; width: 100%; background-color: #121212; po...")
 
Line 24: Line 24:
 
   height: 70vh;
 
   height: 70vh;
 
   width: auto;
 
   width: auto;
 +
max-width: 80vw;
 
}
 
}
 
.introContainer #dtp-cycle svg {
 
.introContainer #dtp-cycle svg {

Revision as of 09:04, 11 October 2020

body, html {

 margin: 0;
 padding: 0;
 color: #222222;
 font-family: "lato-regular";

}

.introContainer {

 height: 100vh;
 width: 100%;
 background-color: #121212;
 position: fixed;
 z-index: 2;

} .introContainer .intro-section {

 display: flex;
 justify-content: center;
 align-items: center;

} .introContainer #engineering-cycle {

 height: 100%;

} .introContainer #engineering-cycle svg {

 height: 70vh;
 width: auto;

max-width: 80vw; } .introContainer #dtp-cycle svg {

 height: 80vh;
 width: auto;

} .introContainer #dtp-cycle svg ellipse, .introContainer #dtp-cycle svg tspan {

 cursor: pointer;

} .introContainer svg .A {

 stroke: #6281ef;

} .introContainer svg .B {

 fill: #121212;

} .introContainer svg .C {

 font-family: "montserrat-light", sans-serif;

} .introContainer svg .D {

 font-family: "montserrat-bold", sans-serif;

} .introContainer svg .E {

 fill: #fafafc;

} .introContainer svg .F {

 stroke-width: 5;

} .introContainer svg .G {

 font-size: 31px;

} .introContainer svg .H {

 font-weight: 300;

} .introContainer svg .I {

 stroke-linejoin: round;

} .introContainer svg .J {

 stroke-width: 9;

} .introContainer svg .K {

 fill: none;

} .introContainer svg .L {

 stroke: #fafafc;

} .introContainer svg .M {

 stroke-width: 3;

} .introContainer svg .N {

 font-size: 38px;

}

.spacer {

 height: 100vh;
 background-color: #121212;
 position: absolute;
 top: 100vh;
 width: 100vw;
 z-index: 1;

}

main {

 height: fit-content;
 background-color: #fafafc;
 position: absolute;
 top: 200vh;
 width: 100vw;
 z-index: 3;
 font-family: "montserrat-light", sans-serif;
 padding-bottom: 30vh;

} main section {

 display: flex;
 justify-content: center;
 flex-direction: column;
 align-items: center;
 width: 80vw;
 margin: 0 auto;

} main section h1 {

 text-transform: uppercase;
 font-size: 2em;

} main section .section-title h1 {

 margin-block-end: 0em;

} main section .section-title svg {

 width: 100px;

} main section .section-title .right {

 display: block !important;

} main section .iteration-title {

 font-family: "montserrat-black", sans-serif;

} main section .row {

 display: flex;
 width: 100%;

} main section .row .left, main section .row .right {

 display: flex;
 width: 40%;
 align-items: center;
 padding: 20px 0px;

} main section .row p {

 margin-block-end: 0em;
 margin-block-start: 0em;

} main section .row .line-divider {

 display: flex;
 width: 20%;
 justify-content: center;
 align-items: center;

} main section .row .line-divider.nonCenter {

 align-items: initial;

} main section .row .line-divider .line {

 width: 7px;
 background-color: #6281ef;
 height: 100%;

} main section .row .line-divider .circle {

 width: 35px;
 height: 35px;
 border-radius: 40px;
 background-color: #FFD762;
 position: absolute;
 display: flex;
 align-items: center;
 justify-content: center;
 font-family: "montserrat-black", sans-serif;

} main section .row .line-divider .circle.top {

 margin-top: -15px;
 width: 20px;
 height: 20px;

} main section .row .left {

 justify-content: flex-end;
 text-transform: uppercase;

}

.milkWave svg {

 margin-top: -60px;

} .milkWave svg path {

 fill: #fafafc;

}