8ae703cb24
The "plt-new-services" package defines the "meta/new-web" collection, with the idea that it will be merged into "plt-services" and later replace "meta/web".
103 lines
7.4 KiB
CSS
103 lines
7.4 KiB
CSS
@charset "UTF-8";
|
|
@import url(http://fonts.googleapis.com/css?family=Open+Sans:500,400,300,600,700);
|
|
/**
|
|
* Gumby Framework
|
|
* ---------------
|
|
*
|
|
* Follow @gumbycss on twitter and spread the love.
|
|
* We worked super hard on making this awesome and released it to the web.
|
|
* All we ask is you leave this intact. #gumbyisawesome
|
|
*
|
|
* Gumby Framework
|
|
* http://gumbyframework.com
|
|
*
|
|
* Built with love by your friends @digitalsurgeons
|
|
* http://www.digitalsurgeons.com
|
|
*
|
|
* Free to use under the MIT license.
|
|
* http://www.opensource.org/licenses/mit-license.php
|
|
*
|
|
* This file is just enough of "gumby.css" to make the navigationless
|
|
* header work.
|
|
*/
|
|
|
|
.gumby-content { background: white; font-family: "Open Sans"; font-weight: 400; color: #1e1e1e; position: relative; -webkit-font-smoothing: antialiased; }
|
|
@media only screen and (max-width: 767px) { .gumby-content { -webkit-text-size-adjust: none; -ms-text-size-adjust: none; width: 100%; min-width: 0; } }
|
|
|
|
/* Fonts */
|
|
@font-face { font-family: "entypo"; font-style: normal; font-weight: 400; src: url(./entypo.eot); src: url("./entypo.eot?#iefix") format("ie9-skip-eot"), url("./entypo.woff") format("woff"), url("./entypo.ttf") format("truetype"); }
|
|
|
|
.subhead { color: #777; font-weight: normal; margin-bottom: 20px; }
|
|
|
|
.row { width: 100%; max-width: 940px; min-width: 320px; margin: 0 auto; }
|
|
@media only screen and (max-width: 960px) { .row { padding: 0 20px; } }
|
|
.row .row { min-width: 0px; }
|
|
@media only screen and (max-width: 960px) { .row .row { padding: 0; } }
|
|
|
|
/* To fix the grid into a different size, set max-width to your desired width */
|
|
.column, .columns { margin-left: 2.12766%; float: left; min-height: 1px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
|
|
|
|
.column:first-child, .columns:first-child, .alpha { margin-left: 0px; }
|
|
|
|
.column.omega, .columns.omega { float: right; }
|
|
|
|
/* Column Classes */
|
|
.row .five.columns { width: 40.42553%; }
|
|
|
|
/*=====================================================
|
|
Navigation (with dropdowns)
|
|
======================================================*/
|
|
.navbar { width: 100%; min-height: 60px; display: block; margin-bottom: 20px; background: black; }
|
|
@media only screen and (max-width: 767px) { .navbar { position: relative; border: none; }
|
|
.navbar .column, .navbar .columns { min-height: 0; } }
|
|
.navbar.fixed { top: 0; left: 0; z-index: 99999; }
|
|
.navbar a.toggle { display: none; }
|
|
@media only screen and (max-width: 767px) { .navbar a.toggle { top: 18%; right: 4%; width: 46px; position: absolute; text-align: center; display: inline-block; color: white; background: black; height: 40px; line-height: 38px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; font-size: 30px; font-size: 1.875rem; }
|
|
.navbar a.toggle:hover { background: #0d0d0d; }
|
|
.navbar a.toggle:active, .navbar a.toggle.active { background: black; } }
|
|
.navbar .logo { display: inline-block; margin: 0 2.12766% 0 0; padding: 0; height: 60px; line-height: 58px; }
|
|
.navbar .logo a { display: block; padding: 0 0 0 16px; overflow: hidden; height: 60px; line-height: 58px; }
|
|
.navbar .logo a img { max-height: 95%; }
|
|
@media only screen and (max-width: 767px) { .navbar .logo { float: left; display: inline; }
|
|
.navbar .logo a { padding: 0; }
|
|
.navbar .logo a img { width: auto; height: auto; max-width: 100%; } }
|
|
.navbar ul { display: table; vertical-align: middle; margin: 0; float: none; }
|
|
@media only screen and (max-width: 767px) { .navbar ul { position: absolute; display: block; width: 100% !important; height: 0; max-height: 0; top: 60px; left: 0; overflow: hidden; text-align: center; background: black; }
|
|
.navbar ul.active { height: auto; max-height: 600px; z-index: 999999; -webkit-transition-duration: 0.5s; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s; transition-duration: 0.5s; -webkit-box-shadow: 0 2px 2px #262626; -moz-box-shadow: 0 2px 2px #262626; box-shadow: 0 2px 2px #262626; } }
|
|
.navbar ul li { display: table-cell; text-align: center; padding-bottom: 0; margin: 0; height: 60px; line-height: 58px; }
|
|
@media only screen and (max-width: 767px) { .navbar ul li { display: block; position: relative; min-height: 50px; max-height: 320px; height: auto; width: 100%; border-right: 0 !important; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; -webkit-transition-duration: 0.5s; -moz-transition-duration: 0.5s; -o-transition-duration: 0.5s; transition-duration: 0.5s; } }
|
|
.navbar ul li > a { display: block; padding: 0 16px; white-space: nowrap; color: white; text-shadow: 0 1px 2px black, 0 1px 0 black; height: 60px; line-height: 58px; font-size: 16px; font-size: 1rem; }
|
|
.navbar ul li > a i.icon-popup { position: absolute; }
|
|
.navbar ul li .btn { border-color: black !important; }
|
|
.navbar ul li.field { margin-bottom: 0 !important; margin-right: 0; }
|
|
@media only screen and (max-width: 767px) { .navbar ul li.field { padding: 0 20px; } }
|
|
.navbar ul li.field input.search { background: black; border: none; color: #f2f2f2; }
|
|
.navbar ul li .dropdown { width: auto; min-width: 0px; max-width: 320px; height: 0; position: absolute; background: #fafafa; overflow: hidden; z-index: 999; }
|
|
@media only screen and (max-width: 767px) { .navbar ul li .dropdown { width: 100%; max-width: 100%; position: relative; -webkit-box-shadow: none !important; -moz-box-shadow: none !important; box-shadow: none !important; }
|
|
.navbar ul li.active .dropdown { border-bottom: 1px solid black; }
|
|
.navbar ul li.active .dropdown ul { position: relative; top: 0; background: black; min-height: 50px; max-height: 250px; height: auto; overflow: auto; -webkit-box-shadow: none !important; -moz-box-shadow: none !important; box-shadow: none !important; }
|
|
.navbar ul li.active .dropdown ul li { min-height: 50px; border-bottom: black; }
|
|
.navbar ul li.active .dropdown ul li a { color: white; border-bottom: 1px solid black; }
|
|
.navbar ul li.active .dropdown ul li a:hover { color: #d04526; } }
|
|
@media only screen and (min-width: 768px) and (max-width: 939px) { .navbar > ul > li > .btn a { padding: 0 10px 0 10px !important; }
|
|
.navbar ul > li .dropdown ul li.active .dropdown { left: -320px; } }
|
|
|
|
/**** Navbar positioning for Microsoft's browser who deserves not to be mentioned ****/
|
|
.ie7 .navbar > ul { width: auto; }
|
|
|
|
.ie7 .navbar, .ie7 .navbar > ul > li > a { display: block; }
|
|
|
|
.ie7 .navbar .logo, .ie7 .navbar ul, .ie7 .navbar ul li { float: left; display: inline-block; }
|
|
|
|
.ie7 .navbar .logo a { display: block; overflow: hidden; }
|
|
|
|
.ie7 .navbar > ul > li .field { display: block; padding: 12px 18px 0; width: 80%; }
|
|
|
|
.navbar li .dropdown ul { margin: 0; display: block; }
|
|
.navbar li .dropdown ul > li { position: relative; display: block; width: 100%; float: left; text-align: left; height: auto; -webkit-border-radius: none; -moz-border-radius: none; -ms-border-radius: none; -o-border-radius: none; border-radius: none; }
|
|
@media only screen and (min-width: 768px) and (max-width: 939px) { .navbar li .dropdown ul > li { max-width: 320px; word-wrap: break-word; } }
|
|
.navbar li .dropdown ul > li a { display: block; padding: 0 20px; color: #d04526; border-bottom: 1px solid #cccccc; text-shadow: none; height: 51px; line-height: 49px; }
|
|
@media only screen and (max-width: 767px) { .navbar li .dropdown ul > li a { padding: 0 20px; } }
|
|
.navbar li .dropdown ul > li .dropdown { display: none; background: white; }
|
|
.navbar li .dropdown ul li:first-child a { -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; }
|