#nav {
			width: 100%;
			position: relative;
			transition: all ease-in-out 25s;
		}

		#nav .mobile {
			display: none;
		}

		#nav>a {
			display: none;
		}

		#nav a {}

		#nav li a:hover,
		#nav li ul:not( :hover) li.active a {
			background-color: #202767;
			border-top: 3px solid #202767;
		}

		#nav .topmenu,
		#nav .bottommenu {
			width: 100%;
			float: left;
			position: relative;
			text-align: right;
		}

		#nav .topmenu {
			/*background-color: #FFF;*/
			height: 70px;
			padding: 15px 5% 0 5%;
			z-index: 1;
		}

		#nav .bottommenu {
			background-color: #FFF;
			padding: 10px 5%;
			border-bottom: 1px solid #ED0000;
		}

		#nav .bottommenu a,
		#nav .bottommenu span {
			float: left;
			width: 110px;
			text-align: center;
			-webkit-transition: background-position .1s ease-in;
			-moz-transition: background-position .1s ease-in;
			-o-transition: background-position .1s ease-in;
			transition: background-position .1s ease-in;
			font-size: 13px;
			font-weight: 100;
			color: #686D71;
			letter-spacing: 0.2em;
		}

		#nav .bottommenu a {
			margin: 0 0 0 10px;
		}

		.wrapit {
			float: right;
		}

		#nav .bottommenu a.fuso {}

		#nav .bottommenu a.fuso img {
			margin-top: 15px;
		}

		#nav .bottommenu a .light,
		#nav .bottommenu a .medium,
		#nav .bottommenu a .heavy,
		#nav .bottommenu a .busses,
		#nav .bottommenu a .canter,
		#nav .bottommenu a .construction,
		#nav .bottommenu a .prime {
			background-image: url(../images/menu-products.png);
			background-repeat: no-repeat;
			width: 100px;
			height: 44px;
			float: left;
		}

		#nav .bottommenu a .light {
			background-image: url(../images/pickup.png);
			margin-bottom: 8px;
		}

		#nav .bottommenu a .light.current {
			background-image: url(../images/pickup-1.png);
			margin-bottom: 8px;
		}

		#nav .bottommenu a:hover .light {
			background-image: url(../images/pickup-1.png);
		}

		#nav .bottommenu a .medium {
			background-image: url(../images/crossover.png);
			margin-bottom: 8px;
		}

		#nav .bottommenu a .medium.current {
			background-image: url(../images/crossover-1.png);
			margin-bottom: 8px;
		}

		#nav .bottommenu a:hover .medium {
			background-image: url(../images/crossover-1.png);
		}

		#nav .bottommenu a .heavy {
			background-image: url(../images/sedan.png);
			margin-bottom: 8px;
		}

		#nav .bottommenu a .heavy.current {
			background-image: url(../images/sedan-2.png);
			margin-bottom: 8px;
		}

		#nav .bottommenu a:hover .heavy {
			background-image: url(../images/sedan-2.png);
		}

		#nav .bottommenu a .busses {
			background-image: url(../images/suv.png);
			margin-bottom: 8px;
		}

		#nav .bottommenu a .busses.current {
			background-image: url(../images/suv-1.png);
			margin-bottom: 8px;
		}

		#nav .bottommenu a:hover .busses {
			background-image: url(../images/suv-1.png);
		}

		#nav .bottommenu a .canter {
			background-position: -400px 0px;
			margin-bottom: 8px;
		}

		#nav .bottommenu a:hover .canter {
			background-position: -400px -55px;
		}

		#nav .bottommenu a .construction {
			background-position: -500px 0px;
		}

		#nav .bottommenu a:hover .construction {
			background-position: -500px -55px;
		}

		#nav .bottommenu a .prime {
			background-position: -600px 0px;
		}

		#nav .bottommenu a:hover .prime {
			background-position: -600px -55px;
		}

		#nav .bottommenu h1 {
			width: auto;
			color: #686D71;
			font-size: 17px;
			margin: 25px 10% 0;
			letter-spacing: 0.5em;
		}
		
		#nav .bottommenu h2 {
			width: auto;
			color: #686D71;
			font-size: 17px;
			margin: 25px 10% 0;
			letter-spacing: 0.5em;
		}

		#nav .bottommenu a.menulogo {
			float: left;
			background-image: none;
			padding: 0;
			width: 130px;
			/*margin: -55px 0 0 0;*/
		}

		#nav .topmenu a,
		#nav .topmenu span {
			float: none;
			display: inline;
			color: #686D71;
			font-size: 13px;
			padding: 2px 10px;
			margin-left: -5px;
			letter-spacing: .1em;
		}

		#nav .bottommenu a:hover,
		#nav .topmenu a:hover {
			color: #ED0000;
			border-color: #ED0000;
		}

		#nav .topmenu .socialmedia a:hover {
			border-color: #ED0000;
		}

		#foo {
			display: none;
			width: 100%;
			float: left;
			background-color: #ED0000;
			padding: 0 7%;
			text-align: left;
			position: relative;
			z-index: 99999;
			background-image: url(../images/more-menu.jpg);
			-webkit-background-size: cover;
			-moz-background-size: cover;
			-o-background-size: cover;
			background-size: cover;
			background-position: right center;

			opacity: 1;
			-webkit-animation: display-none-transition 2s both;
			animation: display-none-transition 2s both;

			/*  -webkit-box-shadow: 1px 1px 2px 3px #666;
  -moz-box-shadow:    1px 1px 2px 3px #666;
  box-shadow:         1px 1px 2px 3px #666;   */
			border-bottom: 1px solid #ED0000;
		}

		@-webkit-keyframes display-none-transition {
			0% {
				opacity: 0;
			}
		}

		@keyframes display-none-transition {
			0% {
				opacity: 0;
			}
		}

		#nav a.current {
			color: #ED0000;
		}

		#nav .topmenu a.current {
			color: #ED0000;
		}

		#foo a {
			float: none;
			display: inline;
			color: white;
			font-size: 13px;
			margin: 0 10px;
			padding: 10px;
			float: left;
			width: 90%;
			border-bottom: 1px solid #ED0000;
		}

		#foo a:hover,
		#foo a.current {
			background: -moz-linear-gradient(left, rgba(0, 0, 0, 0.65) 0%, rgba(0, 0, 0, 0.07) 89%, rgba(0, 0, 0, 0) 100%);
			background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.65) 0%, rgba(0, 0, 0, 0.07) 89%, rgba(0, 0, 0, 0) 100%);
			background: linear-gradient(to right, rgba(0, 0, 0, 0.65) 0%, rgba(0, 0, 0, 0.07) 89%, rgba(0, 0, 0, 0) 100%);
			filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#a6000000', endColorstr='#00000000', GradientType=1);
			color: #FFCC00;
		}

		#foo .links,
		#foo .pic,
		#foo .copy {
			width: 35%;
			float: left;
			margin: 1%;
		}

		#foo .links {
			width: 21%;
			float: left;
			margin: 1%;
		}

		#foo .copy {
			margin-top: 50px;
			color: white;
		}

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

		@media screen and (max-width: 801px) {
			#nav .bottommenu a.menulogo {
				display: none;
			}

			#nav {
				position: absolute;
				top: 0;
				left: 0;
				z-index: 999;
			}

			#nav .menuright li {
				width: 100%;
			}

			#nav li {
				width: 100%;
				background: #3A61B0;
			}

			#nav>a,
			#nav li a {
				text-align: left;
				border: none;
			}

			#nav>a.current,
			#nav li a.current,
			#nav>a:hover,
			#nav li a:hover {
				text-align: left;
				border: none;
			}

			#nav:not( :target)>a:first-of-type,
			#nav:target>a:last-of-type {
				display: block;
			}


			/* first level */

			#nav>ul {
				height: auto;
				display: none;
				position: relative;
				left: auto;
				right: auto;
				width: 100%;
				float: left;
			}

			#nav:target>ul {
				display: block;
			}

			/* second level */

			#nav li ul {
				position: static;
				padding: 0;
				/* 20 */
				padding-top: 0;
				padding-left: 20px;
				background-color: #202767;
			}

			#nav li ul li a {
				background-image: url(../images/menu-arrow.png);
				background-repeat: no-repeat;
				background-position: left center;
				padding-left: 20px;
				border: none;
			}

			#nav li ul li a.current {
				background-color: #5EC1DE;
				border: none;
			}

			#foo {
				display: block;
				background-color: #000;
				padding: 0;
				z-index: 10;
				background-image: none;
				border: none;
				text-shadow: none;
				-moz-text-shadow: none;
				-webkit-text-shadow: none;
				-webkit-animation: none;
				animation: none;
			}

			#foo .pic,
			#foo .copy,
			#nav .topmenu a.hidelink {
				display: none;
			}

			#foo .links {
				width: 100%;
			}

			#nav .topmenu,
			#nav .bottommenu {
				padding: 0;
				margin: 0;
				text-align: left;
				height: auto;
				background: black;
				border: none;
				
			}
			
			#nav .topmenu {
			   padding-top: 4em; 
			}

			#nav .topmenu a.home {
				background-image: none;
				width: 80%;
				margin: 0 10%;
				float: left;
				padding: 15px 30px 25px 30px;
			}

			#nav .topmenu a.home span {
				display: block;
			}

			#nav .topmenu a,
			#nav .bottommenu a,
			#foo a {
				width: 100%;
				float: left;
				font-size: 13px;
				color: white;
				margin: 0;
				padding: 10px 30px;
				background-image: none;
				border-bottom: 1px solid #ED0000;
				width: 80%;
				margin: 0 10%;
			}

			#nav .topmenu a:hover,
			#nav .bottommenu a:hover,
			#foo a:hover,
			#foo a.current {
				/*background-color: #ED0000;*/
				color: white;
				background-image: none;
			}

			#nav .topmenu .socialmedia a,
			.social-media a {
				display: none;
			}

			.menubtn {
				width: 24px;
				float: right;
				height: 24px;
				position: absolute;
				top: 10px;
				right: 10px;
				z-index: 9999;
				color: white;
				font-size: 28px;
				font-weight: 900;
			}

			#nav .bottommenu {
				padding-bottom: 20px;
			}

			.menubtn:hover {
				color: #ED0000;
				background-color: transparent;
			}
		}
		
		
		
		
		
		
		
		
		
		
		
		
		
		
		
		@media only screen and (min-width: 802px) {
		    
    		.menulogo img {
    		    float:none;
    		    width: auto;
    		    height: 120px;
    		    margin: 0 0 -20px 0;
    		}
    		
    		#nav .topmenu {
    		    height: 50px;
    		}
    		
    		
    		#nav .topmenu a, #nav .topmenu span {
                font-size: 10px;
                padding: 2px 6px;
            }
    		
    		#nav .bottommenu {
    		    display: flex;
    			justify-content: flex-start;
    			align-items: center;
    			background-color: transparent;
    			padding: 40px 5% 40px;
    		}
    		
    		#nav .bottommenu .logo {
    		    width: 35%;
    		}
    		
    		#nav .bottommenu .logo img {
    		    height: 80px;
    		}
    		
    		#nav .bottommenu a.menulogo {
    		    width: 30%;
    		}
    		
    		#nav .bottommenu .wrapit {
    		    width: 35%;
    		    display: flex;
    		    justify-content: flex-end;
    		    flex-direction: column;
    		}
    		
    		#nav .bottommenu .wrapit .topmenu {
    		    padding: 0;
    		}
    		
    		#nav .bottommenu .wrapit .vehi-classification {
    		    display: flex;
    		    justify-content: flex-end;
    		    align-items: center;
    		}
    		
    		#nav .bottommenu h1 {
                font-size: 12px;
                letter-spacing: 0.3em;
                margin: 0 20px 0 0;
            }
            
            #nav .bottommenu h2 {
                font-size: 12px;
                letter-spacing: 0.3em;
                margin: 0 20px 0 0;
            }
            
            #nav .bottommenu a {
                width: 80px;
            }
            
            #nav .bottommenu a .medium, #nav .bottommenu a .busses, #nav .bottommenu a .light {
                background-size: contain;
                width: 70px;
                height: 32px;
            }
            
            #nav .bottommenu span {
                font-size: 10px;
                width: 100%;
            }
		}
        
        @media only screen and (min-width: 802px) and (max-width: 1010px) {
            #nav .bottommenu .logo {
                width: 25%;
            }
            
            #nav .bottommenu a.menulogo {
                width: 25%;
            }
            
            #nav .bottommenu .wrapit {
                width: 50%;
                
            }
            
            #nav .bottommenu .logo img {
                height: 60px;
            }
            
            .menulogo img {
                height: 103px;
            }
        }