@charset "utf-8";

/* ==========================================================================

   Responsive CSS

   ========================================================================== */

/* #Tablet (Landscape) 1024px */

/* -------------------------------------------------------------------------- */

@media only screen and (min-width: 960px) and (max-width: 1240px) {

    .wrap-total-fixed {
        background: none repeat scroll 0% 0% #303030;
        z-index: 0;
    }
	.total-order {
        padding: 15px 0 0 0px;
    }
    .modal-body .step-detail-item {

        border-bottom: 1px solid #cdcdcd;
        padding: 5px 0 5px 0 !important;
        font-size: 16px;
    }
    .main { width: 100% !important; }
    .sidebar { display: none; }
}

/* #Tablet (Portrait) 768px */

/* --------------------------------------------------------------------------*/

@media only screen and (min-width: 768px) and (max-width: 959px) {


    .wrap-total-fixed {
        background: none repeat scroll 0 0 #303030;
    }

    .btn-order-detail {
        padding: 5px 5px;
        float: right;
        margin: 10px 100px 10px 0;
        min-width: 180px;
    }
    .total-order {
        padding: 12px 0 0 30px;
    }
    .modal-body .step-detail-item {

        border-bottom: 1px solid #cdcdcd;
        padding: 5px 0 5px 0 !important;
        font-size: 14px;
    }
	.amount{
		font-size:20px;
	}
	.modal-body {    
		padding: 15px 15px 0px 15px;
	}

    .modal-body .step-detail-item:last-child {
        border-bottom: 0px;
    }

    .subfooter.apply {
        padding-bottom: 70px;
    }

    #cot_tl_fixed {
        visibility: hidden;
    }
}

/* #Mobile (Landscape) 480px */

/* -------------------------------------------------------------------------- */

@media only screen and (min-width: 480px) and (max-width: 767px) {

    .page-title .step-title {
        font-size: 17px;
        color: #EF0606;
    }
	.navbar {
		border: 0px;
	}
	
	/* --- background btn footer  ------*/
    .wrap-total-fixed {
        background: none repeat scroll 0% 0% #303030;
    }
	.total-order {
        padding: 5px 0 0 30px;
    }
	.btn-order-detail {
        padding: 5px 5px;        
        margin: 5px 60px 5px 5px;
        min-width: 140px;
		 float: right;
    }
	/* --- modal ------*/
	.amount{
		font-size:20px;
	}
	.modal-body .step-detail-item {

        border-bottom: 1px solid #cdcdcd;
        padding: 5px 0 5px 0 !important;
        font-size: 14px;
    }
	 .modal-content .modal-title {
        font-size: 20px;

    }
	.modal-body {    
		padding: 15px 15px 0px 15px;
	}

    .modal-body .step-detail-item:last-child {
        border-bottom: 0px;
    }

    .subfooter.apply {
        padding-bottom: 70px;
    }

    #cot_tl_fixed {
        visibility: hidden;
    }
}

/*  #Mobile (Portrait) 320px

/* -------------------------------------------------------------------------- */

@media only screen and (min-width: 100px) and (max-width: 479px) {


	/* --- background btn footer  ------*/
    .wrap-total-fixed {
        background: none repeat scroll 0% 0% #303030;
    }

    .wrap-total-fixed .btn {

        padding: 7px 25px !important;
    }

    .total-order {
        padding: 12px 0 0 30px;
    }

    .btn-order-detail {
        padding: 5px 5px;
        float: right;
        margin: 10px 10px 10px 0;
        min-width: 110px;
    }	

    .modal-body .step-detail-item {

        border-bottom: 1px solid #cdcdcd;
        padding: 5px 0 5px 0 !important;
        font-size: 12px;
    }
	
	.modal-body {    
		padding: 15px 15px 0px 15px;
	}

    .modal-body .step-detail-item:last-child {
        border-bottom: 0px;
    }

    .step-detail-item .col-md-5 {
        width: 30%;
        float: left;
        text-align: right;
        padding: 0 10px 0 0;
    }

    .modal-content .modal-title {
        font-size: 20px;

    }
	.navbar {
		border: 0px;
	}
	.amount{
		font-size:16px;
	}

    .subfooter.apply {
        padding-bottom: 70px;
    }

    #cot_tl_fixed {
        visibility: hidden;
    }
}

span.detail_price {
    font-size: 16px;
    color: #ff7a00;
    font-weight: 700;
    line-height: 30px;
    display: inline-block;
}

span.detail_trueprice {
    font-size: 16px;
    color: #fff;
    font-weight: bold;
    display: inline-block;
    margin-right: 5px;

}