/* A Linux- and Windows-friendly sans-serif font stack: http://prospects.mhurrell.co.uk/post/updating-the-helvetica-font-stack */
body {
	font: 13px Helmet, Freesans, sans-serif;
	min-height: 500px;
    min-width: 800px;
}

/* Using local fonts? Check out Font Squirrel's webfont generator: http://www.fontsquirrel.com/tools/webfont-generator */

/* We like off-black for text. */
body, select, input, textarea {color: #333;}

a {
	color: #e14b00;
}
a:hover {color: #f75200;}

/* Custom text-selection colors (remove any text shadows: http://twitter.com/miketaylr/status/12228805301) */
::-moz-selection{background: #fcd700; color: #fff; text-shadow: none;}
::selection {background: #fcd700; color: #fff; text-shadow: none;} 

/*	j.mp/webkit-tap-highlight-color */
a:link {-webkit-tap-highlight-color: #fcd700;} 

ins {background-color: #fcd700; color: #000; text-decoration: none;}
mark {background-color: #fcd700; color: #000; font-style: italic; font-weight: bold;}

/* Mozilla dosen't style place holders by default */
input:-moz-placeholder { color:#a9a9a9; }
textarea:-moz-placeholder { color:#a9a9a9; }

/* Helianic Custom styles for web
-------------------------------------------------------------------------------*/

ul, ol {
    list-style: outside none none;
}

body {

}

h1, h2 {
	font-family: 'Lato', sans-serif;
}
h1 {
	font-size: 1.8em;
}

h2 {
	font-size: 1.5em;
	margin-top: 1em;
}

form {
    background: wheat;
    border: 1px solid #666;
    font-size: 11pt;
    padding: 6px 6px 20px;
    width: 400px;
}
  form h2 {
  	margin-top:0;
  	padding: 5px;
  }
  label {
    display: inline-block;
    line-height: 2;
    padding-left: 20px;
    vertical-align: top;
    width: 110px;
  }
  #name-error, #email-error, #comments-error, #phone-error, #ext-error, .errMsg
  {
  	color: red;
  	font-size: 0.8em;
  	width: 100%;
  }
  .successMsg {
  	color: green;
  }
  #contactBtn {
  	left: 251px;
    position: relative;
    top: 10px;
  }

.button {
	border-radius:8px;
	border: 1px solid tan;
	padding: 6px 10px;
	text-decoration:none;
	background:-moz-linear-gradient( center top, #f9f9f9 13%, #e9e9e9 92% );
	background:-ms-linear-gradient( top, #f9f9f9 13%, #e9e9e9 92% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#e9e9e9');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(13%, #f9f9f9), color-stop(92%, #e9e9e9) );
	background-color:#f9f9f9;
	color:#666;
	display:inline-block;
	text-shadow:1px 1px 0px #fff;
 	box-shadow:inset 1px 1px 0px 0px #fff;
}.button:hover {
	background:-moz-linear-gradient( center top, #e9e9e9 13%, #f9f9f9 92% );
	background:-ms-linear-gradient( top, #e9e9e9 13%, #f9f9f9 92% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#e9e9e9', endColorstr='#f9f9f9');
	background:-webkit-gradient( linear, left top, left bottom, color-stop(13%, #e9e9e9), color-stop(92%, #f9f9f9) );
	background-color:#e9e9e9;
}.button:active {
	position:relative;
	top:1px;
}

#wrapper {
/*   margin-left: auto;
    margin-right: auto;
    width: 960px;
    */
    position: relative;
    
    border-radius: 0 0 7px 7px;
   	border: 1px solid #eee;

    background-color: #fff; 

}

header {
	height: 137px; 
    border-bottom: 7px solid #e1a05a;
}

	#logo {
	    position: relative;
	    float: left;
	    left: 21px;
	    top: 11px;
	}
	#logoImg {
		height: 108px;
	}


	nav { 
	    position: relative;
	    left: 96px;
	    top: 87px;
	}

	nav li { 
		float: left; 
		padding-top: 0;
	}
	nav li a {
	    background: #FFEE99;
	    border: 1px solid lightyellow;
	    border-bottom: 1px solid #FFEE99;
	    border-radius: 100px 100px 0 0;
	    color: #f75200;
	    display: block;
	    font-size: 11pt;
	    letter-spacing: 1px;
	    padding: 15px 16px 10px 24px;
	    text-decoration: none;
	    width: 146px;
	}
	nav li a.current {
		color: #0098f7;
		border-top: 1px solid #0098f7;
		border-left: 1px solid #0098f7;
		border-right: 1px solid #0098f7;
	}
	nav li a:hover {
		background: #ffe861;
		color: #f75200;
	}

/* Page Layout for fixed left panel and liquid main content
-------------------------------------------------------------------------------*/
.colmask {
    clear: both;
    float: left;
    overflow: hidden;
    position: relative;
    width: 100%;
}


	.leftmenu {
		background: url("../img/grid.jpg") repeat; 
	}
		#hexagon {
		    position: relative;
		    top: 6px;
		    left: -8px;

		    left: -4px;
		    top: 15px;
		}
		.hexagonIcon {
			position: relative;
			z-index: 1;
		}
		#telephone { left: 1px; top: 60px;
		}
		#cell { left: 51px; top: 20px;
		}
		#tablet { left: 115px; top: 168px; 
		}
		#laptop { left: 54px; top: 59px;
		}
		#email { left: -76px; top: 179px;
    	}

		#server { left: 77px; top: -124px; }
		#computer { 
			left: -72px;
    		top: -1px;
		}
		#telephone2 { left: 6px; top: -33px; }
		#email2 { left: -39px; top: -43px; }

	.leftmenu .colright {
	    background: lightyellow;
	    border-left: 7px solid wheat;
	    float: left;
	    left: 240px; 
	    position: relative;
	    width: 193%; 
	}

	.leftmenu .col1wrap {
	    float: right;
	    padding-bottom: 1em;
	    padding-top: 1em;
	    position: relative;
	    right: 200px;
	    width: 50%;
	}

	.leftmenu .col1 {
	    margin: 0 15px 0 215px;
	    overflow: hidden;
	    position: relative;
	    right: 100%;
	}

	.leftmenu .col2 {
	    float: left;
	    position: relative;
	    right: 228px;
	    width: 240px;
	}

/* End page layout for fixed left panel and liquid main content */

footer {
	border-top: 1px solid #eee;
    clear: both;
    padding: 8px;
    color: #666;
}

#design { float: right;
	letter-spacing: 1px;
	font-family: 'Pacifico', cursive;
	text-shadow: 2px 2px 2px #ddd;
	color: #aaa;
}

/* Callout styles
-------------------------------------------------------------------------------*/
  .callout {
    padding: 8px;
    border: 1px solid #888;
    background-color: #eee; 
    position: relative;
    border-radius: 7px;

    width: 50%;
      
  }


  .callout ul, p {
      padding-top: 10px;
  }
  .callout ul, ul {
  	list-style: disc outside;
  	padding-left:11px;
  }
  .callout li , li{
  	padding-top: 5px;
  }



/* Media queries
-------------------------------------------------------------------------------*/

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



/* Print styles
-------------------------------------------------------------------------------*/
@media print {



}