.tools {
	/*background-color: #DBDBD0;*/
   padding:2px;
}

.toolbox-item {
   background-color:#ddd;
   border-top: 2px solid #ddd;
   border-left: 2px solid #ddd;
   border-bottom: 2px solid #ddd;
   border-right: 2px solid #ddd;
   padding: 6px;
   cursor:pointer;
}

.toolbox-item:hover {
   background-color:#eee;
   border-top: 2px solid #eee;
   border-left: 2px solid #eee;
   border-bottom: 2px solid #888;
   border-right: 2px solid #888;
}

.toolbox-state-active {
   background-color:#ddd;
   border-top: 2px solid #888;
   border-left: 2px solid #888;
   border-bottom: 2px solid #eee;
   border-right: 2px solid #eee;
}
.toolbox-state-active:hover {
   background-color:#eee;
   border-top: 2px solid #888;
   border-left: 2px solid #888;
   border-bottom: 2px solid #eee;
   border-right: 2px solid #eee;
}


.toolbox-icon {
	width: 32px; 
	height: 32px; 
	background-image: url(images/toolbox.png);
	display:inline-block;
	margin: 8px;
}

.toolbox-icon.small {
	width: 16px; 
	height: 16px; 
	background-size: 112px;
	margin: 0px 4px 0px 4px;
	float: left;
}

.toolbox-icon.toolbox-text { background-position: 0 0; }
.toolbox-icon.toolbox-color { background-position: -32px 0; }
.toolbox-icon.small.toolbox-color { background-position: -16px 0; }
.toolbox-icon.toolbox-texture { background-position: -64px 0; }
.toolbox-icon.small.toolbox-texture { background-position: -32px 0; }
.toolbox-icon.toolbox-smooth { background-position: -96px 0; }
.toolbox-icon.small.toolbox-smooth { background-position: -48px 0; }
.toolbox-icon.toolbox-symbol { background-position: -128px 0; }
.toolbox-icon.small.toolbox-symbol { background-position: -64px 0; }
.toolbox-icon.toolbox-palette { background-position: -160px 0; }
.toolbox-icon.small.toolbox-palette { background-position: -80px 0; }
.toolbox-icon.toolbox-replacetexture { background-position: -192px 0; }
.toolbox-icon.small.toolbox-replacetexture { background-position: -96px 0; }
.toolbox-icon.toolbox-settings {
	background-image: url(images/picto_reparation_64.png);
	background-size: 32px;
	background-position: 0px 0;
}
.toolbox-icon.small.toolbox-settings { 
	background-image: url(images/picto_reparation_64.png);
	background-size: 16px;
	background-position: 0px 0;
}

.toolbox-icon.small.toolbox-info {
    background-image: url(images/picto_information_ac_reflet_32.png);
    background-position: 0 0;
    background-size: 16px auto;
}



.op-style-expanded .op-short-title {
	background-color: #eee;
	border: 1px solid #ccc;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	margin: 10px;
}

.op-style-expanded .op-short-title:hover {
	background-color: #d1d4ff;
}

.op-style-expanded .op-selected {
	/*background-color:#d7f9be !important;
	border: 1px solid #000;*/
	background-color:white !important;
	border: 1px solid #aaa;
}
.op-style-expanded .op-selected:hover {
	/*background-color:#d7f9be !important;
	border: 1px solid #000;*/
	background-color:#eee !important;
	border: 1px solid #aaa;
}

.op-style-expanded .SculpteoOperation {
	background-color: white;
	border: 1px solid #ccc;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	margin: 10px;
	padding: 10px;
}

.ui-accordion-header {
	margin: 0px;
	padding: 0px;
}

.help {
	position:absolute;
	background:url(images/lateral_alert_right.png) 0 0 no-repeat;
	width:248px;
	height:181px;
	z-index: 1000;
        font-weight: bold;
        text-align: left;
}
.help.onleft {
	background:url(images/lateral_alert.png) 0 0 no-repeat;
}
.help_pad {
	padding:8px 26px 12px 52px;
	font-size:16px;
	color:white;
}
.help p {
	font-weight: bold;
}
.help > .help_close_button {
	width:22px;
	height:22px;
	position:relative;
	right:10px;
	top:10px;
        float:right;
	background: url('images/help_close_button.png') no-repeat;
}
.help > .help_close_button:hover {
        background: url('images/help_close_button_hover.png') no-repeat;
}
.help.onleft > .help_close_button {
        float:left;
        right:0;
        left:10px;
}

.more-above, .more-below {
	background-color: #444480;
	color: white;
	border: 1px solid #0000ff;
	font-size: 12px;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	cursor: pointer;
	height: 20px;
	position: absolute;
	width: 30px;
}

.gallery-texture-pick img {
	margin: 2px; 
	cursor: pointer;
}

.crop-img {
	max-width: 128px;
	max-height: 128px; 
	width: expression(this.height < this.width && this.width > 128 ? 128 : true); 
	height: expression(this.height >= this.width && this.height > 128 ? 128 : true); 
	margin: 4px; 
	cursor: pointer;
}


.picker-scroll-pane { overflow: auto; width: 99%; float:left; }
.picker-scroll-content { width: 2440px; float: left; }
.picker-scroll-content-item { 
	width: 100px; height: 75px; 
	float: left; 
	margin: 4px; 
	text-align: center;	
	border: 3px #fff solid;	-webkit-border-radius: 3px;	-moz-border-radius: 3px; border-radius: 3px;
	background-color: white;
	vertical-align: middle;
	cursor: pointer;
	position: relative;
}
.picker-scroll-bar-wrap { clear: left; padding: 0 4px 0 2px; margin: 0 -1px -1px -1px; }
.picker-scroll-bar-wrap .ui-slider { background: none; border:0; height: 18px; margin: 0 auto;  }
.picker-scroll-bar-wrap .ui-handle-helper-parent { position: relative; width: 100%; height: 100%; margin: 0 auto; }
.picker-scroll-bar-wrap .ui-slider-handle { top:-1px; height: 18px; }
.picker-scroll-bar-wrap .ui-slider-handle .ui-icon { margin: -8px auto 0; position: relative; top: 50%; }
.picker-scroll-bar-wrap .ui-slider-handle.ui-state-default.ui-corner-all {
	border:1px #2b78e4 solid !important;
	cursor: default;
	width: auto;
}
.picker-scroll-content-item img {
  /* We want a caption to display on the next line */
  max-width: 100px;
  max-height: 75px;
}
.picker-scroll-content-item:hover > img {
  filter:alpha(opacity=50);
  opacity: 0.5;
}
.picker-scroll-content-item .picker-scroll-content-caption {
	display: none;
	position: absolute;
	bottom: 4px;
	text-align: center;
	width: 100%;
	overflow: hidden;
	opacity: 0.8;
	background-color: white;
	color: black;
	font-size: smaller;
}
.picker-scroll-content-item:hover .picker-scroll-content-caption {
	display: block;
}

.picker-scroll-content-item.audio .audioButton {
	margin-top: 8px;
}
.picker-scroll-content-item.audio .audioSelect {
	margin-top: 8px;
	font-weight: bold;
	display: block;
	background-color: black;
	color: white;
	border: 1px solid black;
	text-decoration: none;
}
.picker-scroll-content-item.audio .audioSelect:hover {
	background-color: white;
	color: black;
}

div.picker-add {
	font-size: 64px;
	font-weight: bold;
	text-align: center;
	line-height: 80px;
	color: #AAAAAA;
	background-color: #bec9d9;
	position: relative;
}
div.picker-add:hover {
	color: black;
}
div.picker-add span.hint {
	position: absolute;
	font-size: 10px;
	line-height: normal;
	top: 5px;
	left: 5px;
	width: 95px;
	display: none;
}
div.picker-add span.hint.hint2 {
	top: 60px !important;
}
div.picker-add:hover span.hint {
	display: block;
}

div.audio-record .swf {
}
div.audio-record .recorder-button {
	background: url("images/audio_recorder_buttons.24.png") no-repeat 0 0px;
	cursor: pointer;
	height: 24px;
	width: 24px;
}
div.audio-record .recorder-button.record {	background-position: 0 0px; }
div.audio-record .recorder-button.record:hover {	background-position: -24px 0px; }
div.audio-record .recorder-button.play { background-position: 0 -24px; }
div.audio-record .recorder-button.play:hover { background-position: -24px -24px; }
div.audio-record .recorder-button.stop { background-position: 0 -48px; }
div.audio-record .recorder-button.stop:hover { background-position: -24px -48px; }
div.audio-record .recorder-button.upload { background: transparent; }
/* div.audio-record .recorder-button.upload:hover { background-position: -24px -72px; } */

.audioButton {
	background: url("images/audio_player_buttons.png") no-repeat 0 0px;
	cursor: pointer;
	margin: 0;
	padding: 0px 0px 0px 24px;
	height: 20px;
	font-size: 10px;
	line-height: 20px;
	max-width: 90px;
	overflow: hidden;
	text-align: left;
}

.audioButton:hover {
	background-position: 0 -40px;
}

.audioButton.playing {
	background-position: 0 -80px;
}

.audioButton.playing:hover {
	background-position: 0 -120px;
}

.audioButton.loading,
.audioButton.loading:hover {
	background-position: 0 -160px;
}

#player {
}

.designoperationdesignparameter .design-list {
	height: 120px;
	overflow: auto;
	width: 230px; 
	margin-left: 24px; 	
}
.designoperationdesignparameter .design-list .item {
	float: left;
	position: relative;
	width: 64px;
	margin-left: 4px;
	cursor: pointer;
}
.designoperationdesignparameter .design-list .item img {
	max-width: 100%; 
	max-height: 100%;
}
.designoperationdesignparameter .design-list .item span {
	position: absolute;
	display:none;
	text-align: center;
	font-size: x-small;
	background-color: white;
	opacity: 0.8;
	color: black;
	width: 64px;
	bottom: 8px;
	left: 0px;
	z-index: 1;
	overflow: hidden;
}
.designoperationdesignparameter .design-list .item:hover span {
	display: inline-block;
}

.designoperationdesignparameter .selected-design {
}
.designoperationdesignparameter .selected-design .the-design {
	position: relative;
}
.designoperationdesignparameter .selected-design img.thumbnail {
	width: 200px;
}

.designoperationdesignparameter .selected-design span.design-title {
	position: absolute;
	bottom: 20px;
	left: 0px;
	overflow: hidden;
	width: 200px;
	background-color: white;
	opacity: 0.8;
	text-align: center;
	font-size: small;
}

.create-wizard {
	margin-right: 8px;
	margin-left: 8px;
	position: relative;
	overflow: hidden;
	width: 265px;
	height: 690px;
}

.create-wizard .slider {
	margin-top: 8px;
	width: 4050px;
}

.create-wizard .section {
	border: 2px #aaaaaa solid;
	border-radius: 4px;
	margin-bottom: 10px;
}

.create-wizard .section .title {
	height: 48px;
	background-color: #ddddee;
	display: block;
	font-weight: bold;
}
.create-wizard .section .title .text {
	font-size: 14px;
	color: #323232;
	font-weight: bold;
	display: inline-block;
	margin-top: 0px;
	vertical-align: top;
	margin-top: 15px;
}
.create-wizard .item {
	display: block;
	background-color: white;
	color: black;
	border-top: 1px solid #888888;
	padding: 6px 0px 6px 8px;
	text-decoration: none;
} 

.create-wizard .item:hover {
	background-color: #eeeeff;
} 

.create-wizard .additional-block {
	float: left;
	width: 265px;
}

.create-wizard .creation-block {
	border: 2px #aaaaaa solid;
	background-color: white;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
}
.create-wizard .SculpteoOperation {
	margin: 4px;
}
.create-wizard .wizard-navigation-back {
	background-color: black;
	color: white;
	display: block;
	padding: 4px;
	font-variant: small-caps;
	text-align: center;
}
.create-wizard .wizard-tool-title {
	background-color: #eee;
	border-bottom: 1px solid black;
	color: black;
	display: block;
	padding: 4px;
	font-variant: small-caps;
	text-align: center;
}

#operations-container.configuration {
	border-radius: 7px;
	-webkit-border-radius: 7px;
	-moz-border-radius: 7px;
	margin-top: 4px;
}

.configuration .tab-item {
	margin-right: 2px;
}

.configuration .tab-item.selected {
	margin-right: 0px;
}

.details-sharing-form .sharing-form-label label {
    font-size: 12px !important;
}
.details-sharing-form .sharing-form-help span {
    font-size: 8px !important;
}
.details-sharing-form .abottom {
    vertical-align: top;
    padding-top: 14px;
}

.button-small {
		background-image:url('images/button-160-yellow-small.png');
		background-repeat:no-repeat;
		background-color:transparent;
		background-position:0 0;
		padding:0;
		margin:0;
		width:100px;
		height:20px;
		display:inline-block;
		text-align:center;
		line-height:20px;
		text-decoration:none;
		font-family:Arial;
		font-size:12px;
		font-weight:normal;
		font-style:normal;
		color:white !important;
		text-shadow: rgba(255,255,255,.5) 0px 1px 0px, rgba(0,0,0,.3) 0px -1px 0px;
		outline:0;
		border:0;
} 

.configurable-field.configuration-state-active {
    background-color: #F0F0F0;
    padding: 4px;
    border: 1px solid #F0F0F0;
    margin-top: 2px;
    border-radius: 7px;
    -webkit-border-radius: 7px;
    -moz-border-radius: 7px;
	-webkit-transition: background-color 2000ms linear,
		padding 500ms ease-in;
	-moz-transition: background-color 2000ms linear,
		padding 500ms ease-in;
	-o-transition: background-color 2000ms linear,
		padding 500ms ease-in;
	-ms-transition: background-color 2000ms linear,
		padding 500ms ease-in;
	transition: background-color 2000ms linear,
		padding 500ms ease-in;
}

.configurable-field-type-symbol.configuration-state-active {
    background-color: #FBFAF0 !important;
}
.configurable-field-type-color.configuration-state-active{
    background-color: #F0FAFE !important;
}
.configurable-field-type-first_color.configuration-state-active {
    background-color: #F0FAFE !important;
}
.configurable-field-type-second_color.configuration-state-active {
    background-color: #FEFAF0 !important;
}
.configurable-field-type-gradient.configuration-state-active {
    background-color: #F0F0F0 !important;
}
.configurable-field-type-dig.configuration-state-active {
    background-color: #FEF0FA !important;
}
.configurable-field-type-size.configuration-state-active {
    background-color: #E8F0FA !important;
}
.configurable-field-type-height.configuration-state-active {
    background-color: #FEF0F0 !important;
}
.configurable-field-type-position.configuration-state-active {
    background-color: #FBF0D0 !important;
}
.configurable-field-type-text.configuration-state-active {
    background-color: #FBF0DD !important;
}
.configurable-field-type-font.configuration-state-active {
    background-color: #DDF0FB !important;
}
.configurable-field-type-texture.configuration-state-active {
    background-color: #F0F0F0 !important;
}
.configurable-field-type-crop.configuration-state-active {
    background-color: #D0FBF0 !important;
}
.configurable-field-type-material.configuration-state-active {
    background-color: #F0FBD0 !important;
}
.configurable-field-type-texture_id.configuration-state-active {
    background-color: #F0FBD0 !important;
}
.configurable-field-type-logo.configuration-state-active {
    background-color: #F0FBD0 !important;
}
.configurable-field-type-details.configuration-state-active {
    background-color: #F0FBD0 !important;
}
.configurable-field-type-invert.configuration-state-active {
    background-color: #FBF0D0 !important;
}
.configurable-field-type-usecolors.configuration-state-active {
    background-color: #FAF0F0 !important;
}

.configurable-field.configuration-state-inactive {
	-webkit-transition: background-color 2000ms linear,
		padding 500ms ease-in;
	-moz-transition: background-color 2000ms linear,
		padding 500ms ease-in;
	-o-transition: background-color 2000ms linear,
		padding 500ms ease-in;
	-ms-transition: background-color 2000ms linear,
		padding 500ms ease-in;
	transition: background-color 2000ms linear,
		padding 500ms ease-in;
    background-color: transparent;
}

.configuration-state-inactive .configurable-field-lock {
    display: none;
}

.configuration-state-inactive.configurable-field-state-locked {
    display: none;
}

/* position field is not displayed if configuration is inactive */
.configurable-field-type-position.configuration-state-inactive {
    display: none;
}

.ui-icon-preview {
	background: url("images/oeil_16.png") no-repeat 0 0px;
	height: 16px;
	width: 16px;
}

.preview-disable {
	background: url("images/oeil_16_barre.png") no-repeat 0 0px;
	height: 16px;
	width: 16px;
}

.op-delete-short {
    top: 9px;
    left: 2px;
    position: absolute;
}
/**
 * Farbtastic Color Picker 1.2
 * © 2008 Steven Wittens
 *
 * This program is free software; you can redistribute it and/or modify
 * it under the terms of the GNU General Public License as published by
 * the Free Software Foundation; either version 2 of the License, or
 * (at your option) any later version.
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU General Public License for more details.
 *
 * You should have received a copy of the GNU General Public License
 * along with this program; if not, write to the Free Software
 * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA  02110-1301  USA
 */
.farbtastic {
  position: relative;
}
.farbtastic * {
  position: absolute;
}
.farbtastic, .farbtastic .wheel {
  width: 120px;
  height: 101px;
}
.farbtastic .color, .farbtastic .overlay {
  top: 0px;
  left: 0px;
  width: 101px;
  height: 101px;
}
.farbtastic .wheel {
  background: url(../images/farbastic/wheel.png) no-repeat;
  width: 120px;
  height: 101px;
}
.farbtastic .overlay {
  background: url(../images/farbastic/mask.png) no-repeat;
}
.farbtastic .marker {
  width: 17px;
  height: 17px;
  margin: -8px 0 0 -8px;
  overflow: hidden; 
  background: url(../images/farbastic/marker.png) no-repeat;
}

.farbtastic .marker2 {
  width: 17px;
  height: 17px;
  margin: -8px 0 0 -8px;
  overflow: hidden; 
  background: url(../images/farbastic/marker2.png) no-repeat;
}

/* Fixes issue here http://code.google.com/p/jcrop/issues/detail?id=1 */
.jcrop-holder { text-align: left; }
.jcrop-holder img { 
	max-width: none; 
}

.jcrop-vline, .jcrop-hline
{
	font-size: 0px;
	position: absolute;
	background: white url('images/Jcrop.gif') top left repeat;
}
.jcrop-vline { height: 100%; width: 1px !important; }
.jcrop-hline { width: 100%; height: 1px !important; }
.jcrop-vline.right { right: 0px; }
.jcrop-hline.bottom { bottom: 0px; }
.jcrop-handle {
	font-size: 1px;
	width: 7px !important;
	height: 7px !important;
	border: 1px #eee solid;
	background-color: #333;
}

.jcrop-tracker { width: 100%; height: 100%; }

.custom .jcrop-vline,
.custom .jcrop-hline
{
	background: yellow;
}
.custom .jcrop-handle
{
	border-color: black;
	background-color: #C7BB00;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
}