/* Stylesheet for NorthernValleyMachine.com */
	
html {
	margin 				:0px;
	padding 			:0px;
	color				:black;
	font-family 		:Trebuchet MS, Arial, Verdana, Sans Serif;
	background-color	:gray;
}

#container2 {
	position			:center;
	background-color	:white;
}

#Facebook {
	position			:center;
}

#separator {
	height 				:15px;
	width				:1023px; 
	margin 				:0px;
	padding				:0px;
	float				:left; 
	top					:0px;
	background			:url("../images/separator.jpg"); 
	position			:relative;
}

#content {
	background-color	:white;
	padding				:0px;
	margin				:0px;
	vertical-align		:top;
	left				:0px;
	top					:93px;
	width				:750px;
	position			:relative;
}

#navbutton {
	background 			:#444444;
	color 				:white;
	font-weight 		:bold;
	text-align 			:center;
	width 				:185px; 
	margin 				:0px;
	padding 			:0px;
	float				:left;
	left				:0px;
	top					:0px; 
	right				:0px;
	position 			:relative; 
	text-transform		:uppercase;
	font-family			:arial, monospace;
}


#ticker {
	background 			:yellow;
	width 				:1023px; 
	margin 				:0px;
}

#subnavbar {
	background 			:white;
	color 				:black;
	width 				:185px; 
	margin 				:0px;
	padding 			:0px;
	float				:left;
	left				:825px;
	top					:340px;
	*top				:380px;
	_top				:380px;
	right				:0px;
	position 			:absolute; 
}

#pagetitle {
	background 			:#444444;
	color 				:white;
	font-weight 		:bold; 
	text-align 			:center; 
	width 				:623px; 
	margin 				:0px;
	padding 			:0px;
	float				:left;
	left				:400px;
	top					:35px; 
	right				:0px;
	position 			:absolute; 
}	

#mojo {
	width 				:975px; 
	margin 				:0px;
	margin-bottom		:100px;
	padding 			:0px;
	float				:left;
	left				:25px;
	top					:50px;  
	right				:0px; 
	position 			:relative;  
}

#rfq {
	width 				:1023px; 
	margin 				:170px;
	margin-bottom		:100px;
	padding 			:0px;
	float				:left;
	left				:25px;
	top					:0px;  
	right				:0px; 
	position 			:center;  
}

#automation {
	width 				:780px; 
	margin 				:0px;
	margin-bottom		:100px;
	padding 			:0px;
	float				:left;
	left				:25px;
	top					:50px;  
	right				:0px; 
	position 			:relative;  
}

#application {
	background-color	:white;
	width 				:550px; 
	margin 				:50px;
	margin-bottom		:0px;
	padding 			:0px;
	float				:center;
	left				:182px;
	top					:0px;  
	right				:0px; 
	position 			:relative;  
}



A {
	color 				:#444444; 
	text-decoration 	:none;
}

A:link {
	color 				:444444;
	text-decoration 	:none;
}

A:visited {
	color 				:444444;
	text-decoration 	:none;
}

A:hover {
	color 				:#666666;
	text-decoration 	:none;
}

A:focus {
	color 				:#333333;
	text-decoration 	:none;
}

A:active {
	color 				:#333333;
	text-decoration 	:none;
}

img.floatRight { 
	float				:right; 
	margin				:0px; 
} 

img.floatLeft { 
	float				:left;
	margin				:0px; 
} 

img.absRight { 
	right				:0px; 
} 

img.absLeft { 	
	left				:0px; 
} 

img.logo { 
	margin-bottom		:5px; 
} 

img.botnav { 
	margin-bottom		:0px; 
} 

img.career {
	border				:1px solid black;
}

.center 	{
	text-align			:center;
}

.right 	{
	text-align			:right;
}

.machdesc 	{
	text-align			:justify;
	width				:500px;
}

.machdescC 	{
	text-align			:center;
	width				:500px;
}

.machdescL 	{
	text-align			:left;
	width				:500px;
}

.left 		{
	text-align			:left;
}

table.mailform  {
	border 				:0px none;
	width 				:300px;
}

table.equip  	{
	border 				:1px solid gray;
	width 				:975px;
}

table.mojo  	{
	border 				:1px solid gray;
	width 				:450px;
}

td.equip  	{
	border 				:1px solid gray;
	width 				:20%;
	text-align 			:center;
}

table.brochure  	{
	width 				:800px;
}

td.brochure {
	width 				:20%;
	text-align 			:center;
}

img {
	border 				:0px none;
}

table 		{
	width 				:95%;
}

td.label 	{
	text-align			:left;
	width 				:100px;
}

td.field 	{
	text-align			:left;
	width 				:200px;
}

td.both 	{
	text-align			:left;
	width 				:300px;
}

table.Specs	{
	border 				:1px solid gray;
	font-size 			:smaller;
	width 				:600px;
}

tr.HSpecs	{
	border 				:0px solid gray;
	background-color 	:gray;
	text-align 			:center;
}
tr.mojoh	{
	border 				:1px solid gray;
	background-color 	:gray;
	text-align 			:center;
}
tr.mojob	{
	border 				:1px solid gray;
}

td.HSpecs	{
	border 				:0px solid gray;
	background-color 	:gray;
	text-align 			:center;
}

tr.DSpecs	{
	border 				:1px solid gray;
}

td.DSColL	{
	border 				:0px solid white;
	text-align 			:left;
}

td.DSColR	{
	border 				:0px solid white;
	text-align 			:right;
}






.DocSecTitle 	{
	background			:#000000;
	color				:#FFFFFF;
	font-weight			:bold;
	width				:549px;
	float				:left;
	margin-bottom		:5px;
}

.FldDesc 	{
	width				:175px;
	float				:left;
	margin-bottom		:5px;
}

.Fld 		{
	width				:285px;
	float				:right;
	margin-bottom		:5px;
}

.LngFldDesc 	{
	width				:350px;
	float				:left;
	margin-bottom		:5px;
}

.LngFld {
	width				:150px;
	float				:right;
	margin-bottom		:5px;
}

.DescFld {
	width				:549px;
	float				:right;
	margin-bottom		:5px;
}

.DocCert {
	width				:540px;
	float				:left;
	font-size			:medium;
}

#spaceB  {
    height				:1px;  
}

ul.level1 {
	list-style			:none;
    text-indent			:10px;
	font-weight			:bold;
}

ul.level2 {
    list-style			:disc;
	text-indent			:20px;
	font-weight			:normal;
}

ul.level3 {
    list-style			:square;
	text-indent			:40px;
	font-weight			:normal;
}

ul.desc {
	list-style-type		:none;
}

A.buttonA{
	text-align			:center;
	font-weight 		:bold;	
	height				:30px;
	width				:76.5px;
	padding				:0;
	margin				:0;
	line-height			:30px;
/*	box-shadow			:inset 0px 0px 0px #E1E1E1;
	-moz-box-shadow		:inset 0px 0px 0px #E1E1E1;
	-webkit-box-shadow	:inset 0px 0px 0px #E1E1E1;
/*	background			:-moz-linear-gradient(top, #C0BEBF 0%, #A4A2A3 50%, #7B7B7B 51%, #444444 100%);
	background			:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#C0BEBF), color-stop(50%,#A4A2A3), color-stop(51%,#7B7B7B), color-stop(100%,#444444));
	filter				:progid:DXImageTransform.Microsoft.gradient(startColorstr='#BDC1C0', endColorstr='#535959');   
	-ms-filter			:"progid:DXImageTransform.Microsoft.gradient(startColorstr='#BDC1C0', endColorstr='#535959')"; */
	background			:url(/images/button.png);
	border				:0px solid #A2A4A4;
	cursor				:pointer;
	color				:white;
	font-size			:12px;
	letter-spacing		:0px;
/*	text-shadow			:#E2E2E2 0px 1px 0, #464848 0 -1px 0;
	-moz-text-shadow	:#E2E2E2 0px 1px 0, #464848 0 -1px 0;
	-webkit-text-shadow	:#E2E2E2 0px 1px 0, #464848 0 -1px 0;*/
	font-family			:helvetica;
	display				:block;
	float				:left;
}
	
A.buttonA:visited{
	background			:url(/images/button.png);
/*	background			:-moz-linear-gradient(top, #C0BEBF 0%, #A4A2A3 50%, #7B7B7B 51%, #444444 100%);
	background			:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#C0BEBF), color-stop(50%,#A4A2A3), color-stop(51%,#7B7B7B), color-stop(100%,#444444));
	filter				:progid:DXImageTransform.Microsoft.gradient(startColorstr='#BDC1C0', endColorstr='#535959');   
	-ms-filter			:"progid:DXImageTransform.Microsoft.gradient(startColorstr='#BDC1C0', endColorstr='#535959')"; */
	}
	
A.buttonA:hover{
/*	background			:-moz-linear-gradient(top, #666666 0%, #A4A2A3 51%, #7B7B7B 52%, #111111 100%);
	background			:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#666666), color-stop(51%,#A4A2A3), color-stop(52%,#7B7B7B), color-stop(100%,#111111));
	filter				:progid:DXImageTransform.Microsoft.gradient(startColorstr='#888888', endColorstr='#222222');  
	-ms-filter			:"progid:DXImageTransform.Microsoft.gradient(startColorstr='#888888', endColorstr='#222222')"; */
	background			:url(/images/buttonhover.png);
	}

A.buttonA:active{
	background			:url(/images/buttonclicked.png);
/*	background			:-moz-linear-gradient(top, #95d3d4 0%, #4c9da0 51%, #318185 52%, #226b70 100%);
	background			:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#95d3d4), color-stop(51%,#4c9da0), color-stop(52%,#318185), color-stop(100%,#226b70));
	filter				:progid:DXImageTransform.Microsoft.gradient(startColorstr='#226b70', endColorstr='#95d3d4');  
	-ms-filter			:"progid:DXImageTransform.Microsoft.gradient(startColorstr='#226b70', endColorstr='#95d3d4')"; */
	box-shadow			:inset 0px 0px 15px #464848;
	-moz-box-shadow		:inset 0px 0px 15px #464848;
	-webkit-box-shadow	:inset 0px 0px 15px #464848;
	border				:0px solid #464848;
	line-height			:30px !important;
}
	
A.buttonB{
	text-align			:center;
	height				:30px;
	width				:185px;
	font-weight 		:bold;
	padding				:0;
	margin				:0;
	line-height			:30px;
/*	box-shadow			:inset 0px 0px 0px #E1E1E1;
	-moz-box-shadow		:inset 0px 0px 0px #E1E1E1;
	-webkit-box-shadow	:inset 0px 0px 0px #E1E1E1;
/*	background			:-moz-linear-gradient(top, #C0BEBF 0%, #A4A2A3 50%, #7B7B7B 51%, #444444 100%);
	background			:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#C0BEBF), color-stop(50%,#A4A2A3), color-stop(51%,#7B7B7B), color-stop(100%,#444444));
	filter				:progid:DXImageTransform.Microsoft.gradient(startColorstr='#BDC1C0', endColorstr='#535959');   
	-ms-filter			:"progid:DXImageTransform.Microsoft.gradient(startColorstr='#BDC1C0', endColorstr='#535959')"; */
	background			:url(/images/button.png);
	border				:0px solid #A2A4A4;
	cursor				:pointer;
	color				:white;
	font-size			:12px;
	letter-spacing		:0px;
/*	text-shadow			:#E2E2E2 0px 1px 0, #464848 0 -1px 0;
	-moz-text-shadow	:#E2E2E2 0px 1px 0, #464848 0 -1px 0;
	-webkit-text-shadow	:#E2E2E2 0px 1px 0, #464848 0 -1px 0;*/
	font-family			:helvetica;
	display				:block;
	float				:left;
	}
	
A.buttonB:visited{
	background			:url(/images/button.png);
/*	background			:-moz-linear-gradient(top, #C0BEBF 0%, #A4A2A3 50%, #7B7B7B 51%, #444444 100%);
	background			:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#C0BEBF), color-stop(50%,#A4A2A3), color-stop(51%,#7B7B7B), color-stop(100%,#444444));
	filter				:progid:DXImageTransform.Microsoft.gradient(startColorstr='#BDC1C0', endColorstr='#535959');   
	-ms-filter			:"progid:DXImageTransform.Microsoft.gradient(startColorstr='#BDC1C0', endColorstr='#535959')"; */
	}
	
A.buttonB:hover{
/*	background			:-moz-linear-gradient(top, #666666 0%, #A4A2A3 51%, #7B7B7B 52%, #111111 100%);
	background			:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#666666), color-stop(51%,#A4A2A3), color-stop(52%,#7B7B7B), color-stop(100%,#111111));
	filter				:progid:DXImageTransform.Microsoft.gradient(startColorstr='#888888', endColorstr='#222222');  
	-ms-filter			:"progid:DXImageTransform.Microsoft.gradient(startColorstr='#888888', endColorstr='#222222')"; */
	background			:url(/images/buttonhover.png);
	}

A.buttonB:active{
	background			:url(/images/buttonclicked.png);
/*	background			:-moz-linear-gradient(top, #95d3d4 0%, #4c9da0 51%, #318185 52%, #226b70 100%);
	background			:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#95d3d4), color-stop(51%,#4c9da0), color-stop(52%,#318185), color-stop(100%,#226b70));
	filter				:progid:DXImageTransform.Microsoft.gradient(startColorstr='#226b70', endColorstr='#95d3d4');  
	-ms-filter			:"progid:DXImageTransform.Microsoft.gradient(startColorstr='#226b70', endColorstr='#95d3d4')"; */
	box-shadow			:inset 0px 0px 15px #464848;
	-moz-box-shadow		:inset 0px 0px 15px #464848;
	-webkit-box-shadow	:inset 0px 0px 15px #464848;
	border				:0px solid #464848;
	line-height			:30px !important;
	}	






/******************************************************************************************************************************************************************************/
    /* John's Edits for reactivity */

@media only screen and (min-width: 1000px) {
	#header.stuck{
		background: unset!important;
		position:fixed!important;
		align-self: center!important;
		height: 50px!important;
		top: 0px!important;
		width: fit-content!important;
	}
	#header.stuck #lgpagetitle{
		background: unset!important;
		font-size: 30px;
		width: unset!important;
		align-items: center;
	}
	#header.stuck .logoButton{
		width: unset!important;
		height: 50px;
		padding: 0px;
		margin: 0px 0px 0px 5px!important;
	}#header.stuck img{
		height: 100%;
		width: unset!important;
	}
	nav.stuck .navbar{
		background: linear-gradient(rgb(91, 91, 91),rgba(203, 203, 203, 0.9))!important;
		display: block!important;
		position: fixed!important;
		top: 0px;
		left: 0px;
	}
	nav.stuck .navButton{
		display: none!important;
	}
	nav.stuck .mobileNav{
		display: block !important;
		float: right!important;
		margin: 0px 5px 0px 0px!important;
	}
	nav.stuck .navSpacer{
		display: block!important;
	}
	nav.stuck .sentinel{
		display: block!important;
		position: unset;
	}
}

@media only screen and (max-width: 1000px) {
	.subNavButton{
		font-size: 12px!important;
	}
	#header.reactiveNav{
        background: unset!important;
        position:fixed!important;
        align-self: center!important;
        height: 50px!important;
		top: 0px!important;
		width: 80%!important;
	}
	#header.reactiveNav #lgpagetitle{
        background: unset!important;
        font-size: unset!important;
        /* width: unset!important; */
		max-height: 40px;
	}
	#header.reactiveNav .logoButton{
        width: unset!important;
        height: 50px;
        padding: 0px;
        margin: 0px 0px 0px 5px!important;
	}#header.reactiveNav img{
        height: 100%;
        width: unset!important;
	}
	nav.reactiveNav .navbar{
		background: linear-gradient(rgb(91, 91, 91),rgba(203, 203, 203, 0.9))!important;
        display: block!important;
		position: fixed!important;
		top: 0px;
		left: 0px;
	}
	nav.reactiveNav .navButton{
        display: none!important;
	}
	nav.reactiveNav .mobileNav{
        display: block !important;
        float: right!important;
        margin: 0px 5px 0px 0px!important;
	}

	.navSpacer{
		display: block!important;
	}
    .sentinel{
        top: -1000px!important;
	}
	.halfspan{
		width: 90%!important;
		margin: 2%!important;
	}
	.threequarterspan, .fourfifthsspan, .seveneigthsspan{
		width: 96%!important;
		padding: 0px!important;
		margin: 2%!important;
	}
	.quarterspan{
		width: 50%!important;
	}
	.flex_row{
		grid-template-columns: repeat(auto-fill, minmax(31%, 1fr))!important;
	}
	
	.wfu{
		grid-template-columns: unset!important;
		display: block!important;
	}
	.wfu .imgwrap{
		margin-bottom: 2%!important;
	}

	.s5{
		width: 90%!important
	}
	.s6{/* name, address, email */
		width:70%!important;
	}.captcha{
		width:50%!important;
	}
	.s4{/* city */
		width:30%!important;
	}
	.s3{/* phone */
		width:15%!important;
	}
	.s2{/* zip */
		width:9%!important;
	}
	.s1{/* state */
		width:6%!important;
	}
	.s7{/* message */
		width: 77%!important;
		height: -webkit-fill-available;

	}
	ul.level1{
		text-indent: 1%;
	}
}
@media only screen and (max-width: 700px) {
	.quarterspan{
		width: 75%!important;
	}

	.s6{
		width:100%!important;
	}
	.captcha{
		width:70%!important;
	}
	.s4{
		width:40%!important;
	}
	.s3{
		width:30%!important;
	}
	.s2{
		width:18%!important;
	}
	.s1{
		width:12%!important;
	}
	.s7{
		width: 100%!important;
		height: -webkit-fill-available;

	}
	.flex_row{
		grid-template-columns: repeat(auto-fill, minmax(48%, 1fr))!important;
	}
}
@media only screen and (max-width: 375px) {
    #lgpagetitle{
        display: none;
    }
	.s6,.s4,.s3,.s2,.s1,.s7{
		width:100%!important;
	}
}
@media only screen and (max-width: 157px) {
    #header{
        display: none;
    }
}
.seveneigthsspan{
	padding: 1%;
    width: 87.5%;
    position: relative;
    margin: 0 auto;
	/* margin-bottom: 1%; */
}
.fourfifthsspan{
	padding: 1%;
    width: 80%;
    position: relative;
    margin: 0 auto;
	/* margin-bottom: 1%; */
}
.threequarterspan{
	padding: 1%;
    width: 75%;
    position: relative;
    margin: 0 auto;
	/* margin-bottom: 1%; */
}
.halfspan{
	padding: 1%;
    width: 50%;
    position: relative;
    margin: 0 auto;
	/* margin-bottom: 1%; */
}
.quarterspan{
	padding: 1%;
    width: 25%;
    position: relative;
    margin: 0 auto;
	/* margin-bottom: 1%; */
}
.fullspan{
	width: 100%;
	margin-bottom: 1%;
}
.flex_row{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(24%, 1fr));
    /* grid-template-rows: repeat(auto-fill, minmax(2fr, 1fr)); */
	gap: 2%!important;
	justify-items: center;
	text-align-last: center;
	align-items: center;
}
.flex{
	width: 100%!important;
	max-width: unset!important;
}

.requiredField::after {
	content: "*";
	color: red;
}
.s5{
	width: 95%!important
}
.s6{
	width:45%;
}
.s4{
	width:30%;
}
.s3{
	width:14%;
}
.s2{
	width:10%;
}
.s1{
	width:4%;
}
.s7{
	width: 57%;
    height: 100px;
}
.fieldLable{
	width:20%;
}
.DocInstr 	{
	width				:100%;
	float				:left;
	font-size			:small;
	font-style			:italic;
	margin-bottom		:5px;
	margin-top			:5px;
}
.DocTitle	{
	background			:#000000;
	color				:#FFFFFF;
	font-size			:large;
	font-weight			:bold;
}

.content{
	width: 75%;
    background: white;
    padding: 2%;
}


body {
	margin 				:0px;
	padding 			:0px;
	color				:black;
	font-family 		:Trebuchet MS, Arial, Verdana, Sans Serif;
	background-color	:rgb(255, 255, 255);
}
a{
	font-size: 15px;
}
h1 {
	text-align 			:center;
	font-size: 30px;
}
p{
	font-size: 15px;
}

#header {
	z-index: 100;
    background-color	:#444444;
    height: fit-content;
	width: 100%;
}
#container {
    position			:relative;
	margin				:0 auto;
	width				:-webkit-fill-available;
	background: white;
}
#container>.content{
	background: lightgray!important;
}
#main {
	width 				:-webkit-fill-available; 
}
#footer	{
	background			:#444444;
	color				:white;
	width 				:100%;
	display 			:block;
	font-size 			:small;
	text-align 			:center;
	padding-top			:25px;
	padding-bottom		:25px;
	position 			:relative;
}


.col{
	max-width: 1920px;
	margin: 0 auto!important;
}


.headDiv{
    display: flex;
	width: 100%;
	align-items: center;
}
.logoButton{
	margin-left: 8%;
    cursor: pointer;
    width: 25%;
    background: rgba(0,0,0,0);
    border: none;
    outline: none;
}
.logoButton img{
    width:100%;
}

#lgpagetitle {
	background 			:#444444;
	color 				:white;
	font-weight 		:bold; 
	text-align 			:center; 
	margin 				:0px;
	padding 			:0px;
	float				:right;
    font-size 		    :3em;
	width: 75%;
	/* white-space: nowrap; */
	overflow: hidden;
	text-overflow: ellipsis; 
}



.navbar {
	position: relative;
	text-align: -webkit-center;
	z-index: 99;
	width: -webkit-fill-available; 
	margin: 0px;
	background: linear-gradient(rgb(203, 203, 203), rgb(91, 91, 91));
	box-shadow: 0 0 3px 0px black;
	
    -webkit-transition: all 0.7s ease-out;
       -moz-transition: all 0.7s ease-out;
        -ms-transition: all 0.7s ease-out;
         -o-transition: all 0.7s ease-out;
            transition: all 0.7s ease-out;
}
.navButtonContainer{
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(calc(100%/13), 1fr));
    gap: 0;
}
.sentinel{
    position: absolute;
    top: 0;
    width: 100%;
    z-index:-1;
}
.navButton{
	height: 50px;
	width: 100%;
	font-weight: bold;
	padding: 0;
	margin: 0;
	border: 0px solid #A2A4A4;
	cursor: pointer;
	color: white;
	letter-spacing: 0px;
    font-family: helvetica;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}.navButton:visited{
	background: url(/images/button.png);
}.navButton:hover{
	background: linear-gradient(rgb(143, 143, 143), rgb(58, 58, 58));
	color: white;
}.navButton:active{
    background: linear-gradient(rgb(152 182 236), rgb(37 41 82));
	box-shadow: inset 0px 0px 15px #464848;
	-moz-box-shadow: inset 0px 0px 15px #464848;
	-webkit-box-shadow: inset 0px 0px 15px #464848;
	color: white;
	border: 0px solid #464848;
}.navButton:focus{
	color: white;
}

.mobileNav{
    display:none;
}.mobileNav:hover{
    fill: gray;
}

.navDrop{
    position: absolute;
    top: 50px;
    right: 0px;
    display: inline-grid;
    background: #ffffff;
    border: solid gray 2px;
    z-index: 9;
}.navDrop a{
    padding: 5px;
    font-size: 25px;
}


.wfu .navButton{
	color: black;
	border: solid black 1px;
	border-radius: 1%;
}
table.MachNav	{
	
	border 				:0px solid silver;
	font-size 			:smaller;
}

tr.MachNav	{
	text-align 			:center;
}

td.MachNav	{
	text-align 			:center;
	width 				:165px;
}

td.MachNavL	{

	text-align 			:left;
	width 				:195px;
}

td.MachNavR	{

	text-align 			:right;
	width 				:195px;
}

.subNav{
	grid-template-columns: repeat(auto-fill, minmax(calc(100%/6), 1fr));
	display: grid;
	position: relative;
	text-align: -webkit-center;
	width: -webkit-fill-available; 
	margin: 0px;
	
    -webkit-transition: all 0.7s ease-out;
       -moz-transition: all 0.7s ease-out;
        -ms-transition: all 0.7s ease-out;
         -o-transition: all 0.7s ease-out;
            transition: all 0.7s ease-out;
}
.subNav1{
	grid-template-columns: repeat(auto-fill, minmax(calc(100%/2), 1fr));
	display: grid;
	position: relative;
	text-align: -webkit-center;
	width: -webkit-fill-available; 
	margin: 0px;
	
    -webkit-transition: all 0.7s ease-out;
       -moz-transition: all 0.7s ease-out;
        -ms-transition: all 0.7s ease-out;
         -o-transition: all 0.7s ease-out;
            transition: all 0.7s ease-out;
}
.subNavButton{
	border: 1px solid black;
	background: rgb(71 93 81)!important;
	color: white!important;
	text-align-last: center;
	font-size: 14px;
}