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,
b, u, i, center,
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-size: 100%;
vertical-align: baseline;
background: transparent;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
/* remember to define focus styles! */
:focus {
outline: 0;
}
/* remember to highlight inserts somehow! */
ins {
text-decoration: none;
}
del {
text-decoration: line-through;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: collapse;
border-spacing: 0;
}
/* -------------------------------------------------------------------------------------------------
It's *strongly* suggested that you don't modify this file. Instead, load a new stylesheet after
this one in your layouts (eg formtastic_changes.css) and override the styles to suit your needs.
This will allow you to update formtastic.css with new releases without clobbering your own changes.
This stylesheet forms part of the Formtastic Rails Plugin
(c) 2008 Justin French
--------------------------------------------------------------------------------------------------*/
/* NORMALIZE AND RESET
--------------------------------------------------------------------------------------------------*/
/* obviously inspired by Yahoo's reset.css, but scoped to just form.formtastic elements that we care about */
form.formtastic, form.formtastic ul, form.formtastic ol, form.formtastic li, form.formtastic fieldset, form.formtastic legend, form.formtastic input, form.formtastic textarea, form.formtastic p { margin:0; padding:0; }
form.formtastic fieldset { border:0; }
form.formtastic em, form.formtastic strong { font-style:normal; font-weight:normal; }
form.formtastic ol, form.formtastic ul { list-style:none; }
form.formtastic abbr, form.formtastic acronym { border:0; font-variant:normal; }
form.formtastic input, form.formtastic textarea, form.formtastic select { font-family:inherit; font-size:inherit; font-weight:inherit; }
form.formtastic input, form.formtastic textarea, form.formtastic select { font-size:100%; }
form.formtastic legend { color:#000; }
/* Rails wraps error fields with divs */
div.fieldWithErrors { display:inline; margin:0; padding:0; }
/* FIELDSETS & LISTS
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset { }
form.formtastic fieldset.inputs { border-top:1px solid #eee; }
form.formtastic fieldset.buttons { padding:10px; }
form.formtastic fieldset ol { }
/* clearfixing the fieldsets */
form.formtastic fieldset { display: inline-block; }
form.formtastic fieldset:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
html[xmlns] form.formtastic fieldset { display: block; }
* html form.formtastic fieldset { height: 1%; }
/* INPUT LIs
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li { border-bottom:1px solid #eee; padding:5px; }
/* clearfixing the li's */
form.formtastic fieldset ol li { display: inline-block; }
form.formtastic fieldset ol li:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
html[xmlns] form.formtastic fieldset ol li { display: block; }
* html form.formtastic fieldset ol li { height: 1%; }
form.formtastic fieldset ol li.required { }
form.formtastic fieldset ol li.optional { }
form.formtastic fieldset ol li.error { background:#FFCCCC; }
/* LABELS
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li label { display:block; width:25%; float:left; }
/* INLINE HINTS
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li p.inline-hints { color:#666; margin:0.5em 0 0 25%; }
/* INLINE ERRORS
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li p.inline-errors { color:red; margin:0.5em 0 0 25%; }
form.formtastic fieldset ol li ul.errors { color:red; margin:0.5em 0 0 25%; list-style:square; }
form.formtastic fieldset ol li ul.errors li { padding:0; border:none; display:list-item; }
/* STRING & NUMERIC OVERRIDES
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li.string input { width:74%; }
form.formtastic fieldset ol li.numeric input { width:74%; }
/* TEXTAREA OVERRIDES
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li.text textarea { width:74%; }
/* BOOLEAN (CHECKBOX) OVERRIDES
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li.boolean label { padding-left:25%; width:auto; }
form.formtastic fieldset ol li.boolean label input { margin:0 0.5em 0 0.2em; }
/* BELONGS_TO (RADIO) OVERRIDES
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li.radio fieldset { }
form.formtastic fieldset ol li.radio fieldset legend { display:block; float:left; width:25%; position:relative; }
form.formtastic fieldset ol li.radio fieldset legend span { }
form.formtastic fieldset ol li.radio fieldset ol { float:left; width:74%; }
form.formtastic fieldset ol li.radio fieldset ol li { padding:0; border:0; margin-bottom:.2em; }
form.formtastic fieldset ol li.radio fieldset ol li label { float:none; width:100%; }
form.formtastic fieldset ol li.radio fieldset ol li label input { margin-right:0.5em; }
/* DATE & TIME OVERRIDES
--------------------------------------------------------------------------------------------------*/
form.formtastic fieldset ol li.date fieldset,
form.formtastic fieldset ol li.time fieldset,
form.formtastic fieldset ol li.datetime fieldset {}
form.formtastic fieldset ol li.date fieldset legend,
form.formtastic fieldset ol li.time fieldset legend,
form.formtastic fieldset ol li.datetime fieldset legend,
form.formtastic fieldset ol li.date fieldset legend,
form.formtastic fieldset ol li.time fieldset legend,
form.formtastic fieldset ol li.datetime fieldset legend { display:block; float:left; width:25%; position:relative; }
form.formtastic fieldset ol li.date fieldset legend span,
form.formtastic fieldset ol li.time fieldset legend span,
form.formtastic fieldset ol li.datetime fieldset legend span { }
form.formtastic fieldset ol li.date fieldset ol,
form.formtastic fieldset ol li.time fieldset ol,
form.formtastic fieldset ol li.datetime fieldset ol { float:left; width:74%; margin:0; padding:0; }
form.formtastic fieldset ol li.date fieldset ol li,
form.formtastic fieldset ol li.time fieldset ol li,
form.formtastic fieldset ol li.datetime fieldset ol li { float:left; width:auto; margin:0; padding:0; border:0; }
form.formtastic fieldset ol li.date fieldset ol li label,
form.formtastic fieldset ol li.time fieldset ol li label,
form.formtastic fieldset ol li.datetime fieldset ol li label { display:none; }
form.formtastic fieldset ol li.date fieldset ol li label input,
form.formtastic fieldset ol li.time fieldset ol li label input,
form.formtastic fieldset ol li.datetime fieldset ol li label input { display:inline; margin:0; padding:0; }
/*
* jQuery UI CSS Framework
* Copyright (c) 2009 AUTHORS.txt (http://ui.jquery.com/about)
* Dual licensed under the MIT (MIT-LICENSE.txt) and GPL (GPL-LICENSE.txt) licenses.
*/
/* Layout helpers
----------------------------------*/
.ui-helper-hidden { display: none; }
.ui-helper-hidden-accessible { position: absolute; left: -99999999px; }
.ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; }
.ui-helper-clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.ui-helper-clearfix { display: inline-block; }
/* required comment for clearfix to work in Opera \*/
* html .ui-helper-clearfix { height:1%; }
.ui-helper-clearfix { display:block; }
/* end clearfix */
.ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter:Alpha(Opacity=0); }
/* Interaction Cues
----------------------------------*/
.ui-state-disabled { cursor: default !important; }
/* Icons
----------------------------------*/
/* states and images */
.ui-icon { display: block; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; }
/* Misc visuals
----------------------------------*/
/* Overlays */
.ui-widget-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
/* Dialog
----------------------------------*/
.ui-dialog { position: relative; padding: .2em; width: 300px; }
.ui-dialog .ui-dialog-titlebar { padding: 0; margin:0; }
/*.ui-dialog .ui-dialog-title { float: left; margin: .1em 0 .2em; } */
.ui-dialog .ui-dialog-titlebar-close { display:none; position: absolute; right: .3em; top: 50%; width: 19px; margin: -10px 0 0 0; padding: 1px; height: 18px; }
.ui-dialog .ui-dialog-titlebar-close span { display: block; margin: 1px; }
.ui-dialog .ui-dialog-titlebar-close:hover, .ui-dialog .ui-dialog-titlebar-close:focus { padding: 0; }
.ui-dialog .ui-dialog-content { border: 0; padding: .5em 1em; background: #fff; overflow: auto; }
.ui-dialog .ui-dialog-buttonpane { text-align: left; border-width: 1px 0 0 0; background: #fff; margin: 0 0 0 0; padding: .3em 1em .5em .4em; }
.ui-dialog .ui-dialog-buttonpane button { float: right; margin: .5em .4em .5em 0; cursor: pointer; border:0 none; font-weight:500; color:#fff; padding: .2em .6em .3em .6em; background:url(../images/button-submit.png) 0 0 no-repeat; width:auto; overflow:visible; }
.ui-dialog .ui-resizable-se { width: 14px; height: 14px; right: 3px; bottom: 3px; }
.ui-draggable .ui-dialog-titlebar { cursor: move; }
/* Slider
----------------------------------*/
.ui-slider { position: relative; text-align: left; }
.ui-slider .ui-slider-handle { position: absolute; z-index: 2; width: 1.2em; height: 1.2em; cursor: default; }
.ui-slider .ui-slider-range { position: absolute; z-index: 1; font-size: 1%; display: block; border: 0; }
.ui-slider-horizontal { height: .8em; }
.ui-slider-horizontal .ui-slider-handle { top: -.3em; margin-left: -.6em; }
.ui-slider-horizontal .ui-slider-range { top: 0; height: 100%; }
.ui-slider-horizontal .ui-slider-range-min { left: 0; }
.ui-slider-horizontal .ui-slider-range-max { right: 0; }
.ui-slider-vertical { width: .8em; height: 100px; }
.ui-slider-vertical .ui-slider-handle { left: -.3em; margin-left: 0; margin-bottom: -.6em; }
.ui-slider-vertical .ui-slider-range { left: 0; width: 100%; }
.ui-slider-vertical .ui-slider-range-min { bottom: 0; }
.ui-slider-vertical .ui-slider-range-max { top: 0; }
/*
* jQuery UI CSS Framework
* Copyright (c) 2009 AUTHORS.txt (http://ui.jquery.com/about)
* Dual licensed under the MIT (MIT-LICENSE.txt) and GPL (GPL-LICENSE.txt) licenses.
* To view and modify this theme, visit http://ui.jquery.com/themeroller/?tr=&ffDefault=Verdana,Arial,sans-serif&fwDefault=normal&fsDefault=1.1em&cornerRadius=4px&bgColorHeader=cccccc&bgTextureHeader=03_highlight_soft.png&bgImgOpacityHeader=75&borderColorHeader=aaaaaa&fcHeader=222222&iconColorHeader=222222&bgColorContent=ffffff&bgTextureContent=01_flat.png&bgImgOpacityContent=75&borderColorContent=aaaaaa&fcContent=222222&iconColorContent=222222&bgColorDefault=e6e6e6&bgTextureDefault=02_glass.png&bgImgOpacityDefault=75&borderColorDefault=d3d3d3&fcDefault=555555&iconColorDefault=888888&bgColorHover=dadada&bgTextureHover=02_glass.png&bgImgOpacityHover=75&borderColorHover=999999&fcHover=212121&iconColorHover=454545&bgColorActive=ffffff&bgTextureActive=02_glass.png&bgImgOpacityActive=65&borderColorActive=aaaaaa&fcActive=212121&iconColorActive=454545&bgColorHighlight=fbf9ee&bgTextureHighlight=02_glass.png&bgImgOpacityHighlight=55&borderColorHighlight=fcefa1&fcHighlight=363636&iconColorHighlight=2e83ff&bgColorError=fef1ec&bgTextureError=02_glass.png&bgImgOpacityError=95&borderColorError=cd0a0a&fcError=cd0a0a&iconColorError=cd0a0a&bgColorOverlay=aaaaaa&bgTextureOverlay=01_flat.png&bgImgOpacityOverlay=0&opacityOverlay=30&bgColorShadow=aaaaaa&bgTextureShadow=01_flat.png&bgImgOpacityShadow=0&opacityShadow=30&thicknessShadow=8px&offsetTopShadow=-8px&offsetLeftShadow=-8px&cornerRadiusShadow=8px
*/
/* Component containers
----------------------------------*/
.ui-widget { font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:0.9167em; line-height:1.6363; color:#fff; font-weight:700; }
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: Verdana,Arial,sans-serif; font-size: 1em; }
.ui-widget-header { color: #222222; font-weight: bold; background:transparent url(../images/cloud-point.png) top center no-repeat; }
.ui-widget-header a { color: #222222; }
.ui-widget-content { color: #222222; }
.ui-widget-content a { color: #222222; }
/* Interaction states
----------------------------------*/
.ui-state-default, .ui-widget-content .ui-state-default { border: 1px solid #d3d3d3; background: #e6e6e6 url(../images/ui-bg_glass_75_e6e6e6_1x400.png) 50% 50% repeat-x; font-weight: normal; color: #555555; outline: none; }
.ui-state-default a { color: #555555; text-decoration: none; outline: none; }
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus { border: 1px solid #999999; background: #dadada url(../images/ui-bg_glass_75_dadada_1x400.png) 50% 50% repeat-x; font-weight: normal; color: #212121; outline: none; }
.ui-state-hover a { color: #212121; text-decoration: none; outline: none; }
.ui-state-active, .ui-widget-content .ui-state-active { border: 1px solid #aaaaaa; background: #ffffff url(../images/ui-bg_glass_65_ffffff_1x400.png) 50% 50% repeat-x; font-weight: normal; color: #212121; outline: none; }
.ui-state-active a { color: #212121; outline: none; text-decoration: none; }
/* Interaction Cues
----------------------------------*/
.ui-state-highlight, .ui-widget-content .ui-state-highlight {border: 1px solid #fcefa1; background: #fbf9ee url(../images/ui-bg_glass_55_fbf9ee_1x400.png) 50% 50% repeat-x; color: #363636; }
.ui-state-error, .ui-widget-content .ui-state-error {border: 1px solid #cd0a0a; background: #fef1ec url(../images/ui-bg_glass_95_fef1ec_1x400.png) 50% 50% repeat-x; color: #cd0a0a; }
.ui-state-error-text, .ui-widget-content .ui-state-error-text { color: #cd0a0a; }
.ui-state-disabled, .ui-widget-content .ui-state-disabled { opacity: .35; filter:Alpha(Opacity=35); background-image: none; }
.ui-priority-primary, .ui-widget-content .ui-priority-primary { font-weight: bold; }
.ui-priority-secondary, .ui-widget-content .ui-priority-secondary { opacity: .7; filter:Alpha(Opacity=70); font-weight: normal; }
/* Icons
----------------------------------*/
/* states and images */
.ui-icon { width: 16px; height: 16px; background-image: url(../images/ui-icons_222222_256x240.png); }
.ui-widget-content .ui-icon {background-image: url(../images/ui-icons_222222_256x240.png); }
.ui-widget-header .ui-icon {background-image: url(../images/ui-icons_222222_256x240.png); }
.ui-state-default .ui-icon { background-image: url(../images/ui-icons_888888_256x240.png); }
.ui-state-hover .ui-icon, .ui-state-focus .ui-icon {background-image: url(../images/ui-icons_454545_256x240.png); }
.ui-state-active .ui-icon {background-image: url(../images/ui-icons_454545_256x240.png); }
.ui-state-highlight .ui-icon {background-image: url(../images/ui-icons_2e83ff_256x240.png); }
.ui-state-error .ui-icon, .ui-state-error-text .ui-icon {background-image: url(../images/ui-icons_cd0a0a_256x240.png); }
/* positioning */
.ui-icon-carat-1-n { background-position: 0 0; }
.ui-icon-carat-1-ne { background-position: -16px 0; }
.ui-icon-carat-1-e { background-position: -32px 0; }
.ui-icon-carat-1-se { background-position: -48px 0; }
.ui-icon-carat-1-s { background-position: -64px 0; }
.ui-icon-carat-1-sw { background-position: -80px 0; }
.ui-icon-carat-1-w { background-position: -96px 0; }
.ui-icon-carat-1-nw { background-position: -112px 0; }
.ui-icon-carat-2-n-s { background-position: -128px 0; }
.ui-icon-carat-2-e-w { background-position: -144px 0; }
.ui-icon-triangle-1-n { background-position: 0 -16px; }
.ui-icon-triangle-1-ne { background-position: -16px -16px; }
.ui-icon-triangle-1-e { background-position: -32px -16px; }
.ui-icon-triangle-1-se { background-position: -48px -16px; }
.ui-icon-triangle-1-s { background-position: -64px -16px; }
.ui-icon-triangle-1-sw { background-position: -80px -16px; }
.ui-icon-triangle-1-w { background-position: -96px -16px; }
.ui-icon-triangle-1-nw { background-position: -112px -16px; }
.ui-icon-triangle-2-n-s { background-position: -128px -16px; }
.ui-icon-triangle-2-e-w { background-position: -144px -16px; }
.ui-icon-arrow-1-n { background-position: 0 -32px; }
.ui-icon-arrow-1-ne { background-position: -16px -32px; }
.ui-icon-arrow-1-e { background-position: -32px -32px; }
.ui-icon-arrow-1-se { background-position: -48px -32px; }
.ui-icon-arrow-1-s { background-position: -64px -32px; }
.ui-icon-arrow-1-sw { background-position: -80px -32px; }
.ui-icon-arrow-1-w { background-position: -96px -32px; }
.ui-icon-arrow-1-nw { background-position: -112px -32px; }
.ui-icon-arrow-2-n-s { background-position: -128px -32px; }
.ui-icon-arrow-2-ne-sw { background-position: -144px -32px; }
.ui-icon-arrow-2-e-w { background-position: -160px -32px; }
.ui-icon-arrow-2-se-nw { background-position: -176px -32px; }
.ui-icon-arrowstop-1-n { background-position: -192px -32px; }
.ui-icon-arrowstop-1-e { background-position: -208px -32px; }
.ui-icon-arrowstop-1-s { background-position: -224px -32px; }
.ui-icon-arrowstop-1-w { background-position: -240px -32px; }
.ui-icon-arrowthick-1-n { background-position: 0 -48px; }
.ui-icon-arrowthick-1-ne { background-position: -16px -48px; }
.ui-icon-arrowthick-1-e { background-position: -32px -48px; }
.ui-icon-arrowthick-1-se { background-position: -48px -48px; }
.ui-icon-arrowthick-1-s { background-position: -64px -48px; }
.ui-icon-arrowthick-1-sw { background-position: -80px -48px; }
.ui-icon-arrowthick-1-w { background-position: -96px -48px; }
.ui-icon-arrowthick-1-nw { background-position: -112px -48px; }
.ui-icon-arrowthick-2-n-s { background-position: -128px -48px; }
.ui-icon-arrowthick-2-ne-sw { background-position: -144px -48px; }
.ui-icon-arrowthick-2-e-w { background-position: -160px -48px; }
.ui-icon-arrowthick-2-se-nw { background-position: -176px -48px; }
.ui-icon-arrowthickstop-1-n { background-position: -192px -48px; }
.ui-icon-arrowthickstop-1-e { background-position: -208px -48px; }
.ui-icon-arrowthickstop-1-s { background-position: -224px -48px; }
.ui-icon-arrowthickstop-1-w { background-position: -240px -48px; }
.ui-icon-arrowreturnthick-1-w { background-position: 0 -64px; }
.ui-icon-arrowreturnthick-1-n { background-position: -16px -64px; }
.ui-icon-arrowreturnthick-1-e { background-position: -32px -64px; }
.ui-icon-arrowreturnthick-1-s { background-position: -48px -64px; }
.ui-icon-arrowreturn-1-w { background-position: -64px -64px; }
.ui-icon-arrowreturn-1-n { background-position: -80px -64px; }
.ui-icon-arrowreturn-1-e { background-position: -96px -64px; }
.ui-icon-arrowreturn-1-s { background-position: -112px -64px; }
.ui-icon-arrowrefresh-1-w { background-position: -128px -64px; }
.ui-icon-arrowrefresh-1-n { background-position: -144px -64px; }
.ui-icon-arrowrefresh-1-e { background-position: -160px -64px; }
.ui-icon-arrowrefresh-1-s { background-position: -176px -64px; }
.ui-icon-arrow-4 { background-position: 0 -80px; }
.ui-icon-arrow-4-diag { background-position: -16px -80px; }
.ui-icon-extlink { background-position: -32px -80px; }
.ui-icon-newwin { background-position: -48px -80px; }
.ui-icon-refresh { background-position: -64px -80px; }
.ui-icon-shuffle { background-position: -80px -80px; }
.ui-icon-transfer-e-w { background-position: -96px -80px; }
.ui-icon-transferthick-e-w { background-position: -112px -80px; }
.ui-icon-folder-collapsed { background-position: 0 -96px; }
.ui-icon-folder-open { background-position: -16px -96px; }
.ui-icon-document { background-position: -32px -96px; }
.ui-icon-document-b { background-position: -48px -96px; }
.ui-icon-note { background-position: -64px -96px; }
.ui-icon-mail-closed { background-position: -80px -96px; }
.ui-icon-mail-open { background-position: -96px -96px; }
.ui-icon-suitcase { background-position: -112px -96px; }
.ui-icon-comment { background-position: -128px -96px; }
.ui-icon-person { background-position: -144px -96px; }
.ui-icon-print { background-position: -160px -96px; }
.ui-icon-trash { background-position: -176px -96px; }
.ui-icon-locked { background-position: -192px -96px; }
.ui-icon-unlocked { background-position: -208px -96px; }
.ui-icon-bookmark { background-position: -224px -96px; }
.ui-icon-tag { background-position: -240px -96px; }
.ui-icon-home { background-position: 0 -112px; }
.ui-icon-flag { background-position: -16px -112px; }
.ui-icon-calendar { background-position: -32px -112px; }
.ui-icon-cart { background-position: -48px -112px; }
.ui-icon-pencil { background-position: -64px -112px; }
.ui-icon-clock { background-position: -80px -112px; }
.ui-icon-disk { background-position: -96px -112px; }
.ui-icon-calculator { background-position: -112px -112px; }
.ui-icon-zoomin { background-position: -128px -112px; }
.ui-icon-zoomout { background-position: -144px -112px; }
.ui-icon-search { background-position: -160px -112px; }
.ui-icon-wrench { background-position: -176px -112px; }
.ui-icon-gear { background-position: -192px -112px; }
.ui-icon-heart { background-position: -208px -112px; }
.ui-icon-star { background-position: -224px -112px; }
.ui-icon-link { background-position: -240px -112px; }
.ui-icon-cancel { background-position: 0 -128px; }
.ui-icon-plus { background-position: -16px -128px; }
.ui-icon-plusthick { background-position: -32px -128px; }
.ui-icon-minus { background-position: -48px -128px; }
.ui-icon-minusthick { background-position: -64px -128px; }
.ui-icon-close { background-position: -80px -128px; }
.ui-icon-closethick { background-position: -96px -128px; }
.ui-icon-key { background-position: -112px -128px; }
.ui-icon-lightbulb { background-position: -128px -128px; }
.ui-icon-scissors { background-position: -144px -128px; }
.ui-icon-clipboard { background-position: -160px -128px; }
.ui-icon-copy { background-position: -176px -128px; }
.ui-icon-contact { background-position: -192px -128px; }
.ui-icon-image { background-position: -208px -128px; }
.ui-icon-video { background-position: -224px -128px; }
.ui-icon-script { background-position: -240px -128px; }
.ui-icon-alert { background-position: 0 -144px; }
.ui-icon-info { background-position: -16px -144px; }
.ui-icon-notice { background-position: -32px -144px; }
.ui-icon-help { background-position: -48px -144px; }
.ui-icon-check { background-position: -64px -144px; }
.ui-icon-bullet { background-position: -80px -144px; }
.ui-icon-radio-off { background-position: -96px -144px; }
.ui-icon-radio-on { background-position: -112px -144px; }
.ui-icon-pin-w { background-position: -128px -144px; }
.ui-icon-pin-s { background-position: -144px -144px; }
.ui-icon-play { background-position: 0 -160px; }
.ui-icon-pause { background-position: -16px -160px; }
.ui-icon-seek-next { background-position: -32px -160px; }
.ui-icon-seek-prev { background-position: -48px -160px; }
.ui-icon-seek-end { background-position: -64px -160px; }
.ui-icon-seek-first { background-position: -80px -160px; }
.ui-icon-stop { background-position: -96px -160px; }
.ui-icon-eject { background-position: -112px -160px; }
.ui-icon-volume-off { background-position: -128px -160px; }
.ui-icon-volume-on { background-position: -144px -160px; }
.ui-icon-power { background-position: 0 -176px; }
.ui-icon-signal-diag { background-position: -16px -176px; }
.ui-icon-signal { background-position: -32px -176px; }
.ui-icon-battery-0 { background-position: -48px -176px; }
.ui-icon-battery-1 { background-position: -64px -176px; }
.ui-icon-battery-2 { background-position: -80px -176px; }
.ui-icon-battery-3 { background-position: -96px -176px; }
.ui-icon-circle-plus { background-position: 0 -192px; }
.ui-icon-circle-minus { background-position: -16px -192px; }
.ui-icon-circle-close { background-position: -32px -192px; }
.ui-icon-circle-triangle-e { background-position: -48px -192px; }
.ui-icon-circle-triangle-s { background-position: -64px -192px; }
.ui-icon-circle-triangle-w { background-position: -80px -192px; }
.ui-icon-circle-triangle-n { background-position: -96px -192px; }
.ui-icon-circle-arrow-e { background-position: -112px -192px; }
.ui-icon-circle-arrow-s { background-position: -128px -192px; }
.ui-icon-circle-arrow-w { background-position: -144px -192px; }
.ui-icon-circle-arrow-n { background-position: -160px -192px; }
.ui-icon-circle-zoomin { background-position: -176px -192px; }
.ui-icon-circle-zoomout { background-position: -192px -192px; }
.ui-icon-circle-check { background-position: -208px -192px; }
.ui-icon-circlesmall-plus { background-position: 0 -208px; }
.ui-icon-circlesmall-minus { background-position: -16px -208px; }
.ui-icon-circlesmall-close { background-position: -32px -208px; }
.ui-icon-squaresmall-plus { background-position: -48px -208px; }
.ui-icon-squaresmall-minus { background-position: -64px -208px; }
.ui-icon-squaresmall-close { background-position: -80px -208px; }
.ui-icon-grip-dotted-vertical { background-position: 0 -224px; }
.ui-icon-grip-dotted-horizontal { background-position: -16px -224px; }
.ui-icon-grip-solid-vertical { background-position: -32px -224px; }
.ui-icon-grip-solid-horizontal { background-position: -48px -224px; }
.ui-icon-gripsmall-diagonal-se { background-position: -64px -224px; }
.ui-icon-grip-diagonal-se { background-position: -80px -224px; }
/* Misc visuals
----------------------------------*/
/* Corner radius */
.ui-corner-tl { -moz-border-radius-topleft: 4px; -webkit-border-top-left-radius: 4px; }
.ui-corner-tr { -moz-border-radius-topright: 4px; -webkit-border-top-right-radius: 4px; }
.ui-corner-bl { -moz-border-radius-bottomleft: 4px; -webkit-border-bottom-left-radius: 4px; }
.ui-corner-br { -moz-border-radius-bottomright: 4px; -webkit-border-bottom-right-radius: 4px; }
.ui-corner-top { -moz-border-radius-topleft: 4px; -webkit-border-top-left-radius: 4px; -moz-border-radius-topright: 4px; -webkit-border-top-right-radius: 4px; }
.ui-corner-bottom { -moz-border-radius-bottomleft: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -webkit-border-bottom-right-radius: 4px; }
.ui-corner-right { -moz-border-radius-topright: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-bottomright: 4px; -webkit-border-bottom-right-radius: 4px; }
.ui-corner-left { -moz-border-radius-topleft: 4px; -webkit-border-top-left-radius: 4px; -moz-border-radius-bottomleft: 4px; -webkit-border-bottom-left-radius: 4px; }
.ui-corner-all { -moz-border-radius: 4px; -webkit-border-radius: 4px; }
/* Overlays */
.ui-widget-overlay { background: #aaaaaa url(../images/ui-bg_flat_0_aaaaaa_40x100.png) 50% 50% repeat-x; opacity: .70;filter:Alpha(Opacity=70); }
.ui-widget-shadow { margin: -8px 0 0 -8px; padding: 8px; background: #aaaaaa url(../images/ui-bg_flat_0_aaaaaa_40x100.png) 50% 50% repeat-x; opacity: .30;filter:Alpha(Opacity=30); -moz-border-radius: 8px; -webkit-border-radius: 8px; }
html {
height: 100%; }
body {
height: 100%;
font-size: 12px;
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
background: #f2f0ed;
color: #000; }
body.ohide {
overflow: hidden !important; }
h2 {
font-size: 1.5em;
line-height: 1;
font-weight: 700;
color: #aaa69f;
margin-bottom: 1em; }
p,
li,
td {
font-size: 1em;
line-height: 1.5; }
strong {
font-weight: bold; }
.nav {
display: inline-block;
display: block; }
.nav:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden; }
.nav li {
float: left; }
.nav li a {
display: block;
text-decoration: none; }
.col {
float: left; }
.replaced {
position: absolute;
top: -3000px; }
.disabled {
opacity: 0.3; }
.clearfix {
display: inline-block;
display: block; }
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden; }
#wrap {
margin: 0 auto;
min-height: 100%; }
.alt #wrap {
border: 1px solid #e6e4e2;
border-top: 0 none;
border-bottom: 0 none;
background: #fff;
display: inline-block;
display: block;
width: 976px;
margin: 0 auto;
padding: 0 7px 60px; }
.alt #wrap:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden; }
#header-wrap {
position: absolute;
width: 100%;
top: 0; }
#header {
width: 976px;
margin: 0 auto; }
#header h1 a {
display: block;
width: 353px;
height: 42px;
background-image: url(../images/logo.png);
background-repeat: no-repeat;
background-position: 0 0;
}
#header .col {
margin-right: 2px; }
#header .right {
background: url(../images/trans.png) 0 0 repeat;
height: 42px;
width: 221px;
margin-right: 0; }
.alt #header .right {
background: #b4b0a7 url(../images/b-alt-header.png) 0 3px repeat-x; }
#header .primary {
margin-bottom: 0; }
#header .primary a {
display: block;
height: 42px;
border-top: 3px solid #26292c; }
.alt #header .primary a {
border-top-color: #b4b0a7; }
#header .primary a:hover,
#header .primary a.current {
border-top-color: #d86213; }
#header .primary a.portfolio {
width: 226px;
background-image: url(../images/b-portfolio.png);
background-repeat: no-repeat;
background-position: 0 -3px;
}
.alt #header .primary a.portfolio {
background-image: url(../images/b-portfolio.png);
}
#header .primary a.stock {
width: 172px;
background-image: url(../images/b-stock.png);
background-repeat: no-repeat;
background-position: 0 -3px;
}
.alt #header .primary a.stock {
background-image: url(../images/b-alt-stock.png);
}
#header .secondary li {
color: #7f8184; }
#header .secondary li.piped {
padding-top: 12px; }
.alt #header .secondary li {
color: #fff; }
#header .secondary li a {
color: #fff;
font-size: 0.9167em;
line-height: 1.6363;
text-transform: uppercase;
padding: 13px 0 0;
font-weight: 200;
letter-spacing: 0.5px;
width: 72px;
height: 14px;
border-top: 3px solid transparent;
background-image: url(../images/b-secondary.png);
background-repeat: no-repeat;
background-position: 0 16px;
}
.alt #header .secondary li a {
color: #fff; }
#header .secondary li a.admin {
background: 0 none !important; }
#header .secondary li a.contact {
background-position: -72px 16px; }
#header .secondary li a.blog {
background-position: -144px 16px;
display: inline-block;
display: block; }
#header .secondary li a.blog:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden; }
#header .secondary li a:hover,
#header .secondary li a.current {
border-top-color: #d86213; }
#header .secondary #blog-count {
text-align: center;
float: left;
font-size: 1em;
line-height: 1.5;
line-height: 1.1;
margin: 0 5px 0 45px;
color: #fff;
background: #313336;
width: 20px; }
.alt #header .secondary #blog-count {
background: #9a9793; }
#header .admin-secondary {
padding-left: 14px; }
#header .admin-secondary li {
color: #fff; }
#header .admin-secondary li.piped {
padding-top: 12px; }
#header .admin-secondary li a {
color: #fff;
font-size: 0.9167em;
line-height: 1.6363;
text-transform: uppercase;
padding: 13px 8px 0;
font-weight: 200;
letter-spacing: 0.5px;
height: 14px;
border-top: 3px solid transparent; }
#header .admin-secondary li a:hover,
#header .admin-secondary li a.current {
border-top-color: #d86213; }
#content {
clear: left; }
#content p {
margin-bottom: 1.5em; }
#content ul,
#content ol {
margin-bottom: 1.5em; }
#footer-wrap {
position: fixed;
bottom: 0;
left: 0;
width: 100%; }
#footer {
width: 976px;
margin: 0 auto;
font-weight: 200; }
#footer a {
color: #7f8184;
text-decoration: none; }
#footer a img {
vertical-align: middle;
margin-right: 3px; }
#footer .col {
background: url../(../images/trans.png) 0 0 repeat;
color: #7f8184;
font-size: 1em;
line-height: 1.5;
padding: 5px 0; }
#footer .left {
width: 214px;
text-align: center;
margin-right: 2px; }
#footer .right {
width: 736px;
text-align: right;
padding-right: 24px; }
#footer .right ul {
float: right; }
#footer .right ul li {
margin: 0 10px; }
#admin-footer {
padding: 3em 0 0;
text-align: right; }
#admin-footer a {
color: #7f8184;
font-size: 1.1667em;
line-height: 1.2857;
font-weight: 700;
border-bottom: 3px solid transparent;
text-decoration: none; }
#admin-footer a:hover,
#admin-footer a.current {
color: #d86213;
border-bottom-color: #d86213; }
#page-image {
position: relative;
height: 550px;
clear: left;
}
#page-image img {
position: absolute;
top: 2px;
left: 0px;
}
.tertiary {
border-bottom: 1px solid #e2e0de;
margin-top: -2px;
padding-left: 7px;
margin-bottom: 0 !important; }
.tertiary a {
font-weight: 700;
font-size: 1.5em;
line-height: 1;
color: #c9c6c1;
padding: 7px 3px 11px;
margin-right: 47px;
border-top: 4px solid transparent; }
.tertiary a:hover,
.tertiary a.current {
color: #e07528;
border-top: 4px solid #e07528; }
#page-content {
overflow: hidden;
position: relative;
height: 290px;
}
#page-content #tabs-container {
position: absolute;
left: -7px;
width: 794px;
top: 3px;
}
#page-content #tabs-container .tab {
width: 976px;
float: left; }
#page-content #tabs-container .inset {
display: inline-block;
display: block;
padding: 1.5em 7px;
color: #99948c; }
#page-content #tabs-container .inset:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden; }
#page-content #tabs-container .inset a {
color: #df7419; }
#page-content #tabs-container #about .inset {
padding-right: 200px; }
#page-content #tabs-container #clients ul {
width: 189px;
float: left; }
#page-content #tabs-container #contact-studio-info .left {
width: 460px;
padding-right: 75px;
border-right: 1px solid #ccc; }
#page-content #tabs-container #contact-studio-info .right {
width: 390px;
padding-left: 30px; }
#page-content #tabs-container #contact-studio-info .map {
padding-top: 26px;
padding-left: 33px;
background: url(../images/map-thumb.png) left bottom no-repeat; }
#blog {
display: inline-block;
display: block; }
#blog:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden; }
#blog h2 {
font-weight: 200;
font-size: 1.8333em;
line-height: 0.8181;
padding-left: 19px;
padding-top: 0.8080em; }
#blog h2 a {
text-decoration: none;
color: #aaa69f; }
#blog .left {
width: 705px; }
#blog .left h3 {
color: #e17629;
font-weight: 700;
font-size: 1.5em;
line-height: 1;
padding-top: 1.5em;
margin-left: 61px; }
#blog .left h3 a {
color: #e17629;
text-decoration: none; }
#blog .left li.post {
margin-bottom: 9em; }
#blog .left .post {
margin-bottom: 3em; }
#blog .left .post .header {
display: inline-block;
display: block;
margin-top: 1.5em;
border-bottom: 1px solid #ccc;
position: relative; }
#blog .left .post .header:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden; }
#blog .left .post .header h3 {
margin-bottom: 9px; }
#blog .left .post .header .date {
position: absolute;
left: 0;
top: 1.5em;
width: 47px;
height: 39px;
color: #fff;
background: url(../images/date.png) 1px 0 no-repeat;
text-align: center;
padding-top: 4px; }
#blog .left .post .header .date .monthday {
margin: 0 auto; }
#blog .left .post .header .date .monthday .month,
#blog .left .post .header .date .monthday .day {
font-size: 1.25em;
line-height: 1.2;
font-weight: 600;
float: left; }
#blog .left .post .header .date .monthday .day {
border-left: 1px solid #fff;
width: 21px; }
#blog .left .post .header .date .monthday .month {
width: 21px; }
#blog .left .post .header .date .year {
font-size: 1.1667em;
line-height: 1.2857;
font-weight: 200; }
#blog .left .post .header .comment-meta {
background: #fff;
position: absolute;
right: 0;
bottom: -15px;
height: 24px;
padding: 0 0 0 4px; }
#blog .left .post .header .comment-meta a {
display: block;
color: #b9b6b0;
text-decoration: none;
line-height: 1.5; }
#blog .left .post .header .comment-meta a span {
display: inline-block;
background: url(../images/bubble.png) 0 0 no-repeat;
width: 20px;
height: 20px;
color: #fff;
text-align: center; }
#blog .left .post .header .comment-meta a.comment-none {
background: url(../images/plus-reverse.png) left center no-repeat;
padding-left: 16px; }
#blog .left .post .content {
display: inline-block;
display: block;
padding: 1.5em 5em 1.5em;
color: #7f7f7f; }
#blog .left .post .content:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden; }
#blog .left .post .content a {
color: #e17629; }
#blog .left .post .content p,
#blog .left .post .content ul {
font-size: 1em;
line-height: 1.5;
font-weight: 400;
margin-bottom: 1.5em; }
#blog .left .post .content p img,
#blog .left .post .content ul img {
max-width: 100%; }
#blog .left li.all {
margin-bottom: 1em !important; }
#blog .left li.all .header {
border-color: #eee !important;
margin-top: 1em !important; }
#blog .left li.all .date {
background-image: url(../images/date-grey.png) !important; }
#blog .left li.all h3 a {
color: #b5b1a8 !important; }
#blog .left li.all:hover h3 a {
color: #e17629 !important; }
#blog .left li.all:hover .date {
background-image: url(../images/date.png) !important; }
#blog #comments {
padding-left: 5em;
margin-top: 1.5em; }
#blog #comments h3 {
margin-bottom: 1.62em;
color: #b9b6b0; }
#blog #comments li {
display: inline-block;
display: block;
border-bottom: 1px solid #eee;
margin-bottom: 5px; }
#blog #comments li:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden; }
#blog #comments li .gravatar {
width: 60px;
float: left; }
#blog #comments li .comment-author {
width: 125px;
float: left;
color: #909090; }
#blog #comments li .comment-author h4 {
color: #909090; }
#blog #comments li .comment-author h4 a {
color: #909090;
text-decoration: none; }
#blog #comments li .comment-author h5 {
font-weight: 200;
color: #b9b6b0; }
#blog #comments li .comment-author h5 a {
color: #b9b6b0;
text-decoration: none; }
#blog #comments li .comment-content {
width: 450px;
float: left;
color: #b9b6b0;
font-size: 1em;
line-height: 1.5;
font-weight: 200; }
#blog .right {
width: 256px;
margin-left: 15px; }
#blog .right li {
margin-bottom: 0.75em; }
#blog .right li h3 a {
font-size: 1.5em;
line-height: 1;
color: #b9b6b0;
font-weight: 600;
text-decoration: none;
display: block;
padding: 0.5em 0.75em 0.25em;
background: url(../images/plus.png) 97% center no-repeat;
border-bottom: 1px solid #efeeed;
border-right: 1px solid #efeeed; }
#blog .right li h3 a:hover {
background-color: #f5f4f3; }
#blog .right li h3 a.open {
border: none;
background: #f5f4f3 url(../images/minus.png) 97% center no-repeat;
border-right: 1px solid #e6e4e2; }
#blog .right li ul,
#blog .right li ol {
background: #f5f4f3;
border-right: 1px solid #e6e4e2;
border-bottom: 1px solid #e6e4e2;
padding: 0 1.2em 0.75em; }
#blog .right li ul li,
#blog .right li ol li {
position: relative; }
#blog .right li ul li span,
#blog .right li ol li span {
display: none;
position: absolute;
left: -78px;
background: url(../images/post-round.png) 0 0 no-repeat;
padding-left: 9px; }
#blog .right li ul li span a,
#blog .right li ol li span a {
display: block;
height: 18px;
background: url(../images/post-point.png) 100% 0 no-repeat;
font-size: 1em;
line-height: 1.5;
font-weight: 500;
color: #fff;
padding: 0 18px 0 4px; }
#blog .right li ul li:hover span,
#blog .right li ol li:hover span {
display: block; }
#blog .right li ul li:first-child,
#blog .right li ol li:first-child {
background: url(../images/border-ol.png) 0 0 repeat-x;
padding-top: 1em; }
#blog .right li ul li a,
#blog .right li ol li a {
color: #b9b6b0;
text-decoration: none;
font-size: 1.1667em;
line-height: 1.2857;
font-weight: 200; }
#blog .right li ul li a:hover,
#blog .right li ol li a:hover {
color: #d86213; }
#blog .right li ul li.more a,
#blog .right li ol li.more a {
font-weight: 700;
text-align: right;
display: block;
padding-right: 2em;
background: url(../images/more.png) 97% center no-repeat; }
#blog .right li ul li ul,
#blog .right li ul li ol,
#blog .right li ol li ul,
#blog .right li ol li ol {
border: 0 none;
padding: 0 0.75em; }
#blog .right li ul li ul li:first-child,
#blog .right li ul li ol li:first-child,
#blog .right li ol li ul li:first-child,
#blog .right li ol li ol li:first-child {
background: none; }
#blog .right .twitter {
background: #f2f1f0 url(../images/tweet.png) 0 0 no-repeat;
padding-top: 10px;
width: 255px;
color: #7f7f7f;
text-align: center; }
#blog .right .twitter div {
background: url(../images/tweet.png) 0 100% no-repeat;
text-align: left; }
#blog .right .twitter div p {
font-size: 1.25em;
line-height: 1.2;
font-weight: 200;
margin: 0 22px 1.2em; }
#blog .right .twitter div p.date {
font-size: 1em;
line-height: 1.5;
color: #aaa;
margin: 0 0 0 60px; }
#blog .right .twitter div p.meta {
font-size: 1em;
line-height: 1.5;
margin: 0 0 0 60px; }
#blog .right .twitter div p a {
color: #e17629;
text-decoration: none; }
#admin-content .index p.tertiary {
text-align: right;
padding: 10px 0; }
#admin-content .index a {
font-size: 1.25em;
line-height: 1.2;
font-weight: 700;
text-decoration: none;
color: #c9c6c1;
margin: 0; }
#admin-content .index a:hover {
text-decoration: underline;
color: #e07528; }
#admin-content .index a.add {
padding-left: 16px;
background: url(../images/plus.png) left center no-repeat; }
#admin-content .index a.add:hover {
background-image: url(../images/plus-orange.png);
text-decoration: none; }
#admin-content .index ul {
margin-left: 3em; }
#admin-content .index ul li {
margin-bottom: 0.5em; }
#admin-content .index ul li span {
margin-right: 1em; }
#admin-content .index .posts {
display: inline-block;
display: block; }
#admin-content .index .posts:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden; }
#admin-content .index .posts .left {
width: 475px;
margin-right: 15px; }
#admin-content .index .posts .right {
width: 475px; }
#admin-content .index .posts h2 {
margin-top: 18px;
margin-bottom: 0; }
#admin-content .index table {
margin-top: 1.5em; }
#admin-content .index table th {
text-align: left;
padding: 0.75em 1em; }
#admin-content .index table tr {
border-bottom: 1px solid #ccc; }
#admin-content .index table td {
padding: 0.75em 1em; }
#admin-content .index table td a {
font-size: 1em;
line-height: 1.5;
font-weight: 400; }
#admin-content .index table td.date {
width: 60px; }
#admin-content .index table td.title {
width: 230px; }
#admin-content .index table td.admin {
width: 90px; }
#admin-content .index table td.admin a {
color: red; }
#admin-content form.formtastic textarea {
width: 816px; }
#admin-content #attachments {
padding: 1.5em 2em;
margin-left: 90px; }
#admin-content #attachments .attachment-delete {
color: red; }
#admin-content #attachments .ui-tabs .ui-tabs-hide {
display: none; }
#admin-content #attachments img {
width: 130px; }
#admin-content #attachments h3 {
margin-bottom: 1.5em; }
#admin-content #attachments #thumbnails {
margin-bottom: 3em; }
#admin-content #attachments #thumbnails>li {
margin-bottom: 1.5em;
margin-right: 2em;
width: 170px;
height: 250px; }
#admin-content #attachments #thumbnails>li ul {
margin: 0 !important; }
#admin-content #attachments #thumbnails .ui-tabs .ui-tabs-panel {
border: 1px solid #ccc; }
.pagination {
background: #F1F1F1;
border: 1px solid #E5E5E5;
text-align: center;
padding: 1em; }
.pagination a, .pagination span {
padding: .2em .3em; }
.pagination span.disabled {
color: #AAA;
visibility: hidden; }
.pagination span.current {
font-weight: bold;
background: transparent url(apple-circle.gif) no-repeat 50% 50%; }
.pagination a {
text-decoration: none;
color: #aaa; }
.pagination a:hover, .pagination a:focus {
text-decoration: underline; }
#portfolio {
padding: 44px 0 0;
overflow: hidden; }
#portfolio #image-navigation {
position: absolute;
top: 60px;
width: 100%;
height: 100%; }
#portfolio #image-navigation div {
height: 100%;
float: left;
width: 49%;
background-repeat: no-repeat; }
#portfolio #image-navigation div.prev {
background-position: 30% 35%; }
#portfolio #image-navigation div.next {
background-position: 70% 35%; }
#portfolio #thumbnails-wrap {
position: absolute;
bottom: 35px;
width: 100%; }
#portfolio #thumbnails-wrap #thumbnails {
width: 880px;
margin: 5px auto 0;
border: 1px solid #e2e0de;
padding: 5px 40px;
background: #f2f0ed; }
#portfolio #thumbnails-wrap #thumbnails .viewport {
overflow: hidden;
position: relative;
height: 58px; }
#portfolio #thumbnails-wrap #thumbnails .viewport ul {
background: #dedcd8;
padding: 5px;
position: absolute;
left: 0; }
#portfolio #thumbnails-wrap #thumbnails .viewport ul li {
margin-right: 10px;
width: 63px;
text-align: center;
display: table-cell;
vertical-align: middle;
height: 48px; }
#portfolio #thumbnails-wrap #thumbnails .scroller {
margin: 10px auto;
padding: 0 81px;
background: url(../images/slider-bar.png) 0 0 repeat-x;
position: relative; }
#portfolio #thumbnails-wrap #thumbnails .scroller .scroller-left,
#portfolio #thumbnails-wrap #thumbnails .scroller .scroller-right {
display: block;
height: 17px;
width: 17px;
position: absolute;
background: transparent none !important; }
#portfolio #thumbnails-wrap #thumbnails .scroller .scroller-left {
left: 0; }
#portfolio #thumbnails-wrap #thumbnails .scroller .scroller-right {
right: 0;
top: 0; }
#portfolio #thumbnails-wrap #thumbnails .scroller .ui-slider-horizontal {
height: 19px;
background: none;
border: 0 none; }
#portfolio #thumbnails-wrap #thumbnails .scroller .ui-slider-handle {
background: url(../images/slider.png) 0 0 no-repeat;
width: 123px;
height: 19px;
margin: 0 0 0 -62px;
top: -1px; }
#portfolio #thumbnails-wrap .controls {
display: inline-block;
display: block;
width: 880px;
top: 10px;
background-color: #f2f0ed;
z-index: 10000; }
#portfolio #thumbnails-wrap .controls:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden; }
#portfolio #thumbnails-wrap .controls .filters {
display: inline-block;
display: block;
margin-top: 10px;
background: url(../images/filters.png) 0 0 repeat-y;
margin-bottom: 10px; }
#portfolio #thumbnails-wrap .controls .filters:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden; }
#portfolio #thumbnails-wrap .controls .filters div {
padding: 0 15px;
margin: 10px 0; }
#portfolio #thumbnails-wrap .controls .filters .left {
width: 170px;
margin-right: 5px; }
#portfolio #thumbnails-wrap .controls .filters .middle {
width: 520px;
margin-right: 5px; }
#portfolio #thumbnails-wrap .controls .filters .right {
width: 90px; }
#portfolio #thumbnails-wrap .controls .filters a.radio {
font-size: 12px;
line-height: 16px;
color: #aaa;
font-weight: 700;
float: left;
width: 200px;
padding-left: 21px;
background: url(../images/radio.png) 0 0 no-repeat;
text-decoration: none; }
#portfolio #thumbnails-wrap .controls .filters a.radio.selected, #portfolio #thumbnails-wrap .controls .filters a.radio:hover {
background-position: 0 -16px; }
#portfolio #thumbnails-wrap .controls .filters .tags {
float: left;
width: 480px;
margin: 6px 10px 10px 21px; }
#portfolio #thumbnails-wrap .controls .filters .tags li {
float: left;
width: 150px; }
#portfolio #thumbnails-wrap .controls .filters .tags li a {
font-size: 1.083em;
line-height: 1.3846;
text-decoration: none;
color: #aaa;
padding-left: 22px;
background: url(../images/filter-box.png) 0 0 no-repeat; }
#portfolio #thumbnails-wrap .controls .filters .tags li a:hover {
background-position: 0 -32px;
color: #e0753a; }
#portfolio #thumbnails-wrap .controls .filters .tags li a.selected {
background-position: 0 -16px !important; }
#portfolio #thumbnails-wrap .controls .filters .button {
float: left;
width: 100px; }
#portfolio #thumbnails-wrap .controls .left {
width: 600px;
font-size: 1.1667em;
color: #aaa; }
#portfolio #thumbnails-wrap .controls .left li {
margin-right: 40px; }
#portfolio #thumbnails-wrap .controls .left li a {
color: #e07528;
text-decoration: none;
font-size: 90%; }
#portfolio #thumbnails-wrap .controls .right {
font-size: 1.1667em;
color: #aaa;
width: 280px;
text-align: right; }
#portfolio #thumbnails-wrap .controls .right img {
float: left;
margin-top: 2px; }
#portfolio #thumbnails-wrap .controls .right img a {
float: right;
text-decoration: none;
color: #aaa;
font-size: 1.1667em; }
#portfolio #thumbnails-wrap .controls .right .image-position {
margin-left: 20px;
width: 150px; }
#portfolio #thumbnails-wrap .controls .right .image-position div {
background: url(../images/caret-bar.png) center no-repeat;
text-align: left;
position: relative;
height: 1.5em; }
#portfolio #thumbnails-wrap .controls .right .image-position img {
position: absolute;
left: 0;
top: 40%; }
#portfolio #thumbnails-wrap .filter-wrap {
height: 100px; }
#admin-photos {
display: inline-block;
display: block; }
#admin-photos:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden; }
#admin-photos > li {
margin: 5px;
width: 140px;
height: 150px;
text-align: center;
position: relative;
float: left;
background: #f2f0ed;
padding: 6px;
border-top: 3px solid transparent; }
#admin-photos > li img {
max-height: 150px;
max-width: 140px; }
#admin-photos > li div {
padding-top: 6px;
position: absolute;
top: 0;
left: 0;
text-align: center;
width: 100%;
height: 100%;
background: url(../images/trans-white.png) 0 0 repeat;
display: none; }
#admin-photos > li div a.dialog {
font-size: 0.9167em;
line-height: 1.6363;
font-weight: 500;
background: url(../images/admin-photo-curve-white.png) 0 0 no-repeat;
padding-left: 9px;
color: #fff;
text-decoration: none;
display: inline-block;
height: 18px; }
#admin-photos > li div a.dialog span {
background: url(../images/admin-photo-point-white.png) 100% 0 no-repeat;
padding-right: 12px;
height: 18px;
display: inline-block;
float: left; }
#admin-photos > li div a.dialog span img {
vertical-align: middle; }
#admin-photos > li div a.dialog:hover {
color: #fff;
background-image: url(../images/admin-photo-curve.png); }
#admin-photos > li div a.dialog:hover span {
background-image: url(../images/admin-photo-point.png); }
#admin-photos > li div ul.meta {
position: absolute;
top: 135px;
right: 0; }
#admin-photos > li div ul.meta li {
margin-right: 5px; }
#admin-photos > li div ul.meta li a {
display: block;
width: 20px;
height: 20px; }
#admin-photos > li div ul.meta li a.power {
background: url(../images/power-off.png) center no-repeat; }
#admin-photos > li div ul.meta li a.power:hover {
background-image: url(../images/power-on.png); }
#admin-photos > li div ul.meta li a.home-slideshow {
background: url(../images/home.png) center no-repeat; }
#admin-photos > li div ul.meta li a.home-slideshow:hover {
background-image: url(../images/home-on.png); }
#admin-photos > li.ui-sortable-helper div {
display: none !important; }
#admin-photos > li:hover div,
#admin-photos > li.inactive:hover div ul {
display: block; }
#admin-photos > li:hover div a.delete,
#admin-photos > li.inactive:hover div ul a.delete {
position: absolute;
top: 135px;
left: 5px;
display: block;
width: 20px;
height: 20px;
background: url(../images/delete.png) center no-repeat; }
#admin-photos > li:hover div a.delete:hover,
#admin-photos > li.inactive:hover div ul a.delete:hover {
background-image: url(../images/delete-on.png); }
#admin-photos > li.inactive:hover a.dialog {
display: inline-block; }
#admin-photos > li.inactive div {
display: block; }
#admin-photos > li.inactive div ul,
#admin-photos > li.inactive div a.dialog {
display: none; }
#admin-photos > li.active a.power {
background-image: url(../images/power-on.png) !important; }
#admin-photos > li.slideshow {
border-top-color: #d86213; }
#admin-photos > li.slideshow div a.home-slideshow {
background-image: url(../images/home-on.png) !important; }
#admin-photos-new {
float: right;
width: 200px;
margin-top: 10px; }
#admin-photos-new a {
font-weight: 700;
font-size: 1.25em;
line-height: 1.2;
color: #c9c6c1;
text-decoration: none;
padding-left: 16px;
background: url(../images/plus.png) left center no-repeat; }
#admin-photos-new a:hover,
#admin-photos-new a.current {
color: #e07528;
background-image: url(../images/plus-orange.png); }
#admin-photos-tabs {
margin-top: 0;
width: 500px;
float: left; }
div.bubble label {
font-size: 1.3333em;
line-height: 1.125;
font-weight: 700;
padding-right: 1em; }
div.bubble .col {
width: 185px;
text-align: center;
margin-bottom: 3em; }
div.bubble .col div.thumbnail {
height: 150px; }
div.bubble .col div.thumbnail img {
max-width: 140px;
max-height: 150px; }
div.bubble .left {
border-right: 1px solid #d86213; }
div.bubble .left div {
height: 150px; }
div.bubble .filters {
clear: both;
padding: 1.5em 2em 1.5em;
background: #f2f0ed; }
div.bubble .filters input {
font-size: 1.3333em;
line-height: 1.125;
width: 250px; }
div.bubble .description {
padding: 3em 2em 0; }
div.bubble .description textarea {
width: 325px; }
form.formtastic fieldset {
background: #f5f4f3;
border-right: 1px solid #e6e4e2;
border-bottom: 1px solid #e6e4e2;
padding: 10px; }
form.formtastic fieldset ol li {
border-bottom: 0 none !important;
margin-bottom: 0 !important; }
form.formtastic fieldset ol li label {
font-size: 1.1667em;
line-height: 1.2857;
color: #b9b6b0;
font-weight: 500;
width: 75px;
padding: 5px 25px 5px 0;
text-align: right; }
form.formtastic fieldset ol li.string input,
form.formtastic fieldset ol li.password input,
form.formtastic fieldset ol li.numeric input {
font-size: 1.1667em;
line-height: 1.2857;
padding: 5px;
width: 241px;
background: #fff none;
border: 0 none; }
form.formtastic fieldset ol li#comment_content_input label {
visibility: hidden; }
form.formtastic fieldset ol li.text textarea {
font-size: 1.1667em;
line-height: 1.2857;
padding: 5px;
border: 0 none;
width: 500px; }
form.formtastic fieldset ol li.commit {
text-align: right;
padding-right: 20px; }
form.formtastic fieldset ol li.commit button {
font-size: 1.083em;
line-height: 1.3846;
color: #fff;
font-weight: 700;
border: 0 none;
background: transparent url(../images/button-submit.png) 0 0 no-repeat;
width: 139px;
height: 27px;
text-align: center;
padding: 0 0 3px;
cursor: pointer; }