diff --git a/corntv/footer.css b/corntv/footer.css new file mode 100644 index 0000000..76a5457 --- /dev/null +++ b/corntv/footer.css @@ -0,0 +1,11 @@ +footer { + font-family: 'Segoe UI', sans-serif; + position: fixed; + bottom: 0; + width: 100%; + text-align: center; + background-color: #000000B3; + padding: 0.6em 0; + color: #FFFFFF; + font-size: 0.9em; +} diff --git a/corntv/index.html b/corntv/index.html new file mode 100644 index 0000000..37f4a36 --- /dev/null +++ b/corntv/index.html @@ -0,0 +1,33 @@ + + + + + + + + + + CornTV Homepage + + + + + + +
+
+
+ +
+
+
+

CornTV is a Private Cable Analog TV Channel running on Channel 10 VHF!

+

+
+

Back to Main Site!

+

+ +
+ + + diff --git a/corntv/styles.css b/corntv/styles.css new file mode 100644 index 0000000..bf162ae --- /dev/null +++ b/corntv/styles.css @@ -0,0 +1,144 @@ +html, body { + font-family: 'Orbitron', sans-serif; + margin: 0; + padding: 0; + background-color: #333; + text-align: center; + color: white; + overflow-x: hidden; /* Prevent horizontal scrolling */ +} + +.container { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + min-height: 100vh; + padding: 1.25em; + box-sizing: border-box; + width: 100%; +} + +header { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + margin-bottom: 1.875em; + width: 100%; /* Ensure header takes full width */ + padding: 0 1em; /* Add horizontal padding */ +} + +.logo-container { + width: 80%; + max-width: 44em; + display: flex; + justify-content: center; /* Center logo inside the container */ + margin: 0 auto; /* Center container itself */ +} + +.mainlogo, .sublogo { + max-width: 100%; /* Scale down if necessary */ + height: auto; +} + +h1 { + font-size: 2em; + margin-top: 1em; + margin-bottom: 0.1em; +} + +h2 { + font-size: 1.6em; + margin-top: 1em; + margin-bottom: 0.1em; +} + +main { + display: flex; + flex-wrap: wrap; + gap: 2em; + justify-content: center; +} + +.app-icon-link { + text-decoration: none; +} + +.app-icon { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + padding: 1.875em; /* 30px / 16px = 1.875em */ + border-radius: 0.9375em; /* 15px / 16px = 0.9375em */ + transition: transform 0.3s; + width: 15em; /* 250px / 16px = 15.625em */ + height: 15em; /* 250px / 16px = 15.625em */ + color: white; +} + +.app-icon img { + width: 6.25em; /* 100px / 16px = 6.25em */ + height: 6.25em; /* 100px / 16px = 6.25em */ +} + +.app-icon p { + margin-top: 1.25em; /* 20px / 16px = 1.25em */ + font-size: 1.5em; +} + +.app-icon:hover { + transform: scale(1.1); +} + +.app-icon.red { + background: linear-gradient(145deg, #f25555, #c91e1e); +} + +.app-icon.orange { + background: linear-gradient(145deg, #f2b06f, #fc771e); +} + +.app-icon.blue { + background: linear-gradient(145deg, #1a94b8, #2c67f2); +} + +.app-icon.green { + background: linear-gradient(145deg, #74D680, #378B29); +} + +.app-icon.yellow { + background: linear-gradient(145deg, #fcf06c, #fcea2a); + color: black; +} + +.app-icon.purple { + background: linear-gradient(145deg, #c29ae0, #8459a5); +} + +.app-icon.contact { + background: linear-gradient(145deg, #ffffff, #dbdbdb); + color: black; +} + +/* Responsive Styles */ +@media (max-width: 768px) { + .logo-container { + width: 90%; + } + + .mainlogo, .sublogo { + max-width: 90%; /* Scale down logo */ + } +} + +@media (max-width: 480px) { + .logo-container { + width: 95%; + } + + .mainlogo, .sublogo { + max-width: 80%; /* Scale down more for smaller screens */ + } +} diff --git a/images/corntvlogo.png b/images/corntvlogo.png new file mode 100644 index 0000000..fb79029 Binary files /dev/null and b/images/corntvlogo.png differ diff --git a/index.html b/index.html index 216d0e6..e89be18 100644 --- a/index.html +++ b/index.html @@ -33,6 +33,15 @@ OpenWebRX WebSDR + + +