/*Generic*/

body{
	padding: 14px;
	background-color: #F57121;
}

.blank{
    background-color: white;
}

img{
	max-width: 100%;
}

hr{
	max-width: 97%;
}

.main-container{
	padding: 12px;
	background-color: white;
	border-radius: 5px;
	box-shadow: 1px 1px 4px;
}

.required_field{
	color: #ff0000;
}

.note{
	font-size: 14px;
}

#required-note{
	padding-bottom: 6px;
}

#terms{
	padding-top: 6px;
	padding-bottom: 12px;
}

.information{
    color: grey;
    font-size: 13px;
}

.information:hover{
    color: grey;
    text-decoration: none;
}

/*E-Voucher*/

.valid{
    color: green;
}

.claimed{
    color: red;
}

.status{
    background-color: #F2F2F2;
    border-radius: 3px;
    padding: 12px;
}

/*Store*/

.btn-service{
    margin: 6px;
}

.box{
    position: relative;
}

.image{
  opacity: 1;
  display: block;
  width: 100%;
  height: auto;
  transition: .5s ease;
  backface-visibility: hidden;
}

.middle {
  transition: .5s ease;
  opacity: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
}

.box:hover .image {
  opacity: 0.4;
}

.box:hover .middle {
  opacity: 1;
}

.button-text {
  background-color: #F57121;
  color: white;
  font-size: 16px;
  padding: 8px 16px;
  border-radius: 6px;
  box-shadow: 1px 1px 1px #767676;
}

/*NEW CODE STARTS HERE*/

.se-box{
    position: relative;
}

.se-image{
  opacity: .50;
  display: block;
  width: 100%;
  height: auto;
  transition: .5s ease;
  backface-visibility: hidden;
}

.se-middle {
  transition: .5s ease;
  opacity: 1;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
}

.se-box:hover .se-image {
  opacity: 0.25;
}

.se-box:hover .se-middle {
  opacity: 1;
}

.se-button-text {
  color: black;
  font-size: 16px;
}

/*NEW CODES END HERE*/

.items{
    padding: 9px;
}

.items img{
    padding: 6px;
}

.category{
    color: grey;
}

.required{
    color: red;
}

.full{
	max-width: 100%;
}

strike{
    color: grey;
}

.strike-black{
    color: black;
}

.shop-link{
    color: black;
    text-decoration: none;
}

.shop-link-disabled{
    color: black;
    text-decoration: none;
}

.shop-link:hover{
    color: grey;
    opacity: 1;
    text-decoration: none;
    transition: .2s ease;
}

#back{
    color: #F57121;
}

#back:hover{
    color: black;
}

#service-selection{
    color: #F57121;
}

#sign-out{
    color: red;
}

#currentItemBox{
    background-color: #f5f5f5;
    padding-top: 36px;
    padding-bottom: 36px;
}

.form-note{
    color: grey;
    font-size: 14px;
}

.select-button{
    border-radius: 12px;
    background-color: #fbfbfb;
    margin: 2px;
}

.select-button:hover{
    background-color: white;
    box-shadow: 1px 2px 4px;
    transition: .2s ease;
}

#itemName{
    font-size: 30px;
}

#empty-cart{
    padding: 48px;
}

#colorway-row{
    padding-right: 15px;
    padding-left: 15px;
}

.colorway{
    padding-right: 2px;
    padding-left: 2px;
    padding-bottom: 4px;
}

.colorway-selected{
    opacity: .5;
}

.bottom-padded{
    padding-bottom: 12px;
}

.cart-table{
    border-radius: 6px;
    box-shadow: 1px 1px 3px grey;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 6px;
}

.btn-remove{
    margin-top: 13px;
}

#size-guide{
    color: grey;
}

.manage-table{
    color: grey;
}

#add-item-code{
    font-size: 24px;
    color: grey;
}

footer{
    font-size: 14px;
    padding-top: 10px;
    color: white;
}

.icon-link{
    color: black;
}

.icon-link:hover{
    color: black;
    text-decoration: none;
}

.location-button{
    margin-top: 3px;
    margin-bottom: 3px;
}

.location-online{
    padding-top: 12px;
    padding-bottom: 12px;
}