diff --git a/parcela/KATERINE DM/index.html b/parcela/KATERINE DM/index.html new file mode 100644 index 0000000..522b715 --- /dev/null +++ b/parcela/KATERINE DM/index.html @@ -0,0 +1,153 @@ + + + + 🟄 virreina 🟄 + + + + + + + + + + + + + + + + + + + + + + +
+ + +
+ +
+ RESIDENCIES + PARCELA + + ABOUT +
+
´ + + + + +
+ +
+ + + + + + +
+ + + + + + +
+ +

PARCELA

+ +
+ + + + + + + + + + + + + + + + +
+
+ +
+
+
+ +
+
+ +
+
+ +
+ + + + + + + + + + + \ No newline at end of file diff --git a/parcela/KATERINE DM/movil/index.html b/parcela/KATERINE DM/movil/index.html new file mode 100644 index 0000000..c9dff6b --- /dev/null +++ b/parcela/KATERINE DM/movil/index.html @@ -0,0 +1,59 @@ + + + + 🟄 virreina 🟄 + + + + + + + + + + + + + + + + + + +
+ + + 2024 | KATERINE DM | 🇨🇦 | 45° 30' 31" N 73° 33' 42" W | JOURNÉE EN VILLE + + + VRN + + +
+ + + + + banner + + banner + + banner + + banner + + + + + + + \ No newline at end of file diff --git a/parcela/KATERINE DM/movil/style.css b/parcela/KATERINE DM/movil/style.css new file mode 100644 index 0000000..cef3e7f --- /dev/null +++ b/parcela/KATERINE DM/movil/style.css @@ -0,0 +1,108 @@ + +html{ + overflow-x: auto; + overflow-y: hidden; + } + + + ::-webkit-scrollbar { + display: none; + } + * { + -ms-overflow-style: none; + scrollbar-width: none; + } + + + + /* project */ + .BCK1 { + position: absolute; + left: -100%; + width: 3500%; + height: 100%; + z-index: -0; + object-fit: cover; + } + + .BCK2 { + position: absolute; + left: -100%; + width: 3500%; + height: 100%; + z-index: 10; + object-fit: cover; + } + + .BCK3 { + position: absolute; + left: -100%; + width: 3500%; + height: 100%; + z-index: 50; + object-fit: cover; +} + +.BCK4 { + position: absolute; + left: -100%; + width: 3500%; + height: 100%; + z-index: 100; + object-fit: cover; +} + + +header{ + width: 100%; + padding: 15px; + position: fixed; + top: 0%; + left: 0%; + z-index: 100; + background-color: whitesmoke; +} + + +marquee{ + border-collapse: collapse; + position: fixed; + top: 0%; + left: 0%; + z-index: 100; + padding: 20px; + text-align: center justify; + background-color: black; + border: none; + color: rgb(255, 255, 255); + font-size: 2vh; + font-family: 'Dia', helvetica, arial, sans-serif; + white-space: pre; + line-height: 1vh; + letter-spacing: auto; +} + + +a{ + text-decoration: none; + color: rgb(255, 255, 255); +} + +a:hover{ + text-decoration: underline; + color: rgb(255, 255, 255); +} + +.estrellita{ + position: fixed; + top: 0%; + left: 0%; + z-index: 100; + padding: 10px; + text-align: center justify; + background-color: black; +} + + + + diff --git a/parcela/KATERINE DM/style.css b/parcela/KATERINE DM/style.css new file mode 100644 index 0000000..e698d63 --- /dev/null +++ b/parcela/KATERINE DM/style.css @@ -0,0 +1,305 @@ +html{ + overflow-x: auto; + overflow-y: hidden; + } + + + ::-webkit-scrollbar { + display: none; + } + * { + -ms-overflow-style: none; + scrollbar-width: none; + } + + + body { + background-image: url("../../assets/fondo.png"); + /*background-color: rgb(195, 195, 195);*/ + background-size: contain; + background-position: center center; + background-repeat: no-repeat; + background-attachment: fixed; + background-size: cover; + height: 100%; + font-family: 'Dia', helvetica, arial, sans-serif; + font-family: 'Gilda Display', serif; + font-family: 'Manrope', sans-serif; + font-family: 'Noto Sans Mono', monospace; + font-family: 'Playfair Display', serif; + font-style: normal; + font-size: 0.8vw; + color: none; + + + } + + + header{ + background-color: white; + width: 100%; + padding: none; + left: 0%; + } + + + + /* reloj */ + .clock { + position: fixed; + padding: 2%; + align-items: center; + top: 0%; + left: 45%; + width: 100%; + height: 100%; + z-index: 100; + pointer-events: none; + overflow: hidden; + color: black; + font-size: .85vw; + font-family: 'Dia', helvetica, arial, sans-serif; + background-color: none; + } + + + + + + .seccion { + position: fixed; + padding: 2%; + align-items: center; + top: -1%; + left: 90%; + width: 50%; + height: 100%; + z-index: 1000; + overflow: hidden; + color: black; + font-size: 1vw; + font-family: 'Manrope', sans-serif; + background-color: none; + } + + + + /* banner ID */ + .banner { + float: left; + padding-left: 1%; + position: fixed; + top: 5%; + right: 0%; + height: fit-content; + max-height: 100%; + z-index: 100; + background-color: white; + } + .banner:hover { + filter: drop-shadow(0 0 .5rem rgb(255, 251, 0)); + } + .hover { + pointer-events: none; + display: inline-block; + position: absolute; + } + .ID { + display: none; + width: 70%; + z-index: 100000; + } + .tituloprojecto:hover+.ID { + display: inline-block; + position:absolute; + top: 16%; + left: -680%; + width: fit-content; + max-height: 100%; + z-index: 100000; + } + + + + + + /* project */ + + .scroll { + position: relative; + width: 100vw; + overflow: hidden; + z-index: 1; + margin: 0; + padding: 0; + } + + .m-scroll { + overflow: hidden; + height: 100%; + white-space: nowrap; + animation: scrollText 10s infinite linear; + margin: 0; + font-size: 0; + display: flex; + justify-content: space-between; + width: 250%; + } + + span { + display: inline-block; + margin: 0; + padding: 0; + color: black; + } + + @keyframes BCK1 { + from { + transform: translateX(0%); + } + to { + transform: translateX(-50%); + } + } + + + /*project*/ + .BCK1 { + position: absolute; + top: 10%; + left: 00%; + width: 700%; + height: 100%; + z-index: -0; + object-fit: cover; + } + + .BCK2 { + position: absolute; + top: 10%; + left: 00%; + width: 700%; + height: 100%; + z-index: 10; + object-fit: cover; + } + + .BCK3 { + position: absolute; + top: 10%; + left: 00%; + width: 700%; + height: 100%; + z-index: 50; + object-fit: cover; +} + +.BCK4 { + position: absolute; + top: 10%; + left: 00%; + width: 700%; + height: 100%; + z-index: 100; + object-fit: cover; +} + + + + + + + + + + /* Dropdown Button */ + .dropbtn { + background-color: transparent; + color: grey; + padding-left: 5px; + font-size: 16px; + height: fit-content; + max-height: 30px; + position: inherit; + border: none; + border-radius: 8px; + font-size: 1.5vw; + z-index: 1000; + position: fixed; + } + + /* The container
- needed to position the dropdown content */ + .dropdown { + position: relative; + display: inline-block; + } + + /* Dropdown Content (Hidden by Default) */ + .dropdown-content { + display: none; + position: absolute; + background-color: none; + font-family: 'Manrope', sans-serif; + color: #000; + min-width: 160px; + box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); + z-index: 1; + } + + /* Links inside the dropdown */ + .dropdown-content a { + color: black; + font-family: 'Manrope', sans-serif; + padding-left: 20px; + text-decoration: none; + display: block; + } + + /* Change color of dropdown links on hover */ + .dropdown-content a:hover { + background-color: #ddd; + color: black; + font-family: 'Manrope', sans-serif; + } + + + + /* Show the dropdown menu on hover */ + .dropdown:hover .dropdown-content { + display: block; + color: black; + font-family: 'Playfair Display', serif; + text-shadow: 0 0 3px #000; + } + + /* Change the background color of the dropdown button when the dropdown content is shown + .dropdown:hover .dropbtn { filter: drop-shadow(0 0 .5rem rgb(0, 255, 0)); + } + */ + + + /* unvisited link */ + a:link { + color: black; + } + + /* visited link */ + a:visited { + color: black; + } + + /* mouse over link */ + a:hover { + color: black; + font-family: 'Manrope', sans-serif; + text-shadow: 0 0 8px #000; + + } + + /* selected link */ + a:active { + color: black; + font-family: 'Manrope', sans-serif; + } + + \ No newline at end of file