@charset "UTF-8";
/* NOW INCLUDES BOTH LAYOUT AND FORMS */

/*CONTENTS:

Layout framework for responsive columns, site wrappers, 
and dealing with all layout elements at defined breakpoints.

Written by Jason Powell

This is a variable width column framework based on responsive percentages. 
Columns can be created by applying the following rules:
 1. make a div and set a class for the width (onewhole, onehalf, onethird, twothirds, oneforuth, threefourths, onefifth, twofifths, threefifths, fourfifths, onesixth, fivesixths, oneseventh, two sevenths, threesevenths, foursevenths, fivesevenths, sixsevenths, oneeighth, twoeighths, threeeighths, foureighths, fiveeighths, sixeighths, seveneighths, oneninth, twoninths, threeninths, fourninths, fiveninths, sixninths, sevenninths, eightninths, onetenth, twotenths, threetenths, fourtenths, fivetenths, sixtenths, seventenths, eighttenths, ninetenths, oneeleventh, twoelevenths, threeelevenths, fourelevenths, fiveelevenths, sixelevenths, sevenelevenths, eightelevenths, nineelevenths, tenelevenths, onetwelth, twotwelths, threetwelths, fourtwelths, fivetwelths, sixtwelths, seventwelths, eighttwelths, ninetwelths, tentwelths, eleventwelths. -- Some of these classes apply the same column width as others, but are included in the framework to allow use of either. For example... fivetenths = onehalf, twoeights = onefourth, etc.)
 2. set the column to float left or right by adding a class of "left" or "right - 95% of columns should be set to float left so they fall in one after the other. 
 3. column divs should contain an inner container with a class of "inner". This sets some default padding on the columns and can be overriden to adjust padding. 
 4. by default, columns will become 100% wide when they reach a certain breakpoint. For wide columns like "threefourths" and "threefifths", the breakpoint is 769. For narrower columns like "onefourth", "onethird", "onehalf", and "twothirds" the breakpoint is 600, and for the narrowest columns like "onefifth" and "onesixth" and so on, the breakpoint is 480. This allows the different columns to stay true to their original width on as small of a display as possible. 
 5. If the default behavior is not desired and the true width of the columns should be retained at all screen sizes no matter what, a class of "fixed" can be added to the column container div. 
 6. If it is desired to have a clear break between rows of columns, a <div class="clear"></div> can be added after the last column of the first row, and before the first column of the second row. 
 
 Some examples
 
 *full width column with default padding:
 
 <div class="onewhole"><div class="inner">...</div></div>
 
 *two rows with two columns in each row:
 
 <div class="onehalf left"><div class="inner">...</div></div>
 <div class="onehalf left"><div class="inner">...</div></div>
 <div class="clear"></div>
 <div class="onehalf left"><div class="inner">...</div></div>
 <div class="onehalf left"><div class="inner">...</div></div>
 
 *four columns that will remain as four columns on all screens
 
 <div class="onefourth left fixed"><div class="inner">...</div></div>
 <div class="onefourth left fixed"><div class="inner">...</div></div>
 <div class="onefourth left fixed"><div class="inner">...</div></div>
 <div class="onefourth left fixed"><div class="inner">...</div></div>
_____________________________________________________________



1. Column Layouts
	1.1 Percentage based columns
	1.2 Header and Page Body Columns
	1.3 Inner padding for responsive columns
2. Responsive Column Layouts
3. Header and Page Body Columns
4. Site Layout Containers
5. Clearfix and Clearing
6. Floating
7. Show or hide for varying screen sizes
8. General Responsive Elements
	8.1 
	8.2 Smaller than 1280 wide but larger than 768 wide
	8.3 Smaller than 1024 wide
	8.4 At least 768 wide
	8.5 Between 640 wide and 768 wide
	8.6 Smaller than 768 wide
	8.7 Smaller than 640 wide
	8.8 Smaller than 480 wide
	8.9 Smaller than 400 wide
9. div.form-field structures
10. Template Based Contact Form
*/

/* ================ 1. Column Layouts ================ */

/*1.1 Percentage based columns*/

.onewhole { width: 100%; }

.onehalf { width: 50%; }

.onethird { width: 33.333333%; }

.twothirds { width: 66.666666%; }

.onefourth { width: 25%; }

.threefourths { width: 75%; }

.onefifth { width: 20%; }

.twofifths { width: 40%; }

.threefifths { width: 60%; }

.fourfifths { width: 80%; }

.onesixth { width: 16.666666666666667%; }

.fivesixths { width: 83.33333333333334%; }

.oneseventh { width: 14.28571428571429%; }

.twosevenths { width: 28.57142857142858%; }

.threesevenths { width: 42.85714285714287%; }

.foursevenths { width: 57.14285714285716%; }

.fivesevenths { width: 71.42857142857145%; }

.sixsevenths { width: 85.71428571428574%; }

.oneeighth { width: 12.5%; }

.twoeights { width: 25%; } /*same as .onefourth*/

.threeeighths { width: 37.5%; }

.foureighths { width: 50%; } /*same as .onehalf*/

.fiveeighths { width: 62.5%; }

.sixeighths { width: 75%; } /*same as .threefourths*/

.seveneighths { width: 87.5%; }

.oneninth { width: 11.11111111111111%; }

.twoninths { width: 22.22222222222222%; }

.threeninths { width: 33.33333333333333%; } /*same as .onethird*/

.fourninths { width: 44.44444444444444%; }

.fiveninths { width: 55.55555555555555%; }

.sixninths { width: 66.66666666666666%; } /*same as .twothirds*/

.sevenninths { width: 77.77777777777777%; }

.eightninths { width: 88.88888888888888%; }

.onetenth { width: 10%; }

.twotenths { width: 20%; } /*same as .onefifth*/

.threetenths { width: 30%; }

.fourtenths { width: 40%; } /*same as .twofifths*/

.fivetenths { width: 50%; } /*same as .onehalf*/

.sixtenths { width: 60%; } /*same as .threefifths*/

.seventenths { width: 70%; }

.eighttenths { width: 80%; } /*same as .fourfifths*/

.ninetenths { width: 90%; }

.oneeleventh { width: 9.09090909090909%; }

.twoelevenths { width: 18.18181818181818%; }

.threeelevenths { width: 27.27272727272727%; }

.fourelevenths { width: 36.36363636363636%; }

.fiveelevenths { width: 45.45454545454545%; }

.sixelevenths { width: 54.54545454545454%; }

.sevenelevenths { width: 63.63636363636363%; }

.eightelevenths { width: 72.72727272727272%; }

.nineelevenths { width: 81.81818181818181%; }

.tenelevenths { width: 90.9090909090909%; }

.onetwelfth { width: 8.33333333333333%; }

.twotwelfths { width: 16.66666666666666%; } /*same as .onesixth*/

.threetwelfths { width: 24.99999999999999%; } /*same as .onefourth*/

.fourtwelfths { width: 33.33333333333332%; } /*same as .onethird*/

.fivetwelfths { width: 41.66666666666665%; }

.sixtwelfths { width: 49.99999999999998%; } /*same as .onehalf*/

.seventwelfths { width: 58.33333333333331%; }

.eighttwelfths { width: 66.66666666666664%; } /*same as .twothirds*/

.ninetwelfths { width: 74.99999999999997%; }

.tentwelfths { width: 83.3333333333333%; } /*same as .fivesixths*/

.eleventtwelfths { width: 91.66666666666663%; }

.onewhole, .onehalf, .onethird, .twothirds, .oneforuth, .twofourths, .threefourths, .onefifth, .twofifths, .threefifths, .fourfifths, .onesixth, .twosixths, .threesixths, .foursixths, .fivesixths, .oneseventh, .twosevenths, .threesevenths, .foursevenths, .fivesevenths, .sixsevenths, .oneeighth, .twoeighths, .threeeighths, .foureighths, .fiveeighths, .sixeighths, .seveneighths, .oneninth, .twoninths, .threeninths, .fourninths, .fiveninths, .sixninths, .sevenninths, .eightninths, .onetenth, .twotenths, .threetenths, .fourtenths, .fivetenths, .sixtenths, .seventenths, .eighttenths, .ninetenths, .oneeleventh, .twoelevenths, .threeelevenths, .fourelevenths, .fiveelevenths, .sixelevenths, .sevenelevenths, .eightelevenths, .nineelevenths, .tenelevenths, .onetwelth, .twotwelths, .threetwelths, .fourtwelths, .fivetwelths, .sixtwelths, .seventwelths, .eighttwelths, .ninetwelths, .tentwelths, .eleventwelths { margin: auto; }

.inner { padding: 0 20px; }

.page-inner { padding: 1% 0; }

div.inner:empty { display: none; }

/*================= 2. Responsive Column Layouts =================*/

@media screen and (max-width: 767px) {

/*make all the columns full width and clear them*/
.onesixth, .oneseventh, .oneeighth, .oneninth, .onetenth, .oneeleventh, .onetwelfth, .twothirds, .threefourths, .fourfourths, .threefifths, .fourfifths, .fivefifths, .foursixths, .fivesixths, .sixsixths, .foursevenths, .fivesevenths, .sixsevenths, .sevensevenths, .fiveeighths, .sixeighths, .seveneighths, .eighteighths, .fiveninths, .sixninths, .sevenninths, .eightninths, .nineninths, .sixtenths, .seventenths, .eighttenths, .ninetenths, .tentenths, .sixelevenths, .sevenelevenths, .eightelevenths, .nineelevenths, .tenelevenths, .elevenelevenths, .seventwelfths, .eighttwelfths, .ninetwelfths, .tentwelfths, .eleventwelfths, .twelvetwelfths, .onehalf, .onethird, .onefourth, .twofourths, .onefifth, .twofifths, .twosixths, .threesixths, .twosevenths, .threesevenths, .twoeighths, .threeeighths, .foureighths, .twoninths, .threeninths, .fourninths, .twotenths, .threetenths, .fourtenths, .fivetenths, .twoelevenths, .threeelevenths, .fourelevenths, .fiveelevenths, .onetwelfth, .twotwelfths, .threetwelfths, .fourtwelfths, .fivetwelfths, .sixtwelfths {
	width: 100%;
	clear: both;
}
}

/*but don't do it if a column has a class of "colfixed" ...*/

.colfixed { clear: none !important; }

.onewhole.colfixed, .twohalves.colfixed, .threethirds.colfixed, .fourfourths.colfixed, .fivefifths.colfixed, .sixsixths.colfixed, .sevensevenths.colfixed, .eighteighths.colfixed, .nineninths.colfixed, .tentenths.colfixed, .elevenelevenths.colfixed, .twelvetwelfths.colfixed { width: 100% !important; }

.onehalf.colfixed, .twofourths.colfixed, .threesixths.colfixed, .foureighths.colfixed, .fivetenths.colfixed, .sixtwelfths.colfixed { width: 50% !important; }

.onethird.colfixed, .twosixths.colfixed, .threeninths.colfixed, .fourtwelfths.colfixed { width: 33.333333% !important; }

.twothirds.colfixed, .foursixths.colfixed, .sixninths.colfixed, .eighttwelfths.colfixed { width: 66.666666% !important; }

.onefourth.colfixed, .twoeighths.colfixed, .threetwelfths.colfixed { width: 25% !important; }

.threefourths.colfixed, .sixeighths.colfixed { width: 75% !important; }

.onefifth.colfixed, .twotenths.colfixed { width: 20% !important; }

.twofifths.colfixed, .fourtenths.colfixed { width: 40% !important; }

.threefifths.colfixed, .sixtenths.colfixed { width: 60% !important; }

.fourfifths.colfixed, .eighttenths.colfixed { width: 80% !important; }

.onesixth.colfixed, .twotwelfths.colfixed { width: 16.666666666666667% !important; }

.fivesixths.colfixed, .tentwelfths.colfixed { width: 83.33333333333334% !important; }

.oneseventh.colfixed { width: 14.28571428571429% !important; }

.twosevenths.colfixed { width: 28.57142857142858% !important; }

.threesevenths.colfixed { width: 42.85714285714287% !important; }

.foursevenths.colfixed { width: 57.14285714285716% !important; }

.fivesevenths.colfixed { width: 71.42857142857145% !important; }

.sixsevenths.colfixed { width: 85.71428571428574% !important; }

.oneeighth.colfixed { width: 12.5% !important; }

.threeeighths.colfixed { width: 37.5% !important; }

.fiveeighths.colfixed { width: 62.5% !important; }

.seveneighths.colfixed { width: 87.5% !important; }

.oneninth.colfixed { width: 11.11111111111111% !important; }

.twoninths.colfixed { width: 22.22222222222222% !important; }

.fourninths.colfixed { width: 44.44444444444444% !important; }

.fiveninths.colfixed { width: 55.55555555555555% !important; }

.sevenninths.colfixed { width: 77.77777777777777% !important; }

.eightninths.colfixed { width: 88.88888888888888% !important; }

.onetenth.colfixed { width: 10% !important; }

.threetenths.colfixed { width: 30% !important; }

.seventenths.colfixed { width: 70% !important; }

.ninetenths.colfixed { width: 90% !important; }

.oneeleventh.colfixed { width: 9.09090909090909% !important; }

.twoelevenths.colfixed { width: 18.18181818181818% !important; }

.threeelevenths.colfixed { width: 27.27272727272727% !important; }

.fourelevenths.colfixed { width: 36.36363636363636% !important; }

.fiveelevenths.colfixed { width: 45.45454545454545% !important; }

.sixelevenths.colfixed { width: 54.54545454545454% !important; }

.sevenelevenths.colfixed { width: 63.63636363636363% !important; }

.eightelevenths.colfixed { width: 72.72727272727272% !important; }

.nineelevenths.colfixed { width: 81.81818181818181% !important; }

.tenelevenths.colfixed { width: 90.9090909090909% !important; }

.onetwelfth.colfixed { width: 8.33333333333333% !important; }

.fivetwelfths.colfixed { width: 41.66666666666665% !important; }

.seventwelfths.colfixed { width: 58.33333333333331% !important; }

.ninetwelfths.colfixed { width: 74.99999999999997% !important; }

.eleventwelfths.colfixed { width: 91.66666666666663% !important; }

/*================= 3. Header and Page Body Columns =================*/
div.header { height: auto;  z-index: 998; position: relative;}
div.header-desktop { height: auto;  z-index: 3; position: relative;}
div.header-mobile { height: auto;  z-index: 998; position: relative;}

/* div.header .upper { height: 65px; }

div.header .lower { height: 30px; }*/

div.head-logo {
	position: absolute;
	z-index: 1;
}

div.head-nav {
	position: relative;
	z-index: 9999;
}

.page-body {
	max-width: 1280px;
	margin: auto;
	position:relative;
	clear: both;
	overflow: hidden;
}


.colleft-int {
	min-width: 75%;
	overflow: hidden;
	
	}

.colright-int {
	margin: 0;
	max-width: 25%;
	overflow: hidden;
	float: right;
	}

	@media screen and (max-width: 767px) {


	.colleft-int, .colright-int {
		min-width: 100% !important;
		max-width: 100% !important;
		clear:both !important;
		float:left !important;
		
		}






	.col1-wide {
		max-width: 100%;
		clear: both;
		border-right: none;
	}

	.col2 { display: none; }
	}



.header-inner, .header .inner, .page_body, .foot.inner {
	max-width: 1280px;
	margin: auto;
	padding: 0 0 0 40px;
}
.page_body, header .inner, footer .inner { padding: 0; }
div.footer .inner {padding: 20px 10px 20px 10px;}

.promotion {
	max-width: 1280px;
	margin: auto;
}

/*customize header column widths*/

.col1-head {
	width: 170px;
	float: left;
}

.col2-head {
	width: calc(100% - 170px); 
	float: right;
}

.col1-head .logo { z-index: 100; }

.col2-head .tag {
	float: left;
	margin: 30px 0 0 30px;
	
}

.col2-inner { padding: 0 20px 0 0 }


@media screen and (max-width: 1000px) {

	.col1-head {
	/*width: 250px;*/
	
}

.col2-head {
	/*width: calc(100% - 250px);*/
	
}

	
	
}

.header-inner {padding: 0 0 0 20px;}

/* ================ 4. Site Layout Containers ================ */

.wrapper {/*global container to set width and center*/
	max-width: 100%;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0;
	margin-bottom: 0;
	float: none !important;
}

.wrapper_inner { margin: auto; overflow: hidden; min-height: 400px;}

.page_body {
	padding: 0;
	margin: auto;
	clear: both;
}
	div.header .page_body {padding: 0;}
@media screen and (max-width: 1279px) {
	div.header .page_body {padding: 0;}
}
.header, .footer {
	width: auto;
	margin: auto;
}

.header .inner {
	margin: auto;
	padding: 0;
}

.footer .inner { margin: auto; }



/* ================ 5. Clearfix and Clearing ================ */

.clearfix:before, .clearfix:after, .fix:before, .fix:after {
	font-family: 'Font Awesome 5 Pro';
	font-weight: 900;
	content: "\0020";
	display: block;
	height: 0;
	visibility: hidden;
}

.clearfix:after, .fix:after { clear: both; }

.clearfix, .fix { zoom: 1; }

.clear { clear: both; }

.clearleft { clear: left; }

.clearright { clear: right; }

/* ================ 6. Floating ================ */

.left, .colleft { float: left; }

.right, .colright { float: right; }

/*================= 7. Show or hide for varying screen sizes =================*/



.col2 .sidebar, .tabbedca-title { display: none !important; }

/* don't display promotions in the main content column (yet)*/

.col1-wide .sidebar, .col2 .sidebar, .col2-wide .sidebar { display: none; }

.subnav-mobile,  .sidebar-mobile { display: none; }






/* ================ 8. General Responsive Elements ================ */

img, iframe { max-width: 100%; }

/* 8.2 Smaller than 1280 wide but larger than 768 wide */
@media screen and (max-width: 1280px) {
/* 	.page_body, div.header .inner {padding: 0 10px;} */
}

/* 8.3 Smaller than 1024 wide */
@media screen and (max-width: 1024px) {
}

/* 8.4 At least 768 wide */
@media screen and (min-width: 769px) {
}

/* 8.5 Between 640 wide and 768 wide */
@media screen and (min-width: 641px) and (max-width: 768px) {
}

/* 8.6 Smaller than 768 wide */
@media screen and (max-width: 768px) {

/*	Interior page layout responsive...*/
div.nav-main ul { display: block; }

/*homepage primary content areas change to decked layout*/
.home_content_area {
	float: none;
	width: 100%;
	margin: 0;
	padding: 0;
	border-right: none;
	clear: both;
}

/*tabbed content areas converted to non-tabbed areas*/
div.ca_tabs { display: none; }

div.ca_panel {
	display: block;
	visibility: visible;
}

/*re-layout regular content areas*/

.footer .inner .footer-left, .footer .inner .footer-right {
	width: 100%;
	clear: both;
}

.footer-left, .footer-right {
	float: right;
	padding: 0 0 10px 0;
}

div.footer_quicklinks {
	width: 100%;
	margin: 10px 0;
}

.tabbedca-title { display: block !important; }

.mainnav-col #subnav_div { display: block; }


.mainnav-col #subnav_div .nav-sub h3 { display: none; }

.mainnav-col #subnav_div.nav-sub ul li.nav-item {
	display: inline-block;
	width: auto;
	vertical-align: middle;
	margin: 0 10px;
}

div.nav-sub ul li.nav-item a { width: auto !important; }

div.nav-sub ul li.nav-item a:hover { }

div#calloutlink a { font-size: 95% !important; }
}

/* 8.7 Smaller than 640 wide */
@media screen and (max-width: 767px) {

/*=========== hide col3 and widen col2 ===========*/
.col1 { display: none; }

.col1-wide, .col2, .col2-wide, .col3 {
	width: 100%;
	clear: both;
	border-right: none;
}

/*=========== display sidebar in col2, not col1 or col3 ===========*/

.col1-wide .sidebar, .col2 .sidebar, .col2-wide .sidebar {
	display: block !important;
	margin: 3em 0 0 0;
}

.col1 .sidebar, .col3 .sidebar { display: none !important; }
div.sidebar {  /*  padding: 0 10px;*/}

.header .inner {
	border-bottom: none;
	padding: 10px 1em;
}

.header-info-main { display: none; }

.header-info-mobile { display: block; }

nav.menu-main { }

nav.menu-mobile { }

input.search_field, input.search_active {
	float: none;
	width: 100%;
}

div.search_form input.submit, a.search_button { }

header {
	width: 100% !important;
	max-width: 100%;
}

div.nav-top {
	margin: 4px 0;
	text-align: center !important;
	clear: both;
	width: auto !important;
}

div.header-info-mobile { text-align: center; }

div.header-info-mobile .head-phone {
	display: inline-block;
	text-align: left;
	padding: 0;
	margin: 0 6px;
}

div.search_form { }

.header .logo {
	background-position: left;
	margin: 25px 0 0 !important;
	width: 100% !important;
	clear: both;
	position: relative;

}

.header .logo a {
	margin: auto;
	width: 100% !important;
	margin: 0 !important;
}

.header .logo {
	margin: 10px auto 20px auto !important;
	background-position: center;
}

.header .inner .col1-head, .header .inner .col2-head {
	width: 100%;
	clear: both;
	text-align: center;
	min-height: 0;
}

.header .inner .col2-head .upper {
	display: block;
	float: none;
}

.header .inner .col2-head .upper a {
	max-width: 100%;
	width: 39%;
	text-align: center;
}
}

/* 8.8 Smaller than 680 wide */
@media screen and (max-width: 767px) {



.header .inner .col2-head { display: table }

.header .inner .col2-head .upper {
	display: table-cell;
	float: none;
	height: auto;
	vertical-align: middle;
}

.header .inner .col2-head .lower { display: none; }


}

/* 8.8 Smaller than 480 wide */
@media screen and (max-width: 480px) {
}

/* 8.9 Smaller than 400 wide */
@media screen and (max-width: 400px) {

div.nav-main ul { width: 100% !important; }

input.search_button { left: 2px; }
}



/* form elements */

/*custom form and anchor buttons are styled in content.css*/

/*
File: forms.css
Purpose: base stylesheet for any form elements or form layouts implemented on the Voice CMS platform licensed by L9.com
Usage: Core areas of the sheet (Sections prior to "Custom Overrides" should not be modified unless absolutely necessary. Customizations to this css should be applied after the "Custom Overrides" section marker.

Contents:




*/
/* 9. div.form-field structures */

fieldset {border: none;}

div.form-field {
	width: 100%;
	margin: .5em 0;
	float:left;
}
div.form-field .label {
	float: left;
	width: 34%;
}
form.refer-a-friend-form div.form-field .label {
	width: 33%;
	padding-right: 1%;
}
div.form-field .input {
	float: left !important;
	width: 60%;
}
div.form-field div.input.submit {
	border-top: solid 1px #ddd;
	padding: 0.7em 0;
	margin: 1em 0 0 0;
	float: right;/* width: 60%; cuts off contact submit button at mobile size */
	width: 100%;
}

div.form-field .button.submit {
	width: auto;

}
div.form-field.rule {/*login form div.form-field exception for horizontal line*/
	border-bottom: solid 1px #BAC7C6 !important;
	padding: 0;
	margin: 0 0 4px 0;
}
input[type=text], input[type=tel], input[type=password], input[type=email], textarea {
	width: 100%;
}

@media screen and (max-width:640px) {
	form {
		margin: auto;
	}
	div.form-field {
		width: 96%;
		margin: 1em 0;
		border: none;
	}
	div.form-field .label, div.form-field .input, form.refer-a-friend-form div.form-field .label, form.refer-a-friend-form input.short, form.refer-a-friend-form textarea.short {
		float: none;
		width: 100%;
		clear: both;
	}
}



form {
	margin: 0;
	padding: 0;
}
label {
	display: block;
}
/*labels within radio or checkbox groups*/
div.input label {
	display: inline-block;
	margin: 0 10px;
}
input {
	font-weight: normal;
	padding: 3px;
	margin: 0;
}
textarea {
	height: 120px;
	width: 100%;
}
input[type=text], input[type=tel], input[type=password], input[type=email], textarea, select {
	padding: 0.5em 3%;
	max-width: 94%;
		border: solid 2px #c1c4c8;
	font-family: inherit;
	font-size: 20px;	font-size: 1.25rem;
	color: #011020;
	border: solid 2px #c1c4c8;

}
input[type=button] {
	float: right;
	margin: 10px;
}
input[type=text]:focus, input[type=tel]:focus, input[type=password]:focus, input[type=email]:focus, textarea:focus, select:focus {
	box-shadow: inset 1px 1px 5px #ccc;
	-moz-box-shadow: inset 1px 1px 5px #ccc;
	-webkit-box-shadow: inset 1px 1px 5px #ccc;
}
select {
	font-weight: normal;
}
input.formkey {
	width: inherit;
}
input.error, textarea.error, select.error, input.errormsg, textarea.errormsg, select.errormsg {
	border: solid 1px #d13836 !important;
}
.errormsg {
	color: #d13836;
	padding: 1px 0 10px 0;
	font-size: 0.8em;
	text-align: left;
}
.form_label_req {
	color: #006990; font-weight: bold;
}
input.field, textarea {
	font-size: 16px;
	font-size: 1rem;
}
input.upload {
	font-size: 11px;
	font-size: 0.6875rem;
	width: 99%;
}
input.short, textarea.short {
	width: 33%;
}
input.initials {
	width: 3%;
}
input.wide, textarea.wide {
	width: 90%;
}
input.small, textarea.small {
	font-size: .9em;
}
input.large, textarea.large {
	font-size: 16px;
	font-size: 1rem;
}
input.tiny {
	height: 12px;
	font-size: .8em;
	font-weight: bold;
}
select.select {
}
select.wide {
	width: 99%;
}
select.short {
	width: 33%;
}
select.small {
	font-size: .9em;
}
select.large {
	font-size: 1.3em;
}
select.multiple {
	width: 96.5%;
/*	height: 130px; */
	overflow: auto;
	font-size: 1rem;
}
select.multiple_wide {
	width: 99%;
	height: 100px;
	overflow: auto;
}
.aid {
	color: #333;
	font-size: 12px; font-size: .75rem;
	line-height: 1;
	display: inline-block;
	padding: 0 10px 0 0;
}

@media screen and (max-width: 640px) {
div#L9Form_div div.form-field .aid {display: block;} /* fixing large gap at mobile size */
}

.aid ul {
	margin: 0 0 0 20px;
	padding: 0px;
}

div.form-field .label label { color: #333 }

.confirm {
	padding: .5em 3%;
	font-size: 20px; font-size: 1.25rem;
	color: #2ecc40
}

label.agree { font-size: 11px; font-size: 0.6875rem;}

div.fields ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
div.fields ul li {
	height: 80px;
}
div.form-field div.error_message, div.error {
	color: #e80000 !important;
	font-size: 1rem;
	margin: 0 0 3px 0;
	clear: both;
}
.status label {
	font-weight: normal;
	text-transform: none;
	color: #3a3a3a;
	display: inline;
	font-size: 14px; font-size: 0.875rem;
}


/* ================= FORMS TOOL OUTPUT =================*/
.formerrors {
	color: #B22222;
	padding: 0px 0px 0px 10px;
	text-align: left;
}
.form_err_msg_area {
	color: #B22222;
	padding: 0.5em 0;
	font-size: 1em;
}
/* Generated Form styles */

ul#form_elements, ul#form_elements li {
	list-style: none;
	margin: 0 !important;
	padding: 0 !important;
	
	/*	override drag and drop positioning from form workboard...*/
	position: inherit !important;
	width: inherit !important;
	top: inherit !important;
	left: inherit !important;
}

div.section_title { font-size: 1.2em; }

input[type=radio], input[type=checkbox] {
	display: inline-block;
	vertical-align: middle;
}
select {
	min-width: 50%;
	max-width: 100%;
}
div.form-field.consent label {
	display: inline-block;
	font-size: 0.7em;
	line-height: normal;
}
div.form-field.consent input[type=checkbox] {
	display: inline-block;
	float: right;
	margin: 0 10px 0 0;
}

.ui-sortable-placeholder { display: none !important; }

div.form-field div.label label {
	word-wrap: break-word;
	width: auto;
}

#form_div { width: 100%; }

#form_div h2, wrapper-survey h2 { border-bottom: solid 1px #DDDFE0; }

ul.radio-list, ul.check-list {
	margin: 0;
	padding: 4px 0;
	list-style: none;
}
ul.radio-list li, ul.check-list li {
	display: block;
	float: left;
	padding: 2px 8px;
}

input.med { width: 60%; }

/*disabled poll button*/
input[disabled="disabled"] {
	background-color: #DDDFE0 !important;
	background-image: none !important;
	border: none !important;
	box-shadow: none !important;
}
input[disabled="disabled"]:hover {
	color: #fff;
	background-color: #58595b !important;
	background-image: none !important;
	border: none !important;
	box-shadow: none !important;
	cursor: default;
}

#form_elements_panel #form_elements, .form-panel .div.form-fields { }

#form_elements_panel ul#form_elements, #form_elements_panel ul#form_elements li {
	list-style: none;
	margin: 0;
	padding: 0;
}

/*
#form_elements_panel ul#form_elements { }
*/

.JQcaptcha {
	width: 30% !important;
	margin: 0 1em 0 0;
	float: left;
}

ul.l9-list-style-none {
	margin: 0;
	padding: 0;
}

ul.l9-list-style-none li div.input ol, ul.l9-list-style-none li div.input ul {
	margin: 0;
	padding: 0;
}

ul.l9-list-style-none li, ul.l9-list-style-none li div.input ol li, ul.l9-list-style-none li div.input ul li { list-style-type: none; }

ul.l9-list-style-none li ol li, ul.l9-list-style-none li ul li { list-style-type: inherit; }

L9Form_message_area {
	padding: 1em;
	border: solid 1px #77942b;
	color: #c4122f;
}

/* ================ 10. Template Based Contact Form ================ */
/* contact form */
#contact_form { margin: auto; }

.hidediv { display: none; }

div.contact_outer { }

.contact_content_area_1 { padding: 10px; }

.contact_content_area_2 {
	width: 90%;
	border: solid 1px #E2E2E2;
	background-color: #FAFAFA;
	padding: 5%;
	margin: 0 0 5% 0;
	float: right;
	border-radius: 3px 3px 3px 3px;
	-moz-border-radius: 3px 3px 3px 3px;
	-webkit-border-radius: 3px 3px 3px 3px;
	-o-border-radius: 3px 3px 3px 3px;
}

.contact_form_area {
	width: 96%;
	padding: 1% 2% 4% 2%;
	margin: 4% 0 0 0;
}

div.contact_form_area .form1_fixed { }

div.contact_label {
	display: inline;
	float: left;
	width: 140px;
}

#contactmsg {
	margin: 0 0 30px 0;
	font-size: 19px; font-size: 1.1875rem;
	color: #3a5b4d;
	border: none;
	text-align: center;
	min-height: 0px;
}

#contact_message_area, .seminar_message_area, .seminar_form_message_area, #ra_message_area, .ra_message_area {
	border: solid 1px #ddd;
	background: #f2f3f4;
	padding: 20px 10px 0 10px;
	margin: 0.75em 0;
	font-weight: bold;
	text-align: center;
}

div[id$="_message_area"] {
	border: solid 1px #ddd;
	background: #fffcdb;
	padding: 10px;
	border-radius: 3px 3px 3px 3px;
	-moz-border-radius: 3px 3px 3px 3px;
	-webkit-border-radius: 3px 3px 3px 3px;
	-o-border-radius: 3px 3px 3px 3px;
	color: #a41c30;
	margin: 0.75em 0;

}

@media screen and (max-width: 480px) {

	#contact_form div.form-field .left {
		clear: right;
		width: 100%
	}

	#contact_form div.form-field .right {
		float: left;
		width: 100%
	}

	#contact_form div.form-field .right input[type=text], #contact_form div.form-field .right input[type=tel], #contact_form div.form-field .right input[type=password], #contact_form div.form-field .right input[type=email], #contact_form div.form-field .right textarea, #contact_form div.form-field .right select { width: 100% }

	#contact_form div.form-field .right input.formkey {
		width: 20%;
		float: left;
	}

	input.button, input[type=submit], a.button, a.button:link {
		display: block;
		width: auto;
	}
}







/* fixing post-insert dialog-box radio button layout */
div#posts_panel pre {font-family: Verdana,Arial,Helvetica,sans-serif;}
div#posts_panel label, div#posts_panel input  {display: inline-block; margin-left: 10px; margin-bottom: 5px;}





/*============================== 99. Custom Overrides ==============================*/

/* ------ apply customizations to the base CSS using overrides whenever possible and practical ------ */











/* showing subnav at bottom of page at mobile size */
@media screen and (max-width: 768px) {
	div.subnav {margin: 0 0 0 0; padding: 5px 0 0 0;
	border-top:  1px dashed #dedede;
	border-bottom: 1px dashed #dedede;}
	div.nav-sub { display: block; text-align: left; 	margin: 0 0 0 0 !important;	padding: 5px 0 2px 0;}

	/* spreading out sub-nav at mobile size */
		div.nav-sub ul.nav-menu {margin-top: 0; margin-left: 15px; margin-bottom: 10px;}
		div.subnav ul.nav-menu li.nav-item {display: inline-block; margin-right: 10px;}
		div.nav-sub ul li a.on:before {display: none;}

	
/* adding a button-like background
	div.nav-sub ul li.nav-item a {	border: solid 1px #000000;
	background-color: #ffffff;
	font-size: inherit;
	font-weight: normal;
	padding: 13px 25px;
	cursor: pointer;

	margin: 5px 0;
	text-decoration: none;
	-webkit-transition: opacity .3s ease;
	-moz-transition: opacity .3s ease;
	max-width: 100%;
	display: inline-block;
	font-family: inherit;
	line-height: normal;}

	div.nav-sub ul li.nav-item a:hover {text-decoration: underline;	border: solid 1px #37373d;	background-color: #fff;
	-moz-box-shadow: 1px 1px 5px #d1d1d1;	-webkit-box-shadow: 1px 1px 5px #d1d1d1;	box-shadow: 1px 1px 5px #d1d1d1;	cursor: pointer;	opacity: 1;}

	div.nav-sub ul li.nav-item a:active {	-moz-box-shadow: inset 1px 1px 5px #5c5c65;	-webkit-box-shadow: inset 1px 1px 5px #5c5c65;	box-shadow: inset 1px 1px 5px #5c5c65;} */	
}


span.JQradioClick {margin-right: 15px;}

/* flexible iframe style */
.flexiframe {position: relative; padding-bottom: 65.25%; padding-top: 30px; height: 0; overflow: auto; -webkit-overflow-scrolling:touch; border: none;} 
.flexiframe iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%;    max-width: 100% !important; border: none !important; padding: 0; margin: 0;}