/* NETFLIX CSS */

/* Gradiens */

/* SCSS
$g1: linear-gradient(226.67deg, #78289B -38.52%, rgba(120, 40, 155, 0) 50.26%);
$g2: linear-gradient(226.67deg, #005FE6 -38.52%, rgba(0, 95, 230, 0) 50.26%);
$g3: linear-gradient(226.67deg, #32C896 -38.52%, rgba(50, 200, 150, 0) 50.26%);
$g4: linear-gradient(226.67deg, #B4145F -38.52%, rgba(180, 20, 95, 0) 50.26%);
$g5: linear-gradient(226.67deg, #E50914 -38.52%, rgba(229, 9, 20, 0) 50.26%);
$g6: linear-gradient(226.67deg, #FF7828 -38.52%, rgba(255, 120, 40, 0) 50.26%);
$g7: linear-gradient(226.67deg, #FFC846 -38.52%, rgba(255, 200, 70, 0) 50.26%);

#g-1 { background: $g1; opacity: 1; }
#g-2 { background: $g2; }
#g-3 { background: $g3; }
#g-4 { background: $g4; }
#g-5 { background: $g5; }
#g-6 { background: $g6; }
#g-7 { background: $g7; }
*/

#g-1,#g-2,#g-3,#g-4,#g-5,#g-6,#g-7 {
  opacity: 0;
}
#g-1 {
    background: linear-gradient(226.67deg,#78289b -38.52%,rgba(120,40,155,0) 50.26%);
}
#g-2 {
    background: linear-gradient(226.67deg,#005fe6 -38.52%,rgba(0,95,230,0) 50.26%);
}
#g-3 {
    background: linear-gradient(226.67deg,#32c896 -38.52%,rgba(50,200,150,0) 50.26%);
}
#g-4 {
    background: linear-gradient(226.67deg,#b4145f -38.52%,rgba(180,20,95,0) 50.26%);
}
#g-5 {
    background: linear-gradient(226.67deg,#e50914 -38.52%,rgba(229,9,20,0) 50.26%);
}
#g-6 {
    background: linear-gradient(226.67deg,#ff7828 -38.52%,rgba(255,120,40,0) 50.26%);
}
#g-7 {
    background: linear-gradient(226.67deg,#ffc846 -38.52%,rgba(255,200,70,0) 50.26%);
}

#gradient-container {
  position: fixed;
  top: 1px;
  width: 100vw;
  height: 100vh;
  z-index: 0;
  pointer-events: none;
}

.gradient {
  position: absolute;
  width: 100vw;
  height: 100vh;
  transition: opacity 1s ease;
  opacity: 0;
  mix-blend-mode: normal;
}


/*REQUIRED FOR FOOTER AT BOTTOM */
html, body {
	height: 100%;
	font-family: "Netflix Sans", Helvetica, sans-serif;
  	font-weight: 400;
	font-size: 18px;
  color: #fff;
}

#mainContainerSF {
	min-height: 100%;
  	/*background: linear-gradient(226.67deg,#005fe6 -31.52%,rgba(0,95,230,0) 18.26%) !important;*/
    background-attachment: fixed;
}

#mainContentSF {
	padding-bottom: 100px !important; /* Must match height of footer (compensate for MoreHTML Body and other spacing variation in screen height) */
	max-width: 1824px;
	width: 99% !important;
}

/*** FOOTER***/
footer {
	position: relative;
    width: 100%;
    margin-top: -100px;
    clear: both;
    padding: 0 0 30px 0;
    background: transparent;
    height: 100px;
  	color: #fff;
}

/* End Footer*/


body {
	margin: 0 auto;
	height: 100%;
	background-color: #000 !important; /* netflix website BG color #010A1D */
	background-repeat: no-repeat;
	overflow-x: hidden;
}

.h3, h3 {
 font-weight: 500; 
}

.tag {
	color: #666666;
	font-size: 9px;
	line-height: 1.2em;
}

.boldbody {
	color: #000000;
	font-size: 16px;
	font-weight: bold;
	line-height: 1.2em;
}

.smallbody {
	color: #fff;
  font-size: 16px;
}

.login {
	font-size: 16px;
	font-style: 400;
	width: 100%;
	background-color: transparent;
	padding:8px;
	color: #000;
}

a.login {
	color: #fff;
	text-decoration: none;
	font-weight: 400;
	padding-right: 8px;
	padding-left: 8px;
	text-transform: capitalize;
}

a.login:hover {
	color: #000;
	text-decoration:none;
	background-color: transparent;
}

.loginWelcome, .loginLogout {
	background-color: transparent;
}

.loginWelcome span {
	float: right !important;
  	display: none;
}

.loginLogout {
  background: #fff;
  border-radius: 5px;
}
.loginLogout:hover {
 	background: #fff; 
}

.loginLogout a {
 	color: #000; 
  	font-weight: bold;
}

.tableLogin {
	position: absolute;
  
    float: right;
    width: 400px;
    top: 14px;
    right: 8px;
    z-index: 100;
    border: none;
}

.tableMain {
	position: relative;
	top: -30px;
	z-index: 2;
	width: 100%;
	background-color: transparent;
	padding: 10px 0;
}

.tableSiteBanner {
	position: relative;
	height: 80px;
  	width: 100%;
  	padding: 0 15px;
}

.tableSiteBanner img {
	z-index: 2;
	float: inherit;
	position: relative;
	height: 28px;
    margin: 18px 0;
}

.mainContentNB {
	color: #000000;
	padding-left: 15px;
	width: 745px;
}

a,
.infoBox a,
.ui-widget-header a {
	color: #E50813;
	text-decoration: none;
}

a:hover,
.infoBox a:hover,
.dataTable a:hover, 
.dtContent a:hover {
	color: #C1101A;
	text-decoration: underline;
}

.anchor a{
	text-decoration: none;
}

.anchor a:hover 
	text-decoration: underline;
}

/******************************************************************************************
* DTSS ADDED - HTML for Menu, Footer, Checkout, Etc. *
*******************************************************************************************/

#headerBG {
 	position: absolute;
  	border-bottom: 1px solid rgba(255,255,255,0.25);
  	width: 100%;
  	height: 64px;
  	top: 0;		
 	z-index: 0;
  
  	/*backdrop-filter: blur(6px);
    background-color: rgba(0,0,0,.5);
 	transition: background-color .5s,top .5s;
    transition-delay: .15s;
  */
  	background: #000;
}

#mmc {
 	position: absolute;
    font-size: 18px;
    left: 118px;
    padding: 10px;
    top: 10px; 
  	z-index: 1;
  	color: #fff;
}

#headerInfoBar {
	position: relative;
	background: #E50813;
	width: 100%;
	height: 40px;
	color: #fff;
	font-size: 16px;
	line-height: 40px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 1.7px;
}

/* Main Navigation Menu */

#navWrapper {
	float: right;
    position: relative;
    top: -65px;
    margin: 0 0 0 135px;
    z-index: 101;
    right: 103px;
}

#menu {
	width: 100%;
	background: transparent;
	position: relative;
}

#menu li {
	float: left;
	text-align: left;
	margin: 0 10px;
	position: relative;
	display: inline;
  	border: 1px solid #fff;
  	border-radius: 5px;
  	background: #fff;
}

#menu li a {
	font-size: 16px;
    font-weight: 500;
    color: #000;
    padding: 10px;
    line-height: 33px;
    text-decoration: none;
    text-transform: capitalize;
}

#menu li a:hover,
#menu li.menuG a,
#menu li:hover > a {
	text-decoration:none;
	color: #000;
}
#menu li:hover,
#menu li.menuG {  
	background: #fff;
}

/*#menu li.menuG a:before {
	content: '';
	position: absolute;
	right: 15px;
	left: 15px;
	background-color: #E50813;
	top: 28px;
	height: 1px;
}*/

#menu li:last-child a {

}
#menu li.linkA {
 	margin-right: 0; 
}
/* END Main Navigation Menu */

/* LOGIN BOX*/
#bigbox {
    background-color: #141414;
    border: 1px solid rgba(255,255,255,0.25);
    border-radius: 10px;
    box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.25);
    padding: 20px;
}
/* END Login Box */

/*CATEGORY HEADER TEXT*/
.source,
.style1 {
	color: #E50813;
	font-size: 16px;
	font-weight: 600;
}
.pw-img,
.fa, .fas, .far, .fal {
  color: #E50813;
}

.fad {
    --fa-primary-color: #E50813;
    --fa-primary-opacity: 0.4;
    --fa-secondary-color: #E50813;
    --fa-secondary-opacity: 1;
}

/* FOOTER*/
.footer_content {
	width: 100%;
	max-width: 1824px;
	margin: 0 auto;
   color: #fff;
}
.footer_parag {
 margin-top: 16px;
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    color: #979797; 
}
.footer_parag a {
 	font-weight: 500; 
  	color: #fff !important;
}
#footerBottom {
	height: 68px;
}

/* End Footer*/

#catalogWrap,
.prodCell {
	border: none;
}
#products {
  border: none;
}
#customizeTbl {
  background: transparent;
}

#show_userform table td {
 	padding: 5px 0; 
}

/* CHECKOUT HEADER*/

.tableCheckoutHeader {
	display: block;
	float: inherit;
	position: relative;
	top: -20px;
	margin-left: auto;
	margin-right: auto;
	background-color: transparent;
	z-index: 3;
}

.tableCheckoutHeader img {
	padding-left: 120px;
}
/* END Checkout Header*/

p.style1 {
	color: #444;
	font-size: 25px;
	font-weight: bold;
}

/******************************************************************************************
* PRODUCT SIDE MENU *
*******************************************************************************************/

#TCtable {
	background: none;
	padding: 0;
}

#TCtable td {
	background: none;
}

.TCCaption {
	color: #BDBDBD;
	font-style: italic;
}

ul.TreeControl {
	float: inherit;
	position:relative;
	padding: 10px;
}

ul.TreeControl {
	color: #ffffff;
}

ul.TreeControl li.TCopen div.anchorCatalog,
ul.TreeControl li.TCclosed div.anchorCatalog {
  /* HIDE FOR NETFLIX TO MATCH PAGE DNA */
  display: none;
	float:inherit;
	position:relative;
	color:#fff;
	font-size: 16px;
	font-weight: 400;
	padding: 0;
	border: none;
	background: #E50813; /* Old browsers */
	margin-bottom: 5px;
	text-align: left;
	height: 42px;
	line-height: 42px;
}

ul.TreeControl li {
	list-style: none;
}

ul.TreeControl,
ul.TreeControl ul,
ul.TreeControl li {
	margin-bottom: 5px;
	padding: 0;
	font-size: 10pt;
}

ul.TreeControl li a  {
	cursor: pointer;
	text-decoration: underline;
	color: #000000;
}

ul.TreeControl li a:hover {
	cursor: pointer;
	text-decoration: underline;
	color: #224390;
}

ul.TreeControl li.TCopen a {
	list-style: none;
	background: none;
	text-decoration: none;
	color: #fff;
}

ul.TreeControl li.TCclosed a {
	list-style: none;
	background: none;
	text-decoration: none;
	color: #fff;
}

ul.TreeControl li.TCbullet {
	padding: 4px 10px 4px;
	font-size: 13px;
	line-height: 18px;
	color: #fff;
	text-align: left;
	vertical-align: middle;
	cursor: pointer;
  	border-left: 6px solid transparent;
}

ul.TreeControl li#active {
	border-left: 6px solid #E50813;
}
ul.TreeControl li#active a {
 	font-weight: 700; 
}

ul.TreeControl li.TCbullet a {
	list-style: disc; background: none;
	color: #fff;
	padding: 0;
	margin: 0;
	font-size: 17px;
	line-height: 25px;
	margin-bottom: 0px;
	text-align: left;
}
ul.TreeControl li.TCbullet a:hover {
	color: #fff;
}

ul.TreeControl li.TCopen ul {
	display: block;
}

ul.TreeControl li.TCclosed ul {
	display: none;
}

/* CATALOG */
#product {
     width: 1005px;
    margin: 0 auto; 
}

/******************************************************************************************
* END DTSS ADDED - PRODUCT SIDE MENU *
*******************************************************************************************/

.shopping_cart_icon path {
	fill: #456888;
}

#cartCountBadge {
	background: #456888;
}

.catalogTbl {
	background-color: transparent;
	padding: 0 !important;
}

/*******************************************************************************************
* Shopping Cart *
*******************************************************************************************/

#cartIcon {
	color: #fff;
	position: absolute;
	right: 4px;
	padding: 0;
	font-size: 20pt;
}

#cartCountBadge {
	background: transparent;
    position: absolute;
    right: 0;
    margin: 0;
    border-radius: 100px;
    padding: 0px 2px;
    line-height: 30px;
    border: none;
    right: -26px;
    font-size: 24px;
}

#cartDesc {
	display: none;
}

#cartCount {
	background: transparent;
	border: none;
}

#cartContainer.floatClass {
	top: 0;
  	right: 255px;
    z-index: 1;
}

.checkoutProgress {
	top: -30px;
}

/* cart image */
.tblImage {
	border: 1px solid #CCCCCC;
}

.tblImage td {
	background-color: #FFFFFF;
	padding: 0em;
	margin: 0em;
	text-align: center;
	vertical-align: middle;
}

#checkoutProceedButton button {
 	background: #E50813 !important; 
}

#checkoutProceedButton button:hover {
 	background: #C1101A !important;  
}

h3,
.h3,
.ui-box,
.ui-box section table,
.BToolTip,
.ui-box header strong,
.infoBox th.ui-state-default, .infoBox th.ui-state-default table {
	font-size: 16px !important;
}

/* Change for Dark Mode */

.crumbs li a, .crumbs li a:link, .crumbs li a:visited,
#breadcrumb i, .ui-box i, #prodRadio i,
#breadcrumb li.templateName a,
#breadcrumb li a:hover i:before,
.crumbs li.active a {
 	color: #fff; 
}
ul#listbigger li:hover a, ul#listbigger li:hover {
 background: #fff;
  border-color: #fff;
  color: #000;
}

#quickLinks header,
.ui-box header,
.ui-box header.dark {
 	border:	1px solid #fff; 
  	color: #fff;
  	background: transparent;
}
.ui-box header table {
	color: #fff;
}
.ui-box section,
ul#listbigger li a, ul#listbigger li a span {
 background: transparent;
  border-color: #fff;
  color: #fff;
}

#shoppingCartTbl {
 	background: transparent; 
}

button, .jquery-button, .jqButton, .dt-button
{
 	border-color: #E50813 !important;
  	background: #E50813 !important;
  	color: #fff !important;
  	font-size: 16px !important;
  	text-transform: capitalize;
}
button:hover, .jquery-button:hover, .jqButton:hover, .dt-button:hover {
  border-color: #E50813 !important;
  background: #E50813 !important;
  color: #fff !important;
}
button:before, .jquery-button:before, .jqButton:before, .dt-button:before {
 	color: #fff; 
}

button:hover:before, .jquery-button:hover:before, .jqButton:hover:before, .dt-button:hover:before {
	color: #fff;
}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
  background: #E50813 !important;
  color: #fff !important;
}
.checkoutProgress .circle.active .label {
 	background: #E50813 !important; 
}
.checkoutProgress .circle.active .title {
  	color: #E50813 !important; 
}

.checkoutCell {
 	background: transparent; 
}

#searchbar input[type="text"] {
 	background: #444 !important;
  	color: #fff !important;
}

/* Common Breadcrumb */
.crumbs li.active a,
.crumbs li.active a i {
  color: #E50813 !important;
}

/*.ui-dialog-buttonset button, .ui-dialog-buttonset button:before {
 color: #000 !important; 
}
.ui-dialog-buttonset button:hover, .ui-dialog-buttonset button:hover:before {
 color: #fff !important; 
}*/

/* table sorter */

.tablesorter,
.tablesorter tbody tr:nth-child(even) td,
.tablesorter tbody tr:nth-child(odd) td,
.tablesorter th {
  background: transparent !important;
  color: #fff;
  border: 1px solid #fff;
  border-collapse: separate;
border-spacing: 0;
}
th.ui-state-default:hover {
  background: transparent !important;
  color: #fff;
  text-decoration: underline;
}
table.tablesorter thead tr:hover, .header:hover, table.tablesorter thead tr .headerSortDown, table.tablesorter thead tr .headerSortUp
{
   background: transparent !important;
  color: #fff;
  text-decoration: underline;
}
.finishing_task_editor_header {
 	color: ##fff !important; 
  	background: transparent;
}
.finishing_task_editor,
.finishing_task_editor_row_a,
.finishing_task_editor_row_b {
 	background: transparent;
  	border: 1px solid #fff;
}
#jobLineItemDescription td {
 	border: none;
}

/* Data Tables */

#dataTable,
.dataTable,
#datatable th,
#datatable td,
table.dataTable tbody tr,
table.dataTable.stripe tbody tr.odd, table.dataTable.display tbody tr.odd,
#btnReorder,
div.list div.prodCell.e 
{
  background: transparent !important; 
  	color: #fff !important;
}


.infoBox {
  	background: transparent !important;
  	color: #fff;
  	border: 1px solid #fff;
}	

.infoBox th,
.infoBox td,
.ui-widget-header {
 	background: transparent !important; 
  	color: #fff !important;
}
.infoBox th {
 	border-bottom: 1px solid #fff !important; 
}

/* Size */
#shipInstructions,
#PorCAddress,
#addressBook,
#newAddress {
 	max-width: 1000px;
  	width: 100%;
}

#ship {
 	margin: 20px 0 0 0; 
}

/* inputs */

input,
select,
textarea {
 border: 1px solid #fff !important;
  /*background: transparent !important;
  color: #fff !important;*/
  color: #fff !important;
    background: rgba(255,255,255,0.25) !important;
    height: 25px;
    border-color: rgba(255,255,255,0.75) !important;
}
input:placeholder,
select:placeholder,
textarea:placeholder {
 color: rgba(255,255,255,0.5); 
}

input[type="radio"] {
 accent-color: red; 
}

.icon-container label,
.uploadifive-button,
.ui-widget-content {
  color: #fff !important;
}
#searchbar input[type="text"] {
	height: inherit !important;
}
/* added MS */
select,
.ui-select-menu,
select[name="datatable_length"] {
	font-family: inherit;
	font-weight: normal;
	font-size: 16px; /* changed from 12px */
	border: 1px solid #aaa;
	border-radius: 4px;
	color: #222222;
	padding: 2px 0;
}
.item_table .jquery-button {
    width: 180px;
    float: right;
}

/* end added MS */
/* datepicker */

#ui-datepicker-div,
.ui-datepicker .ui-datepicker-title,
#ui-datepicker-div .ui-state-default
{
 	background: #000 !important; /* changed from color: #000 !important; */
}
/* Added MS */
.ui-box section a, .ui-box header table a, .ui-box header a, .ui-box + .tablesorter a {
    color: #E50813;
    text-decoration: none;
    font-size: 16px;
    line-height: 20px;
}

/* end added MS */

#customizePager td:first-child {
 	max-width: 250px; 
}

/*.tablesorter, .tablesorter tbody tr:nth-child(even) td, .tablesorter tbody tr:nth-child(odd) td, .tablesorter th,
.ui-widget.ui-widget-content,
.ui-dialog-buttonpane,
.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited, a.ui-button, a:link.ui-button, a:visited.ui-button, .ui-button,
.dataTable tr.e, .dtContent tr.e, .dataTable tr.o, .dtContent tr.o {
	background: #000 !important;
  color: #fff;
}*/

/* HIDE */
#menu .linkS, 
#menu .linkH,
#FooterStyle {display: none;}
.checkoutCell:nth-child(even) { display: none; }
/* added MS */ 
#printRepInfo {
    display: none;
}
#billToBox,
#orderStatusPriceMSG,
#login_remember,
#shipToCompany {display: none;}

