/*
	Onearmfrog.com Style CSS
	Coded by Ofer Groman 
*/

/* ---- Body ---- */

html, body { height: 100%; } /*solves footer problem*/

body {
background:#24262b url(../images/dark_bg.png);
}

/* --- Text Definition ---*/

h1 {
font-size: 18pt;
color:#7da88c;
letter-spacing: 1px;
text-align: left;
font-weight: bold;
}
h2 {
font-size: 15pt;
color:#7da88c;
letter-spacing: 1px;
text-align: left;
}
h3 {
font-size: 13pt;
color:#7da88c;
letter-spacing: 1px;
text-align: left;
}
.green {
color:#bed349;
}

.cyantext {
font-size: 1.4em;
color:#7da88c;
letter-spacing: 1px;
line-height: 31px;
text-align: left;
}

/* divs */

#page { min-height: 100%; position: relative; }

#green_top1 {
background:#859132;
height: 14px;}

#green_top2 {
background:#bed349;
height: 14px;}

#green_bottom1 {
background:#bed349;
height: 14px;
}

#green_bottom2 {
background:#859132;
height: 14px;}

#green_bottom3 {
background:#bed349;
height: 150px;
display:none;
}
#green_bottom_push {
height: 35px;}

#slider {
    width: 960px;
    margin: 0 auto;
    position: relative;
}
#site-list {
width: 870px;
height: 490px;
overflow: auto;
float: left;
}
.holder {
	float: left;
}
#site-list ul li span {
color:#FFFFFF;
}

/* classes */
.push_down {
margin-top: 20px;
height:auto !important;
height:100%;
min-height:100%;
}
.push_menu{
height:45px;
}
.box {
height: 334px;
width: 380px;
background:#cfcd8e;
}
.box_image {
padding: 57px 25px 34px 25px;
}
.box_text {
font-size: 1.7em;
color:#35323c;
letter-spacing: 1px;
line-height: 36px;
text-align: center;
font-weight: bolder;
}
.green_seperator_top {
border-bottom: 2px solid #bed349;
margin: 10px 0 20px 0;
width: 960px;
height:2px;
}
.green_seperator_bottom {
border-bottom: 2px solid #bed349;
margin: 20px 0 20px 0;
}
.marginleft {
 margin-left:12px;
 }
.marginbottom {
 margin-bottom:30px;
 }
 .margintop {
 margin-top:8px;
 }
.worktext {
font-size: 0.9em;
color:#FFFFFF;
letter-spacing: 1px;
line-height: 22px;
text-align: left;
}
.alignright {
text-align: right;
}
 
/* footer */
#footer {
  background:#859132;
  width:100%;
  padding-top:14px;
  position: absolute;
  z-index: 9999;
  bottom:0;
}
#footer-bg {
  background:#bed349;
  text-align: center;
  height: 14px;
}
#footer-link{
  width:960px;
  margin: 0 auto;
  text-align: right;
}
#footer-link a{
  width: 160px;
}
#footer-link img{
  vertical-align: top;
  float:right;
  position:relative;
  margin-top:-49px;
  
}
#footer-text{
  display:none;
  background:#bed349;
}
#footer-text p {
  padding: 0 0 10px 10px; 
  color: #859132;
  font-size: 1.4em;
}
a {
color: #7da88c;
text-decoration: none;
}
a: visited {
color: #cfcd8e;
}
a:hover {
color: #FFFFFF;
}


/* menu */

ul.navigation {
    list-style: none;
    margin: 0;
    padding: 0;
    padding-bottom: 9px;
}

ul.navigation li {
    display: inline;
    margin-right: 10px;
}

ul.navigation a {
    background-image: url(../images/nav.png); text-indent: -9999px;
	float: left;
	height: 20px;
	padding: 0px 11px 0px 11px;
}

ul.navigation a.home {
		width: 47px; background-position: 0 0;	
}
ul.navigation a.about {
		width: 147px; background-position: -69px 0;	
}
ul.navigation a.portfolio {
		width: 108px; background-position: -238px 0;	
}
ul.navigation a.contact {
		width: 71px; background-position: -368px 0;	
}

ul.navigation a.home:hover,ul.navigation a.home.selected {
  width: 47px; background-position: 0 62px;	
}
ul.navigation a.about:hover,ul.navigation a.about.selected {
  width: 147px; background-position: -69px 62px;	
}
ul.navigation a.portfolio:hover,ul.navigation a.portfolio.selected {
  width: 108px; background-position: -238px 62px;	
}
ul.navigation a.contact:hover,ul.navigation a.contact.selected {
  width: 71px; background-position: -368px 62px;	
}

ul.navigation a:focus {
    outline: none;
}

/* Slider */

.scroll {
    height: 550px;
    width: 900px;
    overflow: auto;
    overflow-x: hidden;
    position: relative;
    clear: left;
}

.scrollContainer div.panel {
    /*padding: 20px;*/
    height: 210px;
    width: 950px;
}

/*grid fixes*/
.grid_5, .grid_12{
  margin-left: 0;
  margin-right: 20px;
}

.scrollButtons {
    position: absolute;
    top: 150px;
    cursor: pointer;
}

.scrollButtons.left {
    left: -20px;
}

.scrollButtons.right {
    right: -20px;
}

.hide {
    display: none;
}

/*contact form*/
#contact-wrapper {
	width:380px;
}
#contact-wrapper div {
	clear:both;
	margin:1em 0;
}
#contact-wrapper label {
	color:#cfcd8e;
	display:block;
	float:none;
	margin-top:2px;
	font-size:16px;
	width:auto;
}
form#contactform input {
	border-style:none;
	padding:5px;
	font-size:16px;
	color:#333;
}
form#contactform textarea {
	font-family:Arial, Tahoma, Helvetica, sans-serif;
	font-size:100%;
	padding:0.6em 0.5em 0.7em;
}
#contact-wrapper .error {
  color:#cfcd8e;
}
/*scroller*/
.osX .jScrollPaneTrack {
				/*background: url(../images/osx_track.gif) repeat-y;*/
			}
			.osX .jScrollPaneDrag {
				/*background: url(../images/osx_drag_middle.png) repeat-y;*/
			}
			.osX .jScrollPaneDragTop {
				/*background: url(../images/osx_drag_top.gif) no-repeat;*/
				height: 6px;
			}
			.osX .jScrollPaneDragBottom {
				*/background: url(../images/osx_drag_bottom.gif) no-repeat;*/
				height: 7px;
			}
			.osX a.jScrollArrowUp {
				height: 24px;
				background: url(../images/osx_arrow_up.png) no-repeat 0 -30px;
			}
			.osX a.jScrollArrowUp:hover {
				background-position: 0 0;
			}
			.osX a.jScrollArrowDown {
				height: 24px;
				background: url(../images/osx_arrow_down.png) no-repeat 0 -30px;
			}
			.osX a.jScrollArrowDown:hover {
				background-position: 0 0;
			}
			
			.left .jScrollPaneTrack {
				left: 0;
				right: auto;
			}
			.left a.jScrollArrowUp {
				left: 0;
				right: auto;
			}
			.left a.jScrollArrowDown {
				left: 0;
				right: auto;
			}
		
			
			/* IE SPECIFIC HACKED STYLES */
			* html .osX .jScrollPaneDragBottom {
				bottom: -1px;
			}
			/* /IE SPECIFIC HACKED STYLES */
.jScrollPaneContainer {
	position: relative;
	overflow: hidden;
	z-index: 1;
}

.jScrollPaneTrack {
	position: absolute;
	cursor: pointer;
	right: 0;
	top: 0;
	height: 100%;
	/*background: #aaa;*/
}
.jScrollPaneDrag {
	position: absolute;
	background: #bcd246;
	cursor: pointer;
	overflow: hidden;
}
.jScrollPaneDragTop {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
}
.jScrollPaneDragBottom {
	position: absolute;
	bottom: 0;
	left: 0;
	overflow: hidden;
}
a.jScrollArrowUp {
	display: block;
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;
}
a.jScrollArrowUp:hover {
	/*background-color: #f60;*/
}

a.jScrollArrowDown {
	display: block;
	position: absolute;
	z-index: 1;
	bottom: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	/*background-color: #666;*/
	height: 9px;
}
a.jScrollArrowDown:hover {
	/*background-color: #f60;*/
}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
	/*background-color: #f00;*/
}