/*
99Lime.com HTML KickStart by Joshua Gatcke
kickstart.css
Don't edit the file if you want HTML KickStart to be upgradeable.
Instead, copy any CSS selectors you want to modify to your style.css file.
// Colors
blue: #4D99E0;
*/
/*---------------------------------
IMPORTS
-----------------------------------
@import url(kickstart-buttons.css);
@import url(kickstart-forms.css);*/
@import url(kickstart-menus.css);
@import url(kickstart-grid.css);
@import url(jquery.fancybox-1.3.4.css);
@import url(kickstart-slideshow.css);
/*
@import url(prettify.css);
@import url(tiptip.css);
@import url(fonts/font-awesome-4.2.0/css/font-awesome.min.css);
---------------------------------
HTML ELEMENTS
-----------------------------------*/
* { -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ -moz-box-sizing: border-box; /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */ }
a { color: #4D99E0; outline: 0; }
.caption, a.lightbox {text-decoration:none !important;}
a:active { color: inherit; }
a:visited { }
a:hover { }
a img { border: 0; }
a [class^="icon-"] { color: inherit; text-decoration: none; }
strong, b { font-weight: bold; }
strike { }
em, i { }
.hide { display: none; }
.show { display: block; }
/*---------------------------------
UTILITY
-----------------------------------*/
.center { text-align: center; }
.left { text-align: left; }
.right { text-align: right; }
.justify { text-align:justify}
/*---------------------------------
HR
-----------------------------------*/
hr { clear: both; border-bottom: 0; border-top: 1px dotted #ccc; border-right: 0; border-left: 0; margin: 20px 0; min-height: 0; height: 1px; }
form hr { clear: both; border-bottom: 0; border-top: 1px dotted #ccc; border-right: 0; border-left: 0; margin: 10px 0; min-height: 0; height: 1px; }
hr.alt1 { border-style: solid; }
hr.alt2 { border-style: dashed; }
/*---------------------------------
HTML5 ELEMENTS (shim)
-----------------------------------*/
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, main { display: block; }
/*---------------------------------
PARAGRAPHS
-----------------------------------*/
p { margin: 10px 0; }
/*---------------------------------
BLOCKQUOTES
-----------------------------------*/
blockquote {
margin: 1.5em 10px;
padding: 0.5em 10px;
quotes: "\201C""\201D""\2018""\2019";
font-size: 1.5em; line-height: 1.5em; font-style: italic; /*margin: 30px 30px 30px 0; padding: 0 0 0 20px;*/ border-left: 1px solid #ccc; }
blockquote:before {
font-family:"Libre Baskerville","Times New Roman", Times, serif;
color: #ccc;
content: "\201C";
font-size: 3em;
line-height: 0.1em;
margin-right: 0.25em;
vertical-align: -0.4em;
}
blockquote:before {
}
blockquote.pushRight { }
blockquote.pushRight {
background: #efefef;
border-left: 10px solid #ccc;
margin: 30px 30px 30px 5%;
padding: 0.5em 10px;
quotes: "\201C""\201D""\2018""\2019";
}
blockquote.pushRight:before {
color: #ccc;
content: \201C;
font-size: 4em;
line-height: 0.1em;
margin-right: 0.25em;
vertical-align: -0.4em;
}
blockquote span { font-size: 0.7em; display: block; text-align:right; font-weight: bold; margin-right: 5%;}
blockquote.small { font-size: 1.2em; }
blockquote.p {display:inline}
/*---------------------------------
LISTS
-----------------------------------*/
ul, ol { padding: 0; margin: 0 0 20px 65px; }
ul.flushLeft, ol.flushLeft { padding: 0; margin: 0 0 20px 20px; }
li { padding: 5px 0; margin: 0; }
ul li ul { padding: 0; margin: 0 0 0px 65px; }
ul.list-unstyled { padding: 0; margin: 0 0 20px 0; }
ul.list-unstyled li { padding: 5px 0; margin: 0; list-style-type: none; }
ul.alt { padding: 0; margin: 0 0 20px 0; }
ul.alt li { list-style-type: none; border-top: 1px dotted #ccc; border-bottom: 1px dotted #ccc; margin: 0 0 -1px 0; background: url(img/icon-arrow-right.png) no-repeat 5px 0.7em; padding-left: 20px; }
ul.icons { margin: 0 0 20px 0; padding: 0; }
ul.icons li { list-style-type: none; margin: 0; padding: 5px 0; }
ol ol { list-style:lower-alpha}
/*---------------------------------
TABLES
-----------------------------------*/
table { width: 100%; margin: 0 0 10px 0; text-align: left; border-collapse: collapse; }
thead, tbody { margin: 0; padding: 0; }
th, td { padding: 7px 10px; font-size: 0.9em; border-bottom: 1px dotted #ddd; text-align: left; }
thead th { font-size: 0.9em; padding: 3px 10px; border-bottom: 1px solid #ddd; }
tbody tr.last th, tbody tr.last td { border-bottom: 0; }
/* striped */
table.striped { }
table.striped tr.alt { background: #f5f5f5; }
table.striped thead th { background: #fff; }
table.striped tbody th { background: #f5f5f5; text-align: right; padding-right: 15px; border-right: 1px dotted #e5e5e5; }
table.striped tbody tr.alt th { background: #efefef; }
/* tight */
table.tight { }
table.tight th, .tight td { padding: 2px 10px; }
/* sortable */
table.sortable { border: 1px solid #ddd; }
table.sortable thead th { cursor: pointer; position: relative; top: 0; left: 0; border-right: 1px solid #ddd; }
table.sortable thead th:hover { background: #efefef; }
table.sortable span.arrow { border-style: solid; border-width: 5px; display: block; position: absolute; top: 50%; right: 5px; font-size: 0; border-color: #ccc transparent transparent transparent; line-height: 0; height: 0; width: 0; margin-top: -2px; }
table.sortable span.arrow.up { border-color: transparent transparent #ccc transparent; margin-top: -7px; }
/*---------------------------------
TABS
-----------------------------------*/
ul.tabs { margin: 10px 0 -1px 0; padding: 0; width: 100%; border-bottom: 1px solid #e5e5e5; float: left; font-size: 0; }
ul.tabs.left { text-align: left; }
ul.tabs.center { text-align: center; }
ul.tabs.right { text-align: right; }
ul.tabs.right li { margin: 0 0 0 -2px; }
ul.tabs li { font-size: 14px; list-style-type: none; margin: 0 -2px 0 0; padding: 0; display: inline-block; *display:inline;/*IE ONLY*/
position: relative; top: 0; left: 0; *top:1px;/*IE 7 ONLY*/
zoom: 1; }
ul.tabs li a { text-decoration: none; color: #666; display: inline-block; padding: 9px 15px; position: relative; top: 0; left: 0; line-height: 100%; background: #f5f5f5; -webkit-box-shadow: inset 0 -3px 3px rgba(0,0,0,0.03); -moz-box-shadow: inset 0 -3px 3px rgba(0,0,0,0.03); box-shadow: inset 0 -3px 3px rgba(0,0,0,0.03); border: 1px solid #e5e5e5; border-bottom: 0; font-size: 0.9em; zoom: 1; }
ul.tabs li a:hover { background: #fff; }
ul.tabs li.current a { position: relative; top: 1px; left: 0; background: #fff; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; color: #222; }
.tab-content { border: 1px solid #efefef; border: 1px solid #e5e5e5; background: #fff; clear: both; padding: 20px; margin: 0 0 40px 0; }
/*---------------------------------
BREADCRUMBS
-----------------------------------*/
ul.breadcrumbs { margin: 10px 0; padding: 0; line-height: 0%; font-size: 0; }
ul.breadcrumbs li { list-style-type: none; margin: 0; padding: 0; display: inline-block; *display:inline; /* IE ONLY*/
position: relative; zoom: 1; line-height: 100%; font-size: 14px; /* 0.8em default to override font-size:0; on parent*/ }
ul.breadcrumbs li a { display: inline-block; *display:inline; /* IE ONLY*/
position: relative; padding: 5px 15px 5px 5px; font-size: 0.9em; zoom: 1; margin: 0; background: url(img/icon-arrow-right.png) no-repeat right center; }
ul.breadcrumbs li.last a { color: #333; cursor: default; text-decoration: none; background: none; }
ul.breadcrumbs li.last a:hover { text-decoration: none; }
/* Alternative Style */
ul.breadcrumbs.alt1 { border: 1px solid transparent; font-size: 0; }
ul.breadcrumbs.alt1 li a { padding: 10px 25px 10px 15px; background: url(img/breadcrumbs-bg.gif) no-repeat right center; text-decoration: none; border-top: 1px solid #efefef; border-bottom: 1px solid #efefef; font-size: 12px; }
ul.breadcrumbs.alt1 a:hover { text-decoration: underline; }
ul.breadcrumbs.alt1 li.first a { border-left: 1px solid #efefef; }
ul.breadcrumbs.alt1 li.last a { background: none; border-right: 1px solid #efefef; }
/*---------------------------------
SLIDESHOW2
-----------------------------------*/
.slideshow-wrap { clear: both; margin: 0; padding: 0; position: relative; top: 0; left: 0; overflow: hidden; clear: both; }
.slideshow-inner { overflow: hidden; clear: both; position: relative; top: 0; left: 0; border: 1px solid #efefef; }
.slideshow { clear: both; margin: 0; padding: 0; width: auto; height: 100%; overflow: hidden; }
.slideshow li { list-style-type: none; margin: 0; padding: 0; float: left; display: block; }
.slideshow img { vertical-align: bottom; }
.slideshow-buttons { text-align: right; margin: 3px 0 0 0; padding: 0; }
.slideshow-buttons li { display: inline; position: relative; top: 0; left: 0; line-height: 100%; margin: 0; padding: 0; }
.slideshow-buttons li.current a { background: #ddd; }
.slideshow-buttons a { display: inline; position: relative; top: 0; left: 0; padding: 1px 3px; margin: 0 1px; line-height: 100%; border: 1px solid #efefef; text-decoration: none; font-size: 0.8em; }
/*
99Lime.com HTML KickStart by Joshua Gatcke
kickstart-buttons.css
Super Easy Cross Browser CSS3 Gradients
http://www.colorzilla.com/gradient-editor/
*/
/*---------------------------------
FORMS
-----------------------------------*/
form { padding: 0; margin: 0; }
form input[class*="col_"] ,form textarea[class*="col_"] { margin-left: 0; margin-right: 0; margin-top: 0.15em; margin-bottom: 0.45em; float: left; display: block; }
form div[class*="col_"] { margin-left: .25em; margin-right: .25em; margin-top: 0.0em; margin-bottom: 0.0em; float: left; display: block; }
fieldset { margin: 30px 0 20px 0; padding: 5px 15px 25px 15px; border: 1px solid #ccc; background: #f5f5f5; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; position: relative; top: 0; left: 0; }
legend, .legend { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; border: 1px solid #ccc; background:/* #f5f5f5*/ #777; color: #fff; ; padding: 2px 10px; margin: 0 0 0 0; display: inline-block; position: relative; top: 0; left: 0; }
/*IE ONLY - I know, this is a stop gap*/
.msie fieldset { padding-top: 25px; }
.msie legend { position: absolute; top: -0.7em; left: 10px; }
label + input[class*="col_"], label + textarea[class*="col_"], label + select[class*="col_"] { margin-top: -.2em; }
label { display: inline-block; *display:inline;
vertical-align: middle; margin: 0; padding: 0; position: relative; top: 0; left: 0; zoom: 1; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; margin-left: .1em; }
label.inline { display: inline; margin: 0;font-size: 0.9em; }
label span { color: #999; font-size: 0.9em; }
label span.right { position: absolute; bottom: 0; right: 0; text-align: right; display: inline-block; *display:inline;}
label.disabled { color: #ccc; }
input.innerShadow, textarea.innerShadow { -moz-box-shadow: inset 0 0 6px #ccc; -webkit-box-shadow: inset 0 1px 6px #ccc; box-shadow: inset 0 1px 6px #ccc; }
input.Round { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
input { display: inline-block; *display:inline;
vertical-align: middle; width: auto; zoom: 1; margin: 0; border: 1px solid #ccc; font-size: 1em; padding: 5px 0; text-indent: 5px; background: #fff; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
::-webkit-input-placeholder { color:#ccc; } :-moz-placeholder { color:#ccc; } ::-moz-placeholder { color:#ccc; } :-ms-input-placeholder { color:#ccc; } input::-moz-focus-inner { border:0; } input::-moz-focus-inner { border:0; }
input[disabled="disabled"], input.disabled,input[readonly="readonly"], input.readonly,textarea[readonly="readonly"],textarea[readonly="readonly"] { border:1px solid #fff; border-bottom: 1px solid #ddd;/*padding-bottom:0;*/ }
textarea[readonly="readonly"] { height:auto; }
input:not([value=""]):not(:focus):invalid { border: 1px solid red; border-left: 4px solid red; color:red; }
input:required:valid,textarea:required:valid { border-left: 4px solid green; }
/* FOCUS STATES */
input[type="text"]:focus, textarea:focus, button:focus, a.button:focus, select:focus, input[type="file"]:focus, input[type="password"]:focus { -webkit-box-shadow: 0 0 7px #6DB9FF; -moz-box-shadow : 0 0 7px #6DB9FF; box-shadow : 0 0 7px #6DB9FF; border: 1px solid #50B1FE; outline: none;}
input[disabled="disabled"]:focus, input.disabled:focus,input[readonly="readonly"]:focus, input.readonly,textarea[readonly="readonly"]:focus {
-webkit-box-shadow: none; -moz-box-shadow :none; box-shadow :none;
border:1px solid #fff; border-bottom: 1px solid #ccc; opacity: 0.5; cursor:not-allowed; }
button:disabled,
input[type="submit"]:disabled { opacity: 0.5; cursor:not-allowed; }
input.checkbox, input[type="checkbox"] { display: inline; width: auto; margin: 0; padding: 0; border: 0; background: none; vertical-align: center; *vertical-align: top;}
input.radio, input[type="radio"] { display: inline; width: auto; margin: 0; padding: 0; border: 0; background: none; vertical-align: center; *vertical-align: top;}
input[type="radio"]:focus, input[ type="checkbox"]:focus { -webkit-box-shadow: 0 0 5px #6DB9FF; -moz-box-shadow : 0 0 5px #6DB9FF; box-shadow : 0 0 5px #6DB9FF; outline-color: #6DB9FF; }
input.file, input[type="file"] { /*font-size:0.8em;*/ -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; border: none; }
select { display: inline; width: auto; margin: 0; border: 1px solid #ccc; line-height: 100%; padding:5px 0px; text-indent: 5px; font-size: 1em; vertical-align: middle; }
select[disabled="disabled"], select.disabled { color: #999; background: #f5f5f5; -moz-box-shadow: inset 0 0 2px #ddd; -webkit-box-shadow: inset 0 1px 2px #ddd; box-shadow: inset 0 1px 2px #ddd; }
textarea { width: auto; height: 200px; margin: 0; border: 1px solid #ccc; padding: 5px; vertical-align: middle; font-family: inherit; font-size: 1em; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
/*---------------------------------
COLUMN SIZES
-----------------------------------*/
/* sizes */
input[class*="col_"], select[class*="col_"], label[class*="col_"] { float: none; display: inline-block; *display:inline;
margin-bottom: 0; }
/*---------------------------------
FORMS VERTICAL
-----------------------------------*/
form.vertical { }
form.vertical label { display: block; }
form.vertical input, form.vertical select, form.vertical textarea { width: 100%; display: block; margin-bottom: 10px; }
form.vertical .chzn-container { display: block; margin-bottom: 10px; }
form.vertical .chzn-choices { display: block; margin-bottom: 10px; }
/* radios & checks */
form.vertical input.checkbox, form.vertical input[type="checkbox"], form.vertical input.radio, form.vertical input[type="radio"], form.vertical label.inline { display: inline; width: auto; margin: 0; }
/*---------------------------------
FORM VALIDATION
-----------------------------------*/
label.error { color: red; padding: 4px 0 0 4px; }
input.error, textarea.error { border: 1px solid red; }
input.valid, textarea.valid { border: 1px solid green; }
select.error { border: 1px solid red; }
/*---------------------------------
NOTICES
-----------------------------------*/
.notice { border: 1px solid #222; background: #8e8d8d; color: #fff; padding: 10px 20px 10px 40px; margin: 10px 0; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; line-height: 120%; vertical-align: center; text-shadow: 0px 1px rgba(201,201,201,0.5); position: relative; top: 0; left: 0; clear: both; }
.notice.warning { border: 1px solid #F30; background:#F60; color: white; }
.notice.error { border: 1px solid red; background: #900; color: white; }
.notice.success { border: 1px solid green; background: lightgreen; color: green; }
.notice i[class*='fa-'] { position: absolute; top: 50%; left: 0.8em; margin-top: -0.6em; }
.notice a[class*='fa-remove'], .notice a[class*='fa-remove']:active, .notice a[class*='fa-remove']:visited { text-decoration: none; font-size: 12px; position: absolute; top: 5px; right: 5px; left: auto; color: inherit; margin-top: 0; left: auto; }
/*---------------------------------
BUTTONS
-----------------------------------*/
button, a.btn, a.btn:visited, a.button, a.button:visited, input[type="submit"], input[type="reset"], input[type="button"] { position: relative; top: 0; left: 0; vertical-align: middle; margin: 0; padding: 10px 15px; line-height: 100%; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; cursor: pointer; width: auto; overflow: visible; font-weight: normal; font-size: 14px; color: #000; text-decoration: none; vertical-align: middle; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; display: inline-block; *display:inline;
zoom: 1; background: rgb(222,222,222); border: 1px solid #bbb;
-webkit-box-shadow: none; -moz-box-shadow: none; box-shadow:none; }
button:active, a.btn:active, a.btn:visited:active, a.button:active, a.button:visited:active, input[type="submit"]:active, input[type="reset"]:active, input[type="button"]:active {}
button[disabled], .disabled:active { -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; }
button, input[type="submit"], input[type="reset"], input[type="button"] { *padding:7px 15px;}/*IE 7 ONLY*/
a.btn, a.button { }/*overrides*/
button.small, a.btn.small, a.button.small { font-size: 0.8em; padding: 5px 10px; }
button.medium, a.btn.medium, a.button.medium { }/*default*/
button.large, a.btn.large, a.button.large, input.large { font-size: 1.3em; padding: 10px 20px; }
button.disabled, a.btn.disabled, a.button.disabled { color: #ccc; cursor: default; background: #efefef; }
button.disabled:hover, a.btn.disabled:hover, a.button.disabled:hover { border: 1px solid #ccc; background: #efefef; }
button:hover, a.btn:hover, a.button:hover, input[type="submit"]:hover, input[type="reset"]:hover, input[type="button"]:hover { border: 1px solid #bbb; background: rgb(232,232,232); }
button.buttonGrad:hover, a.btn.buttonGrad:hover, a.button.buttonGrad:hover, input[type="submit"].buttonGrad:hover, input[type="reset"].buttonGrad:hover, input[type="button"].buttonGrad:hover { border: 1px solid #bbb; background: rgb(252,252,252); /* Old browsers */ background: -moz-linear-gradient(top, rgba(252,252,252,1) 0%, rgba(237,237,237,1) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(252,252,252,1)), color-stop(100%, rgba(237,237,237,1))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(252,252,252,1) 0%, rgba(237,237,237,1) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(252,252,252,1) 0%, rgba(237,237,237,1) 100%); /* Opera11.10+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#ededed', GradientType=0 ); /* IE6-9 */
background: linear-gradient(top, rgba(252,252,252,1) 0%, rgba(237,237,237,1) 100%); /* W3C */ }
/*---------------------------------
BUTTON BAR
-----------------------------------*/
ul.button-bar { display: inline-block; *display:inline;
margin: 0; padding: 0; font-size: 0; position: relative; top: 0; left: 0; zoom: 1; border: 0; background: 0; }
ul.button-bar li { display: inline-block; *display:inline;
position: relative; top: 0; left: 0; zoom: 1; margin: 0 -1px 0 0; padding: 0; line-height: 100%; font-size: 0px; border: 1px solid #ccc; background: rgb(252,252,252); /* Old browsers */ background: -moz-linear-gradient(top, rgba(252,252,252,1) 0%, rgba(224,224,224,1) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(252,252,252,1)), color-stop(100%, rgba(224,224,224,1))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(252,252,252,1) 0%, rgba(224,224,224,1) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(252,252,252,1) 0%, rgba(224,224,224,1) 100%); /* Opera11.10+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#e0e0e0', GradientType=0 ); /* IE6-9 */
background: linear-gradient(top, rgba(252,252,252,1) 0%, rgba(224,224,224,1) 100%); /* W3C */ }
ul.button-bar li a { margin: 0; display: inline-block; *display:inline;
padding: 7px 10px; position: relative; top: 0; left: 0; zoom: 1; font-weight: normal; font-size: 16px; /*Pixels for consistancy*/ text-shadow: 0 1px 0 #fff; color: #000; text-decoration: none; vertical-align: middle; line-height: 100%; border-left: 1px solid #fff; }
ul.button-bar li.first, ul.button-bar li.first a { -moz-border-radius-bottomleft: 5px; -moz-border-radius-topleft: 5px; -webkit-border-bottom-left-radius: 5px; -webkit-border-top-left-radius: 5px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; -moz-background-clip: content-box; -webkit-background-clip: border; background-clip: content-box; }
ul.button-bar li.last, ul.button-bar li.last a { -moz-border-radius-bottomright: 5px; -moz-border-radius-topright: 5px; -webkit-border-bottom-right-radius: 5px; -webkit-border-top-right-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; -moz-background-clip: content-box; -webkit-background-clip: border; }
ul.button-bar li a:hover { background: rgb(252,252,252); /* Old browsers */ background: -moz-linear-gradient(top, rgba(252,252,252,1) 0%, rgba(237,237,237,1) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(252,252,252,1)), color-stop(100%, rgba(237,237,237,1))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(252,252,252,1) 0%, rgba(237,237,237,1) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(252,252,252,1) 0%, rgba(237,237,237,1) 100%); /* Opera11.10+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#ededed', GradientType=0 ); /* IE6-9 */
background: linear-gradient(top, rgba(252,252,252,1) 0%, rgba(237,237,237,1) 100%); /* W3C */ }
ul.button-bar li a:active { -webkit-box-shadow: inset 0 3px 5px rgba(0,0,0,0.2), inset 0 -10px 20px rgba(0,0,0,0.07); -moz-box-shadow: inset 0 3px 5px rgba(0,0,0,0.2), inset 0 -10px 20px rgba(0,0,0,0.07); box-shadow: inset 0 3px 5px rgba(0,0,0,0.2), inset 0 -10px 20px rgba(0,0,0,0.07); border-left: 1px solid #ccc; }
/*---------------------------------
STYLES
-----------------------------------*/
.pill { -webkit-border-radius: 200em; -moz-border-radius: 200em; border-radius: 200em; }
.pop { -webkit-box-shadow: 0px 1px 5px rgba(0,0,0,0.2); -moz-box-shadow: 0px 1px 5px rgba(0,0,0,0.2); box-shadow: 0px 1px 5px rgba(0,0,0,0.2); }
.inset { -webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,0.3); -moz-box-shadow: inset 0 1px 3px rgba(0,0,0,0.3); box-shadow: inset 0 1px 3px rgba(0,0,0,0.3); }
.square { -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; }
.buttonGrad { background: rgb(252,252,252); /* Old browsers */ background: -moz-linear-gradient(top, rgba(252,252,252,1) 0%, rgba(224,224,224,1) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(252,252,252,1)), color-stop(100%, rgba(224,224,224,1))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(252,252,252,1) 0%, rgba(224,224,224,1) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(252,252,252,1) 0%, rgba(224,224,224,1) 100%); /* Opera11.10+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#e0e0e0', GradientType=0 ); /* IE6-9 */
background: linear-gradient(top, rgba(252,252,252,1) 0%, rgba(224,224,224,1) 100%); /* W3C */ }
/*---------------------------------
ORANGE
-----------------------------------*/
button.orange, a.btn.orange, a.button.orange, input[type=submit].orange, input[type=reset].orange, input[type=button].orange { text-shadow: 0 -1px 0 #FC730A; color: #fff; border: 1px solid #FC730A; background:#f07b00;
}
button.orange:hover, a.btn.orange:hover, a.button.orange:hover { text-shadow: 0 1px 0 #FC730A; border: 1px solid #FC730A; background: rgb(255,168,76);
}
/*---------------------------------
BLUE
-----------------------------------*/
button.buttonGrad.blue, a.btn.buttonGrad.blue, a.button.buttonGrad.blue, input[type=submit].buttonGrad.blue, input[type=reset].buttonGrad.blue, input[type=button].buttonGrad.blue { background: rgb(122,188,255); /* Old browsers */ background: -moz-linear-gradient(top, rgba(122,188,255,1) 0%, rgba(96,171,248,1) 44%, rgba(64,150,238,1) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(122,188,255,1)), color-stop(44%, rgba(96,171,248,1)), color-stop(100%, rgba(64,150,238,1))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(122,188,255,1) 0%, rgba(96,171,248,1) 44%, rgba(64,150,238,1) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(122,188,255,1) 0%, rgba(96,171,248,1) 44%, rgba(64,150,238,1) 100%); /* Opera11.10+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7abcff', endColorstr='#4096ee', GradientType=0 ); /* IE6-9 */
background: linear-gradient(top, rgba(122,188,255,1) 0%, rgba(96,171,248,1) 44%, rgba(64,150,238,1) 100%); /* W3C */ }
button.blue, a.btn.blue, a.button.blue, input[type=submit].blue, input[type=reset].blue, input[type=button].blue { color: #fff; border: 1px solid #1D6DC1; background:#1D6DC1;}
button.buttonGrad.blue:hover, a.btn.buttonGrad.blue:hover, a.button.blue.buttonGrad:hover { text-shadow: 0 1px 0 #1D6DC1; border: 1px solid #1D6DC1; background: rgb(155,205,255); /* Old browsers */ background: -moz-linear-gradient(top, rgba(155,205,255,1) 0%, rgba(134,192,250,1) 44%, rgba(110,176,242,1) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(155,205,255,1)), color-stop(44%, rgba(134,192,250,1)), color-stop(100%, rgba(110,176,242,1))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(155,205,255,1) 0%, rgba(134,192,250,1) 44%, rgba(110,176,242,1) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(155,205,255,1) 0%, rgba(134,192,250,1) 44%, rgba(110,176,242,1) 100%); /* Opera 11.10+ */ background: linear-gradient(top, rgba(155,205,255,1) 0%, rgba(134,192,250,1) 44%, rgba(110,176,242,1) 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#9bcdff', endColorstr='#6eb0f2', GradientType=0 ); /* IE6-9 */
}
button.blue:hover, a.btn.blue:hover, a.button.blue:hover { border: 1px solid #1D6DC1; background: #358ae4; }
button.pink:hover, a.btn.pink:hover, a.button.pink:hover { text-shadow: 0 1px 0 #EF0251; border: 1px solid #EF0251; background: rgb(255,169,213); /* Old browsers */ background: -moz-linear-gradient(top, rgba(255,169,213,1) 0%, rgba(254,112,185,1) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255,169,213,1)), color-stop(100%, rgba(254,112,185,1))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(255,169,213,1) 0%, rgba(254,112,185,1) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(255,169,213,1) 0%, rgba(254,112,185,1) 100%); /* Opera 11.10+ */ background: linear-gradient(top, rgba(255,169,213,1) 0%, rgba(254,112,185,1) 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffa9d5', endColorstr='#fe70b9', GradientType=0 ); /* IE6-9 */
}
/*---------------------------------
GREEN
-----------------------------------*/
button.green, a.btn.green, a.button.green, input[type=submit].green, input[type=reset].green, input[type=button].green { color: #fff; border: 1px solid #669E00; background: rgb(68, 94, 3);
}
button.green:hover, a.btn.green:hover, a.button.green:hover { border: 1px solid #669E00; background: #759e06;
}
/*---------------------------------
RED
-----------------------------------*/
button.red, a.btn.red, a.button.red, input[type=submit].red, input[type=reset].red, input[type=button].red { text-shadow: 0 -1px 0 #B21203; color: #fff; border: 1px solid #B21203; background: rgb(229,60,22); /* Old browsers */ background: -moz-linear-gradient(top, rgba(229,60,22,1) 0%, rgba(207,4,4,1) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(229,60,22,1)), color-stop(100%, rgba(207,4,4,1))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(229,60,22,1) 0%, rgba(207,4,4,1) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(229,60,22,1) 0%, rgba(207,4,4,1) 100%); /* Opera 11.10+ */ background: linear-gradient(top, rgba(229,60,22,1) 0%, rgba(207,4,4,1) 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e53c16', endColorstr='#cf0404', GradientType=0 ); /* IE6-9 */
}
button.red:hover, a.btn.red:hover, a.button.red:hover { text-shadow: 0 1px 0 #B21203; border: 1px solid #B21203; background: rgb(238,106,76); /* Old browsers */ background: -moz-linear-gradient(top, rgba(238,106,76,1) 0%, rgba(251,33,33,1) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(238,106,76,1)), color-stop(100%, rgba(251,33,33,1))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(238,106,76,1) 0%, rgba(251,33,33,1) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(238,106,76,1) 0%, rgba(251,33,33,1) 100%); /* Opera 11.10+ */ background: linear-gradient(top, rgba(238,106,76,1) 0%, rgba(251,33,33,1) 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ee6a4c', endColorstr='#fb2121', GradientType=0 ); /* IE6-9 */
}