@import url(http://fonts.googleapis.com/css?family=Titillium+Web:400,700,900,600) (min-width:0px);
* {
  box-sizing: border-box; 
}
.about div {
  box-sizing:content-box;
}

html, body {
	max-width:100%;
	overflow-x:hidden;
}


body {
    margin:0px; 
    font-family: "Open Sans", "Segoe UI", Helvetica, Arial, Sans-serif;
    font-size:14px; 
    min-width:320px;
}

p, li {
    line-height:1.7em;
    font-size:1.0em
}

aside, nav, ul, li, p, div, h1, h2, h3, h4, a {
    text-align:left;
}

.years aside strong,
h1, h2, h3, h4, h5 {
    font-weight:400;
}

h1 {
    padding-top:110px;
    margin-top:-110px;
    font-size:1.8em;

}
.wsx {
    background: url(images/AssetFamily.jpg) no-repeat bottom right;
    background-size: 65%     auto;
	padding-bottom:0px;
}
.feature h1 {
     width:79.5%   ;
	 font-size:1.5em;
}

.feature.third {
	padding-bottom:0px;
}

.feature.third p {
	max-width:90%;
}
.feature h1 span {
     font-size:.8em;   
    display:block;
    margin-bottom:1.0em;
    font-weight:300;
}

nav.primary a img {
	width:155px; 
}
.feature .secondary {
    position:relative;            
    min-width:270px;
}

.feature .secondary a {
     position:absolute;
     width:65px;
     background:url(images/PDF.png) no-repeat -2px 0px ;
     background-size:60px 60px;
    
     padding:5px;
     border:1px solid transparent;
     transition: .4s ease;
     padding-top:60px;
     color:#ffc425!important;
     vertical-align: bottom;
     displaY:block;
     top:10px;

     font-size:.73em;
     right:10px; 
	 background:url(images/PDF_IE7_8.png) no-repeat -2px 0px \9;
}
	 /* \9 is a Hack to only target IE7/IE8/IE9 http://stackoverflow.com/questions/8004765/css-9-in-width-property */
.feature ul {
	background:white\9;
	padding:10px\9; 
}

 
h2 {
	 font-size:1.5em;
}
 


h2 span {
    font-size:.6em;
    display:block;
}

a {
    text-decoration:none;
    padding: 2px 4px;
}
a:hover {
    text-decoration:underline;
}

a.learnmore {
    color:#3c3c3c!important;
    font-weight:200;
    text-transform:uppercase;
    background:#ffc425;
    border:1px solid transparent;
    font-size:1.1em;
    text-align:center;
    max-width:9em;
    padding:0.6em 1em;  
    display:inline-block;
    margin-top:15px;
    margin-bottom:25px;
    transition:color .4s ease, background .4s ease;
}
.feature .secondary a:hover {
    
     color:white!important;
     border: 1px solid white;
}
a.learnmore:focus,
a.learnmore:hover { 
     color:white!important;
     border: 1px solid white;
     text-decoration:none;
    background:#005596;
}


footer a {
    display:block;
    color:white;          
    font-size:38px;
}
footer .half a {
    font-size:14px;
}
div.secondary, footer, aside, section   {
    padding:20px;
}
.half, .third, .twoThirds, aside {
    display:inline-block;
    zoom:1;
    *display:inline;            
}

img {
     max-width:100%;

}

aside,
.third {
    width:30%; 
    vertical-align:top;
}

.wsx   {
    text-align:left;
	
}
.wsx .about {
    text-align:center;
}
.wsx img {
    vertical-align:middle;
}

.twoThirds {
    width:60%; 
}

.about h2 {
	margin-bottom:5px;
}
.about p {
	margin-top:0px;
}
.half {
    width:46%; 
    max-width:46%;
}		

nav,
footer,
header nav.secondary div,
section {
    max-width:1200px;
    margin:auto;
    min-width:780px;
} 
nav, nav ul {
 transition:height .4s ease, max-height .4s ease;   
}
 h1#solutions,
h1#about {
     color:#005596;
    font-size:2.5em;
}
 
nav a.active {
    border-top:2px solid #005596
}

nav ul {
    width:100%;
    margin:0px;
    padding:0px;
    height:100%;
    vertical-align:  middle;
}

nav.secondary .login a { 
    margin-left:.5em;
}

.bg.truck {
     background:url(images/Asset_Truck.jpg) no-repeat top right;
    background-size:cover; 
}

.bg.forest {
     background:url(images/Asset_Forest.jpg) no-repeat top right;
    background-size:cover; 
}

.bg.logs {
     background:url(images/Asset_Logs.jpg) no-repeat top right;
    background-size:cover; 
}

header nav.secondary {
    max-width:100%;
    margin:0px;
    font-size:.85em;
} 
nav.secondary ul {
    height:auto;
}

nav.secondary .logo a {
     border-right:1px solid white;  
     background:#005596;
}

header nav li { 
    display:table-cell;
    vertical-align:middle;
    height:100%;
    float:right;
  height: 93px;
  line-height: 73px;        
}

nav .mobileHide.secure img{
    vertical-align: middle;
    margin-bottom:-16px;
    margin-left:20px;
}

nav.secondary li {
    line-height:1.8em;
    height:auto;
}


nav a {
    padding:10px 10px;
    display:block;			
    font-size:1.1em;
    color:black;
}


section a:hover,
section a:visited,
section a {
	color:#005596;
}



nav .login a:visited,
nav .login a {
    font-size:1.1em;
    color:#005596!important;
    margin-left:.5em;
}


header .logo {
    float:left;
}

 
.secondary a {
    color:white;
    clear:both;
}

footer,
.secondary,
nav.secondary div
aside {
    background:#005596;
    color:white; 
}

div.light {

    color:#005596; 
    font-size:18px;
    padding:20px 20px;
}

.backToTop { 
    text-decoration:none;
    font-size:12px;
    display:block; 
    margin:10px;
    margin-left:0px;
    color:#005596;
}	
.backToTop:visited {
     color:#005596;   
}

.backToTop:hover {
    text-decoration:none;

}
.backToTop  span {
    padding-bottom:20px;
    margin-bottom:-20px;
    max-width:43px;
    position:relative;
	 top:-1px;
     border-bottom:1px solid #005596;   
} 
.backToTop span {
    font-size:24px;
    display:block;
    line-height:22px;
    text-indent:-2px;
    text-decoration:none!important;
}

section,
.solutions .half,
.solutions .half h2,
.solutions .half p{
    text-align:center;
    vertical-align: top;
}

section {
    padding:50px 10px;    
		 
}

section div {
    padding: 25px 15px 25px 15px
}

.solutions .half a {
    margin-left:auto;
    margin-right:auto;
}

.logos {
    width:98%;
    margin:2%;
    display:block;
    padding:0px;
    text-align:center;
    margin:auto;
}

.logos li {
    display:inline-block;
    zoom:1;
    *display:inline;
    background:#f0f0f0;

    margin:1%;
    padding:0px;
    width:200px;
    height: 200px; 
    visibility: middle;
    text-align:center;
    position:relative;
}
.logos li a { 
		text-align:center;
    width:100%;
    height:100%;
        bottom:25%;
    display:block;
    
    visibility: middle;
}
.logos li a:hover {
    box-shadow:0px 2px 6px rgba(0,0,0,.250);
}
.logos li a[href*="javascript"]:hover {
    box-shadow:none;
	cursor:default;
}
.logos li.trimble {
    background:#005596;
} 
.fader, .years, footer {
    min-height:450px; 
    max-width:1200px;
     margin:auto;
}
.years {
    position:relative;
    background:lightgrey;
    margin-top:80px;
    background:url(images/LogBG.jpg) no-repeat top right ;
}
.years aside,
.years div {
    position:absolute;            
}

.years div {
     left:5%;
     top:15%;
     max-width:450px;
     font-size:24px;
     bottom:15%;
}

.years div strong {
     font-size:64px;   	 
}
.years aside strong {
	font-size:1.7em;
}	

.years aside {
    right:5%;
    top:20%;
    min-width:300px;
    bottom:15%;
    padding:25px;
    vertical-align:middle;
}

.fader {
    background:#f0f0f0; 
    position:relative;
    padding:0px;
    overflow:hidden;
    height:450px; 
}


nav.legal {
	display:block;
	margin:0px auto; 
	display:border-box;
	padding:10px;
	background:#064473!important;
}
nav.legal ul {
		
}
.legal a,
.legal li{
	display:inline-block;
	color:white!important;
	list-style:none;
	font-size:12px;	 
	opacity:.9
}


.fader .text {
   /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0.65+0,0+100;Neutral+Density */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjY1Ii8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMCIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(left,  rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0.65)), color-stop(100%,rgba(0,0,0,0))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(left,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(left,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(left,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); /* IE10+ */
background: linear-gradient(to right,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=1 ); /* IE6-8 */
z-index:50;
}

.fader strong {
    top:40%;
    bottom:60%;
    right:50%;
    display:block;
    width:77%;
    left:10%;
    text-align:left;
    position:relative;
	top:41%;
	left:11%;
    font-size:24px;
    color:white;
    font-weight:400;
    z-index:50;
    max-width:390px;
filter: dropshadow(color=#3c3c3c, offx=1, offy=1);
    text-shadow:0px 1px 5px black;
    zoom:1;
}	

.fader strong span {
    color:#ffc425; 
} 
.fader div {
    position:absolute;
    width:100%;
    height:100%;


}  
footer {
    vertical-align: top; 
    padding:150px 20px 250px 20px;    
}
footer a {
    font-weight:300 ;   
}
footer a.tel {
    font-weight:400;
}
.clearfix { 
    clear:both;
    font-size:0px;
    visibility:hidden;
    color:transparent;
} 

.mobileShow {
     display: none;   
}

nav.primary {
     box-shadow:0px 4px 4px rgba(0,0,0,.1);
}

nav.primary.mobile {  
    left:0px;
    background:white;
    z-index:100;
    right:0px;
    height:60px;
    top:40px;
	   min-width: 320px;
}
nav.primary.mobile.fixed {
    position:fixed;
    top:0px;
}
nav.primary.mobile.top {
     top:0px;   
}

nav.primary.mobile a  {
     border-bottom:5px solid #ffffff;   
    transition: border-bottom .4s ease;
     margin-bottom:-10px;
}
nav.primary.mobile .active a {
     border-bottom:5px solid #005596;   
}

nav.primary.mobile .active a {
     border-bottom:5px solid #005596;
     opacity:.9
}

nav.primary.mobile .secure {
     margin-top:-10px;   
}


nav.secondary .secure {
     margin-top:10px;   
}

nav.primary.mobile a, 
nav.primary.mobile li,
nav.primary.mobile ul {
    height:57px;   
    max-height:57px;
    padding:0px;
    margin:0px;
    margin-right:8px;
    line-height:57px;
    display:inline-block;

}

nav.primary.mobile .logo a {
     width:120px;
     height:40px;
     background:#ffffff;   
     border-bottom:5px solid #ffffff;
} 
@media screen and  (max-width:361px) {
    nav a {
		font-size:0.9em;
		padding:7px;
		
	}
 
 
} 

@media screen and (max-width:800px) {
    footer,
    section,
    aside, 
    .twoThirds,
    .third,
    .half,
    header nav.secondary div,
    header nav {
        width:100%;
        min-width:100%; 
    }
    section > * {
        display:block;
        width:100%;
        min-width:100%;
    } 

    section div {
         padding-top:0px;
         padding-bottom:0px;
    }
	
	nav .mobileHide.secure img{ 
		margin-left:0px;
	}

    .wsx {
        padding-bottom:250px;
        background-size:60%;
        background-position: 100% bottom;
    }                        

    .years aside,
    .years div {
        position:relative;
        top:0px;
        left:0px;
        right:0px;
        bottom:0px;
    }

    .years *  {
         text-align:center;   
    }

    .logos li {
        width: 90px;
        height:90px;
        margin:2%;
    }
	.logos li a {
		padding:0px;
		text-align:center;
	}	
    
    /*
    header nav .logo {
        display:block;
        width:100%;
    }

    header nav li {
        display:inline-block;
        zoom:1;
        *display:inline;
        clear:both;
        width:48%;
        float:none;
        text-align:center;
    }	

    header nav li a {
    text-align:center;
    }
    */
}
footer  {
     position:relative;   
}

address {
     margin-bottom:20px;   
     font-style:normal;
}

footer .assetLogo {
     position:absolute;
     bottom:5%;
     left:5%;
}

footer .trimbleLogo {
     position:absolute;
     bottom:9%;
     right:5%; 
} 

@media screen and (min-width:430px) {
	.feature .secondary {
		min-width: 370px;
	}
	
}

@media screen and (max-width:655px) {  
    footer .trimbleLogo,
    footer .assetLogo {
         display:block;
         position:relative;
         top:auto;
         left:auto;
         right:auto;
         bottom:auto; 
		 width:30%;
    }
    footer .third {
         padding-left:0px;   
    }
    nav.secondary {
         background:#ffffff;  
         transition:background .4s ease;
         border-bottom:1px solid #f0f0f0;
    }
    nav.secondary .logo a { 
        border-right:1px solid #005596;
    }
    .mobileHide {
        display:none!important;
    }
    .mobileShow {
        display:inline-block;
        zoom:1;  
    }
    .wsx {
        padding-bottom:250px;
        background-size:60%;
        background-position: center bottom;
    }       
}

@media screen and (max-width:455px) {     
    nav.primary.mobile .logo {
          width:111px!important;
          display:block;
          max-width:500%;
    }
	
	nav.primary.mobile .logo img {
          width:100px!important;
         margin-top:5px;
          display:block;
          max-width:500%;
    }
	
	   .wsx {
        background-size:90%;
    }  
	
	footer a {
		font-size:28px;
	}
	.legal a,
	.legal li{
		display:block;
		width:100%;
	}
}


@media screen and (max-width:395px) {     
   
p {
	max-width:94%;
}
    nav li.secure {
         display:none!important;   
    }
}