﻿
*, *:after, *:before {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.clearfix:before, .clearfix:after {
    content: '';
    display: table;
}

.clearfix:after {
    clear: both;
}

.input {
    position: relative;
    z-index: 1;
    display: inline-block;
    width: calc(100% - 2em);
    vertical-align: top;
}

.input__field {
    position: relative;
    display: block;
    float: right;
    padding: 0.8em;
    width: 60%;
    border: none;
    border-radius: 0;
    background: #f0f0f0;
    -webkit-appearance: none; /* for box shadows to show on iOS */
}

    .input__field:focus {
        outline: none;
    }

.e2e_input__label {
    display: inline-block;
    float: right;
    padding: 0 1em;
    font-size: 14px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: 210px;
}

.input__label-content {
    position: relative;
    display: block;
    padding: 0.6em 0;
    width: 100%;
}

.input_content {
    overflow: hidden;
    cursor: default !important;
}

.e2e_font_style, .selectBox-dropdown:focus, .selectBox-dropdown:hover {
    font-family: proxima-nova,Helvetica,Arial,sans-serif;
    font-size: 15px !important;
    color: #202121;
    font-weight: 500 !important;
}

.input__field_content {
    margin-top: 19px;
    margin-bottom: 5px;
    padding: 0.85em 0.15em;
    width: 100%;
    background: transparent;
    font-weight: 500;
    font-size: 14px;
}

.input__label_content {
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 5px 0.25em;
    width: 100%;
    height: calc(100% - 1em);
    text-align: left;
    pointer-events: none;
}

    .input__label_content:before,
    .input__label_content:after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: calc(100% - 10px);
        border-bottom: 1px solid #B9C1CA;
    }

    .input__label_content:after,
    .selectBox-dropdown:after {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
        -webkit-transition: -webkit-transform 0.3s;
        transition: transform 0.3s;
    }

    .selectBox-dropdown:focus,
    .input__label_content:after {
        border-bottom: 2px solid #087ab7;
    }

.input__field_content:focus + .input__label_content::after,
.input--filled--line .input__label_content::after {
    /*line*/
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.input__field_content:focus + .input__label_content .input__label-content_content,
.input--filled .input__label-content_content {
    /*nav-up down effect*/
    -webkit-animation: anim-1 0.3s forwards;
    animation: anim-1 0.3s forwards;
}

@-webkit-keyframes anim-1 {
    50% {
        opacity: 0;
        -webkit-transform: translate3d(1em, 0, 0);
        transform: translate3d(1em, 0, 0);
    }

    51% {
        opacity: 0;
        -webkit-transform: translate3d(-1em, -40%, 0);
        transform: translate3d(-1em, -40%, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: translate3d(0, -40%, 0);
        transform: translate3d(0, -40%, 0);
    }
}

@keyframes anim-1 {
    50% {
        opacity: 0;
        -webkit-transform: translate3d(1em, 0, 0);
        transform: translate3d(1em, 0, 0);
    }

    51% {
        opacity: 0;
        -webkit-transform: translate3d(-1em, -40%, 0);
        transform: translate3d(-1em, -40%, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: translate3d(0, -40%, 0);
        transform: translate3d(0, -40%, 0);
    }
}

.DropDownList {
    width: 90%;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.input_field_DropDownList {
    overflow: hidden;
    cursor: default !important;
}

.input__DropDownList {
    position: relative;
    display: block;
    padding: 0.8em 0.3em 0.1em;
    border: none;
    border-radius: 0;
    background: #fff;
    border-bottom: 1px solid #B9C1CA;
    margin-top: 15px;
    margin-left: 0px;
    -webkit-appearance: none; /* for box shadows to show on iOS */
}

    .input__DropDownList:focus {
        outline: none;
    }

option {
    color: #333;
    font-size: 15px;
    line-height: 25px;
}

.dropdown_lable {
    padding: 12px 0px 0px 4px;
    position: absolute;
    text-shadow: 0px 0px 2px rgba(202, 196, 196, 0.45);
    opacity: 0.9;
}

.dropdown_lable_time {
    padding: 4px 3px;
    position: absolute;
    line-height: 7px;
    text-shadow: 0px 0px 2px rgba(202, 196, 196, 0.45);
    opacity: 0.9;
}

.dropdown_lable_payment {
    padding: 0px 0px;
    position: absolute;
    line-height: 9px;
    text-shadow: 0px 0px 2px rgba(202, 196, 196, 0.45);
    opacity: 0.9;
}

/*****scrollbar****/
::-webkit-scrollbar {
    height: 6px;
    width: 6px;
    background-color: #F5F5F5;
}

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
    border-radius: 8px;
    background-color: #9c9c9c;
}

::-webkit-scrollbar-thumb {
    border-radius: 8px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    background-color: #087ab7;
}

#LblPrivacyPolicy {
    padding-left: 25px;
}

.e2e_labelCheckbox {
    margin-top: 10px;
}

    .e2e_labelCheckbox label {
        padding-left: 25px;
    }

/********radio**********/




.e2e_labelCheckbox {
    position: relative;
    top: -1.5px;
    left: -2px;
}

.e2e_checkbox {
    height: 15px;
    width: 15px;
    position: absolute;
}

    .e2e_checkbox:after {
        content: '\00D7';
        display: block;
        background: white;
        background-image: url('../../Includes/Images/tick.png');
        pointer-events: none;
        font-size: 18px;
        position: absolute;
        top: -1.5px;
        left: -2px;
        height: 18px;
        width: 18px;
        color: transparent;
        border-radius: 3px;
        line-height: 15px;
        background-position: 0 15px;
        background-repeat: no-repeat;
        background-size: 15px 15px;
        border-width: 2px;
        border-style: solid;
        border-color: #e8e1e1;
    }

    .e2e_checkbox:checked:after {
        background-color: #fff;
        background-position: 2px -4px;
    }





/********dropdown**************/
.e2e_selectbox {
    width: 100%;
    margin-top: 13px;
}

.e2e_selectbox_mid {
    width: 96.33%;
    margin-top: 14px;
}

.e2e_selectbox_small {
    width: 85%;
    margin-top: 13px;
}

.e2e_selectbox_small_time {
    width: 91%;
    margin-top: 13px;
}

.e2e-dropdown-menu {
    width: 88%;
    border-bottom: 1px solid #B9C1CA;
}

@media (max-width:1025px) {
    .e2e_selectbox_small {
        width: 94% !important;
    }
}

@media (max-width:765px) {
    .e2e-dropdown-menu {
        width: 95%;
    }

    .e2e_selectbox_small, .e2e_selectbox_small_time {
        width: 96%;
        margin-top: 13px;
    }

    .e2e_selectbox {
        width: 95%;
        margin-top: 13px;
    }
}

@media (max-width:720px) {
    .input_content {
        width: 100%;
    }

    .e2e-dropdown-menu {
        width: 100%;
    }

    .e2e_selectbox_small, e2e_selectbox_small_time {
        margin-top: 6px;
    }

    .responsive_dropdownSmall {
        padding: 0px 0px 0px 4px;
        line-height: 8px;
    }
}

.pos_viewfp {
    margin-top: 34px;
    text-decoration: underline;
    margin-left: 0px !important;
}
.pad3left{ padding-left:3px;}
@media (min-width: 1920px) and (max-width: 2560px) {
    .pad3left {
        padding-left: 10px;
    }
}