@c-main: #ed8323;
@c-grey: #333; 
@c-white: #FFF;
@c-text: #333;
@c-border: #CCC;
.settings-wrap{
	#option-tree-header{
	 	background: @c-white;
		border: 1px solid @c-border;
		#option-tree-version{
			span{
				color: @c-text !important;
				text-transform: uppercase;
				letter-spacing: 1px;
			}
		}
	}
	
	#option-tree-sub-header{
		padding: 0 !important;
		margin-bottom: 35px;
	}
}
.option-tree-ui-button.button{
	border-radius: 0;
	border: none;
	margin: 0;
	height: 35px !important;
	line-height: 35px !important;
	text-shadow: none;
	box-shadow: none;
	&.button-primary{
		background: @c-main;
		color: @c-white;
		&:hover{
			background: darken( @c-main, 20%);
		}
	}
}
.ui-tabs-nav:not(.ot-theme-option-nav){
	width: 175px !important;
	padding-top: 0 !important;
	li{
		margin-top: 5px !important;
		margin-bottom: 5px !important;
		background: @c-white;
		border: 1px solid @c-border !important;
		border-radius: 0 !important;
		border: none;
		&:nth-child(1){
			margin-top: 0 !important;
		}
		&.ui-state-active{
			background: @c-main;
			color: @c-white;
		}
		a{
			box-shadow: none !important;
			border: none !important;
			padding: 15px 10px !important;
			.fa{
				font-size: 18px;
				margin-right: 10px;
			}
		}
		&.ui-state-active{
			background: @c-main !important;
			border-color: @c-main !important;
			a{
				color: @c-white !important;
				position: relative;
				&:after{
					position: absolute;
					content: '';
					width: 0;
					height: 0;
					border-top: 10px solid transparent;
					border-left: 10px solid #ed8323;
					border-bottom: 11px solid transparent;
					right: -9px;
					top: 50%;
					margin-top: -9px;
				}
			}
		}
	}
}
.ui-tabs{
	background: transparent !important; 
	border: none !important;
	box-shadow: none !important;
	#poststuff{
		padding-top: 0 !important;
	}
	.postbox{
		padding: 0 !important;
		margin-right: 0 !important;
		background: transparent !important;
	}
}
.format-settings{
	width: auto !important;
	padding: 20px !important;
	background: #FFF !important;
	border: 1px solid #CCC !important;
	&:not(:nth-child(1)){
		border-top: none !important;
	}
	.format-setting-label{
		border: none;
		margin-bottom: 0;
		.label{
			margin-top: 0 !important;
			font-weight: bold;
			letter-spacing: 1px;
			margin-bottom: 0;
		}
	}
	.format-setting-wrap{
		padding: 0 !important;
	}
	.format-setting{
		width: auto !important;
		.on-off-switch,
		.on-off-switch *,
		.list-list-item,
		.list-list-item *{
			box-sizing: border-box; 
		}
		.description{
			font-style: italic;
			float: none;
			margin-bottom: 20px;
		}
		.ot_upload_media,
		.option-tree-ui-remove-media{
			height: 29px !important;
		}
		.option-tree-ui-remove-media{
			background: @c-border !important;
			box-shadow: none !important;
			&:hover{
				background: darken( @c-border, 15% ) !important; 
			}
		}
		.option-tree-ui-button{
			.icon{
				font-size: 15px;
				margin-top: 7px;
			}
		}
		.ot-icon-plus-circle::before {
		    content: "\f067 ";
		}
		.ot-icon-minus-circle{
			width: 12px !important;
			margin-left: 3px !important;
		}
		.ot-icon-minus-circle::before {
		    content: "\f068 ";
		}
		input[type="text"]{
			border-radius: 0;
			box-shadow: none !important;
		}
		.option-tree-ui-media-wrap{
			&:after{
				content: '';
				display: table;
				clear: both;
			}
			.option-tree-ui-image-wrap{
				img{
					border-radius: 0;
					max-width: 150px;
					height: auto;;
				}
			}
		}
		.on-off-switch{
			border-radius: 0 !important;
			box-shadow: none !important;
			.slide-button{
				border-radius: 0 !important;
				border-color: @c-main !important;
				background: @c-main !important;
				box-shadow: none !important;
				height: 27px !important;
			}
			input:last-of-type:checked ~ .slide-button{
				border-color: #535353 !important;
				background: #535251 !important;
			}
		}
		.select-wrapper{
			border-radius: 0 !important;
			box-shadow: none !important;
			border-color: @c-border !important;
		}
		.list-location-wrapper{
			input[type="checkbox"]{
				display: inline-block !important;
			}
		}
		input[type="checkbox"]{
			display: none;
		}
		input[type="checkbox"] + label{
			position: relative;
			padding-left: 10px;
			margin-left: 20px;
			&:after, &:before{
				position: absolute;
			}
			&:after{
				content: '';
				left: -20px;
				top: 0;
				width: 20px;
				height: 20px;
				border: 1px solid @c-border;
				display: block;
				z-index: 1;
			}
			&:before{
				content: '\f00c';
				font: normal normal normal 14px/1 FontAwesome;
				color: @c-main;
				top: 3px;
				left: -16px;
				display: none;
			}
		}
		input[type="checkbox"]:checked + label{
			&:before{
				display: block;
			}
		}
		.option-tree-ui-colorpicker-input-wrap{
			.wp-color-result{
				height: 29px;
				border-radius: 0;
				&:after{
					height: 100%;
				}
			}
		}
		.js-remove-google-font{
			height: 29px !important;
		}
		.ot-css-editor{
			border-radius: 0 !important;
		}
		.option-tree-sortable{
			.option-tree-setting{
				border-radius: 0 !important;
				.open{
					height: 40px !important;
				}
				.button-section{
					a{
						height: 40px !important;
						margin: -1px 0 0 !important; 
						background: transparent !important;
						box-shadow: none !important;
						.icon{
							margin-top: 11px !important;
						}
					}
				}
			}
			.format-settings{
				border: none !important;
				padding-top: 0 !important;
			}
			.option-tree-setting-remove{
				span{
					color: @c-text !important;
				}
			}
		}
	}
}

.ot-metabox-panels{
	border: none !important;
    margin-top: 0 !important;
    padding-top: 0 !important;
    padding-left: 0 !important;
    .format-settings {
	    border-top: 1px solid @c-border !important;
	}
}

.ot-theme-option-tabs.ui-tabs .ot-theme-option-nav.ui-tabs-nav{
	border-bottom: 1px solid @c-main !important;
	height: 39px !important;
	li{
		border-radius: 0 !important;
		margin-left: 0 !important;
		a{
			border-bottom: none !important;
			padding: 10px 20px !important;
			color: @c-text !important;
			box-shadow: none !important;
		}
		&.ui-state-active{
			border-color: @c-main !important;
			a{
			padding: 11px 20px !important;
				color: @c-main !important;
			}
		}
	}
}
.type-numeric-slider{
	.format-setting-inner{
		padding-left: 0 !important;
		border: none !important;
		background: transparent !important;
		.ot-numeric-slider{
			margin-left: 10px !important;
			margin-right: 20px !important;
			height: 3px !important;
			background: #CCC !important;
			border-radius: 0 !important;
			.ui-slider-handle{
				height: 20px !important;
				width: 30px !important;
				background: @c-white;
				border-radius: 0;
				border-color: @c-main;
			}
		}
	}
}
.wp-editor-tabs{
	.wp-switch-editor{
		height: 28px !important;
	}
}
@media(max-width: 1020px){
	.ot-metabox-wrapper{
		.ot-metabox-nav{
			height: auto !important;
			width: 100% !important;
			li[role="tab"]{
				a{
					&.ui-tabs-anchor{
						&:after{
							display: none;
						}
					}
				}
			}
		}
	}
}

@media(max-width: 767px){
	.settings-wrap{
		.ui-tabs-nav:not(.ot-theme-option-nav){
			float: none !important;
			width: 100% !important;
			li{
				display: inline-block !important;
				margin: 3px !important;
				a{
					padding: 5px 10px !important;
				}
				&.ui-state-active{
					a{
						&:after{
							content: '';
							position: static !important;
							width: 0;
							height: 0;
							border: none !important;
						}
					}
				}
			}
		}
	}
	.postbox{
		margin-left: 0 !important;
	}
}