/* Media queries
================================================== */

/* Increasing space between widgets and general wrapper paddings */

@media only screen and (min-width: 980px) and (max-width: 1280px) {
	
	.oneTwo { width: 48%; }
	.wrapper { margin: 0 4%; }
	.oneThree { width: 31%; margin-left: 3.5%; }
	.twoOne { width: 65.5%; }
	.oneFour { width: 22%; margin-left: 4%; }
	.formRow .formRight { width: 72%; }
	.chzn-container { width: 80%!important; }
	.SRC_NumBox { width: 10%; }
	.SRC_CodeBox { width: 90%; }
	
}


/* Fixing login panel for mobile devices */

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

.loginWrapper { margin: -119px 0 0 -141px; }
.loginWrapper .widget { width: 282px; }
.loginWrapper .formRow > label { float: left; padding: 4px 0; }
.loginInput { width: 160px; margin-right: 4px; }

.chzn-container .chzn-drop { width: 99.6%!important; }
.chzn-container-single .chzn-search { text-align: center; }
.chzn-container-single .chzn-search input { width: 89%!important; }
	
}



/* Devices and browsers with min of 800px and max of 979px */

@media only screen and (min-width: 768px) and (max-width: 1024px) {
	
	.wrapper { margin: 0 5%; }
	.pageTitle { max-width: 45%; }
	.oneTwo, .oneTwo:first-child, .oneThree, .oneThree:first-child, .oneFour, oneFour:first-child, .twoOne, .twoOne:first-child { width: auto; float: none; margin: 0; clear: both; width: 100%; }
	table thead td span { background-position: 100%; }
	.formRow { padding: 14px 14px 18px 14px; }
	.formRow .formRight { width: 100%; float: none; margin-right: 14px; }
	.form input[type="text"], .form input[type="password"], .form textarea { width: 97%; }
	.formRow .inputImg { top: auto; bottom: 26px; }
	.formRow > label { float: none; padding: 0 0 12px 0; }
	.req { float: none; margin-left: 0; display: inline; }
	.chzn-container { width: 100%!important; }
	
	.topNav { display: inline-block; text-align: center; }
	.userNav { margin-right: 214px!important; }
	
	.welcome { display: none; }
	.dataTables_filter input[type="text"] { width: 110px!important; }

	.controlB ul li { margin: 4px 1%; width: 30%; }
	
	.sItem { width: 186px; }
	
	.horControlB ul li { margin: 2px; width: 46%; }
	
	table thead td span { display: none; }
	.sTable thead td.sortCol { text-align: center; padding: 3px 14px 2px 14px; }
	
	.chzn-container-single .chzn-search { text-align: center; }
	.chzn-container-single .chzn-search input { width: 94%!important; }

}


/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */

@media only screen and (max-width: 1024px) {
	
	html { -webkit-text-size-adjust: 100%; }
	.statsDetailed { top: 60px; }
	.withCheck thead tr td:first-child { width: 37px; }
	.oneTwo, .oneTwo:first-child, .oneThree, .oneThree:first-child, .oneFour, oneFour:first-child, .twoOne, .twoOne:first-child { width: auto; float: none; margin: 0; clear: both; }
	
	.loginWrapper .formRow > label { float: left; padding: 4px 0; }
	.loginInput { margin-right: 4px; }
	.dnone { display: none; }
	.loginPage { min-height: 500px; }
	
	.chzn-search { text-align: center; }
	.chzn-container-single .chzn-search input { width: 89%!important; }

}


/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */

@media only screen and (min-width: 768px) {
	
	.errorPage .welcome { display: block; }
	.errorPage .userNav { margin-right: 0!important; float: right; }
	
}


/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */

@media only screen and (max-width: 599px) {
	
	#rightSide { padding-bottom: 74px; }
	
	.userNav ul li span { display: none; }
	.topNav { background: url(../images/backgrounds/topnavBg.png) repeat; margin: 0; padding: 0; }	
	.userNav { float: none; margin-right: 0; border: none; }
	.userNav > ul { border: none; }
	.userNav > ul li { float: none; display: inline-block; margin: 3px 0 3px -4px }
	.userNav > ul li a { float: none; padding: 9px 14px 8px 14px; margin: 0; }
	.userNav > ul li img { margin: 0; float: none; padding: 0; display: inline; }
	
	ul.userDropdown { left: -53px; }
	ul.userDropdown li { margin: 0; text-align: left; }
	ul.userDropdown li a { padding: 6px 10px 7px 32px; }
	
	.itemActions { margin: 16px auto 8px auto; float: none; clear: both; display: block; width: 210px; }
	.tPagination { padding: 16px 12px; float: none; clear: both; }
	
	.invButtons .bFirst, .invButtons .bLast { float: none; }
	.invButtons .bLast { margin-top: 10px; }
	
	.plupload_scroll .plupload_filelist_header .plupload_file_action, .plupload_scroll .plupload_filelist_footer .plupload_file_action { margin-right: 0; margin-left: 0; width: 0; }
	.plupload_file_size, .plupload_file_status, .plupload_progress { width: auto; }
	.plupload_file_size { margin: 0 10px; }
	.plupload_filelist .plupload_file_name { width: 48%; }
	
	.dataTables_filter input[type="text"] { width: 169px!important; }
	.dataTables_paginate { text-align: center; margin: 8px 6px 40px 6px; }
	.ui-buttonset .ui-button { margin: 0 2px; }
	.dataTables_paginate .ui-button { margin-right: 0; }
	.dataTables_filter { margin: 4px 12px 2px 12px; left: 50%; margin-left: -123px; }
	.dataTables_paginate .last { border-bottom: 1px solid #d5d5d5!important }
	
	table.display thead th div.DataTables_sort_wrapper { line-height: 16px; text-align: center; padding-right: 10px; }
	table.display thead th div.DataTables_sort_wrapper span, .dataTables_length .itemsPerPage, table thead td span { display: none; }
	
	.form input[type="text"], .form input[type="password"], .form textarea { width: 94%; }
	.formRow { padding: 14px 14px 18px 14px; }
	
	div.tagsinput { padding: 0; width: 99%!important; }
	
	.filter > input[type=text] { width: 75%; }
	.leftPart, .rightPart { float: none; width: 100%; max-width: 100%; }
	.leftPart { margin-bottom: 20px; }
	.rightPart { margin-top: 30px; }
	.countLabel { text-align: center; }
	
	.dualControl { width: auto; margin: 0; position: static; left: 0; margin-left: 0; }
	
	.SRC_CodeBox { width: 90%; }
	.SRC_NumBox { width: 10%; }
	
	.el-finder-nav { width: 40%; }
	
}


/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */

@media only screen and (min-width: 600px) and (max-width: 1024px) {

	.userNav { float: none; margin-right: 0; border: none; }
	.userNav > ul { border: none; margin: 0; }
	.userNav > ul li { display: inline-block; float: none; margin-left: -4px; }
	ul.userDropdown { left: -10px; }
	ul.userDropdown li { margin: 0; text-align: left; }
	ul.userDropdown li a { padding: 6px 10px 7px 32px; }
	.filter > input[type=text] { width: 70%; }
	.dualControl button { padding: 7px 12px 8px 12px }
	div.tagsinput { width: 97%!important; }

}


/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */

@media only screen and (min-width: 600px) and (max-width: 767px) {
	
	.form input[type="text"], .form input[type="password"], .form textarea { width: 97%; }
	.formRow { padding: 14px 16px 18px 16px; }
	.changes .negative, .changes .positive, .changes .zero { padding-left: 56%!important; background-position: 72% 6px!important; }
	table thead td span { display: block; right: -13px; }
	.sTable thead td.sortCol { text-align: left; padding: 3px 14px 2px 14px; }
	.dataTables_filter input[type="text"] { width: 150px!important; }

}

	
/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */

@media only screen and (max-width: 767px) {
	
	.titleArea {display:none;}
	#leftControl {display: none;}
	.resp { display: block; }
	.respHead { text-align: center; }
	.respHead > a { margin: 20px 0; display: block; }
	
	.loginPanel {background: none!important;border: none!important;}
	.loginLogo {top: -50px!important;}
	
	.topNav { position: static; }
	
	#leftSide, .welcome { display: none; }
	.dn { display: block; }
	body { background: none; }
	.wrapper { margin: 0 6%; }
	.topNav { display: inline-block; text-align: center; }
	.titleArea { text-align: center; padding-top: 24px; }
	.pageTitle > h5 { font-size: 18px; margin-bottom: 4px; }
	.pageTitle { float: none; padding: 0 0 22px 0; }
	.formRow .formRight { width: 100%; float: none; margin-right: 14px; }
	.formRow .inputImg { top: auto; bottom: 26px; }
	.formRow > label { float: none; padding: 0 0 12px 0; }
	.req { float: none; margin-left: 0; display: inline; }
	.step h1 { display: none; }
	
	.middleNav { float: none; margin: 0 auto 29px auto; width: 282px; }
	.middleNav > ul li { display: inline; width: 69px; float: left; }
	.middleNav > ul li:first-child { width: 70px; }
	.middleNav ul li a { width: 100%; }
	
	.middleNav ul li a span.files { background-position: 21px; }
	.middleNav ul li a span.users { background-position: 14px; }
	.middleNav ul li a span.messages { background-position: 18px; }
	.middleNav ul li a span.orders { background-position: 21px; }
	
	.numberMiddle { right: -3px; }
	
	.middleNav ul li ul { left: 0; width: 140px; text-align: left; background-position: 28px 0; }
	.middleNav ul li ul li { width: 100%; }
	.middleNav ul li.mOrders ul, .middleNav ul li.mFiles ul { right: -3px; left: auto; background-position: 95px 0; }
	.middleNav ul li ul li:first-child { width: 100%; }
	
	.controlB ul li { display: block; float: left; width: 49%; margin: 1px 1px 0 0; }
	.horControlB ul li { margin: 1px 0 0 0; width: 100%; text-align: left; }
	
	.sItem { margin: 1px 0 0 0; width: 100%; }
	.sItem > h2 { width: 50%; border-right: 1px solid #D5D5D5; }
	.changes { padding: 14px 0 5px 0; float: none; }
	.changes .negative, .changes .positive, .changes .zero { padding-left: 58%; background-position: 68% 6px; background-repeat: no-repeat; }
	.changes .negative { background-image: url(../images/negArrow.png); }
	.changes .positive { background-image: url(../images/posArrow.png); }
	.changes .zero { background-image: url(../images/zero.png); }
	
	.statsDetailed { margin-left: -111px; }
	
	#footer .wrapper { padding: 0 12px 12px 12px!important; }
	.leftPart .selector, .rightPart .selector { display: none; }
	.chzn-container { width: 100%!important; }
	div.uploader { width: 220px; }
	.formRow .checker, .formRow .radio { clear: both; }
	
	.errorWrapper .errorNum { font-size: 180px; padding: 100px 0 65px 0; }
	.errorWrapper .offline { font-size: 115px; padding: 80px 0 45px 0; }
	
	.sTable, .dTable { table-layout: fixed; }
	.sTable tbody td, .dTable tbody td { overflow: hidden; padding: 8px; }
	.sTable thead td { overflow: hidden; }
		
	.goTo { display: block; width: auto; height: auto; font-weight: bold; font-size: 10px; text-transform: uppercase; color: #fafafa; padding: 10px 0; cursor: pointer; margin: 0 6% }
	.goTo:hover, .goTo:active {  } 
	.goTo > img { margin: 3px 16px 0 0; float: left; }
	
	.pInfo { max-width: 70%; }
	.searchWidget input[type="text"] { width: 92%!important; }
	
}