
header, nav, article, footer {display:block;}

body {background:#e6e6e6;}

.wrap {width:88%; max-width:1204px; margin:0 auto;}

.clear {clear:both; margin:0 !important; height:0;}
.float-left {float:left;}
.float-right {float:right;}

.hide-desktop {display:none;}
.show-640 {display:none;}


.column2 {width:48%; margin:0 1%; float:left;}
.column3 {width:31.33333%; margin:0 1%; float:left;}
.column4 {width:23%; margin:0 1%; float:left;}

.column3-full {width:33.33333%; margin:0; float:left;}

.tri-col {width:32.33333%; margin:0 1.5% 20px 0; float:left;}
.tri-col:nth-of-type(3) {margin-right:0%;}

.half-col {width:49%; margin:0 2% 20px 0; float:left;}
.half-col:nth-of-type(even) {margin-right:0%;}

.half-col embed, .half-col video /*.half-col iframe*/ {width:100%; height:auto;}

.col-66 {width:65%; margin:0 1.66666% 20px 0; float:left;}
.col-33 {width:31.33333%; margin:0 0 20px 0; float:left;}

.tab-split-col {width:100%; margin:0 0% 10px 0; float:left;}

.tab-split-33 {width:31.33333%; margin:0 0 20px 0; float:left;}
.tab-split-66 {width:65%; margin:0 0 20px 1.66666%; float:left;}



/****************************** store styles **/
header#hs-header-wrapper {padding:0; border-bottom:none;}
.hs-btn.hs-highlighted {background-color:#0f8d44; color:#fff!important;}
.hs-btn.hs-highlighted:hover {background-color:#000;}


/****************************** header styles **/

.facebook-tab {
	position:absolute;
	top:125px;
	right:0;
	display:block;
	width:40px;
	height:174px;
	z-index:9999;
	background:url('/templates/joharrissales.com/images/facebook.png') no-repeat;
}
.facebook-tab:hover {background:url('/templates/joharrissales.com/images/facebook-hover.png') no-repeat;}

header {width:100%; padding:25px 0; border-bottom:5px #000 solid; background:#333;}

.logo {width:18.7%; float:left; margin-right:14%;}
.logo img {width:100%; max-width:226px; height:auto; display:block;}





/****************************** nav styles **/

nav {width:67.3%; float:left; margin-top:120px;}
nav ul {width:100%; text-align:right;}
nav li {position:relative; display:inline; margin-left:2.4%;}
nav a:link, nav a:active, nav a:visited {
	display:inline-block;
	text-decoration:none;
	color:#fff;
	font-weight:normal;
	font-family: 'pt_sansbold';
	font-size:22px;
	line-height:34px;
}
nav a:hover {color:#0f8d44;}


nav ul ul {
	display: none;
	position: absolute; 
	z-index:99999;
	top: 24px;
	left:0;
	width:210px;
	background:#000;
	text-align:left;
	padding:0; margin:0;
}

nav ul ul ul {
	position: absolute; 
	left: 100%; 
	top:0;
}

nav ul li:hover > ul {
	display: block;
	z-index:99999;
}

nav ul ul li {
	float: none; 
	position: relative;
	display:block;
	margin-left:0%;
}

nav ul ul li a:link, nav ul ul li a:active, nav ul ul li a:visited{
	font-size:16px;
	line-height:28px;
	padding:0 0 0 10px;
	border-bottom: 1px solid #666;
	text-align:left;
	color:#fff;
	display:block;
}
nav ul ul li:last-child a {border-bottom:0;}

nav ul ul li a:hover {
	background: #0f8d44;
	color:#fff;
}





/****************************** slideshow / icon bar / search box styles **/

/* icon bar */

.icon-bar {
	background:#e6e6e6;
	display:block;
	width:100%;
	padding:35px 0;
	text-align:center;
}

.icon-bar img {
	display:block;
	width:65%;
	max-width:200px;
	height:auto;
	margin:0 auto 10px auto;
}

.icon-bar a {
	color:#000;
	font-size:20px;
	font-weight:normal;
	font-family: 'pt_sansbold';
	margin-bottom:0;
	text-transform:uppercase;
	text-decoration:none;
}
.icon-bar a:hover {color:#0f8d44; text-decoration:none;}



/* search box */

.search-box {
	width:100%;
	display:block;
	background:#0f8d44;
	border-top:5px #0c7338 solid;
	border-bottom:5px #0c7338 solid;
	padding:35px 0;
}

.search-box .col {
	width:32.33333%;
	margin-right:1.5%;
	float:left;
}
.search-box .col:nth-of-type(3n) {margin-right:0 !important;}







/****************************** content styles **/

article {
	width:100%;
	display:block;
	background:#e6e6e6;
	padding:40px 0;
}


/* home page */
.main {width:80%; float:left; margin-right:1%;}

.sidebar {width:19%; float:left;}
.sidebar img {width:70%; margin:0 15%; height:auto; max-width:126px;}



/****************************** footer styles **/

.scroll-frame {
	width:100%;
	display:block;
	padding:12px 0;
	background:#000;
	overflow:hidden;
}
.scroll-frame iframe {width:100%; display:block; background:#000; height:90px;}


.lt-foot {
	width:33.3333%;
	float:left;
	margin-right:3.9%;
	display:block;
}

div.foot-nav {
	width:55%;
	float:left;
	display:block;
	margin-bottom:24px;
	color:#fff;
}

.foot-contact {
	width:45%;
	float:left;
	display:block;
	color:#fff;
}
.foot-contact p {line-height:24px; font-size:14px;}

.fb-feed {
	width:27.6%;
	float:left;
	display:block;
	margin-right:3.16667%;
}

.newsletter {
	width:32%;
	float:left;
	display:block;
	color:#fff;
}
.newsletter p {font-size:14px; margin-bottom:5px !important;}



.foot {
	width:100%;
	display:block;
	padding:30px 0; background:#333;
}

a.footerlink:link, a.footerlink:visited, a.footerlink:active{text-decoration:underline; font-size:10px; color:#ababaa;}
a.footerlink:hover {text-decoration:none; color:#ababaa;}

.footertext{font-size:10px; color:#ababaa;}
.smallfootertext{font-size:10px; color:#ababaa;}

.divfooter {width:100%; text-align:left; margin:0; line-height:12px;}








/****************************** responsive styles **/

@media screen and (max-width: 1280px) {
	.hide-1280 {display:none;}
	
	.logo {width:22.7%; margin-right:10%;}
	nav {margin-top:115px;}
	nav li {margin-left:2.1%;}
	nav a:link, nav a:active, nav a:visited {
		font-size:18px;
		line-height:30px;
	}
	nav ul ul {top: 20px;}
	
	
	.lt-foot {width:55.5%; margin-right:1.9%;}
	.newsletter {margin-left:10.5%;}
	
}


@media screen and (max-width: 1024px) {
	#container.fixed {position:fixed !important; overflow-y:hidden !important;}
	
	.logo {width:23.7%; margin-right:1%;}
	nav {width:75.3%; margin-top:100px;}
	nav li {margin-left:2%;}
	nav a:link, nav a:active, nav a:visited {
		font-size:15px;
		line-height:26px;
	}
	nav ul ul {top: 16px;}
	
	.cycle-prev, .cycle-next {width:7%;}
	
	.icon-bar, .search-box {padding:20px 0;}
	.icon-bar a {font-size:16px;}
	
	article {padding:25px 0;}
	
	.sidebar img {width:80%; margin:0 10%;}
	
	.inv-sidebar {width:30%;}
	.inv {width:70%;}
	.inv-sidebar a:link, .inv-sidebar a:active, .inv-sidebar a:visited {
		font-size:14px;
	}
	
	.inv.attach, .inv.search {width:100%;}
	.attach-sidebar li {width:33.33333%;}
	
	.manu-logo {width:17%;}
	
	#gal_container img {height:90px;}
	
	.lt-foot {width:60.4%; margin-right:0%;}
	.newsletter {margin-left:3.5%; width:36%;}
	
}


@media screen and (max-width: 768px) {
	.hide-desktop {display:block;}
	.hide-tablet {display:none;}
	
	.column2 {width:100%; margin:0 0%;}
	.gravity-wagon .column2 {width:48%; margin:0 1%;}
	
	.column3-full {width:50%;}
	.column3-full:nth-of-type(2n) {clear:right;}
	.column3-full:nth-of-type(3n) {clear:none;}
	
	
	.facebook-tab {top:98px; height:40px; background:url('/templates/joharrissales.com/images/facebook-sm.png') no-repeat;}
	.facebook-tab:hover {background:url('/templates/joharrissales.com/images/facebook-sm-hover.png') no-repeat;}
	
	.logo {width:28.7%;}
	
	#simple-menu{
		float:left;
		background:url(../images/mobile-nav-icon.png) no-repeat center center;
		height:35px;
		width:35px;
		display:block;
		cursor:pointer;
		margin:75px 0 0 60%;
	}
	
	.cycle-prev, .cycle-next {width:10%;}
	
	.search-box .col {width:49%; margin-right:1.5%;}
	.search-box .col:nth-of-type(3n) {margin-right:1.5% !important;}
	.search-box .col:nth-of-type(2n) {margin-right:0 !important;}
	
	.sidebar img {width:95%; margin:0 0 0 5%;}
	
	.sm-lt-content {width:100%; float:none; margin-right:0%;}
	.rt-slide-content {width:68%; float:none; margin:15px 16% 0 16%;}
	
	.manu-logo {width:22%;}
	
	.attach-sidebar li {width:50%;}
	
	.doc-box img {width:28.33333%; margin:0 2.5% 15px 2.5%;}
	
	.planter-box {width:48%; margin-bottom:10px;}
	
	.part-box {width:31.33333%;}
	
	.tri-col {width:48.5%;}
	.tri-col:nth-of-type(3) {clear:both;}
	
	.photo-box-sm {width:50%; float:left; margin:0 25% 10px 25%;}
	.description-box-sm {width:100%; float:left;}
	
	.col-66 {width:100%; margin:0 0% 20px 0;}
	.col-33 {width:50%;}
	.grain-cart .col-33 {width:100%;}
	
	.tab-split-col {width:48.5%; margin:0 3% 0 0; float:left;}
	.tab-split-col:nth-of-type(2) {margin-right:0%;}
	
	.tab-split-33 {width:100%; margin:0 0 10px 0; float:left;}
	.tab-split-66 {width:100%; margin:0 0 20px 0%; float:left;}
	
	.employee {width:48%;}
	.employee:nth-of-type(3n + 1) {clear:none;}
	.employee:nth-of-type(odd) {clear:left;}
	
	.lt-foot {width:100%;}
	.newsletter {margin-left:0%; width:100%;}
	.divfooter {width:90%; margin:15px 5% 0 5%; text-align:center;}
}


@media screen and (min-width: 641px) {
	.inv-sidebar {display:block !important;}
}

@media screen and (max-width: 640px) {
	.hide-640 {display:none;}
	.show-640 {display:block;}
	
	.facebook-tab {top:83px;}
	.logo {width:34.7%;}
	#simple-menu{margin:60px 0 0 50%;}
	
	.icon-bar {padding:0 0 10px 0;}
	
	.column4 {width:48%;}
	.icon-bar img {width:40%; margin:10px auto 10px auto;}
	
	.search-box {padding:10px 0;}
	.search-box .col {width:100%; margin-right:0%;}
	
	article {padding:15px 0;}
	
	.main {width:70%;}
	.sidebar {width:29%;}
	
	.rt-slide-content {width:80%; margin:15px 10% 0 10%;}
	
	.inv-sidebar {
		display:none;
		width:100%;
		min-height:200px;
		top:45px;
		position:absolute;
	}
	.inv-sidebar li {width:50%; float:left; position:relative; display:inline;}
	.inv-sidebar a:link, .inv-sidebar a:active, .inv-sidebar a:visited {
		border-right:1px #005726 solid;
	}
	.inv {width:100%; margin-left:0%;}
	
	.manu-logo {width:30.33333%;}
	
	#gal_container img {height:80px;}
	
	.cycle-slideshow3 {width:100%; width:calc(100% - 4px);}
	.tri-col {width:100%; margin:0 0% 20px 0;}
	.col-33 {width:100%;}
	
	.half-col {width:100%; margin:0 0% 20px 0; float:left;}
	
	.planter-half {width:100%; float:none; margin:0 0% 20px 0; text-align:center;}
	
	.photo-box {width:100%; float:none; margin-right:0%;}
	.photo-box img {margin:0 auto 10px auto;}
	.description-box {width:100%; float:none;}
	
	.part-model-column {width:100%; margin:0 0% 10px 0; float:left;}
	
}


@media screen and (max-width: 480px) {
	.hide-480 {display:none;}
	
	.column3-full {width:100%;}
	.column3-full:nth-of-type(2n) {clear:none;}
	
	.model-box-third {width:100%; margin-right:0%;}
	
	.facebook-tab {top:78px;}
	.logo {width:40%;}
	#simple-menu{margin:55px 0 0 37%;}
	
	.main {width:100%; margin-right:0;}
	
	.rt-slide-content {width:100%; margin:15px 0% 0 0%;}
	
	.manu-logo {width:44%; margin:0 3%;}
	
	.inv-sidebar li, .attach-sidebar li {width:100%;}
	
	.doc-box img {width:45%; margin:0 2.5% 15px 2.5%;}
	
	.part-box {width:48%;}
	
	.photo-box-sm {width:70%; float:left; margin:0 15% 10px 15%;}
	
	.tab-split-col {width:100%; margin:0 0% 10px 0; float:left;}
	.gravity-wagon .column2 {width:100%; margin:0 0%;}
	
	.employee {width:100%; margin-right:10px;}
	
	div.foot-nav {width:100%; margin-bottom:20px;}
	.foot-contact {width:100%;}
	
}


@media screen and (max-width: 375px) {
	.facebook-tab {top:73px;}
	.logo {width:47%;}
	#simple-menu{margin:50px 0 0 30%;}
	.doc-box img {width:80%; margin:0 10% 15px 10%;}
	.planter-box {width:100%; margin:0 0 10px 0;}
	.photo-box-sm {width:100%; float:left; margin:0 0% 10px 0%;}
	
}


@media screen and (max-width: 320px) {
	#simple-menu{margin:50px 0 0 26%;}
}








