/* CSS Document 
/* Version 3.0
   ================================================== */
/* *******************************************************************************
            DOJO CART
*******************************************************************************
   ================================================== */

.dojocart { background-color: #f7f7f7; padding: 30px 30px 30px 0; border-bottom: 1px solid #CCD; }
.dojocart .media-left img { max-width: 280px }
.dojocart .media-body, .dojocart .media-left, .dojocart .media-right { display: inherit; float: left; }
.dojocart .media-body { width: 55%; padding-left: 20px; }

.gurantee-image { float: right }
.gurantee-image img { max-width: 150px }

.additional-member { background-color: #00c0f0; padding: 10px; text-align: center; color: #fff; font-size: 16px; }
.additional-member input { height: inherit }

.offer-block { background-color: #e8f8ff; padding: 20px; border-radius: 5px; margin: 10px 0 5px; }
.offer-block p { font-size: 18px; margin-bottom: 0px; }
.offer-block a, .offer-block a:hover { text-decoration: underline; color: #888888; }

.quantity { font-size: 26px; font-weight: 600; border-bottom: 1px solid #ccc; padding-bottom: 10px; margin-bottom: 10px; }
.quantity label { font-weight: 600 }
.quantity span { float: right }
.quantity span input { width: 20%; float: right; padding-left: 10px; }

.total-price { font-size: 26px; font-weight: 600; }
.total-price label { font-weight: 600 }
.total-price span { text-align: right; float: right; }

.custom-copy-right { text-align: right; padding-top: 4%; color: #ccc; }

.cart-policy { background-color: #f8ffe2; padding: 27px; }
.cart-policy .price h2 { color: #000 }
.cart-policy .offer-list { margin: 10px auto 0; padding: 10px 0px; }
.cart-policy .offer-list li { color: #818e48; font-weight: 400; font-size: 14px; line-height: 25px; border-bottom: none; }
.cart-policy .offer-list li .fa { color: #8dcd26; font-weight: 600; font-size: 16px; padding-right: 5px; }

.offer-description { font-size: 16px; margin: 0px 0px 30px; line-height: 24px; }
.offer-description label { font-weight: 600; margin: 15px 0 0 0; }
.offer-description p { font-family: 'HelveticaNeueW82-Light', sans-serif; padding: 0px 10px; }

.purchase-now { text-align: center; margin: 20px 0px 80px; }
.purchase-now .btn { display: inline-block; border-radius: 0px; padding: 16px 0; font-size: 33px; background-color: #1ab0ec; background-image: -webkit-gradient(linear, left top, left bottom, from(#1ab0ec), to(#1a92c2)); background-image: -webkit-linear-gradient(top, #1ab0ec, #1a92c2); background-image: -moz-linear-gradient(top, #1ab0ec, #1a92c2); background-image: -ms-linear-gradient(top, #1ab0ec, #1a92c2); background-image: -o-linear-gradient(top, #1ab0ec, #1a92c2); background-image: linear-gradient(to bottom, #1ab0ec, #1a92c2); filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#1ab0ec, endColorstr=#1a92c2); }

.purchase-now .btn:hover { color: #000 }
.offer-agreement { background-color: #fafafa; padding: 10px 15px; font-size: 12px; border: 1px solid #ccc; max-height: 120px; overflow: auto; color: #909090; }

#payment-block .player-inner { background: #000 }

#paymentForm .col-md-12 .checkbox { margin-bottom: 0px }
#paymentForm .col-md-12 .checkbox label { font-weight: 600; font-size: 16px; padding: 0px; }

   ================================================== */
/* *******************************************************************************
            SQUARED FOUR
*******************************************************************************
   ================================================== */

.squaredFour { width: 20px; margin: 20px auto; position: relative; }

.squaredFour label { cursor: pointer; position: absolute; width: 20px; height: 20px; top: 0; border-radius: 4px; -webkit-box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5); -moz-box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5); box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5); background: #fcfff4; background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%); background: -moz-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%); background: -o-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%); background: -ms-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%); background: linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfff4', endColorstr='#b3bead',GradientType=0 ); }

.squaredFour label:after { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); opacity: 0; content: ''; position: absolute; width: 9px; height: 5px; background: transparent; top: 4px; left: 4px; border: 3px solid #333; border-top: none; border-right: none; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); }

.squaredFour label:hover::after { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; filter: alpha(opacity=30); opacity: 0.5; }

.squaredFour input[type=checkbox]:checked + label:after { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); opacity: 1; }


.quantity span input {
  float: right;
  padding-left: 0;
  width: 15%; text-align:center;
  border: 1px solid #ccc;
  border-left: 0;
  border-right: 0;
}

.upDownButton.btn.btn-default.btn-sm {
  border-radius: 0;
  font-size: 22px;
  height: 40px;
  line-height: 29px;
}

@media (max-width: 990px) { 
    .main-header { background: #fff; border-bottom: 1px solid #ccc; height: auto; }
    .dojocart { padding: 20px; text-align: center; }
    .dojocart .media-left { float: none }
    .dojocart img { margin: 0 auto; max-width: inherit!important; }
    .dojocart .media-body { width: 100%; margin-top: 11px; padding: 0px; }
    .consult { color: #f01313; font-size: 17px; padding-right: 5px; }
    .contact-form-payment h3 { margin: 10px 15px }
    .cart-policy img { max-width: 100% }
    .contact-top { text-align: center }
}