/* Higher than 1200 (desktop devices)
====================================================================== */



@media (min-width: 1200px) {

	
	.container-fluid-full {
		overflow: hidden;
		position: relative;
		height: 100%;
	}
	
	#content {
		width: 85.578%;
		padding: 28px;
		margin: 0px 0px;
		margin-left: 14.422% !important;
	}
		
	#sidebar-left {
		background: #292929;
		margin-left: 0px !important;
		position: absolute;
		height: 100%;
	}
	
	.sidebar-nav > ul{
		margin: 0px;
	}
	
	footer {
		margin: 0px 0px 0px 0px;
		padding: 10px 20px;
	}
	
}

/* Higher than 960 (desktop devices)
====================================================================== */
@media only screen and (min-width: 980px) and (max-width: 1199px){
	
	.container-fluid-full {
		overflow: hidden;
		position: relative;
		height: 100%;
	}
	
	#content {
		width: 85.578%;
		padding: 20px;
		margin: 0px;
		margin-left: 14.422% !important;
	}
	
	.dark {
		padding: 20px;
		top: -20px;
		right: -12px;
		margin-bottom: -56px;
		margin-right: -30px;	
	}
	
	
	#sidebar-left {
		background: #3A3A3A;
		margin-left: 0px !important;
		position: absolute;
		height: 100%;
	}
	
	.sidebar-nav > ul{
		margin: 0px;
	}
	
	.sparkLineStats {
		position: relative; 
		padding-bottom: 4px;
	}
	
	.sparkLineStats li {
		font-size: 10px;
		line-height: 42px;
	}
	
	.sparkLineStats li .number {
		font-size: 16px;
		font-weight: 700; 
		padding:0 0px; 
	}
	
	.breadcrumb {
		margin: -20px -20px 20px -20px;	
	}
	
	.statbox,
	.widget,
	.box,
	.circleStatsItemBox {
		margin-bottom: 20px;
	}
	
	/* Page: Tasks
	=================================================================== */

	.task .desc {
		display: inline-block;
		width: 70%;
		padding: 10px 10px;
		font-size: 12px;
	}

	.task .desc .title {
		font-size: 16px;
		margin-bottom: 5px;
	}

	.task .time {
		display: inline-block;
		float: right;
		width: 20%;
		padding: 10px 10px;
		font-size: 12px;
		text-align: right;
	}

	.task .time .date {
		font-size: 16px;
		margin-bottom: 5px;	
	}

	footer {
		margin: 0px;
		padding: 10px 20px;
	}
	
}




/* Tablet Portrait (devices and browsers)
====================================================================== */
@media only screen and (min-width: 768px) and (max-width:1200px) {
    
	
	.hidden-tablet{display:none!important}
	.container-fluid-full {
	overflow: hidden;
	position: relative;
	height: 100%;
	background-image: url(edit-product-parts.html);
	}
	
	#content {
		width: 91.666%;
		padding: 22px;
		margin: 0px 0px;
		margin-left: 8.334% !important;
	}
	
	.dark {
		padding: 20px;
		top: -22px;
		right: -15px;
		margin-bottom: -56px;
		margin-right: -30px;
	}
	
	.breadcrumb {
		margin: -22px -22px 22px -22px;	
	}
	
	.statbox,
	.widget,
	.box,
	.circleStatsItemBox {
		margin-bottom: 22px;
	}
		
	#sidebar-left {
		background: #3A3A3A;
		margin-left: 0px !important;
		position: absolute;
		height: 100%;
		width: 8.334% !important;
	}
	
	.sidebar-nav > ul{
		margin: 0px;
	}
	
	.nav-tabs.nav-stacked > li > a,
	.nav-tabs.nav-stacked > li > ul > li > a {
		text-align: center;
		margin-top: -2px;	
	}
		
	.noMargin {
		margin-left: 0px !important;
	}
	
	.btn-navbar {
		display: none !important;
	}
	
	.nav-collapse,
  	.nav-collapse.collapse {
    	height: auto !important;
    	overflow: visible !important;
		margin-left: 0px !important;
  	}
	
	
	.stats-date .range {
		font-size: 16px;
		font-weight: 300;
	}


	.stat .left .number {
		font-size: 16px;
		font-weight: 300;
	}

	.stat .left .title {
		font-size: 9px;
	}

	.stat .right .percent {
		text-align: center;
		font-size: 12px;
		line-height: 16px;
	}
	
	.box-small-link {
		font-size: 20px;
	}
	
	.sparkLineStats {
		padding-bottom: 10px;
	}
	
	.sparkLineStats li {
		font-size: 10px;
		line-height: 43px;
	}
	
	.sparkLineStats li .number {
		font-size: 12px;
		font-weight: 700; 
		padding:0 0px; 
	}
	
	/* Page: Tasks
	=================================================================== */

	.task {
		border-bottom: 1px solid #f9f9f9;
		margin-bottom: 1px;
	}

	.task.high {
		border-left: 2px solid rgba(250,96,61,1);
	}

	.task.medium {
		border-left: 2px solid rgba(250,187,61,1);
	}

	.task.low {
		border-left: 2px solid rgba(120,205,81,1);
	}

	.task .desc {
		display: inline-block;
		width: 65%;
		padding: 10px 10px;
		font-size: 10px;
		margin-right: -20px;
	}

	.task .desc .title{
		font-size: 14px;
		margin-bottom: 5px;
	}

	.task .time {
		display: inline-block;
		float: right;
		width: 25%;
		padding: 10px 10px;
		font-size: 10px;
		text-align: right;
	}

	.task .time .date {
		font-size: 14px;
		margin-bottom: 5px;	
	}

	.timeslot .task span {
		border: 2px solid rgba(103, 194, 239, 1);
		background: rgba(103, 194, 239, .1);
		padding: 5px;
		display: block;
		font-size: 10px;
	}

	.timeslot .task span span{
		border: 0px;
		background: transparent;
		padding: 0px;
	}

	.timeslot .task span span.details{
		font-size: 14px;
		margin-bottom: 0px;
	}

	.timeslot .task span span.remaining{
		font-size: 12px;
	}
	
	footer {
		margin: 0px;
		padding: 10px 20px;
	}
	
}

/* All Mobile Sizes (devices and browser)
====================================================================== */
@media only screen and (max-width: 767px) {
	

   

	#content {
		overflow: hidden;
		margin: -10px 0px 0px 0px;
	}
	
	.breadcrumb {
		margin: -5px -5px 5px -5px;
	}
    .dropdown-menu{left:0!important;}
	
	.nav-tabs.nav-stacked > li > a,
	.nav-tabs.nav-stacked > li > ul > li > a {
		margin-top: -2px;	
	}
		
	.dark {
		padding: 5px;
		top: 5px;
		right: 0px;
		margin-bottom: 0px;
		margin-right: 0px;
		position: relative;
		border: 0px;
	}
	
	.statbox,
	.widget,
	.box,
	.circleStatsItemBox {
		margin-bottom: 20px !important;
	}
    input, textarea, .uneditable-input {
    width: 100%;
}
	textarea{ width:97% !important;}

	/* Page: Tasks
	=================================================================== */

	.task {
		border-bottom: 1px solid #f9f9f9;
		margin-bottom: 1px;
	}

	.task.high {
		border-left: 2px solid rgba(250,96,61,1);
	}

	.task.medium {
		border-left: 2px solid rgba(250,187,61,1);
	}

	.task.low {
		border-left: 2px solid rgba(120,205,81,1);
	}

	.task .desc {
		display: inline-block;
		width: 65%;
		padding: 10px 10px;
		font-size: 10px;
		margin-right: -20px;
	}

	.task .desc .title{
		font-size: 14px;
		margin-bottom: 5px;
	}

	.task .time {
		display: inline-block;
		float: right;
		width: 25%;
		padding: 10px 10px;
		font-size: 10px;
		text-align: right;
	}

	.task .time .date {
		font-size: 14px;
		margin-bottom: 5px;	
	}

	.timeslot .task span {
		border: 2px solid rgba(103, 194, 239, 1);
		background: rgba(103, 194, 239, .1);
		padding: 5px;
		display: block;
		font-size: 10px;
		-webkit-border-radius: 4px;
		   -moz-border-radius: 4px;
				border-radius: 4px;
	}

	.timeslot .task span span{
		border: 0px;
		background: transparent;
		padding: 0px;
	}

	.timeslot .task span span.details{
		font-size: 14px;
		margin-bottom: 0px;
	}

	.timeslot .task span span.remaining{
		font-size: 12px;
	}

	
	.full-input .controls input { width:100% !important;}
    .container-1 .btn{ float:left;}
    .light-col .contact-box{ width:auto;}
    .hd-bg {text-align: center;}
    .full-input input[type="text"]{ width:100%;}
    .top-mrg {margin-top: -9px;}

	.fix-footer{left:0;}
}

/* Mobile Landscape Size to Tablet Portrait (devices and browsers)
====================================================================== */
@media only screen and (min-width: 480px) and (max-width: 767px) {
	
	
	#content {
		padding: 5px;
	}
	
	.stat {
		width: 50%;
		margin: 10px 0% 0% 0%;
		float: left;
	}
		
	.quick-button,
	.quick-button-small {
		margin-bottom: 20px;
	}
	
	.pull-right {
		width: 100%;
		margin: 10px auto;
		text-align: center;
	}
	
	.fc-button-today,
	.fc-button-month,
	.fc-button-agendaWeek,
	.fc-button-agendaDay {
		display: none;
	}
	
	footer {
		padding: 10px 20px; font-size:12px
	}
	.table th, .table td{ padding:8px 4px;}
	.datepicker{width: 218px;}
    .bg1 {  text-align:left !important;
}
    .nav-no-collapse .dropdown-menu{margin-left:0;}
	
    .navbar .pull-right > li > .dropdown-menu::before, .navbar .nav > li > .dropdown-menu.pull-right::before {
    left: 12px !important;
    right:auto;
}
    .navbar .pull-right > li > .dropdown-menu::after, .navbar .nav > li > .dropdown-menu.pull-right::after {
    left: 12px !important;
    right:auto;
}

 

}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers)
=================================================================== */
@media only screen and (max-width: 479px) {
	
	
	#content {
		padding: 5px;
	}
	
	.stat {
		width: 100%;
		margin: 1% 0% 0% 0%;
		float: left;
	}
		
	.quick-button,
	.quick-button-small {
		margin-bottom: 20px;
	}
	
	.pull-right {
		width: 100%;
		margin: 10px auto;
		text-align: center;
	}
	
	.fc-button-today,
	.fc-button-month,
	.fc-button-agendaWeek,
	.fc-button-agendaDay {
		display: none;
	}
	
	table,
	.pagination {
		font-size:13px;
	}
	
	.pagination {
		padding: 5px;
	}
	
	.ui-slider-handle {
		margin-top: 1px !important;
	}

	.sliderVertical .ui-slider-handle {
		margin: 0px 0px -10px 1px !important;
	}
	
	
	footer {
		padding: 10px 20px; font-size:12px
	}
	
}

@media only screen and (min-width:540px) and (max-width:970px) {
.table-td-mrg td {  float: left; width: 45%;}
.text-link a {margin: 0 8px 0 0; float:right;}
.left-boder{ border-left:none; padding-left:0;}
.container-1{ margin-top:5px;width:96%;}
.full-input .controls input { width:87%;}
.show-detail{display:none;}
.container-1 input[type='text'] {width:99%;}
.container-1 .btn{ float:left;}
.searchbox-1{ width:100%}
.container-1 .btn { margin-top: 9px !important;}
.search-btn2{ margin-top:5px;}
.big-textarea {width:80%; height: 159px;}

}


@media only screen and (min-width:0px) and (max-width:540px) {
.table-td-mrg td {width:98%; float:left;}
.full-input input { width:100%;}
.select select {height: 35px;}
.container-1 .icon{right: 6px;}
.container-1 {width:100%;}
.show-detail{display:none;}
.light-col .contact-box{ width:100%; text-align:left;}
footer{min-height: 32px;}.searchbox-1{ width:100%}
.container-1 input[type="text"] { width: 97% !important;}
.search-btn {font-size: 12px; line-height:28px;padding: 0 20px; margin-top:10px;}
h1 {font-size: 22px;}
.container-1 .btn { margin-top: 9px !important;}
h1 {  float:left}.search-btn2{ margin-top:5px;}
    big-textarea {
        width: 94% !important;
        height: 159px;
    }

.login-box p a{display:block;}
.contact-box {font-size:12px;
    } .contact-box a{font-size:12px;}
      .headingFor{float:none !important;}
}
 
@media only screen and (min-width:767px) and (max-width:800px){.wrTab{width:82% !important;}}
@media only screen and (min-width:767px) and (max-width:970px) { .table th, .table td { font-size: 12px; padding:5px !important; word-wrap:break-word;}.add-col-rwd td table td {float: left; width: 41%;}}
@media only screen and (min-width:970px) and (max-width:1260px) {.select select { font-size:11px !important;  white-space:pre-wrap;}.select .arr {height: 27px;}}

@media only screen and (max-width: 1024px) {.add-col-rwd td { padding: 7px; }}
@media only screen and (max-width: 800px) {
    .table{padding-bottom:25px;}
    #no-more-tables{clear:both;}
    /* Force table to not be like tables anymore */
	#no-more-tables table, 
	#no-more-tables thead, 
	#no-more-tables tbody, 
	#no-more-tables th, 
	#no-more-tables td, 
	#no-more-tables tr { 
		display: block; 
	}
 
	/* Hide table headers (but not display: none;, for accessibility) */
	#no-more-tables thead tr { 
		position: absolute;
        width:35%;
		
	}
 
	#no-more-tables tr {  }
    #no-more-tables tr th{width:100% !important; padding:8px 4px;}
   
	#no-more-tables td { 
		/* Behave  like a "row" */
		border: none;
		position: relative;
		padding-left: 35%; 
        padding-top:8px;
        padding-bottom:8px;
		white-space: normal;
		text-align:left;
        line-height:19px;
       min-height: 17px;
	}
 #no-more-tables td:last-child{line-height:21px;}
	#no-more-tables td:before { 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: 35%; 
		padding-right: 10px; 
		white-space: nowrap;
		text-align:left;
		font-weight: bold;
	}
 .pagerstats, .pagerjumper{display:none!important;}
 #paging{height:20px;}
	/*
	Label the data
	*/
    #no-more-tables td:before { content: attr(data-title);}
    #no-more-tables td#tdAction:before { content: attr(data-title);height: auto;}
    #no-more-tables td#tdAction{height:auto;}
}

@media screen and (min-width:0) and (max-width:340px) {#no-more-tables td { padding-left:48% !important;}
    
}

@media only screen and (max-width:800px) {
#table-no-resize thead {  display: none; }
#table-no-resize tbody td { border: none !important; display: block; font-size: .8125rem; padding: 0; vertical-align: top; border-bottom: 1px solid #ddd !important;}
#table-no-resize tbody tr { border-bottom: 1px solid #c0c2c2; float: left; width: 100%;}
#table-no-resize tbody td:before {content: attr(data-th) ": "; color:#565758;  display: inline-block; font-weight: bold; margin-right: 10px; padding: 2px 10px;  width: 28%;}
#table-no-resize tbody td .bt-content {display: inline-block; padding: 2px 5px 0; word-wrap: break-word; }
#table-no-resize tbody td:first-of-type:before,
#table-no-resize tbody td:first-of-type .bt-content { padding-top: 10px;}
#table-no-resize tbody td:last-of-type:before,
#table-no-resize tbody td:last-of-type .bt-content {  padding-bottom:0px;}
#table-no-resize tbody td.bt-hide {display: none;}
.btn-info, .btn-danger{ float:none;}
td.text-no { content:none;visibility: hidden}
#paging {visibility: visible !important;}
.text-no .bt-content {padding: 0 0 20px !important; width: 96%; visibility:visible;}
.add-col-rwd td { float: left;padding: 1% !important; width: 98%;}
.add-col-rwd label {font-size:12px;}
.add-col-rwd td input, .add-col-rwd td textarea, .add-col-rwd td select{ width:97% !important}
.add-col-rwd td select{ width:99% !important}
.add-col-rwd td input.btn[type="submit"]{ width:auto !important;}
button.btn, input.btn[type="submit"] { width: auto;}
}