From 9d53d8857eaa1c9405894a88ca75bc4657e42f35 Mon Sep 17 00:00:00 2001 From: msglm Date: Sat, 14 Jan 2023 05:31:48 -0600 Subject: Inital Commit --- HTML/Tests/Test2/pacific.css | 239 +++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 239 insertions(+) create mode 100644 HTML/Tests/Test2/pacific.css (limited to 'HTML/Tests/Test2/pacific.css') diff --git a/HTML/Tests/Test2/pacific.css b/HTML/Tests/Test2/pacific.css new file mode 100644 index 0000000..bcdfc2c --- /dev/null +++ b/HTML/Tests/Test2/pacific.css @@ -0,0 +1,239 @@ +* { + box-sizing: border-box; +} + +body { + background-color: #EAEAEA; + color: #666666; + font-family: "Times New Roman", Times, serif; +} + +header { + background-color: #002171; + color: #FFFFFF; + text-align: center; +} + +nav { + font-weight: bold; + padding: 0%; + font-size: 120%; +} + +nav ul { + list-style: none; + margin: 0%; + padding-left: 0%; + font-size: 1.2em; +} + +nav li { + border: 1px darkblue solid; + text-align: center; +} + + +nav a { + text-decoration: none; +} + +nav a:link { + text-decoration: none; + color: #5C7FA3; +} + +nav a:visited { + text-decoration: none; + color: #344873; +} + +nav a:hover { + color:#A52A2A; +} + +header a { + text-decoration: none; +} + +header a:link { + text-decoration: none; + color: #FFFFFF; +} + +header a:visited { + text-decoration: none; + color: #FFFFFF; +} + +header a:hover { + text-decoration: none; + color: #90C7E3; +} + + +h2 { + color: #1976D2; + font-family: Georgia, 'Times New Roman', serif; + text-shadow: 1px 1px 1px grey; +} + +h1 { + margin-bottom: 0%; + font-family: Georgia, 'Times New Roman', serif; + margin-top: 0%; + letter-spacing: 0.25em; + padding-top: 0.5em; + padding-bottom: 0.5em; +} + +h3 { + font-family: Georgia, 'Times New Roman', serif; + color: #000033; +} + +main ul { + list-style-image: url(marker.gif); +} + +main { + padding-top: 1px; + padding-right: 20px; + padding-bottom: 20px; + padding-left: 20px; + display: block; + background-color: #FFFFFF; + padding-left: 30px; + overflow: auto; +} + +footer { + font-size: 75%; + font-style: italic; + text-align: center; + font-family: Georgia, 'Times New Roman', serif; + padding: 2em; + background-color: #FFFFFF; +} + +dt { + color: #002171; +} + +.resort { + color: #1976D2; + font-weight: bold; +} + +#contact { + font-size: 90%; +} + +#wrapper { + background-color: #90C7E3; + background-image: linear-gradient(to bottom, #FFFFFF, #90C7E3); + background-repeat: no-repeat; +} + +#homehero { + background-image: url(coast2.jpg); + height: 300px; + background-size: 100% 100%; + background-repeat: no-repeat; +} + +#yurthero { + background-image: url(yurt.jpg); + height: 300px; + background-size: 100% 100%; + background-repeat: no-repeat; +} + +#trailhero { + background-image: url(trail.jpg); + height: 300px; + background-size: 100% 100%; + background-repeat: no-repeat; +} + +@media screen and (min-width: 600px) { + nav ul { + display: flex; + flex-wrap: nowrap; + justify-content: space-around; + } + + nav li { + border: none; + } + + section { + padding-left:2em; + padding-right: 2em; + } + h2 { + grid-row: 1 / 2; grid-column: 1 / 5; + } + + section { + grid-row: 2 / 3; grid-column: auto; + } + + #special { + grid-row: auto; grid-column: 1 / 5; + } + + footer { + grid-row: auto; grid-column: 1 / 5; + } + + .content main { + display: grid; + grid-template-rows: auto; + grid-template-columns: 1fr 1fr 1fr; + } +} + + + +@media screen and (min-width: 1024px) { + nav { + text-align: left; + } + + nav ul { + flex-direction: column; + } + + + #wrapper { + margin: auto; + width: 80%; + border: 1px darkblue solid; + box-shadow: 1px 1px 1px grey; + display: grid; + grid-template-rows: auto; + grid-template-columns: 180px 1fr; + } + + header { + grid-row: 1; grid-column: 1/3; + } + + nav { + grid-row: 2; grid-column: 1; + } + + div { + grid-row: 2; grid-column: 2; + } + + main { + grid-row: 3; grid-column: 2; + } + + footer { + grid-row: 4; grid-column: 2; + } + +} + -- cgit v1.2.3