		
.application-sku-table-container {
    flex: 1;
}

/* Table */


/* Header styles */
.brand-header {
    background-color: #a5d6a7 !important;
    font-weight: bold;
	color: #000000 !important
}

.pristine-brand {
    background-color: #00205B !important;
    color: #ffffff !important
}

.emigrain-brand {
    background-color: #007749 !important;
    color: #ffffff !important
}

.albaker-brand {
    background-color: #ba0c2f !important;
    color: #ffffff !important
}
		
.swarna-brand {
    background-color: #FFC72C !important;
    color: #000000 !important
}

.empty-brand {
    background-color: #000 !important;
    color: #000000 !important
}

.alawal-brand {
    background-color: #CD7925 !important;
    color: #000000 !important
}
/* Cells */

.table td, .table th {
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
	background-color: #fef8de;
}

/*
.table td {
    width: 40px;
    height: 50px
}
*/
.table td {
	width: 50px;
    height: 50px;
    min-width: 50px;
    min-height: 50px
}
.tick {
/*	width: 40px;*/
    background-color: #00764A !important;
    color: #fff;
    font-weight: bold;
	padding: 0 !important
}
.tick a{
	display: block;
	padding: .5rem .5rem
}
.tick a img{
	width: 40px;
	transform: scale(1);
	transition: all 0.2s ease
}
.tick a:hover img{
	transform: scale(1.1)
}
.app-name {
    text-align: left !important;
    padding-left: 1rem !important;
    padding-right: 1rem !important;
	background-color: #FFF5CC!important;
	color: #CD2238 !important;
	position: sticky !important;
    left: 0;
	z-index: 3;
	text-transform: capitalize;
	font-family: "Manrope", sans-serif;
    font-weight: 800;
    font-size: 18px;
	transition: all 0.5s ease
}
.app-name::after, .corner::after{
	content: '';
	position: absolute;
	right: -1px;
	top: 0;
	width: 1px;
	height: 100%;
	background-color: #000;
	z-index: 3
}
.corner::before{
	content: '';
	position: absolute;
	left: 0;
	bottom: -1px;
	width: 100%;
	height: 1px;
	background-color: #000;
	z-index: 3
}
.application-header::after{
	content: '';
	position: absolute;
	left: 0;
	bottom: -1px;
	width: 100%;
	height: 1px;
	background-color: #000;
	z-index: 3
}
.application-header::before {
    content: '';
    position: absolute;
    left: -1px;
    bottom: 0;
    width: 1px;
    height: 100%;
    background-color: #000;
    z-index: 4;
}
table {
	border-collapse: collapse;
}

/* Force all borders to black */
.table,
.table th,
.table td {
  border: none !important;
}
.table th,
.table td {
  border: 1px solid #000!important;
}
	tr{
		border: none !important;
	}
/* Ensure outer border is also black */
.table {
  border: none !important;
	margin: 0 !important
	
}
	.corner-header {
    position: sticky;
    top: 0px;
    left: 0px;
    z-index: 4;
    background-color: #A0E2BA !important;
    font-family: "Manrope", sans-serif;
    font-weight: 800;
    color: #000;
    font-size: 18px;
}
.empty-trow{
	background-color: #000
}
	.corner {
		position: sticky;
		top: 40px;
		left: 0px;
		color: #fff;
		z-index: 4;
/*		background-color: #FEDA3D!important;*/
		background-color: #FFF5CC!important;
		min-width: 300px
}
	.brand-header {
		position: sticky;
		top: 0px;
		z-index: 2;
		font-family: "Manrope", sans-serif;
		font-weight: 800;
		color: #ffffff;
		font-size: 18px;
}
	.application-header {
		min-width: 50px;
		position: sticky;
		top: 40px;
		z-index: 2;
		background-color: #FFF5CC !important;
		text-transform: capitalize;
		font-family: "Manrope", sans-serif;
		font-weight: 700;
		font-size: 18px;
		writing-mode: sideways-lr !important;
		min-height: 300px
}
	.brand-product-name{
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		z-index: auto;
		writing-mode: sideways-lr !important;
}

.application-header{
    color:#fff !important;
    transition: all 0.5s ease
}
.pristine-header{
    color:#00205B !important;
}
.emigrain-header{
    color:#007749 !important;
}
.albaker-header{
    color:#ba0c2f !important;
}
.alawal-header{
    color:#CD7925 !important;
}
.swarna-header{
    color:#FFC72C !important;
}

.pristine-header.active{
	color:#fff !important;
    background-color:#00205B !important
}
.emigrain-header.active{
	color:#fff !important;
    background-color:#007749 !important
}
.albaker-header.active{
	color:#fff !important;
    background-color:#ba0c2f !important
}
.alawal-header.active{
	color:#fff !important;
    background-color:#CD7925 !important
}
.swarna-header.active{
	color:#fff !important;
    background-color:#FFC72C !important
}
.app-name.active{
	color: #fff!important;
	background-color: #CD2238 !important
}

/* Hide scrollbar - Chrome, Safari */
.application-sku-table-wrapper::-webkit-scrollbar {
  display: none;
}

/* Hide scrollbar - Firefox */
.application-sku-table-wrapper {
  scrollbar-width: none;
}

/* Hide scrollbar - IE/Edge */
.application-sku-table-wrapper {
  -ms-overflow-style: none;
}
	.corner-head1{
		writing-mode: sideways-lr;
		position: absolute;
		right: 0;
		top: 50%;
		transform: translateY(-50%)
	}
	.corner-head2{
		position: absolute;
		left: 1rem;
		bottom: 3rem;
	}
	.corner-head3{
		position: absolute;
		left: 1rem;
		bottom: 1rem;
	}
.corner-head1,
.corner-head3{
	font-family: "Manrope", sans-serif;
    font-weight: 800;
    color: #000000;
    font-size: 22px;
	text-transform: uppercase
}
/* Arrow controls */
.scroll-controls {
	width: 45px;
    position: absolute;
    right: 0;
    top: 50%;
	transform: translateY(-50%);
    z-index: 100;
/*
    display: grid;
    grid-template-columns: repeat(3, 45px);
    gap: 3px;
*/
}
.arrow {
    width: 45px;
    height: 45px;
    border: none;
    background-color: #000;
    color: #fff;
    font-size: 20px;
    cursor: pointer;
    border-radius: 0px;
	margin: 0 0 2px 0;
	padding: 0
}
.arrow img{
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
    pointer-events: none;
}
/*
.arrow.up{
	background-image: url("../../assets/images/up-arrow.jpg");
	background-position: left top;
	background-repeat: repeat-x;
	background-size: contain;
}
.arrow.down{
	background-image: url("../../assets/images/downarrow.jpg");
	background-position: left top;
	background-repeat: repeat-x;
	background-size: contain;
}
.arrow.right{
	background-image: url("../../assets/images/right-arrow.jpg");
	background-position: left top;
	background-repeat: repeat-x;
	background-size: contain;
}
.arrow.left{
	background-image: url("../../assets/images/left-arrow.jpg");
	background-position: left top;
	background-repeat: repeat-x;
	background-size: contain;
}
*/
/* Disable selection while dragging */
.no-select {
    user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}

/* Prevent image dragging */
.application-sku-table-wrapper img {
    pointer-events: none;
}


/*Removing extra rows and coloms*/
[id="51-application"] .application-sku-table-wrapper{width: 625px}
[id="51-application"] .application-sku-table-inner{width: 100%}
[id="51-application"] .scroll-controls {display: none}

[id="59-application"] .application-sku-table-wrapper{width: 785px; height: 745px}
[id="59-application"] .application-sku-table-inner{width: 100%}
[id="59-application"] .scroll-controls {display: none}

[id="73-application"] .application-sku-table-wrapper{width: 875px}
[id="73-application"] .application-sku-table-inner{width: 100%}
[id="73-application"] .scroll-controls {display: none}

[id="81-application"].application-content{width: 974px}
[id="81-application"] .application-sku-table-wrapper{width: 911px}
[id="81-application"] .application-sku-table-inner{width: 100%}
[id="81-application"] .arrow.right,
[id="81-application"] .arrow.left{display: none}


[id="93-application"] .application-sku-table-wrapper{width: 631px; height: 688px}
[id="93-application"] .application-sku-table-inner{width: 100%}
[id="93-application"] .scroll-controls {display: none}

[id="100-application"] .application-sku-table-wrapper{width: 1267px; height: 688px}
[id="100-application"] .application-sku-table-inner{width: 100%}
[id="100-application"] .scroll-controls {display: none}

[id="107-application"].application-content{width: 1254px}
[id="107-application"] .application-sku-table-wrapper{width: 1201px}
[id="107-application"] .application-sku-table-inner{width: 100%}
[id="107-application"] .arrow.right,
[id="107-application"] .arrow.left{display: none}

[id="121-application"] .application-sku-table-wrapper{width: 1287px; height: 730px}
[id="121-application"] .application-sku-table-inner{width: 100%}
[id="121-application"] .scroll-controls {display: none}

[id="128-application"] .application-sku-table-wrapper{width: 732px; height: 730px}
[id="128-application"] .application-sku-table-inner{width: 100%}
[id="128-application"] .scroll-controls {display: none}

[id="135-application"] .application-sku-table-wrapper{width: 872px}
[id="135-application"] .application-sku-table-inner{width: 100%}
[id="135-application"] .scroll-controls {display: none}

[id="144-application"] .application-sku-table-wrapper{width: 930px; height: 673px}
[id="144-application"] .application-sku-table-inner{width: 100%}
[id="144-application"] .scroll-controls {display: none}

[id="150-application"] .application-sku-table-wrapper{width: 416px; height: 460px}
[id="150-application"] .application-sku-table-inner{width: 100%}
[id="150-application"] .scroll-controls {display: none}


@media only screen and (max-width: 1680px), only screen and (max-device-width: 1680px) {
	[id="121-application"] .application-sku-table-wrapper {width: 100%; height: 730px}
	[id="121-application"] .scroll-controls {display: block}
	[id="107-application"] .arrow.up,
	[id="107-application"] .arrow.down{display: none}
}
@media only screen and (max-width: 1580px), only screen and (max-device-width: 1580px) {
	[id="51-application"] .application-sku-table-wrapper {width: 625px;height: 697px;}
	[id="59-application"] .application-sku-table-wrapper {width: 785px;height: 697px;}
	[id="73-application"] .application-sku-table-wrapper {width: 875px;height: 695px;}
	[id="93-application"] .application-sku-table-wrapper {width: 631px;height: 646px;}
	[id="100-application"] .application-sku-table-wrapper {width: 100%; height: 646px}
	[id="100-application"] .scroll-controls {display: block}
	[id="100-application"] .arrow.up,
	[id="100-application"] .arrow.down{display: none}
	
	[id="107-application"].application-content {width: 100%;}
	[id="107-application"] .application-sku-table-wrapper {width: 100%;}
	[id="107-application"] .scroll-controls {display: block}
	[id="107-application"] .arrow.right,
	[id="107-application"] .arrow.left{display: block}
	[id="107-application"] .arrow.up,
	[id="107-application"] .arrow.down{display: block}
	
	[id="121-application"] .application-sku-table-wrapper {width: 100%;height: 646px;}
	[id="128-application"] .application-sku-table-wrapper {width: 732px;height: 647px;}
	[id="135-application"] .application-sku-table-wrapper {width: 872px;height: 746px;}
	[id="144-application"] .application-sku-table-wrapper {width: 930px;height: 596px;}
	[id="150-application"] .application-sku-table-wrapper {width: 416px;height: 446px;}
}
@media only screen and (max-width: 1366px), only screen and (max-device-width: 1366px) {
	[id="150-application"] .application-sku-table-wrapper {width: 416px;height: 437px;}
	[id="144-application"] .application-sku-table-wrapper {width: 100%;height: 578px;}
	[id="135-application"] .application-sku-table-wrapper {width: 872px;height: 719px;}
	[id="128-application"] .application-sku-table-wrapper {width: 732px;height: 625px;}
	[id="121-application"] .application-sku-table-wrapper {width: 100%;height: 625px;}
	[id="100-application"] .application-sku-table-wrapper {width: 100%;height: 625px;}
	[id="93-application"] .application-sku-table-wrapper {width: 631px;height: 625px;}
	[id="73-application"] .application-sku-table-wrapper {width: 875px;height: 672px;}
	[id="59-application"] .application-sku-table-wrapper {width: 785px;height: 672px;}
	[id="51-application"] .application-sku-table-wrapper {width: 625px;height: 672px;}
	[id="81-application"].application-content {width: 100%;}
	[id="81-application"] .application-sku-table-wrapper {width: 100%;}
}
@media only screen and (max-width: 1024px), only screen and (max-device-width: 1024px) {
	[id="59-application"] .application-sku-table-wrapper {width: 100%;height: 697px;}
	[id="59-application"] .scroll-controls {display: block;}
	[id="73-application"] .application-sku-table-wrapper {width: 100%;height: 695px;}
	[id="73-application"] .scroll-controls {display: block;}
	[id="128-application"] .application-sku-table-wrapper {width: 100%;height: 647px;}
	[id="135-application"] .application-sku-table-wrapper {width: 100%;height: 746px;}
	[id="135-application"] .scroll-controls {display: block;}
	[id="144-application"] .application-sku-table-wrapper {width: 100%;height: 596px;}
	[id="144-application"] .scroll-controls {display: block;}
}
@media only screen and (max-width: 991px), only screen and (max-device-width: 991px) {
	[id="51-application"] .application-sku-table-wrapper {width: 100%;height: auto;}
	[id="51-application"] .scroll-controls {display: block}
	
	[id="59-application"] .application-sku-table-wrapper {width: 100%;height: auto;}

	[id="81-application"] .arrow.right,
	[id="81-application"] .arrow.left{display: block}


	[id="73-application"] .application-sku-table-wrapper {width: 100%;height: auto;}

	[id="93-application"] .application-sku-table-wrapper {width: 100%;height: auto;}
	[id="93-application"] .scroll-controls {display: block}

	[id="100-application"] .application-sku-table-wrapper {width: 100%;height: auto;}
	[id="121-application"] .application-sku-table-wrapper {width: 100%;height: auto;}
	[id="128-application"] .application-sku-table-wrapper {width: 100%;height: auto;}
	[id="128-application"] .scroll-controls {display: block}
	[id="135-application"] .application-sku-table-wrapper {width: 100%;height: auto;}
	[id="144-application"] .application-sku-table-wrapper {width: 100%;height: auto;}
	[id="150-application"] .application-sku-table-wrapper {width: 100%;height: auto;}
}


