@charset "utf-8";

body{  ;} 

.maindiv #paypal_message {text-align: center;}
.maindiv #paypal_express_button_container {display: block;width: 350px;margin: 0 auto;}

#loading {display:none; !important} 
   

.imgdiv{width: calc(100% - 40px); height:130px; margin:20px 20px 20px 20px; display:block;} 


.panel-body{   font-family: "Lai";
    display: block;
    margin: auto;
    padding: 20px 20px 0px 20px;
    box-sizing: border-box;
    font-size: 14px;} 

.checkbox{   float:left;

} 


.panel-body p{   padding:0 0 0 10px;

} 

.panel-body p:first-of-type{   display:none;

} 

.radio1{   padding:0 0 0 10px;

} 

main { box-sizing: content-box;
  box-sizing: border-box;

  text-shadow: none;
  text-decoration: none;
  list-style: none;
  max-width: 100%;
  min-height: 100%;
 max-width:1800px;
  overflow: auto;
  
  position: relative;
  display: block;
  margin: 0px auto 0px auto;
  padding: 0;
   
  color: rgba(45,45,45,0.88);
 
}
    
     
    button {
  background: none;
  border: 2px solid;
  font: inherit;
        font-size:19px;
  line-height: 1;
  margin: 1.5em 0.5em 0.5em 0;
  padding: .7em 1.2em;
        cursor:pointer;
}
    
button {font-family: "Nord" !important;
  color: var(--color);
  transition: 0.25s;
}
button:hover, button:focus {
  border-color: var(--hover);
  color: #fff;
}

.bt1 {
 font-size: 14px !important; 
    color:black !important;
}

.bt1:hover {

    color:white !important;
}
    
    .up {
  --color: inherit;
  --hover: #8DD200;
}

    .lg {
 font-size:20px;
}

    
    .fill:hover,
.fill:focus {
  box-shadow: inset 0 0 0 2em var(--hover);
}
    
.slide:hover,
.slide:focus {
  box-shadow: inset 6.5em 0 0 0 var(--hover);
} 
    
    .slide {
  --color: #8fc866;
  --hover: #66c887;
}

.fill {
  --color: #EC7C0F;
  --hover: #AAE64C;
} 
    
  .up:hover,
.up:focus {
  box-shadow: inset 0 -3.25em 0 0 var(--hover);
}  
    
 
    
   .distancer {display: block; position:relative;
width:100%; height:130px;

 
} 
    
    
    
 .maindiv {display: flex; margin:30px 0 0 0; height:100%; background: rgba(231,231,231,1);
  
 
}  


.productdiv { float:left; flex: 1; margin: 0 0 30px 0; 
 
  

}
    

    
 .desdiv {background-color:#F9F9F9; float:left; flex: 1; 

} 


  .desdiv h3 {font-family:"Laik"; text-align: center; color:#4E4E4E;margin:0;
font-size:14px; padding:5px 0 0 0; font-weight: normal; letter-spacing: 3px;
     border-bottom:none;
}
   

 .desdiv h3:first-child {margin:30px 0 0 0; font-family:"Laik";

} 



  .productdiv h3 {font-family:"Laim"; text-align: center; color:#262626;margin:0;
font-size:14px; padding:10px 0 20px 0 !important; font-weight: normal; letter-spacing: 3px;
     border-bottom:none;
}

.productdiv h2 {font-family:"Nord"; text-align: center; color:#000000;
font-size:16px; padding:40px 0 0 0;
      border-bottom:none;  margin:0;
    
}
 
    
 
    
       .botm {display: block; font-family:"Nord" !important; font-size: 19px; margin:0px 0 30px 0; position: relative; height:100%; width:100%; float:left;
  
 
}    
    
    .cont { margin: 20px 0 0 10px; transition:.5s; float:left;

}
    
 .check {  margin: 0px 10px 0 0; transition:.5s; float:right;

} 
    
 a.check {  text-decoration: none;

}     
        .cont:hover { color:#52C609; transition:.5s;

}
    
 .check:hover {color:#52C609;transition:.5s;

} 
    
    
  .txtdiv {width:100%; font-family:"Lai"; font-size:19px; color:#000000; padding:10px 20px; 

}  
    
    
   .checkbox label {margin: 10px 0 0 10px;

} 
    
    
     


    
 .ds {
font-size:11px; position:absolute; bottom: -30px;font-family:"Br"; width:100%; text-align: center;
}
    
  h1 {font-family:"Nordl"; text-align: center;  letter-spacing: 1px;color:hsla(0,100%,42%,1.00);
font-size:14px; margin:10px 0 0 0;  padding:10px 0 0 0;
   
} 
    
    
   h1 a {
    text-decoration: none; letter-spacing: 2px;
 font-family:"Aui";
    border-bottom: solid 2px hsla(359,83%,50%,1.00);
   padding:0 2em 0 2em; 
    color: hsla(359,83%,50%,1.00);
    transition: 0.3s;
}
    
    


main .flex-container {
  display: flex;
  height: auto;

  margin: 0px 0px 0px 0px;
}
main .flex-container .box {
  height: 90px;
  width: 90px;
  margin: 30px 5px 10px 0px; padding:0px;

  font-size: 16px;
    

}
    
 main .flex-container .box1 {
  height: 50px;
  width: 100px;
  margin: 50px 5px 10px 0px; padding:0px;

  font-size: 16px;
    

} 
    

main .flex-container .box2 {
  height: 50px;
  width: 100px;
  margin: 10px 5px 10px 0px; padding:0px;

  font-size: 16px;
    

} 


    
            .c-container{
width:100px; height:30px;margin:0px auto 0px auto; position:relative;

} 

            .del{
float:right; position:relative;width:20px; text-decoration: none;font-size: 16px; text-align: center;

}

            .decrease{
float:left; position:relative;width:20px; font-size: 16px;

} 
 
    
        .increase{
float:left; position:relative; width:20px;font-size: 16px;

}  
    
         .number-container{
float:left; position:relative;width:20px;font-size: 16px;

} 
    
    
             .number{ 
text-align:center;

}
            .decrease{
float:left; position:relative;width:20px;

} 
    
     .sum{
float:left; width:100%; margin:30px 0 40px 0; font-family:"Br";
    

} 
     .itemwrap{
width:100%; display:block; float:left;
    

}

     .topwrap{
width:100%; display:block; 
    

}

     .summary{
float:left; width:100%; margin:10px 0 10px 0;
    

} 
  
    
    
    
    
    
    
    
  
main .flex-container .flex-grow {
  flex-grow: 1;
}

main #flex-wrap {
  flex-wrap: wrap;
}
main #flex-wrap .wrap {
  flex-grow: 1;
}

.flex-flow {
  flex-wrap: wrap;
  justify-content: center;
}
#flex-start {
  justify-content: flex-start;
}
#flex-end {
  justify-content: flex-end;
}


@media screen and (max-width: 790px) {
  nav ul {
    flex-flow: column;
  }
} 


    .topborder {
border-top:1px solid #AAAAAA;
}
    
    .row {
margin-bottom:20px;min-width:290px;
}

    .dis {

text-align: right; font-size:13px;font-family:"Br"; padding:10px 20px 0px 0px;
 }




.column1 {
  float: left; font-family:"Lai";
  width: 25%;  padding:5px 0 0 5px; border-left:1px solid #D9D9D9;
     font-size:13px; text-align: center;
}

    
    .column1:first-child {
border-left:none;
   
}


  .column2 {
  float: left;
  width: 50%; min-width:90px; padding:5px; border-left:1px solid #D9D9D9;
     font-size:13px; text-align: center;
} 

    .column2:first-child {
border-left:none;
   
}
    

  .column3 {
  float: left;
  width: 33.3%; min-width:80px; padding:5px; border-left:1px solid #D9D9D9;
     font-size:13px; text-align: center;
} 

    .column3:first-child {
border-left:none;
   
}

.column4 {
  float: left;
  width: 25%; min-width:70px; padding:5px; border-left:1px solid #D9D9D9;
     font-size:13px; text-align: center;
}

    
    .column4:first-child {
border-left:none;
   
}

.column5 {
  float: left; 
  width: 20%; min-width:50px; padding:5px; border-left:1px solid #D9D9D9;
     font-size:13px; text-align: center;
}

    
    .column5:first-child {
border-left:none;
   
}

.column6 {
  float: left; 
  width: 16%; min-width:50px; padding:5px; border-left:1px solid #D9D9D9;
     font-size:13px; text-align: center;
}

    
    .column6:first-child {
border-left:none;
   
}
  
  
    
    
.row:after {
  content: "";
  display: table;
  clear: both;
}  
    
 
 
    
  :root {
  --card-line-height: 1.2em;
  --card-padding: 2.2em;
  --card-radius: 0.5em;
  --color-selected: #FF7476;
  --color-gray: #FFFFFF;
  --color-dark-gray: #FFFFFF;
  --radio-border-width: 2px;
  --radio-size: 1.5em;
}



.card {
  

  position: relative;
    
  cursor: pointer;
  padding: var(--card-padding);
  
}
.card:hover {
 
}

.radio {
  font-size: inherit;
  margin: 0;
  position: absolute;
  right:6px;
  top: 6px;
}

@supports (-webkit-appearance: none) or (-moz-appearance: none) {
  .radio {
    -webkit-appearance: none;
    -moz-appearance: none;
    background: #fff;
    border: var(--radio-border-width) solid var(--color-gray);
    border-radius: 50%;
    cursor: pointer;
    height: var(--radio-size);
    outline: none;
    transition: background 0.2s ease-out, border-color 0.2s ease-out;
    width: var(--radio-size);
  }
  .radio::after {
    border: var(--radio-border-width) solid #fff;
    border-top: 0;
    border-left: 0;
    content: "";
    display: block;
    height: 0.75rem;
    left: 20%;
    position: absolute;
    top: 42%;
    transform: rotate(45deg) translate(-50%, -50%);
    width: 0.375rem;
  }
  .radio:checked {
    background: var(--color-selected);
    border-color: var(--color-selected);
  }

  .card:hover .radio {
    border-color: var(--color-selected);
  }
  .card:hover .radio:checked {
    border-color: 'var(--color-selected)';
  }
}


}

.card:hover .radio:disabled {
  border-color: var(--color-gray);
}

.increase, .decrease {
   
cursor: pointer
}

a.increase, a.decrease {
   
text-decoration: none;
}
    
    
          footer {float:left; display: block; 

}    
    
   @media (max-width: 800px){
.mlogo a svg {
    position: fixed;
    width: 80px;
    height: 100px;
    z-index: 100;
    top: 10px;
    left: 20px;
}
       
       
         footer {float:left; 
 
} 
} 
    
  
.by{
   width:100%;
   height:100%;
   display:flex;
}
.bcontainer{
 display:block;
   margin:auto;


   box-sizing:border-box;

   font-size:14px;

  
}

.inputs{display:flex;
   position:relative;
   float:left;
   width:100%;
   
   box-sizing:border-box;
   padding:10px 4px 10px 4px;
}
.inputs.half{ flex:1; width:50%; }

.inputs input{
   width:100%;
   padding:20px 0px 4px 0px;
   background:transparent;
   
   box-sizing:border-box;
   border-color: #AAA;
   border-width: 0px 0px 2px 0px;
   color:#000000;
   outline:none;
   transition:all 0.3s;
   padding:0px 15x;
}

.inputs input:focus{
   border-bottom:2px solid #3D3D3D;
}



.inputs input + label:after{
   content: " ";
}


.inputs input:placeholder-shown + label{
   color:#999;
   left:14px;
   bottom:-8px;
}
.inputs input:focus + label,
.inputs input + label{
   position:absolute;
   bottom:14px;
   left:10px;
   color:#999;
   line-height:60px;
   pointer-events:none;
   transition: all 0.25s;
   font-size:14px;
}

/**
.ccard {
  
 display:block; position: relative;
margin:30px auto 10px auto; max-width:600px; 
  height: 400px;
}
.ccard .row {
  height: 20%;
  width: 100%;
    margin:0;
  border-bottom: 1.2px solid #A08A79;
}
.ccard .row:last-child {
  border: none;
}
.ccard .paypal {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}
.ccard .details { display:flex;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}
.ccard .paypal, .ccard .credit {
  background-color: #BDAC9F;
}
.ccard .cardholder, .ccard .cnumber, .ccard .details {
  background-color: #BDAC9F;
}

.paypal .left, .paypal .right, .credit .left, .credit .right {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}
.paypal .left, .credit .left {
  float: left;
  margin-left: 30px;
}
.paypal .left label, .credit .left label {
    width:100%; height:100%;
  margin-left: 10px;
  font-size: 16px; font-family:"Bm";
  cursor: pointer;
 
  letter-spacing: 0.5px;
  color: #fff;
}
.paypal .left input[type=radio], .credit .left input[type=radio] {
  visibility: hidden;
}
.paypal .left .radio, .credit .left .radio {
  position: absolute;
  top: -4px;
  left: -20px;
cursor:default;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  background-color: white;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

.paypal .right, .credit .right {
  float: right;
  margin-right: 30px;
}
.paypal .right img, .credit .right img {
  width: 42px;
  height: 30px;
  margin-left: 10px;
}

input[type=radio]:checked ~ .radio {

  background-color: #FF7C7C;
}
input[type=radio]:checked ~ .radio::before {
  background-color: #fff;
}

.cardholder .info, .cnumber .info {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  margin-left: 10px;
}
.cardholder .info label, .cnumber .info label {
  display: block;
font-size:14px;
  color: #FFFFFF;
  width: 100px;
    
}
.cardholder .info input, .cnumber .info input {
    font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif"; text-transform: uppercase;
  display: inline-block;
  max-width: 280px;
  width: 280px;
  background-color: transparent;
font-size:14px;
  border: none;
  outline: none;
  margin-left: 50px;
  color: white;
}
.cardholder .info input::-moz-placeholder, .cnumber .info input::-moz-placeholder {

  color: #4D4137;
}
.cardholder .info input:-ms-input-placeholder, .cnumber .info input:-ms-input-placeholder {
 
  color: #4D4137;
}
.cardholder .info input::placeholder, .cnumber .info input::placeholder {

  color: #4D4137;
}

#cardnumber::-moz-placeholder {
  letter-spacing: 2px;
}

#cardnumber:-ms-input-placeholder {
  letter-spacing: 2px;
}

#cardnumber, #cardnumber::placeholder {
  letter-spacing: 2px;
}

.details .left, .details .right {
  position: relative; flex:1;
    padding-top:20px;
  top: 50%;
  transform: translateY(-50%);
}
.details .left {
  float: left; 
  padding-left: 10px;

}
.details .left label {
  
  color: #FFFFFF;
  width: 70px;
  margin-right: 10px;
}
.details .left select {
  font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
  cursor: pointer;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background: transparent;
  border: none;
  outline: none;
  color: #4D4137;
}
.details .left span {
  font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";;
 color: #4D4137;
  margin: 0 2px;
}
.details .right {
  float: left;
  
}
.details .right label {
  margin-right: 10px;
  color: #FFFFFF;
}
.details .right input {
  text-align: center;
  width: 50px;
  font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";;
  cursor: pointer;
  background: transparent;
  border: none;
  outline: none;
  color: #fff;
}
.details .right input::-moz-placeholder {
  font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";;
  color:  #4D4137;
}
.details .right input:-ms-input-placeholder {
  font-family: "Source Code Pro";
  color: #4D4137;
}
.details .right input::placeholder {
  font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";;
  color: #4D4137;
}
.details .right span {
  text-align: center;
  display: inline-block;
  font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";;
  cursor: pointer;
  margin-left: 50px;
  color: #18C2C0;
  width: 24px;
  height: 24px;
  border: 2px solid #18C2C0;
  border-radius: 50%;
}
**/
.button pbutton {
    
     display:block!important; position: relative;
margin:30px auto; max-width:600px; min-width:390px;

  font-size: 1.2rem;

  letter-spacing: 1px;

  background-color: #18C2C0;
  border: none;
  color: #fff;
  padding: 18px;
  border-radius: 5px;
  outline: none;
  transition: background-color 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}
.button pbutton:hover {
  background-color: #15aeac;
}
.button pbutton:active {
  background-color: #139b99;
}
.button button i {
  font-size: 1.2rem;
  margin-right: 5px;
}
 
.right {
  float:right; margin: 0;
}



.scontainer {
  width:100%;
}

.in {
  width:100%; float:left; margin:20px 0px 10px 0px;
}

.pay {
  width:100%; margin:20px 0px 10px 0px; text-align: center;margin:0 auto;
  
}

 @media (max-width: 430px)  {

            .c-container{
width:60px; height:30px;margin:0px auto 0px auto; position:relative;

} 

            .del{
float:left; position:relative;width:60px; text-decoration: none;font-size: 16px; text-align: center;

}
     }
 
 @media (max-width: 810px)  {
     
     
   .inputs.half  { width:100%;

}
     
     
      .maindiv {display: block;
  
 
}  

    
 .productdiv { width:100%;

}
    
 .desdiv {width:100%;

} 
}