fieldset.group {
	border-left: 1px solid #333;
	padding-left: 20px
}

.postbox {
	h3.hndle {
		padding: 7px;
		font-size: 15px;
	}
	.row {
		width: 100%;
		display: inline-block;
		padding: 5px 0;
		.field {
			width: 100%;
			display: inline-block;
			padding: 5px 0
		}
		.group {
			border: 1px solid rgba(203, 203, 203, 0.2);
			background-color: rgba(203, 203, 203, 0.2);
			padding-left: 15px;
			margin-left: 5px
		}
	}
	.uninstall_area {
		margin-top: 15px
	}
}

#whizzy_form {
	label {
		vertical-align: middle;
		font-size: 15px;
		font-weight: bold;
	}
	.field-desc {
		padding-bottom: 10px
	}
	input[type=radio],
	input[type=checkbox]{
		margin-top: 0;
	}
	.switch{
		width: 100%;
		padding-left: 0;
	}

	.field-wrap{
		border-bottom: 2px solid #f5f5f5;
		padding: 15px 10px;
		.group{
			label,
			span{
				width: 100%;
				display: block;
			}
			label{
				margin-bottom: 10px;
			}
			.switch label{
				display: inline-block;
				width: 80%;
				margin-bottom: 0;
			}
			span{
				display: inline-block;
				margin-top: 10px;
				color: #888;
				font-style: italic;
				font-size: 12px;
			}
		}
		.field{
			border-bottom: 2px solid #f5f5f5;
			padding: 15px 10px 15px 0;
			&:first-child{
				padding-top: 0;
			}
			&:last-of-type{
				border-bottom: none;
				padding-bottom: 0;
			}
		}

		&:last-child{
			border-bottom: none;
		}
		&:last-child .field .field{
			border-bottom: none;
		}
	}

	.select{
		padding: 7px;
		width: 100%;
		label{
			display: block;
			width: 100%;
			&#zip_archive_generation{
				margin-bottom: 10px;
			}
		}
	}

	.field-desc{
		font-size: 15px;
		font-weight: bold;
	}
}

.wrap-whizzy {
	text-align: center;
	background-color: #fff;
	margin: 30px 15px;
	padding-top: 15px;

	h2{
		text-align: center;
		margin: 30px auto 10px;
		width: 900px;
		padding-bottom: 40px;
		border-bottom: 1px solid #E0E0E4;
	}

	.dashicons-before{
		color: #ccc;
	}

	.tr{
		display: table-row;
		transition: all 350ms ease;
		&:not(:first-child){
			font-weight: bold;
		}
		&:first-child {
			text-transform: uppercase;
			background-color: #F8F8F8;
			.td {
				padding-top: 10px;
				padding-bottom: 10px;
				border-top: none;
			}
		}
		&:hover{
			background-color: #F8F8F8;
		}
	}

	.td{
		display: table-cell;
		padding: 10px;
		vertical-align: middle;
		border-top: 1px solid #E0E0E4;
		&:first-child{
			width: 90px;
		}
		&:nth-child(2){
			width: 360px;
		}
		&:last-child{
			width: 170px;
		}
		&:nth-child(3){
			width: 170px;
		}
		img{
			max-width: 100%;
			max-height: 50px;
			display: block;
		}
	}

	.table{
		display: table;
		padding: 15px;
		border-collapse: collapse;
		width: 900px;
		max-width: 100%;
		margin: auto;
		table-layout: fixed;
		background-color: #fff;
		text-align: left;
	}
}

.table-pix-wrap{
	background-color: #fff;
	padding: 15px;
	display: inline-block;
}


#whizzy {
	.tabs-item {
		display: none;
		min-height: 300px;
		padding: 15px;
		&.active {
			display: block;
		}
		.dashicons-before{
			color: #ccc;
			margin-right: 0;
		}
	}
	.inside{
		padding: 0;
		margin-top: 0;
	}
	.tabs{
		display: table;
		width: 100%;
		table-layout: fixed;
		background-color: #fff;
		margin-bottom: 30px;
	}
	.tabs-header {
		display: table-cell;
		width: 250px;
		vertical-align: top;
		box-shadow: 4px 0 25px 0 #eee;
		a{
			font-size: 15px;
			font-weight: bold;
			color: #666;
			border-bottom: 1px solid #eee;
			padding: 20px 15px 20px 30px;
			display: block;
			transition: all 350ms ease;
			text-decoration: none;
		}
		li{
			margin-bottom: 0;
			&.active a{
				background-color: #f5f5f5;
				color: #1b1b1b;
			}
			a:hover{
				background-color: #f5f5f5;
			}
		}
		ul{
			margin: 0;
			min-height: 240px;
		}
	}
	table{
		width: 100%;
	}
	.dashicons-before{
		display: inline-block;
		margin-right: 15px;
	}
	.tabs-content{
		margin-left: 250px;
		display: table-cell;
		.tabs-item{
			&:nth-child(2){
				table{
					text-align: left;
					border-collapse: collapse;
					th,
					td{
						font-size: 15px;
						background-color: #fff;
						padding: 20px 10px;
					}
					td{
						padding-bottom: 10px;
						input{
							margin: 0;
						}
					}
					tr{
						border-bottom: 2px solid #f5f5f5;
						padding: 10px;
						background-color: #f5f5f5;
						vertical-align: sub;
					}
					th{
						padding-bottom: 7px;
						color: #666;
						min-width: 160px!important;
					}
					select{
						height: 35px;
					}
					select,
					input{
						padding: 7px;
					}
				}
			}
			&:nth-child(3) {
				img{
					max-width: 100%;
					max-height: 50px;
				}
				td{
					border-top: 2px solid #f5f5f5;
					font-size: 14px;
					&:nth-child(3),
					&:nth-child(4){
						width: 130px;
					}
					&:first-child{
						width: 90px;
						padding: 15px 10px;
					}
				}
				tr:first-child {
					background-color: #f5f5f5;
					td{
						font-size: 15px;
						font-weight: bold;
					}
				}
				table{
					width: 100%;
					border-collapse: collapse;
					word-wrap:break-word;
					table-layout: fixed;
				}
			}
		}
	}
}

