/******************** Event Registration Stylesheet ********************/

/********** Registration Container **********/
#registration-ctn {
       width: 100%;
    max-width: 960px;
    height: auto;
    margin: auto;
    text-align: center;
    position: absolute;
    left: 0;
    right: 0;
    top: 200px;
}
.payment-info {width:100%;margin-top:15px;}
.payment-info ul {padding:0;margin-top:10px;}
.payment-info li {width:25%;display:inline-block;margin:0 2.5%;}
.payment-info p {width:100%;display:inline;}
.payment-info img {width:100%;}
/********** Event Registration Container **********/
/********** Event Information Container **********/
#event-registration-ctn,
#event-info-ctn {
    height: auto;
    margin: auto;
    background-color: #fff;
    text-align: center;
    border-radius: 3px;
    border: 1px solid #e1e1dd;
}
#event-info-ctn {
    width: 35%;
    position: absolute;
    right: 0;
    top: 0;
}
#event-registration-ctn {
    width: 64%;
    position: absolute;
    left: 0;
}

/********** Event Summary Container **********/
#event-summary-ctn {
    width: 64%;
    height: 265px;
    background-color: #fff;
    border: 1px solid #e1e1dd;
    border-radius: 3px;
    margin-bottom: 10px;
}
#event-summary-header {
    width: 100%;
    height: 50px;
    background-color: #005025;
    color: #fff;
    border-bottom: 1px solid #e1e1dd;
}
#event-summary-header h1 {
    margin: 0;
    font-size: 22px;
    line-height: 49px;
}
#event-summary {
    height: 150px;
    padding: 10px;
}
#event-summary-ctn button {
    margin: 10px 0;
}

/********** Event Info Header **********/
#event-info-header-ctn {
    width: 100%;
    height: 200px;
    background-size: cover;
}
#event-info-title {
    width: 100%;
    height: 100%;
    margin: 0;
    background-color: rgba(0,0,0,.8);
    color: #fff;
    font-size: 25px;
    padding: 40px 10px;
}
#event-info-title:hover {
    opacity: 0;
}
#event-info-title span {
    font-size: 20px;
    margin-top: 28px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    display: block;
    width: 120px;
    border: 1px solid #fff;
    padding: 10px;
    border-radius: 20px;
}
/********** Event Info **********/
#event-info {
    width: 100%;
    height: auto;
    background-color: #fff;
}

/********** Event Info List **********/
/********** Event Info List **********/
.event-info-list {
    width: 100%;
    border-bottom: 1px solid #e1e1dd;
    display: flex;
    align-items: center;
    flex-flow: row wrap;
}
.event-info-list:last-child {
    border: none;
}
.event-info-list:hover {
    background-color: #EDEDED;
}
.event-info-list:first-child:hover {
    background-color: #fff !important;
}
.event-info-list-title {
    text-align: center;
    width: 28%;
    color: #fff;
  height: 50px;
    line-height: 50px;
    align-self: center;
    background-color: #005025;
    border-bottom: 1px solid #fff;
}
.event-info-list span:last-child {
    text-align: center;
    width: 71.6%;
}
.event-info-list h3 {
    margin: 0;
    font-weight: bold;
    line-height: 50px;
    font-size: 20px;
}

/********** Event Open Description Button **********/
#event-info-open-description {
    width: 200px;
    margin-top: 30px;
    color: #fff;
    border: none;
    height: 40px;
    border-radius: 1px;
    outline: none;
}

/********** Event Info Description Container Ends **********/
#event-info-description-ctn {
    width:90%;
	max-width: 700px;
    height: 500px;
    background-color: #fff;
    position: absolute;
    left: 0;
    right: 0;
    margin: auto;
    top: 50px;
    border-radius: 3px;
}
#event-info-description-header-ctn {
    width: 100%;
    height: 50px;
    position: absolute;
    color: #fff !important;
    background-color: #005025;
    border-bottom: 1px solid #e1e1dd;
}
#event-info-description-header-title {
    font-size: 20px;
    position: absolute;
    top: 0;
    margin: 1px 0;
    line-height: 48px;
    padding: 0 15px;
    height: 100%;
}
#event-info-close-description {
    width: 50px;
    height: 50px;
    position: absolute;
    right: 0;
    background-color: transparent;
    border: none;
    font-size: 24px;
    border-left: 1px solid #e1e1dd;
    color: #666;
    outline: none;
}
#event-info-description-box {
        width: 65%;
    max-width: 480px;
    max-height: 400px;
    height: auto;
    margin-top: 70px;
    padding: 0 10px;
    text-align: left;
}
#event-info-descript-right-column {
   width: 35%;
    height: 100px;
    right: 8px;
    top: 70px;
    position: absolute;
}
#event-info-descript-right-column .event-info-list .event-info-list-title {
    border-right: none !important;
}

/********** Event Total **********/
#event-info-total-ctn {
    width: 100%;
    height: 50px;
    background-color: #005025;
    color: #fff;
    position: absolute;
    bottom: -50px !important;
    margin-top: 50px !important;
}
#event-info-total-ctn span:first-child {
    width: 98px;
    font-weight: bold;
    line-height: 48px;
    height: 100%;
    display: block;
    float: left;
}
#event-info-total-ctn span:last-child {
    width: auto;
    padding: 0 30px;
    float: right;
    height: 100%;
    line-height: 53px;
}
/********** Event Registration Header **********/
#event-registration-header-ctn {
    width: 100%;
    height: auto;
    padding: 15px;
}
#event-registration-header-ctn h1 {
    margin: 0;
}

/********** Event Registration Form Container **********/
#event-registration-form-ctn {
    width: 100%;
    height: auto;
}
/********** Event Registration Form **********/
#event-registration-form {
    width: 100%;
    height: 100%;
}
#registration-personal-sec-inner-ctn,
#registration-payment-sec-inner-ctn {
    width: 80%;
    margin: auto;
}
#event-registration-form input, #event-registration-form select {
    margin-bottom: 7px
}

/********** Personal Section **********/
.reg-fname-inpt,
.reg-lname-inpt,
.reg-company-inpt,
.reg-jobtitle-inpt,
.reg-address-inpt,
.reg-address2-inpt,
.reg-city-inpt,
.reg-zipcode-inpt {
    width: 49.5%;
}
.reg-fname-inpt,
.reg-company-inpt,
.reg-address-inpt,
.reg-country-inpt,
.reg-city-inpt {
    float: left;
}
.reg-lname-inpt,
.reg-jobtitle-inpt,
.reg-address2-inpt,
.reg-state-inpt,
.reg-zipcode-inpt {
    float: right;
}
.reg-email-inpt,
.reg-phone-inpt {
    width: 100%;
}
.reg-country-inpt, .reg-state-inpt {
    width: 49.5% !important;
    height: 40px !important;
}
/********** Additional Members Section **********/
#registration-additional-members-ctn {
    margin-top: 20px;
}
.reg-remove-user-btn {
    width: 100%;
    margin-bottom: 20px;
}

/********** Payment Section **********/
/***** Payment Method Buttons *****/
#payment-method-btns-ctn {
    /*background-color: #f00;*/
    text-align: center;
    height: 151px;
    width: auto;
}
#payment-method-creditcard,
#payment-method-cheque,
#payment-method-partner {
    width: 30% !important;
    height: auto;
    display: inline-block;
	
}
.payment-method-btn {
	background-color: #005025;
	background-image: none;
}
.payment-method-btn:hover, .payment-method-btn:active, .payment-method-btn:focus {
    background-color: #005025;
    background-image: none;
}
#payment-method-btns-ctn .fa {
	font-size:3.5em;
	line-height:1.25em;
	color:white;
}
#payment-method-creditcard:hover .fa,
#payment-method-cheque:hover .fa,
#payment-method-partner:hover .fa, #add-additional-members-btn:hover .fa, #payment-next-btn:hover .fa,
#payment-back-btn:hover .fa, #personal-next-btn:hover .fa {
	color:#d89e00;
}
#payment-next-btn .fa,
#payment-back-btn .fa, #personal-next-btn .fa {
	font-size:1.25em;
}
#personal-next-btn .fa, #payment-next-btn .fa {
	margin-left:5px;
}
#payment-back-btn .fa {
	margin-right:5px;
}
button .fa {
	vertical-align: middle;
}
#payment
#cc-fname-inpt,
#cc-lname-inpt,
#cc-expiration-inpt,
#cc-cvc-inpt,
#cc-address-inpt,
#cc-address2-inpt,
.cc-country-inpt,
.cc-state-inpt,
#cc-city-inpt,
#cc-zipcode-inpt,
#check-fname-inpt,
#check-lname-inpt,
#check-address-inpt,
#check-address2-inpt,
#check-country-inpt,
.check-state-inpt,
#check-city-inpt,
#check-zipcode-inpt {
    width: 49.5%;
}
#cc-fname-inpt,
#cc-expiration-inpt,
#cc-address-inpt,
.cc-country-inpt,
#cc-city-inpt,
#check-fname-inpt,
#check-address-inpt,
#check-country-inpt,
#check-city-inpt {
    float: left;
}
#cc-lname-inpt,
#cc-cvc-inpt,
#cc-address2-inpt,
.cc-state-inpt,
#cc-zipcode-inpt,
#check-lname-inpt,
#check-address2-inpt
.check-state-inpt,
#check-zipcode-inpt {
    float: right;
}
#cc-email-inpt,
#cc-number-inpt,
#cc-phone-inpt,
#check-pon-inpt,
#check-phone-inpt,
#check-email-inpt {
    width: 100%
}
.cc-country-inpt,
.cc-state-inpt,
#check-country-inpt,
.check-state-inpt {
    height: 40px;
}
/********** Registration Section **********/
.registration-section {

    width: 100%;
    height: auto;
    padding-bottom: 14px;
    margin-bottom: 10px;
    text-align: center;
}

/********** Regsitration Section Title **********/
.registration-section-title {
    width: 100%;
    height: 40px;
    margin-top: -10px;
    margin-bottom: 20px;
    display: block;
}
.secIsVisible {
    display: block !important;
}

/********** Control Buttons **********/
.event-control-btn,
.reg-remove-user-btn,
#reg-submit-btn {

       width: 25%;
    height: 40px;
    color: #fff;
    border: none;
    border-radius: 1px;
    outline: none;
	    margin-top: 10px;
}
#reg-submit-btn img {
    width: 28px;
    height: 28px;
}
#reg-promo-code-ctn {
width:90%;
    max-width: 500px;
    margin: 10px auto 21px auto;
}
#add-additional-members-btn {
    width: 50%;
}
#add-additional-members-btn .fa {
	font-size:1.25em;
	margin-right:5px;
}
#reg-submit-btn {
    width:90%;
    max-width: 350px;
}
.reg-remove-user-btn {
    width: 100%;
    background-color: #F73341;
}
.payment-method-btn {
    width: 100%;
    margin-top: 16px;
    height: 103px;
    color: #fff;
    border: none;
    border-radius: 1px;
    outline: none;
}

.tier-highlight {
 background-color: rgba(255, 210, 48, 0.49) !important;
	height: 50px;
    line-height: 50px;
}

#registration-overview-receipt {
   width:90%;
    max-width: 500px;
    height: auto;
    margin: 15px auto;
}



/*
	 CSS-Tricks Example
	 by Chris Coyier
	 http://css-tricks.com
*/


/*textarea { border: 0; font: 14px Georgia, Serif; overflow: hidden; resize: none; }
/*table { border-collapse: collapse; }*/
table td { border: 1px solid black; padding: 5px; }



#items { width: 100%; margin: 30px 0 0 0; border: 1px solid black; }
#items th { background: #005025; color: #fff; text-align: center; width: 100% !important;}
/*#items tr.item-row td { border: 0; vertical-align: top; }*/
/*#items td.description { width: 166px; }
#items td.item-name { width: 166px; }
#items td.description textarea, #items td.item-name textarea { width: 166px; }*/
#items td.total-line { border-right: 0; text-align: right; }
#items td.total-value { border-left: 0; padding: 10px; }
#items td.total-value textarea { height: 20px; background: none; }
#items td.balance { background: #eee; }
#items td.blank { border: 0; }

#terms { text-align: center; margin: 20px 0 0 0; }
#terms h5 { text-transform: uppercase; font: 13px Helvetica, Sans-Serif; letter-spacing: 10px; border-bottom: 1px solid black; padding: 0 0 8px 0; margin: 0 0 8px 0; }



#overview-items-ctn {

    width: 380px;
    min-height: 32px;
    background-color: #fff;
    border-radius: 3px;
    border: 1px solid #000;
    float: right;
    margin-top: 20px;
    margin-bottom: 20px;
    text-align: center;
}
#overview-items-ctn ul {
    list-style-type: none;
    display: inline-table;
    padding: 0;
    margin: 0;
    position: relative;
    width: 100%;
    height: 100%;
}
#overview-items-ctn ul li {
    display: inline-block;
    height: 32px;
    width: 100%;
    padding: 0;
    margin: 0;
    border-bottom: 1px solid #060;
}
#overview-items-ctn ul li:last-child {
    border-bottom: none;
}
.overview-item-title {
    float: left;
    width: 164px;
    height: 100%;
    background-color: #005025;
    color: #fff;
    line-height: 31px;
}
.overview-item-value {
    font-weight: bold;
    height: 100%;
    line-height: 32px;
}
.red {
    color: #f00 !important;
}


#terms-and-condition {
    opacity: 0;
    display: none;
    visibility: none;
}

#terms-and-condition-close {

    position: absolute;
    right: 0;
    top: -54px;
    width: 40px;
    font-size: 17px;
    height: 40px;
    border: none;
    background: transparent;
    border: 1px solid #000;
    color: #000;
    border-radius: 50%;
    z-index: 999999999999 !important;
}
/********** Reg Page Edits **********/
@media (max-width: 768px) {
    .overview-item-title {width:100%;}
    #payment-method-btns-ctn {height:auto;    padding-bottom: 20px;}
    #overview-items-ctn {width:100%;}
    #reg-apply-promo-code {width:100%;}

#registration-ctn {width:100%;    -webkit-box-orient: vertical;    -webkit-box-direction: normal;    -ms-flex-direction: column;    flex-direction: column;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;    position: relative;top:0;}
#event-summary-ctn, #event-registration-ctn, #event-info-ctn {    width: 100%;
    height: auto;
    float: none;
    position: relative;margin-bottom:15px;}
#event-summary-ctn {-webkit-box-ordinal-group:2;-ms-flex-order:1;order:1;}
#event-registration-ctn {-webkit-box-ordinal-group:4;-ms-flex-order:3;order:3;margin-bottom:50px;}
#event-info-ctn {-webkit-box-ordinal-group:3;-ms-flex-order:2;order:2;}
#event-info-total-ctn {    width: 101%;
    height: 50px;
    background-color: #005025;
    color: #fff;
    position: fixed;
    bottom: 0 !important;
    margin-left: -1%;
}
.registration-section-title {height:auto;}
#event-info-descript-right-column {display:none;}
#event-info-description-box {width:100%;max-width:100%;margin-left:auto;margin-right:auto;}
}
@media (max-width: 350px) {
    .jp-card-container {width:300px !important;margin:0 !important;}
    .jp-card {min-width:250px !important;}
}