﻿/***** BEGIN RESET *****/
* {
    background:transparent;
    border:0;
    margin:0;
    padding:0;
	font-family:Arial, Helvetica, sans-serif;
	font-style:normal;
	-webkit-text-size-adjust: none;
}

ol, ul {list-style: none;}
.clear {clear: both; height:0px; margin:0;}

body {overflow-x:hidden;}
co
/***** END RESET *****/

h1 {font-size:36px; -webkit-text-size-adjust: none;}
h2 {font-size:22px; -webkit-text-size-adjust: none;}
h3 {font-size:18px; margin-top:10px; -webkit-text-size-adjust: none;}
h6 {font-size:8px; line-height:11px; -webkit-text-size-adjust: none;}

p {font-size:15px; line-height:22px; -webkit-text-size-adjust: none;}

.bold {
    font-weight: 600;
}

.font-red {
    color:#CB0003;
}
.font-red a {
    color:#CB0003;
}
.font-red a:hover {
    color:#000;
}
.font-blue {
    color:rgba(26,0,197,1.00);
}
.font-center {
    text-align: center;
}

a {
    color:#000;

    text-decoration: none;
}
a:hover {
    color:#018901;
}

/******MAIN NAVIGATION******/ 

#menu-button{display: none;}
nav.mobile {display:none;}

#navwrap { 
    text-align:center;
    background:#6A6A6A;
    -moz-box-shadow:  0 0 5px #000;
    -webkit-box-shadow: 0 0 5px #000;
    box-shadow: 0 0 5px #000;
}

#nav {
    position:relative;
    display:block;  
    z-index:9000;
    margin:0 auto 0 auto;
    padding:0 0 0 0;
    text-align:center;
    width:100%;
}
  
#nav ul {
    list-style: none;  
    margin:0 0 0 0;
    padding:0 0 0 0;  
    display: flex;
    justify-content: center;
    align-items: center;
}
#nav li {
    list-style: none;  
    margin:0 0 0 0;
    padding:0 0 0 0;  
}
  
#nav ul li {
    display: block;
    position: relative;
    text-align:center;
}
  
#nav li ul {display: none;}
  
  
#nav ul li a { /* appearance of the first-level links */
    display: block;
    text-decoration: none;
    color: #fff;
    font-weight:normal;
    font-size:16px;
    line-height:18px;
    transition:color .4s ease-in-out; -moz-transition:color .2s ease-in-out; -webkit-transition:color .2s ease-in-out;
    padding:12px 20px;  
    height: 1%;
    border-right: 1px solid #4F4F4F;
    border-left: 1px solid #4F4F4F;
    text-align:center;
}
 
 
#nav ul li a:hover { /* appearance of the first-level links on hover */
    height: 1%; 
    color:#fff; 
    background:#4F4F4F;
}
  
  
  
#nav ul li li a { /* appearance of the sub-level links */
    width:230px;
    padding:8px 0 8px 15px;
    text-align:left;
    background:#6A6A6A;
    border-bottom:1px #4F4F4F solid;
    border-right: 1px solid #4F4F4F;
    border-left: 1px solid #4F4F4F;    
}
#nav ul li li a:hover { /* appearance of the sub-level links on hover */
    color:#fff; 
    background:#4F4F4F url("../siteart/nav-ro-bg.jpg") repeat-x;     
}
    
/* Optional-use, Begin targeting styles of first and last links */
#nav ul li:last-child  { /* Optional-use, this targets last li */
    border-right: 1px solid #4F4F4F;
}
#nav ul li:last-child a {
    border-right: 1px solid #4F4F4F;  /* Optional-use, this targets last link */
}
#nav ul li:first-child  { /* Optional-use, this targets first li */
    border-left: 1px solid #4F4F4F;
}
  
/* Optional-use, cancells out border for subnav li containers*/
#nav ul li li:last-child  {border-left:0; border-right:0;}
#nav ul li li:last-child a {border-right: 1px solid #029402;}
#nav ul li li:first-child  {border-left:0; border-right:0;}
/* Optional-use, End targeting styles of first and last links */
  
/* Unless needing to do something extra or experimental, DON'T edit these positioning styles below! */
#nav ul ul {display: none; position: absolute; top:100%; left:0;}
  
#nav ul ul ul {position: absolute; left: 100%; top:0; }
  
#nav ul li:hover > ul {  
    display: block;
    line-height:18px; /* make sure your line-height always matches that of your main link styles!*/
    z-index: 100;
    background:#4b0000; /* make sure your background color always matches your link styles!*/
}
  
#nav ul ul li {float: none; position: relative;}

/******** Basic Styles ********/
.show-menu-for-mobile {display:none;}  /* At most larger screen widths, the burger icon for the mobile menu won't be displayed. */

#headercontent {
    width: 95%;
    margin: 2px auto;
    display:flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
}




.site-width {width:100%; max-width:1100px; margin:0 auto; padding:30px 0;}

.colorblock {background:#018901; color:#fff; padding:40px 0 30px;}
.colorblock a {color:#fff; text-decoration:none;}

.colorblock-grey {background:#6A6A6A; color:#fff; padding:40px 0 30px;}
.colorblock-grey a {color:#fff; text-decoration:none;}

/******** Header Styles ********/
.logo {width:24%;}
.logo img {width:100%;display: block;height: auto;}
.logo-2 {
   width:10%; 
}
.logo-2 img {
    width: 100%;
    height: auto;
    display: block;
    margin:0 auto;
}

.manulogos {width:60%; text-align:center; }
.manulogos img {padding:10px 20px; max-height:70px; vertical-align:middle;}


/******** Content Styles ********/
.location { width:19%; text-align:center; line-height:25px; font-size:12px;}
.pagetext {float:left; width:71%; margin-top:30px;}
.pagetext a {color:#018901; text-decoration:none;}
.pagetext a:hover {color:#000; text-decoration:none;}
.pageright {float:right; width:20%;}
.pageright img {width:100%; text-align:center;}

#inventorywrap {max-width:1020px; width:100%; margin:0 auto;}

.contactinfo img {width:100%;}
.contactinfo {float:left; width:44%; text-align:center; margin-bottom:10px; border:1px solid #000; padding:1% 2%; margin-right:1%;}
.contactinfo a {color:#018901; text-decoration:none;}
.contactinfo a:hover {color:#000; text-decoration:none;}

.contactleft {float:left; width:60%; text-align:left; margin-top:10px;}
.contactright {float:right; width:38%; margin-top:10px;}

.leasing {float:left; width:71%; margin-top:30px;}
.leasing img {width:100%;}


.rightpage {float:right; width:20%; margin-top:30px;}
.rightpage img {width:100%; text-align:center;}

.rightpage li {margin:8px 0 15px 0;}
.rightpage li a {color:#000; text-decoration:none;}
.locationlittle {font-size:11px;}

.rentlogo {display:inline-block;; width:15%; margin:.25%; vertical-align:middle;}
.rentlogo img  {width:100%;}
.rentpic {display:inline-block; width:80%; vertical-align:middle;}
.rentpic img {width:18%; margin:.25%;}
.rentlogos img {height:125px; vertical-align:middle; margin:1%;}

.img-responsive {
    max-width: 100%;
    height: auto;
    display: block;
}

.cert-stat {
    font-weight: 400;
}

.cert-green {
    color:green;
}
.cert-red {
    color:#BE0003;
}
.cert-blue {
    color:blue;
}

.et-col-1-3 {
    width:33.33%;
    padding:0px 15px 0px 15px;
    border-right:2px solid #000;
    box-sizing: border-box;
    margin:40px 0 20px 0;
}
.et-col-1-3:last-child {
    padding:0px 0px 0px 15px;   
    border-right:0px;
}
.et-col-1-3:first-child {
    padding:0px 15px 0px 0px;   
}

.et-col-1-3 .info-img {
    float: left;
    max-width: 100px;
    height: auto;
    margin-top: -10px;
    padding: 0 5px 0 0;
}

.et-col-1-3 .et-info-img {
    width:100%;
    height: auto;
    padding:10px 0;
    display: block;
}

.et-col-1-3 ul li {
    padding:5px 0;
}


.logo-cont-1 {
    display: flex;
    align-items: center;
}
.logo-cont-2 {
    display: flex;
}
.logo-cont-3 {
    display: flex;
    justify-content: space-between;
}


.affering-highlight {
    background: rgba(26,0,197,1.00);
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    padding: 5px;
    margin: 10px 0;
}

.lease-inv-head {
    font-size: 35px;
    font-weight: 600;
}

.logo-cont-1 img, .logo-cont-2 img, .logo-cont-3 img {
    max-width: 100%;
    height:auto;
	max-height: 150px;
    display: block;
}
.logo-cont-4 img {
    max-width: 30%;
    height:auto;
    display: block;
    margin:0 auto;
}

.event-cont-1 {
    padding:20px 0;
    border-bottom:1px solid #000;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.container {
	margin:30px 0;
}
.flex-cont-1 {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.flex-cont-2 {
    display: flex;
    justify-content: space-between;
}
.cont-top {
    padding:30px 1% 0 0;
    box-sizing: border-box;    
    display: flex;
}
.cont-top h1 {
    font-size: 36px;
    padding:0 20px 0 0;
}
.col-left {
    width:59%;
    padding:30px 1% 10px 0;
    box-sizing: border-box;
}
.col-right {
     width:41%;
    padding:30px 0 10px 1%;
    box-sizing: border-box;
}
.col-1-8 {
    width:12%;
}
.col-1-4 {
    width:24%;
}
.col-3-4 {
    width:74%;
}
.sub-head {
     font-size: 24px;
    color:#6A6A6A;
    font-style: italic;
    padding:10px 0 15px 0;
}
.bullet-list {
    display: flex;
    padding:10px 0 20px 0;
}
.bullet-list ul {
    padding:0 50px 0 0;
    margin:0;
}
.bullet-list ul li {
    padding: 5px 0 5px 5px;
    margin: 0 0 0 18px;
    list-style: initial;
}

.careers-right h3 {
    padding:0 0 5px 0;
}
.careers-right h4 {
    padding:5px 0 0 0;
}
.careers-right p {
    font-size: 12px;
    padding:5px 0;
    line-height: 27px;
}

/******** Icon Buttons ********/
.homeinventory {width:49%; margin:1% .25%; float:left;}
.homeinventory img {width:100%;}

.hovereffect {width: 100%; height: 100%; float: left; overflow: hidden; position: relative; text-align: center; cursor: default;}
.hovereffect .overlay {width: 100%; height: 100%; position: absolute; overflow: hidden; top: 0; left: 0;}

.hovereffect img {display: block; position: relative; -webkit-transition: all 0.4s ease-in; transition: all 0.4s ease-in;}
.hovereffect:hover img {
  filter: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg"><filter id="filter"><feColorMatrix type="matrix" color-interpolation-filters="sRGB" values="0.2126 0.7152 0.0722 0 0 0.2126 0.7152 0.0722 0 0 0.2126 0.7152 0.0722 0 0 0 0 0 1 0" /><feGaussianBlur stdDeviation="3" /></filter></svg>#filter');
  filter: grayscale(1) blur(3px);
  -webkit-filter: grayscale(1) blur(3px);
  -webkit-transform: scale(1.2);
  -ms-transform: scale(1.2);
  transform: scale(1.2);
}

.hovereffect a.info {display:inline-block; margin:25% auto; font-size:18px; font-weight:700; width:100%; height:100%; color:#fff; line-height:30px; text-transform:uppercase; text-decoration: none;}

/******** Scrolling Inventory ********/
.scrolling-wrap {width:100%; height:90px;overflow:hidden;}
.scrolling{width:100%; height:92px;}


/******** Footer Styles ********/
footer {color:#fff; padding:10px 0;}
a.footerlink:link, a.footerlink:visited, a.footerlink:active{text-decoration:underline; font-size:10px; color:#fff; line-height:12px;}
a.footerlink:hover {text-decoration:none; font-size:10px; color:#fff; line-height:12px;}

.footertext{font-size:10px; color:#fff; line-height:12px;}

.smallfootertext{font-size:10px; color:#fff; line-height:12px;}

.divfooter {width:600px; text-align:center; margin:0 auto;}
.bottomnav {text-align:center; color:#fff; font-size:11px; line-height:16px; padding:15px 0;}

.kalmar-logo img {max-height:88px;}

/************************************************ Responsive Styles **/
@media screen and (max-width: 1880px) {
.manulogos img {height:60px;}
}

@media screen and (max-width: 1380px){
.show-menu-for-mobile {display:none;}

#headercontent {width:93%;}
.manulogos img {padding:10px 5px; height:59px;}
}
@media screen and (max-width: 1310px){
   #nav ul li a {
       font-size: 1.2vw;
       padding: 12px 1.3vw;
   }
}

@media screen and (max-width: 1253px) {
.show-menu-for-mobile {display: none;}

#headercontent {width:95%;}
.site-width {width:95%;}


.manulogos img {padding:10px 5px; height:48px;}

.location {font-size:14px;}
.pagetext {width:70%;}

h1 {font-size:28px;}
	


	
}

@media screen and (max-width: 1023px) {
.show-menu-for-mobile {display: none;}

#headercontent {width:95%;}
.site-width {width:95%;}
#colorblock {padding:25px 0;}



.manulogos img {padding:10px 5px; height:30px;}




.location {font-size:11px;}
h2 {font-size:18px;}
.pagetext {width:70%;}
.pagetext img {text-align:center; width:75%;}
.certified img {width:15%;}

h1 {font-size:22px;}

.contactinfo {float:none; width:90%; margin:10px auto;}
	
.homeinventory {width:49%;}	
	
}

@media screen and (max-width: 767px){
.col-left, .col-right {
    width:100%;
    padding:30px 0 0 0;
}
.cont-top {
    width:100%;
    padding:0;
}
.et-col-1-3 {
    width:100%;
    padding:15px 0px;
    border-right:0px;
    border-bottom:2px solid #000;
    box-sizing: border-box;
    margin:40px 0;
}
.et-col-1-3:last-child {
    padding:15px 0px;  
    border-right:0px;
    border-bottom:0px;
}
.et-col-1-3:first-child {
    border-right:0px;
}
    
.show-menu-for-mobile {display: block;}
.hide-for-mobile {display:none;}
.hide {display:none;}

#headercontent {width:95%;}
.site-width {width:95%;}
#colorblock {padding:25px 0;}



.manulogos {width:60%;}
.manulogos img {padding:10px 5px; height:18px;}

.location {float:none; width:100%;}
h2 {font-size:16px;}
.pagetext {width:66%;}
.pagetext img {text-align:center; width:75%;}
.certified img {width:20%;}
.pageright {width:29%;}

h1 {font-size:18px;}

.contactinfo {float:none; width:90%; margin:10px auto;}

.leasing img {width:90%;}
	
.homeinventory {width:49%;}	
	
.rentlogos img {height:100px;}
	

.divfooter {width:100%;}
/******************styles for the main site navigation during mobile display*************/

#nav  {display:none;}
	
	nav.primary{display:none;}
	#menu-button{width:100%; display: block; font-size: 1.25em; line-height:45px; position: relative; z-index: 400;}
	#menu-button a{color:#fff; text-decoration: none; padding:0;}
	
	nav.mobile ul li a .fa{
		width:25px;
		font-weight:100;
		padding:8px 3px;
		margin:0 0 0 5px;
		text-align:center;
		background:#292929;
		-webkit-border-radius: 30px;
		-moz-border-radius: 30px;
		border-radius: 30px;
		text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
	}
	
	nav.mobile ul li .fa-chevron-down {position:absolute; right:10px; margin:18px 0 0 0;}

	nav.mobile {
		display:block;
		position: fixed;
		top: 0;
		left: -285px;
		width: 285px;
		height: 100%;
		z-index: 500;
		overflow:auto;
		background:#333;
	}
	
	/* MENU HEADER SOCIAL MEDIA */
	nav.mobile .social-media {
		position: absolute;
		text-decoration: none;
		vertical-align: top;
		z-index:9999;
		display: inline-block;
		
		top: 15px;
		left: 15px;
		font-size:16px;
		word-spacing:13px;
		color: #ccc !important;
	}
	
	nav.mobile .social-media a:link, nav.mobile .social-media a:visited {color:#ccc; text-decoration:none;}
	nav.mobile .social-media a:hover, nav.mobile .social-media a:active {color:#fff; text-decoration:underline;}
	
	/* MENU HEADER STYLES */
	nav.mobile h3 {	
		color: #ccc;
		padding: 23px 0;
		position: relative;
		font-size: 18px;
		background:#313131;
	}			
	nav.mobile .menu-title {position: absolute; vertical-align: top; top: 16px; right: 47px; text-transform:uppercase; font-size:12px; color: #ccc;}
		
	/* MENU CLOSE 'X' BUTTON */
	nav.mobile .menu-toggle {position: absolute; top: 8px; right: 10px; padding: 6px 9px 5px; display: inline-block; font-weight: 700; font-size: 18px; line-height: 1; color: #ccc; text-decoration: none; vertical-align: top; font-family: Arial, sans-serif;}
	nav.mobile .menu-toggle:hover {color: #fff;}
	
	/* MENU LIST STYLE */
	nav.mobile ul {list-style: none; font-weight: 300; margin:0; padding:0;}
	nav.mobile ul li {color: #999; font-size:15px; border-bottom: 1px solid #303030;}
	
	/* FIRST LEVEL */
	nav.mobile ul li a {
		color: #999;
		position: relative;
		display: block;
		font-size:15px;
		text-align:right;
		text-decoration: none;
		border-left:4px #333 solid;
		padding: 15px 35px 15px 20px;
		text-shadow: 1px 1px 1px rgba(0,0,0,0.3);
	}
	nav.mobile ul li a:hover {background:rgba(45,45,45,0.5); color: #fff; border-left:4px #018901 solid;}
	
	/* SECOND LEVEL */
	nav.mobile ul li li:last-child {border:none;}
	nav.mobile ul li li a {color: #ccc; background: #444; border-left:4px #444 solid; padding: 15px 10px 15px 15px;}
	nav.mobile ul li li a:hover {background:rgba(65,65,65,0.5);}
	
	/* THIRD LEVEL */
	nav.mobile ul li li li:last-child {border:none;}
	nav.mobile ul li li li a {color: #ccc; background: #555; border-left:4px #555 solid;}
	nav.mobile ul li li li a:hover {background:rgba(85,85,85,0.5);}
	
	.nav-footer {color:#777; position:relative; text-align:center; font-size:14px; line-height:14px; padding:15px 0;}
	
}

@media screen and (max-width: 567px) {
    
    .col-1-4 {
        width:100%;
    }
    .col-3-4 {
        width:100%;
    }
.cont-top {
    flex-wrap: wrap;
}
    
.show-menu-for-mobile {display: block;}
.hide-for-mobile {display:none;}
.hide {display:none;}

#headercontent {width:95%;}
.site-width {width:90%;}
#colorblock {padding:25px 0;}

.logo { width:70%;}
.logo-2 { width:25%;}
.manulogos { margin:25px auto; text-align:center; width:100%;}
.manulogos img {padding:5px 5px 10px; height:35px;}

.location {float:none; width:100%; font-size:14px;}
h2 {font-size:16px;}
.pagetext {float:none; width:100%; margin:0 auto;}
.pagetext img {display:none;}
.pageright {float:none; width:60%; margin:0 auto;}
.rightpage {float:none; width:100%; margin:0 auto;}

h1 {font-size:17px;}

.contactinfo {float:none; width:90%; margin:10px auto;}
.contactleft {float:none; width:100%;}
.contactright {flaot:none; width:100%;}
	
.leasing {float:none;width:100%;}
	
.homeinventory {float:none; width:100%;}	
.rentlogos img {height:50px;}
	

.divfooter {width:100%;}
/******************styles for the main site navigation during mobile display*************/
#navicon {
	float: left;
	font-size: 32px;
	font-size: 2em;
	text-decoration: none;
	position: relative;
	z-index: 99999999999999999;
	margin: 0.25rem 0 0 0.5rem;
	color:#fff;
}
#nav  {display:none;}
}

@media screen and (max-width: 320px) {
.show-menu-for-mobile {display: block;}
.hide-for-mobile {display:none;}
.hide {display:none;}

#headercontent {width:95%;}
.site-width {width:90%;}
#colorblock {padding:25px 0;}

.logo img {width:100%;}
.manulogos {margin:5px auto 0; text-align:center; width:100%;}
.manulogos img {padding:5px; height:8px;}

.location {float:none; width:100%; font-size:10px;}
h2 {font-size:16px;}
.pagetext {float:none; width:100%; margin:0 auto;}
.pagetext img {display:none;}
.pageright {float:none; width:75%; margin:0 auto;}
.rightpage {float:none; width:100%; margin:0 auto;}

h1 {font-size:18px;}

.contactinfo {float:none; width:98%; margin:10px auto;}
.contactleft {float:none; width:100%;}
.contactright {flaot:none; width:100%;}

p {font-size:12px;}

.leasing {float:none;width:100%; margin:0 auto;}
	
.homeinventory {float:none; width:100%;}			
.rentlogos {width:100%; margin:0 auto; text-align:center;}
.rentlogos img {width:75%; height:auto;}
.divfooter {width:100%;}

}
