/**
 * Compiled using wp-dynamic-css
 * https://github.com/askupasoftware/wp-dynamic-css
 */

/* the following styles modified php output for radio and checkbox from https://medium.com/@PixelsnDecibels/how-to-fully-style-caldera-forms-for-divi-theme-4f2ec30efa17 */
/* /// HIDE BROWSER DEFAULT INPUT TAGS /// */


/*** THIS CHANGES THE LOOK OF THE FORM FIELDS ***/
.caldera-grid .form-control {
 padding: 16px;
 height: auto;
 box-shadow: none;
 background: #F6F7FA;
 color:  #00395a;
 border: 0 !important;
 font-size: 20px !important;
 border-radius: 5px !important;
}

/*** THIS CHANGES THE BUTTON STYLE ***/
.caldera-grid input[type=submit] {
 padding: 10px 20px;
 border-radius: 2px;
 background: #00a0af;
 color: white;
 font-size: 20px;
 border: 2px solid #00a0af;
 float: right;
 transition: all 0.3s ease-in-out;
}

/*** THIS CHANGES THE BUTTON HOVER STYLE ***/
.caldera-grid input[type=submit]:hover {
 background: #1D383B;
 border-color: transparent;
 color: white;
}
/*change the number of players button */
.btn-success {
    background-color: #00a0af !important;
    border-color: #00a0af !important;
}

.caldera-grid .form-control:focus {
    border-color: #00a0af !important;
    box-shadow: none;
}
.caldera-grid label [type="radio"], .caldera-grid label [type="checkbox"] {
    display:none;
}
/* /// OUR MAIN STYLES /// */
.caldera-grid .radio span:before, .caldera-grid .radio-inline span:before, .caldera-grid .checkbox span:before, .caldera-grid .checkbox-inline span:before {
    font-family: "ETmodules";
    font-size: 25px;
    position: relative;
    top: 0.2em;
    margin-right: 0.2em;
    margin-left: -25px;

}
/* /// MAKE THE CURSOR A HAND /// */
.caldera-grid .radio span:hover, .caldera-grid .radio-inline span:hover, .caldera-grid .checkbox span:hover, .caldera-grid .checkbox-inline span:hover { cursor: pointer; }
/* /// OUR CUSTOM INPUTS /// */
.caldera-grid .radio span:before, .caldera-grid .radio-inline span:before { content: "\5b"; }
.caldera-grid .checkbox-inline span:before,  .caldera-grid .checkbox span:before { content: "V"; }
.caldera-grid .radio span:hover:before, .caldera-grid .radio-inline span:hover:before { content: "\5c"; filter: alpha(opacity=20); opacity: 0.2; }
.caldera-grid .checkbox span:hover:before, .caldera-grid .checkbox-inline span:hover:before { content: "Z"; filter: alpha(opacity=20); opacity: 0.2; }
/* /// CHECKED STATE /// */
.caldera-grid [type=radio]:checked + span:before { content: "\5c"; color: #1D383B;}
.caldera-grid [type=checkbox]:checked + span:before { content: "Z"; color: #1D383B;}
.caldera-grid [type=radio]:checked + span:before:hover, .caldera-grid [type=checkbox]:checked + span:before:hover { filter: alpha(opacity=100); opacity: 1; }


/* increase space between from groups */
.caldera-grid .form-group {
  margin-top: 20px;
}


/* style the select dropdown icon start */
.caldera-grid select {
	-webkit-appearance: none !important;
	background-image: url("/wp-content/uploads/2018/05/dropdown-select-arrow_1.png") !important;
	background-size: contain !important;
	background-position: right center !important;
  background-repeat: no-repeat !important;
  -moz-appearance: none;
  text-indent: 1px !important;
  text-overflow: '' !important;
}
.caldera-grid select::-ms-expand {
    display: none;
}
.caldera-grid option:disabled {
  text-shadow: none !important;
  background-color: #E9F3F4 !important;
}

.caldera-grid select {
  cursor: pointer !important;
}

/* style the select dropdown icon end */

/* add a border */
.caldera-grid input, .caldera-grid select, .caldera-grid textarea {
  border-style: solid !important;
  border-width: 1px 1px 1px 1px !important;
  border-color: #00a0af !important;
}
