﻿/* Absolute Center Spinner */
.loading {
  position: fixed;
  z-index: 999;
  height: 2em;
  width: 2em;
  overflow: show;
  margin: auto;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}

/* Transparent Overlay */
.loading:before {
  content: '';
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0,0,0,0.3);
}

/* :not(:required) hides these rules from IE9 and below */
.loading:not(:required) {
  /* hide "loading..." text */
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}

.loading:not(:required):after {
  content: '';
  display: block;
  font-size: 10px;
  width: 1em;
  height: 1em;
  margin-top: -0.5em;
  -webkit-animation: spinner 1500ms infinite linear;
  -moz-animation: spinner 1500ms infinite linear;
  -ms-animation: spinner 1500ms infinite linear;
  -o-animation: spinner 1500ms infinite linear;
  animation: spinner 1500ms infinite linear;
  border-radius: 0.5em;
  -webkit-box-shadow: rgba(0, 0, 0, 0.75) 1.5em 0 0 0, rgba(0, 0, 0, 0.75) 1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) 0 1.5em 0 0, rgba(0, 0, 0, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.5) -1.5em 0 0 0, rgba(0, 0, 0, 0.5) -1.1em -1.1em 0 0, rgba(0, 0, 0, 0.75) 0 -1.5em 0 0, rgba(0, 0, 0, 0.75) 1.1em -1.1em 0 0;
  box-shadow: rgba(0, 0, 0, 0.75) 1.5em 0 0 0, rgba(0, 0, 0, 0.75) 1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) 0 1.5em 0 0, rgba(0, 0, 0, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) -1.5em 0 0 0, rgba(0, 0, 0, 0.75) -1.1em -1.1em 0 0, rgba(0, 0, 0, 0.75) 0 -1.5em 0 0, rgba(0, 0, 0, 0.75) 1.1em -1.1em 0 0;
}

/* Animation */

@-webkit-keyframes spinner {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-moz-keyframes spinner {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@-o-keyframes spinner {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes spinner {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.paddingtop {
            padding-top: 80px;
        }
        #focalform 
        {
            border: solid 2px #e6e6e6;
            padding: 20px;
            padding-top: 10px;
            font-size: 14px;
            background-color: #fff;
            position: relative;
	        
        }
        #focalform .sectionTitle
        {
			line-height: 20px;	
        }
        .disabled
        {
        	display: block;
        }
        .clear
{
    clear: both;
}
        .hidden
        {
        	display: none;
			visibility: hidden;
        }
         
        #focalform #form_header 
        {
            margin-bottom: 20px;
        }
        
        #focalform #heading-right 
        {
			float: right;
			text-align: right;
			width: 194px;
			padding-left: 10px;
			padding-top: 5px;
			border-left: solid 1px #DDD;
			margin-left: 10px;
			padding-right: 5px;
			font-size: 0.8em;
		}
		
		#focalform #formVersion
        {
        	float: right;
			font-size: 12px;			
			padding-bottom: 5px;
        }
        
        #focalform #formVersion .Version
        {        	
			font-weight: bold;		
        }
        
        #focalform #identity_card 
        {
            top: 0px;
            right: 0px;
            background-color: #fff;
        }
        
        #focalform #logo 
        {
            float: left;
            padding-right: 10px;
            border-right: solid 1px #e6e6e6;
            margin-right: 10px;
        }

        #focalform #form_header #heading 
        {
        	
        }
        
        #focalform #form_header .column-left
        {	    
	        float: left;
			padding-right: 20px;
			/*width: 170px;*/
        }
        
        #focalform #form_header .column-center
        {	    
	        float: left;
	        padding-left: 30px;
	        /*width: 470px;	        */
        }

        #focalform #form_header .column-right
        {
	        float: right;
	        text-align: right;
	        /*width: 160px;*/
	        padding-left: 10px;
	        padding-top: 5px;
	        border-left: solid 1px #ddd;
	        margin-left: 10px;
	        padding-right: 5px;
	        font-size: 0.8em;
	        
        }
        
        #focalform #form_title, #focalform #form_description
        {
            margin-bottom: 0px;
            line-height: 21px;
        }
        
        #focalform #form_title h1 {
            font-size: 14px;
        }
        #focalform #form_title h2 {
            font-size: 14px;
        }
        #head h1 {
            font-size: 1.3em;
        } 
        #head h2 {
            font-size: 1.3em;
        }
        /* Represents one section */
        #focalform_contents fieldset 
        {
            margin-top: 0.5em;
            /*padding: 0.5em;*/
            background-color: #fff;
            border: 0px;
        }
        
        /* The title of a section */
        #focalform_contents legend 
        {
        	font-weight: bold;
        	margin-bottom: 0em;
        	padding: 0 1em;
        /*	font-size: 110%;*/
            font-size: 1.1em;
        	background-color: #fff;
        }

        /* The title of a section */
        #focalform_contents H5 
        {
        	font-weight: bold;
        	margin-bottom: 0em;
        	padding: 0 1em;
        /*	font-size: 110%;*/
            font-size: 1.1em;
        	background-color: #fff;
            border-bottom: 1px solid #e5e5e5;
            margin-top: 0px;
        }
        /* Section summary */
        #focalform_contents fieldset > .sectionSummary 
        {
        	padding: 0 1.1em 0.5em 1.1em;
        	margin: 0px;
        	font-size:0.8em;
        }
        
        #focalform_contents fieldset ol 
        {
        	padding: 1em 1em 0 1em;
        	margin: 0px;
        	list-style-type: none;
        }
        .withtopborder  
        {
        	border-top: solid 2px #e6e6e6;        	
        }
        #focalform_contents fieldset li 
        {
        /*	float: left;*/
        	padding: 0.1em 0px;
        	width: auto;
        	/*white-space: nowrap;*/
        	margin-bottom: 0.2em;
        	margin-right: 0.2em;
        	background-color: #fff;
        }
        #focalform_contents fieldset li.block 
        {
            /* Removed for checkboxes
            width: 100%; clear: both;
            */
        }
        #focalform_contents div .inline { padding-left: 5px; }
        #focalform_contents .field { padding-left: 5px; padding-right: 5px;}
        #focalform_contents fieldset li.breakLeft { clear: left; }
        
        #focalform_contents fieldset li.field 
        {
        	position: relative;
        }
        
        /* Form labels */
        label.error
        {
        	display: block;
        	margin: 0.3em 0 0.3em 0.82em;        	
        	position: static;
        	color: Red;
        }
        
        #focalform_contents label 
        {
        	display: block;
        	/*margin: 0.3em 0 0.3em 0.82em;*/
        	font-weight: bold;
        	position: relative;
        }
        
        
        /* Required image */
        #focalform_contents label em img { vertical-align: top; }
        
        /* Label positioning */
        #focalform_contents .labelTop label { margin-bottom: 0px; }
        /*#focalform_contents .labelLeft { float: left; } */
        #focalform_contents .labelLeft label { float: left; }
        #focalform_contents .labelRight label { float: left; text-align: right; }
        
        /* label width styles */
        /* .labelLarge, .labelMedium, .labelSmall, .labelTiny */
        
        #focalform_contents .labelLarge label
        { width: 450px; }
        #focalform_contents .labelMedium label
        { width: 250px; }
        #focalform_contents .labelSmall label
        { width: 125px; }
        #focalform_contents .labelTiny label
        { width: 50px; }
        #focalform_contents .labelTop label
        { width: 830px; }
        
        /* htmllabel width styles */
        /* .labelLarge, .labelMedium, .labelSmall, .labelTiny */
        #focalform_contents .inputLarge .inlinehtml
        { width: 450px; }
        #focalform_contents .inputMedium .inlinehtml
        { width: 250px; }
        #focalform_contents .inputSmall .inlinehtml
        { width: 125px; }
        #focalform_contents .inputTiny .inlinehtml
        { width: 50px; }
        
        /* Label width adjustment for left and right labels */
        /*#focalform_contents .labelLeft.block label, #focalform .labelRight.block label,
        #focalform_contents fieldset li.breakLeft label, #focalform fieldset li:first-child label 
        { width: 8em; }
        #focalform_contents fieldset div.breakLeft label, #focalform fieldset div:first-child label 
        { width: 8em; }*/
        /* Common attributes for input */
        #focalform_contents input[type=text], input[type=file], #focalform textarea, #focalform select 
        { margin: 0.1em 0em; padding: 0.15em; }
       
        
        /* Input width styles */
        /* .inputLarge, .inputMedium, .inputSmall, .inputTiny */
        #focalform_contents .inputLarge input[type=text], #focalform .inputLarge select, #focalform .inputLarge .file-caption 
        { width: 450px; }
        #focalform_contents .inputMedium input[type=text], #focalform .inputMedium select, #focalform .inputMedium .file-caption
        { width: 250px; }
        #focalform_contents .inputSmall input[type=text], #focalform .inputSmall select, #focalform .inputSmall .file-caption
        { width: 125px; }
        #focalform_contents .inputTiny input[type=text], #focalform .inputTiny select, #focalform .inputTiny .file-caption
        { width: 50px; }
        #focalform_contents .inputOther input[type=text], #focalform .inputOther select, #focalform .inputOther .file-caption
        { width: auto; }
        /*focalform_contents .labelTop input[type=text], #focalform .labelTop select
        { width: 830px; }*/
        
           #focalform_contents li div:not(.inputLarge)
        {
        	/*float: left;*/
        	position: relative;
        }
        
        #focalform .inputLarge textarea { height: 250px; }
        #focalform .inputMedium textarea { height: 175px; }
        #focalform .inputSmall textarea { height: 100px; }
        #focalform .inputTiny textarea { height: 50px; }
            
        #focalform_contents .labelLarge label
        { width: 40%; }
        #focalform_contents .labelMedium label
        { width: 25%; }
        #focalform_contents .labelSmall label
        { width: 12%; }
        #focalform_contents .labelTiny label
        { width: 5%; }
        #focalform_contents .labelTop label
        { width: 100%; }
		
		 #focalform_contents .inputLarge.labelTiny input[type=text], 
         #focalform .inputLarge.labelTiny select, 
         #focalform .inputLarge.labelTiny .file-caption, 
         #focalform .inputLarge.labelTiny textarea, 
         #focalform .inputLarge.labelTiny span 
        { width: 93%;
		 }
        #focalform_contents .inputLarge.labelSmall input[type=text], 
        #focalform .inputLarge.labelSmall select, 
        #focalform .inputLarge.labelSmall .file-caption, 
        #focalform .inputLarge.labelSmall textarea, 
        #focalform .inputLarge.labelSmall span:not(.glyphicon)
        { width: 86%;
        }
        #focalform_contents .inputLarge.labelMedium input[type=text], 
        #focalform .inputLarge.labelMedium select, 
        #focalform .inputLarge.labelMedium .file-caption, 
        #focalform .inputLarge.labelMedium textarea, 
        #focalform .inputLarge.labelMedium span:not(.glyphicon)
        { width: 73%;
        }
        #focalform_contents .inputLarge.labelLarge input[type=text], 
        #focalform .inputLarge.labelLarge select, 
        #focalform .inputLarge.labelLarge .file-caption, 
        #focalform .inputLarge.labelLarge textarea,
        #focalform .inputLarge.labelLarge span:not(.glyphicon)
        { width: 58%;
        }
        #focalform_contents .inputLarge.labelTop input[type=text], 
        #focalform .inputLarge.labelTop select, 
        #focalform .inputLarge.labelTop .file-caption, 
        #focalform .inputLarge.labelTop textarea,
        #focalform .inputLarge.labelTop span:not(.glyphicon) 
        { width: 100%;
        }
        
        #focalform span 
        { 
            overflow-wrap:  break-word;
        }
        
     
        /*
        #focalform_contents li .file-input,
        #focalform_contents li .file-input div
        {
            float: none;
            max-width: 80vw;
        }
        */
        #focalform_contents .sectionPlaceholder 
        {
        	background-color: #e3f1ff;
        	border: dotted 1px #09f !important;
        	padding: 20px;
        }
        
        #focalform_contents .fieldPlaceholder 
        {
        	background-color: #e3f1ff;
        	border: dotted 1px #09f !important;
        }
        
        #focalform_contents li .errorSummary
        {
        	color: #c00;
        	font-size: 80%;
        	font-weight: normal;
        	text-transform: uppercase;
        	margin: 0 0 0 1em;
        	display: block;
        	clear: both;
        }
        
        #focalform_contents li.hasError
        {
        	color: #c00;
        }
        
        #focalform_contents
        {        	
        	margin-bottom: 4px;
        }
        
        #focalform_contents select,textarea,input[type="text"],input[type="password"],input[type="datetime"],input[type="datetime-local"],input[type="date"],input[type="month"],input[type="time"],input[type="week"],input[type="number"],input[type="email"],input[type="url"],input[type="search"],input[type="tel"],input[type="color"],.uneditable-input {
	        margin-bottom:4px;
        }

        #focalform_contents .checkboxes ol
        {
        	float: left;
        	padding: 0;
        /*	margin: 0.10em 0 0 0.65em; */
        	border-style: none;
        }
        #focalform_contents .checkboxes li
        {
        	float: left;
        	clear: both;
        	background-color: Transparent;
        }
        #focalform_contents .checkboxes label 
        {
        	float: none;
        	display: inline;
        	margin: 0;
        	padding: 3px;
        	font-weight: normal;
        }
        
        #focalform_contents .checkboxes.inline li 
        {
        	clear: none;
        }
        
        #focalform_contents.builder fieldset { border: dotted 1px #e6e6e6; }
        #focalform_contents.builder fieldset.current { border-color: #999; background-color: #ffc; }
        #focalform_contents.builder fieldset.current legend { /*border: dotted 1px #999;*/ background-color: #ffc; }
        
        #focalform_contents.builder fieldset li.field { border: dotted 1px #e6e6e6; }
        
        #focalform_contents.builder fieldset.current li.field, #focalform.builder fieldset li.field.current
        { border-color: #999/*#09f*/; background-color: #ffc/*#e3f1ff*/; }
        
        #focalform_contents div span.value 
        {
        	padding-top: 3px;
        	padding-left: 14px;
        	display: block;
        	float: left;
        }
        
        #focalform_form 
        {
        	padding: 5px 10px;
        }
        #focalform_form.current 
        {
        	border: dotted 1px #999;
        	background-color: #ffc;
        	padding: 4px 9px;
        }
        
        #focalform_contents .fieldSummary 
        {
        	float: left;
        	clear: both;
        	margin-left: 1em;
        	font-style: italic;
        	color: #666;
        }
        
        
        #focalform_contents .error 
        {
            border: solid 1px #900;
            background-color: #ffc;
            border-radius: 4px;
        }
        
        #focalform_contents .field span.error 
        {
            position: absolute;
            top: -15px;
            right: 13px;
            padding: 0px 5px;
            background-color: #900;
            color: #fff;
            font-weight: bold;
            font-size: 12px;
        }
        
        #form_submit .submitbutton 
        {
            font-size: 1.3em;
            /*font-weight: bold;*/
            padding: 0.3em 1em;
        }
        
        #form_submit .cancellink
        {
            font-size: 1.2em;
            padding: 0 2em;
        } 
        
        #form_submit 
        {
            text-align: center;
            margin-top: 1em;
            padding-top: 1em;
            border-top: solid 2px #e6e6e6;
        }
        
        #form_submit ul 
        {
            list-style-type: none;
            width: 100%;
        }
        #form_submit li 
        {
            display: inline;
            margin: 0px;
            padding: 0px;
        }
        #form_submit a 
        {
            margin: 0px 5px;
            padding: 6px;
            border: solid 1px #ccc;
            background-color: #f5f5f5;
            border-radius: 6px;
            -moz-border-radius: 6px;
            -webkit-border-radius: 6px;
        }
        
        #form_submit a#doSubmit
        {
            background-color: Green;
            border-color: DarkGreen;
            color: #fff;
            font-weight: bold;
        }
        
        #form_submit a#doCancel 
        {
            color: #666;
            border: none;
            background-color: Transparent;
        }
        
.inlinehtml  {
 /* margin-left:13px;*/
	padding-top: 4px;
}
      
.inlinehtml ol {
  list-style: decimal; 
  margin-left:10px; 
  
}

.inlinehtml ul {
  list-style: circle;  
  margin-left:20px;
}
.inlinehtml ol li {
  list-style: decimal;  
  float:none;
}

.WhosLoggedIn {
	    padding-top: 15px;
	    padding-right: 15px;
	}
	
	.input-group-btn {
            float: none;
        }
	
	
	@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 990px) 
  and (-webkit-min-device-pixel-ratio: 2) { 

        .WhosLoggedIn {
            max-width: 400px;
	}
	
	
        #focalform_contents .labelLarge label
        { width: 100%; }
        #focalform_contents .labelLarge .labelTop label
        { width: 100%; }
        
        /* htmllabel width styles */
        #focalform_contents .inputLarge .inlinehtml
        { width: 100%; }
        
        #focalform_contents input[type=text], input[type=file], #focalform textarea, #focalform select 
        { margin: 0.1em 0em; padding: 0.15em; }
       
        
        /* Input width styles */
        #focalform_contents .inputLarge input[type=text], #focalform .inputLarge select
        { width: 100%; }
        
        /*#focalform_contents .labelTop input[type=text], #focalform .labelTop select
        { width: 100%; }*/
        
        
        #focalform textarea { width: 100%; }
       
       #focalform_form 
        {
        	padding: 0px 0px; 
        }
        
        
        
}        