2022-05-05 17:52:51 -04:00
<!DOCTYPE html>
< html lang = "en" >
< head >
< meta charset = "utf-8" >
< meta name = "viewport" content = "width=device-width, initial-scale=1, shrink-to-fit=no" >
<!-- TODO: Description -->
< meta name = "description" content = "" >
< meta name = "author" content = "Zak Timson" >
< title > LEGIO · XXX< / title >
2022-05-05 23:53:20 -04:00
< link href = "img/capricorn.png" rel = "icon" type = "image/png" >
2022-05-05 17:52:51 -04:00
< link href = "css/bootstrap.css" rel = "stylesheet" >
< link href = "css/index.css" rel = "stylesheet" >
< link href = "https://use.fontawesome.com/releases/v6.1.1/css/all.css" rel = "stylesheet" >
< script src = "js/bootstrap.js" > < / script >
< / head >
< body data-bs-spy = "scroll" data-bs-target = "#navbar" >
< nav id = "navbar" class = "navbar fixed-top navbar-expand-lg navbar-dark bg-black px-3 border-bottom border-white" >
2022-05-05 23:53:20 -04:00
< div >
< a class = "navbar-brand d-flex align-items-center" href = "#" >
< img src = "img/capricorn.png" alt = "Capricorn" height = "45" width = "45" >
< div class = "px-2" > LEGIO · XXX< / div >
< / a >
< / div >
2022-05-05 17:52:51 -04:00
< button class = "navbar-toggler" type = "button" data-bs-toggle = "collapse" data-bs-target = "#navbarSupportedContent" aria-controls = "navbarSupportedContent" aria-expanded = "false" aria-label = "Toggle navigation" >
< span class = "navbar-toggler-icon" > < / span >
< / button >
< div class = "collapse navbar-collapse" id = "navbarSupportedContent" >
< div class = "me-auto" > < / div >
< ul class = "navbar-nav mb-2 mb-lg-0" >
< li class = "nav-item" >
< a class = "nav-link" href = "#about" > About< / a >
< / li >
< li class = "nav-item" >
< a class = "nav-link" href = "#gallery" > Gallery< / a >
< / li >
< li class = "nav-item" >
< a class = "nav-link" href = "#contact" > Contact< / a >
< / li >
< li class = "nav-item dropdown" >
< a id = "learnNavbar" class = "nav-link dropdown-toggle" href = "#" role = "button" data-bs-toggle = "dropdown" > Learn< / a >
< ul class = "dropdown-menu dropdown-menu-end dropdown-menu-dark bg-black border-1 border-white" aria-labelledby = "learnNavbar" >
< li > < a class = "dropdown-item" href = "#" > Legio XXX< / a > < / li >
< li > < a class = "dropdown-item" href = "#" > Legion Structure< / a > < / li >
< li > < a class = "dropdown-item" href = "#" > Legionary Camp< / a > < / li >
2022-05-05 23:53:20 -04:00
< li > < a class = "dropdown-item" href = "#" > Legion HQ< / a > < / li >
2022-05-05 17:52:51 -04:00
< li > < a class = "dropdown-item" href = "#" > Equipment< / a > < / li >
< li > < a class = "dropdown-item" href = "#" > Basic Training< / a > < / li >
< li > < hr class = "dropdown-divider" > < / li >
< li > < a class = "dropdown-item" href = "#" > Resources< / a > < / li >
< / ul >
< / li >
< li class = "nav-item" >
< a id = "eventsNavbar" class = "nav-link dropdown-toggle" href = "#" role = "button" data-bs-toggle = "dropdown" > Events< / a >
< ul class = "dropdown-menu dropdown-menu-end dropdown-menu-dark bg-black border-1 border-white" aria-labelledby = "eventsNavbar" >
< li > < a class = "dropdown-item" href = "#" > Calendar< / a > < / li >
< li > < hr class = "dropdown-divider" > < / li >
< li > < a class = "dropdown-item" href = "#" > Castra Aestiva< / a > < / li >
< li > < a class = "dropdown-item" href = "#" > Castra Hiberna< / a > < / li >
< li > < hr class = "dropdown-divider" > < / li >
< li > < a class = "dropdown-item" href = "#" > Rules< / a > < / li >
< / ul >
< / li >
< / ul >
< / div >
< / nav >
< header >
< div class = "w-100 h-100 d-flex flex-column align-items-center justify-content-center" >
2022-05-05 23:53:20 -04:00
< img src = "img/spqr.png" class = "mt-5" alt = "SPQR" height = "250" width = "250" style = "filter: drop-shadow(2px 4px 6px black);" >
2022-05-05 17:52:51 -04:00
< div >
< a href = "#about" class = "text-white" >
2022-05-05 23:53:20 -04:00
< i class = "fa fa-angle-double-down fa-4x" style = "filter: drop-shadow(2px 4px 6px black);" > < / i >
2022-05-05 17:52:51 -04:00
< / a >
< / div >
< / div >
< / header >
2022-05-05 23:53:20 -04:00
< section id = "about" class = "d-flex flex-column align-items-center bg-black text-white" style = "height: 100vh" >
< div class = "mb-5 py-5" > <!-- Spacer --> < / div >
< h2 > About< / h2 >
< div class = "container" >
< div class = "d-flex" >
< div class = "p-1 text-center" style = "border: solid 5px white;" >
< div class = "p-1" style = "border: dashed 5px white;" >
< div class = "p-3" style = "border: solid 5px white;" >
< h3 class = "text-nowrap" > LEGIO · XXX< / h3 >
< img src = "img/capricorn.png" class = "my-3" alt = "capricorn" height = "150em" width = "150em" >
< h4 class = "text-nowrap" > VLPIA · VICTRIX< / h4 >
< / div >
< / div >
< / div >
< div >
< p >
Legio XXX is a North American Roman re-enactment group that has been active since 2004. Its members represent a cross between living history enthusiasts and edutainers.
< / p >
< / div >
< div >
< img src = "/img/trajan.png" height = "75vh" width = "auto" >
< / div >
< / div >
2022-05-05 17:52:51 -04:00
< / div >
< / section >
2022-05-05 23:53:20 -04:00
< section id = "gallery" class = "d-flex flex-column align-items-center bg-white" style = "height: 100vh" >
< div class = "mb-5 py-5" > <!-- Spacer --> < / div >
2022-05-05 17:52:51 -04:00
< h2 > Gallery< / h2 >
< / section >
2022-05-05 23:53:20 -04:00
< section class = "bg-white" >
< img src = "/img/formation.png" width = "100%" height = "auto" >
< / section >
< section id = "contact" class = "d-flex flex-column align-items-center py-5 bg-black text-white" style = "min-height: 100vh" >
< div class = "mb-5 py-5" > <!-- Spacer --> < / div >
< h2 > Contact< / h2 >
< div class = "w-100 px-5" style = "max-width: 600px" >
< form class = "text-start" >
< div class = "mb-3" >
< label class = "text-white w-100" for = "email" > Email< / label >
< input id = "email" class = "form-control w-100.0" type = "email" placeholder = "username@example.com" >
< / div >
< div class = "mb-3" >
< label class = "text-white w-100" for = "subject" > Subject< / label >
< select id = "subject" class = "form-control w-100.0" >
< option > Castra Aestiva/Castra Hiberna< / option >
< option > Re-enactment Inqueries< / option >
< option > Other< / option >
< / select >
< / div >
< div class = "mb-3" >
< label class = "text-white w-100" for = "message" > Message< / label >
< textarea id = "message" class = "form-control w-100" rows = "5" > < / textarea >
< / div >
< div class = "d-flex justify-content-between align-items-center" >
< div class = "d-inline" >
< input type = "checkbox" class = "form-check-input" id = "copy" >
< label class = "form-check-label" for = "copy" > Send me a copy< / label >
< / div >
< button class = "btn btn-primary" > Send< / button >
< / div >
< / form >
< / div >
2022-05-05 17:52:51 -04:00
< / section >
2022-05-05 23:53:20 -04:00
< footer class = "bg-dark text-center text-white py-2" >
< p class = "m-0" >
Copyright © Legio XXX 2022 | All Rights Reserved
< br >
Created by < a href = "https://zakscode.com" > Zak Timson< / a >
< / p >
< / footer >
2022-05-05 17:52:51 -04:00
< / body >
< / htmL >