@charset "utf-8";
/* CSS Document */

@media only screen and (max-device-width:320px){

	.container{
		/*border:1px solid #093;*/
		max-width:320px;
		/*border:1px solid #F00;*/
	}

	header{
		max-width:320px;
	}
	
	main{
		max-width:320px;
		padding-bottom:70px; /*Height of footer*/	
	}
	
	footer{
		max-width:320px;	
		min-height:70px;   /* Height of the footer */
	}

	.box{display:block; max-width:320px}

	input.large:not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]){
		min-width:auto;
		width:200px;
	}

/* --------------- Logo -----------*/
	
	.logo {display:block; margin:0px; padding:15px 0 0;}
	.logo a{display:table; margin:auto;}
	.top-links{ margin-top:0px; margin-bottom:5px;}


/* --------------- Navigation -----------*/

	.adminNav{padding:5px;}
	.adminNav:hover a.hideNav{left:170px;}

	.navWrapper a.openNav{display:inline-block;}

	.navWrapper > ul{
		margin:0;
		border:none;
		height: 100%; /* 100% Full-height */
		width: 0; /* 0 width - change this with JavaScript */
		position: fixed; /* Stay in place */
		z-index: 1; /* Stay on top */
		top: 0;
		left: 0;
		background-color: rgba(0,28,52,.90); /* #084274Black*/
		/*overflow-x: hidden; /* Disable horizontal scroll */
		padding-top: 60px; /* Place content 60px from the top */
		visibility:collapse;
	}
	
	.navWrapper:hover > ul{visibility:visible;width:200px}

	.navWrapper > ul li:hover{
		background:linear-gradient(#f6fbfb, #e9f0ef); /* Standard syntax */
	}
	.navWrapper > ul li:hover a{color:#576f6c;}
	
	.navWrapper > ul > li{
		display:block;
		left:-120px;
		float:none;
		border:none;
		transition:all .5s ease-in-out;
	}

	.navWrapper > ul > li.sub > a,
	.navWrapper > ul > li.sub:hover > a{
		background:url(../images/icons/symbol_sub_arrow_d.png) no-repeat;
		background-position:160px 20px;	
	}
	
	.navWrapper:hover > ul > li {left:0;}

	.navWrapper ul li ul{top:49px}
	.navWrapper ul ul li{display:block;border-right:none;}

	.navWrapper ul > li:hover > ul li {
		height: 45px;
		border-right:none;
	}
	.navWrapper > ul > li > a{color:#d2d2d2}
	
	.report-issue{margin-top:10px; margin-bottom:10px;}

/*---------------  input block -------------*/

	.input-box {margin-left:20px; margin-right:20px; padding:20px;}
	.input-box li  div{margin-top:20px}
	.input-box li label{display:block}
	.input-box li.inblock label{display:inline-block}
	.input-box li.button label{display:none}
	.input-box .captcha input{
		margin-bottom:5px;
	}

/*---------------  Report Issue Page -------------*/
	.report-issue-input{max-width:260px;}
	
	.report-issue-input textarea{
		width:230px; 
		height:200px;
	}
	.report-issue-input li.right{text-align:left}

/* --------------- Add User page -----------*/


	.box-left{
		/*border:1px solid red;*/
		display:block;
	} 

	.box-right{
		/*border:1px solid red;*/
		display:block;
		float:none;
		margin-left:0;
		margin-top:20px;
	}
	
	.user-add .input-box li.button input[name="btn_reset"]{display:none}
	.user-add .input-box li.button{text-align:center} 

/*---------------  Quote Add-------------*/

	.quote-add .input-box input,
	.quote-add .input-box select{margin-right:5px}

/* --------------- Listing Section -----------*/
	
	.grid-wraper {margin:10px 10px;}
	
	.grid-options{display:block;}
	.grid-options li{display:block;}
	.grid-options li img{display:none;}
	.grid-options li.right{text-align:left}

	.data-list{display:block; border-bottom:10px solid #e2e2e2;}
	.data-list > li:first-child{width:auto;padding: 5px 5px 0;}
	.data-list > li{
		display:block;
		vertical-align:top;
		padding: 3px 5px;
		margin:0;
	}
	.data-list .three{width:auto; max-width:280px}
	
	.data-list .dt-view{display:none}

	.item-list-head,
	.item-list-line {
		display:block;
		background:#f9edfd;
	}
	.item-list-head li { display:none;}
	.item-list-line li {
		display:block; 
		text-align:left;
		padding: 3px 5px;
		margin:0;
	}

	.item-list-head li.thirty,
	.item-list-line li.thirty,
	.item-list-line li.one
	.item-list-head li.one{width:auto}

	.item-list-line li a{display:block; margin:0}

 /* --------------- User IM -----------*/
	.im-user {width:280px;}
	.sendbox textarea{display:block;resize:none; width:260px; margin-bottom:5px;}

	
/*---------------  Quote View-------------*/
	
	.quote-view {display:block;	}
	
	.quote-view >li{display:block;}
	.quote-view >li:first-child{width:auto;}
	.quote-view >li:nth-child(2){width:auto; height:30px;}

	.quote-view .data-list{border-bottom:none}
	
	.quote-view .price-bar strong{display:none;}
	.quote-view .price-bar input.btn-small{display:block;width:auto; width:300px; margin:0; position:fixed; bottom:40px; z-index:1; left:10px}
	.quote-view .price-bar input[name="btn_jtracker"]{display:block;width:auto; width:300px; margin:0; position:fixed; bottom:5px; z-index:1; left:10px}
	.price-bar input.small:not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]){
		display:block;
		width:auto;
		width:288px;
		position:fixed; bottom:75px; z-index:1; left:10px
	}

	.compare li input[type="search"]{width:285px; margin-right:0; margin-bottom:5px;}


}

@media only screen 
and (min-device-width:321px)
and (max-device-width:360px){
	
	.container{
		/*border:1px solid #093;*/
		max-width:360px;
	}

	header{
		max-width:360px;
	}
	
	main{
		min-height:200px;
		max-width:360px;	
	}
	
	footer{
		max-width:360px;	
	}

	.box{display:block; max-width:360px}


	input.large:not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]){
		min-width:auto;
		width:250px;
	}

/* --------------- Logo -----------*/
	
	.logo {display:block; margin:0px; padding:15px 0 0;}
	.logo a{display:table; margin:auto;}
	.top-links{ margin-top:0px; margin-bottom:5px;}

/* --------------- Navigation -----------*/

	.adminNav{padding:5px;}
	.adminNav:hover a.hideNav{left:170px;}

	.navWrapper a.openNav{display:inline-block;}

	.navWrapper > ul{
		margin:0;
		border:none;
		height: 100%; /* 100% Full-height */
		width: 0; /* 0 width - change this with JavaScript */
		position: fixed; /* Stay in place */
		z-index: 1; /* Stay on top */
		top: 0;
		left: 0;
		background-color: rgba(0,28,52,.90); /* #084274Black*/
		/*overflow-x: hidden; /* Disable horizontal scroll */
		padding-top: 60px; /* Place content 60px from the top */
		visibility:collapse;
	}
	
	.navWrapper:hover > ul{visibility:visible;width:200px}

	.navWrapper > ul li:hover{
		background:linear-gradient(#f6fbfb, #e9f0ef); /* Standard syntax */
	}
	.navWrapper > ul li:hover a{color:#576f6c;}
	
	.navWrapper > ul > li{
		display:block;
		left:-120px;
		float:none;
		border:none;
		transition:all .5s ease-in-out;
	}

	.navWrapper:hover > ul > li {left:0;}

	.navWrapper > ul > li.sub > a,
	.navWrapper > ul > li.sub:hover > a{
		background:url(../images/icons/symbol_sub_arrow_d.png) no-repeat;
		background-position:160px 20px;	
	}

	.navWrapper ul li ul{top:49px}
	.navWrapper ul ul li{display:block;border-right:none;}

	.navWrapper ul > li:hover > ul li {
		height: 45px;
		border-right:none;
	}
	.navWrapper > ul > li > a{color:#d2d2d2}
	
	.report-issue{margin-top:10px; margin-bottom:10px;}

/*---------------  input block -------------*/

	.input-box {margin-left:20px; margin-right:20px; padding:20px;}
	.input-box li div{margin-top:20px}
	.input-box li label{display:block}
	.input-box li.inblock label{display:inline-block}
	.input-box li.button label{display:none}
	.input-box .captcha input{
		margin-bottom:5px;
	}

/*---------------  Report Issue Page -------------*/
	.report-issue-input{max-width:300px;}
	
	.report-issue-input textarea{
		width:270px; 
		height:200px;
	}
	.report-issue-input li.right{text-align:left}

/* --------------- Add User page -----------*/
	.box-left{
		/*border:1px solid red;*/
		display:block;
	} 

	.box-right{
		/*border:1px solid red;*/
		display:block;
		float:none;
		margin-left:0;
		margin-top:20px;
	} 
	.user-add .input-box li.button{text-align:center} 

/* --------------- Listing Section -----------*/
	
	.grid-wraper {margin:10px 10px;}
	
	.grid-options{display:block;}
	.grid-options li{display:block;}
	.grid-options li img{display:none;}
	.grid-options li.right{text-align:left}

	.data-list{display:block; border-bottom:10px solid #e2e2e2;}
	.data-list > li:first-child{width:auto;padding: 5px 5px 0;}
	.data-list > li{
		display:block;
		vertical-align:top;
		padding: 3px 5px;
		margin:0;
	}

	.data-list .dt-view{display:none}

	.item-list-head,
	.item-list-line {
		display:block;
		background:#f9edfd;
	}
	.item-list-head li { display:none;}
	.item-list-line li {
		display:block; 
		text-align:left;
		padding: 3px 5px;
		margin:0;
	}

	.item-list-head li.thirty,
	.item-list-line li.thirty,
	.item-list-line li.one
	.item-list-head li.one{width:auto}

	.item-list-line li a{display:block; margin:0}

 /* --------------- User IM -----------*/
	.im-user {width:280px;}
	.sendbox textarea{display:block;resize:none; width:260px; margin-bottom:5px;}

/*---------------  Quote View-------------*/
	.quote-view {display:block;}
	
	.quote-view >li{display:block;}
	.quote-view >li:first-child{width:auto;}
	.quote-view >li:nth-child(2){width:auto; height:30px;}
	
	.quote-view .data-list{border-bottom:none}
	
	.quote-view .price-bar strong{display:none;}
	.quote-view .price-bar input.btn-small{display:block;width:auto; width:340px; margin:0; position:fixed; bottom:35px; z-index:1; left:10px}
	.quote-view .price-bar input[name="btn_jtracker"]{display:block;width:auto; width:300px; margin:0; position:fixed; bottom:5px; z-index:1; left:10px}
	.price-bar input.small:not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]){
		display:block;
		width:auto;
		width:328px;
		position:fixed; bottom:75px; z-index:1; left:10px
	}
	
	.compare li input[type="search"]{margin-right:0; margin-bottom:5px;}

}

@media only screen 
and (min-device-width:361px)
and (max-device-width:375px)
{
	.container{
		/*border:1px solid #093;*/
		max-width:375px;
	}

	header{
		max-width:375px;
	}
	
	main{
		min-height:200px;
		max-width:375px;	
	}
	
	footer{
		max-width:375px;	
	}

	.box{display:block; max-width:375px}

	input.large:not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]){
		min-width:auto;
		width:265px;
	}

/* --------------- Logo -----------*/
	
	.logo {display:block; margin:0px; padding:15px 0 0;}
	.logo a{display:table; margin:auto;}
	.top-links{ margin-top:0px; margin-bottom:5px;}

/* --------------- Navigation -----------*/

	.adminNav{padding:5px;}
	.adminNav:hover a.hideNav{left:170px;}

	.navWrapper a.openNav{display:inline-block;}

	.navWrapper > ul{
		margin:0;
		border:none;
		height: 100%; /* 100% Full-height */
		width: 0; /* 0 width - change this with JavaScript */
		position: fixed; /* Stay in place */
		z-index: 1; /* Stay on top */
		top: 0;
		left: 0;
		background-color: rgba(0,28,52,.90); /* #084274Black*/
		/*overflow-x: hidden; /* Disable horizontal scroll */
		padding-top: 60px; /* Place content 60px from the top */
		visibility:collapse;
	}
	
	.navWrapper:hover > ul{visibility:visible;width:200px}

	.navWrapper > ul li:hover{
		background:linear-gradient(#f6fbfb, #e9f0ef); /* Standard syntax */
	}
	.navWrapper > ul li:hover a{color:#576f6c;}
	
	.navWrapper > ul > li{
		display:block;
		left:-120px;
		float:none;
		border:none;
		transition:all .5s ease-in-out;
	}

	.navWrapper:hover > ul > li {left:0;}

	.navWrapper > ul > li.sub > a,
	.navWrapper > ul > li.sub:hover > a{
		background:url(../images/icons/symbol_sub_arrow_d.png) no-repeat;
		background-position:160px 20px;	
	}

	.navWrapper ul li ul{top:49px}
	.navWrapper ul ul li{display:block;border-right:none;}

	.navWrapper ul > li:hover > ul li {
		height: 45px;
		border-right:none;
	}
	.navWrapper > ul > li > a{color:#d2d2d2}
	
	.report-issue{margin-top:10px; margin-bottom:10px;}

/*---------------  input block -------------*/

	.input-box {margin-left:20px; margin-right:20px; padding:20px;}
	.input-box li div{margin-top:20px}
	.input-box li label{display:block}
	.input-box li.inblock label{display:inline-block}
	.input-box li.button label{display:none}
	.input-box .captcha input{
		margin-bottom:5px;
	}

/*---------------  Report Issue Page -------------*/
	.report-issue-input{max-width:315px;}
	
	.report-issue-input textarea{
		width:285px; 
		height:200px;
	}
	.report-issue-input li.right{text-align:left}

/* --------------- Add User page -----------*/
	.box-left{
		/*border:1px solid red;*/
		display:block;
	} 

	.box-right{
		/*border:1px solid red;*/
		display:block;
		float:none;
		margin-left:0;
		margin-top:20px;
	} 
	.user-add .input-box li.button{text-align:center} 

/* --------------- Listing Section -----------*/
	
	.grid-wraper {margin:10px 10px;}
	
	.grid-options{display:block;}
	.grid-options li{display:block;}
	.grid-options li img{display:none;}
	.grid-options li.right{text-align:left}

	.data-list{display:block; border-bottom:10px solid #e2e2e2;}
	.data-list > li:first-child{width:auto;padding: 5px 5px 0;}
	.data-list > li{
		display:block;
		vertical-align:top;
		padding: 3px 5px;
		margin:0;
	}

	.data-list .dt-view{display:none}

	.item-list-head,
	.item-list-line {
		display:block;
		background:#f9edfd;
	}
	.item-list-head li { display:none;}
	.item-list-line li {
		display:block; 
		text-align:left;
		padding: 3px 5px;
		margin:0;
	}

	.item-list-head li.thirty,
	.item-list-line li.thirty,
	.item-list-line li.one
	.item-list-head li.one{width:auto}

	.item-list-line li a{display:block; margin:0}

 /* --------------- User IM -----------*/
	.im-user {width:280px;}
	.sendbox textarea{display:block;resize:none; width:260px; margin-bottom:5px;}


 /*---------------  Quote View-------------*/
	.quote-view {display:block;}
	
	.quote-view >li{display:block;}
	.quote-view >li:first-child{width:auto;}
	.quote-view >li:nth-child(2){width:auto; height:30px;}

	.quote-view .data-list{border-bottom:none}
	
	.quote-view .price-bar strong{display:none;}
	.quote-view .price-bar input.btn-small{display:block;width:auto; width:355px; margin:0; position:fixed; bottom:35px; z-index:1; left:10px}
	.quote-view .price-bar input[name="btn_jtracker"]{display:block;width:auto; width:300px; margin:0; position:fixed; bottom:5px; z-index:1; left:10px}
	.price-bar input.small:not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]){
		display:block;
		width:auto;
		width:343px;
		position:fixed; bottom:75px; z-index:1; left:10px
	}

	.compare li input[type="search"]{margin-right:0; margin-bottom:5px;}
}

@media only screen 
and (min-device-width:376px)
and (max-device-width:414px){
	
	.container{
		max-width:414px;
	}

	header{
		max-width:414px;
	}
	
	main{
		max-width:414px;	
	}
	
	footer{
		max-width:414px;	
	}

	.box{display:block; max-width:414px}

	input.large:not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]){
		min-width:auto;
		width:301px;
	}

/* --------------- Logo -----------*/
	
	.logo {display:block; margin:0px; padding:15px 0 0;}
	.logo a{display:table; margin:auto;}
	.top-links{ margin-top:0px; margin-bottom:5px;}

/* --------------- Navigation -----------*/

	.adminNav{padding:5px;}
	.adminNav:hover a.hideNav{left:170px;}

	.navWrapper a.openNav{display:inline-block;}

	.navWrapper > ul{
		margin:0;
		border:none;
		height: 100%; /* 100% Full-height */
		width: 0; /* 0 width - change this with JavaScript */
		position: fixed; /* Stay in place */
		z-index: 1; /* Stay on top */
		top: 0;
		left: 0;
		background-color: rgba(0,28,52,.90); /* #084274Black*/
		/*overflow-x: hidden; /* Disable horizontal scroll */
		padding-top: 60px; /* Place content 60px from the top */
		visibility:collapse;
	}
	
	.navWrapper:hover > ul{visibility:visible;width:200px}

	.navWrapper > ul li:hover{
		background:linear-gradient(#f6fbfb, #e9f0ef); /* Standard syntax */
	}
	.navWrapper > ul li:hover a{color:#576f6c;}
	
	.navWrapper > ul > li{
		display:block;
		left:-120px;
		float:none;
		border:none;
		transition:all .5s ease-in-out;
	}

	.navWrapper:hover > ul > li {left:0;}

	.navWrapper > ul > li.sub > a,
	.navWrapper > ul > li.sub:hover > a{
		background:url(../images/icons/symbol_sub_arrow_d.png) no-repeat;
		background-position:160px 20px;	
	}

	.navWrapper ul li ul{top:49px}
	.navWrapper ul ul li{display:block;border-right:none;}

	.navWrapper ul > li:hover > ul li {
		height: 45px;
		border-right:none;
	}
	.navWrapper > ul > li > a{color:#d2d2d2}
	
	.report-issue{margin-top:10px; margin-bottom:10px;}

/*---------------  input block -------------*/

	.input-box {margin-left:20px; margin-right:20px; padding:20px;}
	.input-box li div{margin-top:20px}
	.input-box li label{display:block}
	.input-box li.inblock label{display:inline-block}
	.input-box li.button label{display:none}
	.input-box .captcha input{
		margin-bottom:5px;
	}

/*---------------  Report Issue Page -------------*/
	.report-issue-input{max-width:354px;}
	
	.report-issue-input textarea{
		width:324px; 
		height:200px;
	}
	.report-issue-input li.right{text-align:left}

/* --------------- Add User page -----------*/
	.box-left{
		/*border:1px solid red;*/
		display:block;
	} 

	.box-right{
		/*border:1px solid red;*/
		display:block;
		float:none;
		margin-left:0;
		margin-top:20px;
	} 
	.group select{display:block}
	.user-add .input-box li.button{text-align:center} 

/* --------------- Listing Section -----------*/
	
	.grid-wraper {margin:10px 10px;}
	
	.grid-options{display:block;}
	.grid-options li{display:block;}
	.grid-options li img{display:none;}
	.grid-options li.right{text-align:left}

	.data-list{display:block; border-bottom:10px solid #e2e2e2;}
	.data-list > li:first-child{width:auto;padding: 5px 5px 0;}
	.data-list > li{
		display:block;
		vertical-align:top;
		padding: 3px 5px;
		margin:0;
	}

	.data-list .dt-view{display:none}

	.item-list-head,
	.item-list-line {
		display:block;
		background:#f9edfd;
	}
	.item-list-head li { display:none;}
	.item-list-line li {
		display:block; 
		text-align:left;
		padding: 3px 5px;
		margin:0;
	}

	.item-list-head li.thirty,
	.item-list-line li.thirty,
	.item-list-line li.one
	.item-list-head li.one{width:auto}

	.item-list-line li a{display:block; margin:0}

 /* --------------- User IM -----------*/
	.im-user {width:320px;}

 /*---------------  Quote View-------------*/
	.quote-view {display:block;}
	
	.quote-view >li{display:block;}
	.quote-view >li:first-child{width:auto;}
	.quote-view >li:nth-child(2){width:auto; height:30px;}
	
	.quote-view .data-list{border-bottom:none}
	
	.quote-view .price-bar strong{display:none;}
	.quote-view .price-bar input.btn-small{display:block;width:auto; width:395px; margin:0; position:fixed; bottom:35px; z-index:1; left:10px}
	.quote-view .price-bar input[name="btn_jtracker"]{display:block;width:auto; width:300px; margin:0; position:fixed; bottom:5px; z-index:1; left:10px}
	.price-bar input.small:not([type="submit"]):not([type="button"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]){
		display:block;
		width:auto;
		width:383px;
		position:fixed; bottom:75px; z-index:1; left:10px
	}
	
	.compare li input[type="search"]{margin-right:0; margin-bottom:5px;}
}