/**
 * FORM STYLE
 *
 * 1. OVERRIDE
 * 2. ELEMENT
 * 3. PLUGIN
 *
 * @author Inspektorat <inspektorat@kepriprov.go.id>
 *
 */

/* 1. OVERRIDE */
button,input,select,textarea{font-family:'Montserrat',Helvetica,Arial,sans-serif;font-size:13px;outline:0;}
input,select,textarea{transition:all 300ms ease;-o-transition:all 300ms ease;-ms-transition:all 300ms ease;-moz-transition:all 300ms ease;-webkit-transition:all 300ms ease}
input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance: none;margin: 0}
input[type=number]{-moz-appearance:textfield}
*:focus,*:active{outline:none;outline:0}
*::-moz-focus-inner{border: 0}

input[type="text"],
input[type="password"],
input[type="email"],
input[type="number"],
input[type="file"],
input:not([type="submit"]),
input:not([type="button"]) {
	box-sizing: border-box;
	outline: none;
	height: 35px;
	padding: 5px 10px;
}
input[type="checkbox"],
input[type="radio"] {
	height: auto;
	padding: 0;
	vertical-align: middle;
}

/* 2. ELEMENT */
.form .form-row{margin-bottom:10px}
.form .form-row>label{display:block;margin-bottom:5px;font-size:10px;font-weight:600}
.form .form-item{width:100%;box-sizing:border-box;outline:0;height:35px;padding:5px 10px;border-radius:3px;border:1px solid #DDD;background:#F5F5F5;color:#222}
.form .form-item:focus{border:1px solid #0F3E8B;background:#FFF}
.form-row.error .form-item{border:1px solid #D11!important}
.form-row.info .form-item{border:1px solid #00AEEF!important}
.form-row.warning .form-item{border:1px solid #F7941D!important}
.form-row.success .form-item{border:1px solid #39B54A!important}
.form .form-item-text{height:35px;line-height:35px;box-sizing:border-box;word-wrap:break-word;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}
.form .form-row.error>label{color:#D11!important}
.form .form-row.info>label{color:#00AEEF!important}
.form .form-row.warning>label{color:#F7941D!important}
.form .form-row.success>label{color:#39B54A!important}
.form-item-attribute{position:relative;box-sizing:border-box}
.form-item-attribute.attr-left .form-item{padding-left:45px}
.form-item-attribute.attr-right .form-item{padding-right:45px}
.form-item-attribute .form-attribute{position:absolute;top:0;height:35px;line-height:35px;text-align:center;box-sizing:border-box}
.form-item-attribute.attr-left .form-attribute{left:0}
.form-item-attribute.attr-right .form-attribute{right:0}
.form-item-attribute.attr-icon .form-attribute{margin:1px;width:35px;height:33px;line-height:33px}
.form-item-attribute.attr-button,.form-item-attribute.attr-toggle{position:relative;display:table;border-collapse:separate}
.form-item-attribute.attr-button .form-attribute,.form-item-attribute.attr-button .form-item,.form-item-attribute.attr-toggle .form-attribute,.form-item-attribute.attr-toggle .form-item{display:table-cell}
.form-item-attribute.attr-button .form-attribute,.form-item-attribute.attr-toggle .form-attribute{position:relative;width:1%;white-space:nowrap;font-size:0;vertical-align:middle}
.form-item-attribute.attr-button .form-attribute button,.form-item-attribute.attr-toggle .form-attribute button{display:inline-block;max-width:100%;height:35px;line-height:32px;padding:0 15px;text-align:center;font-size:12px;font-weight:400;cursor:pointer;background:#666;border:none;color:#FFF;box-sizing:border-box;word-wrap:break-word;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;text-decoration:none!important}
.form-item-attribute.attr-button .form-attribute button.error,.form-item-attribute.attr-toggle .form-attribute button.error{background:#D11}
.form-item-attribute.attr-button .form-attribute button.info,.form-item-attribute.attr-toggle .form-attribute button.info{background:#00AEEF}
.form-item-attribute.attr-button .form-attribute button.warning,.form-item-attribute.attr-toggle .form-attribute button.warning{background:#F7941D}
.form-item-attribute.attr-button .form-attribute button.success,.form-item-attribute.attr-toggle .form-attribute button.success{background:#39B54A}
.form-item-attribute.attr-button .form-attribute button.gray,.form-item-attribute.attr-toggle .form-attribute button.gray{background:#999}
.form-item-attribute.attr-button .form-attribute button.black,.form-item-attribute.attr-toggle .form-attribute button.black{background:#000}
.form-item-attribute.attr-button .form-attribute button.white,.form-item-attribute.attr-toggle .form-attribute button.white{background:#F5F5F5;color:#333}
.form-item-attribute.attr-button .form-attribute button.primary,.form-item-attribute.attr-toggle .form-attribute button.primary{background:#0F3E8B}
.form-item-attribute .attr-toggle-wrapper{display:none;position:absolute;z-index:2;top:35px;background:#EEE;text-align:left;font-size:12px}
.attr-toggle-wrapper li{line-height:normal}
.attr-toggle-wrapper li.divider{background:#CCC;height:1px;margin:10px 0;overflow:hidden}
.attr-toggle-wrapper li>a{display:block;padding:5px 15px;box-sizing:border-box;color:#0F3E8B;text-decoration:none}
.attr-toggle-wrapper li>a:hover{color:#FFF;background:#0F3E8B;text-decoration:none}
.form .form-item-group{margin-top:5px}
.form .form-item-group li{display:inline-block;line-height:30px;margin-right:10px}
.form .form-item-group label{padding-left:5px;cursor:pointer}
.form .form-item-group.slider{margin-top:10px;height:35px}
.form .form-item-group.slider .item-slider-text{position:relative;display:table;width:100%;margin-top:10px}
.item-slider-text>span{display:table-cell;position:relative;width:33.33%;white-space:nowrap;font-size:12px;vertical-align:middle}
.item-slider-text .min{text-align:left}
.item-slider-text .value{text-align:center}
.item-slider-text .max{text-align:right}
.form .form-item.no-block{width:auto;min-width:150px}
.form textarea.form-item{min-height:60px}
.form .form-notes{margin-top:5px;font-size:10px;color:#666}

	@media (min-width: 900px) {
		.form .form-row.line:after{content:"";display:table;clear:both}
		.form .form-row.line>label{float:left;width:150px;padding-top:7px;margin-right:20px}
		.form .form-row.line>.form-item,.form .form-row.line>.form-item-attribute,.form .form-row.line>.form-item-group,.form .form-row.line>.row-wrapper{float:left;width:200px;width:-webkit-calc(100% - 170px);width:-moz-calc(100% - 170px);width:calc(100% - 170px)}
		.form .form-row.line>.form-notes:before{content:"";display:table;clear:both}
		.form .form-row.line>.form-notes{display:inline-block;width:100%}
	}

/* 3. PLUGIN */
/* SELECT2 */
.select2-dropdown{background-color:#EEE!important;border:1px solid #DDD!important}
.select2-close-mask{background-color:#EEE!important}
.select2-results__message{color:#666!important}
.select2-container .select2-selection--single{height:35px!important}
.select2-container--default .select2-selection--single, .select2-container--default .select2-selection--multiple{border-radius:3px;background-color:#F5F5F5!important;border:1px solid #EEE!important}
.select2-container--default .select2-selection--single .select2-selection__rendered{line-height:35px!important}
.select2-container--default .select2-selection--multiple .select2-selection__rendered{padding:0 10px!important}
.select2-container--default .select2-selection--single .select2-selection__arrow{top:0!important;height:35px!important}
.select2-container--default.select2-container--focus .select2-selection--multiple{background:#FFF;border:1px solid #0F3E8B!important}
.select2-container--default .select2-selection--multiple .select2-selection__choice{border:none!important;border-radius:3px;font-size:.9em;height:20px!important;line-height:20px!important}
.select2-container--default .select2-search--inline .select2-search__field{margin-top:0!important;height:30px!important}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove{margin-right:5px!important;font-size:14px!important;vertical-align:middle;color:#D11!important}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover{color:#F11!important}
.select2-container--default .select2-results__option--highlighted[aria-selected]{background-color:#0F3E8B!important}
.select2-container--default .select2-selection--multiple .select2-selection__choice,.select2-container--default.select2-container--disabled .select2-selection--multiple,.select2-container--default.select2-container--disabled .select2-selection--single{background-color:#DDD!important;border:1px solid #DDD!important}.select2-container--default .select2-selection--multiple .select2-selection__choice{border:1px solid #DDD!important}.select2-container--default .select2-search--inline .select2-search__field{color:#333!important}.select2-container--default .select2-search--dropdown .select2-search__field{background-color:#EEE!important;border:1px solid #EEE!important;color:#333!important}.select2-container--default .select2-selection--single .select2-selection__rendered{color:#333!important},.select2-container--default .select2-selection--single .select2-selection__placeholder,.select2-container--default .select2-selection--multiple .select2-selection__placeholder{color:#CCC!important},.select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__rendered,.select2-container--default.select2-container--disabled .select2-selection--multiple .select2-selection__rendered{color:#BBB!important}.select2-container--default .select2-results__option[aria-selected=true]{background-color:#CCC!important}.select2-container--default .select2-results__option[aria-disabled=true]{color:#666!important}
.select2-container .select2-results__option img {width:20px;height:20px;object-fit:cover;margin-right:5px}
.select2-container .select2-selection__rendered img {width:20px;height:20px;object-fit:cover;margin-right:5px}

/* JQUERY-UI */
.ui-widget,.ui-widget button,.ui-widget input,.ui-widget select,.ui-widget textarea{font-family:Montserrat,Helvetica,Arial,sans-serif!important}
.ui-button,.ui-slider-handle{cursor:pointer!important}
.ui-slider.ui-widget-content,.ui-spinner.ui-widget-content{height:4px!important;border-radius:2px!important;background:#DDD!important;border:none!important}
.ui-button,.ui-state-default,.ui-widget-content .ui-state-default,.ui-widget-header .ui-state-default,html .ui-button.ui-state-disabled:active,html .ui-button.ui-state-disabled:hover{background:#333!important;border:1px solid #333!important;color:#FFF!important}
.ui-button:focus,.ui-button:hover,.ui-state-default.ui-state-active,.ui-state-focus,.ui-state-hover,.ui-widget-content .ui-state-focus,.ui-widget-content .ui-state-hover,.ui-widget-header .ui-state-focus,.ui-widget-header .ui-state-hover{background:#0F3E8B!important;border:2px solid #0F3E8B!important;color:#FFF!important}
.ui-datepicker-next,.ui-datepicker-prev{transition:none;-o-transition:none;-ms-transition:none;-moz-transition:none;-webkit-transition:none}
.ui-datepicker-next.ui-state-hover,.ui-datepicker-prev.ui-state-hover{top:2px!important}
.ui-datepicker-prev.ui-state-hover{left:2px!important}
.ui-datepicker-next.ui-state-hover{right:2px!important}
.ui-slider .ui-slider-range{background:#0F3E8B!important;border-color:#0F3E8B!important}
.ui-spinner-input{margin:0!important}
.ui-timepicker-table td a{width:auto!important}

.ui-slider .ui-slider-handle{background:#222!important;border:1px solid #222!important}
.ui-spinner a.ui-spinner-button{background:#EEE!important;border:1px solid #EEE!important}
.ui-button,.ui-state-default,.ui-widget-content .ui-state-default,.ui-widget-header .ui-state-default,html .ui-button.ui-state-disabled:active,html .ui-button.ui-state-disabled:hover{background:#EEE!important;border:1px solid #EEE!important;color:#222!important}
.ui-slider-horizontal .ui-slider-handle{top:-5px!important;height:15px!important;width:15px!important;border-radius:50%;background:#FFF!important;border:2px solid #0F3E8B!important;}
.ui-slider .ui-slider-handle.ui-state-active,.ui-slider .ui-slider-handle.ui-state-focus,.ui-slider .ui-slider-handle.ui-state-hover{background:#0F3E8B!important;}

	/* BUTTON */
.button{display:inline-block;vertical-align:middle;max-width:100%;height:35px;line-height:33px;padding:0 25px;text-align:center;font-size:12px;font-weight:400;cursor:pointer;background:#666;border:none;border-radius:3px;color:#FFF;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;text-decoration:none!important;-moz-box-shadow:inset 0 -2px 0 rgba(0,0,0,.2);-webkit-box-shadow:inset 0 -2px 0 rgba(0,0,0,.2);box-shadow:inset 0 -2px 0 rgba(0,0,0,.2);transition:all 150ms ease;-o-transition:all 150ms ease;-ms-transition:all 150ms ease;-moz-transition:all 150ms ease;-webkit-transition:all 150ms ease}
.button:hover{text-decoration:none!important;-moz-box-shadow:inset 0 -50px 0 rgba(0,0,0,.3);-webkit-box-shadow:inset 0 -50px 0 rgba(0,0,0,.3);box-shadow:inset 0 -50px 0 rgba(0,0,0,.3)}
.button.xsmall{height:20px;line-height:18px;padding:0 15px;border-radius:3px;font-size:8px}
.button.small{height:25px;line-height:23px;padding:0 20px;border-radius:3px;font-size:10px}
.button.large{height:40px;line-height:38px;padding:0 30px;border-radius:3px;font-size:16px}
.button.xlarge{height:50px;line-height:48px;padding:0 35px;border-radius:3px;font-size:18px}
.button.error{background:#D11;border-color:#D11!important}
.button.outline.error{-moz-box-shadow:inset 0 -1px 0 #D11;-webkit-box-shadow:inset 0 -1px 0 #D11;box-shadow:inset 0 -1px 0 #D11}
.button.outline.error:hover{-moz-box-shadow:inset 0 -50px 0 #D11;-webkit-box-shadow:inset 0 -50px 0 #D11;box-shadow:inset 0 -50px 0 #D11}
.button.info{background:#00AEEF;border-color:#00AEEF!important}
.button.outline.info{-moz-box-shadow:inset 0 -1px 0 #00AEEF;-webkit-box-shadow:inset 0 -1px 0 #00AEEF;box-shadow:inset 0 -1px 0 #00AEEF}
.button.outline.info:hover{-moz-box-shadow:inset 0 -50px 0 #00AEEF;-webkit-box-shadow:inset 0 -50px 0 #00AEEF;box-shadow:inset 0 -50px 0 #00AEEF}
.button.success{background:#39B54A;border-color:#39B54A!important}
.button.outline.success{-moz-box-shadow:inset 0 -1px 0 #39B54A;-webkit-box-shadow:inset 0 -1px 0 #39B54A;box-shadow:inset 0 -1px 0 #39B54A}
.button.outline.success:hover{-moz-box-shadow:inset 0 -50px 0 #39B54A;-webkit-box-shadow:inset 0 -50px 0 #39B54A;box-shadow:inset 0 -50px 0 #39B54A}
.button.warning{background:#F7941D;border-color:#F7941D!important}
.button.outline.warning{-moz-box-shadow:inset 0 -1px 0 #F7941D;-webkit-box-shadow:inset 0 -1px 0 #F7941D;box-shadow:inset 0 -1px 0 #F7941D}
.button.outline.warning:hover{-moz-box-shadow:inset 0 -50px 0 #F7941D;-webkit-box-shadow:inset 0 -50px 0 #F7941D;box-shadow:inset 0 -50px 0 #F7941D}
.button.gray{background:#999;border-color:#999!important}
.button.outline.gray{-moz-box-shadow:inset 0 -1px 0 #999;-webkit-box-shadow:inset 0 -1px 0 #999;box-shadow:inset 0 -1px 0 #999}
.button.outline.gray:hover{-moz-box-shadow:inset 0 -50px 0 #999;-webkit-box-shadow:inset 0 -50px 0 #999;box-shadow:inset 0 -50px 0 #999}
.button.black{background:#000;border-color:#000!important;-moz-box-shadow:inset 0 -2px 0 rgba(255,255,255,.1);-webkit-box-shadow:inset 0 -2px 0 rgba(255,255,255,.1);box-shadow:inset 0 -2px 0 rgba(255,255,255,.1)}
.button.black:hover{-moz-box-shadow:inset 0 -50px 0 rgba(255,255,255,.2);-webkit-box-shadow:inset 0 -50px 0 rgba(255,255,255,.2);box-shadow:inset 0 -50px 0 rgba(255,255,255,.2)}
.button.outline.black{-moz-box-shadow:inset 0 -1px 0 #000;-webkit-box-shadow:inset 0 -1px 0 #000;box-shadow:inset 0 -1px 0 #000}
.button.outline.black:hover{-moz-box-shadow:inset 0 -50px 0 #000;-webkit-box-shadow:inset 0 -50px 0 #000;box-shadow:inset 0 -50px 0 #000}
.button.white{background:#F5F5F5;border-color:#F5F5F5!important;color:#333;-moz-box-shadow:inset 0 -2px 0 rgba(0,0,0,.1);-webkit-box-shadow:inset 0 -2px 0 rgba(0,0,0,.1);box-shadow:inset 0 -2px 0 rgba(0,0,0,.1)}
.button.white:hover{-moz-box-shadow:inset 0 -50px 0 rgba(0,0,0,.2);-webkit-box-shadow:inset 0 -50px 0 rgba(0,0,0,.2);box-shadow:inset 0 -50px 0 rgba(0,0,0,.2)}
.button.outline.white{-moz-box-shadow:inset 0 -1px 0 #F5F5F5;-webkit-box-shadow:inset 0 -1px 0 #F5F5F5;box-shadow:inset 0 -1px 0 #F5F5F5}
.button.outline.white:hover{-moz-box-shadow:inset 0 -50px 0 #F5F5F5;-webkit-box-shadow:inset 0 -50px 0 #F5F5F5;box-shadow:inset 0 -50px 0 #F5F5F5;color:#333!important}
.button.primary{background:#19abdc;border-color:#0F3E8B!important}
.button.outline.primary{-moz-box-shadow:inset 0 -2px 0 #0F3E8B;-webkit-box-shadow:inset 0 -2px 0 #0F3E8B;box-shadow:inset 0 -2px 0 #0F3E8B}
.button.outline.primary:hover{-moz-box-shadow:inset 0 -50px 0 #0F3E8B;-webkit-box-shadow:inset 0 -50px 0 #0F3E8B;box-shadow:inset 0 -50px 0 #0F3E8B}
.button.outline{background:0 0!important;border:1px solid;border-color:#666;color:#666;-moz-box-shadow:inset 0 -1px 0 #666;-webkit-box-shadow:inset 0 -1px 0 #666;box-shadow:inset 0 -1px 0 #666}
.button.outline:hover{color:#FFF!important;-moz-box-shadow:inset 0 -50px 0 #666;-webkit-box-shadow:inset 0 -50px 0 #666;box-shadow:inset 0 -50px 0 #666}
.button.outline:hover>i{color:#FFF!important}
.button.block{display:block;width:100%}
.button>i{display:inline-block;height:100%;line-height:33px;margin-right:5px}
.button>i.right{margin-right:0;margin-left:5px}
.button.xsmall>i{line-height:18px}
.button.small>i{line-height:23px}
.button.large>i{line-height:38px}
.button.xlarge>i{line-height:48px}
.button.icon-only>i{margin-right:0}

/* Smartphones */
@media (min-width: 300px) { }

/* landscape phones */
@media (min-width: 450px) { }

/* Tablets */
@media (min-width: 600px) { }

/* Bigger tablets */
@media (min-width: 750px) { }

/* Desktop screen or landscape tablet */
@media (min-width: 900px) { }

/* Bigger desktop */
@media (min-width: 1100px) { }

/* Widescreens */
@media (min-width: 1500px) { }