.dpifs-fake-input{
box-sizing: border-box; 
background: #fff;
border: 1px solid #e4e4e4;
height: 42px;
line-height: 42px;
display: block;
width: 100%;  
padding: 0px 12px;
cursor: pointer;
} .dpifs-hide-scrollbar{
overflow-y: hidden;
}
.datepicker-in-fullscreen-modal{
width: 100%;
max-width: 667px;
height: auto;
max-height: 90%;
padding: 0px;
position: fixed;
top: 50%;
left: 50%;
z-index: 99999999; visibility                  : hidden;
-webkit-transform   : translateX(-50%) translateY(-50%);
-moz-transform      : translateX(-50%) translateY(-50%);
-ms-transform       : translateX(-50%) translateY(-50%);
transform           : translateX(-50%) translateY(-50%);
}
.datepicker-in-fullscreen-content{
background: white;
position: relative;
border-radius: 3px;
}
@media only screen and (max-width: 500px) {
.datepicker-in-fullscreen-modal{
top: initial !important;
bottom: 0 !important;
-webkit-transform   : translateX(-50%) translateY(-0%) !important;
-moz-transform      : translateX(-50%) translateY(-0%) !important;
-ms-transform       : translateX(-50%) translateY(-0%) !important;
transform           : translateX(-50%) translateY(-0%) !important;
}
}
.datepicker-in-fullscreen{
padding: 10px;
}
@media only screen and (max-width: 500px) {
.datepicker-in-fullscreen{
padding: 5px;
}    
} .dpifs-inverted-colors .datepicker-in-fullscreen-content{
background: rgba(48, 54, 65, 1) !important;
}
.dpifs-inverted-colors .table-condensed > thead > tr > th.dow {
color: #d4d3d3;
}
.dpifs-inverted-colors .datepicker-in-fullscreen-content,
.dpifs-inverted-colors div.datepicker table tr td.day,
.dpifs-inverted-colors .datepicker-in-fullscreen-controls>a  {
color: #fff;
}
.dpifs-inverted-colors div.datepicker table tr td.old, 
.dpifs-inverted-colors div.datepicker table tr td.new,
.dpifs-inverted-colors .datepicker table tr td.disabled, 
.dpifs-inverted-colors .datepicker table tr td.disabled:hover {
color: #565656;
}
.dpifs-inverted-colors .datepicker table tr td.day:hover, 
.dpifs-inverted-colors .datepicker table tr td.focused,
.dpifs-inverted-colors .datepicker-in-fullscreen-controls>a:hover,
.dpifs-inverted-colors .datepicker .datepicker-switch:hover, 
.dpifs-inverted-colors .datepicker .next:hover, 
.dpifs-inverted-colors .datepicker .prev:hover, 
.dpifs-inverted-colors .datepicker tfoot tr th:hover,
.dpifs-inverted-colors .datepicker table tr td span.focused, 
.dpifs-inverted-colors .datepicker table tr td span:hover {
background: rgba(255, 255, 255, 0.41);
}
.dpifs-inverted-colors .datepicker-in-fullscreen-controls>a,
.dpifs-inverted-colors .datepicker-in-fullscreen-controls>a:first-child{
border-color: #565656;
}
.dpifs-inverted-colors .datepicker table tr td.active.active, 
.dpifs-inverted-colors .datepicker table tr td.active.highlighted.active, 
.dpifs-inverted-colors .datepicker table tr td.active.highlighted:active, 
.dpifs-inverted-colors .datepicker table tr td.active:active, 
.dpifs-inverted-colors .datepicker table tr td span.active.active, 
.dpifs-inverted-colors .datepicker table tr td span.active.disabled.active, 
.dpifs-inverted-colors .datepicker table tr td span.active.disabled:active, 
.dpifs-inverted-colors .datepicker table tr td span.active.disabled:hover.active, 
.dpifs-inverted-colors .datepicker table tr td span.active.disabled:hover:active, 
.dpifs-inverted-colors .datepicker table tr td span.active:active, 
.dpifs-inverted-colors .datepicker table tr td span.active:hover.active, 
.dpifs-inverted-colors .datepicker table tr td span.active:hover:active {
background: #ffffff !important;
color: #303641 !important;
text-shadow: none !important;
}
.dpifs-inverted-colors.datepicker-in-fullscreen-background{
background: rgba(255,255,255, 0.94);
} .datepicker-in-fullscreen-controls{
text-align: center;
box-sizing: border-box;
}
.datepicker-in-fullscreen-controls>a{
display: inline-block;
box-sizing: border-box;
width: 33.33%;
padding: 15px 5px;
color: rgb(51, 51, 51);
text-decoration: none;
font-weight: 600;
border-right: 1px solid #eee;
border-top: 1px solid #eee;
}
.datepicker-in-fullscreen-controls>a:first-child{
border-left: 1px solid #eee;
}
.datepicker-in-fullscreen-controls>a:hover{
background: #eee;
cursor: pointer;
} .datepicker-in-fullscreen-background{
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
z-index: 99999998;
background: rgba(48, 54, 65, 0.94);
visibility: hidden;
opacity: 0;
-webkit-transition  : all 0.3s;
-moz-transition     : all 0.3s;
transition          : all 0.3s;
} .dpifs-show{
visibility: visible;
}
.dpifs-show ~ .datepicker-in-fullscreen-background {
opacity: 1;
visibility: visible;
} div.datepicker table, 
div.datepicker-inline{
width: 100%;
font-size: 20px;
}
.table-condensed > thead > tr > th.dow{
color: #999999;
}
.table-condensed > thead > tr > th{
font-weight: normal !important;
}
.table-condensed > thead > tr > th, 
.table-condensed > tbody > tr > th, 
.table-condensed > tfoot > tr > th, 
.table-condensed > thead > tr > td, 
.table-condensed > tbody > tr > td, 
.table-condensed > tfoot > tr > td {
padding: 10px;
}
div.datepicker table tr td.day{
color: #303641;
}
.datepicker table tr td.disabled, .datepicker table tr td.disabled:hover {
cursor:not-allowed;
color: #dddddd !important;
}
div.datepicker table tr td.old, 
div.datepicker table tr td.new {
color: #dddddd;
}
div.datepicker table tr td.active{
color: #fff;
}
.datepicker table tr td.active.active, .datepicker table tr td.active.highlighted.active, .datepicker table tr td.active.highlighted:active, .datepicker table tr td.active:active,
.datepicker table tr td span.active.active, .datepicker table tr td span.active.disabled.active, .datepicker table tr td span.active.disabled:active, .datepicker table tr td span.active.disabled:hover.active, .datepicker table tr td span.active.disabled:hover:active, .datepicker table tr td span.active:active, .datepicker table tr td span.active:hover.active, .datepicker table tr td span.active:hover:active {
background: #303641 !important;
color: #fff;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}  .dpifs-effect-0 .datepicker-in-fullscreen-content{
opacity: 0;
-webkit-transition: opacity 0.3s;
-moz-transition: opacity 0.3s;
transition: opacity 0.3s;
}
.dpifs-show.dpifs-effect-0 .datepicker-in-fullscreen-content{
opacity: 1;
} .dpifs-effect-1 .datepicker-in-fullscreen-content{
-webkit-transform: scale(0.7);
-moz-transform: scale(0.7);
-ms-transform: scale(0.7);
transform: scale(0.7);
opacity: 0;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
.dpifs-show.dpifs-effect-1 .datepicker-in-fullscreen-content{
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
opacity: 1;
} .dpifs-effect-2 .datepicker-in-fullscreen-content {
-webkit-transform: translateX(20%);
-moz-transform: translateX(20%);
-ms-transform: translateX(20%);
transform: translateX(20%);
opacity: 0;
-webkit-transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9);
-moz-transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9);
transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9);
}
.dpifs-show.dpifs-effect-2 .datepicker-in-fullscreen-content {
-webkit-transform: translateX(0);
-moz-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
opacity: 1;
} .dpifs-effect-3 .datepicker-in-fullscreen-content {
-webkit-transform: translateY(20%);
-moz-transform: translateY(20%);
-ms-transform: translateY(20%);
transform: translateY(20%);
opacity: 0;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
.dpifs-show.dpifs-effect-3 .datepicker-in-fullscreen-content {
-webkit-transform: translateY(0);
-moz-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
opacity: 1;
} .dpifs-effect-4 .datepicker-in-fullscreen-content {
-webkit-transform: scale(0) rotate(720deg);
-moz-transform: scale(0) rotate(720deg);
-ms-transform: scale(0) rotate(720deg);
transform: scale(0) rotate(720deg);
opacity: 0;
}
.dpifs-show.dpifs-effect-4 ~ .datepicker-in-fullscreen-background,
.dpifs-effect-4 .datepicker-in-fullscreen-content {
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
transition: all 0.5s;
}
.dpifs-show.dpifs-effect-4 .datepicker-in-fullscreen-content {
-webkit-transform: scale(1) rotate(0deg);
-moz-transform: scale(1) rotate(0deg);
-ms-transform: scale(1) rotate(0deg);
transform: scale(1) rotate(0deg);
opacity: 1;
} .dpifs-effect-5.datepicker-in-fullscreen-modal {
-webkit-perspective: 1300px;
-moz-perspective: 1300px;
perspective: 1300px;
}
.dpifs-effect-5 .datepicker-in-fullscreen-content {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transform: translateZ(600px) rotateX(20deg); 
-moz-transform: translateZ(600px) rotateX(20deg); 
-ms-transform: translateZ(600px) rotateX(20deg); 
transform: translateZ(600px) rotateX(20deg); 
opacity: 0;
}
.dpifs-show.dpifs-effect-5 .datepicker-in-fullscreen-content {
-webkit-transition: all 0.3s ease-in;
-moz-transition: all 0.3s ease-in;
transition: all 0.3s ease-in;
-webkit-transform: translateZ(0px) rotateX(0deg);
-moz-transform: translateZ(0px) rotateX(0deg);
-ms-transform: translateZ(0px) rotateX(0deg);
transform: translateZ(0px) rotateX(0deg); 
opacity: 1;
} .dpifs-effect-6.datepicker-in-fullscreen-modal {
-webkit-perspective: 1300px;
-moz-perspective: 1300px;
perspective: 1300px;
}
.dpifs-effect-6 .datepicker-in-fullscreen-content {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transform: translate(30%) translateZ(600px) rotate(10deg); 
-moz-transform: translate(30%) translateZ(600px) rotate(10deg);
-ms-transform: translate(30%) translateZ(600px) rotate(10deg);
transform: translate(30%) translateZ(600px) rotate(10deg); 
opacity: 0;
}
.dpifs-show.dpifs-effect-6 .datepicker-in-fullscreen-content {
-webkit-transition: all 0.3s ease-in;
-moz-transition: all 0.3s ease-in;
transition: all 0.3s ease-in;
-webkit-transform: translate(0%) translateZ(0) rotate(0deg);
-moz-transform: translate(0%) translateZ(0) rotate(0deg);
-ms-transform: translate(0%) translateZ(0) rotate(0deg);
transform: translate(0%) translateZ(0) rotate(0deg);
opacity: 1;
} .dpifs-effect-7{
top: 0;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
}
.dpifs-effect-7 .datepicker-in-fullscreen-content {
-webkit-transform: translateY(-200%);
-moz-transform: translateY(-200%);
-ms-transform: translateY(-200%);
transform: translateY(-200%);
-webkit-transition: all .3s;
-moz-transition: all .3s;
transition: all .3s;
opacity: 0;
}
.dpifs-show.dpifs-effect-7 .datepicker-in-fullscreen-content {
-webkit-transform: translateY(0%);
-moz-transform: translateY(0%);
-ms-transform: translateY(0%);
transform: translateY(0%);
border-radius: 0 0 3px 3px;
opacity: 1;
} .dpifs-effect-8{
top: initial;
bottom: 0;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
}
.dpifs-effect-8 .datepicker-in-fullscreen-content {
-webkit-transform: translateY(200%);
-moz-transform: translateY(200%);
-ms-transform: translateY(200%);
transform: translateY(200%);
-webkit-transition: all .3s;
-moz-transition: all .3s;
transition: all .3s;
opacity: 0;
}
.dpifs-show.dpifs-effect-8 .datepicker-in-fullscreen-content {
-webkit-transform: translateY(0%);
-moz-transform: translateY(0%);
-ms-transform: translateY(0%);
transform: translateY(0%);
border-radius: 0 0 3px 3px;
opacity: 1;
} .dpifs-effect-9.datepicker-in-fullscreen-modal {
-webkit-perspective: 1300px;
-moz-perspective: 1300px;
perspective: 1300px;
}
.dpifs-effect-9 .datepicker-in-fullscreen-content {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transform: rotateY(-70deg);
-moz-transform: rotateY(-70deg);
-ms-transform: rotateY(-70deg);
transform: rotateY(-70deg);
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
opacity: 0;
}
.dpifs-show.dpifs-effect-9 .datepicker-in-fullscreen-content {
-webkit-transform: rotateY(0deg);
-moz-transform: rotateY(0deg);
-ms-transform: rotateY(0deg);
transform: rotateY(0deg);
opacity: 1;
} .dpifs-effect-10.datepicker-in-fullscreen-modal {
-webkit-perspective: 1300px;
-moz-perspective: 1300px;
perspective: 1300px;
}
.dpifs-effect-10 .datepicker-in-fullscreen-content {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transform: rotateX(-70deg);
-moz-transform: rotateX(-70deg);
-ms-transform: rotateX(-70deg);
transform: rotateX(-70deg);
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
opacity: 0;
}
.dpifs-show.dpifs-effect-10 .datepicker-in-fullscreen-content {
-webkit-transform: rotateX(0deg);
-moz-transform: rotateX(0deg);
-ms-transform: rotateX(0deg);
transform: rotateX(0deg);
opacity: 1;
} .dpifs-effect-11.datepicker-in-fullscreen-modal {
-webkit-perspective: 1300px;
-moz-perspective: 1300px;
perspective: 1300px;
}
.dpifs-effect-11 .datepicker-in-fullscreen-content {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transform: rotateX(-60deg);
-moz-transform: rotateX(-60deg);
-ms-transform: rotateX(-60deg);
transform: rotateX(-60deg);
-webkit-transform-origin: 50% 0;
-moz-transform-origin: 50% 0;
transform-origin: 50% 0;
opacity: 0;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
.dpifs-show.dpifs-effect-11 .datepicker-in-fullscreen-content {
-webkit-transform: rotateX(0deg);
-moz-transform: rotateX(0deg);
-ms-transform: rotateX(0deg);
transform: rotateX(0deg);
opacity: 1;
} .dpifs-effect-12 .datepicker-in-fullscreen-content {
-webkit-transform: scale(2);
-moz-transform: scale(2);
-ms-transform: scale(2);
transform: scale(2);
opacity: 0;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
.dpifs-show.dpifs-effect-12 .datepicker-in-fullscreen-content {
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
opacity: 1;
} .dpifs-effect-13 .datepicker-in-fullscreen-content {
-webkit-transform: scale(0.8);
-moz-transform: scale(0.8);
-ms-transform: scale(0.8);
transform: scale(0.8);
opacity: 0;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
.dpifs-show.dpifs-effect-13 ~ .datepicker-in-fullscreen-background {
background: #fff;
} 
.dpifs-effect-13 .datepicker-in-fullscreen-content {
background: transparent;
}
.dpifs-show.dpifs-effect-13 .datepicker-in-fullscreen-content {
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
opacity: 1;
} .dpifs-effect-14.datepicker-in-fullscreen-modal {
-webkit-perspective: 1300px;
-moz-perspective: 1300px;
perspective: 1300px;
}
.dpifs-effect-14 .datepicker-in-fullscreen-content {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transform: translateZ(-3000px) rotateY(90deg);
-moz-transform: translateZ(-3000px) rotateY(90deg);
-ms-transform: translateZ(-3000px) rotateY(90deg);
transform: translateZ(-3000px) rotateY(90deg);
opacity: 0;
}
.dpifs-show.dpifs-effect-14 .datepicker-in-fullscreen-content {
-webkit-animation: slit .7s forwards ease-out;
-moz-animation: slit .7s forwards ease-out;
animation: slit .7s forwards ease-out;
}
@-webkit-keyframes slit {
50% { -webkit-transform: translateZ(-250px) rotateY(89deg); opacity: .5; -webkit-animation-timing-function: ease-out;}
100% { -webkit-transform: translateZ(0) rotateY(0deg); opacity: 1; }
}
@-moz-keyframes slit {
50% { -moz-transform: translateZ(-250px) rotateY(89deg); opacity: .5; -moz-animation-timing-function: ease-out;}
100% { -moz-transform: translateZ(0) rotateY(0deg); opacity: 1; }
}
@keyframes slit {
50% { transform: translateZ(-250px) rotateY(89deg); opacity: 1; animation-timing-function: ease-in;}
100% { transform: translateZ(0) rotateY(0deg); opacity: 1; }
} .dpifs-effect-15.datepicker-in-fullscreen-modal {
-webkit-perspective: 1300px;
-moz-perspective: 1300px;
perspective: 1300px;
}
.dpifs-effect-15 .datepicker-in-fullscreen-content {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transform: translateY(100%) rotateX(90deg);
-moz-transform: translateY(100%) rotateX(90deg);
-ms-transform: translateY(100%) rotateX(90deg);
transform: translateY(100%) rotateX(90deg);
-webkit-transform-origin: 0 100%;
-moz-transform-origin: 0 100%;
transform-origin: 0 100%;
opacity: 0;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
.dpifs-show.dpifs-effect-15 .datepicker-in-fullscreen-content {
-webkit-transform: translateY(0%) rotateX(0deg);
-moz-transform: translateY(0%) rotateX(0deg);
-ms-transform: translateY(0%) rotateX(0deg);
transform: translateY(0%) rotateX(0deg);
opacity: 1;
} .dpifs-effect-16.datepicker-in-fullscreen-modal {
-webkit-perspective: 1300px;
-moz-perspective: 1300px;
perspective: 1300px;
}
.dpifs-effect-16 .datepicker-in-fullscreen-content {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transform: translateZ(100px) translateX(-30%) rotateY(90deg);
-moz-transform: translateZ(100px) translateX(-30%) rotateY(90deg);
-ms-transform: translateZ(100px) translateX(-30%) rotateY(90deg);
transform: translateZ(100px) translateX(-30%) rotateY(90deg);
-webkit-transform-origin: 0 100%;
-moz-transform-origin: 0 100%;
transform-origin: 0 100%;
opacity: 0;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
.dpifs-show.dpifs-effect-16 .datepicker-in-fullscreen-content {
-webkit-transform: translateZ(0px) translateX(0%) rotateY(0deg);
-moz-transform: translateZ(0px) translateX(0%) rotateY(0deg);
-ms-transform: translateZ(0px) translateX(0%) rotateY(0deg);
transform: translateZ(0px) translateX(0%) rotateY(0deg);
opacity: 1;
} @media screen and ( max-height: 500px ){
.datepicker-in-fullscreen-modal {
max-width: 500px;
}
.datepicker-in-fullscreen-controls>a{
padding: 9px 5px;
font-size: 10px;
}
div.datepicker table, 
div.datepicker-inline{
width: 100%;
font-size: 12px;
}
.table-condensed > thead > tr > th, 
.table-condensed > tbody > tr > th, 
.table-condensed > tfoot > tr > th, 
.table-condensed > thead > tr > td, 
.table-condensed > tbody > tr > td, 
.table-condensed > tfoot > tr > td {
padding: 5px;
}
}