@charset "utf-8";
/* CSS Document for RMM YMM pages */

	/* this sheet builds off styles.css*/
	

.flex-radio {
	display: flex;
    flex-wrap: wrap;
    list-style: none;
}

.flex-radio li {
	flex-grow: 1;
    width: 25%;
    text-align: left;
}

.flex-alpha {
	display: -webkit-box;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-flex-flow: row wrap;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
	-webkit-box-pack: left;
	-ms-flex-pack: left;
	-webkit-justify-content: left;
	-moz-justify-content: left;
}

.flex-alpha li {
	order: 0;
	flex-grow: 1;
    width: 33.333%;
    align-self: auto;
    /* background: #eee;*/
    /* height: 100px;*/
	/* margin: 5px;*/
}

.nav-inline li {
	display: inline-block;
}

.nav-flex {
	display: flex;
    flex-wrap: wrap;
    list-style: none;
    overflow: hidden;
	/*margin-top: -8%;
	margin-bottom: 8%;
	z-index:-3/**/
	
	/* removed margins to put nav in div area = not above*/
}

.nav-flex li button {
	width: 100%;
}

.nav-flex li {
	flex-grow: 1;
    width: 33%;
}

.nav-flex li a {
	color: white;
	text-decoration: none;
	padding: 15px 0 15px 65px;
	background: green; /* fallback color */
	background: #00cd00;
	position: relative;
	display: block;
	float: left;
	width: 100%;
	font-size: 18px;
	text-align: center;

}

.nav-flex li a:before,.nav-flex li a:after {
	left: 94%;
	top: 50%;
	margin-top: -50px;
	border-top: 50px solid transparent;
	border-bottom: 50px solid transparent;
	position: absolute;
	content: " ";
	display: block;
	width: 0;
	height: 0;
	/* this is where css nav arrows show*/

}

.nav-flex li a:after {
	border-left: 30px solid #00cd00;
	z-index: 2;
}

.nav-flex li a:before {
	border-left: 30px solid white;
	margin-left: 3px;
	z-index: 1;
}
.nav-flex li:first-child a {
	  padding-left: 5%;
}

.nav-flex li:nth-child(2) a {
	padding-left: 0%;
}

.nav-flex li:nth-child(3) a {
	padding-left: 17px;
	margin-left: -17px;
	/*padding-right: 90px;*/
}

.nav-flex li a.disabled {
	background:#999;
}

.nav-flex li a.disabled.back {
	cursor: pointer;
	transition: all 0.25s ease-in;
}

.nav-flex li a.disabled.back:hover {
	color: #000;
}


.nav-flex li a.disabled:after {
	border-left: 30px solid #999;
}

/*
.nav-flex li:last-child a {
	background: transparent !important;
	color: black;
	pointer-events: none;
	cursor: default;
}
*/

#grid-radio {
	list-style:none;
    margin:0px;
	float:left;
	width: auto;
    min-width: 14.9%;
    /*margin-left: -8px;
	z-index:-3*/
}

#grid-radio.flex-alpha {
	min-width: 100% !important;
}
#grid-radio.flex-alpha li {
	flex-grow: 0;
}
#grid-radio label {
    /*float:left;*/
     width:220px;/* button width ymm*/
    /* margin:4px;*/
    background-color:#fff;
    /* border-radius:4px;*/
     border:1px solid #D0D0D0;/**/
    overflow:auto;
	border-radius: 4px;
	transition: all 0.25s ease-in;
	margin: 8px 0 0 8px;
}

#grid-radio label span {
    text-align:center;
    font-size: 15px;
    padding:13px 0px;
    display:block;

    background: transparent;
    color: inherit;
    cursor: pointer;
}

#grid-radio li.make label, #grid-radio li.model label {
	background-color:#EFEFEF;
}

#grid-radio li.make label:hover, #grid-radio li.model label:hover {
	background-color:#404040;
}

#grid-radio label:hover{
	background: #404040;
	color: #66CD00;
}

#grid-radio label input {
    position:absolute;
    top:-20px;
}

#grid-radio input:checked + span {
    background-color: #404040;
    color: #F7F7F7;
}
