|
@@ -1,370 +1,367 @@
|
|
|
-/*=================================*/
|
|
|
-/* Pico Default Theme
|
|
|
-/* By: Gilbert Pellegrom
|
|
|
-/* http: //dev7studios.com
|
|
|
-/*=================================*/
|
|
|
-
|
|
|
-/* Reset Styles
|
|
|
-/*---------------------------------------------*/
|
|
|
-html, body, div, span, applet, object, iframe,
|
|
|
-h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
|
|
-a, abbr, acronym, address, big, cite, code,
|
|
|
-del, dfn, em, font, img, ins, kbd, q, s, samp,
|
|
|
-small, strike, strong, sub, sup, tt, var,
|
|
|
-dl, dt, dd, ol, ul, li,
|
|
|
-fieldset, form, label, legend,
|
|
|
-table, caption, tbody, tfoot, thead, tr, th, td {
|
|
|
- margin: 0;
|
|
|
- padding: 0;
|
|
|
- border: 0;
|
|
|
- outline: 0;
|
|
|
- font-weight: inherit;
|
|
|
- font-style: inherit;
|
|
|
- font-size: 100%;
|
|
|
- font-family: inherit;
|
|
|
- vertical-align: baseline;
|
|
|
-}
|
|
|
-
|
|
|
-body {
|
|
|
- line-height: 1;
|
|
|
- color: black;
|
|
|
- background: white;
|
|
|
-}
|
|
|
-
|
|
|
-table {
|
|
|
- border-collapse: collapse;
|
|
|
- border-spacing: 0;
|
|
|
-}
|
|
|
-
|
|
|
-caption, th, td {
|
|
|
- text-align: left;
|
|
|
- font-weight: normal;
|
|
|
-}
|
|
|
-
|
|
|
-blockquote:before, blockquote:after,
|
|
|
-q:before, q:after {
|
|
|
- content: "";
|
|
|
-}
|
|
|
-
|
|
|
-blockquote, q {
|
|
|
- quotes: "" "";
|
|
|
-}
|
|
|
-
|
|
|
-/* HTML5 tags */
|
|
|
-header, section, footer,
|
|
|
-aside, nav, article, figure {
|
|
|
- display: block;
|
|
|
-}
|
|
|
-
|
|
|
-/* hand cursor on clickable input elements */
|
|
|
-label, input[type=button], input[type=submit], button {
|
|
|
- cursor: pointer;
|
|
|
-}
|
|
|
-
|
|
|
-/* make buttons play nice in IE:
|
|
|
- www.viget.com/inspire/styling-the-button-element-in-internet-explorer/ */
|
|
|
-button {
|
|
|
- width: auto;
|
|
|
- overflow: visible;
|
|
|
-}
|
|
|
-
|
|
|
-/* Sharper Thumbnails */
|
|
|
-img {
|
|
|
- -ms-interpolation-mode: bicubic;
|
|
|
-}
|
|
|
-
|
|
|
-/* Input Styles
|
|
|
-/*---------------------------------------------*/
|
|
|
-input,
|
|
|
-textarea,
|
|
|
-select {
|
|
|
- padding: 5px;
|
|
|
- font: 400 1em Verdana, Sans-serif;
|
|
|
- color: #666;
|
|
|
- background: #fff;
|
|
|
- border: 1px solid #999999;
|
|
|
- margin: 0 0 1em 0;
|
|
|
-}
|
|
|
-
|
|
|
-input:focus,
|
|
|
-textarea:focus,
|
|
|
-select:focus {
|
|
|
- color: #000;
|
|
|
- background: #fff;
|
|
|
- border: 1px solid #666666;
|
|
|
-}
|
|
|
-
|
|
|
-/* Main Styles
|
|
|
-/*---------------------------------------------*/
|
|
|
-body {
|
|
|
- font: 14px/1.8em 'Open Sans', Helvetica, Arial, Helvetica, sans-serif;
|
|
|
- color: #444;
|
|
|
- background: #fff;
|
|
|
- -webkit-font-smoothing: antialiased;
|
|
|
-}
|
|
|
-
|
|
|
-a, a:visited {
|
|
|
- color: #2EAE9B;
|
|
|
- text-decoration: none;
|
|
|
- -webkit-transition: all 0.2s linear;
|
|
|
- -moz-transition: all 0.2s linear;
|
|
|
- -ms-transition: all 0.2s linear;
|
|
|
- -o-transition: all 0.2s linear;
|
|
|
- transition: all 0.2s linear;
|
|
|
-}
|
|
|
-
|
|
|
-a:hover, a:active {
|
|
|
- color: #000;
|
|
|
- text-decoration: none;
|
|
|
-}
|
|
|
-
|
|
|
-h1, h2, h3, h4, h5, h6 {
|
|
|
- color: #000;
|
|
|
- line-height: 1.2em;
|
|
|
- margin-bottom: 0.6em;
|
|
|
-}
|
|
|
-
|
|
|
-h1 {
|
|
|
- font-size: 2em;
|
|
|
-}
|
|
|
-
|
|
|
-h2 {
|
|
|
- font-size: 1.7em;
|
|
|
-}
|
|
|
-
|
|
|
-h3 {
|
|
|
- font-size: 1.5em;
|
|
|
- margin-top: 2em;
|
|
|
-}
|
|
|
-
|
|
|
-p, table {
|
|
|
- margin-bottom: 1em;
|
|
|
-}
|
|
|
-
|
|
|
-ol, ul {
|
|
|
- padding-left: 30px;
|
|
|
- margin-bottom: 1em;
|
|
|
-}
|
|
|
-
|
|
|
-b, strong {
|
|
|
- font-weight: bold;
|
|
|
-}
|
|
|
-
|
|
|
-i, em {
|
|
|
- font-style: italic;
|
|
|
-}
|
|
|
-
|
|
|
-u {
|
|
|
- text-decoration: underline;
|
|
|
-}
|
|
|
-
|
|
|
-abbr, acronym {
|
|
|
- cursor: help;
|
|
|
- border-bottom: 0.1em dotted;
|
|
|
-}
|
|
|
-
|
|
|
-td, td img {
|
|
|
- vertical-align: top;
|
|
|
-}
|
|
|
-
|
|
|
-td, th {
|
|
|
- border: solid 1px #999;
|
|
|
- padding: 0.25em 0.5em;
|
|
|
-}
|
|
|
-
|
|
|
-th {
|
|
|
- font-weight: bold;
|
|
|
- text-align: center;
|
|
|
- background: #eee;
|
|
|
-}
|
|
|
-
|
|
|
-sub {
|
|
|
- vertical-align: sub;
|
|
|
- font-size: smaller;
|
|
|
-}
|
|
|
-
|
|
|
-sup {
|
|
|
- vertical-align: super;
|
|
|
- font-size: smaller;
|
|
|
-}
|
|
|
-
|
|
|
-code {
|
|
|
- font-family: Courier, "Courier New", Monaco, Tahoma;
|
|
|
- background: #eee;
|
|
|
- color: #333;
|
|
|
- padding: 0px 2px;
|
|
|
-}
|
|
|
-
|
|
|
-pre {
|
|
|
- background: #eee;
|
|
|
- padding: 20px;
|
|
|
- margin-bottom: 1em;
|
|
|
- overflow: auto;
|
|
|
-}
|
|
|
-
|
|
|
-blockquote {
|
|
|
- font-style: italic;
|
|
|
- margin: 0 0 1em 15px;
|
|
|
- padding-left: 10px;
|
|
|
- border-left: 5px solid #dddddd;
|
|
|
-}
|
|
|
-
|
|
|
-/* Structure Styles
|
|
|
-/*---------------------------------------------*/
|
|
|
-.inner {
|
|
|
- width: 850px;
|
|
|
- margin: 0 auto;
|
|
|
-}
|
|
|
-
|
|
|
-#header {
|
|
|
- background: #2EAE9B;
|
|
|
- padding: 60px 0;
|
|
|
- margin-bottom: 80px;
|
|
|
- color: #afe1da;
|
|
|
-}
|
|
|
-#header a { color: #afe1da; }
|
|
|
-#header h1 a,
|
|
|
-#header a:hover { color: #fff; }
|
|
|
-#header h1 {
|
|
|
- font-weight: bold;
|
|
|
- margin: 0;
|
|
|
- float: left;
|
|
|
-}
|
|
|
-#header .menu-icon {
|
|
|
- display: none;
|
|
|
- width: 35px;
|
|
|
- height: 35px;
|
|
|
- background: #afe1da url(menu-icon.png) center;
|
|
|
-}
|
|
|
-#header nav {
|
|
|
- float: right;
|
|
|
- list-style: none;
|
|
|
- margin: 0;
|
|
|
- padding: 0;
|
|
|
-}
|
|
|
-#header nav a {
|
|
|
- font-weight: bold;
|
|
|
- margin-left: 20px;
|
|
|
-}
|
|
|
-#header a:hover#menu-icon {
|
|
|
- background-color: #444;
|
|
|
- border-radius: 4px 4px 0 0;
|
|
|
-}
|
|
|
-#header ul {
|
|
|
- list-style: none;
|
|
|
-}
|
|
|
-#header li {
|
|
|
- display: inline-block;
|
|
|
- float: left;
|
|
|
-}
|
|
|
-#footer {
|
|
|
- background: #707070;
|
|
|
- padding: 60px 0;
|
|
|
- margin-top: 80px;
|
|
|
- color: #C0C0C0;
|
|
|
-}
|
|
|
-#footer a { color: #ddd; }
|
|
|
-#footer a:hover { color: #fff; }
|
|
|
-
|
|
|
-/* Misc Styles
|
|
|
-/*---------------------------------------------*/
|
|
|
-.clearfix:before,
|
|
|
-.clearfix:after {
|
|
|
- content: " ";
|
|
|
- display: table;
|
|
|
-}
|
|
|
-.clearfix:after {
|
|
|
- clear: both;
|
|
|
-}
|
|
|
-.clearfix {
|
|
|
- *zoom: 1;
|
|
|
-}
|
|
|
-
|
|
|
-/* Media Queries
|
|
|
-/*---------------------------------------------*/
|
|
|
-
|
|
|
-/* Small Devices, Tablets */
|
|
|
-@media only screen and (max-width : 768px) {
|
|
|
-
|
|
|
- .inner {
|
|
|
- width: 85%;
|
|
|
- }
|
|
|
- .inner img {
|
|
|
- width:100%;
|
|
|
- }
|
|
|
- #header {
|
|
|
- margin-bottom: 40px;
|
|
|
- }
|
|
|
- #header h1 a {
|
|
|
- font-size:1em;
|
|
|
- }
|
|
|
- #header .menu-icon {
|
|
|
- display:inline-block;
|
|
|
- }
|
|
|
- #header nav a { color: #000; }
|
|
|
- #header nav a:hover { color: #afe1da; }
|
|
|
- #header nav ul, nav:active ul {
|
|
|
- display: none;
|
|
|
- position: absolute;
|
|
|
- padding: 20px;
|
|
|
- background: #fff;
|
|
|
- border: 5px solid #444;
|
|
|
- right: 2.7em;
|
|
|
- top: 100px;
|
|
|
- width: 80%;
|
|
|
- border-radius: 4px 0 4px 4px;
|
|
|
- z-index: 9999;
|
|
|
- }
|
|
|
- #header nav li {
|
|
|
- text-align: center;
|
|
|
- width: 100%;
|
|
|
- padding: 10px 0;
|
|
|
- margin: 0;
|
|
|
- }
|
|
|
- #header nav:hover ul {
|
|
|
- display: block;
|
|
|
- }
|
|
|
-
|
|
|
-}
|
|
|
-
|
|
|
-/* Extra Small Devices, Phones */
|
|
|
-@media only screen and (max-width : 480px) {
|
|
|
-
|
|
|
- .inner {
|
|
|
- width: 85%;
|
|
|
- }
|
|
|
- .inner img {
|
|
|
- width:100%;
|
|
|
- }
|
|
|
- #header {
|
|
|
- margin-bottom: 30px;
|
|
|
- }
|
|
|
- #header h1 a {
|
|
|
- font-size:1em;
|
|
|
- }
|
|
|
- #header .menu-icon {
|
|
|
- display:inline-block;
|
|
|
- }
|
|
|
- #header nav a { color: #000; }
|
|
|
- #header nav a:hover { color: #afe1da; }
|
|
|
- #header nav ul, nav:active ul {
|
|
|
- display: none;
|
|
|
- position: absolute;
|
|
|
- padding: 20px;
|
|
|
- background: #fff;
|
|
|
- border: 5px solid #444;
|
|
|
- right: 0em;
|
|
|
- top: 100px;
|
|
|
- width: auto;
|
|
|
- border-radius: 4px 0 4px 4px;
|
|
|
- }
|
|
|
- #header nav li {
|
|
|
- text-align: center;
|
|
|
- width: 100%;
|
|
|
- padding: 10px 0;
|
|
|
- margin: 0;
|
|
|
- }
|
|
|
- #header nav:hover ul {
|
|
|
- display: block;
|
|
|
- }
|
|
|
-}
|
|
|
+/*=================================*/
|
|
|
+/* Pico Default Theme
|
|
|
+/* By: Gilbert Pellegrom
|
|
|
+/* http: //dev7studios.com
|
|
|
+/*=================================*/
|
|
|
+
|
|
|
+/* Reset Styles
|
|
|
+/*---------------------------------------------*/
|
|
|
+html, body, div, span, applet, object, iframe,
|
|
|
+h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
|
|
+a, abbr, acronym, address, big, cite, code,
|
|
|
+del, dfn, em, font, img, ins, kbd, q, s, samp,
|
|
|
+small, strike, strong, sub, sup, tt, var,
|
|
|
+dl, dt, dd, ol, ul, li,
|
|
|
+fieldset, form, label, legend,
|
|
|
+table, caption, tbody, tfoot, thead, tr, th, td {
|
|
|
+ margin: 0;
|
|
|
+ padding: 0;
|
|
|
+ border: 0;
|
|
|
+ outline: 0;
|
|
|
+ font-weight: inherit;
|
|
|
+ font-style: inherit;
|
|
|
+ font-size: 100%;
|
|
|
+ font-family: inherit;
|
|
|
+ vertical-align: baseline;
|
|
|
+}
|
|
|
+
|
|
|
+body {
|
|
|
+ line-height: 1;
|
|
|
+ color: black;
|
|
|
+ background: white;
|
|
|
+}
|
|
|
+
|
|
|
+table {
|
|
|
+ border-collapse: collapse;
|
|
|
+ border-spacing: 0;
|
|
|
+}
|
|
|
+
|
|
|
+caption, th, td {
|
|
|
+ text-align: left;
|
|
|
+ font-weight: normal;
|
|
|
+}
|
|
|
+
|
|
|
+blockquote:before, blockquote:after,
|
|
|
+q:before, q:after {
|
|
|
+ content: "";
|
|
|
+}
|
|
|
+
|
|
|
+blockquote, q {
|
|
|
+ quotes: "" "";
|
|
|
+}
|
|
|
+
|
|
|
+/* HTML5 tags */
|
|
|
+header, section, footer,
|
|
|
+aside, nav, article, figure {
|
|
|
+ display: block;
|
|
|
+}
|
|
|
+
|
|
|
+/* hand cursor on clickable input elements */
|
|
|
+label, input[type=button], input[type=submit], button {
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+
|
|
|
+/* make buttons play nice in IE:
|
|
|
+ www.viget.com/inspire/styling-the-button-element-in-internet-explorer/ */
|
|
|
+button {
|
|
|
+ width: auto;
|
|
|
+ overflow: visible;
|
|
|
+}
|
|
|
+
|
|
|
+/* Sharper Thumbnails */
|
|
|
+img {
|
|
|
+ -ms-interpolation-mode: bicubic;
|
|
|
+}
|
|
|
+
|
|
|
+/* Input Styles
|
|
|
+/*---------------------------------------------*/
|
|
|
+input,
|
|
|
+textarea,
|
|
|
+select {
|
|
|
+ padding: 5px;
|
|
|
+ font: 400 1em Verdana, Sans-serif;
|
|
|
+ color: #666;
|
|
|
+ background: #fff;
|
|
|
+ border: 1px solid #999999;
|
|
|
+ margin: 0 0 1em 0;
|
|
|
+}
|
|
|
+
|
|
|
+input:focus,
|
|
|
+textarea:focus,
|
|
|
+select:focus {
|
|
|
+ color: #000;
|
|
|
+ background: #fff;
|
|
|
+ border: 1px solid #666666;
|
|
|
+}
|
|
|
+
|
|
|
+/* Main Styles
|
|
|
+/*---------------------------------------------*/
|
|
|
+body {
|
|
|
+ font: 14px/1.8em 'Open Sans', Helvetica, Arial, Helvetica, sans-serif;
|
|
|
+ color: #444;
|
|
|
+ background: #fff;
|
|
|
+ -webkit-font-smoothing: antialiased;
|
|
|
+}
|
|
|
+
|
|
|
+a, a:visited {
|
|
|
+ color: #2EAE9B;
|
|
|
+ text-decoration: none;
|
|
|
+ -webkit-transition: all 0.2s linear;
|
|
|
+ -moz-transition: all 0.2s linear;
|
|
|
+ -ms-transition: all 0.2s linear;
|
|
|
+ -o-transition: all 0.2s linear;
|
|
|
+ transition: all 0.2s linear;
|
|
|
+}
|
|
|
+
|
|
|
+a:hover, a:active {
|
|
|
+ color: #000;
|
|
|
+ text-decoration: none;
|
|
|
+}
|
|
|
+
|
|
|
+h1, h2, h3, h4, h5, h6 {
|
|
|
+ color: #000;
|
|
|
+ line-height: 1.2em;
|
|
|
+ margin-bottom: 0.6em;
|
|
|
+}
|
|
|
+
|
|
|
+h1 {
|
|
|
+ font-size: 2em;
|
|
|
+}
|
|
|
+
|
|
|
+h2 {
|
|
|
+ font-size: 1.7em;
|
|
|
+}
|
|
|
+
|
|
|
+h3 {
|
|
|
+ font-size: 1.5em;
|
|
|
+ margin-top: 2em;
|
|
|
+}
|
|
|
+
|
|
|
+p, table {
|
|
|
+ margin-bottom: 1em;
|
|
|
+}
|
|
|
+
|
|
|
+ol, ul {
|
|
|
+ padding-left: 30px;
|
|
|
+ margin-bottom: 1em;
|
|
|
+}
|
|
|
+
|
|
|
+b, strong {
|
|
|
+ font-weight: bold;
|
|
|
+}
|
|
|
+
|
|
|
+i, em {
|
|
|
+ font-style: italic;
|
|
|
+}
|
|
|
+
|
|
|
+u {
|
|
|
+ text-decoration: underline;
|
|
|
+}
|
|
|
+
|
|
|
+abbr, acronym {
|
|
|
+ cursor: help;
|
|
|
+ border-bottom: 0.1em dotted;
|
|
|
+}
|
|
|
+
|
|
|
+td, td img {
|
|
|
+ vertical-align: top;
|
|
|
+}
|
|
|
+
|
|
|
+td, th {
|
|
|
+ border: solid 1px #999;
|
|
|
+ padding: 0.25em 0.5em;
|
|
|
+}
|
|
|
+
|
|
|
+th {
|
|
|
+ font-weight: bold;
|
|
|
+ text-align: center;
|
|
|
+ background: #eee;
|
|
|
+}
|
|
|
+
|
|
|
+sub {
|
|
|
+ vertical-align: sub;
|
|
|
+ font-size: smaller;
|
|
|
+}
|
|
|
+
|
|
|
+sup {
|
|
|
+ vertical-align: super;
|
|
|
+ font-size: smaller;
|
|
|
+}
|
|
|
+
|
|
|
+code {
|
|
|
+ font-family: Courier, "Courier New", Monaco, Tahoma;
|
|
|
+ background: #eee;
|
|
|
+ color: #333;
|
|
|
+ padding: 0px 2px;
|
|
|
+}
|
|
|
+
|
|
|
+pre {
|
|
|
+ background: #eee;
|
|
|
+ padding: 20px;
|
|
|
+ margin-bottom: 1em;
|
|
|
+ overflow: auto;
|
|
|
+}
|
|
|
+
|
|
|
+blockquote {
|
|
|
+ font-style: italic;
|
|
|
+ margin: 0 0 1em 15px;
|
|
|
+ padding-left: 10px;
|
|
|
+ border-left: 5px solid #dddddd;
|
|
|
+}
|
|
|
+
|
|
|
+/* Structure Styles
|
|
|
+/*---------------------------------------------*/
|
|
|
+.inner {
|
|
|
+ width: 850px;
|
|
|
+ margin: 0 auto;
|
|
|
+}
|
|
|
+
|
|
|
+#header {
|
|
|
+ background: #2EAE9B;
|
|
|
+ padding: 60px 0;
|
|
|
+ margin-bottom: 80px;
|
|
|
+ color: #afe1da;
|
|
|
+}
|
|
|
+#header a { color: #afe1da; }
|
|
|
+#header h1 a,
|
|
|
+#header a:hover { color: #fff; }
|
|
|
+#header h1 {
|
|
|
+ font-weight: bold;
|
|
|
+ margin: 0;
|
|
|
+ float: left;
|
|
|
+}
|
|
|
+#header .menu-icon {
|
|
|
+ display: none;
|
|
|
+ width: 35px;
|
|
|
+ height: 35px;
|
|
|
+ background: #afe1da url(menu-icon.png) center;
|
|
|
+}
|
|
|
+#header nav {
|
|
|
+ float: right;
|
|
|
+ list-style: none;
|
|
|
+ margin: 0;
|
|
|
+ padding: 0;
|
|
|
+}
|
|
|
+#header nav a {
|
|
|
+ font-weight: bold;
|
|
|
+ margin-left: 20px;
|
|
|
+}
|
|
|
+#header a:hover#menu-icon {
|
|
|
+ background-color: #444;
|
|
|
+ border-radius: 4px 4px 0 0;
|
|
|
+}
|
|
|
+#header ul {
|
|
|
+ list-style: none;
|
|
|
+}
|
|
|
+#header li {
|
|
|
+ display: inline-block;
|
|
|
+ float: left;
|
|
|
+}
|
|
|
+#footer {
|
|
|
+ background: #707070;
|
|
|
+ padding: 60px 0;
|
|
|
+ margin-top: 80px;
|
|
|
+ color: #C0C0C0;
|
|
|
+}
|
|
|
+#footer a { color: #ddd; }
|
|
|
+#footer a:hover { color: #fff; }
|
|
|
+
|
|
|
+/* Misc Styles
|
|
|
+/*---------------------------------------------*/
|
|
|
+.clearfix:before,
|
|
|
+.clearfix:after {
|
|
|
+ content: " ";
|
|
|
+ display: table;
|
|
|
+}
|
|
|
+.clearfix:after {
|
|
|
+ clear: both;
|
|
|
+}
|
|
|
+.clearfix {
|
|
|
+ *zoom: 1;
|
|
|
+}
|
|
|
+
|
|
|
+/* Media Queries
|
|
|
+/*---------------------------------------------*/
|
|
|
+
|
|
|
+/* Small Devices, Tablets */
|
|
|
+@media only screen and (max-width : 768px) {
|
|
|
+ .inner {
|
|
|
+ width: 85%;
|
|
|
+ }
|
|
|
+ .inner img {
|
|
|
+ width:100%;
|
|
|
+ }
|
|
|
+ #header {
|
|
|
+ margin-bottom: 40px;
|
|
|
+ }
|
|
|
+ #header h1 a {
|
|
|
+ font-size:1em;
|
|
|
+ }
|
|
|
+ #header .menu-icon {
|
|
|
+ display:inline-block;
|
|
|
+ }
|
|
|
+ #header nav a { color: #000; }
|
|
|
+ #header nav a:hover { color: #afe1da; }
|
|
|
+ #header nav ul, nav:active ul {
|
|
|
+ display: none;
|
|
|
+ position: absolute;
|
|
|
+ padding: 20px;
|
|
|
+ background: #fff;
|
|
|
+ border: 5px solid #444;
|
|
|
+ right: 2.7em;
|
|
|
+ top: 100px;
|
|
|
+ width: 80%;
|
|
|
+ border-radius: 4px 0 4px 4px;
|
|
|
+ z-index: 9999;
|
|
|
+ }
|
|
|
+ #header nav li {
|
|
|
+ text-align: center;
|
|
|
+ width: 100%;
|
|
|
+ padding: 10px 0;
|
|
|
+ margin: 0;
|
|
|
+ }
|
|
|
+ #header nav:hover ul {
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+/* Extra Small Devices, Phones */
|
|
|
+@media only screen and (max-width : 480px) {
|
|
|
+ .inner {
|
|
|
+ width: 85%;
|
|
|
+ }
|
|
|
+ .inner img {
|
|
|
+ width:100%;
|
|
|
+ }
|
|
|
+ #header {
|
|
|
+ margin-bottom: 30px;
|
|
|
+ }
|
|
|
+ #header h1 a {
|
|
|
+ font-size:1em;
|
|
|
+ }
|
|
|
+ #header .menu-icon {
|
|
|
+ display:inline-block;
|
|
|
+ }
|
|
|
+ #header nav a { color: #000; }
|
|
|
+ #header nav a:hover { color: #afe1da; }
|
|
|
+ #header nav ul, nav:active ul {
|
|
|
+ display: none;
|
|
|
+ position: absolute;
|
|
|
+ padding: 20px;
|
|
|
+ background: #fff;
|
|
|
+ border: 5px solid #444;
|
|
|
+ right: 0em;
|
|
|
+ top: 100px;
|
|
|
+ width: auto;
|
|
|
+ border-radius: 4px 0 4px 4px;
|
|
|
+ }
|
|
|
+ #header nav li {
|
|
|
+ text-align: center;
|
|
|
+ width: 100%;
|
|
|
+ padding: 10px 0;
|
|
|
+ margin: 0;
|
|
|
+ }
|
|
|
+ #header nav:hover ul {
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+}
|