/* CLASSES */

.ui-effects-transfer {
    opacity: 0.7;
    background-color: #E6EAF2;
    border: dotted 1px Blue;
}

.ui-helper-clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;

}

.ui-helper-clearfix {
    display: inline-block;
}

* html .ui-helper-clearfix {
    height: 1%;
}

.ui-helper-clearfix {
    display: block;
}

.panel {
    margin: 0px 0px 0px 0px;
    padding: 15px 15px 15px 15px; 
}

.blue {
    background-color: #E6EAF2;
}

.panel-wrap h2 {
    margin-bottom: 0px;
}

.template {
    display: none;
}

.x-disabled {
    color: #bbb;
}

.x-disabled input {
    opacity: 0.6;
    filter: alpha(opacity = 60);
}

.hidden {
    display: none;
}

.shadowed {
    -moz-box-shadow: 0px 0px 15px 0px #333;
    -webkit-box-shadow: 0px 0px 15px #333;      
}

.rounded {
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px
}

.highlight {
    background-color: yellow;
}
            
.margin {
    margin-bottom: 20px
}

.dialog {
    font-size: 12px;
    border: solid 2px #fff;	            
    z-index: 5000;
    background-color: #fff; 
}

.dialog-header {
    color: #333;
    padding: 12px 10px 0px 10px;
    font-weight: bold;
    line-height: 1.5em;
    background-color: #fff;
}

.dialog-body {
    color: #000;
    padding: 0px 10px 0px 10px;
}

.dialog-body form {
    background-color: #E6EAF2;
    padding: 10px;
    border-bottom: dotted 1px #bbb;
}

.dialog-footer {
    background-color: #fff;
    padding: 7px 10px 12px 10px;
}

.dialog-footer span {
    font-size: 11px;
}

div.blockMsg {
    text-align: left;
    background-color: transparent;
    padding: 5px;
}

div.blockOverlay {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; 
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50); 
    -moz-opacity:.70;
    opacity:.70;
    background-color: #333;
    cursor: wait;
}

.ui-draggable-dragging {
    cursor: move;
}

.outil {
    margin-right: 8px;
    text-indent: -1000px;
}

.pieLabel {
    font-weight: bold;
    font-size: 1em;
}

.legendLabel {
    font-weight: bold;
    padding-left: 5px;
}

.tooltip {
    background :#4B628C url(/img/icons/coquette/info.png) no-repeat 8px 50%;
    border: 1px solid #fff;
    padding: 7px 7px 9px 40px;
    line-height: 1.2em;
    width: 160px;
    display: none;
    color: #fff;
    text-align:left;
    font-size: 0.9em;
    /* outline radius for mozilla/firefox only */
    -moz-box-shadow: 0 0 10px #000;
    -webkit-box-shadow: 0 0 10px #000;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    position: absolute;
}

/* FORMS */

form {
    margin-bottom: 0px;
}

fieldset {
    padding: 10px 15px 10px 15px;
    margin-bottom: 10px;
    border: solid 1px #B5B8C8;
}

legend {
    font-weight: bold;
    font-size: 0.9em;
    color: #15428B;
}
        
:active, :focus { outline-style: none; -moz-outline-style:none; }

input {
    font-family: Tahoma,Arial, Helvetica, sans-serif;
}
  
input[type="text"], input[type="password"] {
    font-size: 12px;
}

input[type="radio"], input[type="checkbox"] {
    cursor: pointer;
    margin-left: 3px;
}

input[type="text"], input[type="password"] {
    padding: 3px 4px 4px 4px;
    background-color: #fff;
    background-image: url(/img/text-bg.gif);
    background-repeat: repeat-x;
    border: solid 1px #ccc;
}

input[type="text"].validation-error, input[type="password"].validation-error {
    border: solid 1px red;
}

select {
    font-family: Tahoma,Arial,Helvetica,sans-serif;
    font-size: 11px;
    line-height: 1.5em;
}

form.cmxform fieldset {
    padding: 10px 10px 10px 10px;
}

form.cmxform legend {
    padding: 0 2px;
    font-weight: bold;
    _margin: 0 -7px; /* IE Win */
}

form.cmxform fieldset ol {
    margin: 0;
    padding: 0px 5px 5px 5px;
}

form.cmxform fieldset li {
    list-style: none;
    padding: 5px;
    margin: 0;
    background-image: none;
}

form.cmxform fieldset li.focus {
    background-color: #fff;
}

form.cmxform fieldset li span {
    vertical-align: middle;
    padding-top: 5px;
}

form.cmxform input[type="text"], input[type="password"] {
    clear: none;
    float: right;
    width: 240px;
}

form.cmxform fieldset fieldset {
    border: none;
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 0px 0px;
}

form.cmxform fieldset fieldset legend {
    padding: 0 0 5px;
    font-weight: normal;
    color: #888;
}

form.cmxform em {
    font-weight: bold;
    font-style: normal;
    color: #000;
}

form.cmxform label {
    display: inline-block;
    vertical-align: middle;
    width: 100px; /* Width of labels */
    margin-right: 5px;
    clear: none;
    color: #444;
}

form.cmxform fieldset fieldset input {
    margin-right: 5px;
}

form.cmxform fieldset fieldset label {
    margin: 0px 0px 0px 120px;
    padding: 0px;
    display: block;
    width: auto;
    color: #000;
}

form.cmxform label.validation-error {
    display: block;
    margin-top: 10px;
    margin-left: 120px;
    width: auto;
    color: Red;
    font-weight: bold;
    font-size: 0.8em;
    line-height: 1.2em;
}

/* WIDGETS */

#loading_window {
    position: absolute;
    left: 350px;
    top: 350px;
    padding: 12px 10px 10px 10px;
    width: 300px;
    z-index: 20001;
    background-color: white; 
    text-align: center; 
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    -moz-box-shadow: 0 0 15px #333;
    -webkit-box-shadow: 0 0 15px #333;
}

#viewport {
    width: 830px;
    top: 20px;
}

#outils {
    background-color: transparent;
    border: none;
    padding: 4px 20px 0px 20px;
}

#outils li {
    float: left;
    background: transparent none no-repeat scroll 0 0;
    padding: 0px;
}

#sessionTools li.hidden {
    display: none;
}

#indicator_description {
    width: 440px;
}

#loginWizard { 
    overflow: hidden; 
    position: relative; 
    height: 100%;
    width: 100%;
} 

#loginWizard .items { 
    width: 20000em; 
    clear: both; 
    position: absolute; 
} 

#loginWizard .page { 
    width: 410px; 
    float: left; 
}

#chart_legend  {
    padding: 10px 15px 10px 15px;
    margin-bottom: 10px;
    border: solid 1px #B5B8C8;
}

a.thumb_up {
    padding-left: 20px;
    background: transparent url(/img/icons/icone_accord.gif) no-repeat;
}

a.thumb_down {
    padding-left: 20px;
    background: transparent url(/img/icons/icone_desaccord.gif) no-repeat;
}

/* Tabs et panes */

        /* root element for tabs  */
        ul.css-tabs {  
	        margin: 0 !important; 
	        padding: 0;
	        height: 30px;
	        border-bottom: 1px solid #90A8C8;	
        }

        /* single tab */
        ul.css-tabs li {  
	        float: left;	 
	        padding: 0; 
	        margin: 0;  
	        list-style-type: none;	
	        background-image: none;
        }

        /* link inside the tab. uses a background image */
        ul.css-tabs a { 
            outline: none;
	        float: left;
	        font-size: 13px;
	        display: block;
	        padding: 5px 15px;	
	        text-decoration: none;
	        border: 1px solid #7193BF;	
	        border-bottom: 0px;
	        height: 18px;
            background-color: white;
	        color: #9EB1C8;        
	        margin-right: 2px;
	        -moz-border-radius-topleft: 4px;
	        -moz-border-radius-topright: 4px;
	        -webkit-border-top-left-radius: 4px;
	        -webkit-border-top-right-radius: 4px;
	        position:relative;
	        top: 1px;	
		    font-weight: bold;
		    font-size: 0.9em;
        }

        ul.css-tabs a:hover {
	        background-color: #9EB1C8;
	        color: white;
        }
        
        ul.css-tabs a.disabled {
	        background-color: white;
	        color: #C2D1E2;
	        cursor: default;
	        opacity: 0.5;
        }
        	
        /* selected tab */
        ul.css-tabs a.current {
	        background-color: #9EB1C8;
	        border-bottom:1px solid #90A8C8;	
	        color: white;
        	
        }

        	
        /* tab pane */
        div.css-panes {
	        display: none;
	        border: 1px solid #7193BF;
	        border-width: 0 1px 1px 1px;
	        padding: 10px;
	        background-color: white;	
        }

/* Carte et Openlayers */

.maptip {
    width: 100px; 
    color: Black;
    background-color: Yellow; 
    background-image: url(/img/exclamation.png);
}

.maptool {
    outline: none;
    display: block;
    float: left;
    width: 15px;
    height: 15px;
    padding: 3px;
    margin-left: 3px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border: solid 1px transparent; 
}

.maptool:hover {
    border: solid 1px #B5B8C8; 
}

#toolZoomIn {
    background: transparent url(/img/icons/zoom_in.png) no-repeat 50% 50%;
}

#toolZoomOut {
    background: transparent url(/img/icons/zoom_out.png) no-repeat 50% 50%;
}

#toolZoomAll {
    background: transparent url(/img/icons/zoom_full.png) no-repeat 50% 50%;
}

.olDragDown {
    cursor: move;
}

.olDrawBox {
     cursor: crosshair;
}

.olLayerGooglePoweredBy {
    visibility: hidden;
}

.olLayerGoogleCopyright {
    visibility: hidden;
}

/* SimpleModal */

            .simplemodal-overlay {
                background-color: #333;
                opacity: 0.5;
                cursor: wait;
            }
            
            .simplemodal-container {
                border: solid 2px white;
                background-color: #fff;
	            -moz-border-radius: 4px;
	            -webkit-border-radius: 4px;
	            -moz-box-shadow: 0 0 15px #333;
	            -webkit-box-shadow: 0 0 15px #333;
	            padding: 10px;
            }
            
            .simplemodal-container a.modalCloseImg {
	            background: url(/img/icons/xx.png) no-repeat; /* adjust url as required */
	            width: 0px;
	            height: 0px;
	            display: inline;
	            z-index: 3200;
	            position: absolute;
	            top: -15px;
	            right: -12px;
	            cursor: pointer;
            }

            /*
            .simplemodal-data h4 {
                padding: 7px 10px 7px 10px;
                margin-bottom: 12px;
                color: White;
                background-color: #679E00;
                border-bottom: solid 1px #fff;
            }
            */
            
            .simplemodal-data {

            }
            
            .simplemodal-data ul {
                background-color: White;
                border-top: double 4px #8DB2E3;
                padding: 10px 10px 10px 0px;
            }
            
            .simplemodal-data li {
                line-height: 1.2em;
                margin-bottom: 3px;
            }
            
            .simplemodal-data a {
            }
            
            #warning-modal {
                border: solid 3px #F09E00;
                padding: 0px;
            }
            
            #warning-modal h3 {
                background: #F7BF11 url(/img/icons/coquette/warning.png) no-repeat scroll 10px 45%;
                color: black;
                font-weight: bold;
                padding: 7px 7px 9px 40px;
                border-bottom: none;
            }
            
            #warning-modal p {
                padding: 10px 10px 10px 10px;
                color: black;
            }