﻿/* HamCo Mobile styles for various sized devices *****************/
/***********************************/
/* Items to help with small screens, until we implement Foundation rows & columns**/

/*Is rptTitle depreciated????*/
.rptTitle, .rptTitle a
{
    font-weight: 700;
    color: Black;
    }
	
	
/*******THINGS THAT HAVE TO DO WITH ROWS AND COLUMNS******/
/*hides content on smaller screens. not sure if it's needed here????*/    
#toggleButton
{
 
}
/*start stacking flow*/
/*pushes the div to the right*/
.HC_RightBox 
{
    float:right;
    padding:5px;
}
.HC_Box, .HC_LastBox
{ 
float:left;
padding:5px;
 
}
.HC_Box
{
margin-right:5px;
}

.HC_Box ul, .HC_RightBox ul, .HC_LastBox ul
{
margin-left:15px;
}
/*tells how many columns we are stacking*/
.autoAdjust2column
{
    width:48%;
    min-width:240px;
    }
    
    .autoAdjust1column
{
    width:100%;
    min-width:240px;
    }
/*adds visual definition of stacking areas*/    
   .BorderGreen 
   {
      border:thin solid #C7D7A6;
      background-color:#F1F1E2;
      /*width:100%;*/
       }
           
   .bottomBorderGreen 
   {
      border-bottom:thin solid #C7D7A6;
       }
 /*end stacking flow*/
 /*not sure where this is used - might need to go in a different css file????*/      
       .textSmall
       {
           font-size:85%;
           }
		   
		   .leftgutter, .contentgutter 
{
  padding-left:10px;
  padding-right:10px;
    }	
	
.titlegutter, 
{
  padding-left:0px;
  padding-right:10px;
    }	

/****DISABLE ITEMS USED FOR SMALLER QUERIES*****/		   
#topNavContainer-mobile {
    display:none;
}	
#mobile-header {
    display: none;
}
#navigationSlide {
	display: none;
	}
#siteTitle-mobile{
    display:none;
}

#topNavContainer-medium {
    display:none;
}	
#footContainer-mobile {
    display:none;
}


	



/* medium */
@media only screen and (min-device-width: 645px) and (max-device-width: 1000px),(min-width: 645px) and (max-width: 1000px)
{
	
	#topNavContainer {
		//padding-right:20px;
		padding-left: 0px;
		}
	
	#topNav {
		background: top left repeat-x;
		height: 33px;
		list-style-type: none;
		margin: 0 auto;
		//margin-left: 10px;
		//margin-right: 5px;
	   padding-right: 0px;
	   
		width: 100%;
		float:right;
	}

	#topNav li {
		list-style-type: none;
		padding-left: 0px;
		padding-right: 0px;
		//padding: 0px 35px 0px 35px;
		width: 19%;
		text-align:center;
		overflow: hidden;
		height: 33px;
		//border: medium solid red;
	}

	#topNav li a {
			display: block;
			width:100%;
			text-decoration: none;
			background: transparent right 0 no-repeat;
			color: #ffffff;
			font-family: Arial;
			font-size: 18px;
			font-weight:700;
			//text-align:center;
			line-height: 25px;
			//padding: 8px 15px 8 15px;
	}
		
	#topNav li a:hover {
			color: rgb(188,220,123);
	}

  	/* Header
	****************************************************/
	#headerContainer {
		//background: transparent url('../../images/header/header-bg.gif') left top repeat-x;
		//height: 45px;
	}
	
	#header {
		width: 960px;
		margin: 0 auto;
	}
	
	//#siteTitle {
		//display: none;
	//}
	
	#siteTitle-mobile {
		background: #0CC url('../../images/header/header-bg.gif') left top repeat-x;
		border-bottom: 3px solid #d5dec3;
		margin-bottom: 0px;
		display: block;
	}
	
	#siteTitle-mobile h1 {
		background: transparent url('../../images/header/site-title-sm.gif') left top no-repeat;
		width: 160px;
		margin: 0 auto;
		height: 45px;
	}

	#siteTitle-mobile a {
		display: block;
		height: 45px;
		overflow: hidden;
		text-indent: 1000px;
		white-space: nowrap;
		width: 160px;
		text-decoration: none;
		
	}
	/*end header*/
	
	
	/*breadcrumb medium*/
	#breadcrumbs {
		text-align: left;
		color: #333333;
		font-size: 80%;
		width: 100%;
		margin: 0 auto;
		position: relative;
	}
	
	#breadcrumbLeaf {
		display: none;
	}
	/*end breadcrumb medium*/
	
	#foot{
		max-width:100%;
	}
}

/*small */
@media only screen and (min-device-width: 250px) and (max-device-width: 644px),(min-width: 250px) and (max-width: 644px)
{
	#siteTitle {
		padding-bottom: 40px;
		}
	
	#preNav {
		position:absolute;
		margin-top:45px;
	}
	
	#preNavLinks a  {
		//position:absolute;
		//margin-top:70px;	
	}
	
	#topNavContainer {
		display:none;
	}
	
	@-ms-viewport{
	  width: device-width;
	}
	.defaultGridTable { 
	width: device-width; 
	} 

	#mobile-header {
    display: block;
	background-color: #43443C;
	border-bottom:medium #272523 solid;
	height:30px;  
	padding: 0px;
	margin: 0 px;
    }
	
	.offsmall {
		display:none;
		}
	
    #mobile-header a {
	//background-color: rgb(199,​ 126,​ 16);
    color: white;
	font-size:14px;
	text-decoration:none;
    }
	#topNavContainer {
        display: none;

    }
	#topNav li a {
        display: none;
		height:0px;
    }
	#topNav li a:hover {
        display: none;
		height:0px;
		color: #FFFFFF;
    }
	#navigationSlide {
	    display: none;
	}
	
	
	#footContainer{
	padding-top: 0;
	padding-bottom: 0;
	}
	
	#foot{
	max-width:100%;
	}

	
	#foot a {
    height:30px;
    //text-decoration: none;


	}

	#footNav li, #legal li, #footSocial li {
    display:list-item;
	list-style: none;
	text-decoration: none;
	line-height:30px;
	height:30px;
	//border-top: solid thin rgb(214,214,214);
	font-size: 14px;
	}

	/*******************************************************************/	
	.contentbody
	{
	  margin-left:5px;
		}
	  
	.titlegutter 
	{
	  padding-left:0px;
	  padding-right:0px;
		}
		
	.contentgutter 
	{
	  padding-left:5px;
	  padding-right:5px;
		}
		
	
	
	
	  /* Header
	****************************************************/
	#headerContainer {
		background: transparent url('../../images/header/header-bg.gif') left top repeat-x;
		height: 45px;
	}
	
	#header {
		width: 700px;
		margin: 0 auto;
	}
	
			
		.defaultGridTable td  
		{
			/*line-height:40px;*/
			padding-top:12px;
			padding-bottom: 12px;
	 
	} 
	
		.HC_RightBox 
	{
		float:left;
	}
	   .HC_Box, .HC_LastBox
	   {
	   margin-bottom:5px;
	   }
	.autoAdjust2column
	{
		width:96%;
		min-width:240px;
		}
		
		.autoAdjust1column
	{
		width:100%;
		min-width:240px;
		}
		
	/*hides content on smaller screens.*/  
	#toggleDescription
	{
		display:none;
	}
	
	#toggleButton
	{
		display:none;
		visibility:hidden;
	}
	
	
	/*Outrider mobile styles*/
	.possedetail input { /* input fields */
		line-height: 30px;
		font-size: 11pt;
	} 
	.possedetail { 
		line-height: 30px;
		font-size: 11pt;
	} 
	
	th.mandatory { 
		line-height: 24px;
		font-size: 11pt;
		background-position: left center;   
	} 
	.possebold { 
		line-height: 30px;
		font-size: 11pt;
		font-weight:bold;
	}

}