* { font-family: Montserrat, Ubuntu, Lucida Grande, Helvetica Neue, DejaVu Sans, FreeSans, Liberation Sans, Droid Sans, sans; } header { align-items: center; display: flex; height: 10vh; background-color: deeppink; margin-bottom: 1vh; } /* #h1 { # font-size: 150%; #} #h2 { # font-size: 120%; #} #p { # font-size: 75%; #} */ footer{ color: darkgray; font-size: 3vw; } .banner { background-image: url("static/tresorImAll.webp"); width: 100%; height: 90vh; background-size: cover; display: flex; justify-content: center; align-items: center; } .withinBanner { display:inline-block; } .linkContainer { display: grid; grid-template-columns: auto auto auto auto; width: 100%; } .pLink { font-size: 4vh; color: white; } .bannerHeader { font-size: 9vh; color: black; } .bannerSubtext { font-size: 6vh; color: black; } .glow { color: #fff; text-align: center; text-shadow: 0 0 20px #e60073; } /* .glow { color: #fff; text-align: center; text-shadow: 0 0 20px #e60073; #animation: glow 1s ease-in-out infinite alternate; } */ @-webkit-keyframes glow { from { text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #e60073, 0 0 40px #e60073; } to { text-shadow: 0 0 20px #fff, 0 0 30px #ff4da6, 0 0 40px #ff4da6, 0 0 50px #ff4da6; } } @media only screen and (max-width: 500px) { [class*="bannerHeader"] { font-size: 7vh; color: #fff; } .bannerSubtext { font-size: 4vh; color: #fff; } [class*="infoImgDiv"] { grid-row-start: 1; grid-row-end: 1; justify-content: center; justify-self: center; display: flex; } [class*="infoDiv"] { grid-row-start: 2; grid-row-end: 2; } [class*="infoContainer"] { display: grid; grid-template-columns: auto; } [class*="infoImg"] { width: 60vw; grid-row-start: 1; } .linkContainer { grid-template-columns: auto auto; } .info { font-size: 6vw; } .infoHeader { font-size: 9vw; } .grid-container { display: grid; grid-template-columns: auto; } [class*="model"] { height: 40vh; width: 90vw; } [class*="model1"] { height: 40vh; width: 90vw; } } .infoImg { width: 30vw; } .infoContainer { margin-left: 10vw; margin-right: 10vw; display: grid; grid-template-columns: auto auto; } .infoImgDiv { width: 30vw; display: flex; justify-content: center; align-items: center; justify-self: none; } .infoDiv { display: grid; width: 50vw; text-align: justify; justify-content: center justify-self: none; } .info { font-size: 2vw; } .infoHeader { font-size: 3vw; margin-top: 5vw; margin-bottom: 0vw; color: deeppink; } .model0 { width: 50vw; height: 100vh; } .model1 { width: 50vw; height: 100vh; } .grid-container { display: grid; grid-template-columns: auto auto; }