Template:Vilnius-Lithuania/CSS/Team

@font-face {

 font-family: "lato-medium";
 src: url(../fonts/Lato-Medium.ttf) format("truetype");

} @font-face {

 font-family: "lato-heavy";
 src: url(../fonts/Lato-Heavy.ttf) format("truetype");

} body, html {

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

}

.introContainer {

 flex-direction: column-reverse;
 justify-content: space-between;

} .introContainer h1 {

 position: absolute;
 text-align: end;
 top: 10vh;

} .introContainer h1.other {

 top: 12vh;

} .introContainer::before {

 content: unset;
 display: none;
 background-image: unset;

} .introContainer span {

 position: absolute;
 color: #FAFAFC;
 top: 7vw;
 width: 60vw;
 height: 60vw;
 background-attachment: unset;
 overflow: hidden;
 font-weight: bold;

} @media (min-aspect-ratio: 1/1) {

 .introContainer span {
   top: 7vh;
   width: 60vh;
   height: 60vh;
 }

} .introContainer span.novideo video {

 display: none;

} .introContainer span video {

 width: 100%;
 height: 100%;

} .introContainer button.introVideoPlay {

 position: absolute;
 top: 52vw;
 left: 20vw;
 width: 64px;
 height: 64px;
 border: unset;
 display: none;
 background-image: url(../assets/team/play.svg);
 background-size: 50% 50%;
 background-repeat: no-repeat;
 background-position: 58% 50%;
 cursor: pointer;
 padding: 0;
 border-radius: 1000px;
 background-color: #6281EF;

} @media (min-aspect-ratio: 1/1) {

 .introContainer button.introVideoPlay {
   top: 52vh;
   left: calc(50vw - 30vh);
 }

} .introContainer button.introVideoPlay.novideo {

 display: block;

} .introContainer .memberDiv {

 position: absolute;
 left: 60vw;
 top: 40vh;
 color: #FAFAFC;

} .introContainer .memberDiv h2, .introContainer .memberDiv h3, .introContainer .memberDiv h4 {

 margin: 8px 0;

} .introContainer .memberDiv h2 {

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

} .introContainer .memberDiv h3 {

 font-size: 1.5em;
 font-weight: normal;
 text-transform: uppercase;

} .introContainer .memberDiv h4 {

 font-size: 1.5em;
 font-weight: normal;

} @media (max-width: 480px) {

 .introContainer .memberDiv {
   left: 5vw;
 }

} .introContainer .bubbleList {

 width: 100%;
 display: flex;
 flex-direction: row;
 align-items: center;
 justify-content: center;
 flex-wrap: wrap;

} .introContainer .bubbleList span {

 cursor: pointer;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 background-color: #6281EF;
 border-radius: 10vw;
 position: static;
 width: 7vh;
 height: 7vh;
 margin: 12px;
 transform: scale(1);
 transition: transform 0.3s;

} @media (min-aspect-ratio: 1/1) {

 .introContainer .bubbleList span {
   width: 7vw;
   height: 7vw;
 }

} .introContainer .bubbleList span:hover {

 transform: scale(1.2);

}

main {

 margin-top: 0;
 padding-top: 50px;

}