@charset "UTF-8";

html 					{   -ms-overflow-style: scrollbar; } /* forces scrollbar to stay on-screen */
						
#wrap 					{ 	width: 1000px; margin: 0px auto 20px; position: relative; }
#wrap.authenticated	 	{ 	margin-top: 90px; }

#container 				{  	background: #fff; 
							padding: 0px 0 30px 0;
						}

#wrap > header			{ 	height: 240px; }

#wrap > header .phone-number 	{ font-style: italic; font-size: 18px; margin-top: 5px; margin-right: 15px; }

#stripe-1				{
							background: #0079C2; 
							height: 10px;
						}

#stripe-2				{
							background: #231F20;
							height: 20px;
						}

#logo-container			{ 	
							float 		: left; 
							width 		: 290px; 
						}

#right-header			{ 
							background 	: #fff;
							width		: 690px; 
							height 		: 196px;
							float 		: left; 
							margin 		: 0 0 20px 20px;
							position 	: relative;
						}

#right-header h1 		{
							position: absolute;
						    bottom 	: 0;
						    left 	: 0;
						    margin-bottom: 0;
						}

#request-a-quote-link	{	
							float 		: right;
							//margin-bottom: 100px;
						}

#nav 					{ 	
							background 	: #DFE7EC;
							float 		: left; 
							width 		: 290px; 
							min-height 	: 470px; 
							padding 	: 30px 30px 20px 0;
						}

#menu					{ 	list-style-type	: none; 
							padding 		: 0; 
							margin 			: 0; 
						}

#menu li				{ margin-bottom: 8px; }


#menu li a 				{
						 	display 			: block; 
							margin 				: 0;
							font-size 			: 16px; 
							color 				: #000;
							text-decoration 	: none; 
							padding 			: 5px 5px 4px 0;
							text-align 			: right;
							font-family 		: 'Nunito', sans-serif;
							position: relative;
						}

#menu li.active a,
#menu li a:hover		{
							background 			: #0079C2;
						 	color 				: #DFE7EC; 
						 	text-decoration 	: none; 
  						}

#menu li.active a:after,
#menu li a:hover:after	{
							content 			: '';
							position 			: absolute;
							height 				: 32px;
							width 				: 32px;
							top 				: 0px;
							right 				: -27px;
							z-index 			: 100;

							background-color 	: #0078C2; 
 							height 				: 31px;
    						width 				: 32px;
    						-moz-border-radius 	: 0 0 32px 0;
    						border-radius 		: 0 0 32px 0;		
}

#menu li.submenu 		{	margin 				: 0 0 8px 8px; }
							
#menu li.submenu a 		{
							background 			: none;
							color 				: #0079c2;
							font-size 			: 12px; 
							padding 			: 5px 20px 0 0;
							text-transform 		: none;
						}

#menu li.submenu.active a,
#menu li.submenu a:hover
						{ 	
							color 				: #0079c2; 
							text-decoration 	: none; 
							font-weight 		: bolder; 
						}

#menu li.submenu.active a:after,
#menu li.submenu a:hover:after	
						{
							background-color 	: none;
							right 				: 0;
							width 				: 0;
							height				: 0;
							z-index 			: 0;
    						-moz-border-radius 	: 0;
    						border-radius 		: 0;
						}

#content 				{ 
							background: #fff;
							width	: 710px; 
							float 	: left; 
							padding : 0px 0px 0px 20px;
							min-height: 500px;
						}

#content a 				{ color: #087082; }

#content img 			{ max-width: 100%; }

#content li 			{ margin-bottom: 10px; }

#photos 				{ margin-left: 15px; float: right; }
#photos	img 			{ margin-bottom: 15px; }

.top-photo 				{ margin-bottom: 20px; }

#wrap > footer 			{ 
							background 		: #231F21;
							color 			: #fff; 
							font-family 	: 'Nunito', sans-serif;
							padding-bottom 	: 10px;
							text-align 		: center; 
						}

#wrap > footer div		{ 
							padding 		: 10px 10px 1px 10px; 
							background: #0079C2;
						}

#wrap > footer a 		{ color: #fff; text-decoration: underline; }
#wrap > footer a:hover 	{ color: #fff; }

h1, h2					{ 
							font-size 				: 12pt; 
							color 					: #0079C2; 
							-webkit-margin-before 	: 0;
							-webkit-margin-after 	: 0;
							line-height 			: inherit;
							margin-bottom 			: 10px; 
							font-family 			: 'Nunito', sans-serif;
							text-transform 			: uppercase;
							font-weight				: bold;
						}

h1 span					{ 
							display 		: block;
							color 			: #33627D;
							text-transform 	: none;
						}

h2						{ font-size: 12pt; }

h3						{ font-size: 12pt; color: #0079C2; }

h5 						{ font-weight: bold; }

div.clear 				{ clear: both; margin: 0; padding: 0; }
br.clear 				{ clear: both; }

.no-bold 				{ font-weight: normal; }

.datepicker				{ z-index:1151; }

.dynamic-width			{ width: auto; }
.inline-block			{ display: inline-block; }

#menu-button 			{ display: none; text-align: right; }

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

	header .phone-number { font-size: 12px; margin: 5px 15px 5px; }

	#wrap 				{ width: 100%; }

	#wrap > header		{ height: auto; padding-bottom: 20px; }

	#logo-container		{ width: 100%; }

	#right-header		{ width: 100%; height: auto; }

	#right-header h1 		{
								position: relative;
							    bottom 	: auto;
							    left 	: auto;
							}

	#logo 				{ width: 95% }

	#request-a-quote-link 	{ width: 100%; padding-bottom: 20px; }
	#request-a-quote-link img { width: 100%; }

	#menu-button 		{ display: block; }

	#nav 				{ width: 100%; margin: 0 0 20px 0; padding: 0; padding-bottom: 10px; background-image: none; min-height: auto !important; height: auto; }

	#menu ul 			{ margin: 0; }

	#menu ul li 		{ float: none; }

	#menu li			{ margin-bottom: 2px; }

	#menu li a 			{ padding: 10px; }

	#menu li.submenu	{ margin-left: 30px; }

	#content 			{ width: auto !important; padding: 10px !important; float: none; min-height: auto; }

	#content img 		{ width: 100%; float: none; }

	#menu li.active a:after,
	#menu li a:hover:after	{
								content 			: '';
								position 			: absolute;
								height 				: 0;
								width 				: 0;
								top 				: 0;
								right 				: 0;
								z-index 			: 100;

								background-color 	: none; 
	 							height 				: 0;
	    						width 				: 0;
	    						-moz-border-radius 	: 0;
	    						border-radius 		: 0;
	}
}


