.js .theme-group-content, .js #submitBtn, .js select.texture, .js #themeGallery, .js #help { display: none; }
#themeRoller * { font-family: Verdana, Arial, Helvetica, sans-serif !important; font-size: 10px !important; }
#themeRoller { font-family: Verdana, Arial, Helvetica, sans-serif !important; font-size: 10px !important; background-position: #000000; /* font-family: Verdana, Arial, sans-serif;*/ margin: 0; width: 214px; padding: 0 !important; color: #FFFFFF; }
#themeRoller a:focus { outline: 0 !important; }
#themeHeader h1 { /*logo*/ font-size: 1.5em; color: #fff; font-weight: normal; width: 213; height: 46px; margin: 0 0 -1px 0; padding: 0; text-indent: -999999px; /*overflow: hidden;*/ background: transparent url(images/themeroller/logo_themeRoller_sml.gif) -5px 0 no-repeat; }
/*corner radius in TR app elements*/
#themeRoller, #themeRoller .corner-all, #themeRoller input, #themeRoller select, #themeGallery a.download, #themeGallery a.edit, .farbtastic { -moz-border-radius: 4px !important; -webkit-border-radius: 4px !important; border-radius: 4px !important; }
#themeRoller .corner-bottom { -moz-border-radius-bottomleft: 4px !important; -webkit-border-bottom-left-radius: 4px !important; border-bottom-left-radius: 4px !important; -moz-border-radius-bottomright: 4px !important; -webkit-border-bottom-right-radius: 4px !important; border-bottom-right-radius: 4px !important; }
#themeRoller .corner-top { -moz-border-radius-topleft: 4px !important; -webkit-border-top-left-radius: 4px !important; border-top-left-radius: 4px !important; -moz-border-radius-topright: 4px !important; -webkit-border-top-right-radius: 4px !important; border-top-right-radius: 4px !important; }
#themeRoller form { margin: 2px; clear: both; }
#themeRoller .icon { width: 16px; height: 16px; display: block; text-indent: -999999px; /*overflow: hidden;*/ }
#rollYourOwn, #themeGallery { clear: left; padding: 20px 0; display: block; }
/*THEME GROUP SPINDOWNS*/
#themeRoller .theme-group { margin: 1px 0; width: 210px; }
#themeRoller .theme-group-header { cursor: pointer; padding: .4em 0; }
/*header states*/
#themeRoller .theme-group .theme-group-header.state-default { border: 1px solid #222 /*borderColorDefault*/; background: #111111; font-weight: normal; color: #aaaaaa /*fcDefault*/ !important; }
#themeRoller .theme-group .theme-group-header.state-default a { color: #aaaaaa /*fcDefault*/; text-decoration: none; }
#themeRoller .theme-group .theme-group-header.state-active { border: 1px solid #444 /*borderColorActive*/; border-bottom: 0 !important; background: #333; font-weight: normal /*fwDefault*/; color: #ffffff /*fcActive*/ !important; outline: none; }
#themeRoller .theme-group .theme-group-header.state-active a { color: #ffffff /*fcActive*/; outline: none; text-decoration: none; }
#themeRoller .theme-group .theme-group-content { border: 1px solid #444 /*borderColorContent*/; background: #333; color: #ffffff /*fcContent*/; }
#themeRoller .theme-group .theme-group-header.state-hover { border: 1px solid #444 /*borderColorHover*/; background: #1a1a1a; font-weight: normal /*fwDefault*/; color: #cccccc /*fcHover*/ !important; }
#themeRoller .theme-group .theme-group-header.state-hover a { color: #cccccc /*fcHover*/; text-decoration: none; }
#themeRoller .theme-group .theme-group-header span.icon { float: left; margin: -2px 3px 0 0; background-image: url(images/themeroller/tr_icons_white.png); }
#themeRoller .state-active span.icon { margin: -1px 2px 0 1px !important; }
#themeRoller .theme-group .theme-group-header span.icon-triangle-1-e { background-position: -32px -16px; }
#themeRoller .theme-group .theme-group-header span.icon-triangle-1-s { background-position: -64px -16px; }
#themeRoller .theme-group .theme-group-header div.state-preview { float: right; padding: 1px 2px 2px; font-size: 9px !important; font-weight: normal !important; margin: -2px 3px 0 0; }





/*THEME GROUP CONTENT*/
#themeRoller .theme-group-content { padding: 1px 5px 5px 20px; border-top: 0 !important; }
#themeRoller .theme-group-collapsed .theme-group-content { display: none; }
#themeRoller .theme-group h3 { font-size: .8em; font-weight: bold; text-transform: uppercase; }

/*form field groups*/
#themeRoller .field-group { float: left; width: 53px; margin: 2px 4px 0 0; }
#global-font .field-group, #global-corners .field-group, #themeRoller .field-group-background, #themeRoller .field-group-opacity { margin: 4px 0 0; clear: both; float: none; width: auto; }
#themeRoller .field-group-border, #themeRoller .field-group-opacity, #themeRoller .field-group-corners { clear: left; }

/*form labels*/
#themeRoller .field-group label { font-size: 1em; margin: 6px 0 5px; display: block; }
#global-font .field-group label, #global-corners .field-group label, #themeRoller .field-group-opacity label { float: left; width: 60px; margin: 0 4px 0 0; text-align: right; }
#global-font .field-group label { width: 35px; }

#themeRoller .field-group-opacity label { width: auto; text-align: left; }



/*form inputs/selects */
#themeRoller input, #themeRoller select { border: 1px solid #666; background: #333; color: #fff; font-size: 1em; padding: 2px; }
#themeRoller select { padding: 1px; }
input.opacity, input.offset { width: 20px; float: left; }
span.opacity-per { float: left; padding: 0 .2em; }
#themeRoller input.hex { width: 42px; outline: 0; }
input#ffDefault, select#fwDefault { width: 120px; }
input.cornerRadius { width: 20px; }


/*Custom form elements */
#themeRoller div.hasPicker { position: static; width: 48px; padding: 1px; margin: -2px 0 0 -2px; border: 1px solid #333; float: left; }
#themeRoller div.picker-on { background: #666; border-color: #aaa; border-bottom: #666; }
/*pickers*/
#picker { position: absolute; left: 0; top: auto; width: 200px; }




/*rounded corner warnings*/
a.cornerWarning { color: red !important; text-decoration: none; }
#cornerWarning { font-size: .9em; margin: 5px 0; }



/*Farbtastic styles*/
.farbtastic { position: relative; background: #555; border: 1px solid #aaa; top: 1px; left: 0; z-index: 99999999; }
.farbtastic * { position: absolute; cursor: crosshair; }
.farbtastic, .farbtastic .wheel { width: 195px; height: 195px; }
.farbtastic .color, .farbtastic .overlay { top: 47px; left: 47px; width: 101px; height: 101px; }
.farbtastic .wheel { background: url(images/themeroller/wheel.png) no-repeat; width: 195px; height: 195px; }
.farbtastic .overlay { background: url(images/themeroller/mask.png) no-repeat; }
.farbtastic .marker { width: 17px; height: 17px; margin: -8px 0 0 -8px; /*overflow: hidden;*/ background: url(images/themeroller/marker.png) no-repeat; }



/*NON_JS Submit Button*/
#submitBtn { background: #000000; color: #fff; text-decoration: none; border: 1px solid #444; font-weight: bold; cursor: pointer; font-size: 1.1em; padding: .4em 10px; font-family: Verdana, Arial, Helvetica, sans-serif; }
#submitBtn:hover { background: #0D0D0D; }


/* ---------------------------------------------------------------
Clearfix
--------------------------------------------------------------- */
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }

.clearfix { display: inline-block; }

/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */

