/* NEXT UX3.0 | DATE PICKER MOBILE .CSS
// Version     -  1.2 
// Updated On  -  05 FEB 2018
// ----------------------------------------*/

.dtpicker-overlay { z-index: 2000; display: none; min-width: 300px; background: rgba(0, 0, 0, 0.2); font-size: 12px; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.dtpicker-mobile { position: fixed; top: 0; left: 0; width: 100%; height: 100%; }
.dtpicker-overlay * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -ms-box-sizing: border-box; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
.dtpicker-bg { width: 100%; height: 100%; font-family: Arial; }
.dtpicker-cont { border: 1px solid #ECF0F1; }
.dtpicker-mobile .dtpicker-cont { position: relative; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); border: none; }
.dtpicker-content { margin: 0px auto; padding: 0; max-width: 300px; background: #004b98; }
.dtpicker-subcontent { position: relative; }
.dtpicker-header { margin: 0; }
.dtpicker-header .dtpicker-title { color: #fff; text-align: center; font-size: 2em; padding: 10px 0; border-bottom: 1px solid #00afff; }
.dtpicker-header .dtpicker-close { position: absolute; top: -0.7em; right: 0.3em; padding: 0.5em 0.5em 1em 1em; color: #FF3B30; font-size: 1.5em; cursor: pointer; display: none; }
.dtpicker-header .dtpicker-close:hover { color: #FF3B30; }
.dtpicker-header .dtpicker-value { padding: 0.8em 0.2em 0.2em 0.2em; color: #FF3B30; text-align: center; font-size: 1.4em; display: none; }
.dtpicker-components { overflow: hidden; margin: 1em 1em; font-size: 1.3em; }
.dtpicker-components * { margin: 0; padding: 0; }
.dtpicker-components .dtpicker-compOutline { display: inline-block; float: left; }
.dtpicker-comp2 { width: 50%; }
.dtpicker-comp3 { width: 33.3%; }
.dtpicker-comp4 { width: 25%; }
.dtpicker-comp5 { width: 20%; }
.dtpicker-comp6 { width: 16.66%; }
.dtpicker-comp7 { width: 14.285%; }
.dtpicker-components .dtpicker-comp { text-align: center; }
.dtpicker-components .dtpicker-comp > * { display: block; height: 30px; color: #666666; text-align: center; line-height: 30px; }
.dtpicker-components .dtpicker-comp > *:hover { color: #00afff; }
.dtpicker-components .dtpicker-compButtonEnable { opacity: 1; }
.dtpicker-components .dtpicker-compButtonDisable { opacity: 0.5; }
.dtpicker-components .dtpicker-compButton { background: transparent; font-size: 120%; cursor: pointer; color: #fff }
.dtpicker-components .dtpicker-compValue { margin: 10px auto; width: 80%; border: none; background: transparent; font-size: 100%; -webkit-appearance: none; -moz-appearance: none; color: #fff; border-top: 1px solid #00afff; border-bottom: 1px solid #00afff; padding: 0; }
.dtpicker-overlay .dtpicker-compValue:focus { outline: none; background: #014081; }
.dtpicker-buttonCont { overflow: hidden; margin: 0; border-top: 1px solid #00afff; }
.dtpicker-buttonCont .dtpicker-button { display: block; padding: 0.6em 0; width: 50%; background: transparent; color: #FFFFFF; text-align: center; font-size: 1.3em; cursor: pointer; }
.dtpicker-buttonCont .dtpicker-button:hover { color: #FFFFFF; background: #014081; }
.dtpicker-singleButton .dtpicker-button { margin: 0.2em auto; }
.dtpicker-twoButtons .dtpicker-buttonSet { float: left; }
.dtpicker-twoButtons .dtpicker-buttonClear { float: right; }
#dtBox .nf-caret-down, #dtBox .nf-caret-up { position: inherit !important; color: #fff !important; width: auto; font-size: 15px; }
#dtBox .nf-caret-up { display: block !important; }