/* template.css overrides -- use only when absolutely necessary
================================*/
@import url("https://promotions.newegg.com/Newegg/NSIP/images/css/nav_v2a.css");
.banner {padding-top:41.667%;}
.banner-img {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
max-height: 876px;
background: url("../imgs/hp_hero.jpg") no-repeat 0 0;
background-size:289.722222%;
}
.header2021-logo-img > img{
  width:102px !important;
  height:auto;
}

.price{margin:0 0 0.825em 0;}
.price-save-dollar,.price-save-label,.price-save-percent{position:relative;background:#cc4e00;color:#fff;font-weight:700;font-size:13px;}
.price-save-percent:after{left: 100%;border-bottom:19px solid #cc4e00;border-right: 10px solid transparent;margin-bottom:0;}
.price-save-label{padding:0 0 1px 6px}
.price-save-dollar{padding:0 0 1px 2px}
.price-save-percent{padding:0 6px 1px 2px}
.price-save-label:before,.price-save-percent:after{content:'';position:absolute;bottom:0;width:0;height:0;}
.item-cell{border-bottom:none;}
.item-promo{margin-top:1em;}
.item-promo-code{border-color:#888;}
.item-promo-title span{color:#333;}
.item-promo-info{color:#cc4e00;}
.item-promo-code{padding:1.5em 5px 1em 5px;height:auto;color:#cc4e00;}
.item-promo-code-save{display:inline;}
li.mir{display:none;}
.instantSavings, .mir{display:block;}
.finalPrice{font-size:1.6em;}
.instantSavings{font-size:0.925em}
.finalPrice, .instantSavings{color:#000;}
.shipping{visibility:hidden;}
.mir{font-size:1em;margin:0;color:#016B04}
.header .logo { width:125px; }
.items-grid:after { background:none; }
/* No Orange Bar for Custom LPs with Black Background
.price-save-dollar,.price-save-label,.price-save-percent{position:relative;background:none;color:#fff;font-weight:700;font-size:13px;}
.price-save-percent:after{left: 100%;border-bottom:none;border-right: 10px solid transparent;margin-bottom:0;}
================================*/

/* custom CSS on a per project basis
================================*/
body, .ngg-footer h3, .ngg-footer span { font-family:'Montserrat',sans-serif !important; }
button { border:0; background:none; width:100%; margin:auto; }
.section-inner { max-width:1920px; position:relative; color:#fff; }
.ngg-font p, .ngg-font li, .ngg-font h2, .ngg-font h3, .ngg-details p, .ngg-hero h1, .ngg-4col h3 { font-family:'Montserrat',sans-serif !important; }

/*.section-inner img { max-width:1935px; width:100%; }*/
header { min-height:100px; padding:10px 2%; }
header img { max-width:350px; width:100%; }
hr { clear:both; border:0; }
.hero-logo { display:none; }
.ngg-hide { display:none; }
.ngg-hp-hero { background:url('../imgs/hp_hero.jpg') no-repeat cover; max-height:876px; }
.ngg-nav, .ngg-nav2 { position:absolute; right:2%; top:20px; }
.ngg-nav ul li, .ngg-nav2 ul li { display:inline-block; margin-right:30px; font-size:1.5em; }
.ngg-nav a, .ngg-footer a { color:white; font-family:'Montserrat',sans-serif; }
.ngg-whtbg { background:white; }
/*.ngg-nav a:hover, .ngg-active { text-decoration-line:underline; text-decoration-thickness:10px; text-underline-offset:10px; color:#fff; }*/
.ngg-nav ul li a:hover { text-decoration-line:underline; text-decoration-thickness:40%; text-underline-offset:10px; color:#fff; }
.ngg-active { font-weight:400; text-decoration-line:underline; text-decoration-thickness:40%; text-underline-offset:10px; }
.ngg-nav ul li a:active, .ngg-nav ul li a:focus { color:#fff; }
.ngg-nav2 { top:60px; overflow:hidden; }
.ngg-nav2 a { color:black; font-family:'Montserrat',sans-serif; }
.ngg-nav2 a:hover, .ngg-active2 { text-decoration:underline; text-decoration-thickness:40%; text-underline-offset:10px; color:black; }
.ngg-nav2 .ngg-navicon { display:none; }

.ngg-hero { background:transparent; text-align:center; }
.ngg-hero h1 { color:#fff; padding:2% 3% 4%; font-size:3em; }
.ngg-hero span { font-weight:700; font-family:Times, "Times New Roman", "serif"}
.ngg-hero img {  width:100%; max-width:1366px; margin:auto; }
.ngg-title { font-size:2.5em; }
.ngg-logo { text-align:center; }
.ngg-logo img { max-width:1000px; }
.ngg-details { color:white; }
.ngg-details h2 { font-family:'Montserrat',sans-serif; font-weight:600; padding:20px 0 5px; }
.ngg-details p { padding:0 20px 20px 0; line-height:1.5; font-family:'Open Sans', sans-serif; }
.ngg-details p > a { color:white; text-decoration:underline; text-underline-offset:6px; }
.ngg-details ul, .ngg-slide-details ul { list-style:disc; margin-left:20px; }

.ngg-details li {  font-family:'Open Sans', sans-serif; }
.ngg-gradient1 { background: rgb(19,46,135);
background: -moz-linear-gradient(0deg, rgba(19,46,135,0) 0%, rgba(0,0,0,1) 100%);
background: -webkit-linear-gradient(0deg, rgba(19,46,135,0) 0%, rgba(0,0,0,1) 100%);
background: linear-gradient(0deg, rgba(19,46,135,0) 0%, rgba(0,0,0,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#132e87",endColorstr="#000000",GradientType=1); }

.ngg-padd { padding:5%; }
.ngg-interns { font-weight:600; font-size:1.6em; font-family:'Montserrat',sans-serif; }
.ngg-intern-pic { background:url('../imgs/hp_hero3.jpg') no-repeat top center; background-size:contain; padding-top:32%; }
.ngg-vid-container { width:100%; padding-top:56.25%; height:0px; }
.ngg-youtube { aspect-ratio:16 / 9; width:100%; }
.video-box-wrap { max-width:1366px; }
.ngg-vid { width:100%; max-width:1295px; margin:auto; }
.ngg-vid h3 { font-size:2em; font-weight:bold; padding:2% 0 1%; }
.ngg-vid p { padding:0 0 5%;}
.ngg-divider { height:50px; }
.ngg-bg1 { background:url('https://promotions.newegg.com/newegg/nsip/images/imgs/bg1.jpg') repeat top left; background-size:cover; }
.ngg-cta { background-color:#FF6600; border-radius:50px; padding:30px 20px; color:#fff; margin:3%; max-width:260px; font-size:2em; font-family:sans-serif; font-weight:600; letter-spacing:0; }
.ngg-cta2 { background-color:#FF6600; border-radius:50px; padding:10px 5px; color:#fff; margin:3% 0; max-width:150px; font-size:1.35em; font-family:sans-serif; font-weight:600; letter-spacing:0; }
.ngg-marg { margin-bottom:5%; }
.ngg-footer { margin:5% 0; text-align:center; }
.ngg-footer h3 { font-size:3em; font-weight:600; }
.ngg-footer span { font-weight:400; font-size:20px; font-family:inherit; color:#fff; }
.ngg-footer a { text-decoration:underline; text-underline-offset:6px; }
.ngg-nomarg { margin:0; }
.ngg-disclaimer { padding:5% 0; text-align:center; }
/* columns */
.ngg-section { width:100%; max-width:1366px; margin:0% auto; padding:2%; clear:both; }
.whyus { text-align:center; font-size:3em; font-family:'Montserrat',sans-serif; font-weight:bold; }
.ngg-col img { max-width:960px; width:100%; float:left; margin:2%; }
.ngg-2col { float:left; width:50%; }
.ngg-3col { float:left; width:33%; }
.ngg-4col { display:flex; text-align:center; padding:5% 0; justify-content: space-around; }
.ngg-4col div { width:20%; }
.ngg-4col div p { font-family:'Montserrat',sans-serif; }
.ngg-4col h3 { padding:3% 0; font-weight:600; font-size:1.5em; min-height:60px; border-bottom:thin solid #0557a5; margin-bottom:7%;  }
.ngg-4col h3 span { font-size:16px; font-weight:400; }
.ngg-4col img { max-width:60px; margin:0 0 3%; }
.ngg-img img { max-width:620px; width:100%; }

/* featured columns */
.ngg-30col { display:inline-block; width:33%; vertical-align:top; margin-bottom:5%; }
.ngg-30col img { display:block; /*width:auto; height:100px;*/ clear:right; margin:auto; }

.ngg-reviews { margin:3% 0; }
.ngg-reviews img { width:90%; margin:0 auto 5%; }

.ngg-program { padding:2% 2%; line-height:1.5; }
.ngg-program a { font-family:'Montserrat',sans-serif; color:white; text-decoration:underline; text-underline-offset:6px; }
.ngg-program-closed { font-size:1.5em; padding:0 10% 50%; }
.ngg-title { text-align:center; text-transform:uppercase; padding:2% 0 2%; font-weight:600; }
.ngg-feature { clear:left; }
.ngg-icon { width:150px; margin:auto; text-align:center; }
.ngg-icon img { display:block; padding:3%; }
.ngg-feature h3 { font-size:1.5em; font-weight:600; text-align:center; }
.ngg-feature span { font-size:16px; font-weight:400; }
.ngg-feature p { padding:3% 8%; }

.ngg-testimony { width:90%; }
.ngg-testimony h3 { text-align:left; }
.ngg-testimony p { padding:1% 5% 0 0; }
.ngg-slide-details p { padding:1% 10% 1% 2%; }
.ngg-slide-details { float:right; color:black; text-align:left; padding:0; overflow-y:auto; min-height:450px; vertical-align:top; background-color:white; }
.ngg-slide-details h3, .ngg-slide-details h4 { color:#1946B8; font-weight:bold; font-family:'Montserrat',sans-serif; padding:20px 0 8px; }
.ngg-slide-details h3 { font-size:1.5em; line-height:1; }
.ngg-slide-details span { font-size:16px; color:#999; font-weight:400; }
.ngg-slide-txt { float:left; width:50%; padding-top:1%; }
.ngg-bgwht { background-color:white; }
.ngg-slide-img { width:30% !important; }
.ngg-slide-img2 { width:40% !important; float:left; margin:0 3% 0 0; }

/* swiper slide */
.swiper { width: 100%; height: 100%; background-color:white; }

    .swiper-slide {
      text-align: center;
      font-size: 15px;
      display: flex;
      justify-content: center;
      align-items: center;
    }

    .swiper-slide img {
      display: block;
      width: 50%;
      height: 100%;
    }
.swiper-pagination-bullet { width:10px; height:10px; border:2px solid white; }
.swiper-pagination-bullet-active { background:#ff6600; }
.swiper-btn-change { background:#ff6600; border-radius:50%; padding:10px 20px; color:white; }
.swiper-btn-change::after { font-size:2em; font-weight:bold; }


/* Style the tab */
.tab {
  overflow: hidden;
  background-color: #696969;
  margin:8% 0 0; 
  font-family:'Montserrat', sans-serif;
}

/* Style the buttons that are used to open the tab content */
.tab button {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  transition: 0.3s;
  width:20%;
  font-size:1.5em;
}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #09144f;
}

/* Create an active/current tablink class */
.tab button.active1 {
  background-color: #ff6600;
  font-weight:700;
}

/* Style the tab content */
.tabcontent {
  display: none;

}

.tabcontent {
  animation: fadeEffect 1s; /* Fading effect takes 1 second */
}

/* Go from zero to full opacity */
@keyframes fadeEffect {
  from {opacity: 0;}
  to {opacity: 1;}
}

.ngg-slider { max-height:500px; height:100%; }
/* responsive CSS on a per project basis
================================*/
@media only screen and (max-width: 1650px) {
	header img { max-width:350px; }
	.ngg-logo img { width:100%; max-width:500px; }
}

@media only screen and (max-width: 1350px) {
	header img { max-width:300px; }
	.ngg-nav ul li, .ngg-nav2 ul li { font-size:1.1em; }
	.ngg-nav2 { top:40px; }
}

@media only screen and (max-width: 1260px) {
	.ngg-nav ul li, .ngg-nav2 ul li { margin-right:10px; }
	header { padding:20px 2% 10px; min-height:70px; }
	.navbar { margin-top:0px; }
	.navbar a { font-size:16px; padding:14px 7px 0; }
}

@media only screen and (max-width: 1000px) {
	.ngg-nav ul li, .ngg-nav2 ul li { display:block; padding:1% 3%; margin-right:0; }
	.ngg-nav a:hover, .ngg-active, .ngg-nav2 a:hover, .ngg-active2 { text-decoration:none; }
	.ngg-active { background-color:#333; }
	.ngg-active2 { background-color:#ccc; }
	.ngg-nav, .ngg-nav2 { position:relative; right:0; width:100%; }
	header img { display:block; margin:0 auto; max-width:220px; }
	.ngg-nav { position:relative; margin:0% 0 5%; top:0; }
	.ngg-nav2 { position:relative; margin:0% 0 5%; padding-bottom:5%; }
	.ngg-logo img { display:none; }
	.hero-logo { display:block; max-width:252px; margin:auto; }
	.ngg-4col h3 { border-bottom:0; margin-bottom:0; min-height:0; }
	.ngg-4col { flex-wrap:wrap; }
	.ngg-4col div { width:40%; padding:5% 3%; }
	.navbar a { padding:20px 14px 0; }
}

@media only screen and (max-width: 768px) {
	header { padding:20px 0 10px; }
	.ngg-2col { float:none; width:90%; padding:0% 5% 0; }
	.ngg-program { padding:2% 5%; }
	.ngg-title { font-size:1.8em; padding:5% 0; }
	.ngg-30col { display:block; width:100%; margin-bottom:5%; }
	.ngg-cta { max-width:180px; padding:10px; font-size:1.5em; }
	.ngg-footer h3 { font-size:1.65em; padding:5%; }
	.ngg-slide-details { width:100%; position:relative; top:10%; z-index:1; padding:5% 5% 8%; }
	.ngg-slide-details p, .ngg-slide-details li, .ngg-feature p { font-size:14px; }
	.ngg-slide-details h3 { font-size:1.25em; }
	.swiper-slide {  }
	.swiper-slide img { position:unset; top:0; opacity:1; z-index:0; width:30%; }
	.ngg-slide-img {}
	.swiper-button-next, .swiper-button-prev { display:none; }
	.ngg-reviews img { width:100%; }
	.ngg-feature p { padding:3%; }
	.column { width:30%; }
	.ngg-vid { width:100%; }
	.ngg-vid h3 { padding:4% 4% 0; }
	.ngg-vid p { padding:2% 4% 4%; }
	.ngg-bullets { display:none; }
	.ngg-nav2 li a:not(:first-child) { display:none; }
	.ngg-nav2 li a.ngg-navicon { float:right; display:block; }
	.ngg-nav2.responsive { position:relative; }
	.ngg-nav2.responsive .icon { position:absolute; right:0; top:0; }
	.ngg-nav2.responsive li a { float:none; display:block; text-align:left; }
	.ngg-slide-img2 { width:100% !important; margin:0 0 3%; }
	.ngg-slide-txt { width:100%; }
	.ngg-slide-details { max-height:500px; min-height:0; }
}

@media only screen and (max-width: 550px) {
	/* insert responsive CSS for mobile screens below 550px */
    .items-grid .item-cell { width:90%; text-align:center; border-bottom:1px solid #333; padding-bottom:8%; }
    .item-img > img { max-width:300px; }
	.items-grid .item-title { height:auto; }
	.column { width:28%; }
	.ngg-section { padding:0; }
	.ngg-hero h1 { font-size:2em; }
	.ngg-2col { width:90%; text-align:center; }
	.ngg-4col { flex-direction:column; }
	.ngg-4col h3 { padding:0; min-height:0; border-bottom:0; margin-bottom:3%; }
	.ngg-4col div { width:90%; margin:3% 5% 8%; }
	.ngg-details p { padding:0 0 20px 0; }
	.whyus { font-size:2em; }
	.ngg-nomarg { margin:3%; }
	.ngg-slide-details h4 { padding:0 0 8px; }
	.navbar { margin-top:-80px; }
	.tab button { width:26%; }
	.ngg-col img { margin:1% 5% 5% 0; }
	.ngg-slide-img { width:100% !important; }
	
	
}

@media only screen and (min-width: 375px) {
	/* insert responsive CSS for screens above 375px */
}
@media only screen and (min-width: 481px) {
	/* insert responsive CSS for screens above 481px */
}
@media only screen and (min-width: 641px) {
	/* insert responsive CSS for screens above 641px */
	.banner { padding-top: 21.96%; }
	.banner-img {
		background-position:100% 0;
		background-size: 152.7086383601757%;
	}	
}
@media only screen and (min-width: 769px) {
	/* insert responsive CSS for screens above 769px */
		.items-grid .item-cell { width: 22%; }

}
@media only screen and (min-width: 1025px) {
	/* insert responsive CSS for screens above 1025px */
}