/* Reset CSS - Custom CSS for Events Air - Aarthi Athi - for WYSTC */
/* Apply a reset CSS to ensure consistent styling across different browsers */
/* You can use popular reset libraries like Normalize.css or reset.css */

/* Base Styles */
/* Define base styles for typography, links, buttons, forms, etc.
body {
  font-family: Arial, sans-serif;
  font-size: 16px;
  line-height: 1.5;
}
 */

body {
  font-family: Arial,'Helvetica Neue',Helvetica,sans-serif !important;
  font-size: 14px;
  line-height: 1.2rem;
  color: #000;
}
a {
  color: #d97d00;
  text-decoration: none;
}
.loading-spinner {
    display: block;
    height: 102px;
    width: 100px;
    background-image: url('https://az659834.vo.msecnd.net/eventsairwesteuprod/production-wysetravel-public/2e639790799846a6a5aa98c832fb0d02') !important;
    background-repeat: no-repeat !important;
    display: none;
}
div.splash.big div, div.holding.big div {
  display: block;
  height: 102px;
  width: 100px;
  margin-top:10em !important;
  background-image: url('https://az659834.vo.msecnd.net/eventsairwesteuprod/production-wysetravel-public/2e639790799846a6a5aa98c832fb0d02') !important;
  background-repeat: no-repeat !important;
}

button {
  padding: 10px 15px;
  border: none;
  background-color: #d97d00;
  color: #fff;
  cursor: pointer;
}

h1{font-weight: 700 !important;}

input{
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0), inset 0 0 0 100px rgba(255, 255, 255,1);
}
.radio label, .checkbox label {
     cursor: default !important;
}
/* Changing the color of the selection */
.select2-container--bootstrap .select2-results__option--highlighted[aria-selected] {
    background-color: #d97d00 !important;
    color: #fff;
}
.background-opacity {
    background-color: #f5f5f5;
}
.theme-number.form-control {
  margin-left: -6px !important;
  margin-right: -6px !important;
}
/* Grid System */
/* Implement a grid system for layout */
/* You can use popular grid systems like Bootstrap or Flexbox Grid */
.WYSTC-container {
  width: 100%;
  margin: 0 auto;
  padding: 0 20px;
  max-width: 1200px;
}

.WYSTC-row {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -15px;
}
.theme-label-floating{
  font-weight: normal !important;
}
.theme-label-floating:hover {
    white-space: nowrap !important;
}
.theme-photo-btn-box label {
    font-weight: normal !important;
}
.WYSTC-col {
  flex: 1;
  padding: 0 15px;
}

.brand-footer {
    margin-bottom: -15px;
    margin-left: -15px;
    margin-right: -15px;
    min-height: 45px !important;
    padding-top: 15px !important;
}
#parentDiv{display: flex; } 
.divChild1{flex: 60%; } 
.divChild2{flex: 1%;  }
.divChild3{flex: 30%; }
.diVChild4{flex: 9%; }
/* Components */
/* Define reusable components like cards, navigation bars, etc. */
.WYSTC-card {
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 5px;
  padding: 20px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.WYSTC-navbar {
  background-color: #007bff;
  color: #fff;
  padding: 10px 0;
}

.WYSTC-navbar ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.WYSTC-navbar li {
  display: inline-block;
  margin-right: 20px;
}
.cstField label {
    cursor: initial;
}    
/* css to set the fluid layout for Registration form - changing from 1000px to 100% */
.div.main-form {
    background-color: #fcfcfc;
    max-width: 100% !important;
}
/* css to remove the default gradient color  - -webkit-linear-gradient(top,#dc9320 0%,#a76f18 100%) */
.btn-default {
    background-image: -webkit-linear-gradient(top, #d97d00 0%, #d97d00 100%);
    background-image: linear-gradient(to bottom, #d97d00 0%, #d97d00 100%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd97d00',endColorstr='#ffd97d00',GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    border-color:#d97d00; /*border-color: #9e6917;*/
}
.btn-default:hover, .btn-default:focus {
  background-color: #d97d00;
  background-position: 0 -15px;
}
.btn-default:hover{
    background-image: -webkit-linear-gradient(top, #d97d00 0%, #d97d00 100%);
    background-image: linear-gradient(to bottom, #d97d00 0%, #d97d00 100%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd97d00',endColorstr='#ffd97d00',GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
    border-color:#d97d00; /*border-color: #9e6917;*/
}
/*default progress bar change - */
.progress-bar {
  /*background-image: -webkit-linear-gradient(top,#dc9320 0%,#af751a 100%);
  background-image: linear-gradient(to bottom,#dc9320 0%,#af751a 100%);*/
  background-image: -webkit-linear-gradient(top,#283479 0%,#283479 100%);
  background-image: linear-gradient(to bottom,#283479 0%,#283479 100%);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff283479',endColorstr='#ff283479',GradientType=0);
}
.progress-bar {
  float: left;
  width: 0%;
  height: 100%;
  font-size: 10pt;
  line-height: 15pt;
  color: #fff;
  text-align: center;
  background-color: #283479;
  -webkit-box-shadow: inset 0 -1px 0 rgba(0,0,0,0.15);
  box-shadow: inset 0 -1px 0 rgba(0,0,0,0.15);
  -webkit-transition: width 0.6s ease;
  transition: width 0.6s ease;
}

.alert-warning{
  color:#d97d00;
  border-color:#d97d00; 
}
/* this part is for the upload photo pop up - begin */
.mfp-inline-holder .mfp-content, .mfp-ajax-holder .mfp-content {
    /*width: 30% !important;
    max-width:30% !important; */
}
.qtip-content h4 {
    text-align: center;
    padding-top: 1em !important;
    padding-left: 2em;
    font-weight: 600;
    color: #283479;
}
.mfp-content .form-group p {
    margin: 1em;
    font-size: 14px;
    font-style: normal;
    color: #283479;
}

#video-container {
    display: inline-block;
    position: relative;
    left:1em;
    /*margin-top:-3em;*/
} 
#preview-container {
    display: inline-block;
    position: relative;
    left: 2%;
}

/* this part is for the upload photo pop up - end */
#page_0 .pull-right {
    float: none !important;
    position: relative;
    left: 44%;
}
#page_0 .dynamic-target.form-horizontal.clearfix {
    padding: 2.8em !important;
}

#imageGroup {
  overflow: hidden;
}
#imageGroup figure {
  width:300%;
  position: relative;
}
#imageGroup figure img {
  width: 150px;
  height : 150px;
        float:none !important;
       margin-left:20px;
}
#page_1 .fa{
   color:#fff !important;
}
div#page_3 {
    font-size: 14px;
}
#page_3 .theme-panel {
  display: inline-flex !important;
  flex-direction: row !important;
  justify-content: flex-end !important;
  position: relative;
  left: 0;
  padding: 0px;
  margin-left: 27.6em;
  width: 60%;
  max-width: 60%;
}
#page_3 .col-xs-8{width:115px !important;}
#page_3 small{
  font-size: 80%;
  color: #d97d00 !important;
  font-weight: 600;
  /*margin-right: 3em !important;*/
}
#page_3 .span.fee-amount,
#page_3 .span.fee-summary {
  font-size: 80%;
}
#page_3 .small{
 font-size: 80%;
  color: #d97d00 !important; 
}

#page_3 .dynamic-target.form-horizontal.clearfix.theme-component-registration {
    width: 193.8px !important;
    border: 1px solid #f5f5f5 !important;
    padding-bottom: 0px !important;
    padding-top: 15px;
    /* background-color: #f5f5f5; */
}
#page_3 .text-muted {
  color: #444444;
  padding-top: 24px;
}
#page_3 .theme-panel .col-sm-6{
  width: 51% !important;
  max-width: 51% !important;
  line-height: 1rem;
}
#page_3 .discount-code input.form-control.theme-textbox{
    width: 193px !important;
    display: block !important;
    margin-top:-7px;
    background-color: #f5f5f5 !important;
}
#page_3 .discount-code input.form-control.theme-textbox:focus{
  font-stretch: 76%;
}
#page_3 input#\30 4337e93-bed3-4f60-b4d3-35c645f03438_DiscountCodeKey{
    width: 193px !important;
    display: block !important;
    margin-top:-7px;
    background-color: #f5f5f5 !important;
}
#page_3 .theme-label-primary {
  font-size:81%;
  background-color: #d97d00;
  border-radius: 0px;
  position: relative;
  left: 0rem;
  top: -4.4rem;
}
#page_3 hr{border-top:none;}

.discount-code input.form-control.theme-textbox {
  width: 193px !important;
  display: block !important;
  background-color: #f5f5f5 !important;
}

/*#page_3 .theme-panel .col-sm-8{
 width:44.6% !important;
 max-width:44.6% !important;
}*/
#page_3 input[type="radio"] {
    margin: 0% 0px 0 !important;
    line-height: normal;
    box-shadow: inset 0 0 0 0px #f7f7f7, inset 0 0 0 -2px #fff !important;
    border-radius: 50px !important;
    margin-left: 60px !important;
}
#page_3 input[type='radio']:focus{
    line-height: normal;
    box-shadow: inset 0 0 0 0px #f7f7f7, inset 0 0 0 -2px #fff !important;
    border-radius: 50px !important; 
    margin-left: 60px !important;

}
#page_3 table tr td {
    border-right: 1px solid #d7d7d7;
}

#page_4 input[type="radio"] {
    margin: 2% 10px 0;
    line-height: normal;
    float: left;
    box-shadow: inset 0 0 0 0px #f7f7f7, inset 0 0 0 -2px #fff !important;
    border-radius: 50px !important;
}
#page_4 input[type="checkbox"],
#page_5 input[type="checkbox"],
#page_6 input[type="checkbox"]
{
    margin: 2% 10px 0;
    line-height: normal;
    box-shadow: inset 0 0 0 0px #f7f7f7, inset 0 0 0 -2px #fff !important;
    border-radius: 50px !important; 
}
#page_7 input[type="checkbox"],
#page_8 input[type="checkbox"] {
    margin: 1% 10px 0;
    line-height: normal;
    box-shadow: inset 0 0 0 0px #f7f7f7, inset 0 0 0 -2px #fff !important;
    border-radius: 50px !important; 
}
#page_4 input[type='checkbox']:focus,
#page_5 input[type='checkbox']:focus,
#page_6 input[type='checkbox']:focus,
#page_7 input[type='checkbox']:focus,
#page_8 input[type='checkbox']:focus{
    line-height: normal;
    box-shadow: inset 0 0 0 0px #f7f7f7, inset 0 0 0 -2px #fff !important;
    border-radius: 50px !important; 
}
#page_4 .col-xs-6,
#page_6 .col-xs-6,
#page_7 .col-xs-6 {
  width:50% !important; 
  margin-left: -5rem !important;
}

#page_5 input[type="radio"],
#page_6 input[type="radio"],
#page_7 input[type="radio"] {
    margin: 2% 10px 0;
    line-height: normal;
    float: left;
    box-shadow: inset 0 0 0 0px #f7f7f7, inset 0 0 0 -2px #fff !important;
    border-radius: 50px !important;
}
#page_5 .fa{
  color:#283479 !important;
}
#page_5 div#\30 0435bab-6af0-4ca9-ab12-55a791790215 .radio label {
  margin-left: -5em !important;
}
#page_5 div#\38 af06de0-129e-3fa7-000b-3a11a3d93232 .radio label{
 margin-left: -5em !important; 
}
#page_5 div#fb13ca81-5f6c-4de7-8a6f-6445bc2dee12 .radio label {
    margin-left: -5em !important;
}

#page_7 .summary-table,
#page_8 .summary-table {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    background-color: #f5f5f5;
    padding: 1rem;
}
#anchor_ea59d08f-49ee-8deb-6d1d-3a12259a51c1 {
   margin-left: 0em;
}
#page_7 input[type="checkbox"],
#page_8 input[type="checkbox"] {
  margin: 0.8% -24px 0 !important;
  line-height: normal;
  box-shadow: inset 0 0 0 0px #f7f7f7, inset 0 0 0 -2px #fff !important;
  border-radius: 50px !important;
}
#page_8 .col-sm-4 {
    width: 31.3% !important;
}

#page_9 .radio input[type="radio"]{
margin-top:2px !important ; 
}
.field--not-empty + .select2-container + .theme-label-floating{
  text-transform:initial !important ;  
}
.theme-label-floating {
   text-transform: initial !important;
}

#anchor_fa39b12d-ed54-417e-8758-ba4d5827b8b8 {
  margin-left: 2.5em !important;
}
/*
div#\36 e644489-13df-2a14-56ff-3a12259a51d0 .btn {
    margin-left: 40% !important;
}*/
/*final thank you page after */
/*div#c12bcb88-38b2-d5cd-d0fd-3a11a3d93232 .col-xs-12 .btn-default {
    margin-left: 40% !important;
}*/
div#thankyouBtn {
    margin-top: 4%;
    margin-left: 43%;
}
/*div#c12bcb88-38b2-d5cd-d0fd-3a11a3d93232 .btn{
    margin-left: 40% !important;
}*/
/*#page_7 .text-muted{
  text-transform: lowercase !important;
  font-size: 100%;
  color: #283479;
}
#page_7 .text-muted:first-letter{
  text-transform: uppercase !important;
} taken down temp for testing*/
/*page_8*/
/*#page_7 h3#anchor_7bcd24a5-b415-03cc-6f2e-3a11f811afd1 {
    margin-left: 5.2em !important;
}
#page_7 h2#anchor_30c27f24-d85a-f2fc-e797-3a11f811afd1 {
    margin-left: 5.2em !important;
}*/
#page_7 .col-sm-4 {
 width:34.3%;
} 
#page_7 .termsAndConditions {
    overflow-y: scroll;
    width: 86%;
    margin: auto;
    border: 1px solid #d7d7d7;
    padding: 3em;
    height: 400px;
}
#page_8 .col-sm-4 {
 width:34.3%;
} 
/*#page_10 .form-horizontal .form-group {
  margin-left: 40% !important;
}*/
/*#page_10 .btn-default{
  margin-left: 2em;
}*/
/* Responsive Design -mobile */
/* Implement styles for different screen sizes */
/* You can use media queries to achieve responsiveness */
@media (min-width: 768px){
#page_3 .radio label{
  display: none !important;
}  
#page_3 .radio > label{
  display: none !important;
}
/* Do we need this - testing
#page_3 .col-xs-8{
  width:0% !important;
  max-width: 0% !important;
}*/

}
@media (max-width: 768px) {
  .WYSTC-container {
    padding: 0 10px;
  }

  .WYSTC-col {
    width: 100%;
    padding: 0;
  }
/* css to set the fluid layout for Registration form - changing from 1000px to 100% */
.div.main-form {
    background-color: #fcfcfc;
    max-width: 80% !important;
}
#imageGroup{
  display: none !important;
}
#parentDiv{ display: inline-block; } 
.divChild1{flex: 90%; } 
.divChild2{display:none;}
.divChild3{flex: 90%; }
.divChild3 img{width:100%;}
.diVChild4{display: none; }

#page_0 .pull-right {
    float: none !important;
    position: relative;
    left: 30%;
}

#page_0 .dynamic-target.form-horizontal.clearfix {
    padding: 2rem !important;
}
/* this part is for the upload photo pop up - begin */
#video-container {
    display: inline-block;
    position: relative;
    left: 0.3em;
    /* margin-top: -3em; */
    right: 1em !important;
}
.mfp-inline-holder .mfp-content, .mfp-ajax-holder .mfp-content {
    width: 97% !important;
    max-width:97% !important; 
}
.mfp-content .form-group p {
    margin: 1em;
    font-size: 14px;
    font-style: normal;
    color: #283479;
}
#preview-container {
    display: inline-block;
    position: relative;
    left: -3%;
}

#page_3 .theme-panel {
  content: "";
  display: block !important;
  padding: 2% 5%;
  margin-bottom: 3%;
  box-shadow: inset 0 -5px 0 0 #d97d00,-2px -2px 20px 0 rgba(0,0,0,0.05),2px 2px 20px 0 rgba(0,0,0,0.05);
  position: relative;
  margin-left: 0rem !important;
  width: 100% !important;
  max-width: 100% !important;
}
#page_3 .dynamic-target.form-horizontal.clearfix.theme-component-registration {
  width: 100% !important;
}
#page_3 .text-muted {
  color: #444444;
  padding-top: 24px;
}
#page_3 .theme-panel .col-sm-6{
  /*width: 51% !important;
  max-width: 51% !important;
  line-height: 1rem;*/
}
#page_3 input[type="radio"] {
    margin: 0% 20px 0 !important;
    line-height: normal;
    box-shadow: inset 0 0 0 0px #f7f7f7, inset 0 0 0 -2px #fff !important;
    border-radius: 50px !important;
    margin-left: 0px !important;
}
#page_3 input[type='radio']:focus{
    margin: 0% 20px 0 !important;
    line-height: normal;
    box-shadow: inset 0 0 0 0px #f7f7f7, inset 0 0 0 -2px #fff !important;
    border-radius: 50px !important;
    margin-left: 0px !important;
}
#page_3 .col-xs-8{width:66% !important;}
#page_3 .theme-label-primary {
    background-color: #d97d00;
    border-radius: 0px;
}
#page_5 .theme-panel{
  display: contents;
}
#page_5 .theme-panel .col-xs-4 {
    width:80% !important;
    max-width: 80% !important;
}
#page_5 .small {
    font-size: 85%;
    padding-top: 15px;
}
#page_5 div#\30 0435bab-6af0-4ca9-ab12-55a791790215 .radio label {
  margin-left: 0em !important;
}
#page_5 div#\38 af06de0-129e-3fa7-000b-3a11a3d93232 .radio label{
 margin-left: 0em !important; 
}
#page_5 div#fb13ca81-5f6c-4de7-8a6f-6445bc2dee12 .radio label {
    margin-left: 0em !important;
}
#page_6 .col-xs-6,
#page_8 .col-xs-6{
  width:50% !important; 
  margin-left: 0rem !important;
}
/*edited this line for the volunteer tshirt options for mobile*/
#page_4 .col-xs-6{
  width:44% !important; 
  margin-left: 0em !important; 
}
page_4 .col-xs-12{
  padding-left:0px !important;
}
/*edited this line for the volunteer tshirt options for mobile*/
#page_7 .col-xs-6{
  width:50% !important; 
  margin-left: -1rem !important;  
}
#page_7 .summary-table,
#page_8 .summary-table {
    max-width: 90%;
    margin-left: auto;
    margin-right: auto;
    padding: 2rem;
}
#page_7 .col-sm-6,
#page_8 .col-sm-6 {
    width: 100%;
}
#anchor_4de3b866-e46d-9333-9ff6-3a11a3d93232{
    max-width: 90%;
    margin-left: auto;
    margin-right: auto;
}
#anchor_9bbad052-3e57-4201-8370-a11490c9e393 {
    max-width: 90%;
    margin-left: auto;
    margin-right: auto;
}
div#c12bcb88-38b2-d5cd-d0fd-3a11a3d93232 .col-xs-12 .btn-default {
    margin-left: 10% !important;
}
div#c12bcb88-38b2-d5cd-d0fd-3a11a3d93232 .btn{
    margin-left: 10% !important;
}
div#thankyouBtn {
    margin-left: 20%;
    margin-top: 10%;
}
}