1 files changed, 239 insertions, 0 deletions
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;
+    }
+
+}
+