@import url('https://fonts.googleapis.com/css?family=Roboto&display=swap');

* {
	border-radius: 0 !important;
}

body {
	position: relative;
	background-color: #ffffff !important;
	font-family: 'Roboto', sans-serif !important;
	color: black !important;
	width: 100%;
	margin:0;
}

#site-container {
	background-color: white !important;
}


a:hover {
	text-decoration: none !important;
}

#menu {

    width:100%;
}

h3 {
	color: #1E76BD !important;
	letter-spacing: 1px;
	line-height: 150% !important;
	text-transform: uppercase;
}

h3  {
	a {
	    color: lightgray;
     }
}
h2,h2 a:hover{
	color: #1E76BD !important;
	letter-spacing: 1px;
	line-height: 150% !important;
	text-transform: uppercase;
	text-decoration:none !important;
}

h4 {
	font-weight: 900 !important;
	line-height: 150% !important;
	font-size: 1.5em !important;
}

.c-keyline {
    margin-bottom: calc(16px - 1px);
    border: none;
    border-bottom: 1px solid #c0c0c0;
}

.u-color-gray-30 {
    color: #9f9f9f;
}

.icono-arrow3-right {
  width: 50px;
  height: 5px !important;
  border-width: 0 0 2px 0;
  border-style: solid;
  margin: 10px;
  border-radius: 2px 2px 2px 2px;
  color: #888 !important;
}

.related-title {
   overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;
}

.srch-item {
   margin-bottom:40px !important;
}


#description {
	padding-left: 0px !important;
}

.row.vdivide [class*='col-']:not(:last-child):after {
  background: #1E76BD;
  width: 2px;
  content: "";
  display:block;
  position: absolute;
  top:0;
  bottom: 0;
  right: 0;
  min-height: 70px;
}

.navbar-default {
	background-color: lightgray !important;
	color: black !important;
	box-shadow: none;
	margin-bottom: 0 !important;
	border: none;
	letter-spacing: 1px;
}

.sm-nav {
	background-color:lightgray !important;
}

#menu {
	background-color: lightgray !important;
	color: black !important;
	box-shadow: none;
	margin-bottom: 0;
	margin-left: 0 !important;
	margin-right: 0 !important;
	padding:0 !important;
	border: none;
}

#about {
	text-align:left;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:200px;
	font-size: 1.5em;
	line-height: 150%;
}


#shipping {
	position: fixed !important;
	left:auto !important;
	right: auto !important;
	margin-left:auto !important;
	margin-right:auto !important;
	max-width: 100% !important;
}

.modal-dialog {
	position: fixed !important;
	margin-left: auto !important;


}

#basket-contents > div {
	width: 100% !important;
}

.navbar-default a{
	color: black !important;
}

.navbar-center {
	float:none !important;
    margin:0 auto !important;
    display: block !important;
    text-align: center !important;
}

.nav.navbar-nav.navbar-right a:hover{
	color: white !important;
}

#menu a {
	color: black !important;

}

.nav.nav-justified a:hover, .nav.nav-justified a:focus {
	background-color: transparent;
	color: #1E76BD !important;

}

.x-category-tree {
	margin-bottom: $global-spacing-unit;
	position: relative;
	text-align: left;
}

	.x-category-tree__trigger {
		display: none;
	}

	.x-category-tree__label.x-collapsible-content__toggle {
		min-height: 2em;
		margin: 0 0 1em;
		padding: 1em 0;
		font-size: 0.75 rem;
		border-bottom: $global-border-width solid $color-gray-10;
	}

	.x-category-tree .x-collapsible-content__item[aria-hidden='false'],
	.x-category-tree .x-collapsible-content__item[aria-hidden='false'] .x-category-tree__row {
		max-height: 100%;
	}


	.x-category-tree__title {
		display: none;
	}

		.x-category-tree__heading {
			font-size: 20px;
		}


	.x-category-tree__row {
		width: 100%;
		max-height: 0;
		margin: 0;
		padding: 0;
		list-style: none;
		opacity: 0;
		overflow: hidden;
		visibility: hidden;
		transition: 0.2s ease-in-out;
	}

		.x-category-tree__link {
			display: block;
			padding: 0 0 1.5rem;
			font-size: 16 px;
			font-weight: 600;
			color: $color-black;
			letter-spacing: 0;
			transition: color ease-in-out 0.2s;
		}

		.x-category-tree__link:hover {
			text-decoration: none;
		}

		.x-category-tree__list--level-2 .x-category-tree__link {
			padding-left: 1.75em;
			font-size: 13px;
			color: $color-gray-40;
		}

		.x-category-tree__list--level-3 .x-category-tree__link {
			padding-left: 2.75em;
			font-size: 12px;
			color: $color-gray-40;
		}

			.x-category-tree__link--current,
			.x-category-tree__list--level-2 .x-category-tree__link--current,
			.x-category-tree__list--level-3 .x-category-tree__link--current {
				font-weight: 700;
				color: $color-black;
			}

			.x-category-tree__link:not(.x-category-tree__link--current):hover {
				text-decoration: underline;
				background-color: inherit;
			}


	@media (min-width: 60em) {
		.x-category-tree__label.x-collapsible-content__toggle {
			display: none;
		}

		.x-category-tree__title {
			display: block;
		}

			.x-category-tree__heading {
				padding-top: 0.25rem;
			}

		.x-category-tree__row,
		.x-category-tree__row.x-collapsible-content__item {
			max-height: none;
			opacity: 1;
			overflow: visible;
			visibility: visible;
		}

		.x-category-tree__link:not(.x-category-tree__link--current):hover {
			text-decoration: none;
			background-color: $color-gray-10;
			transition: background-color ease-in 0.3s 0.05s;
		}
	}


.jumbotron {
	box-shadow: none !important;
	border-radius: 0 !important;
	background-color: white;
	margin: 0 !important;
	background-image: url("/mm5/images/550_hero4.jpg") !important;
	background-size: cover;
	min-height: 60vh;
}

.calltoaction {
	text-align: center;
	color: white !important;
	padding-top: 6em !important;
}

.calltoaction h1 {
	font-weight: bold;
	font-size: 5em !important;
}

.calltoaction h3 {
	font-weight: bold;
	font-size: 2em !important;
	color: white !important;
}

.mobile .jumbotron {
	max-width: 100% !important;
	max-height: 80vh !important;
	background-image: url("/mm5/images/550_hero.jpg") !important;
	background-size: contain !important;
	background-repeat: no-repeat;
}
.calltoaction-mobile {
	text-align: center;
	color: white !important;
	padding-top: .5em !important;
}

.calltoaction-mobile h1 {
	font-weight: bold;
	font-size: 1em !important;
}

.calltoaction-mobile h3 {
	font-weight: bold;
	font-size: 1em !important;
	color: white !important;
}

.about {
	color: black;
	margin-top: 25px;
	margin-bottom: 50px;
	font-family: 'Roboto', sans-serif !important;
	letter-spacing:1px;
}

.about p {
	font-size:1.5em !important;
	font-weight: 300 !important;
}

.aboutmobile {
	color: black;
	margin-bottom:50px;
	font-family: 'Roboto', sans-serif !important;
	letter-spacing:1px;
	font-size:1.25em !important;
	padding:25px !important;
	font-weight:300! important;
}

.featured {
	background-color:white !important;
	height: 75vh;
}

.featured-left {
	background-color: #f2f2f2;
  	background-position: center center;  
  	background-repeat: no-repeat;
  	background-size: cover;
	position: relative;
	text-align: center;
	padding: 1em;
	height: 75vh;
 }

.featured-right {
	background-color: #e3e3e3;
	background-position: center center;  
  	background-repeat: no-repeat;
  	background-size: cover;
	position: relative;
	text-align: center;
	height: 75vh;
}

h8 {
  	margin: 0;
  	position: absolute;
  	top: 50%;
  	left: 50%;
  	transform: translate(-50%, -50%);
	font-size: 6em;
	font-weight: 900;
	color: white;
	text-shadow: 2px 2px 15px rgba(0, 0, 0, 0.5);
	
}

.navbar-text > a {
	color: inherit;
	text-decoration: none;
}



i {
	padding-right: 10px;
	padding-top: 10px;
}

.navbar-inverse {
	background-color: black !important;
	color: white !important;
	border-style: none !important;
	border: none !important;
	margin: 0 !important;
	letter-spacing: 1px;
}

#site-container {
	text-align: center;
}



.category-item:hover .item-details {
	visibility: visible;
	opacity: 1;
}

.item-image {

	margin-bottom: 0 !important;
	padding: 0 !important;
}

.item-details > h5 > a {
	color: black !important;
	text-decoration: none !important;
}

.breadcrumb {
	text-align: left;
	background-color: white !important;
}

.checkoutinfo {
	margin-top:15px !important;
	margin-bottom:15px !important;
	text-align:left !important;
}

#thumbnails > li {
	display: inline;
}

#install {
	text-align:left !important;


}

#install > a {
	text-decoration: none !important;

}

#installicon {
	text-align:center !important;
	padding-bottom:50px;
}

#details {
	font-family: 'Roboto', sans-serif !important;
	letter-spacing:1px;
}

#details > ul {
	padding-left: 0 !important;
	list-style-position: inside !important;
}

.open > .dropdown-menu {

  right: 0 !important;
  left: auto !important;
}


.btn.btn-danger,.btn.btn-danger:hover,.btn.btn-danger:active {
	background-color: #1E76BD !important;
	border-style:none;

}

.btn-default {
	border-style:none;
	background-color:transparent !important;
}

.btn-block {
	height: 50px;
	border-style:solid !important;
	margin-top:10px;

}

.btn-sfnt {
	border-style:2px solid !important;
	border-color: white !important;
	background-color:transparent !important;
	color: white;
}

#search {
	margin-top:10px;
}

.btn-primary {
	border-color: #1E76BD !important;
	background-color:white !important;
	border-style: solid 2px !important;
	color: #1E76BD !important;
}

.btn-primary:hover {
	border-color: white !important;
	background-color: #1E76BD !important;
	border-style: solid 2px !important;
	color: white !important;
}

.btn-soon {
	border-color: #cecece !important;
	background-color:white !important;
	border-style: 2px solid #cecece !important;
	color: #cecece !important;

}

.btn-soon:hover {
	border-color: white !important;
	background-color:#cecece !important;
	border-style: 2px solid !important;
	color: white !important;

}
.btn-soon:hover p.new-label:before {
	content: "FJ Cruiser" !important;
}

.btn-soon:hover p.new-label:after {
	content: "COMING SOON!" !important;
}

#search > form > .btn-default {
	background-color:none !important;
}
.control-label.italic {
	font-style: italic !important;
	font-weight: normal !important;
}
input.form-control,textarea.form-control {
    border-top:none;
    border-left:none;
    border-right:none;
    border: 1px solid lightgray;
    background-color: none;
    box-shadow: none;
   -webkit-box-shadow: none;
   -moz-box-shadow: none;
   -moz-transition: none;
   -webkit-transition: none;
}

input.form-control,textarea.form-control {
    border-top:none;
    border-left:none;
    border-right:none;
    border: 1px solid lightgray;
    background-color: none;
    vertical-align:middle;
    box-shadow: none;
   -webkit-box-shadow: none;
   -moz-box-shadow: none;
   -moz-transition: none;
   -webkit-transition: none;
}

.fitment select, .fitment option {
    text-align: center !important;
    width:200px !important;
    height:50px !important;
    margin-top:10px;

}

.mm_combination_facet_fields{
	position:relative;
	display:inline-block;
	vertical-align:middle;
	width:calc( 100% - 200px );
	box-sizing:border-box;
}
 input.form-control:focus,textarea.form-control:focus {
    border-top:none;
    border-left:none;
    border-right:none;
    border: 1px solid #1E76BD;

    box-shadow: none;
   -webkit-box-shadow: none;
   -moz-box-shadow: none;
   -moz-transition: none;
   -webkit-transition: none;
}

.mm_combination_facet_action {
	position:relative;
	display:inline-block;
	vertical-align:middle;
	text-align:center;
	margin:2px;
	padding:0px 0px;
	background: white !important;
	text-decoration:none;
	border:none !important;
	border-radius:0px;
}

.mm_combination_facet_container{
	position:relative;
	display:block;
	padding-top:15px;
	border:0px !important;
}

.mm_combination_facet_field select{
	margin-top:10px;

}

.product-details-review{
    border-top-style:dotted;
	border-bottom-style:dotted;
	border-bottom-width:1px;
	border-top-width:1px;
	border-bottom-color:#a5a5a5;
	border-top-color:#a5a5a5;
	width:80%;
    min-height:50px;
	margin:0px;
	position: relative;
	background-image:url('/images/misc/review.png');
    background-repeat:no-repeat;
    background-position:left top;
	text-align:left;
	padding-top:10px;
	padding-left:50px;
	padding-bottom:10px;
	margin-left: auto ;
    margin-right: auto ;
}

.build {
	margin-bottom:50px;
	text-align:left;
}



#site-container > div.items > div.content > div > div > div > div > div > div > div:nth-child(9) > div.product-details-review > a > i > div > ul {
	 list-style-type: none;
}

.paging {
	font-size: 2em !important;
}


footer {
	width: 100%;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	height:80px !important;


}

@media only screen

  and (max-device-width: 667px)
   {

  	.lg-nav {display:none;}
  	.desktop {display:none;}
  	.nav.nav-justified{float: left !important;display:inline!important;}
  	.nav-justified>ul, .nav-justified {float:left!important;margin:0 !important;}
  	.item-details{ visibility: visible;}
  	.item-details > h5 {font-size: 10px;}
	.featured {background-color:white !important;padding-bottom: 2em !important;height: 150vh;}
	h8 {font-size: 4em !important; font-weight:900;}
  
}

@media only screen
	and (min-width: 768px)
	{
		.sm-nav {display:none;}
		.mobile {display:none;}
		/* .item-details{
  			visibility: hidden;
  			opacity: 0;
  			transition: opacity .25s ease-in-out;
   			-moz-transition: opacity .25s ease-in-out;
   			-webkit-transition: opacity .25s ease-in-out;

		} */
	}

	@media only screen
	and (min-width: 992px)
	{
		.sm-nav {display:none;}
		.mobile {display:none;}
		/* .item-details{
  			visibility: hidden;
  			opacity: 0;
  			transition: opacity .25s ease-in-out;
   			-moz-transition: opacity .25s ease-in-out;
   			-webkit-transition: opacity .25s ease-in-out;

		} */
	}

@media (max-width: 480px) {

	a {
		text-decoration: none;
	}

 	.navbar-nav {
 		margin:0;
        vertical-align: top;
    }


    .navbar .navbar-collapse {
        text-align: center;
    }

    .navbar-nav > li {
	font-size: 1.25em !important;
	padding-top:10px !important;
	padding-bottom:10px !important;
    }

    .down {
	margin-top: 0px !important;
    }

}

.search {
	background-color:transparent!important;
	color:gray!important;
	border:none;
	box-shadow: none;
	padding-top: 17px;
    padding-bottom: 17px;

}

.btn .search {
	color:gray;
}

.searchtext {
	background-color:transparent!important;
	color:gray!important;
	border-bottom:1px solid gray;
	border-top:0px;
	border-left:0px;
	border-right:0px;
	box-shadow: none;
	outline:0;
	text-transform: uppercase;
	letter-spacing: 1px;
	padding:0;

}

.form-group, c-form-select__dropdown{
	margin-bottom: 25px;
		border-radius:0;
	border-top:none;
	border-bottom:none;
	box-shadow: none;

	background:none!important;
}
.form-group:focus {
	color:#D8262E;
	box-shadow: none;
}

.form-control {
	border-radius:0 !important;
	box-shadow: none !important;

	background:none!important;
}

.form-control:focus {
	color:#D8262E !important;
	box-shadow: none !important;
}

.navbar-collapse {
	max-height:450px !important;
}

/* Landing Page */

.landing {
	text-align: left;
}

#landing-left {
	margin-left:0px !important;
}

#landing-right {
	margin-right:0px !important;
}

.landing-header {
	text-align: center;
}

.down {
	margin-top: 4em !important;
}

.row-background {
	background-color: #f2f2f2;
	padding: 1em;
}

.row-background-two {
	background-color:  #e3e3e3;
	padding: 1em;
}

.choosebumper {
	margin-bottom: 5em;
}

div.imagetiles div.col-lg-3.col-md-3.col-sm-3.col-xs-6 {
	padding: 0px !important;
}

/* PROD - Reviews */
#reviews {
	margin: 2rem 0;
	border-top: 1px solid #f1f1f1;
	border-bottom: 1px solid #f1f1f1;
	padding: 1.5rem 0;
     text-align: left;
}
.PROD .product-stars-summary {
	margin-bottom: 2em;
}

/*
|
| Questions and Answers Styling
|
*/

#qna-questions div {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	clear: both;
}

#qna-questions .qna-questions {
	margin-bottom: 1rem;
	padding-bottom: 1rem;
}

.qna-question,
.qna-asked-by,
.qna-unanswered,
.qna-answer-dates,
.qna-answered {
	padding: 0.5rem 0.75rem;
}

.qna-answered,
.qna-unanswered {
	font-weight: 900;
}

.qna-asked-by,
.qna-answer-dates {
	display: block;
	font-size: 1em;
	padding: 0 0 0.25rem 0;
	text-transform: uppercase;
}

.qna_q,
.qna_a {
	color: #FFF;
	float: left;
	font-size: 14px;
	font-weight: 900;
	margin-right: 0.5rem;
	padding: 1.5rem 2rem;
}

.qna_q {
	background: #d3d3d3;
}

.qna_a {
	background: #1E76BD;
}

.qna_question,
.qna_answered {
	float: left;
}

#show_qna_form_label {
	cursor: pointer;
	text-decoration: underline;
}

#pq_form {
	display: none;
}

#qna_form input:checked~ #pq_form {
	display: block;
}

#qna-pagination {
	list-style: none;
	text-align: right;
}

#qna-pagination li {
	display: inline-block;
}

.t-product-qna__fields,
.fields1 {
	display: flex;
	flex-direction: column;
}

@media screen and ( min-width: 540px ) {

	.t-product-qna__fields,
	.fields1 {
		flex-direction: row;
	}

}

#qna_form div {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

.qna__form-row {
	clear: both;
	margin-bottom: 10px;
}

.qna__form-input, .qna__form-textarea, .qna__form-submit {
	width: 100%;
	padding: .5rem .75rem;
	font-size: .8em;
	border: 1px solid #ccc;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

.qna__form-submit {
	border: 0;
	color: #FFF;
	font-weight: 900;
	padding: 1rem 1.25rem;
	text-align: center;
	text-transform: uppercase;
}

.qna-container {
	margin: 0 auto;
	width: 60%;
}

.tabs {
  display: flex;
  text-align:left;
  flex-wrap: wrap;
  max-width: 100%;
  background: #fafafa;
  
  border: 1px solid lightgrey;
}

.input {
  position: absolute;
  opacity: 0;
}

.tablabel {
  width: 100%;
  padding: 20px 30px;
  background: #e5e5e5;
  cursor: pointer;
  font-weight: bold;
  font-size: 18px;
  color: #7f7f7f;
  transition: background 0.1s, color 0.1s;
}

.tablabel:hover {
  background: #d8d8d8;
}

.tablabel:active {
  background: #ccc;
}

.input:focus + .tablabel {
  box-shadow: inset 0px 0px 0px 3px #2aa1c0;
  z-index: 1;
}

.input:checked + .tablabel {
  background: #fff;
  color: #000;
}

@media (min-width: 600px) {
  .tablabel {
    width: auto;
  }
}

.panel {
  display: none;
  width:100%;
  padding: 20px 30px 30px;
  background: #fff;
}

@media (min-width: 600px) {
  .panel {
    order: 99;
  }
}

.input:checked + .tablabel + .panel {
  display: block;
}

.dropdown { 
	position: static !important; 
}

.dropdown-menu { 
	text-align: center !important;
	
}

.open > .dropdown-menu {
	width: 100% !important; 
	text-align: center !important; 
        padding-top: 30px !important;
	padding-bottom: 50px !important;
	margin-left: auto;
	margin-right: auto;
}

.dropdown-menu > li { 
	display: table-cell !important;
	vertical-align: top;
	padding-top: 10px;
	padding-bottom: 10px;
}

@media screen and (max-width: 767px) {
  .dropdown-menu > li {
    display: block !important;
  }
}

#site-container > div.navbar.navbar-default.navbar-static-top > div > div.navbar-collapse.collapse > ul > li.dropdown.menu-large.open > ul > li > ul { 
	list-style-type: none !important; 
}

.dropdown-header {
	font-weight: bold;
	padding-left:0px !important;
}