Difference between revisions of "Template:Vilnius-Lithuania/index.css"

Line 44: Line 44:
  
 
#intro-page #intro #title::after {
 
#intro-page #intro #title::after {
content: 'project X';
+
content: 'flavoflow';
 
position: absolute;
 
position: absolute;
 
color: transparent;
 
color: transparent;
Line 51: Line 51:
 
text-stroke-color: rgba(255, 255, 255, 0.2);
 
text-stroke-color: rgba(255, 255, 255, 0.2);
 
text-stroke-width: 1px;
 
text-stroke-width: 1px;
font-size: 9em;
+
font-size: 12em;
text-transform: uppercase;
+
font-family: 'raleway';
font-family: 'lato-heavy';
+
font-weight: 600;
 
transform: translate(-52%, -69%);
 
transform: translate(-52%, -69%);
 
top: 50%;
 
top: 50%;
Line 90: Line 90:
 
#intro-page #intro h1 {
 
#intro-page #intro h1 {
 
color: #FAFAFC;
 
color: #FAFAFC;
font-size: 9em;
+
font-size: 12em;
 +
    font-family: 'raleway';
 +
    text-transform: lowercase;
 +
    font-weight: 600;
 
}
 
}
  

Revision as of 14:26, 20 August 2020

.container { width: 100%; height: calc(100vh - 14px) }

  1. intro-page {

background-color: #121212; }

  1. intro-header {

height: 100vh }

  1. intro-header svg {

height: 90%; }

  1. intro-page #intro-header {

width: 100%; margin: 0 auto; position: absolute; z-index: 4; pointer-events:none }

  1. intro-page #intro {

z-index: 4; height: calc(100vh - 14px); width: 100%; top: 0; position: absolute; pointer-events:none }

  1. text-wrapper {

position: absolute; top: 50%; left: 50%; transform: translate(-50%, 20%); width: 100%; z-index: 4; pointer-events: none }

  1. intro-page #intro #title::after {

content: 'flavoflow'; position: absolute; color: transparent; -webkit-text-stroke-color: rgba(255, 255, 255, 0.2); -webkit-text-stroke-width: 1px; text-stroke-color: rgba(255, 255, 255, 0.2); text-stroke-width: 1px; font-size: 12em; font-family: 'raleway'; font-weight: 600; transform: translate(-52%, -69%); top: 50%; left: 50%; width: -webkit-fit-content; }

  1. desc-wrapper {

padding-top: 30px; display: block; width: fit-content; margin: 0 auto; }

  1. center-desc {

display: flex; justify-content: center; width: -webkit-fit-content; }

  1. desc-wrapper span {

color: white; font-family: "lato-regular"; font-size: 3em; text-align: right; }

.container h1 { text-transform: uppercase; font-size: 70px; font-family: "lato-heavy"; text-align: center; margin: 0; }

  1. intro-page #intro h1 {

color: #FAFAFC; font-size: 12em;

   font-family: 'raleway';
   text-transform: lowercase;
   font-weight: 600;

}

  1. intro-page #intro #lower {

color: transparent; stroke-color: rgba(255, 255, 255, 0.4); transform: translate(-0.3em, -0.8em); }

  1. bubbles-container {

height: calc(100vh - 14px); position: absolute; width: 100%; box-sizing: border-box;

}

  1. problem-page, #links-page {

background-color: #FAFAFC; }

  1. problem-page #problem-header h1,
  2. links-page #links-header h1 {

color: #6281EF }

  1. solution-page{

background-color: #121212; }

  1. solution-page #solution-header h1{

color: #FFC43B }

@media (max-width:768px) { #intro-page #intro h1 { font-size: 4em; } #intro-page #intro #title::after { font-size: 4em; transform: translate(-53%, -130%); } .content-header { padding-top: 50px } .content-index h1 { font-size: 3.3em; } }