/* hideonmobile */
@media screen and (max-width:567px) {
    .hideonmobile{display:none}
	.toggle{margin-left: 25px;}
}
/* showonmobile */
@media screen and (min-width:568px){
    .showonmobile{display:none !important}
}

@media all and (max-width: 567px) {
	.toggle{margin-left: 25px;}
	
	#title-wrapper {
		padding:25px !important;
		padding-bottom:0px !important;
		padding-left: 20px !important;
		padding-right: 3% !important;
	}
	#main-logo { 
		width:92% !important;
		height: initial !important;
	}
	#main-title {
		line-height: 40px !important;
		padding-left:6px !important;
	}
	#main-menu {
		padding-right:4% !important;
		margin-top:-18px;
	}
	#main-menu i {
		font-size:22px;
		padding:6px !important;
	}
	#app-content {
		margin-top:0px !important;
		padding:5% !important;
	}
	
	#app-title {
		font-size: 22px !important;
		padding: 8px !important;
		margin-top:60px !important;
	}
	
	#asset-details {
		top:14px !important;
		padding:30px !important;
		width: 75% !important;
		font-size:12px;
	}
	
	#asset-preview {
		max-height:180px !important;
	}
	
	#asset-table table {
		margin-top:14px;
	}
	
	#tableview {
		display:none !important;
	}
	
	table {
		overflow-x: auto;
		display: block;
	}
	
	.dealerSearch{
		padding-bottom: 14px!important;
		float: initial!important;
	}
	
	.manageUtils{
		float: initial!important;
	}
	
	.dataTables_filter{
		float:left!important;
	}
	
}

body {
	font-family:Raleway;
}

a {
	text-decoration:none;
	color:#333;
}

a:hover {
	color:#777;
}

.pure-g {
	letter-spacing:.01em !important;
}

hr {
    border: none;
    height: 1px;
    color: #333;
    background: #c0c0c0;
}

#wrapper {
	position:relative;
}

#title-wrapper { 
	background: #fff;
	//background-image:url('http://wesleyhall.com/assets/images/Fabrics/thumbs/matrix_white.jpg');
	background-size:cover;
	padding:36px;
	padding-top:24px;
	padding-left:4%;
	padding-bottom:0px;
	color:#000;
	font-family:'Open Sans';
	font-weight:300;
	font-size:24px;
}

#main-logo {
	clear:both;
	float:left;
	height:60px;
	padding-top:6px;
//	padding-bottom: 20px;
}

#main-title {
	float:left;
	padding-left:20px;
	line-height:70px;
}

#main-menu {
	float:right;
	padding-right:4%;
	padding-top: 14px;
	cursor:pointer;
	z-index:11000 !important;
}

#main-menu i {
	padding:8px;
	background:#f60;
	color:#FFF;
}

#main-menu i.psLink {
	padding:8px;
	background:#000000;
	color:#FFF;
}

#login-name {
	background:#777;
	color:#FFF;
}
.pure-menu-link {
	padding: 7px !important;
	padding-left:12px;
}
.pure-menu-children {
	position:relative;
	right:0px !important;
	min-width:170px;
	left:inherit !important;
	font-size:18px;
	padding:6px;
	border: 1px solid #e2e2e2;
	z-index:11000 !important;
}
.pure-menu-has-children>.pure-menu-link:after {
	display:none;
}

.pure-menu-list {
	cursor: pointer;
}

#app-content {
	position:relative;
	clear:both;
	top:165px;
	color:#333;
	margin-bottom:40px;
	padding:4%;
}

#app-title {
	clear:both;
	position:relative;
	width:108%;
	margin-left:-7%;
	margin-top:86px;
	background: #f60;
	background-size:cover;
	border-top:1px solid #FFF;
	font-size:28px;
	color: #FFF;
	padding:12px;
}

#app-title-parker {
	clear:both;
	position:relative;
	width:108%;
	margin-left:-7%;
	margin-top:86px;
	background: #000000;
	background-size:cover;
	border-top:1px solid #FFF;
	font-size:28px;
	color: #FFF;
	padding:12px;
}

.pure-button-primary {
	background-color:#f60;
}

.pure-button-primary.psLink {
	background-color:#000000;
}

#search-tools {
	z-index:998;
	position:fixed;
	bottom:6px;
	right:6%;
}

#search-tools div {
	margin-bottom:12px;
	padding:10px;
	background:#0082f3;
	border-radius:4px;
	border:1px solid #FFF;
	color:#FFF;
	cursor:pointer;
}

.shadowbox {
	display:none;
	position:fixed;
	z-index:10002;
	top:0px;
	left:0;
	width:100%;
	height:100%;
	background:url('/assets/images/shadowbox-bkgrd.png');
}
#asset-details {
	width:55%;
	padding:40px;
	border:1px solid #c0c0c0;
	border-radius:6px;
	background: #FFF;
}

#asset-preview {
	max-width:100%;
}

#asset-table table {
	width:100%;
}

.thumbdiv img {
	cursor:pointer;
}

.asset_thumbs {
	height:240px;
	border:1px solid #e8e8e8;
	border-radius:6px;
	max-width:90% !important;
}

#tablegrid {
	clear:both;
	position:relative;
}

#tablegrid  table{
	width:98%;
	font-size:14px;
}

#sessionalert {
	position:relative;
	margin:0 auto;
	top:180px;
	width:220px;
	padding:30px;
	padding-top:10px;
	border:1px solid #c0c0c0;
	border-radius:6px;
	background: #FFF;
}

tr.clickable{
	cursor:pointer;
}

.docthumbs {
	width:80%;
	padding:20px;
	text-align:center;
	margin-bottom:15px;
}


.docthumbs img {
	border:1px solid #c0c0c0;
	margin-bottom:10px;
}

#hdmyTable {
	left:4% !important;
}
#hdmyTable .header{
	background-image:none !important;
}

#shadowbox_overlay {
    position: fixed;
    z-index: 10000;
    top: 0px;
    left: 0px;
    height:100%;
    width:100%;
    background: #000;
    display: none;
}

.shadow-close {
	position:absolute;
	top:10px;
	right:18px;
	font-size:24px;
	color:#444;
	cursor:pointer;
	z-index:12000;
}

.shadowbox {
	padding:40px;
	border:1px solid #c0c0c0;
	border-radius:6px;
	background: #FFF;
}

.portal-button {
	background:#f60 !important;
	color:#FFF;
}

.portal-button:hover {
	background:rgba(0, 188, 212, 0.82);
	color:#FFF;
}

.divisionCard{
	width: 300px; 
	margin-right: 25%;
	margin-left: 25%;	
	padding: 20px; 
	padding-top: 10px;
	border: 1px solid #c0c0c0; 
	border-radius: 6px; float:left;
}

.cardTitle{
	text-align: center;
}

.divisionCard.temple > h3{
	color: orange;
}

.divisionCard.parker > h3{
	color: grey;
}

.divisionToggleContainer{
	float:left;
}

.divisionToggle{
	padding-bottom: 5px;
}

.divsionSync{
	padding: 5px;
}

.buttonDiv{
	text-align: center;
}

.buttonContainer{
	width: 100%;
}

.buttonContainer > button{
	float:right;
}

#app-content > .documentCategoryTable{
	text-align: center;
	margin-right: auto;
	margin-left: auto;
}

.categoryRemove{
	background: red;
	color: white;
}

/********************
Sales Aid Styles
*********************/
.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

/* Hide default HTML checkbox */
.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

/* The slider */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #f60;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}

/* PS slider */
.ps-slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.ps-slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .ps-slider {
  background-color: #000000;
}

input:focus + .ps-slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .ps-slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.ps-slider.round {
  border-radius: 34px;
}

.ps-slider.round:before {
  border-radius: 50%;
}

.hide{
	display: none;
}

.row{
	margin-bottom: 20px;
}

.pure-form label{
	font-family: Raleway!important;
}

.pure-form-aligned select{
	font-family: Raleway!important;
}

.pure-form-aligned input{
	font-family: Raleway!important;
}

.pure-form-message-inline{
	font-family: Raleway!important;
}

/*input.salesAidSubmit{
	background: #f60;
	color: white;
	border: none;
	border-radius: 30px;
	line-height: 25px;
}*/

.tf-viewOrder{
	color: #f60!important; 
	font-size: 16px!important;
}

.tf-viewOrder > a{
	color: #f60!important; 
	font-size: 16px!important;
}

.tf-button {
	background-color: #F60 !important;
	color: white; 
	border: none;
	min-height: 38px; 
	min-width: 250px; 
	font-size: 16px;
	padding: 0px 10px 0px 10px;
}

.tf-button:hover{
	background-color: #F60 !important;
}

.ps-button {
	background-color: #000000 !important;
	color: white; 
	border: none;
	min-height: 38px; 
	min-width: 250px; 
	font-size: 16px;
	padding: 0px 10px 0px 10px;
}

.tableTitle{
	background: #f60;
	color:white;
	padding-top: 18px;
}

.tableData{
	border-bottom: 1px solid #777;
	border-left: 1px solid #777;
	border-right: 1px solid #777;
}

.detailTitle{
	background-color: #f60;
	color: white!important;
	padding: 10px;
}

.detailRow{
	padding-left: 9px;
	padding-right: 9px;
	border-bottom: 1px solid #777;
	border-left: 1px solid #777;
	border-right: 1px solid #777;
}

.detailCopy{
	 font-style: italic;
}

.interiorCell{
	border-left: 1px solid #777;
	padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 5px;
}

.firstCell{
	padding: 9px;
}

.orderStatus{
	position: relative;
	font-family: Arial;
	border: 1px solid #fff;
}

.orderTitle{
	padding-left: 15px;
}

.interiorTitle{
	padding-left: 12px;
}

.orderSubTotal{
	padding-left: 10px;
}

.infoSubTitle{
	font-size: 16px;
	font-family:'Open Sans';
	color: #777;
}

.infoTitle{
	font-weight: bold;
	font-size: 24px;
	font-family:'Open Sans';
}

.manageDocsTitle{
	padding-left: 25px;
}

.templeButton{
	background-color: #cbcbcb!important;
	color:white;
}

.dataTables_wrapper .dataTables_filter {
	margin-bottom: 20px;
}

.panel-default>.panel-heading{
	color: #333;
    background-color: #f5f5f5;
    border-color: #ddd;
}

.panel-heading {
	padding: 10px 15px;
    border-bottom: 1px solid transparent;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px;
	font-family: Raleway!important;
}

.panel {
	margin-bottom: 20px;
    background-color: #fff;
    border: 1px solid transparent;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.05);
    box-shadow: 0 1px 1px rgba(0,0,0,0.05);
}

.panel-default{
	border-color: #ddd;
}

.panel-body > .row{
	margin: 20px 0px 20px 20px!important;
}

.shipButton{
	padding: 1px 5px;
	font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
	background: #f60;
    color: white;
    border-style: none;
}

.contactsInfo{
	display: none;
}

.contactsInfo .pure-u-1{
	margin-bottom: 10px; 
}

.ownersRow .pure-u-1{
	margin-bottom: 10px; 
}

.approval{
	font-weight:bold;
	background: yellow;
    font-size: 9px;
}

.formInput{
	width: 340px;
}

.style_thumbs img {
		width: 100% !important
}

.style_thumbs {
	margin-bottom: 40px !important; 
	text-align:center !important;
}

.stylename{
	font-weight: 600!important;
    font-size: 18px!important;
}

.stylename, .stylenumber{
	clear:both;
	font-weight: 300;
    font-size: 12px;
	text-align: center;
	width: 85%;
}

.prod-details {
	padding:0px 0px 0px 10%;
	font-weight: 300;
	color:#777;
}

.detailTitle{
	color: #f60;
}

h2.detailSubTitle{
	color: #919396;
}

h2.detailInfoTitle{
	color: #f60;
    border-bottom: 1px solid #d2d2d2;
    min-height: 30px;
    font-weight: 200;
}

.detailInfoLabel{
	font-weight: 600;
}

div.dimtable {
    display: table;
    width: 100%;
}

div.dimtable > div {
    display: table-row;
    width: 100%;
}
div.dimtable > div > span:first-child {
    width:40%;
}

div.dimtable > div > span {
    display: table-cell;
    padding: .15em 0 .15em 0;
}

.detail_prodname {
	margin-left:-2px;
	font-size: 40px;
    font-weight: 300;
    color: #f60;
}

.detail_prodnumber {
	margin-left:-2px;
	font-size:20px;
	color:#999;
	font-weight: 300;
}

.dealerSearch{
	margin-top:175px;
	padding:4%;
	padding-bottom:0px;
	margin-bottom:-170px; 
	float:right;
}

.manageUtils{
	float:right; 
	margin-bottom: 20px;
}

.text-center {
	text-align: center;
}

.text-center .pure-img{
	display: inline-block !important;
}

.contact-us {
	margin-top: -40px;
}

/********************
Employee Styles
*********************/

.employeeNavContainer {
	border-bottom: #f60 5px solid;
}

.employeeTab, .employeeTabOn {
	color: #f60;
	padding: 20px 10px;
}

.employeeTabOn {
	color: #fff !important;
	background-color: #f60 !important;
}

.employeeContent {
	display: none;
	padding: 0;
}

.employeeMessage {
	position: relative;
	border: #ddd 2px solid;
	margin: 20px 0px;
}

.employeeMessageDate {
	position: absolute;
	top: 0;
	right: 0;
	padding: 20px;
}

.employeeMessageContent {
	padding: 60px 40px 40px 40px;
}

.employeeLogin {
	display: none;
	position: absolute;
	height: 100%;
	width: 100%;
	z-index: 10;
	background-color: rgba(0, 0, 0, 0.5);
}

.employeeLoginBox {
	position: absolute;
	top: 35%;
	left: 50%;
	margin: -150px 0 0 -150px;
	padding: 50px;
	background-color: #fff;
	width: 300px;
	height: 200px;
}

.employeeLoginClose {
	position: absolute;
	top: 0;
	right: 0;
	margin: -15px -15px 0px 0px;
	background: #333;
	width: 30px;
	height: 30px;
	text-align: center;
	color: #fff;
	font-size: 36px !important;
	line-height: 24px;
	font-weight: bold !important;
}

#employeeLoginForm {
	margin: 30px 0;
}

.employeeLoginAlert {
	color: #f60;
}