/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */


 .ticketrechner-screen{
    border: 2px solid #f39200;
    border-left: none;
    border-right: none;
    padding: 2rem;

 }


 .ticketrechner h1{

font-size: 32px;
font-weight: 300;
margin-top: 10px;
margin-bottom: 10px;
line-height: normal;
 }

 .ticketrechner h2{

    font-size: 20px;
    font-weight: 600;
    line-height: normal;
    margin-top: 10px;
  }

 
 .ticketrechner p{

font-size: 18px;
 }

 .ticketrechner .ticketrechner-box{
    padding:  1rem 1.5rem;
    border: 1px solid #ccc;
    min-height: 400px;
 }

 .ticketrechner .form-control{
   background-color: #fff;
   border-radius: 0;
   border: 2px solid #ccc;
   padding: 5px 10px;
   font-size: 18px;
   height: 45px;
 }

 .ticketrechner .form-control:focus {
   border-color: #f39200;
   outline: 0;
   -webkit-box-shadow: none;
   box-shadow: none;
}

 .ticketrechner .btn-default{
    background: none;
    background-color: #f39200;
    color: #000;
    border-radius: 0;
    border: none;
    text-shadow: none;
    font-size: 18px;
    font-weight: 500;
 }

 .ticketrechner .btn-back{
   background: none;
   background-color: #ddd;
   color: #444;
   border: none;
   border-radius: 0;
   text-shadow: none;
   font-size: 18px;
   font-weight: 500;
 }

 .ticketrechner .btn-back:hover, .ticketrechner .btn-back:focus,.ticketrechner .btn-back:active{
   
   background-color: #ddd;
   color: #444;

}

 .ticketrechner .btn-default:hover, .ticketrechner .btn-default:focus,.ticketrechner .btn-default:active{
   
    background-color: rgba(243, 146, 0, 0.85) !important;
    color: #000;    
 }

 .ticketrechner .btn-block{
    width: 100%;
 }

 .ticketrechner .ticketrechner-box-desc{
   font-size: 16px;
   padding-bottom: 10px;
   margin-left: -2em;
   margin-right: -2em;
   padding-left: 2em;
   padding-right: 2em;
   
 }

 .ticketrechner-ticketpaket{
  min-height: 250px;
  margin-bottom: 10px;
 }

 .ticketvolumenerr{
   color: rgb(207, 1, 1);
   font-size: 16px;
   margin-top: 10px;
 }

 .ticketrechner .ergebnis{
   background-color: rgba(243, 146, 0, 0.85);
   padding: 5px;
   color: #000;
   text-align: center;
 }

 .ticketrechner .rds-ticketrechner-ergebnis{
   font-weight: 700;
   padding: 10px;
 }

 .ticketrechner .rds-ticketrechner-ergebnis > small{
   font-size: 24px;
   color: #000;
 }

 
 .ticketrechner h3.rds-ticketrechner-ergebnis{
   font-size: 30px;
   color: #000;
   line-height: normal;
   padding: 0 10px;
 }

 .ticketrechner .rds-ticketrechner-ergebnis-ticketpreis{
   font-weight: 700;
   margin: 0;
   padding-bottom: 20px;
   padding-top: 5px;
 }

 .ticketrechner ul.ticketrechner-summary , .ticketrechner ul.ticketrechner-summary  > li{
   list-style: none !important;
   padding: 16px;
   margin: 0;
   background-color: #fff;
   color: #000;
   font-size: 18px;
 }
 
 .ticketrechner .ticketrechner-summary li:before {
   content: '✓';
   color: #20e70e;
   font-weight: 700;
   display: inline-block;
   padding-right: 20px;
 }


 .ticketrechner ul.ticketrechner-checkpoints {
  list-style: none !important;
  padding: 0px;
  margin: 0;
  background-color: #fff;
  color: #000;
  font-size: 16px;
  margin-left: 0 !important;
}

.ticketrechner ul.ticketrechner-checkpoints > li {
  display: flex;
  margin-bottom: 10px;
}

.ticketrechner ul.ticketrechner-checkpoints li:before {
  content: '✓';
  color: #20e70e;
  font-weight: 700;
  display: flex;
  padding-right: 10px;
}

 .ticketrechner .form-check .form-check-input{
  -ms-transform: scale(1.5); /* IE */
  -moz-transform: scale(1.5); /* FF */
  -webkit-transform: scale(1.5); /* Safari and Chrome */
  -o-transform: scale(1.5); /* Opera */
  transform: scale(1.5);
  padding: 10px;
 }

 .ticketrechner-form-box{
  padding:20px 30px;
  border: 1px solid #ccc;
 }

 .ticketrechner .ticketrechner-form label{
  font-weight: 600 !important;
  font-size: 14px;
 }

 .ticketrechner .ticket-input-req::after{
  content:"*";
  color: darkred;
 }

 .ticketrechner .ticketrechner-box{
  display: flex;
  justify-content: flex-start;
  flex-direction: column;
  align-content: space-between;
  justify-content: space-between;
  
 }

 .ticketrechner .ticketrechner-box .btn-down{
  align-self: self-end;
  justify-self: end; 

 }


 
 .ticketrechner  .ticketrechner-box h2{
  font-size: 20px;
  font-weight: 600;
  line-height: normal;
  margin-top: 10px;
  margin-bottom: 10px;
  padding-bottom: 10px;
  margin-left: -15px;
  margin-right: -15px;
  padding-left: 15px;
  padding-right: 15px;
  border-bottom: 2px solid #ccc;
}

.ticketrechner-loading{
  animation-name: spin;
  animation-duration: 2000ms;
  animation-iteration-count: infinite;
  animation-timing-function: linear; 
  margin: 30px auto;
  width: 100px;
  height: 100px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 320'%3E%3Cdefs%3E%3Cstyle%3E.a%7Bfill:%23fff;%7D%3C/style%3E%3C/defs%3E%3Ctitle%3Ecalculator%3C/title%3E%3Cpath class='a' d='M294,163.84v98.68A31.47,31.47,0,0,1,262.52,294H163.84V163.84Z'/%3E%3Cpath class='a' d='M148.32,32.84V148.32H32.84V57A24.17,24.17,0,0,1,57,32.84h91.34m7.34-7.34H57A31.47,31.47,0,0,0,25.5,57v98.68H155.66V25.5Z'/%3E%3Cpath class='a' d='M262.52,32.84A24.17,24.17,0,0,1,286.66,57v91.34H171.18V32.84h91.34m0-7.34H163.84V155.66H294V57A31.47,31.47,0,0,0,262.52,25.5Z'/%3E%3Cpath class='a' d='M148.32,171.18V286.66H57a24.17,24.17,0,0,1-24.14-24.14V171.18H148.32m7.34-7.34H25.5v98.68A31.47,31.47,0,0,0,57,294h98.68V163.84Z'/%3E%3C/svg%3E");
  background-repeat: no-repeat no-repeat;
  background-position: center center;
  background-size: cover;
}

.ticketrechner-success-send{
  border-bottom: 2px solid #f39200;
  border-top: 2px solid #f39200;
  text-align: center;
  font-size: 30px;
  padding: 30px 10px;
  font-weight: 600;
}

.ticketrechner-fail-send{
  border-bottom: 2px solid #f39200;
  border-top: 2px solid #f39200;
  color: darkred;
  text-align: center;
  font-size: 30px;
  padding: 30px 10px;
  font-weight: 600;
}



.ticketrechner-message{
  display: none;
  opacity: 0;
}

.ticketrechner-msg{
  font-weight: 700;
  font-size: 20px;
}


#ticketrechner-validation{
  font-weight: 600;
  font-size: 16px;
  line-height: 20px;
  color: darkred;
}

@keyframes spin {
    from {
        transform:rotate(0deg);
    }
    to {
        transform:rotate(360deg);
    }
}


.pr-x{
  padding-right: 3px !important;
}

.pl-x{
  padding-left: 3px !important;
}


.ticketrechner p.ticketrechner-preis-info{
  font-size: 13px;
  padding: 10px;
}


@media (max-width: 575.98px) {  

}

@media (max-width: 767.98px) {  

  .pr-x{
    padding-right: 15px !important;
  }
  
  .pl-x{
    padding-left: 15px !important;
  }

}

@media (max-width: 991.98px) { 

  .pr-x{
    padding-right: 15px !important;
  }
  
  .pl-x{
    padding-left: 15px !important;
  }


  .ticketrechner  .ticketrechner-box{
    margin-bottom: 5px;
  }
  
}



@media (max-width: 1199.98px) {  

}