/*
Theme Name: Bacardi Dance Bar
Version: 0.1
Author URI: thecommunity.ca
Description: A Minimal Wordpress Theme.
Tags: minimal, simple, responsive, light-weight
Text Domain: bacardi-dance-bar
*/

@font-face {
    font-family: "Grotesque MT";
    src: url("fonts/GrotesqueMT.otf") format("opentype");
}
@font-face {
    font-family: "Grotesque MT Bold";
    src: url("fonts/GrotesqueMT-Bold.otf") format("opentype");
}
@font-face {
    font-family: "Grotesque MT Light";
    src: url("fonts/GrotesqueMT-Light.otf") format("opentype");
}
@font-face {
    font-family: "Grotesque MT Std Light";
    src: url("fonts/GrotesqueMTStd-Light.otf") format("opentype");
}
@font-face {
    font-family: "Adobe Caslon Pro";
    src: url("fonts/Adobe Caslon Pro Regular.ttf") format("truetype");
}
body { color: #000;
    background-color: #f2eee8;
    font-family: "Grotesque MT" !important;
    font-size: 16px;
    font-style: normal;
}

a { color: #000; text-decoration: underline; }
a:visited { color: #000; text-decoration: underline; }
a:hover { color: #000; text-decoration: none; }

h1 { text-align: center; font-size: 60px; font-family: "Grotesque MT Bold" !important; font-size: 60px; }

.modal-body{
    font-family: "Grotesque MT Std Light";
}
.logo {
    max-width: 400px;
    margin: 60px auto 0;
    display: block;
    width:100%;
}

.custom_button { background-color: #000; color: #fff;  font-size: 20px; border: 0; padding: 10px 20px; text-transform: uppercase; text-align: center; }
.button_area { display: block; }
.next_button { max-width: 120px; margin:50px auto 30px; cursor: pointer; }
.back_button { max-width: 120px; cursor: pointer; margin-bottom: 55px; }

form#gform_1 { display:block; margin:30px auto 0px; width: 100%; max-width:820px; background: #fbfbfb; padding: 60px 30px 30px; }
.gfield { clear:both; margin-bottom: 20px; }
.gfield label { float: left; width:288px; font-size: 16px; text-align: left; }

.gfield select,
.gfield input[type="email"],
.gfield input[type="text"] { padding:10px; outline: none !important; border: solid 1px #666; width:270px; }


fieldset#field_1_5 .gfield_label { font-size: 16px; }
fieldset.dob_fields legend.gfield_label { float: left; width: 288px; }
fieldset.dob_fields select { width:85px; float: left; margin-right: 7px; }
div.photo_upload_field { margin-top:30px; }
div.photo_upload_field .gform_fileupload_rules { display: none; }

div.gfield_checkbox label { width: 94%; float: right; }




body.show_part_one fieldset#field_1_21,
body.show_part_one fieldset#field_1_20,
body.show_part_one fieldset#field_1_19,
body.show_part_one div#field_1_6,
body.show_part_one fieldset#field_1_5,
body.show_part_one div#field_1_4,
body.show_part_one div#field_1_3,
body.show_part_one div#field_1_2,
body.show_part_one div#field_1_1 { display: block; }

body.show_part_one fieldset#field_1_21 legend,
body.show_part_one fieldset#field_1_20 legend,
body.show_part_one fieldset#field_1_19 legend { display: none; }



body.show_part_two form#gform_1 { padding-top: 5px; }
body.show_part_two fieldset#field_1_21,
body.show_part_two fieldset#field_1_20,
body.show_part_two fieldset#field_1_19,
body.show_part_two div#field_1_6,
body.show_part_two fieldset#field_1_5,
body.show_part_two div#field_1_4,
body.show_part_two div#field_1_3,
body.show_part_two div#field_1_2,
body.show_part_two div#field_1_1 { display: none; }

body.show_part_two fieldset#field_1_21 legend,
body.show_part_two fieldset#field_1_20 legend,
body.show_part_two fieldset#field_1_19 legend { display: block; }






.not_valid { background-color: rgba(193,0,32,0.1); border: solid 1px #c10020 !important; }


.dob_not_valid,
.email_not_valid,
.first_name_not_valid,
.last_name_not_valid,
.cannot_click { pointer-events: none; opacity: 0.3; }




.gform_footer { margin-top: 50px; text-align: center; margin-bottom: 25px; }


fieldset#field_1_5 .gfield_label,
.gfield_label[for="input_1_3"],
.gfield_label[for="input_1_2"],
.gfield_label[for="input_1_1"] { padding-top:14px; }

.gfield_label[for='input_1_22'],
.gfield_label[for='input_1_23'],
.gfield_label[for='input_1_15'] { padding-top: 14px; }

.gfield_label[for="input_1_4"] { line-height: 1.3; padding-top: 3px; }


div#field_1_6 { text-align:center; border-top: solid 2px #af956e; border-bottom: solid 2px #af956e; max-width: 600px; margin-left: auto; margin-right: auto; margin-top: 30px; padding: 40px 0; }

label[for="input_1_6"] { display: block; width: 100%; text-align: center;  }
input#input_1_6 { margin-top: 15px; }

label[for="choice_1_21_1"],
label[for="choice_1_19_1"],
label[for="choice_1_20_1"] { font-size: 13px; }

fieldset#field_1_21,
fieldset#field_1_20,
fieldset#field_1_19 { width:100%; max-width: 400px; margin: 0 auto 30px !important; padding:0 !important; line-height: 1.55;  }

fieldset#field_1_21 { margin-bottom: 0; }


fieldset#field_1_5,
div#field_1_4,
div#field_1_3,
div#field_1_2,
div#field_1_1 { margin-left: auto; margin-right: auto; width: 570px; text-align: left; float: none; }

span.gfield_required { color: #c10020; }

input#input_1_22,
input#input_1_23 { pointer-events: none; background: #ddd; }


/* The Modal (background) */
.modal {
    display: none; 
    position: fixed; 
    z-index: 1; 
    padding-top: 100px; 
    left: 0;
    top: 0;
    width: 100%; 
    height: 100%; 
    overflow: auto; 
    background-color: rgb(0, 0, 0); 
    background-color: rgba(0, 0, 0, 0.4); 
}

/* Modal Content */
.modal-content,
.modal2-content {
    background-color: #fefefe;
    margin: auto;
    padding: 20px;
    border: 1px solid #888;
    width: 80%;
}

/* The Close Button */
.close {
    color: #aaaaaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.close:hover,
.close:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
}

body.show_part_one input#gform_submit_button_1,
body.show_part_one div#field_1_15,
body.show_part_one div#field_1_22,
body.show_part_one div#field_1_23 { display: none; }


.modal2-content .modal-header { position: relative;}
.modal2-content .close { width: 20px; position: absolute; right: 23px; top: 0px; }
.modal2-content h2 { text-align: left; }

.modal-content .modal-header { position: relative;}
.modal-content .close { width: 20px; position: absolute; right: 23px; top: 0px; }
.modal-content h2 { text-align: left; }





@media (max-width: 625px) {
    form#gform_1 { width: 100%; max-width: 100%; } 
    label.gfield_label { display: block; width: 100%; }
    .gfield select, .gfield input[type="email"], .gfield input[type="text"] { width:99%; max-width: none; }
    fieldset#field_1_5 legend { display: block; width: 100%; }

    fieldset#field_1_5, div#field_1_4, div#field_1_3, div#field_1_2, div#field_1_1 { width: 100%; }

    h1 { font-size: 50px; }
    h2 { font-size: 27px; padding-top: 15px; }
    .modal { padding-top: 50px !important; }
    img.logo { margin-top: 30px; }
}



@media (max-width: 400px) {
    div.gfield_checkbox label { width: 92%; }
    fieldset.dob_fields select { margin-right: 1px; }
    div.modal-body { padding-left:0 !important; padding-right: 0 !important; }

    .modal { padding-top: 0 !important; }
    .modal-content,
    .modal2-content { width:92% !important; }
}