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

Line 70: Line 70:
 
justify-content: center;
 
justify-content: center;
 
width: -webkit-fit-content;
 
width: -webkit-fit-content;
−
         opacity:0%
+
         opacity:0%;
 
         transition: 2s
 
         transition: 2s
 
}
 
}

Revision as of 11:36, 27 July 2020

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

  1. intro-page {

background-color: #121212; }

  1. intro-header {

height: 100vh }

  1. intro-header svg {

height: 50%; padding-top: 5em; }

  1. intro-page #intro-header {

width: 100%; margin: 0 auto; position: absolute; z-index: 1; }

  1. intro-page #intro {

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

  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: 'project X'; 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: 9em; text-transform: uppercase; font-family: 'lato-heavy'; transform: translate(-53%, -80%); 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; 

       opacity:0%;
       transition: 2s

}

  1. desc-wrapper span {

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

  1. test-width {

visibility: hidden }

.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: 9em; }

  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: 50%; position: absolute; bottom: 0px; width: 100%; box-sizing: border-box; 

       opacity:20%;
       transition: 5s

}

  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%); } #problem-header { padding-top: 50px } #problem-header h1 { font-size: 3.3em; } }