body { 
    
    font-family: "Open Sans","HelveticaNeue","Helvetica Neue",sans-serif;
    margin: 0;
    padding: 0;
    width: 100%;
}

input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
} 

input, select {
    -webkit-appearance: none!important;-moz-appearance: none; -webkit-appearance: none; appearance: none;
}

.main-background {
    
background: #FD4300;
width: 100%;
    
}

.mid-container {

margin: 0 auto; 
width: 800px;
min-height: 90vh;
background: rgba(0,0,0,.2);
padding: 40px 20px;
    
    
}

.main-btn {

border: none;
background: white;
font-size: 14px;
padding: 10px 20px;
display: inline-block;
margin: 20px;
border-radius: 5px;
cursor: pointer;
min-width: 100px;
    
    
}

.main-btn:hover, .main-btn:focus, .main-btn:active {

box-shadow: 1px 5px 5px rgba(0,0,0,.2); 
background: rgba(255,255,255,.8);
outline: none;
}
.white-txt {
color: #ffffff;    

}

.header-title {
    
    text-align: center;
}



.product-img {
    
    width: 100%;
    position: relative;
    margin: 0 auto;
}

.product-holder {
background: rgba(255,255,255,.9); 
border-radius: 5px;
padding: 20px 0px 20px 0px;
margin: 20px 0px 40px 0px;
min-height: 100px;
overflow: hidden;
    
}

.col-all {

margin: 10px;
background: rgba(0,0,0,0);
padding: 20px;
vertical-align: top;
    
}
.col-25 {

width: 25%;
display: inline-block;
    
}

.col-75 {

width: 55%;
display: inline-block;
    
}

.col-100 {

width: 100%;
display: inline-block;
    
}

.ghost {

display: none!important;
    
}

.img-case {

width: 100%;
text-align: center;
overflow: hidden;
    
}


.alert-error { 

border: 1px solid red!important;    
    
}

.alert-error-msg { 

color: red!important;    
    
}

.alert-txt {
    
    display: inline-block;
    border: 1px solid red;
    border-radius: 3px;
    padding: 5px 10px;
    font-size: 10px;
    color: red;
    margin: 20px;
    text-transform: uppercase;
}

.green-alert {

    color: green;

}

.big-btn {

padding: 10px 20px;

    
}

.high-txt {font-size: 2em; }
.no-top-margin { margin-top: 0px; }

.progress-bar-inner { 
    
  padding: 3px;  
  background: rgba(255,255,255,.9);
  width: 0%;
  -moz-transition: width .2s linear;
  -webkit-transition: width .2s linear;
  transition: width .2s linear;
  border-radius: 20px;
}
.progress-bar {

display: block;
width: 99%;
background: rgba(0,0,0,.2);
border-radius: 20px;
margin-bottom: 40px;
    
}

.footer {

position: relative;
margin-top: -70px;


    
}

.lg-input {
    
    width: 80%;
    padding: 10px;
    border: 0px solid rgba(255,255,255,.1);
    display: block;
    margin: 20px;
    border-radius: 5px;
    background: rgba(255,255,255,.9);
    outline: none;
    text-align: center;
    
}



.footer-txt {

font-size: 8px;
color: rgba(255,255,255,.8);
border: 1px solid rgba(255,255,255,.8);
padding: 5px 10px;
display: inline-block;
border-radius: 40px;
    
}

.green-txt {
color: green;
border: 1px solid green;

}

.sale {

padding: 3px 8px; 
font-size: 0.8em;
background: green;
line-height: 1em;
display: inline-block;
border-radius: 5px;
margin-left: 10px;
margin-bottom: 10px;
color: #ffffff;

}

.compare {

text-decoration: line-through;
opacity: 0.5;
    
}

.small-product { 
 
 margin-top: 10%;   
}

.long-product { 
 
 margin-top: 10%; 
 
}

.full-btn {

display: block;
font-weight: 800;
font-size: 1.1em;
    
}

.alert-holder {
margin: 25px auto;
border-radius: 5px;
display: inline-block;
width: 100%;
position: relative;
}

.checkout-table {

    width: 95%;
    background: rgba(200,200,200,.1);
    padding: 10px;
    border-radius: 3px;
    text-align: center;
    border: 1px solid rgba(200,200,200,.5);
    margin-left: -8%;
    margin-bottom: 30px;

}

.pp-table {

    width: 95%;
    background: rgba(200,200,200,.0);
    padding: 10px;
    border-radius: 3px;
    text-align: center;
    border: 1px solid rgba(200,200,200,.0);
    margin-bottom: 10px;
    margin-top: 30px;
    

}

.pp-input { 

padding: 3px 5px;
width: 20%;
margin: 10px auto;
border-radius: 5px;
background: rgba(200,200,200,.1);
text-align: center;
    
}

.checkout-header { 
  
  background: rgba(200,200,200,.1);
  border-radius: 3px;

}

.checkout-table td {
 
 border-bottom: 1px solid rgba(200,200,200,.2);
 padding: 5px 0px;
}

.checkout-table th {
  border-bottom: 1px solid rgba(200,200,200,.3);
 padding: 5px 0px;
}



.checkout-product-long-img {

width: 30px;
    
}

.checkout-product-small-img {

width: 40px;
    
}

.checkout-qty-input {
    
width: 50px;
margin: 0px 10px;
outline: none;
border: 0px solid rgba(0,0,0,.0);
text-align: center;
padding: 3px 0px 3px 10px;
border-radius: 5px;
background: rgba(255,255,255,.1);
    
}

.ship-input {
    
width: 48%;
display: inline-block;
margin: 10px 0px;
outline: none;
border: 1px solid rgba(0,0,0,.2);
text-align: center;
padding: 5px;
border-radius: 5px;
background: rgba(255,255,255,.1);
    
}

.ship-total-input {

width: 48%;
display: inline-block;
margin: 0px 10px;
outline: none;
border: 0px solid rgba(0,0,0,.0);
text-align: center;
padding: 10px 0px 10px 0px;
border-radius: 5px;
background: rgba(255,255,255,.1);  

}

.clicker {
  
  cursor: pointer; 
    
}


.rcp-txt-right { 

text-align: right!important;
    
}



@media only screen and (max-width: 1024px) { 
 
 .mid-container {

margin: 0 auto; 
width: 90%;
background: rgba(0,0,0,.2);
    
    
}

.clicker {
  
  cursor: pointer; 
  font-size: 1.5em;
    
}

    
}

@media only screen and (max-width: 768px) { 

 .mid-container {

margin: 0 auto; 
width: 94%;
background: rgba(0,0,0,.2);
padding: 40px 10px;
} 

.long-product { 

width: 120px!important; 
   
}
.col-25, .col-75 { width: 80%; }

.product-img {width: 75%;}

.product-holder { padding: 20px 0px; }

.checkout-product-long-img {

width: 30px!Important;
    
}

.checkout-product-small-img {

width: 40px;
    
}

.ship-input { 
 width: 100%;   
}

.checkout-table {

font-size: 10px;
margin-left: -18%;
    
}

.pp-input { 

width: 50%;

    
}
    
}

