/*		Tablet Layout: 768px.
		Gutters: 24px.
		Outer margins: 28px.
		Inherits styles from: Default Layout.
-----------------------------------------------------------------
cols    1     2      3      4      5      6      7      8
px      68    160    252    344    436    528    620    712    */

@media only screen and (min-width: 768px) and (max-width: 1024px) {
	.wrapper{ margin:0 10px}
	 fieldset { width:93%;}
	.auth_link{ padding-right:33px;}
	.payments{ width:52%}
	.cards{ width:46%;}
	.right_coll{ width:59%;}
	.dataTables_length select{ width:25%;}
	.right_box { width: 82%;}
	.right_box.right { width: 94%;}
	.right_box.right_coll { width: 56%;}
	.right_box.right_detail { width: 100%;}
	.right_box.spacer_right { width: 72%;}
	.left_detail p label{ width:47%;}
	.right_row_detail input { width: auto;}
	.new_spacer textarea { width: 66.7%;}
	.row_right { float:left; width:100%; text-align:left; margin-top:10px;}
	.row_right span{  margin-right:4px; margin-top:10px;}
	#newSignature3{ width:320px !important; height:360px;}
	#popupdiv{ top:50%;}
	.navigation ul li{ margin-right:29px}
	input[type="text"],input[type="email"],input[type="number"],input[type="date"], input[type="password"], textarea, select { font-size:15px;}
	#newSignature2{ width:100% !important; }
		 
}



/*		Mobile Layout: 320px.
		Gutters: 24px.
		Outer margins: 34px.
		Inherits styles from: Default Layout.
---------------------------------------------
cols    1     2      3
px      68    160    252    */

@media only screen and (max-width: 767px) {
	.wrapper{ margin:0 5px}
	.logo{ float:left; width:100%; text-align:center;}
	.auth_link { float:left; width:96%;  text-align:left; padding:15px 2% 15px 2%;}
	.logout { margin-top:20px;}
	.logout span{ float:left;}
	.logout a{ float:right;}
	.welcome { float:left; margin-top:0;}
	fieldset { width:93%;}
	.main_box{ width:100%; margin-right:0;}
	.main_row label { width:100%;}
	.right_box { width:100%;}
    .right_box .row { width:100%; margin-right:0;}
	.right_box .row.small { width:100%;}
	.right_box.right { width:85%;}
	.right_box.right .row { width:100%;}
	.payments { width:100%;}
	.cards{ width:100%;}
	.right_box.right_coll { width:100%;}
	.payments input { width: 95%;}
	.right_coll { float:left; width:100%;}
	.payments textarea { width:95% !important;}
	.paymentsie{ float:left; width:100%;}
	.paymentsie select{ width:95%;}
	.cardsfields{ float:left; width:100%;}
	.card_type { float:left; width:100%; margin-right:0;}
	.cards input { width:95%;}
	.right_box.right_detail { width:100%;}
	.right_box.right_detail .row { width:95%;}
	.left_container { width:100%;}
	.right_container { width:100%;}
	.right_box.spacer_right { float:left; width:100%;}
	.right_box.spacer_right .row { width: 95%;}
	.right_box.right_info { float:left; width: 100%; margin-top:5px;}
	.mmedium { float:left; width: 95%; margin:10px 0 !important;}
	.status_list { text-align:left; width:240px;}
	.status_list select{ width:80%;}
	.status_detail{ float:left; width:95%; padding:10px 2%; margin-bottom:10px;}
	.search-table-outter { overflow-x: scroll; }
     th, td { min-width: 200px; }
	 .dataTables_length {/* width:100%;*/ float:left !important; margin-bottom:20px;}
	 /*.dataTables_length select{ width:70%; margin-bottom:10px;}*/
	 .dataTables_info { width:100%;}
	 .dataTables_paginate { display:inline-block; width:100%; text-align:left;}
	 .dataTables_filter { float:right !important; width:57%; text-align:right !important; margin-top:0 !important; margin-bottom:20px;}
	 .dataTables_filter input{ width:61%;}
	 #tcalControls th, td { min-width:16px !important; height:16px !important;}
	 #tcalGrid th, td { min-width:16px !important; height:16px !important;}
	 .coll_newone{  padding: 12px 10px !important;}
	 .left_detail { width:88%;}
	 .left_detail p label { width:48%; font-size:12px;}
	 .right_detail{ float:left; width:100%;  text-align:left;}
	 .right_detail span{ margin-top:20px;}
	 .left_row_detail { width:100%;}
	 .right_row_detail { float:left; width: 100%;}
	 .left_row_detail label { width:96%; padding-bottom:5px;}
	 .left_row_detail input { width: 90%; }
	 .check_detail_box { padding-top:10px;}
	 .right_row_detail input { width: 65%;}
	 #popupachdiv{ width:98%; left:0; right:0;}
	 .left_box{ width:100%; margin:0;}
	 .new_spacer label { width:100%; margin-bottom:10px;}
	 .new_spacer textarea{ width:90%;}
	 #canvas { float:left; width:93% !important;} 	 
     .bottom_content p { color: #000000; font-size: 13px; line-height: 20px;} 
	.top_row { width:92%;}
	.salesrep{ float:left; width:100%;}
	#canvas3{ float:left !important; width:100%;}
	#canvas2{ float:left; width:100%;}
	#newSignature3{ width:100% !important;}
	#newSignature2{ width:100% !important;}
	.row_right { float:left; width:100%; text-align:left;}
	.row_right span{ display:block; margin-right:0; padding:5px 0;}
	.row_right span input{ width:98%; margin:10px 0;}
	.term-inner{ padding:0 24px;}
	.tnc{ padding:0 24px;}
	.right-coll-top{ float:left !important;}
	.navigation{ float:left; width:100%; margin:15px 0 0 0;}
	.navigation ul li{ width:100%;}
	.navigation ul li.current-menu-item a {
    color: #fff;
    border-bottom: 2px solid #313591;
    padding-bottom: 5px;
	background:#313591;
}

.navigation ul li a{ width:100%; background:#595757; color:#fff; font-size:14px; line-height:18px;}
.header_right {
    float: left;
	width:97%;
}

.plan-detail { display:none;}
.plan-detail.mob{ display:block !important; overflow-x:scroll; height:300px;}



/*		Wide Mobile Layout: 480px.
		Gutters: 24px.
		Outer margins: 22px.
		Inherits styles from: Default Layout, Mobile Layout.
------------------------------------------------------------
cols    1     2      3      4      5
px      68    160    252    344    436    */

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

}