initial file dump with some early modifications
This commit is contained in:
Dave Gamache
303
css/base.css
Normal file
303
css/base.css
Normal file
@ -0,0 +1,303 @@
|
||||
/*
|
||||
* Skeleton V0.1
|
||||
* Created by Dave Gamache
|
||||
* www.skeleton.gs
|
||||
* 4/30/2011
|
||||
*/
|
||||
|
||||
|
||||
|
||||
|
||||
/* Table of Content
|
||||
==================================================
|
||||
@Reset & Basics
|
||||
@Typography
|
||||
@Links
|
||||
@Lists
|
||||
@Grid
|
||||
@Tables
|
||||
@Misc
|
||||
*/
|
||||
|
||||
|
||||
/* Reset & Basics (Inspired by E. Meyers)
|
||||
================================================== */
|
||||
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, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
font-size: 100%;
|
||||
font: inherit;
|
||||
vertical-align: baseline; }
|
||||
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
|
||||
display: block; }
|
||||
body {
|
||||
line-height: 1; }
|
||||
ol, ul {
|
||||
list-style: none; }
|
||||
blockquote, q {
|
||||
quotes: none; }
|
||||
blockquote:before, blockquote:after,
|
||||
q:before, q:after {
|
||||
content: '';
|
||||
content: none; }
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0; }
|
||||
body {
|
||||
background: #fff;
|
||||
font: 13px/18px "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;; ;
|
||||
color: #444;
|
||||
-webkit-font-smoothing: antialiased; /* Fix for webkit rendering */ }
|
||||
|
||||
|
||||
/* --------------------------------------------------
|
||||
:: Typography
|
||||
-------------------------------------------------- */
|
||||
h1, h2, h3, h4, h5, h6 { color: #181818; font-weight: bold; line-height: 1.25 }
|
||||
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: inherit; }
|
||||
h1 { font-size: 46px; margin-bottom: 12px;}
|
||||
h2 { font-size: 35px; margin-bottom: 9px; }
|
||||
h3 { font-size: 28px; margin-bottom: 9px; }
|
||||
h4 { font-size: 21px; margin-bottom: 3px; }
|
||||
h5 { font-size: 18px; font-weight: normal; margin-bottom: 3px; }
|
||||
h6 { font-size: 15px; font-weight: normal; }
|
||||
|
||||
.subheader { color: #777; font-weight: 300; margin-bottom: 24px; }
|
||||
|
||||
p { line-height: 17px; margin: 0 0 18px; }
|
||||
p img { margin: 0; }
|
||||
p.lead { font-size: 18px; line-height: 24px; }
|
||||
|
||||
em { font-style: italic; line-height: inherit; }
|
||||
strong { font-weight: bold; line-height: inherit; }
|
||||
small { font-size: 80%; line-height: inherit; }
|
||||
|
||||
/* Blockquotes */
|
||||
blockquote, blockquote p { line-height: 20px; color: #777; }
|
||||
blockquote { margin: 0 0 18px; padding: 9px 20px 0 19px; border-left: 1px solid #ddd; }
|
||||
blockquote cite { display: block; font-size: 12px; color: #555; }
|
||||
blockquote cite:before { content: "\2014 \0020"; }
|
||||
blockquote cite a, blockquote cite a:visited, blockquote cite a:visited { color: #555; }
|
||||
|
||||
hr { border: solid #ddd; border-width: 1px 0 0; clear: both; margin: 12px 0 18px; height: 0; }
|
||||
|
||||
abbr, acronym { text-transform: uppercase; font-size: 90%; color: #222; border-bottom: 1px solid #ddd; cursor: help; }
|
||||
abbr { text-transform: none; }
|
||||
|
||||
|
||||
/* --------------------------------------------------
|
||||
:: Links
|
||||
-------------------------------------------------- */
|
||||
a { color: #2a85e8; text-decoration: none; outline: 0; line-height: inherit; }
|
||||
a:hover { color: #11639d; }
|
||||
p a, p a:visited { line-height: inherit; }
|
||||
|
||||
|
||||
/* --------------------------------------------------
|
||||
:: Lists
|
||||
-------------------------------------------------- */
|
||||
ul, ol { margin-bottom: 18px; }
|
||||
ul { list-style: none outside; }
|
||||
ol { list-style: decimal; }
|
||||
ol, ul.square, ul.circle, ul.disc { margin-left: 30px; }
|
||||
ul.square { list-style: square outside; }
|
||||
ul.circle { list-style: circle outside; }
|
||||
ul.disc { list-style: disc outside; }
|
||||
ul ul, ol ol { margin: 4px 0 5px 30px; }
|
||||
li { line-height: 18px; margin-bottom: 12px; }
|
||||
ul.large li { line-height: 21px; }
|
||||
|
||||
/* --------------------------------------------------
|
||||
:: Grid
|
||||
-------------------------------------------------- */
|
||||
|
||||
/* Container */
|
||||
div.container { position: relative; width: 1050px; margin: 0 auto; padding: 0; }
|
||||
body.ie8 div.container { position: static; }
|
||||
|
||||
.row { margin: 0 0 18px -30px; width: 1080px; }
|
||||
.column, .columns { float: left; display: inline; margin: 0 0 0 30px; }
|
||||
|
||||
.one { width: 15px; }
|
||||
.two { width: 60px; }
|
||||
.three { width: 105px; }
|
||||
.four { width: 150px; }
|
||||
.five { width: 195px; }
|
||||
.six, .one-fourth { width: 240px; }
|
||||
.seven { width: 285px; }
|
||||
.eight, .one-third { width: 330px; }
|
||||
.nine { width: 375px; }
|
||||
.ten { width: 420px; }
|
||||
.eleven { width: 465px; }
|
||||
.twelve { width: 510px; }
|
||||
.thirteen { width: 555px; }
|
||||
.fourteen { width: 600px; }
|
||||
.fifteen { width: 645px; }
|
||||
.sixteen, .two-thirds { width: 690px; }
|
||||
.seventeen { width: 735px; }
|
||||
.eighteen { width: 780px; }
|
||||
.nineteen { width: 825px; }
|
||||
.twenty { width: 870px; }
|
||||
.twenty-one { width: 915px; }
|
||||
.twenty-two { width: 960px; }
|
||||
.twenty-three { width: 1005px; }
|
||||
.twenty-four { width: 1050px; }
|
||||
|
||||
.offset-by-one { margin-left: 30px; }
|
||||
.offset-by-two { margin-left: 75px; }
|
||||
.offset-by-three { margin-left: 120px; }
|
||||
.offset-by-four { margin-left: 165px; }
|
||||
.offset-by-five { margin-left: 210px; }
|
||||
.offset-by-six { margin-left: 255px; }
|
||||
.offset-by-seven { margin-left: 300px; }
|
||||
.offset-by-eight { margin-left: 345px; }
|
||||
.offset-by-nine { margin-left: 390px; }
|
||||
.offset-by-ten { margin-left: 435px; }
|
||||
.offset-by-eleven { margin-left: 480px; }
|
||||
.offset-by-twelve { margin-left: 525px; }
|
||||
.offset-by-thirteen { margin-left: 570px; }
|
||||
.offset-by-fourteen { margin-left: 615px; }
|
||||
.offset-by-fifteen { margin-left: 660px; }
|
||||
.offset-by-sixteen { margin-left: 705px; }
|
||||
.offset-by-seventeen { margin-left: 750px; }
|
||||
.offset-by-eighteen { margin-left: 795px; }
|
||||
.offset-by-nineteen { margin-left: 840px; }
|
||||
.offset-by-twenty { margin-left: 885px; }
|
||||
.offset-by-twenty-one { margin-left: 930px; }
|
||||
.offset-by-twenty-two { margin-left: 975px; }
|
||||
.offset-by-twenty-three { margin-left: 1020px; }
|
||||
|
||||
.two .row { width: 90px; }
|
||||
.three .row { width: 135px; }
|
||||
.four .row { width: 180px; }
|
||||
.five .row { width: 225px; }
|
||||
.six .row { width: 270px; }
|
||||
.seven .row { width: 315px; }
|
||||
.eight .row { width: 360px; }
|
||||
.nine .row { width: 405px; }
|
||||
.ten .row { width: 450px; }
|
||||
.eleven .row { width: 495px; }
|
||||
.twelve .row { width: 540px; }
|
||||
.thirteen .row { width: 585px; }
|
||||
.fourteen .row { width: 630px; }
|
||||
.fifteen .row { width: 675px; }
|
||||
.sixteen .row { width: 720px; }
|
||||
.seventeen .row { width: 765px; }
|
||||
.eighteen .row { width: 810px; }
|
||||
.nineteen .row { width: 855px; }
|
||||
.twenty .row { width: 900px; }
|
||||
.twenty-one .row { width: 945px; }
|
||||
.twenty-two .row { width: 990px; }
|
||||
.twenty-three .row { width: 1035px; }
|
||||
.twenty-four .row { width: 1080px; }
|
||||
|
||||
|
||||
/* Slim (940/960) Grid */
|
||||
div.container.slim { position: relative; width: 940px; margin: 0 auto; padding: 0; }
|
||||
body.ie8 div.container.slim { position: static; }
|
||||
.slim .row { margin: 0 0 18px -20px; width: 960px; }
|
||||
.slim .column, .slim .columns { float: left; display: inline; margin: 0 0 0 20px; }
|
||||
|
||||
|
||||
.slim .one { width: 40px; }
|
||||
.slim .two { width: 100px; }
|
||||
.slim .three { width: 160px; }
|
||||
.slim .four { width: 220px; }
|
||||
.slim .five { width: 280px; }
|
||||
.slim .six { width: 340px; }
|
||||
.slim .seven { width: 400px; }
|
||||
.slim .eight { width: 460px; }
|
||||
.slim .nine { width: 520px; }
|
||||
.slim .ten { width: 580px; }
|
||||
.slim .eleven { width: 640px; }
|
||||
.slim .twelve { width: 700px; }
|
||||
.slim .thirteen { width: 760px; }
|
||||
.slim .fourteen { width: 820px; }
|
||||
.slim .fifteen { width: 880px; }
|
||||
.slim .sixteen { width: 940px; }
|
||||
.slim .one-half { width: 420px; padding-right: 10px; }
|
||||
.slim .one-third { width: 300px; }
|
||||
.slim .two-thirds { width: 580px; }
|
||||
.slim .ten .row { width: 600px; }
|
||||
.slim .eleven .row { width: 660px; }
|
||||
.slim .twelve .row { width: 760px; }
|
||||
|
||||
.slim .offset-by-one-half { margin-left: 50px; }
|
||||
.slim .offset-by-one { margin-left: 80px; }
|
||||
.slim .offset-by-two { margin-left: 140px; }
|
||||
.slim .offset-by-three { margin-left: 200px; }
|
||||
.slim .offset-by-four { margin-left: 260px; }
|
||||
.slim .offset-by-five { margin-left: 320px; }
|
||||
.slim .offset-by-six { margin-left: 380px; }
|
||||
.slim .offset-by-seven { margin-left: 440px; }
|
||||
.slim .offset-by-eight { margin-left: 500px; }
|
||||
.slim .offset-by-nine { margin-left: 560px; }
|
||||
.slim .offset-by-ten { margin-left: 620px; }
|
||||
.slim .offset-by-eleven { margin-left: 680px; }
|
||||
.slim .offset-by-twelve { margin-left: 740px; }
|
||||
.slim .offset-by-thirteen { margin-left: 800px; }
|
||||
.slim .offset-by-fourteen { margin-left: 880px; }
|
||||
|
||||
.slim .two .row { width: 120px; }
|
||||
.slim .three .row { width: 180px; }
|
||||
.slim .four .row { width: 240px; }
|
||||
.slim .five .row { width: 300px; }
|
||||
.slim .six .row { width: 360px; }
|
||||
.slim .seven .row { width: 420px; }
|
||||
.slim .eight .row { width: 480px; }
|
||||
.slim .nine .row { width: 540px; }
|
||||
.slim .ten .row { width: 600px; }
|
||||
.slim .eleven .row { width: 660px; }
|
||||
.slim .twelve .row { width: 720px; }
|
||||
.slim .thirteen .row { width: 780px; }
|
||||
.slim .fourteen .row { width: 840px; }
|
||||
.slim .fifteen .row { width: 900px; }
|
||||
.slim .sixteen .row { width: 960px; }
|
||||
.slim .one-half .row { width: 480px; }
|
||||
.slim .one-third .row { width: 320px; }
|
||||
.slim .two-thirds .row { width: 600px; }
|
||||
|
||||
|
||||
/* Clear the columns automagically */
|
||||
.row:after, .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
|
||||
* html .row, * html .clearfix { height: 1%; }
|
||||
.row, .clearfix { display: inline-block; }
|
||||
.row, .clearfix { display: block; }
|
||||
|
||||
|
||||
/* --------------------------------------------------
|
||||
:: Tables
|
||||
-------------------------------------------------- */
|
||||
table { background: #fff; -moz-border-radius: 3px; -webkit-border-radius: 3px; width: 100%; margin: 0 0 18px; border: 1px solid #ddd; }
|
||||
|
||||
table thead { background: #555; }
|
||||
table thead tr th,
|
||||
table tbody tr td { font-size: 12px; line-height: 18px; }
|
||||
table thead tr { }
|
||||
table thead tr th { padding: 8px 10px 9px; font-size: 14px; font-weight: bold; color: #fff; }
|
||||
table tbody { }
|
||||
table tbody tr { }
|
||||
table tbody tr.even,
|
||||
table tbody tr.alt { background: #f5f5f5; }
|
||||
body.safari table tbody tr:nth-child(even) { background: #f5f5f5; }
|
||||
table tbody tr td { color: #333; padding: 9px 10px; vertical-align: top; border: none; }
|
||||
|
||||
|
||||
/* Style the tables a bit lighter */
|
||||
table.alt { }
|
||||
table.alt thead { background: #f5f5f5; }
|
||||
table.alt thead tr th { color: #222; }
|
||||
table.alt thead tr th:first-child { border-left: none; }
|
||||
table.alt thead tr th:last-child { border-right: none; }
|
||||
|
||||
/* --------------------------------------------------
|
||||
:: Misc
|
||||
---------------------------------------------------*/
|
||||
.left { float: left; }
|
||||
.right { float: right; }
|
||||
.hide { display: none; }
|
||||
.highlight { background: #ff0; }
|
||||
|
||||
|
||||
86
css/forms.css
Normal file
86
css/forms.css
Normal file
@ -0,0 +1,86 @@
|
||||
/* Artfully masterminded by ZURB
|
||||
|
||||
Make sure to include the app.js if you are going to use inline label inputs
|
||||
*/
|
||||
|
||||
|
||||
/* -----------------------------------------
|
||||
Standard Forms
|
||||
----------------------------------------- */
|
||||
|
||||
form { margin: 0 0 18px; }
|
||||
form label { display: block; font-size: 13px; line-height: 18px; cursor: pointer; margin-bottom: 9px; }
|
||||
|
||||
input.input-text, textarea { border-right: 1px solid #bbb; border-bottom: 1px solid #bbb; }
|
||||
input.input-text, textarea, select { display: block; margin-bottom: 9px; }
|
||||
label + input.input-text, label + textarea, label + select, label + div.dropdown, select + div.dropdown { margin-top: -9px; }
|
||||
|
||||
/* Text input and textarea font and padding */
|
||||
input.input-text, textarea { font-size: 13px; padding: 4px 3px 2px; outline: none !important; background: #fff; }
|
||||
input.input-text.oversize, textarea.oversize { font-size: 18px !important; padding: 4px 5px !important; }
|
||||
input.input-text:focus, textarea:focus { background: #f9f9f9; }
|
||||
|
||||
/* Inlined Label Style */
|
||||
input.placeholder, textarea.placeholder { color: #888; }
|
||||
|
||||
/* Text input and textarea sizes */
|
||||
input.input-text, textarea { width: 254px; }
|
||||
input.small, textarea.small { width: 134px; }
|
||||
input.medium, textarea.medium { width: 254px; }
|
||||
input.large, textarea.large { width: 434px; }
|
||||
|
||||
/* Fieldsets */
|
||||
form fieldset { padding: 9px 9px 2px 9px; border: solid 1px #ddd; margin: 18px 0; }
|
||||
|
||||
/* Errors */
|
||||
input.input-text.red { border-color: red; background-color: rgba(255,0,0,0.15); }
|
||||
label.red { color: red; }
|
||||
small.error { margin-top: -6px; display: block; margin-bottom: 9px; font-size: 11px; color: red; width: 260px; }
|
||||
|
||||
.small + .error { width: 140px; }
|
||||
.medium + .error { width: 260px; }
|
||||
.large + .error { width: 440px; }
|
||||
|
||||
/* -----------------------------------------
|
||||
Nicer Forms
|
||||
----------------------------------------- */
|
||||
form.nice input.input-text, form.nice textarea { border: solid 1px #bbb; -webkit-border-radius: 3px; -moz-border-radius: 3px; }
|
||||
form.nice input.input-text, form.nice textarea { font-size: 13px; padding: 6px 3px 4px; outline: none !important; background: url(../images/misc/input-bg.png) #fff; }
|
||||
form.nice input.input-text:focus, form.nice textarea:focus { background-color: #f9f9f9; }
|
||||
|
||||
form.nice fieldset { -webkit-border-radius: 5px; -moz-border-radius: 5px; }
|
||||
|
||||
form.nice small.error { padding: 6px 4px; border: solid 0px red; border-width: 0px 1px 1px 1px; margin-top: -10px; background: red; color: #fff; font-size: 12px; font-weight: bold; -webkit-border-bottom-left-radius: 3px; -webkit-border-bottom-right-radius: 3px; -moz-border-radius-bottomleft: 3px; -moz-border-radius-bottomright: 3px; }
|
||||
|
||||
form.nice .small + .error { width: 132px; }
|
||||
form.nice .medium + .error { width: 252px; }
|
||||
form.nice .large + .error { width: 432px; }
|
||||
|
||||
/* -----------------------------------------
|
||||
Custom Forms
|
||||
----------------------------------------- */
|
||||
|
||||
form.custom span.custom { display: inline-block; width: 14px; height: 14px; position: relative; top: 2px; border: solid 1px #ccc; background: url(../images/misc/custom-form-sprites.png) 0 0 no-repeat; }
|
||||
form.custom span.custom.radio { border-radius: 7px; -webkit-border-radius: 7px; -moz-border-radius: 7px; }
|
||||
form.custom span.custom.radio.checked { background-position: 0px -14px; }
|
||||
form.custom span.custom.checkbox.checked { background-position: 0px -28px; }
|
||||
|
||||
form.custom div.custom.dropdown { position: relative; display: inline-block; width: auto; height: 28px; margin-bottom: 9px; }
|
||||
form.custom div.custom.dropdown a.current { display: block; width: auto; line-height: 26px; padding: 0 38px 0 6px; border: solid 1px #ddd; color: #141414; }
|
||||
form.custom div.custom.dropdown a.selector { position: absolute; width: 26px; height: 26px; display: block; background: url(../images/misc/custom-form-sprites.png) -14px 0 no-repeat; right: 0px; top: 0px; border: solid 1px #ddd; }
|
||||
form.custom div.custom.dropdown:hover a.selector,
|
||||
form.custom div.custom.dropdown.open a.selector { background-position: -14px -26px; }
|
||||
|
||||
form.custom div.custom.dropdown ul { position: absolute; width: auto; display: none; margin: 0; left: 0px; top: 27px; margin: 0; padding: 0; background: rgba(255,255,255,0.9); border: solid 1px #ddd; z-index: 10; }
|
||||
form.custom div.custom.dropdown ul li { cursor: pointer; padding: 3px 38px 3px 6px; margin: 0; }
|
||||
form.custom div.custom.dropdown ul li.selected { background: url(../images/misc/custom-form-sprites.png) right -52px no-repeat; }
|
||||
form.custom div.custom.dropdown ul li:hover { background-color: #2a85e8; color: #fff; }
|
||||
form.custom div.custom.dropdown ul li.selected:hover { background: url(../images/misc/custom-form-sprites.png) #2a85e8 right -78px no-repeat; }
|
||||
form.custom div.custom.dropdown ul.show { display: block; }
|
||||
|
||||
form.custom div.custom.dropdown.open ul { display: block; }
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
3
css/ie.css
Normal file
3
css/ie.css
Normal file
@ -0,0 +1,3 @@
|
||||
/* This is for all IE specfific style less than IE9 and
|
||||
we make IE 8 render like 7. We hate IE. */
|
||||
|
||||
0
css/layout.css
Normal file
0
css/layout.css
Normal file
201
css/orbit-1.2.3.css
Normal file
201
css/orbit-1.2.3.css
Normal file
@ -0,0 +1,201 @@
|
||||
/* CSS for jQuery Orbit Plugin 1.2.3
|
||||
* www.ZURB.com/playground
|
||||
* Copyright 2010, ZURB
|
||||
* Free to use under the MIT license.
|
||||
* http://www.opensource.org/licenses/mit-license.php
|
||||
|
||||
|
||||
|
||||
/* PUT IN YOUR SLIDER ID AND SIZE TO MAKE LOAD BEAUTIFULLY
|
||||
================================================== */
|
||||
#featured {
|
||||
width: 940px;
|
||||
height: 450px;
|
||||
background: #000 url('orbit/loading.gif') no-repeat center center;
|
||||
overflow: hidden; }
|
||||
#featured>img,
|
||||
#featured>div,
|
||||
#featured>a { display: none; }
|
||||
|
||||
|
||||
|
||||
|
||||
/* CONTAINER
|
||||
================================================== */
|
||||
|
||||
div.orbit-wrapper {
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
position: relative; }
|
||||
|
||||
div.orbit {
|
||||
width: 1px;
|
||||
height: 1px;
|
||||
position: relative;
|
||||
overflow: hidden }
|
||||
|
||||
div.orbit>img {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
display: none; }
|
||||
|
||||
div.orbit>a {
|
||||
border: none;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
line-height: 0;
|
||||
display: none; }
|
||||
|
||||
.orbit>div {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%; }
|
||||
|
||||
/* Note: If your slider only uses content or anchors, you're going to want to put the width and height declarations on the ".orbit>div" and "div.orbit>a" tags in addition to just the .orbit-wrapper */
|
||||
|
||||
|
||||
/* TIMER
|
||||
================================================== */
|
||||
|
||||
div.timer {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
opacity: .6;
|
||||
cursor: pointer;
|
||||
z-index: 1001; }
|
||||
|
||||
span.rotator {
|
||||
display: block;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: -20px;
|
||||
background: url(orbit/rotator-black.png) no-repeat;
|
||||
z-index: 3; }
|
||||
|
||||
span.mask {
|
||||
display: block;
|
||||
width: 20px;
|
||||
height: 40px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
z-index: 2;
|
||||
overflow: hidden; }
|
||||
|
||||
span.rotator.move {
|
||||
left: 0 }
|
||||
|
||||
span.mask.move {
|
||||
width: 40px;
|
||||
left: 0;
|
||||
background: url(orbit/timer-black.png) repeat 0 0; }
|
||||
|
||||
span.pause {
|
||||
display: block;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background: url(orbit/pause-black.png) no-repeat;
|
||||
z-index: 4;
|
||||
opacity: 0; }
|
||||
|
||||
span.pause.active {
|
||||
background: url(orbit/pause-black.png) no-repeat 0 -40px }
|
||||
|
||||
div.timer:hover span.pause,
|
||||
span.pause.active {
|
||||
opacity: 1 }
|
||||
|
||||
|
||||
/* CAPTIONS
|
||||
================================================== */
|
||||
|
||||
.orbit-caption {
|
||||
display: none;
|
||||
font-family: "HelveticaNeue", "Helvetica-Neue", Helvetica, Arial, sans-serif; }
|
||||
|
||||
.orbit-wrapper .orbit-caption {
|
||||
background: #000;
|
||||
background: rgba(0,0,0,.6);
|
||||
z-index: 1000;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
padding: 7px 0;
|
||||
font-size: 13px;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
width: 100%; }
|
||||
|
||||
|
||||
/* DIRECTIONAL NAV
|
||||
================================================== */
|
||||
|
||||
div.slider-nav {
|
||||
display: block }
|
||||
|
||||
div.slider-nav span {
|
||||
width: 78px;
|
||||
height: 100px;
|
||||
text-indent: -9999px;
|
||||
position: absolute;
|
||||
z-index: 1000;
|
||||
top: 50%;
|
||||
margin-top: -50px;
|
||||
cursor: pointer; }
|
||||
|
||||
div.slider-nav span.right {
|
||||
background: url(orbit/right-arrow.png);
|
||||
right: 0; }
|
||||
|
||||
div.slider-nav span.left {
|
||||
background: url(orbit/left-arrow.png);
|
||||
left: 0; }
|
||||
|
||||
/* BULLET NAV
|
||||
================================================== */
|
||||
|
||||
.orbit-bullets {
|
||||
position: absolute;
|
||||
z-index: 1000;
|
||||
list-style: none;
|
||||
bottom: -40px;
|
||||
left: 50%;
|
||||
margin-left: -50px;
|
||||
padding: 0; }
|
||||
|
||||
.orbit-bullets li {
|
||||
float: left;
|
||||
margin-left: 5px;
|
||||
cursor: pointer;
|
||||
color: #999;
|
||||
text-indent: -9999px;
|
||||
background: url(orbit/bullets.jpg) no-repeat 4px 0;
|
||||
width: 13px;
|
||||
height: 12px;
|
||||
overflow: hidden; }
|
||||
|
||||
.orbit-bullets li.active {
|
||||
color: #222;
|
||||
background-position: -8px 0; }
|
||||
|
||||
.orbit-bullets li.has-thumb {
|
||||
background: none;
|
||||
width: 100px;
|
||||
height: 75px; }
|
||||
|
||||
.orbit-bullets li.active.has-thumb {
|
||||
background-position: 0 0;
|
||||
border-top: 2px solid #000; }
|
||||
208
css/ui.css
Normal file
208
css/ui.css
Normal file
@ -0,0 +1,208 @@
|
||||
/* Artfully masterminded by ZURB */
|
||||
|
||||
|
||||
|
||||
/* --------------------------------------------------
|
||||
Table of Contents
|
||||
-----------------------------------------------------
|
||||
:: Buttons
|
||||
:: Notices/Alerts
|
||||
:: Tabs
|
||||
:: Pagination
|
||||
:: Lists
|
||||
:: Panels
|
||||
*/
|
||||
|
||||
|
||||
|
||||
|
||||
/* --------------------------------------------------
|
||||
Buttons
|
||||
-------------------------------------------------- */
|
||||
|
||||
.button {
|
||||
background: #00a6fc;
|
||||
display: inline-block;
|
||||
padding: 9px 34px 11px;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
font-weight: bold;
|
||||
line-height: 1;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.button.nice {
|
||||
background: #00a6fc url(../images/misc/button-gloss.png) repeat-x 0 -34px;
|
||||
-moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.5);
|
||||
-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.5);
|
||||
text-shadow: 0 -1px 1px rgba(0,0,0,0.28);
|
||||
background: #00a6fc url(../images/misc/button-gloss.png) repeat-x 0 -34px, -moz-linear-gradient(top, rgba(255,255,255,.4) 0%, transparent 100%);
|
||||
background: #00a6fc url(../images/misc/button-gloss.png) repeat-x 0 -34px, -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,.4)), color-stop(100%,transparent));
|
||||
border: 1px solid #0593dc;
|
||||
-webkit-transition: all .15s ease-in-out;
|
||||
-moz-transition: all .15s ease-in-out;
|
||||
-o-transition: all .15s ease-in-out;
|
||||
}
|
||||
|
||||
.button.radius {
|
||||
-moz-border-radius: 3px;
|
||||
-webkit-border-radius: 3px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
.button.round {
|
||||
-moz-border-radius: 1000px;
|
||||
-webkit-border-radius: 1000px;
|
||||
border-radius: 1000px;
|
||||
}
|
||||
|
||||
.button.full-width {
|
||||
width: 100%;
|
||||
padding-left: 0 !important;
|
||||
padding-right: 0 !important;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.button.left-align {
|
||||
text-align: left;
|
||||
text-indent: 12px;
|
||||
}
|
||||
|
||||
.button:active {}
|
||||
|
||||
/* Sizes ---------- */
|
||||
.small.button { font-size: 11px; padding: 8px 20px 10px; }
|
||||
.medium.button { font-size: 13px; }
|
||||
.large.button { font-size: 18px; padding: 11px 48px 13px; }
|
||||
|
||||
/* Nice Sizes ---------- */
|
||||
.nice.small.button { background-position: 0 -36px; }
|
||||
.nice.large.button { background-position: 0 -30px; }
|
||||
|
||||
/* Colors ---------- */
|
||||
.blue.button { background-color: #00a6fc; }
|
||||
.red.button { background-color: #e91c21; }
|
||||
.white.button { background-color: #e9e9e9; color: #333; }
|
||||
.charcoal.button { background-color: #141414; }
|
||||
|
||||
/* Nice Colors ---------- */
|
||||
.nice.blue.button { border: 1px solid #0593dc; }
|
||||
.nice.red.button { border: 1px solid #b90b0b; }
|
||||
.nice.white.button { border: 1px solid #cacaca; text-shadow: none !important; }
|
||||
.nice.charcoal.button { border: 1px solid #000; }
|
||||
|
||||
/* Hovers ---------- */
|
||||
.button:hover { background-color: #0192dd; color: #fff; }
|
||||
.blue.button:hover { background-color: #0192dd; }
|
||||
.red.button:hover { background-color: #d01217; }
|
||||
.white.button:hover { background-color: #dadada; color: #333; }
|
||||
.charcoal.button:hover { background-color: #000; }
|
||||
|
||||
|
||||
|
||||
/* --------------------------------------------------
|
||||
Tabs
|
||||
-------------------------------------------------- */
|
||||
dl.tabs { display: block; margin: 0 0 20px 0; padding: 0; height: 30px; border-bottom: solid 1px #ddd; }
|
||||
dl.tabs dt { display: block; width: auto; height: 30px; padding: 0px 9px 0 20px; line-height: 30px; float: left; color: #999; font-size: 11px; text-transform: uppercase; cursor: default; }
|
||||
dl.tabs dt:first-child { padding: 0 9px 0 0px; }
|
||||
dl.tabs dd { display: block; width: auto; height: 30px; padding: 0; float: left; }
|
||||
dl.tabs dd a { display: block; width: auto; height: 29px; padding: 0px 9px; line-height: 30px; border: solid 1px #ddd; margin: 0; color: #555; background: #eee; }
|
||||
dl.tabs dd a.active { background: #fff; border-width: 1px 1px 0px 1px; height: 30px; margin: 0 -1px 0 0 }
|
||||
|
||||
.nice.tabs { border-bottom: solid 1px #eee; margin: 0 0 30px 0; height:43px; }
|
||||
.nice.tabs dd a { padding: 7px 18px 9px; font-size: 15px; color: #555555; background: none; border: none; }
|
||||
.nice.tabs dd a.active { font-weight: bold; color: #333; background: #fff; border-left: 1px solid #eee; border-right: 1px solid #eee; border-top: 3px solid #00a6fc; margin: 0 10px; position: relative; top: -5px; }
|
||||
.nice.tabs dd:first-child a.active { margin-left: 0; }
|
||||
|
||||
ul.tabs-content { margin: 0; display: block; }
|
||||
ul.tabs-content > li { display:none; }
|
||||
ul.tabs-content > li.active { display: block; }
|
||||
|
||||
dl.contained, dl.nice.contained { margin-bottom: 0px; }
|
||||
dl.contained.tabs dd a { padding: 0px 14px; }
|
||||
dl.nice.contained.tabs dd a { padding: 7px 18px 9px; }
|
||||
ul.contained.tabs-content { padding: 0; }
|
||||
ul.contained.tabs-content li { padding: 20px; border: solid 0px #ddd; border-width: 0px 1px 1px 1px; }
|
||||
ul.nice.contained.tabs-content li { border-color: #eee; }
|
||||
|
||||
/* --------------------------------------------------
|
||||
Pagination
|
||||
-------------------------------------------------- */
|
||||
ul.pagination { display: block; height: 24px; margin-left: -5px; }
|
||||
ul.pagination li { float: left; display: block; height: 24px; color: #999; font-size: 15px; margin-left: 5px; }
|
||||
ul.pagination li a { display: block; padding: 6px 7px 4px; color: #555; }
|
||||
ul.pagination li.current a, ul.pagination li:hover a { border-bottom: solid 2px #00a6fc; color: #141414; }
|
||||
ul.pagination li.unavailable a { cursor: default; color: #999; }
|
||||
ul.pagination li.unavailable:hover a { border-bottom: none; }
|
||||
|
||||
|
||||
/* --------------------------------------------------
|
||||
Lists
|
||||
-------------------------------------------------- */
|
||||
ul.nice, ol.nice { list-style: none; margin: 0; }
|
||||
ul.nice li, ol.nice li { padding-left: 13px; position: relative }
|
||||
ul.nice li span.bullet, ol.nice li span.number { position: absolute; left: 0px; top: 0px; color: #ccc; }
|
||||
|
||||
|
||||
/* --------------------------------------------------
|
||||
Notices/Alerts
|
||||
---------------------------------------------------*/
|
||||
/* Alerts cannot be closed and notices can */
|
||||
|
||||
.notice, .alert {
|
||||
position: relative;
|
||||
background: #222 url(../images/misc/button-overlay.png) repeat-x bottom;
|
||||
width: 100%;
|
||||
margin: 10px 0;
|
||||
-moz-border-radius: 3px;
|
||||
-webkit-border-radius: 3px;
|
||||
border-radius: 3px;
|
||||
color: #fff;
|
||||
text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
|
||||
font-weight: bold;
|
||||
}
|
||||
.notice>span, .alert>span {
|
||||
display: block;
|
||||
padding: 5px 10px 6px;
|
||||
}
|
||||
.notice a.close {
|
||||
font-size: 20px;
|
||||
line-height: .5;
|
||||
color: #fff;
|
||||
text-shadow: 0 -1px 1px rbga(0,0,0,.25);
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
position: absolute;
|
||||
right: 10px;
|
||||
top: 6px;
|
||||
}
|
||||
|
||||
/* NOTES
|
||||
|
||||
Close button entity is ×
|
||||
Sample Markup:
|
||||
<div class="notice"><span>
|
||||
This is awesome
|
||||
<a class="close" href="#">×</a>
|
||||
</span></div>
|
||||
|
||||
*/
|
||||
|
||||
|
||||
|
||||
/* --------------------------------------------------
|
||||
Panels
|
||||
-------------------------------------------------- */
|
||||
div.panel {
|
||||
padding: 20px 20px 2px 20px;
|
||||
background: #efefef;
|
||||
background: -moz-linear-gradient(top, #FFFFFF 0%, #F4F4F4 100%);
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FFFFFF), color-stop(100%,#F4F4F4));
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='#F4F4F4',GradientType=0 );
|
||||
-webkit-box-shadow: 0px 2px 5px rgba(0,0,0,0.15);
|
||||
-moz-box-shadow: 0px 2px 5px rgba(0,0,0,0.25);
|
||||
margin: 0 0 20px 0;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user