

/*список товаров*/

.order-head {
  border-bottom: dashed 1px #ccc;
}
  .order-head p {
    display: inline-block;
    text-transform: uppercase;
    color: #336699;
    font-size: 0.7em;
  }
  .order-head p:first-child {
    width: 600px;
  }
  .order-head p:nth-child(n+2) {
    width: 100px;
    text-align: center;
  }

.product-wrap {
  border-bottom: dashed 1px #ccc;
  padding: 15px 0;
  line-height: 1;
  position: relative;
  font-size: 0.9em;
  min-height: 80px;
}

  .product-wrap img {
    width: 80px;
    display: inline-block;
    left: 0;
    position: absolute;
  }

  .product-wrap a {
    color: #446588;
    text-decoration: none;
  }

  .product-wrap a span {
    border-bottom: 1px dashed #446588;
  }

  .product-wrap > p {
    display: inline-block;
    width: 100px;
    text-align: center;
    vertical-align: middle;
    font-size: 1.2em;
  }

.order-info {
  width: 500px;
  display: inline-block;
  margin-left: 100px;
}

.product-ammount {
  display: inline-block;
  width: 100px;
  text-align: center;
  font-size: 1.2em;
  vertical-align: middle;
}


/*список товаров ------------------------------------------------------------------------------------------------------------*/
@media (max-width: 480px) {
  .product-wrap {
    width: 95%;
    margin: 0 auto;
  }
  .order-head, p.product-itog {
    display: none;
  }
  .order-info {
    width: 60%;
  }
  .product-ammount {
    position: absolute;
    bottom: 0;
    left: 0;
    text-align: left;
    line-height: 40px;
    padding-left: 100px;
  }
  p.product-price {
    width: 65%;
    text-align: left;
    margin: 0 0 30px 100px;
  }
  .product-wrap i.delicon {
    top: 25px;
  }
}


/*доставка*/
.delivery, .recipient, .payer, .pay-system {
  margin: 36px 0;
}
#post_delivery_block input:nth-child(1) {
  width: 80px;
  margin-right: 25px;
  text-align: center;
}
#post_delivery_block input:nth-child(2) {
  width: 85%;
}

#courier_delivery_block input:nth-child(2) {
  width: 480px;
}

.delivery-type-elem, .payer-type-elem {
  display: inline-block;
  margin-right: 40px;
}

.delivery-type-elem input[type="radio"] + label span,
#moscow_delivery_block input[type="radio"] + label span,
.payer-type-elem input[type="radio"] + label span {
  margin-right: 10px;
}

#moscow_delivery_block label p {
  display: inherit;
}

.form-control {
  display: inline-block;
  width: 240px;
  height: 36px;
  padding: 5px 3px;
  font-size: 14px;
  color: #555;
  background-color: #fff;
  border: 2px solid #ccc;
  margin-right: 10px;
}

.partner {
  font-size: 0.8em;
}

#comment {
  width: 480px;
  height: 70px;
  margin-top: 16px;
}
.recipient input, .payer-type-fields input {
  width: 226px;
  margin-top: 16px;
  display: block;
}


/*доставка ----------------------------------------------------------------------------------------------------------*/
@media (max-width: 480px) {
  .delivery, .recipient, .payer, .pay-system, .confirm-block {
    width: 95%;
    margin: 30px auto;
  }
  .delivery-type-elem, .payer-type-elem {
    margin: 15px 0;
    display: block;
  }
  #post_delivery_block input:nth-child(1) {
    margin-bottom: 20px;
  }
  #post_delivery_block input:nth-child(2),
  #courier_delivery_block input:nth-child(2) {
    width: 96%;
  }

  .form-control {
    margin-bottom: 16px;
    width: 100%;
  }

  .partner {
    margin-bottom: 16px;;
  }

  #moscow_delivery_block label p {
    margin: 0;
    display: inline-block;
    width: 85%;
    vertical-align: top;
  }

  .recipient input, .payer-type-fields input {
    display: block;
    width: 95%;
    text-align: center;
  }

  .recipient div {
    text-align: center;
  }

  #comment {
    max-width: 95%;
    height: 70px;
  }
}




/*Оплата заказа*/

.payment {
  text-align: center;
  margin: 16px 0;
}

.payment p {
  text-align: left;
  position: relative;
}
.payment p span {
  position: absolute;
  right: 20px;
  font-size: 0.8em;
}

.element-method__wrapper {
  display: inline-block;
  width: 156px;
}

.element-method__wrapper.select {
  background: url(../images/tick.svg) bottom right no-repeat;
  background-size: 15%;
  background-position: 90% 100%;
}

.element-method__wrapper > img:hover {
  border: 1px solid #888888;
  box-shadow: 1px 3px 10px 0px rgba(0, 0, 0, 0.20);
}

.element-method__wrapper.select > img {
  border: 1px solid #00BB12;
  box-shadow: 1px 3px 10px 0px rgba(0, 187, 18, 0.20);
}

.element-method__wrapper img {
  border: 1px solid #CCC;
  margin-bottom: 20px;
}
.payer-type-elem p {
  vertical-align: top;
  margin: 0 0 0 10px;
  font-size: 0.95em;
  display: inline-block;
}
.confirm-block p {
  display: inline-block;
  font-size: 0.9em;
  margin: 0 0 0 10px;
}


/*оплата заказа ---------------------------------------------------------------------------------------------------*/
@media (max-width: 480px) {

  .payment p {
    padding: 10px;
    background-color: #f5f5f5;
    width: 93%;
    margin: 0 auto;
    text-align: center;
  }
  .payment p span {
    position: relative;
    display: block;
    right: 0;
    margin: 10px 0;
  }

  .element-method__wrapper {
    width: 47%;
    margin-bottom: 3%;
  }
  .element-method__wrapper:nth-child(odd) {
    margin-right: 3%;
  }
  .element-method__wrapper img {
    width: 100%;
    margin-bottom: 15%;
  }

  .payer-type-elem p {
    width: 85%;
    font-size: 0.9em;
  }
  .element-method__wrapper.select {
    background-position: right bottom;
  }

  .confirm-block p {
    width: 85%;
    vertical-align: top;
  }
}
