@font-face {font-family: "SST Light"; 
  src: url("https://www.layerstack.com/assets/webfonts/sst-light/73a27b2c4983dad8b83238ff09ba4e69.eot"); 
  src: url("https://www.layerstack.com/assets/webfonts/sst-light/73a27b2c4983dad8b83238ff09ba4e69.eot?#iefix") format("embedded-opentype"), 
  url("https://www.layerstack.com/assets/webfonts/sst-light/73a27b2c4983dad8b83238ff09ba4e69.woff2") format("woff2"), 
  url("https://www.layerstack.com/assets/webfonts/sst-light/73a27b2c4983dad8b83238ff09ba4e69.woff") format("woff"), 
  url("https://www.layerstack.com/assets/webfonts/sst-light/73a27b2c4983dad8b83238ff09ba4e69.ttf") format("truetype"), 
  url("https://www.layerstack.com/assets/webfonts/sst-light/73a27b2c4983dad8b83238ff09ba4e69.svg#SST Light") format("svg"); 
} 

@font-face {font-family: "Quicksand Medium"; src: url("http://db.onlinewebfonts.com/t/5ea14c7604b767ce90150994f4d74581.eot"); 
  src: url("https://www.layerstack.com/assets/webfonts/quicksand-medium/5ea14c7604b767ce90150994f4d74581.eot?#iefix") format("embedded-opentype"), 
  url("https://www.layerstack.com/assets/webfonts/quicksand-medium/5ea14c7604b767ce90150994f4d74581.woff2") format("woff2"), 
  url("https://www.layerstack.com/assets/webfonts/quicksand-medium/5ea14c7604b767ce90150994f4d74581.woff") format("woff"), 
  url("https://www.layerstack.com/assets/webfonts/quicksand-medium/5ea14c7604b767ce90150994f4d74581.ttf") format("truetype"), 
  url("https://www.layerstack.com/assets/webfonts/quicksand-medium/5ea14c7604b767ce90150994f4d74581.svg#Quicksand Medium") format("svg"); 
} 

@font-face {font-family: "DigitalW00"; 
  src: url("https://www.layerstack.com/assets/webfonts/digitalw00/99d83ce639db8eabf503017356550109.eot"); 
  src: url("https://www.layerstack.com/assets/webfonts/digitalw00/99d83ce639db8eabf503017356550109.eot?#iefix") format("embedded-opentype"), 
  url("https://www.layerstack.com/assets/webfonts/digitalw00/99d83ce639db8eabf503017356550109.woff2") format("woff2"), 
  url("https://www.layerstack.com/assets/webfonts/digitalw00/99d83ce639db8eabf503017356550109.woff") format("woff"), 
  url("https://www.layerstack.com/assets/webfonts/digitalw00/99d83ce639db8eabf503017356550109.ttf") format("truetype"), 
  url("https://www.layerstack.com/assets/webfonts/digitalw00/99d83ce639db8eabf503017356550109.svg#DigitalW00") format("svg"); 
} 

body, html {
  height: 100%;
  font-size:15px;
  font-weight:250;
  margin:0;
}
.main {
  overflow-x: hidden;
}

body { font-family: 'SST Light', 'Microsoft JhengHei' !important; }
body strong, h1 { font-family: 'Quicksand Medium', 'Microsoft JhengHei' !important;}
.DigitalW00 { font-family: 'DigitalW00', 'Microsoft JhengHei' !important;}

a:link, a:active, a:visited {outline:0; }
a:hover { cursor:pointer; color:#FF6400; }



.leads-badge {font-weight:normal; font-size:12px; background:#B3B3B3;}
.leads-badge.red {background:#E31E32; }
.font-leads{font-size:12px;}
.font-small{font-size:15px !important;}
@media (max-width: 991px) {.font-small{font-size:14px !important;}}

.font-XXL{font-size:52px;}
@media (max-width: 1199px) {.font-XXL{font-size:38px;}}
.font-XL{font-size:40px;}
@media (max-width: 1199px) {.font-XL{font-size:36px;}}
.font-LL{font-size:30px;}
@media (max-width: 1199px) {.font-L{font-size:21px;}}
.font-L{font-size:24px;}
@media (max-width: 1199px) {.font-L{font-size:21px;}}
.font-ML{font-size:19px;}
@media (max-width: 1399px) {.font-ML{font-size:18px;}}
@media (max-width: 991px) {.font-ML{font-size:16px;}}
.font-M{font-size:18px;}
@media (max-width: 1199px) {.font-M{font-size:16px;}}
.font-MS{font-size:14px;}
.font-S{font-size:12px;}
@media (max-width: 1199px) {.font-S{font-size:12px;}}

.text-shadow {text-shadow: 3px 3px 5px rgba(0, 0, 0, 0.4);}

.btn-large {
	display:inline-block;
	text-align:center;
	font-size:19px;
	font-weight:bold;
	padding:12px 50px;
}
.btn-orange, .btn-orange:visited {
	background:#f26422;
	border: #f26422 1px solid;
	color:#FFF !important;
	text-decoration:none !important;
	transition: 0.3s;
}

.btn-orange:hover, .btn-orange:active {
	background:#E31E32;
	border: #E31E32 1px solid;
	color:#FFF;
	text-decoration:none;
}
.btn-white { background:#FFF; border:#FFF 1px solid; color:#E31E32; }
.btn-white:hover { background:#E31E32; color:#FFF; }

.bullet-v1 {list-style: none;}
.bullet-v1 li { margin:20px 0; }
.bullet-v1 li::before {content: "•"; color:#f26422; font-size:24px; display: inline-block; width: 1em;
  margin-left: -1em; }

.linearRedv1 {
    background: #e32133; /* Old browsers */
    background: -moz-linear-gradient(90deg, #e32133 20%, #1a1a1a 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(90deg, #e32133 20%,#1a1a1a 100%); /* Chrome10-25,Safari5.1-6 */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e32133', endColorstr='#1a1a1a',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	box-shadow: inset 0 -5px 10px rgba(0, 0, 0, 0.2);
}
.linearOrange {
    background: #f26422; /* Old browsers */
    background: -moz-linear-gradient(90deg, #f26422 60%, #1a1a1a 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(90deg, #f26422 60%,#1a1a1a 100%); /* Chrome10-25,Safari5.1-6 */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f26422', endColorstr='#1a1a1a',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	box-shadow: inset 0 -5px 10px rgba(0, 0, 0, 0.2);
}
.background-dot { background-image:url(https://www.layerstack.com/assets/img/cloud-server-hs/layerstack-banner-dotted-bg.svg); background-position:bottom -15px center; background-repeat: no-repeat; background-size: 1800px auto; }
.background-box { background-image:url(https://www.layerstack.com/assets/img/object-storage/layerstack-object-storage-banner-bg.svg); background-position:bottom -280px right -380px; background-repeat: no-repeat; background-size: 1500px auto; }
@media (max-width: 1600px) { 
.background-box { background-image:url(https://www.layerstack.com/assets/img/object-storage/layerstack-object-storage-banner-bg.svg); background-position:bottom -10% right -20%; background-repeat: no-repeat; background-size: 1000px auto; }
}
@media (max-width: 1200px) { 
.background-box { background-image:url(https://www.layerstack.com/assets/img/object-storage/layerstack-object-storage-banner-bg.svg); background-position:bottom -10% right -40%; background-repeat: no-repeat; background-size: 800px auto; }
}
@media (max-width: 768px) { 
.background-box { background-image:url(https://www.layerstack.com/assets/img/object-storage/layerstack-object-storage-banner-bg.svg); background-position:bottom -10% left 0%; background-repeat: no-repeat; background-size: 800px auto; }
}


.background-cloud {
	max-width:3000px; background-image:url(https://www.layerstack.com/assets/img/cloud-server-hs/layerstack-banner-cloud-left.svg); background-repeat: no-repeat;
}
.background-cloud.left {
	background-position:bottom -1px left -15%; background-size: 30% auto;
}
.background-cloud.right {
	background-position:bottom -1px right -30%; background-size: 60% auto;
}
@media (max-width: 1600px) { 
.background-cloud.left {
	background-position:bottom -1px left -40%; background-size: 35% auto;
}
.background-cloud.right {
	background-position:bottom -1px right -90%; background-size: 85% auto;
}
}
.background-cloud.bottomleft {
	background-position:bottom -1px left -5%; background-size: 20% auto;
}
.background-cloud.bottomright {
	background-position:bottom -1px right -3%; background-size: 30% auto;
}
@media (max-width: 1600px) { 
.background-cloud.bottomleft {
	background-position:bottom -1px left -15%; background-size: 30% auto;
}
.background-cloud.bottomright {
	background-position:bottom -1px right -15%; background-size: 50% auto;
}
}

.background-cloud3 {
	max-width:3000px; background-image:url(https://www.layerstack.com/assets/img/object-storage/layerstack-banner-cloud-left.svg); background-repeat: no-repeat;
}
.background-cloud2 {
	max-width:3000px; background-image:url(https://www.layerstack.com/assets/img/object-storage/layerstack-banner-cloud-right.svg); background-repeat: no-repeat;
}
.background-cloud3.left {
	background-position:bottom -16px left -55%; background-size: 60% auto;
}
.background-cloud2.right {
	background-position:bottom -16px right -20%; background-size: 30% auto;
}
@media (max-width: 1600px) { 
.background-cloud3.left {
	background-position:bottom -10px left -30%; background-size: 45% auto;
}
.background-cloud2.right {
	background-position:bottom -10px right -20%; background-size: 35% auto;
}
}


.product-box { height:100%; border:1px #dedede solid; border-radius:6px; overflow:hidden; background:#fff; box-shadow: 1px 2px 5px #ccc; }
.locatbadge { color:#bcbcbc; border:#bcbcbc 1px solid; cursor:pointer; }
.ribbon-new {
  width: 90px;
  height: 90px;
  overflow: hidden;
  position: absolute;
}
.ribbon-new::before,
.ribbon-new::after {
  position: absolute;
  z-index: -1;
  content: '';
  display: block;
  border: 5px solid #7c0b17;
}
.ribbon-new span {
  position: absolute;
  display: block;
  width: 160px;
  padding: 5px 0;
  background-color: #E31E32;
  box-shadow: 0 3px 3px rgba(0,0,0,.1);
  color: #fff;
  font-size: 14px;
  line-height:21px;
  text-shadow: 0 1px 1px rgba(0,0,0,.2);
  text-align: center;
}

/* top right*/
.ribbon-new-top-right {
  top: -4px;
  right: -4px;
}
.ribbon-new-top-right::before,
.ribbon-new-top-right::after {
  border-top-color: transparent;
  border-right-color: transparent;
}
.ribbon-new-top-right::before {
  top: 0;
  left: 0;
}
.ribbon-new-top-right::after {
  bottom: 0;
  right: 0;
}
.ribbon-new-top-right span {
  left: -25.8px;
  top: 15.8px;
  transform: rotate(45deg);
}

.sliderWithLabels {
  width: 100%;
  padding: 20px 10px 0;
  height: 38px;
  overflow: hidden;
  display: none;
}
.sliderWithLabels input[type=range] {
  position: relative;
  height: 0.5rem;
  margin-top: 1.25rem;
  margin-bottom: 2.25rem;
  background-color: #e6e6e6;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -ms-touch-action: none;
  touch-action: none;
  top: -49px;
  position: relative;
  -webkit-appearance: none;
  width: 100%;
  height: 10px;
  background: #ececec;
  outline: none;
  border-radius: 10px;
}
.sliderWithLabels input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 20px;
  height: 20px;
  background: #fe6400;
  cursor: pointer;
  border-radius: 100%;
  border: #fe6400;
}
.sliderWithLabels input[type=range]::-moz-range-thumb {
  width: 20px;
  height: 20px;
  background: #fe6400;
  cursor: pointer;
  border-radius: 100%;
  border: #fe6400;
}
.sliderWithLabels > div {
  display: flex;
  align-items: stretch;
  height: 20px;
  margin-top: -6px;
  position: relative;
  width: 100%;
}
.sliderWithLabels > div > div {
  color: white;
  width: 100px;
  margin: 0px;
  text-align: center;
  line-height: 75px;
  font-size: 30px;
  flex: 1;
  border-right: 1px solid #d3d3d3;
  border-left: 1px solid #d3d3d3;
}
.sliderWithLabels > div > div:first-of-type {
  border-left: 2px solid #fff;
}
.sliderWithLabels > div > div:last-of-type {
  border-right: 2px solid #fff;
}
.sliderWithLabels > div > span {
  color: #d3d3d3;
  margin: 0px;
  text-align: center;
  line-height: 75px;
  font-size: 15px;
  flex: 1;
  font-family: sans-serif;
}
.sliderWithLabels > div.step-labels {
  top: -10px;
}
/*
.sliderWithLabels > div.step-labels span {
  cursor: pointer;
}
*/
.sliderWithLabels > div.step-marks {
  width: calc(100% - 20px) !important;
  margin-left: 10px;
}

/** FF*/
.sliderWithLabels input[type="range"]::-moz-range-progress {
  height: 10px;
  background: #facbad; 
  border-radius: 10px;
}

/* IE*/
.sliderWithLabels input[type="range"]::-ms-fill-lower {
  height: 10px;
  background: #facbad; 
  border-radius: 10px;
}