/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
+                    CSS BASICS DO NOT UPDATE OR CHANGE THIS                          +
+     IF YOU WANT TO OVER RIDE THESE STYLES PLEASE USE THE OVERRIDE FILE TO MAKE IT   +
+     UPDATES TO THESE STYLES WILL BE COPIED OVER THE ENTIRE SECTION                  +
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/

/*-------------------------------------------------------------
PLEASE NOTE: 

        !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
                    IMPORTANT MESSAGE 
        ALL CLASSES FOR FORMS MUST START WITH .Form AS 
        THE PAGE CREATION PROCESS WILL IDENTIFY IT AS A 
        FORM SECTION AND ENTER FormDefault WHEN NO FORM 
        CLASS IS IDENTIFIED BY THE CONTENT CREATOR        
        !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

---------------------------------------------------------------*/
#divWorkspaceDetails
{
    position:absolute;
    top:10px;
    left:10px;
    height:100px;
    width:200px;
    z-index:50000000000;
    border:solid 2px #f00;
    background-color:#fff;
    color:#222;
    display:none;
    height:0px;
    width:0px;
}

#form_info
{
    height:150px;
    overflow-y:auto;
    display:block;
}

#div_options,
#edt_div_options
{
    float:left;
    clear:both;
    width:96%;
    margin:0px;
    margin-top:8px;
    margin-left:1%;
    padding:1%;
    padding-top:10px;
    padding-bottom:10px;
    color:#222;
    background-color:#fff;
    border-top:solid 2px #0057ab;
    border-bottom:solid 2px #0057ab;
    max-height:200px;
    overflow-y:auto;    
}

#div_options_button,
#edt_div_options_button
{
    text-align:right;
    float:left;
    clear:both;    
}

#div_options div,
#edt_div_options div
{
    float:left;
    clear:both;
    padding:1%;
    border:solid 1px #cdcdcd;
    border-bottom:solid 2px #aaa;
    margin-top:8px;
    background-color:#fafafa;
    width:98%;
    border-radius:10px;
}

#div_options div label,
#edt_div_options div label
{
    font-size:.9em;
    margin:1px;
    padding:1px;
    float:left !important;
    clear:none !important;
    width:15%;
}

#edt_div_options div label span
{    width:200px;
     font-size:.8em;
}

#div_options div:hover,
#edt_div_options div:hover
{
    box-shadow:0px 0px 8px rgba(0,0,0,.2);
}

#div_options div label input[type='button'],
#edt_div_options div label input[type='button']
{ 
    width:16px;
    height:16px;
    background-color:#fafafa;
    color:#222;
    margin:0px;
    padding:0px;
    border:0px;
    box-shadow:none;
}

#div_options div label input[type='button'] img,
#edt_div_options div label input[type='button'] img
{
    cursor:hand;
}

#edt_div_options div label input[type='radio']
{
    height:12px;
    width:12px;
}

#edt_div_options .build_value
{
   width:100px !important;
   float:left;
   margin-right:10px;
}

#edt_div_options .build_text
{
   width:200px;
   float:left;
   margin-left:130px !important;
}

.form_options
{
    float:left;
    padding:0px !important;
    margin:0px !important;
    width:100% !important;
}

.form_options li
{
    float:left;
    width:48% !important;
    padding:1% !important;
    margin:0%;
    text-align:center;
}

.form_options li:first-child
{
    width:98% !important;
    padding:1% !important;
    margin:0px !important;
    font-size:.7em;
    text-align:center;
    border:0px;
    background-color:#505050;
    color:#f1f1f1;
    border-bottom:solid 1px #111
}
    
    
.form_options input[type="button"]
{
    height:25px;
    width:120px;
    padding:5px;
    margin:2px;
    margin-left:10px;
    white-space:normal;
    font-size:.75em;
    box-shadow:2px 2px 4px rgba(0,0,0,.3);   
    background-color:#4c5155;
    color:#f1f1f1; 
    border:solid 1px #2d3236;
}

.MyForm
{
    position:relative;
}

.MyForm p
{
    line-height:1.45em;
}

.FormsEditor_Container_closed
{
    position:fixed;
    z-index:600000;
    width:0px;    
    height:0px;
    padding:0px;
    margin:0px;
    top:-5000px;
    left:-5000px;
    transition: all 1s;
    border:solid 3px #888;
}

.FormsEditor_Container_open
{
    position:fixed;
    z-index:600000;
    width:96%;
    height:92%;
    margin:1%;
    padding:0%;
    margin-left:2% !important;
    margin-right:2% !important;
    top:0px;
    left:0px;
    background-color:#fff;
    border:solid 3px #888;
    transition: all 1s;
}

.FormsEditor_viewbutton
{
    float:left; 
    height:20px !important;
    width:20px !important;
    margin:3px !important;
    padding:2px !important;
    padding-top:0px !important;
    border-radius:0px !important;
}

.FormsEditor_Close
{
    position:absolute;
    right:20px;
    top:0px;
    height:10px;
    width:10px;
    z-index:40000;
}

.FormsEditor_Close input[type='button']
{
    padding:2px !important;
    border-radius:2px !important;
    height:20px !important;
    width:20px !important;
    font-size:.8em !important;
}


.FormsEditor_holder
{
    position:relative;
    max-height:680px;
    min-height:400px;
    width:96%;
    border:solid 1px #ccc;
    margin:1%;
    padding:1%;
    overflow-y:scroll;
}

#form_builder
{ 
  float:left;
  padding:0%;
  border:solid 1px #11496e; 
  background-color:#232323;
  color:#f1f1f1; 
}

#form_preview
{
  float:left; 
  border:solid 1px #ccc;
  overflow-y:auto;  
 }
 
 #form_preview fieldset legend
 {
     border:dashed 2px #aaa;
     padding:5px;
 }
 
 .form_options
 {
     width:100%;
     list-style-type:none;
 }
 
 .form_options li
 {
     width:33%;     
 }
   
 .form_menubar
 {
      border-bottom:solid 1px #ccc;
      margin:0px;
      padding:0px;
      width:100%;
 }
  
 .form_menubar li
 {
      display:block;
      width:100%;
      padding:0;
      margin:0;
      list-style-type:none;
      font-size:.9em;
      background:none;
 }

 .form_menubar li input[type='button']
 {
     width:100%;
     border:0px;
     border-radius:0px;
 }
 
  .form_menubar li input[type='button']:hover
 {
     box-shadow:2px 2px 4px rgba(0,0,0,.5);
 }
  
  .form_menubar li.active
  {
    color:#222 !important;
    border-bottom:0px;
    
  }
  
#form_premadeforms, #form_screens, #form_submitoptions, #form_standardbuild, #form_custombuild
{
    float:left;
}

.ReadyField
{
    width:112px; 
    height:20px;
    float:left;
    padding:5px; 
    padding-top:10px;
    margin:5px;
    z-index:8000;
    border:solid 1px #22517B;
    color:#f5f5f5;
    background-color:#4c5155;
    text-align:center;
    font-size:.9em;
}

.Placeholder
{
   float:left;
   clear:both;
    width:96%;
    margin:1%;
    margin:auto;
    padding:2%;
    background-color:#fff;
    color:#444;
    border:dashed 3px #aaa;
    text-align:center;
}

.Placeholder_active
{
    width:90%;
    margin:1%;
    margin:auto;
    padding:2%;
    background-color:#fff;
    color:#22517B;
    border:dashed 3px #22517B;
    text-align:center;
}

.Placeholder_active_hover
{
    background-color:#000;
    color:#fff;
}

.DropItHere
{
    background-color:#22517B;
    color:#fff;
    border:dashed 3px #1D508A;
    
}

.elementbucket
{
    width:100%;
}

.elementbucket li
{
    width:100%;
    margin:0px;
    padding:0px;
    float:none;
    clear:both;
    list-style-type:none;
}

.preview_element
{
    width:96%;
    position:relative;
    padding:1%;
    margin:1%;
    height:45px;
    border:dashed 2px transparent;    
}

.preview_element:hover
{
    border:dashed 2px #aaa;
    background-color:#C3DCF6;
    
}

.preview_element_highlight_space
{
    border:dotted 1px #ccc;
    border:solid 1px #8f8455 !important;
    background-color:#ff982a !important;
    color:#fff;
    min-height:30px;   
    height:1.5em;
    
}

.portlet-header {
    padding: 0.2em 0.3em;
    margin-bottom: 0.5em;
    position: relative;
  }

.preview_element_choices
{
    position:absolute;
    z-index:100;
    right:2px;
    top:4px;
    padding:5px;
    border:solid 1px #fff;
    background-color:#C3DCF6;
    color:#aaa;
    box-shadow:2px 2px 4px rgba(0,0,0,.3);
}

.preview_element_choices img:hover
{
    cursor:pointer;
}

.edit_element_on_form_hide
{
    display:none;
}

.edit_element_on_form_show
{
    display:block;
}

#FormsEditor_EditElement
{
    width: 450px;
    height:650px;
    padding:10px;
    margin:0px;
    border:solid 1px #ccc;
    border-left:0px;
    background-color:#f7f7f7;
    color:#222;
    box-shadow:2px 2px 6px rgba(0,0,0,.4);
    z-index:50000;
    border-top-right-radius:30px;
    border-bottom-right-radius:30px;    
    transition: all 1s;
}

.FormsEditor_EditElement_closed
{
    opacity:0;
    position:absolute;
    top:0px;
    left:-500px;    
    transition: all 1s;
    background-color:#f00 !important;
}

.FormsEditor_EditElement_open
{
    display:block;
    opacity:1;    
    position:absolute;
    top:0px;
    left:0px;        
    transition: all 1s;
}

#edt_fieldset fieldset
{
    margin:1px;
    padding:2px;
}

#edt_fieldset p
{
    clear:left;
    float:left;
    width:auto;
    height:auto;
    padding:0px;
    margin:0px;
    margin-bottom:5px;
}

#edt_fieldset label
{  
    float:left;
    width:100%;
}

#edt_fieldset fieldset span
{
    float:left;
    clear:none;
    width:160px;
    font-size:.8em;
}

#edt_fieldset select,
#edt_fieldset input
{
    float: left;
    width: 200px;
    padding: 2px;
    font-size: .80em;
	font-family:'Roboto', Verdana, sans-serif;}
    border-radius: 5px;
    display:block;
}

#edt_fieldset select
{
    appearance:none;
    -webkit-appearance:none;
    -moz-appearance:none;
    min-width:120px;
}

#edt_fieldset select:required
{
    background-image: url(../images/icons/arrow_bullet_red.png);
    background-position: right;
    padding-right: 30px;
    background-repeat: no-repeat;
}

#edt_fieldset input:required
{
    background-image: url(../images/icons/bullet_red.png);
    background-position: right;
    padding-right: 30px;
    background-repeat: no-repeat;
}

#edit_sizelen
{
    width:30px !important;
}

#edt_pattern span.notice1
{
    width:280px !important;
    margin-left:1%;
    
}

#divPreviewElementFldSet
{
    margin:1px;
    padding:1px;
    background-color:#fff !important;
    color:#000 !important;
    width:98%;
    border-left:solid 4px  #E17000;
    border-right:solid 4px #E17000;
    margin-top:5px;    
    height:150px;    
    overflow:auto;
}

#divPreviewElementFldSet fieldset legend
{
    font-style:italic;
    font-size:.8em;
}

#divPreviewElementFldSet label
{
    clear:both;
    float:left;
    width:auto;
}

#divPreviewElementFldSet label span
{
    font-size:.85em;
    float:left;
    width:75px;
}

#divPreviewElementFldSet label aside, 
#divPreviewElementFldSet label input,
#divPreviewElementFldSet label select
{
    clear:both;
    float:left;
    font-size:.75em;
}

#divPreviewElementFldSet label aside 
{
    float:right;
    margin-top:4px;
}

/*-------------------------------------------------------------------------------
FORM TOOLKIT
-----------------------------------------------------------------------------*/
#form_toolkit p, #form_toolkit h1, #form_toolkit h2, #form_toolkit h3,
#form_toolkit legend, #form_toolkit span
{
    background-color:#232323;
    color:#f1f1f1;
    text-shadow:none !important;
    box-shadow:none !important;
}

#form_toolkit fieldset
{
    margin:0px;
    padding:1%;
    width:292px;
}

#form_toolkit fieldset legend
{
    font-size:.8em;
	font-family:'Roboto', Verdana, sans-serif;}
}

#form_toolkit fieldset label span
{
    float:left;
    width:80px;
    font-size:.75em;
	font-family:'Roboto', Verdana, sans-serif;}
}

#form_toolkit fieldset input[type='text'],
#form_toolkit fieldset select
{
    float:left;
    width:180px;
    padding:2px;
    font-size:.80em;
	font-family:'Roboto', Verdana, sans-serif;}
}

#form_toolkit fieldset input[type='checkbox']
{
    margin-top:5px;
}

#form_toolkit fieldset .notice1
{
    font-size:.80em;
	font-family:'Roboto', Verdana, sans-serif;}
    background-color:#434343;
    color:#fff;
}

#form_toolkit fieldset .notice1 a
{ background-color:#434343;
    color:#fff;font-size:.80em;
    
}

#form_toolkit .build_value
{
    font-size:.80em;
	font-family:'Roboto', Verdana, sans-serif;}
    width:30px !important;
}

#form_toolkit .build_text
{
    font-size:.80em;
	font-family:'Roboto', Verdana, sans-serif;}
    width:130px !important;
}

.form_tools
{
    float:left; 
    margin:0px !important; 
    padding:0px !important; 
    border:0px;
    width:100%; 
    margin-bottom:10px !important;
}

/*-------------------------------------------------------------------------------
FORM DEFAULT
-----------------------------------------------------------------------------*/

.form_default
{
    margin:0px;
    padding:0px;
    background-color:#f7f7f7;
    color:#222;   
}

.form_default form
{
    margin:0px;
    padding:0px;
}
.form_default fieldset 
{
    position:relative;
    margin:1%;
    padding:1%;
    margin-bottom:1%;
    border:0px;
    border-top:solid 1px #ccc;
    border-bottom:solid 1px #ccc;    
}

.form_default fieldset + fieldset
{
    margin-top:15px;    
}

.form_default fieldset legend
{
    background-color:#f7f7f7;
    color:#555;
    font-weight:bold;
    padding:0 1em;
    margin-left:2em;
}

.form_default fieldset p
{
    clear:left;
    float:left;
    margin:0px;
    padding:0px;
    margin-bottom:5px;
    width:auto;
}

.form_default fieldset label
{
    float:left;
    width:200px;
    font-weight:bold;
    font-family:'Roboto', Verdana, sans-serif;}
    font-size:.9em;
}

.form_default fieldset label span
{
    float:left;
    width:200px;
    font-weight:bold;
	font-family:'Roboto', Verdana, sans-serif;}
    font-size:.9em;
}

.form_default fieldset input,
.form_default fieldset textarea,
.form_default fieldset select
{
    float:left;
    box-shadow:inset 0 1px 2px #DDD, 0 1px 0 #FFF;
	-webkit-box-shadow:inset 0 1px 2px #DDD, 0 1px 0 #FFF;
	-moz-box-shadow:inset 0 1px 2px #DDD, 0 1px 0 #FFF;
	border:1px solid #CCC;
	background-color:#FFF;
	margin:0 0 3px;
	padding:5px;
	border-radius:5px;
   
}

.form_default input:focus,
.form_default select:focus
{
    border:solid 1px #66afe9;
    box-shadow:0px 0px 8px #66afe9;
}

.form_default input:focus.readonly
{
    border:solid 1px #aaa;
    box-shadow:0px 0px 8px #555;
}

.form_default select
{
    min-width:120px;
}

.form_default select:required
{
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
}

.form_default input[type='range']
{
    background:transparent;
	margin:8px 3px;
	padding:5px;
	border:0px;
	border-radius:0px;
	 box-shadow:none;
	-webkit-box-shadow:none;
	-moz-box-shadow:none;
	
	
}

.form_default .readonly
{
   background-color:#f7f7f7 !important;
   border:solid 1px #ccc;
   color:#222;
	font-family:'Roboto', Verdana, sans-serif;}
   font-size:.95em;
   margin-left:8px;
}

.form_default text em
{
    font-size:.75em;
    color:#444;
    letter-spacing:1px;
}

.form_default input[type=range] {
  -webkit-appearance: none;
  margin-top:8px;
  
}
.form_default input[type=range]:focus {
  outline: none;
}
.form_default input[type=range]::-webkit-slider-runnable-track {
  width: 100%;
  height: 1px;
  cursor: pointer;
  box-shadow: 0.3px 0.3px 0.9px #1d508a, 0px 0px 0.3px #215c9f;
  background: #002b54;
  border-radius: 20px;
  border: 0.2px solid #002b54;
}

.form_default input[type=range]::-webkit-slider-thumb {
  box-shadow: 0px 0px 0px #222, 0px 0px 0px #0d0d0d;
  border: 1px solid #222;
  height: 15px;
  width: 15px;
  border-radius: 10px;
  background: #1e5793;
  cursor: pointer;
  -webkit-appearance: none;
  margin-top: -7.2px;
}

.form_default input[type=range]:focus::-webkit-slider-thumb 
{
    background-color:#fff;
    box-shadow:0px 0px 8px #66afe9;
    border: 1px solid #66afe9;
}

.form_default input[type=range]:focus::-webkit-slider-runnable-track {
  background: #002b54;
}

.form_default input[type=range]::-moz-range-track {
  width: 100%;
  height: 1px;
  cursor: pointer;
  box-shadow: 0.3px 0.3px 0.9px #1d508a, 0px 0px 0.3px #215c9f;
  background: #002b54;
  border-radius: 20.5px;
  border: 0.2px solid #002b54;
}

.form_default input[type=range]::-moz-range-thumb {
  box-shadow: 0px 0px 0px #000000, 0px 0px 0px #0d0d0d;
  border: 1px solid #000000;
  height: 15px;
  width: 15px;
  border-radius: 10px;
  background: #1e5793;
  cursor: pointer;
}

.form_default input[type=range]::-ms-track {
  width: 100%;
  height: 1px;
  cursor: pointer;
  background: transparent;
  border-color: transparent;
  color: transparent;
}
.form_default input[type=range]::-ms-fill-lower {
  background: #002b54;
  border: 0.2px solid #002b54;
  border-radius: 41px;
  box-shadow: 0.3px 0.3px 0.9px #1d508a, 0px 0px 0.3px #215c9f;
}
.form_default input[type=range]::-ms-fill-upper {
  background: #002b54;
  border: 0.2px solid #002b54;
  border-radius: 41px;
  box-shadow: 0.3px 0.3px 0.9px #1d508a, 0px 0px 0.3px #215c9f;
}
.form_default input[type=range]::-ms-thumb {
  box-shadow: 0px 0px 0px #000000, 0px 0px 0px #0d0d0d;
  border: 1px solid #000000;
  height: 15px;
  width: 15px;
  border-radius: 10px;
  background: #1e5793;
  cursor: pointer;
  height: 1px;
}

.form_default input[type=range]:focus::-ms-fill-lower {
  background: #002b54;
}

.form_default input[type=range]:focus::-ms-fill-upper {
  background: #002b54;
}


.form_default input[type=radio],
.form_default input[type=checkbox] {
  float:left;
  margin-top:8px;
}

.form_default p label input[type=radio]:first-child
{
    margin-top:70px;
}


.form_default input:required,
.form_default textarea:required
{
    background-image:url(../images/icons/bullet_red.png);
    background-position:right;
    padding-right:20px;
    background-repeat:no-repeat;    
}

.form_default input[type='checkbox']:required::after
{
   position:absolute;
   left:135px;
   content:"\2022";
   font-size:1em;
   padding:0px;
   margin:0px;
   color:#f00;
   margin-right:30px;    
}

.form_default input[type='checkbox']:checked:required::after
{
   position:absolute;
   left:135px;
   content:"*";
   color:#3a3;
   margin-right:30px;    
}

.form_default select
{
    background-image:url(../images/icons/arrow_down.png);
    background-position:right;
    padding-right:30px;
    background-repeat:no-repeat;
}

.form_default select:required
{
    background-image:url(../images/icons/arrow_bullet_red.png);
    background-position:right;
    padding-right:30px;
    background-repeat:no-repeat;
}

.form_default aside
{
    float:left;
    margin:0px;
    padding:0px;
    margin-top:10px;
    margin-left:5px;
    font-size:.85em;
	font-family:'Roboto', Verdana, sans-serif;}
    font-style:italic;
    letter-spacing:1px;   
}

.form_default input.lightBlue,
.form_default textarea.lightBlue,
.form_default select.lightBlue
{
    border:solid 1px #9DBED8;
    background-color:#fff;
    color:#222;
}
.form_default p.medBlue input,
.form_default p.medBlue textarea,
.form_default p.medBlue select
{
    border:solid 1px #0059a2;
    background-color:#fff;
    color:#222;
}
.form_default input.univBlue,
.form_default textarea.univBlue,
.form_default select.univBlue
{
    border:solid 1px #002B54;
    background-color:#fff;
    color:#222;
}
.form_default input.orange,
.form_default textarea.orange,
.form_default select.orange
{
    border:solid 1px #F58220;
    background-color:#fff;
    color:#222;
}
.form_default input.grey,
.form_default textarea.grey,
.form_default select.grey
{
    border:solid 1px #555;
    background-color:#fff;
    color:#222;
}
.form_default input.white,
.form_default textarea.white,
.form_default select.white
{
    border:solid 1px #fff;
    background-color:#fff;
    color:#222;
}
.form_default input.black,
.form_default textarea.black,
.form_default select.black
{
    border:solid 2px #000;
    background-color:#fff;
    color:#222;
}
.form_default input.beige,
.form_default textarea.beige,
.form_default select.beige
{
    border:solid 1px #DAD6CC;
    background-color:#fff;
    color:#222;
}
.form_default input.gradient,
.form_default textarea.gradient,
.form_default select.gradient
{
    border:solid 1px #f4f5f5;
    background-color:#fff;
    color:#222;
}