@charset "utf-8";
/* CSS Document */
.orderpage {
    width: 96%;
    max-width: 1000px;
    height: auto;
    padding: 2%;
    margin: 10px auto;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    color: #333;
    line-height: 20px
}

.orderpage .main-box {
    width: 91.5%;
    height: auto;
    float: left;
    padding: 2%;
    margin: 2%;
    border: #a1a1a1 2px solid;
    background: #FFF
}

.orderpage .main-box2 {
    width: 91.5%;
    height: auto;
    float: left;
    padding: 2%;
    margin: 2%;
    border: #a1a1a1 0px solid;
    background: #FFF
}

.orderpage .pro-detail-box {
    width: 96%;
    height: auto;
    float: left;
    padding: 1%;
    border: 1px solid #CCC;
    background: url(/GSIMAGES/order/images/belt-bg.jpg) repeat
}

.orderpage .box-25 {
    width: 23.8%;
    height: auto;
    float: left;
    padding: 0.5%;
    min-height: 120px;
}

.orderpage .border {
    border-right: 1px solid #f6f6f6;
}

.orderpage h2 {
    color: #333;
    padding: 2px 0;
    margin: 2px 0;
    font-size: 22px;
    font-weight: normal;
    font-family: Myriad Pro, sans-serif;
}

.orderpage .box-50 {
    width: 48%;
    height: auto;
    float: left;
    padding: 1%;
}

.country-drop {
    width: 100%;
    float: left;
    text-align: left
}

.country-drop select {
    width: 100%;
}

/* signpage */

.order-wrapper {
    width: 96%;
    max-width: 1000px;
    height: auto;
    padding: 5px 2%;
    margin: 10px auto;
    font-family: Helvetica, sans-serif;
    font-size: 14px;
    color: #333;
    line-height: 20px
}

.order-wrapper .box-100 {
    width: 100%;
    height: auto;
    float: left;
}

.order-wrapper .box-70 {
    width: 70%;
    height: auto;
    float: left;
    text-align: center;
}

.order-wrapper .box-75 {
    width: 75%;
    height: auto;
    float: left;
    text-align: center;
}

.order-wrapper .box-75-1 {
    width: 72.5%;
    height: auto;
    float: left;
    text-align: center;
    border: 1px solid #CCC;
    margin: 10px 1%
}

.order-wrapper .box-50 {
    width: 50%;
    height: auto;
    float: left;
    text-align: center;
}

.order-wrapper .box-30 {
    width: 29.5%;
    height: auto;
    float: left;
    text-align: left;
}

.order-wrapper .box-25 {
    width: 25%;
    height: auto;
    float: left;
    text-align: center;
}

.order-wrapper .box-25-1 {
    width: 22.5%;
    height: auto;
    float: left;
    text-align: center;
    border: 1px solid #CCC;
    margin: 10px 1%
}

.order-wrapper .box-40 {
    width: 40%;
    height: auto;
    float: left;
    text-align: center;
}

.order-wrapper .box-20 {
    width: 20%;
    height: auto;
    float: left;
    text-align: center
}

.order-wrapper .nrml-box {
    width: 80%;
    height: auto;
    float: left;
    padding: 10px 5%;
    margin: 10px 5%;
    text-align: left
}

.nrml-box input {
    width: 80%;
    height: auto;
    padding: 8px;
    border: #CCC 1px solid;
    float: left
}

.nrml-box-form {
    width: 92%;
    height: auto;
    float: left;
    padding: 10px 2%;
    margin: 10px 2%;
    text-align: left;
    font-size: 15px;
    color: #333
}

.nrml-box-form-brdr {
    width: 91.5%;
    height: auto;
    float: left;
    padding: 10px 2%;
    margin: 10px 2%;
    text-align: left;
    font-size: 15px;
    color: #333;
    border: 1px solid #c5c5c5
}

.nrml-box-form span, .nrml-box-form-brdr span {
    color: #F30;
}

.nrml-box-form .textfild, .nrml-box-form-brdr .textfild {
    width: 200px;
    height: auto;
    padding: 8px;
    border: #CCC 1px solid;
}

.nrml-box-form .select, .nrml-box-form-brdr .select, select {
    width: auto;
    height: auto;
    padding: 8px;
    border: #CCC 1px solid;
}

.payment-box {
    width: 98%;
    height: auto;
    float: left;
    padding: 10px 1%
}

.payment-box img {
    margin: 5px 5px;
    float: left
}

.order-footer {
    width: 100%;
    max-width: 1000px;
    height: auto;
    position: static;
    bottom: 0;
    margin: 10px auto;
}

.order-footer-data {
    width: 96%;
    float: left;
    padding: 20px 2%;
}

.pro-detail-box {
    width: 96%;
    height: auto;
    float: left;
    padding: 2%;
    border: 1px solid #CCC;
    background: url(/GSIMAGES/order/images/belt-bg.jpg) repeat
}

.pro-detail-box .box-25 {
    width: 23.8%;
    height: auto;
    float: left;
    padding: 0.5%;
    min-height: 120px;
}

.pro-detail-box .border {
    border-right: 1px solid #f6f6f6;
}

.pro-detail-box h2 {
    color: #333;
    padding: 2px 0;
    margin: 2px 0;
    font-size: 22px;
    font-weight: normal;
    font-family: Myriad Pro, sans-serif;
}

.pro-detail-box .box-50 {
    width: 48%;
    height: auto;
    float: left;
    padding: 1%;
}

/******** Add New CSS 4 July 2014 ********/

.tstmnl-box {
    width: 96%;
    height: auto;
    float: left;
    padding: 1%;
    text-align: left;
}

.closebtn {
    position: relative;
    right: -10px;
    top: -10px;
    width: auto;
    height: auto;
    float: right
}

.box-100 {
    width: 100%;
    height: auto;
    float: left;
}

.txt-right {
    text-align: right
}

.large {
    font-size: 24px
}

/* Desktop view */

@media only screen and (min-width: 1255px ) and (max-width: 40000px) {
}

/* Tablet view */

@media only screen and (min-width: 481px) and (max-width: 1024px) {
    .closebtn {
        position: relative;
        right: -1% !important;
        top: -6px !important;
        width: auto;
        height: auto;
        float: right
    }

    .pro-detail-box .box-25 img {
        width: 98% !important
    }

}

/* Mobile view */

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

    .closebtn {
        position: relative;
        right: -1% !important;
        top: -2px !important;
        width: auto;
        height: auto;
        float: right
    }

    .pro-detail-box .box-25 {
        width: 47%;
        height: auto;
        float: left;
        padding: 0 1%;
        min-height: 120px;
    }

    .pro-detail-box .box-25 img {
        width: 98% !important
    }

    .large {
        font-size: 18px;
        line-height: 26px !important
    }

    .bottom-margin {
        margin: 10px 0 20px 0
    }
}


/******Ejaj Edit*******/

@media only screen and (min-width:1255px ) and (max-width:40000px) {
	
		.product-popup{position: fixed; bottom: 5%;  z-index:150; height:auto; overflow: auto;}
		
		.mob-br br{ display:none !important}
		
		.right-margin{ margin-right:30px}

	
	}


@media only screen and (min-width:481px) and (max-width:1254px) {

		.product-popup{position: fixed; bottom: 5%;  z-index:150; height:auto; overflow: auto;}

}

@media only screen and (min-width:0px) and (max-width:480px) {
	
	.testi-showhide{ display:none !important; visibility:hidden !important}
	
	.product-popup{position: fixed; bottom: 5%;  z-index:150; height:580px !important; overflow-x: scroll !important;}
	
	.mob-100{ width:100% !important; height:auto; float:left !important; text-align:center !important}
	
	.mob-none{ display:none !important; visibility:hidden !important;}
	
	.mob-center, .mob-center img{ text-align:center !important; float:none !important}
	
	.pro-detail-box .box-25{ min-height:0px !important}
	
	.mob-bottom-margin{ margin-bottom:5px !important}
	
	}