@charset "utf-8";
/* CSS Document */
#header, #navWrap, #searchWrap, #steelbar, #footer, #copyrightWrap {display:none;}
		.searchbar-wrap {display:none;}
		.searchbar-wrap.affix {display:block;}




.navbar-inverse {border-color:#cccccc;}

.navigation-menu-close {
	display: block;
	padding-right: 30px;
	width: 100%;
	overflow: hidden;
}
.navigation-menu-close a:hover {color:#FFFFFF !important;}

.panel-from-right {
position: fixed;
width: 100%;
height: 100%;
overflow-x: hidden;
overflow-y: auto;
bottom: -100%;
left: 0;
background: #111;
-webkit-transition: all .8s ease-in-out;
   -moz-transition: all .8s ease-in-out;
    -ms-transition: all .8s ease-in-out;
     -o-transition: all .8s ease-in-out;
        transition: all .8s ease-in-out;
        opacity: 1;
   -moz-opacity: 1;
-webkit-opacity: 1;
filter: alpha(opacity=100);
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
z-index: 9999;
}

.panel-from-right.open {
bottom: 0;
}


.center-container-menu {margin-top:50px; clear:both}

.brackets {margin:40px 20px 70px; padding-left:0px;}
ul.brackets li{
	font-size:18px;
	padding:10px 15px;
	list-style:none;
	text-align:center;
	-moz-transition: 0.8s;
	-o-transition: 0.8s;
	-ms-transition: 0.8s;
	transition: 0.8s ;
}
ul.brackets li a {color:#d5d5d6;}
ul.brackets li:hover{
	background:#fb6317;
	cursor: pointer
}
ul.brackets li:hover a{color:#ffffff}


.center-container-menu #social-icons {
    list-style: none;
    margin: 70px auto;
	text-align: center;
	padding-left:0px;
}

.center-container-menu #social-icons li {
    font-size: 20px;
    display: inline-block;
    margin-left: 10px;
    margin-right: 10px;
}

.center-container-menu #social-icons li a { color: #46494a;}
.center-container-menu #social-icons li a:hover { color: #FB6317; transition: all 0.3s ease-in-out;}
.navigation-menu-close {
	display: block;
	padding-right: 30px;
	width: 100%;
	overflow: hidden;
}
.navigation-menu-close a:hover {color:#FFFFFF !important;}

.menu-img {
	background-image: url("https://static.dormanproducts.com/images/marketing/tour/backgrounds/dp-bg-9.jpg"); 
	background-position: center center; 
	background-size: cover; 
	width:100%; 
	height:100vh;
	
}
	.menu-img.bg-1 {background-image: url("https://static.dormanproducts.com/images/marketing/tour/backgrounds/dp-bg-3.jpg"); transition: all 0.3s ease-in-out;}
	.menu-img.bg-2 {background-image: url("https://static.dormanproducts.com/images/marketing/tour/backgrounds/dp-bg-7.jpg"); transition: all 0.3s ease-in-out;}
	.menu-img.bg-3 {background-image: url("https://static.dormanproducts.com/images/marketing/tour/backgrounds/dp-bg-8.jpg"); transition: all 0.3s ease-in-out;}
	.menu-img.bg-4 {background-image: url("https://static.dormanproducts.com/images/marketing/tour/backgrounds/dp-bg-11.jpg"); transition: all 0.3s ease-in-out;}
	.menu-img.bg-5 {background-image: url("https://static.dormanproducts.com/images/marketing/tour/backgrounds/dp-bg-10.jpg"); transition: all 0.3s ease-in-out;}
	.menu-img.bg-6 {background-image: url("https://static.dormanproducts.com/images/marketing/tour/backgrounds/dp-bg-12.jpg"); transition: all 0.3s ease-in-out;}

.page-hero {width: 50%; position: fixed; height: 100vh; background-size: cover; background-position: center center; background-repeat: no-repeat;}
		.page-hero iframe {width: 100vw;
  height: 56.25vw;
  min-height: 100vh;
  min-width: 177.77vh;}
		.page-hero::after, .next-previous-post a:after {
			content: "";
			position: absolute;
			background: url(https://static.dormanproducts.com/images/marketing/tour/assets/dot-pattern.png) repeat;
			top: 0;
			left: 0;
			bottom: 0;
			right: 0;
			z-index: 0;
		}
        .page-hero .content {position: relative; z-index: 1; border-style: solid;
  border-width: 0px 1px 1px 0px;
  border-color: #FFFFFF4D;
  transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
  margin: 45px 45px 45px 45px;
  --e-column-margin-right: 45px;
  --e-column-margin-left: 45px;
  padding: 0px 0px 25px 0px; height:90%;}
		
		
		.video-container {margin-bottom:40px;}
		
		.hero-video {height: 100%; width: 100%; top: 0; left: 0; position: absolute; overflow: hidden; z-index: 0; direction: ltr;}
			.hero-video iframe {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}
		
		.title {position:absolute; bottom:50px; margin-right:40px;}
		.title h1 {font-size: 60px;}
		.title h3 {text-transform: uppercase;}

.oefix-masthead {max-width:550px; margin:50px auto;}

		
		.right-content {width: 50%; position: relative; left: 50%; background-color:#FFFFFF;}
		.main-content {margin-top:50px; margin-bottom:50px; overflow: hidden;}
		.team-content {margin-top:50px; margin-bottom:50px; overflow: hidden; background:#2f3338;}
		.content-text {padding-left:40px; padding-right:40px;}
		
.team-content h2 {color:#fb6317;}
.team-content h3 {color:#fb6317; margin-top:0px; margin-bottom:0px;}
.team-content h6 {color:#f7f7f7; margin-top:5px;}
.team-content p {color:#ffffff;}
.team-content .img-thumbnail {background-color:#2f3338;}
.dropcap {margin-right: 14px; font-size:60px; line-height:60px; float:left; font-weight:600}
		.product-area {border-top: 1px solid #CCC; margin-top: 30px; padding-top: 30px; display: block; padding-bottom: 20px; margin-bottom: 30px; border-bottom: 1px solid #CCC; overflow:hidden;}
.product-area h4 {text-transform: uppercase; margin-bottom:15px;}
		.img-article {margin-bottom:30px;}
.img-caption {font-size:13px; color:#666666; font-style:italic;}
		
		.article-end {display: inline-block; width: 20px; height:15px;}


.callout {position:relative; width:90%; padding:25px; margin:30px;}
		.callout:before,  .callout:after,  .callout>:first-child:before,  .callout>:first-child:after  {
    		position:absolute;
    		width:30px; height: 30px;
    		border-color:#fb6317; 
    		border-style:solid; 
    		content: ' ';
		}
		.callout:before {top:0;left:0;border-width: 5px 0 0 5px}
		.callout:after {top:0;right:0;border-width: 5px 5px 0 0;border-color:#FFFFFF;}
		.callout>:first-child:before {bottom:0;right:0;border-width: 0 5px 5px 0;border-color:#FFFFFF;}
		.callout>:first-child:after {bottom:0;left:0;border-width: 0 0 5px 5px}
		.callout h2 {font-size:100px; color:#fb6317;}
		.callout h3 {font-size:80px; color:#fb6317;}
		.callout h4 {font-size:55px; color:#fb6317;}
		.callout h5 {font-size:30px; color:#fb6317;}


		.oefix-carousel-item {display:block; background-color:#999999; min-height:300px; padding-top:150px; background-size: cover; background-position: center center; position:relative; height:auto; overflow:hidden;}
			.oefix-carousel-item-content {background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 90%); padding:20px; position:absolute; bottom:0;}
				.oefix-carousel-item-content h5 {font-size:20px; color:#fff;}
				.oefix-carousel-item-content p {font-weight:700; line-height:1.5; margin-bottom:0px; color:#f7f7f7;}

		.img-thumbnail:hover {border-color:#2f3338;}
.additional-articles {min-height:425px;}
.additional-articles h4 {margin-bottom:5px;}
.additional-articles p{font-size:13px; line-height:1.5; font-style:italic;}

.next-previous-post a {
  display: table;
  width: 50%;
  height: 210px;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  position: relative;
  background-color: rgba(255, 255, 255, 0.2);
}
.post-center {display: table-cell;
  vertical-align: middle;
	padding: 50px 30px 46px 30px;
position:relative; z-index:25;}
#oefix-previous-post {float: left; text-align: right;}
#oefix-next-post {float:right;}
.post-center h3 {color:#ffffff;}
.post-center h5 {color:#f7f7f7;}

@media (max-width: 1400px) {
	.additional-articles {width:50%;}
}


@media (max-width: 990px) {
	.video-nav { max-height: 200px;}
	.video-head {margin-top:15px;}
	.text-margin-top {margin-top:0px;}
	.page-hero {width: 100%; position:relative; height:auto;}
	.right-content {width:100%; position:relative; left:0%;}
	.content {margin-top: 0px !important; padding-top: 50px!important; border: none !important;}
	.content-text {padding-left:25px; padding-right:25px;}
	.title {position: static; margin-top: 50px; display: block;}
	.callout {margin-left:0px; width:100%;}
	.oefix-masthead {max-width:400px; margin-left:0px;}
	.additional-articles {width:33.333%;}
	.page-hero .content {margin-bottom:0px;}
}
@media (max-width:767px) {
	.additional-articles {width:33.333%; float:left;}
	.page-hero .content {margin-bottom:0px;}
	  .navbar-header {
    float: left;
    padding: 0;
    width: 20%;
    z-index: 99;
    position: absolute;
    right: 0;
    margin-right: 20px;
  }
	.navbar {display:none;}
}
@media (max-width:750px) {
	.custom-modal {width:100% !important;}	
}
@media (max-width:665px) {
	.additional-articles {width:50%; float:left; min-height:auto;}	
}
@media (max-width: 465px) {
	.video-nav { max-height: 125px;}
	.content {margin-top: 0px; padding-top: 50px; border:none;}
	.additional-articles {width:100%; float:left;}
	.page-hero .content {margin-bottom:0px;}
}

@media (max-width: 990px) {
			.video-nav { max-height: 200px;}
			.video-head {margin-top:15px;}
			.text-margin-top {margin-top:0px;}

		}
		@media (max-width:750px) {
			.custom-modal {width:100% !important;}
		}
		@media (max-width: 420px) {
			.video-nav { max-height: 125px;}
		}


/* Other Styles */
#mc-btn.disabled {pointer-events: none;}
		.custom-modal {width:750px;}
		.form-control {height:auto;}
		.subsection-content {border: 1px solid #ddd !important; border-radius: 4px; padding:10px; margin-bottom:10px;}
		.subsection-content .btn {margin-top:10px;}
		.subsection-content .thumbnail:hover {border:1px solid #464646;}
		.oe-problem { color:#2f3338; padding-top:15px; padding-bottom:15px;}
			.oe-problem h5 {margin-bottom:1px; color:#2f3338;}
			.oe-problem p {color:#2f3338; margin-bottom:0px; font-size:13px;}
			.oe-content p { margin-bottom:0px; font-size:13px;}
		.oe-fix { color:#2f3338; padding-top:15px; padding-bottom:15px;}
		.oe-content {padding:8px; margin-bottom:10px; height:100%;}
		.carousel-control.left, .carousel-control.right {background:none; width:20px; color:#FB6317;}

.cutCorner {position:relative; background-color:#ddd; border:1px solid #b1b0b0; display: inline-block;}
        .cutCorner img {display:block;}
        .cutCorner:before {position:absolute; left:-1px; top:-1px; content:'';border-top: 70px solid #b1b0b0; border-right: 70px solid transparent;}
        .cutCorner:after {position:absolute; left:-2px; top:-2px; content:''; border-top: 70px solid #FFFFFF; border-right: 70px solid transparent;}
        
        .feature-container {background-color:#2f3338; padding:15px 20px; margin-bottom:20px;}
		.feature-container .flex-wrap .col-xs-3,
		.feature-container .flex-wrap .col-xs-9 {height:100%;}
		.feature-container h1 {font-size:70px; margin-top:0px; margin-bottom:0px; line-height:100px;}
		.feature-container h3 {margin-top:0px;}

		
		.callout {position:relative; width:100%; padding:25px; margin:30px;}
		.callout:before,  .callout:after,  .callout>:first-child:before,  .callout>:first-child:after  {
    		position:absolute;
    		width:30px; height: 30px;
    		border-color:#fb6317; 
    		border-style:solid; 
    		content: ' ';
		}
		.callout:before {top:0;left:0;border-width: 5px 0 0 5px}
		.callout:after {top:0;right:0;border-width: 5px 5px 0 0;border-color:#FFFFFF;}
		.callout>:first-child:before {bottom:0;right:0;border-width: 0 5px 5px 0;border-color:#FFFFFF;}
		.callout>:first-child:after {bottom:0;left:0;border-width: 0 0 5px 5px}
		.callout h2 {font-size:100px; color:#fb6317;}
		.callout h3 {font-size:80px; color:#fb6317;}
		.callout h4 {font-size:55px; color:#fb6317;}
		.callout h5 {font-size:30px; color:#fb6317;}

		
		.blog-nav {margin-left:20px;}
		.blog-nav li {margin-bottom:20px; line-height:20px; font-size:14px;}
		.blog-nav li.active {font-weight:bold; color:#FB6317;}
		.blog-nav li a::before {font-family: 'fontello'; content: "\e827"; float: left; margin-right: 0px; text-indent: -1.0em; list-style-position: inside;}
				
        .feature-btn {
            height: 110px;
            width: 110px;
            margin: 20px auto;
            display: block;
            background-color: #FB6317;
            padding: 20px;
            border-radius: 50%;
            border: 2px solid #f7f7f7;
            position: absolute;
            left: 0;
            right: 0;
            top: -140px;
        }
        
        .video-feature {background-color: #F7F7F7;}
        
        a:hover, a:focus {color: #FB6317;}
        
        a:link, a:visited {outline: none;text-decoration: none;}
        
        .bounce {animation: bounce 2s infinite;}
        .move {
            margin-left: auto;
            margin-right: auto;
            margin-top: 20px;
            margin-bottom: 15px;
        }
        
       .btn-wht {
           background-color: #FFFFFF;
           color: #2f3338;
           border-color: #ddd;
        }
		
		.carousel-indicators .active {background-color: #FB6317; margin:0 0 8px;}
		.carousel-indicators li {border: 1px solid #2f3338;}
		.carousel-indicators {bottom:0px; top:0px; left:0px;}
		
		.icon-minus-circled:before { content: '\e80f'; }
		
		.section {background-repeat: no-repeat; background-size: cover; background-position: center center; padding:40px 0px; text-align:center; min-height:160px;}
		.section h5 {color:#FFFFFF; font-size:24px;}
        .section-5 {
			background: url(//static.dormanproducts.com/images/marketing/products/oe-fix/oef-volume-4.jpg) center center no-repeat;
			background-size: cover;
			padding-top:80px;
			padding-bottom:80px;
			position: relative;		
		}
		
		#category-coverage p {font-size:12px; line-height:15px; display:none;}

		.well {padding:0px; margin-bottom: 30px;}
		.text-margin-top {margin-top:50px;}
        
        .productInfoContent{min-height: 0; margin: 0;padding-top: 50px; padding-bottom: 50px;}
		
		

