diff --git a/themes/default/style.css b/themes/default/style.css index 5fce108..d26f65a 100644 --- a/themes/default/style.css +++ b/themes/default/style.css @@ -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; - } -} \ No newline at end of file +/*=================================*/ +/* 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; + } +}