/* ----------------------------------------------------------------------------------------------------------------------------
 
 forms.css
 * Form elements
 * @author    julien bidoret
 * @copyright (c) 2009, oxys.net
 * @date      24 juin 2009
 * @version   0.1
 
---------------------------------------------------------------------------------------------------------------------------- */

/* forms 
---------------------------------------------------------------------------------------------------*/
fieldset {padding:0; margin:0; border-width:0}
textarea, textarea.input-textarea, select, select.input-select,
.input-text, .input-text-huge {border-width:1px; border-style:solid; border-color: #e4e4e4; margin:0; font-family:Arial, Helvetica, sans-serif;}
    .input-text {padding:2px;}
    
.inline-form input, .inline-form label{margin-right: 4px;} 

.basic{border:0; padding:1px 4px 2px 4px; color:#ff f; text-transform:uppercase; font-size:11px !important; width:auto;background:#868686 }


/* brand new forms 
---------------------------------------------------------------------------------------------------*/

/* p ----- */
    .ox-popup-message .intro, 
    .ox-popup-form .intro,
    p.form-intro{margin:0 0 20px; line-height:1.4 }
    
    .field, .field, .submit-field,
    p.field, p.field, p.submit-field{margin-bottom:1.5em; vertical-align:middle;}
    
    /* Clear floats [http://www.positioniseverything.net/easyclearing.html] -------------------------------------------------------------- */

    .field { display: inline-block; }   
    .field:after {
      content: "."; 
      display: block; 
      height: 0; 
      clear: both; 
      visibility: hidden;
    }
    /* Holly Hack Targets IE Win only \*/
    * html .field { height: 1%; }
    .field { display: block; }
    /* End Holly Hack */
        
        p.popup-actions,
        p.submit-field { text-align:right;}
        p.submit-field { border-bottom:1px solid #e7e7e7; border-top:1px solid #e7e7e7; padding:1em 0; }
        form p:last-child { border-bottom:none; padding-bottom:0}
 
            .ox-popup-form form p:last-child {
                margin-bottom:0;
                }
        
        p.popup-actions *,
        p.popup-actions strong,
        p.submit-field *,
        p.submit-field strong{vertical-align:middle; font-weight:normal;}
        
        #position-form .field,
        #popup-position-form .field,
        .map-field {background:#ededed; -moz-border-radius:0 0 4px 4px; -webkit-border-radius:0 0 4px 4px;  border-radius:0 0 4px 4px; padding:10px; border-top:1px solid #fff; vertical-align:middle;}
        .sidebox #position-form .field {-moz-border-radius:0; -webkit-border-radius:0;  border-radius:0; margin:0; }
        
        #position-form .text-input,
        #popup-position-form .text-input {float:left; margin-right :4px; vertical-align:middle;}
            
            
            .field:after {
              content: "."; 
              display: block; 
              height: 0; 
              clear: both; 
              visibility: hidden;
              }
            

    
            
/* label ----- */
    .field label{width: 90px; margin-right:20px; display:block; float:left; line-height:1.1; text-align:right;}
    .x-form-check-wrap label{text-align:left; width:auto;}
    
    .compact-field label{display:block; width:auto;}
    .js .labelAsValue label{display:none}
    
    


/* input ----- */    
    .text-input, .text-input-huge, .textarea-input, .select-input, .submit-input, .submit-input, .popup-btn, 
    .date-input,  .x-btn-text, .x-form-file-text {
        padding:5px 4px; border:1px solid #c8c8c8; -moz-border-radius:3px;  -webkit-border-radius:3px;  border-radius:3px; background:#fff url(img/input-bg.png) repeat-x 0 0}
    
    /* input text ----- */
    .text-input, .x-form-file-text {
        height:16px;
        }
    
    /* input huge ----- */
    #register-form .text-input, 
    #login-popup .text-input, 
    .text-input-huge{ font-family:Georgia, "Times New Roman", Times, serif; font-size:1.8em; padding:6px 9px; height:auto;}
    
    /* inactive ----- */
    .input-inactive, .x-form-empty-field{color:#999; font-style:italic;}
    
    /* focus ----- */  
    .x-form-focus, .text-input:focus, .date-input:focus, .text-input-huge:focus,  textarea:focus, .input-textarea:focus, select:focus { border-color:#b0b0b0; }
    

/* checkbox ----- */
    .checkbox-list {  
        position:relative;
        top:-18px;
        }
        .checkbox-list .x-form-check-wrap {  
            clear:left;
            display:block;
            margin:0 0 0 110px;
            padding:5px 0 0;
            }
            .checkbox-list .x-form-check-wrap input.checkbox-input{ margin:0 6px 0 0; position:inherit; }
            
    
    
/* select ----- */
    .select-input { padding:5px 6px 4px }
    
/* textarea ----- */
    textarea { overflow:visible; height:150px}    
    
/* file upload ----- */
    .x-btn-tr i, .x-btn-tl i, .x-btn-mr i, .x-btn-ml i, .x-btn-br i, .x-btn-bl i,
    td.x-btn-tr, td.x-btn-tl, td.x-btn-mr, td.x-btn-ml, td.x-btn-br, td.x-btn-bl{
    	font-size:11px;
        line-height:11px;
        height:11px;
        overflow:hidden;
        }
    .x-form-file-wrap {
        position: relative;
        height: 30px;
        display:block;
        }
    .x-form-file-wrap .x-form-file {
    	position: absolute;
    	right: 0;
    	-moz-opacity: 0;
    	filter:alpha(opacity: 0);
    	opacity: 0;
    	z-index: 2;
        height: 22px;
        }
    .x-form-file-wrap .x-form-file-btn {
    	position: absolute;
    	right: 0;
    	z-index: 1;
        width:90px;
        top:-11px;
        }
    .x-form-file-wrap .x-form-file-text {
        position: absolute;
        left: 110px;
        z-index: 3;
        width:283px;
        color: #777;
        }
		



/* submit ----- */
    .submit-input-huge, .submit-input, .popup-btn, .x-btn-text {border-width:0; font-family:Georgia, "Times New Roman", Times, serif; font-size:1.2em; padding:4px 10px; background:#999; color:#fff;}
        .submit-input-huge{ font-size:1.8em; padding:6px 25px; }
        
        .submit-input,
        .submit-green,
        .popup-btn-ok { background:#9ba903 url(img/submit-green.png)  repeat-x; text-shadow: 0px 0px 2px #acb600}
               
        .submit-blue{ background:#0e79a0 url(img/submit-blue.png) repeat-x; text-shadow:none }
        .submit-red{ background:#8d3201 url(img/submit-red.png) repeat-x; text-shadow:none }
        .submit-orange{ background:#f4a510 url(img/submit-orange.png) repeat-x; text-shadow:none }

        .popup-btn-cancel,
        .submit-cancel{ background:transparent; color:#999; vertical-align:middle; cursor:default; margin-left:4px;  text-shadow:none;  }
        
        .submit-input:hover, .submit-input:focus, .x-btn-text:focus, .x-btn-text:hover{background:#444; color:#fff; cursor:default; text-shadow: 0px 0px 2px #252525 }
        
        /* submit with icon ----- */
		/* DAVID .submit-search position top : 3px */
        .submit-search{ background:#0e79a0 url(img/submit-search.png) no-repeat 50% 50%; text-indent:-999em; width:26px; height:24px; position:relative; top:3px;  line-height:250px; overflow:hidden;}
            .submit-search:focus, .submit-search:hover{ background:#0e79a0 url(img/submit-search-hover.png) no-repeat 50% 50%;}
        .submit-save { background:#a7b603 url(img/submit-save.png) no-repeat 50% 50%; text-indent:-999em; width:26px; height:24px; position:relative; top:1px;  padding:0; line-height:250px; overflow:hidden; }
            .submit-save:focus, .submit-save:hover { background:#4b4a4a url(img/submit-save-hover.png) no-repeat 50% 50%;}
        .submit-add { background:#a7b603 url(img/submit-add.png) no-repeat 50% 50%; text-indent:-999em; width:26px; height:24px; position:relative; top:1px;  padding:0; line-height:250px; overflow:hidden;}
            .submit-add:focus, .submit-add:hover { background:#4b4a4a url(img/submit-add-hover.png) no-repeat 50% 50%;}
        
        /* wait ----- */
        .submit-wait, .submit-wait:hover, .submit-wait:focus {
            background:#444 url(img/submit-wait.gif) no-repeat 5px 50% ; padding-left:25px; color:#ddd; cursor:default; text-shadow: 0px 0px 2px #252525;
            }


/* widths ----- */
    .field .date-input, 
    .field .text-input, .field .textarea-input {width :460px}
        .field input.error, .field input.x-form-invalid,
        .field textarea.error, .field textarea.x-form-invalid  { /* test invalid : width :455px */}
    
    .field .text-input-huge { }
    
    #forgotpassword_popup .text-input-huge,
    #login-popup .text-input { width:366px }
    #register-form .field .text-input, #register-form .field .text-input-huge { width:450px }
    
    .ox-popup-form .text-input, .ox-popup-form .textarea-input, .ox-popup-form .date-input {width:378px; float:left}
    .ext-ie6 .ox-popup-form .text-input,.ext-ie6 .ox-popup-form .textarea-input, .ext-ie6 .ox-popup-form .date-input{width:376px;} 
    
    .ox-popup-form select.select-input{ width:388px; float:left}
    .ox-popup-form select.select-input-with-button{ width:358px; float:left; margin-right:4px;}    
    
    /* toolbox */
    .profile-toolbox .select-input-with-button {width: 	310px;}
    
	/* map position form */
	#position-form .text-input { width:280px }
    #position-form .x-form-invalid  {  /* test invalid :  width:275px */}
    .ext-ie6 #position-form .text-input, #ie6 #position-form .text-input { width:276px; display:inline; }
    
    #popup-position-form .text-input{ width:328px }
    #popup-position-form  .x-form-invalid {  /* test invalid : width:323px */}
	          
    /* comments */         
    #gallery #commentsForm .field .text-input, #gallery #commentsForm .field .textarea-input,
    #video #commentsForm .field .text-input, #video #commentsForm .field .textarea-input {
        width:495px;
    }    
    
    .profile-border .date-input, 
    .profile-border .text-input,.profile-border .textarea-input {width :440px}
        textarea#introduction, textarea#notes{ height:100px;}
        textarea#text { height:200px;}
            
        #ie6 .profile-border .date-input, 
        #ie6 .profile-border .text-input,
        #ie6 .profile-border .textarea-input {width :400px;}
/* errors & hints ----- */

    input.error, #login-popup input.error, #login-popup input.x-form-invalid, .x-form-invalid{ /* test invalid : border-left: 5px solid #c24603; padding-left:5px;*/ background:url(img/input-bg-invalid.png) repeat-y}
    
    .field span.error,
    .field span.hint { margin-left:110px; padding:6px 0; display:block; font-size:11px; text-align:left; clear:both;}
    .submit-field span.error,
    .submit-field span.hint { margin-bottom:1em;}    
    
    .field span.error:empty,
    .field span.hint:empty { display:none;}
    
     .compact-field span.error{display:block; clear:left; border-left-width:0; padding-left:0px; margin-left:0; color:#c24603}

.hint{color:#999;}