/***************************************************************************/
/*		               	OVERALL IFRAME STYLES       	         		   */
/***************************************************************************/

@import url('https://fonts.googleapis.com/css2?family=Open+Sans&display=swap');


/*change the background color of the overall iframe registration module*/
/*0 in the last parameter means color is transparent*/
body {
  background-color: #23386e;
  font-family: 'Open Sans', sans-serif;
}

a, a:hover {
  color: white;
  text-decoration: underline;
}

.registration .banner{
display: none;
}

.registration{
	background-color: #23386e;
  max-width: 480px;
  margin-left: auto;
  margin-right: auto; 
}

@media (max-width: 400px) {
  .registration .main-card.summary-card .basic>section>div:nth-of-type(3) {
    width: 100%;
  }
}

@media (max-width: 767px) {
  .table-responsive {
    border: none;
  }
  #program .title {
    border: none;
  }
}

@media (max-width: 500px) {
  .registration {
    max-width: 90%;
  }
}


/***************************************************************************/
/*		            	REGISTRATION FORM STYLES	        			   */
/***************************************************************************/


/*change the styles of the form's title*/
.registration .public-registration-container section.title {
  font-size: 20px;
  text-transform: uppercase;
  font-weight: bold;
  color: white;
  border: none;
  font-family: 'Open Sans', sans-serif;
}

.new-card {
  background-color: #23386e !important;
  color: #fff;
  box-shadow: none;
  -webkit-box-shadow: none;
}

/*change the styles of the form*/
.form-control {
  border-radius: 0;
  background-color: #23386e;
  border-color: transparent !important;
  border-bottom-color: #fff !important;
  box-shadow: none !important;
  padding: 0;
  margin-top: 0;
  margin-bottom: 10px;
  line-height: 3;
  height: auto;
  color: #fff;
}

.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
  background-color: #23386e;
  border-color: #fff !important;
}

.input-group-addon {
  color: #fff;
  background-color: #b29569;
  border: 1px solid #fff;
}

/*change the styles of the button to save the form*/
.main-card button, input.btn {
  background-color: #0048BB;
  line-height: 2;
  border-radius: 4px;
  border: none !important;
  padding: 12px 24px;
  margin: 40px 0 120px 0 !important;
  font-weight: bold;
  font-size: 16px;
}

/*change the styles of the button when hovering it*/
.main-card button:hover, input.btn:hover {
  background-color: #005cee !important;
}


/***************************************************************************************/
/*		   	                 ACTIVITIES SELECTION STYLES	             			   */
/***************************************************************************************/


.workshop__date--selected{
    font-family: Verdana,sans-serif;
    font-size: 14px;
    background-color: #b29569 !important;
    color: white;
}

.workshop__view-more{
  color:#b29569 !important;
}

.workshop__time--selected{
  color: #b29569 !important;
  border: 2px solid #b29569 !important;
}
.workshop__time--selected.workshop__time--selected:hover{
  color: #b29569 !important;
  border: 2px solid #b29569 !important;
   background-color: white !important;
}
.workshop__time:hover{
  color: #b29569 !important;
  border: 2px solid #b29569 !important;
}

.workshop__date.workshop__date--selected{
  background-color: #1a59bd !important;
}
.workshop__date.workshop__date--selected:hover{
  color: #b29569 !important;
  background-color: white !important;
}
.workshop__date:hover{
  color: #1a59bd !important;
  background-color: #b29569 !important;
}
.workshop__dates-row{
   background-color: white !important;
}

.workshop__content{
  border-left: 5px solid #b29569 !important;
}

/*change the color of the arrow left when selecting a workshop*/
.workshop__times-row .times__btn-left-scroll.btn-scroll{
  color:#b29569;
  background-color: white;
}

/*change the color of the arrow right when selecting a workshop*/
.workshop__times-row .times__btn-right-scroll.btn-scroll{
  color:#b29569;
  background-color: white;
}

.workshop__dates-row .dates__btn-right-scroll.btn-scroll{
  color:#b29569;
  background-color: white;
}

.workshop__dates-row .dates__btn-left-scroll.btn-scroll{
  color:#b29569;
  background-color: white;
}


/***********************************************************************************************/
/*		   	        PARTICIPANT SUMMARY AND PAYMENT SELECTION STYLES		        		   */
/***********************************************************************************************/

.section-title {
  color: #fff;
}

.summary-container {
  flex-wrap: wrap;
}

.summary-container .participants-summary {
  width: 100%;
}

.summary-container .payment-summary {
  width: 100%;
}

/*in participants summary change the colors of button Add New Participant*/
.participants-summary .add-new-button{
  color: #b29569 !important;
  border: 2px solid #b29569 !important;
}

/*display the total amount to pay in bold*/
.registration .main-card.payments table tbody tr.consolidated-stats td.data-balance {
  font-size: 1rem;
  font-weight: bold;
}

/*change the color of the payment button*/
.payment-btn-container .btn-primary.btn.public-btn.btn-payment.btn-primary-action{
  color: white !important;
  border: none !important;
  background-color: #0048BB;
  margin: 16px 0px;
  font-size: 16px;
  font-weight: bold;
}

.payment-btn-container:hover .btn-primary.btn.public-btn.btn-payment.btn-primary-action:hover {
  background-color: #005cee !important;
}

/*change the color of the total amount to pay*/
.balance .balance-val{
	color: #b29569 !important;
}

/*in participants summary change the color of the arrow to see my participant info*/
.attendee-new-card .basic-details .right-section .expand-info{
  color:#b29569;
  background-color: white;
}

.update-register {
  width:100%;
}

/*when adding a new participant change the color of the button SAVE*/
.update-register .btn-primary-action.btn.update-attendee {
  color: white !important;
  background-color: #0048bb;
  width: 100%;
}

/*when adding a new participant change the color of the button CANCEL*/
.update-register .btn.btn-secondary-action.cancel-registration {
  color: #b29569 !important;
  border: 2px solid #b29569 !important;
  background-color: white;
}