/* The Modal (background) */
.modal_boutiq_sz_block {
    display: none; 
    /* Hidden by default */ 
    position: fixed;
    z-index: 9999; 
    /* Sit on top */ 
    left: 0; 
    top: 0; 
    width: 100%; 
    /* Full width */ 
    height: 100%; 
    /* Full height */ 
    overflow: auto; 
    /* Enable scroll if needed */ 
    background-color: rgb(0,0,0); 
    /* Fallback color */ 
    background-color: rgba(0,0,0,0.4); 
    /* Black w/ opacity */ 
}

/* Hide scrollbar for Chrome, Safari and Opera */
.modal_boutiq_sz_block::-webkit-scrollbar {
  display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
.modal_boutiq_sz_block {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

/* Modal Container */ 
.modal_size_chart_container_block {
  position: relative; 
  width: 80%; 
  max-width: 800px; 
  margin: 15% auto;
  transition: margin 0.5s ease-in-out;
}

@media screen and (max-width: 600px) {
  .modal_size_chart_container_block {
    width: 96%;
  }
}

.modal_size_chart_container_block .content {
  font-family: -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,'Open Sans','Helvetica Neue',sans-serif;
  line-height: 1.4;
  word-wrap: break-word;
}

.modal_size_chart_container_block .content p {
  display: block;
  margin-block-start: 1em;
  margin-block-end: 1em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  line-height: 22.4px;
  font-size: 16px;
  color: rgba(32, 34, 35, 1);
}

.modal_size_chart_container_block .content h1 {
  display: block;
  font-size: 32px;
  margin-block-start: 0.67em;
  margin-block-end: 0.67em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  font-weight: bold;
  color: rgba(32, 34, 35, 1);
  line-height: 44.8px;
}

.modal_size_chart_container_block .content h2 {
  display: block;
  font-size: 24px;
  margin-block-start: 0.83em;
  margin-block-end: 0.83em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  font-weight: bold;
  line-height: 33.6px;
  color: rgba(32, 34, 35, 1);
}

.modal_size_chart_container_block .content h3 {
  display: block;
  font-size: 18.72px;
  margin-block-start: 1em;
  margin-block-end: 1em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  font-weight: bold;
  line-height: 26.208px;
  color: rgba(32, 34, 35, 1);
}

.modal_size_chart_container_block .content h4 {
  display: block;
  font-size: 18px;
  margin-block-start: 1.33em;
  margin-block-end: 1.33em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  font-weight: bold;
  color: rgba(32, 34, 35, 1);
}

.modal_size_chart_container_block .content h5 {
  display: block;
  font-size: 13.28px;
  margin-block-start: 1.67em;
  margin-block-end: 1.67em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  font-weight: bold;
  line-height: 18.592px;
  color: rgba(32, 34, 35, 1);
}

.modal_size_chart_container_block .content h6 {
  display: block;
  font-size: 10.72px;
  margin-block-start: 2.33em;
  margin-block-end: 2.33em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
  font-weight: bold;
  line-height: 15.008px;
  color: rgba(32, 34, 35, 1);
}

.modal_size_chart_container_block .content pre {
  display: block;
  font-family: monospace;
  white-space: pre;
  margin: 13px 0px;
  line-height: 18.2px;
  color: rgba(32, 34, 35, 1);
}

/* Modal Content/Box */ 
.modal_size_chart_content_block { 
    width: 100%;
    background-color: #fefefe;  
    padding: 30px 20px 20px 20px; 
    border-radius: 10px;
    color: rgba(32, 34, 35, 1);
    overflow: hidden;
}

/* mobile */
@media screen and (max-width: 600px) {
  .modal_size_chart_content_block {
    padding: 30px 10px 10px 10px; 
  }
}

.modal_boutiq_sz_block .modal_size_chart_content_block img {
  max-width: 100%;
  height: 100%;
}

/* The Close Button */ 
#close_size_chart_modal_block { 
    position: absolute;
    top: -60px;
    right: -4px;
    color: #666; 
    font-size: 50px; 
    font-weight: bold; 
    height: 60px;
    overflow: hidden;
    width: 29px;
}

#close_size_chart_modal_block:hover, #close_size_chart_modal_block:focus { 
    color: black; 
    text-decoration: none; 
    cursor: pointer; 
}

img.size-chart-icon-dsize {
  max-width: 32px;
}

/* Styles Options */

/* zebraStripedTable */
.zebraStripedTable {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
    border: 1px solid #ddd;
}

.zebraStripedTable td {
    text-align: left;
    padding: 6.4px;
    border: 1px solid #ddd;
}

.zebraStripedTable tr:nth-child(even) {
    background-color: #f2f2f2;
}

/* darkHover */

.darkHover {
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
  border: 1px solid #2b3035;
}

.darkHover td {
  text-align: left;
  padding: 6.4px;
}

.darkHover tr {
  background-color: #343a40;
  color: #ffffff;
  border-bottom: 1px solid #2b3035;
}

.darkHover tr:hover {
  color: #ffffff;
  background-color: #292e32;
}

/* darkHeading */
.darkHeading {
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
}

.darkHeading td {
  text-align: left;
  padding: 6.4px;
}

.darkHeading tr:first-child {
	background-color: #282a35;
  color: white;
  border: 1px solid #282a35;
}

.darkHeading tr {
  background-color: #e7e9eb;
  border: 1px solid #dedfe1;
}

.darkHeading tr:nth-child(even) {
    background-color: #f2f2f2;
}

/* crimsomPink */
.crimsomPink {
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
  border: 1px solid #dd4a68;
}

.crimsomPink td {
  text-align: left;
  padding: 6.4px;
}

.crimsomPink tr {
	background-color: crimson;
    color: white;
}

.crimsomPink tr:nth-child(even) {
  background-color: #dd4a68;
}

/* Pink */
.pink {
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
  border: 1px solid #f14a6cd9;
}

.pink td {
  text-align: left;
  padding: 6.4px;
}

.pink tr {
	background-color: #f14a6cd9;
  color: white;
}

.pink tr:nth-child(even) {
  background-color: #f15978c2;
}

/* bordered */
.bordered {
  border-collapse: collapse;
  border-spacing: 0;
  width: 100%;
}

.bordered td {
  text-align: left;
  padding: 6.4px;
  border: 1px solid #ddd;
}

/* custom */
.custom { 
  border-collapse: collapse; 
  border-spacing: 0;
  width: 100%; 
  line-height: 1.4; 
  font-size: 16px; 
} 

.custom td { 
  padding: 6.4px; 
}

/* Btn styles */
/* zebraStripedTableBtn */
.zebraStripedTableBtnCm, .zebraStripedTableBtnIn { 
  background: #f2f2f2; 
  border: 1px solid #ccc; 
  cursor: pointer; 
  padding: 12px; 
  border-radius: 6px; 
  font-weight: bold; 
} 

.zebraStripedTableBtnIn { 
  margin-left: 5px; 
} 

.zebraStripedTableBtnCm:active, .zebraStripedTableBtnIn:active { 
  border: 1px solid #7c7c7c; 
}

/* darkHoverBtn */
.darkHoverBtnCm, .darkHoverBtnIn {
  background: #343a40; 
  color: #ffffff; 
  border: 1px solid #2b3035; 
  cursor: pointer; 
  padding: 12px; 
  border-radius: 6px; 
  font-weight: bold; 
} 

.darkHoverBtnIn {
  margin-left: 5px; 
} 

.darkHoverBtnCm:focus, .darkHoverBtnIn:focus { 
  border: 1px solid #000000; 
}

/* darkHeadingBtn */
.darkHeadingBtnCm, .darkHeadingBtnIn { 
  background: #e7e9eb; 
  color: #000000; 
  border: 1px solid #dedfe1; 
  cursor: pointer; 
  padding: 12px; 
  border-radius: 6px; 
  font-weight: bold; 
} 

.darkHeadingBtnIn { 
  margin-left: 5px; 
} 

.darkHeadingBtnCm:active, .darkHeadingBtnIn:active { 
  border: 1px solid #282a35; 
}

/* crimsomPinkBtn */
.crimsomPinkBtnCm, .crimsomPinkBtnIn { 
  background: crimson; 
  color: #ffffff; 
  border: 1px solid #dd4a68; 
  cursor: pointer; 
  padding: 12px; 
  border-radius: 6px; 
  font-weight: bold; 
} 

.crimsomPinkBtnIn { 
  margin-left: 5px; 
} 

.crimsomPinkBtnCm:active, .crimsomPinkBtnIn:active { 
  border: 1px solid #ff0047 
}

/* pinkBtn */
.pinkBtnCm, .pinkBtnIn { 
  background: #f15978c2; 
  color: #ffffff; 
  border: 1px solid #f14a6cd9; 
  cursor: pointer; 
  padding: 12px; 
  border-radius: 6px; 
  font-weight: bold; 
} 

.pinkBtnIn { 
  margin-left: 5px; 
} 

.pinkBtnCm:active, .pinkBtnIn:active { 
  border: 1px solid #ff0047 
}

/* borderedBtn */
.borderedBtnCm, .borderedBtnIn { 
  background: #ffffff;
  color: #222; 
  border: 1px solid #ccc; 
  cursor: pointer; 
  padding: 12px; 
  border-radius: 6px; 
  font-weight: bold; 
} 

.borderedBtnIn { 
  margin-left: 5px; 
} 

.borderedBtnCm:active, .borderedBtnIn:active { 
  border: 1px solid #7c7c7c; 
} 

/* customBtn */
.customBtnCm, .customBtnIn { 
  background: #ffffff;
  color: #222; 
  border: 1px solid #ccc; 
  cursor: pointer; 
  padding: 12px; 
  border-radius: 6px; 
  font-weight: bold; 
} 

.customBtnIn { 
  margin-left: 5px; 
} 

.customBtnCm:active, .customBtnIn:active { 
  border: 1px solid #7c7c7c; 
} 


/* Select styles */
/* zebraStripedTableSelect */
select.zebraStripedTableSelect:focus-visible { 
  outline: none; 
} 

select.zebraStripedTableSelect { 
  background: #f2f2f2; 
  border: 1px solid #ccc; 
  padding: 12px; 
  font-weight: bold; 
  border-radius: 2px; 
  margin-bottom: 15px; 
}

/* darkHoverSelect */
select.darkHoverSelect:focus-visible { 
  outline: none; 
} 

select.darkHoverSelect { 
  background: #343a40; 
  color: #ffffff; 
  border: 1px solid #2b3035; 
  padding: 12px; 
  font-weight: bold; 
  border-radius: 2px; 
  margin-bottom: 15px; 
} 

/* darkHeadingSelect */
select.darkHeadingSelect:focus-visible { 
  outline: none; 
} 

select.darkHeadingSelect { 
  background: #e7e9eb; 
  border: 1px solid #dedfe1; 
  padding: 12px; 
  font-weight: bold; 
  border-radius: 2px; 
  margin-bottom: 15px; 
}

/* crimsomPinkSelect */
select.crimsomPinkSelect:focus-visible { 
  outline: none; 
} 

select.crimsomPinkSelect { 
  background: crimson; 
  color: #ffffff; 
  border: 1px solid #dd4a68; 
  padding: 12px; 
  font-weight: bold; 
  border-radius: 2px; 
  margin-bottom: 15px; 
} 

/* pinkSelect */
select.pinkSelect:focus-visible { 
  outline: none; 
} 

select.pinkSelect { 
  background: #f15978c2; 
  color: #ffffff; 
  border: 1px solid #f14a6cd9; 
  padding: 12px; 
  font-weight: bold; 
  border-radius: 2px; 
  margin-bottom: 15px; 
} 

/* borderedSelect */
select.borderedSelect:focus-visible { 
  outline: none; 
} 

select.borderedSelect { 
  background: #ffffff;
  border: 1px solid #ccc; 
  padding: 12px; 
  font-weight: bold; 
  border-radius: 2px; 
  margin-bottom: 15px; 
}

/* customSelect */
select.customSelect:focus-visible { 
  outline: none; 
} 

select.customSelect { 
  background: #ffffff;
  border: 1px solid #ccc; 
  padding: 12px; 
  font-weight: bold; 
  border-radius: 2px; 
  margin-bottom: 15px; 
}