﻿@media only screen and (max-width:960px) {
	.double-big-col {
		width: 100%;
		margin: 0px 30px;
	}
	.double-sm-col {
		margin-left: 30px;
            width: initial;
	}
	.time-info {
	    height: auto;
	    width: 100%;
	    display: inline-block;
	    margin: 15px 0px;
	}
    .purcase-btn-submit {
        margin-left: 0px !important;
        margin-top: 18px;
    }
    #data-order-box {
        /*width: 370px;*/
    }
    #gotoTickets {
        margin-left: 16px !important;
        width: 187px;
    }
    #select-time {
        width: 210px;
    }
    .states {
        max-width: 300px !important;
    }

}
@media only screen and (max-width:960px){

	.single-big-col {
		width: 100%;
        margin: 0px !important;
	}
	.trip-details .select-trip {
	    width: 100%;
	    max-width: 362px
	}
	.trip-details .edit-info {
		float: left;
	}
	.clear.booking {
		display: inherit;
		margin-bottom: 15px;
	}
	#f-calendar {
		width: 100%;
		margin-bottom: 20px;
	}
	.event-this-week {
		width: 100%;
		margin-left: 0px;
	}
	section.boarding .map-content {
		width: 100%;
		margin-left: 0px;
		margin-top: 10px;
	}
	.time-info > div.info-col{
		width: 100%;
		padding: 0px;
		margin-top: 10px;
		float: left;
	}
	.order-info > div.info-col:nth-child(2){
		float: left;
		margin-top: 10px;
	}
	.form-row .form-col.addr, .form-row .form-col.addr2 {
		width: 100%;
	}
	.addr input, .addr2 input {
		width: calc(100% - (24px));
	}
	.form-row .form-col.states, .form-row .form-col.zip, .form-row .form-col.city {
		float: none;
		padding-bottom: 13px;
	}
	.form-row .form-col.f-name{
	    /*max-width: 524px;*/
	    width: calc(100% - (2px));
	}
	.form-row .form-col.l-name {
	    /*max-width: 592px;*/
	    width: 100%;
	    padding-top: 0px;
        margin-top: 28px;
	}
    .states select {
        width: 213px;
    }
    .city input {
        /*max-width: 188px;*/
    }
	.form-row .form-col.email, .form-row .form-col.phone, .form-row .form-col.c-card {
	    /*max-width: 592px;*/
	    width: 100%;
	}
	.f-name input {
	    /*max-width: 490px;*/
    	margin-right: 0px;
    	    width: calc(100% - (24px));
	}
    .f-name input,
    .l-name input,
    .phone input,
    .email input,
    .addr input,
    .addr2 input {
        max-width: 100% !important;
        width: calc(100% - (25px)) !important;
        margin-right: 25px;
    }
	.l-name input, .email input, .phone input, .c-card input {
	    /*max-width: 562px;*/
    	margin-right: 0px;
    	width: calc(100% - (24px));
	}
    #experienceDropdown {
        margin-right: 0px;
        width: calc(100% - (5px));
    }
    .trip-details .select-date {
        margin-right: 0px;
        width: calc(100% - (60px));
    }
    #gotoTickets, #resetTickets {
        margin-left: 8px !important;
    }
    .trip-details .info-1 {
        border-right: none;
    }
    ul.seat-list li .seat-desc {
        width: calc(100% - (126px));
    }
    .seat-qty {
        margin-left: 19px;
        float: right;
    }
    section.about {
        padding: 25px;
    }
    section.about p {
        margin: 0px;
        margin-bottom: 25px;
    }
    .slide h1 {
        left: 26px !important;
    }
    .slide h3 {
        left: 26px !important;
    }
    .slide .slide-link li {
        left: 26px !important;
    }
    .purcase-box {
        margin-right: 0px !important;
        border-radius: 0px !important;
    }
    .purcase-box-body {
        padding: 25px;
    }
    .book-form {
        padding: 25px;
        background: rgb(239, 239, 239);
    }
    .book-buttons {
        margin: 25px 0px 25px 0px !important;
    }
    #backToEvents {
        float: left;
        background: #bbbcbc !important;
    }
    #gotoBooking {
        float: right;
    }
    .book-buttons button {
        min-width: 152px !important;
    }
    .book-form {
        padding-top: 0px !important;
    }
    .book-form .book-buttons {
        width: 100%;
        margin-top: 0px !important;
    }
    .select-event {
        display: none;
    }
    .mobileBlock {
        display: block;
    }
    .mobileInlineBlock {
        display: inline-block;
    }
    .mobileInline {
        display: inline;
    }
    .mobileNone {
        display: none !important;
    }
    .mobileCollapse {
        margin-bottom: 0px !important;
    }
    .purcase-box-title, #clockdiv {
        display: none;
    }
    .double-big-col, double-sm-col {
        margin: 0px;
    }
    #timesChange {
        border-bottom: none;
    }
    #reviewDateTime {
        display: block;
        font-size: 1.4em;
        font-weight: bold;
    }
    .dept {
        margin-bottom: 15px;
    }
    #clockdivMob {
        display: block;
        margin: 25px;
    }
    .double-sm-col {
        padding: 0px;
        width: 100% !important;
        margin: 0px !important;
    }
    .foot-btn-col {
        background: #efefef;
        padding-bottom: 0px !important;
    }
    .changeTicket {
        width: 30% !important;
        margin-left: 24px !important;
    }
    .cancelReview {
        width: 43% !important;
    }
    .gotoPayment {
        display: block;
        margin: 25px !important;
        margin-top: 15px !important;
        width: 80% !important;
    }
    .legal {
        background: #efefef;
        padding: 0px 25px 25px 25px;
        margin-bottom: 25px;
    }
    #order-detail-box {
        margin-right: 0px;
        margin-left: 0px;
    }
    .double-big-col {
        padding-top: 0px !important;
    }
    #reviewOrder {
        padding-top: 0px !important;
    }
    .book-form .legal {
        padding: 0px !important;
        font-size: 12px;
        line-height: 13px;
    }
    #price-details-box, #trip-detail-info {
        margin-bottom: 0px;
    }
    .city input {
        width: calc(100% - (25px)) !important;
        max-width: none !important;
    }
    .states {
        display: inline-block;
    }
    #customerState {
        width: 160px;
        display: inline-block;
    }
    .zip {
        display: inline-block;
    }
    .form-col.city {
        max-width: none !important;
    }
    .dept, #clockdivMob {
        font-family: "Lato" !important;
    }
    .logo h1 {
        position: relative;
        top: 15px;
        margin-bottom: 86px;
        margin-left: 20px;
    }

    .tweetLink {
        text-align: center;
        background-color: rgb(38, 60, 73);
        display: block;
        line-height: 21px;
        font-family: "Lato";
        color: #0094bd !important;
    }
    #data-order-box {
        margin-left: 0px;
    }
}
@media only screen and (width:768px) {
    .iPad-center, .book-buttons {
        margin: 0px auto;
        padding-left: 25%;
    }
    .gotoPayment {
        width: calc(100% - (76px)) !important;
    }
    .changeTicket, .cancelReview {
        width: calc(100% - (435px)) !important;
    }
    .purcase-box {
        margin-left: 0px !important;
    }
    #data-order-box input, .form-col, #data-order-box textarea {
        width: 100% !important;
        max-width: 300px !important;
    }
    .cbp-spmenu {
        display: none;
    }
    #showTop {
        display: block;
    }
}
@media only screen and (max-width:480px) {
    .purcase-box {
        margin-left: 0px !important;
    }
	.trip-details .select-trip{
		width: 100%;
		margin-bottom: 18px;
	}
	.double-sm-col {
	    width: calc(100% - (60px));
	    margin: 0px 30px;
	}
	.payment-sum .train-detail {
	    max-width: 275px;
	    width: calc(100% - (84px));
	}
    .payment-sum .date-detail {
        max-width: 83px;
        width: 100%;
    }
    .double-sm-col, .double-sm-col {
        float: none;
    }
    .form-row input[type="text"], .form-row input[type="email"], .form-row select {
        width: 100% !important;
    }
    .ui-dialog {
        width: 98% !important;
    }
    .olark-launch-button {
        position: fixed;
        top: 440px !important
    }
}
@media only screen and (max-width:320px) {

    /* iPhone 5 */

    #selectEvent .purcase-btn-submit {
        width: 91px;
    }
    #selectTickets .purcase-btn-submit {
        width: 99px !important;
    }
    .book-buttons button {
        width: 100px !important;
    }
    #resetTickets {
        margin-left: 0px !important; 
    }
    .book-buttons button {
        min-width: 131px !important;
    }
    .cancelReview {
        width: 38% !important;
    }
    .gotoPayment {
        width: 76% !important;
    }
    .purcase-box {
        margin-left: 0px !important;
    }
}

@media only screen and (max-width:415px) {
    #gotoTickets {
        width: 151px;
    }

}
@media only screen and (max-width:375px) {
    #gotoTickets {
        width: 82px;
    }

}
@media only screen and (max-width:320px) {
    #select-time {
        width: 161px;
    }

}
@media only screen and (max-width:1159px) {

    .f-name input, .l-name input, .phone input, .email input {
        max-width: 285px;
        width: calc(100% - (66px)) !important;
    }
    .form-col {
        width: calc(100% - (66px)) !important;
        display: inline-block;
    }

}
@media only screen and (width:360px) {

    .book-form .book-buttons button {
        margin: 0 2px;
    }
    #select-time {
        margin-top: 15px;
        width: 181px;
    }

}
/* galaxy s7 */
@media only screen and (width:360px) {

    .select-time {
        width: 210px !important;
    }
    #gotoTickets {
        width: 82px;
    }

}
/* iphone 6 */
@media only screen and (width:375px) {

    #gotoTickets {
        width: 98px;
    }

}
/* iphone 6 plus*/
@media only screen and (width:414px) {

    #gotoTickets {
        width: 137px;
    }

}
/* EDITOR PROPERTIES - PLEASE DON'T DELETE THIS LINE TO AVOID DUPLICATE PROPERTIES */
@media only screen and (max-width:475px) {

    .select-time {
        margin-top: 15px;
    }
    /*#gotoTickets {
        width: 20% !important;
    }*/

}
@media only screen and (max-width:1018px) {
    .purcase-btn-submit {
        margin-top: 18px;
    }
}