body{
    overflow-y:scroll;
    background:#eff1f4; /* #e8ebec #f2f2f2 #e8ebec;*/
    border:none;
    padding:0px;
    margin:0px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;}

.header{
    width:100%;
    height:80px;
    float:left;
    background:#FFFFFF}
    
.header .inner{
    width:calc(1400px - 60px);
    height:inherit;
    margin:0 auto;
    padding-left:30px;
    padding-right:30px;}
    
.header .inner .left{
    width:auto;
    height:80px;
    float:left}
    
.header .inner .left .logo{
    width:auto;
    height:calc(100% - 50px);
    float:left;
    position:relative;
    top:50%;
    transform:translateY(-50%);}
    
.header .inner .left .logo img{
    width:100%;
    height:100%;
    float:left;}
    
.header .inner .right{
    width:auto;
    height:80px;
    float:right;}
    
.header .inner .right .logout{
    width:auto;
    height:auto;
    float:left;
    font-family:nunitoextrabold;
    background:#4e5765;
    color:#FFFFFF;
    font-size:13px;
    border:none;
    outline:none;
    padding:12px;
    padding-bottom:6px;
    padding-top:6px;
    text-transform:uppercase;
    border-radius:5px;
    letter-spacing:0.5px;
    top:50%;
    transform:translateY(-50%);
    position:relative;
    cursor:pointer;
    -webkit-box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    text-decoration:none}
    
.header .inner .right .logout:hover{
    background:#272d36}
    
.header .inner .right .user{
    width:auto;
    height:80px;
    float:left;
    margin-right:30px;
    position:relative;
    cursor:pointer}
    
.header .inner .right .user .icon{
    width:40px;
    height:80px;
    float:left;
    position:relative;}
    
.header .inner .right .user .icon .round{
    width:40px;
    height:40px;
    float:left;
    border:1px solid #e4e7eb;
    border-radius:1000px;
    position:relative;
    top:50%;
    transform:translateY(-50%);}
    
.header .inner .right .user .icon .round img{
    width:22px;
    height:22px;
    float:left;
    opacity:0.5;
    position:relative;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);}
    
.header .inner .right .user .username{
    width:auto;
    height:auto;
    float:left;
    position:relative;
    top:50%;
    transform:translateY(-50%);
    margin-left:20px;
    font-family:nunitobold;
    font-size:15px;
    color:#7d858d}
    

    
.container{
    width:calc(1400px - 60px);
    min-height:1200px;   
    margin:0 auto;
    padding-left:30px;
    padding-right:30px;
    /*display:flex*/}   

    /*
.container .menu{
    width:calc((((100% - 60px) / 16) * 3) - 2px);
    height:800px;
    float:left;
    background:#4e5765;
    margin-top:60px;
    position:sticky;
    top:60px;
    border:1px solid #e4e7eb;
    border-radius:10px 10px 10px 10px}
    */
    
.container .menu{
    width:calc((((100% - 60px) / 16) * 3) - 2px);
    height:auto;
    float:left;
    background:#4e5765;
    margin-top:60px;
    position:relative;
    border:1px solid #e4e7eb;
    border-radius:10px 10px 10px 10px}
    
.container .menu .divider{
    width:100%;
    height:0px;
    float:left;
    border-bottom:1px dashed #272d36;
    opacity:0.45}
    
.container .menu .line{
    width:calc(100% - 40px);
    height:auto;
    float:left;
    padding-left:20px;
    padding-right:20px;
    padding-bottom:10px;
    padding-top:10px;}
    
.container .menu .line:first-child{
    padding-top:20px;}
    
.container .menu .line:last-child{
    padding-bottom:20px;}
    
.container .menu .line .main{
    width:100%;
    height:auto;
    float:left;}   
    
.container .menu .line .main .icon{
    width:30px;
    height:30px;
    float:left;}
    
.container .menu .line .main .icon img{
    width:22px;
    height:22px;
    float:left;
    position:relative;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    opacity:0.5;}
    
.container .menu .line .main .text{
    width:calc(100% - 30px - 10px);
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:18px;
    color:#eff1f4;
    line-height:30px;
    vertical-align:middle;
    margin-left:10px;
    letter-spacing:0.5px;}
    
.container .menu .line .sub{
    width:calc(100% - 10px);
    height:auto;
    float:left;
    margin-left:10px;
    margin-top:0px;}
    
.container .menu .line .sub .icon{
    width:30px;
    height:30px;
    float:left;}
    
.container .menu .line .sub .icon img{
    width:16px;
    height:16px;
    float:left;
    position:relative;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    opacity:0.5;
    transition:ease-out 150ms;
    -webkit-transition:ease-out 150ms;
    -moz-transition:ease-out 150ms;}
    
.container .menu .line .sub:hover .icon img{
    transform:translate(-30%,-50%);
    opacity:0.85}
    
.container .menu .line .sub .box{
    width:auto;
    height:auto;
    float:left;
    position:relative;
    overflow:hidden}

.container .menu .line .sub .box .text{
    width:auto;
    height:30px;
    float:left;
    font-family:nunitoregular;
    font-size:16px;
    color:#eff1f4;
    line-height:30px;
    vertical-align:middle;
    margin-left:0px;
    letter-spacing:0.5px;
    padding-left:5px;
    padding-right:5px;
    text-decoration:none}
    
.container .menu .line .sub .box .underline{
    width:100%;
    height:0px;
    float:left;
    border-bottom:1px solid #eff1f4;
    opacity:0.25;
    position:relative;
    left:calc(-100% - 5px);
    z-index:1000;
    transition:ease-out 200ms;
    -webkit-transition:ease-out 200ms;
    -moz-transition:ease-out 200ms;}
    
.container .menu .line .sub:hover .box .underline{
    left:0px;
    opacity:0.85}
    
    
    
.container .coat{
    width:calc(((100% - 60px) / 16) * 13);
    margin-left:60px;
    margin-top:60px;
    float:left}  
    
.container .coat .skipbox{
    width:100%;
    height:100px;
    float:left;
    margin-top:30px;}  
    
.container .coat .skipbox .inner{
    width:150px;
    height:auto;
    float:left;
    position:relative;
    left:50%;
    transform:translateX(-50%);
    background:#FFFFFF;
    border-radius:1000px;
    border:1px solid #e4e7eb;}
    
.container .coat .skipbox .inner .pagenumber{
    width:68px;
    height:40px;
    float:left;
    font-family:nunitobold;
    font-size:16px;
    color:#7d858d;
    text-align:center;
    vertical-align:middle;
    line-height:40px;
    letter-spacing:0.5px;
    margin-left:41px;}
    
.container .coat .skipbox .inner .button{
    width:40px;
    height:40px;
    float:left;
    background:#FFFFFF;
    border-radius:1000px;
    border:1px solid #e4e7eb;
    position:absolute;
    top:-1px;}
    
.container .coat .skipbox .inner .button:hover{
    background:#f5f7fa}
    
.container .coat .skipbox .inner .button.left{
    left:-1px;}
    
.container .coat .skipbox .inner .button.right{
    right:-1px;}

.container .coat .skipbox .inner .button img{
    width:25px;
    height:25px;
    float:left;
    opacity:0.5;
    position:relative;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);}    
    
.container .coat .panel{
    width:100%;
    height:auto;
    float:left;}
    
.container .coat .panel.error{
    margin-bottom:60px;}
    
.container .coat .panel .heading{
    width:100%;
    height:60px;
    float:left;
    background:#FFFFFF;
    border:1px solid #e4e7eb;
    border-radius:10px 10px 0px 0px}
    
.container .coat .panel .heading .icon{
    width:auto;
    height:60px;
    float:left;
    margin-left:20px;}
    
.container .coat .panel .heading .icon img{
    width:22px;
    height:22px;
    float:left;
    position:relative;
    top:50%;
    transform:translateY(-50%);
    opacity:0.5}
    
.container .coat .panel .heading .headline{
    width:auto;
    height:60px;
    float:left;
    font-family:nunitoextrabold;
    font-size:16px;
    color:#7d858d;
    text-transform:uppercase;
    margin-left:10px;
    vertical-align:middle;
    line-height:60px;}
    
.container .coat .panel .heading.error .headline{
    color:#cc0000}

.container .coat .panel .heading .headline.nonuppercase{
    text-transform:none}
    
.container .coat .panel .heading .buttonbox,
.container .coat .panel .footer .buttonbox{
    width:auto;
    height:60px;
    float:right;}
    
.container .coat .panel .heading .buttonbox .button,
.container .coat .panel .footer .buttonbox .button{
    width:auto;
    height:auto;
    float:left;
    font-family:nunitoextrabold;
    background:#4e5765;
    color:#FFFFFF;
    font-size:13px;
    border:none;
    outline:none;
    padding:12px;
    padding-bottom:6px;
    padding-top:6px;
    text-transform:uppercase;
    border-radius:5px;
    letter-spacing:0.5px;
    top:50%;
    transform:translateY(-50%);
    position:relative;
    cursor:pointer;
    margin-right:20px;
    -webkit-box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    text-decoration:none}
    
.container .coat .panel .heading .buttonbox .button:hover,
.container .coat .panel .footer .buttonbox .button:hover{
    background:#272d36}
    
.container .coat .panel .heading .deletebox,
.container .coat .panel .footer .deletebox{
    width:auto;
    height:60px;
    float:left;}
    
.container .coat .panel .heading .deletebox .button,
.container .coat .panel .footer .deletebox .button{
    width:auto;
    height:auto;
    float:left;
    font-family:nunitoextrabold;
    background:#4e5765;
    color:#FFFFFF;
    font-size:13px;
    border:none;
    outline:none;
    padding:12px;
    padding-bottom:6px;
    padding-top:6px;
    text-transform:uppercase;
    border-radius:5px;
    letter-spacing:0.5px;
    top:50%;
    transform:translateY(-50%);
    position:relative;
    cursor:pointer;
    margin-left:20px;
    -webkit-box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    text-decoration:none}
    
.container .coat .panel .heading .deletebox .button:hover,
.container .coat .panel .footer .deletebox .button:hover{
    background:#272d36}
    
.container .coat .panel .heading .prices{
    width:auto;
    height:30px;
    float:right;
    margin-right:20px;
    position:relative;
    top:50%;
    transform:translateY(-50%);
    border-radius:1000px;
    border:1px solid #e4e7eb;
    -webkit-box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);}
    
.container .coat .panel .heading .prices .status1{
    width:auto;
    height:30px;
    float:left;}
    
.container .coat .panel .heading .prices .status1 .icon{
    width:22px;
    height:22px;
    float:left;
    margin:4px;
    background:#f9e5e5;
    border-radius:1000px;}

.container .coat .panel .heading .prices .status1 .icon img{
    width:18px;
    height:18px;
    float:left;
    margin:2px;
    transform:unset;
    top:unset;}
    
.container .coat .panel .heading .prices .status1 .text{
    width:auto;
    height:30px;
    float:left;
    vertical-align:middle;
    line-height:30px;
    font-family:nunitobold;
    font-size:14px;
    color:#cc0000;
    margin-right:10px;
    margin-left:4px}
    
.container .coat .panel .heading .prices .status2{
    width:auto;
    height:30px;
    float:left;}
    
.container .coat .panel .heading .prices .status2 .icon{
    width:22px;
    height:22px;
    float:left;
    margin:4px;
    background:#f0f3eb;
    border-radius:1000px}

.container .coat .panel .heading .prices .status2 .icon img{
    width:18px;
    height:18px;
    float:left;
    margin:2px;
    transform:unset;
    top:unset;}
    
.container .coat .panel .heading .prices .status2 .text{
    width:auto;
    height:30px;
    float:left;
    vertical-align:middle;
    line-height:30px;
    font-family:nunitobold;
    font-size:14px;
    color:#6c903a;
    margin-right:10px;
    margin-left:4px}
    
.container .coat .panel .heading2{
    width:100%;
    height:60px;
    float:left;
    background:#f5f7fa;
    border-top:2px solid #e4e7eb;}  
    
.container .coat .panel .heading2.first{
    margin-top:30px;
    border-bottom:1px solid #e4e7eb}
    
.container .coat .panel .heading2.last{
    border-top:0px solid #e4e7eb;
    border-bottom:2px solid #e4e7eb}
    
.container .coat .panel .heading2.special{
    border-top:none;
    margin-top:0px;}
    
.container .coat .panel .heading2.special2{
    border-top:1px solid #e4e7eb;
    margin-top:30px;}
    
.container .coat .panel .heading2 .icon{
    width:auto;
    height:60px;
    float:left;
    margin-left:20px;}
    
.container .coat .panel .heading2 .icon img{
    width:22px;
    height:22px;
    float:left;
    position:relative;
    top:50%;
    transform:translateY(-50%);
    opacity:0.5}
    
.container .coat .panel .heading2 .headline{
    width:auto;
    height:60px;
    float:left;
    font-family:nunitoextrabold;
    font-size:16px;
    color:#7d858d;
    margin-left:10px;
    line-height:60px;
    vertical-align:middle;
    text-transform:uppercase}
    
.container .coat .panel .heading2 .incomes{
    width:auto;
    height:60px;
    float:right;
    margin-right:100px;
    vertical-align:middle;
    line-height:60px;
    font-family:nunitoextrabold;
    font-size:16px;
    color:#7d858d}
    
.container .coat .panel .heading2 .total{
    width:auto;
    height:60px;
    float:right;
    margin-right:70px;}
    
.container .coat .panel .heading2 .total .price{
    width:120px;
    height:60px;
    float:left;
    vertical-align:middle;
    line-height:60px;
    font-family:nunitoextrabold;
    font-size:16px;
    color:#7d858d;
    text-align:right;
    margin-left:15px;}
    
.container .coat .panel .heading2 .buttonbox{
    width:auto;
    height:60px;
    float:right}
    
.container .coat .panel .heading2 .buttonbox .button{
    width:auto;
    height:auto;
    float:left;
    font-family:nunitoextrabold;
    background:#4e5765;
    color:#FFFFFF;
    font-size:13px;
    border:none;
    outline:none;
    padding:12px;
    padding-bottom:6px;
    padding-top:6px;
    text-transform:uppercase;
    border-radius:5px;
    letter-spacing:0.5px;
    top:50%;
    transform:translateY(-50%);
    position:relative;
    cursor:pointer;
    margin-right:20px;
    -webkit-box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    text-decoration:none}
    
.container .coat .panel .heading2 .buttonbox .button:hover{
    background:#272d36}
       
.container .coat .panel .subheading{
    width:100%;
    height:30px;
    float:left;
    background:#f5f7fa;
    border-left:1px solid #e4e7eb;
    border-right:1px solid #e4e7eb;
    border-bottom:1px solid #e4e7eb;}
    
.container .coat .panel .subheading2{
    width:100%;
    height:30px;
    float:left;
    background:#f5f7fa;
    border-top:0px solid #e4e7eb;}
    
.container .coat .panel .subheading .w500{
    width:500px;
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:20px;
    vertical-align:middle;
    line-height:30px;}
    
.container .coat .panel .subheading .w30,
.container .coat .panel .subheading2 .w30{
    width:30px;
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:20px;
    vertical-align:middle;
    line-height:30px;
    text-align:left}
    
.container .coat .panel .subheading .w55{
    width:55px;
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:20px;
    vertical-align:middle;
    line-height:30px;
    text-align:center}
    
.container .coat .panel .subheading2 .w75r{
    width:75px;
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:15px;
    vertical-align:middle;
    line-height:30px;
    text-align:right}
    
.container .coat .panel .subheading2 .w70r{
    width:70px;
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:20px;
    vertical-align:middle;
    line-height:30px;
    text-align:right}
    
.container .coat .panel .subheading .w85{
    width:85px;
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:20px;
    vertical-align:middle;
    line-height:30px;
    text-align:center}
    
.container .coat .panel .subheading .w90,
.container .coat .panel .subheading2 .w90{
    width:90px;
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:20px;
    vertical-align:middle;
    line-height:30px;
    text-align:left}
    
.container .coat .panel .subheading .w90r,
.container .coat .panel .subheading2 .w90r{
    width:90px;
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:15px;
    vertical-align:middle;
    line-height:30px;
    text-align:right}
    
.container .coat .panel .subheading .w120_2,
.container .coat .panel .subheading2 .w120_2{
    width:120px;
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:20px;
    vertical-align:middle;
    line-height:30px;
    text-align:left}
    
.container .coat .panel .subheading .w90.textright,
.container .coat .panel .subheading2 .w90.textright{
    text-align:right}
    
.container .coat .panel .subheading .w90.textcenter{
    text-align:center}
    
.container .coat .panel .subheading .w110,
.container .coat .panel .subheading2 .w110{
    width:110px;
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:20px;
    vertical-align:middle;
    line-height:30px;
    text-align:center}
    
.container .coat .panel .subheading .w110r,
.container .coat .panel .subheading2 .w110r{
    width:110px;
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:20px;
    vertical-align:middle;
    line-height:30px;
    text-align:right}
    
.container .coat .panel .subheading .w110r{
    width:110px;
    height:30px;
    float:right;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-right:20px;
    vertical-align:middle;
    line-height:30px;
    text-align:right}
    
.container .coat .panel .subheading .w120,
.container .coat .panel .subheading2 .w120{
    width:120px;
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:15px;
    margin-right:20px;
    vertical-align:middle;
    line-height:30px;
    text-align:right}
    
.container .coat .panel .subheading .w105,
.container .coat .panel .subheading2 .w105{
    width:105px;
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:20px;
    vertical-align:middle;
    line-height:30px;
    text-align:right}
    
.container .coat .panel .subheading .w200C,
.container .coat .panel .subheading2 .w200C{
    width:200px;
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:20px;
    vertical-align:middle;
    line-height:30px;
    text-align:center}
    
.container .coat .panel .subheading .w150C,
.container .coat .panel .subheading2 .w150C{
    width:150px;
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:20px;
    vertical-align:middle;
    line-height:30px;
    text-align:center}
    
.container .coat .panel .subheading2 .w120{
    margin-right:0px;}
    
.container .coat .panel .subheading .w120r{
    float:right} 
    
.container .coat .panel .subheading2 .w180{
    width:180px;
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:20px;
    vertical-align:middle;
    line-height:30px;
    text-align:left}
    
.container .coat .panel .subheading .w250{
    width:250px;
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:20px;
    vertical-align:middle;
    line-height:30px;
    text-align:left}

.container .coat .panel .subheading .w250b{
    width:250px;
    height:auto;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:20px;
    vertical-align:middle;
    line-height:30px;
    text-align:left;
    border: none;
    outline: none;
    background: transparent;
    cursor: pointer;
}

.container .coat .panel .subheading .w250b:hover{
    text-decoration: underline;
}
    
.container .coat .panel .subheading .w300,
.container .coat .panel .subheading2 .w300{
    width:300px;
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:20px;
    vertical-align:middle;
    line-height:30px;
    text-align:left}
    
.container .coat .panel .subheading .w360,
.container .coat .panel .subheading2 .w360{
    width:360px;
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:20px;
    vertical-align:middle;
    line-height:30px;
    text-align:left}
    
.container .coat .panel .subheading .w350,
.container .coat .panel .subheading2 .w350{
    width:350px;
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:20px;
    vertical-align:middle;
    line-height:30px;
    text-align:left}
    
.container .coat .panel .subheading .w380,
.container .coat .panel .subheading2 .w380{
    width:380px;
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:20px;
    vertical-align:middle;
    line-height:30px;
    text-align:left}
    
.container .coat .panel .subheading .w400,
.container .coat .panel .subheading2 .w400{
    width:400px;
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:20px;
    vertical-align:middle;
    line-height:30px;
    text-align:left}
    
.container .coat .panel .subheading .w410{
    width:410px;
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:20px;
    vertical-align:middle;
    line-height:30px;
    text-align:left}
    
.container .coat .panel .subheading .w550{
    width:550px;
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:20px;
    vertical-align:middle;
    line-height:30px;}
    
.container .coat .panel .subheading2 .w480{
    width:480px;
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:20px;
    vertical-align:middle;
    line-height:30px;}
    
.container .coat .panel .subheading2 .w400{
    width:400px;
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:20px;
    vertical-align:middle;
    line-height:30px;}
    
.container .coat .panel .subheading2 .w580r{
    width:580px;
    height:30px;
    float:left;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-left:20px;
    margin-right:20px;
    vertical-align:middle;
    line-height:30px;
    text-align:right}
    
.container .coat .panel .subheading .w550r{
    width:550px;
    height:30px;
    float:right;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    margin-right:20px;
    vertical-align:middle;
    line-height:30px;
    text-align:right}
    
.container .coat .panel .subheading .w500r{
    width:500px;
    height:30px;
    float:left;
    text-align:right;
    font-family:nunitobold;
    font-size:14px;
    color:#7d858d;
    vertical-align:middle;
    line-height:30px;
    margin-right:20px;}
    
.container .coat .panel .line{
    width:100%;
    height:50px;
    float:left;
    background:#FFFFFF;
    border-left:1px solid #e4e7eb;
    border-right:1px solid #e4e7eb;
    border-bottom:1px solid #e4e7eb;
    position:relative;}
    
.container .coat .panel .line:last-child{
    border-radius:0px 0px 10px 10px}
    
.container .coat .panel .line:hover{
    background:#f5f7fa}
    
.container .coat .panel .line.noheight{
    height:auto;}
    
.container .coat .panel .line .name{
    height:50px;
    float:left;
    vertical-align:middle;
    line-height:50px;
    font-family:nunitosemibold;
    font-size:14px;
    color:#272d36;
    margin-left:20px;}
    
.container .coat .panel .line .name .icon2{
    width:auto;
    height:inherit;
    float:left;
    margin-right:10px;}
    
.container .coat .panel .line .name .icon2 img{
    width:16px;
    height:16px;
    float:left;
    position:relative;
    top:50%;
    transform:translateY(-50%);
    opacity:0.5}
    
.container .coat .panel .line .name .icon{
    width:auto;
    height:inherit;
    float:left;}
    
.container .coat .panel .line .name .icon img{
    width:18px;
    height:18px;
    float:left;
    position:relative;
    top:50%;
    transform:translateY(-50%);
    opacity:0.5}
    
.container .coat .panel .line .name.margin10{
    margin-left:10px;
    font-family:nunitoextrabold}
    
.container .coat .panel .line .name.error{
    font-family:nunitoextrabold;
    color:#cc0000}
    
.container .coat .panel .line .name.active{
    font-family:nunitoextrabold;}
    
.container .coat .panel .line .w30{
    width:30px}
    
.container .coat .panel .line .w90{
    width:90px}
    
.container .coat .panel .line .w120{
    width:120px}
    
.container .coat .panel .line .w250{
    width:250px;
    font-family:nunitoextrabold;}
    
.container .coat .panel .line .w380{
    width:380px;}
    
.container .coat .panel .line .w400{
    width:400px;}
    
.container .coat .panel .line .w500{
    width:500px}
    
.container .coat .panel .line .w472{
    width:472px}
    
.container .coat .panel .line .w550{
    width:550px}
    
.container .coat .panel .line .war_amount{
    width:90px;
    height:50px;
    float:left;
    vertical-align:middle;
    line-height:50px;
    font-family:nunitosemibold;
    font-size:14px;
    color:#272d36;
    margin-left:20px;
    text-align:center}
    
.container .coat .panel .line .war_price{
    width:105px;
    height:50px;
    float:left;
    vertical-align:middle;
    line-height:50px;
    font-family:nunitosemibold;
    font-size:14px;
    color:#7d858d;
    margin-left:20px;
    text-align:right}
    
.container .coat .panel .line .war_amount.error{
    color:#cc0000;
    font-family:nunitoextrabold;}
    
.container .coat .panel .line .pinned{
    width:auto;
    height:50px;
    float:left;
    margin-left:20px;}
    
.container .coat .panel .line .pinned img{
    width:auto;
    height:18px;
    float:left;
    position:relative;
    top:50%;
    transform:translateY(-50%);}
    
.container .coat .panel .line .marker{
    width:55px;
    height:50px;
    float:left;
    margin-left:20px;}
    
.container .coat .panel .line .marker .dot{
    width:10px;
    height:10px;
    float:left;
    border-radius:1000px;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
    position:relative}
    
.container .coat .panel .line .marker .dot.paid{
    background:#BBDC8D}
    
.container .coat .panel .line .marker .dot.unpaid{
    background:#f58587}
    
.container .coat .panel .line .customer{
    width:410px;
    height:50px;
    float:left;
    margin-left:20px;
    color:#272d36;
    font-family:nunitosemibold;
    font-size:14px;
    vertical-align:middle;
    line-height:50px;}
    
.container .coat .panel .line .customer2{
    width:380px;
    height:50px;
    float:left;
    margin-left:20px;
    color:#272d36;
    font-family:nunitosemibold;
    font-size:14px;
    vertical-align:middle;
    line-height:50px;}
    
.container .coat .panel .line .customer.error,
.container .coat .panel .line .customer2.error{
    font-family:nunitoextrabold;
    color:#cc0000}
    
.container .coat .panel .line .customer.active,
.container .coat .panel .line .customer2.active{
    font-family:nunitoextrabold}
    
.container .coat .panel .line .invbox{
    width:110px;
    height:50px;
    float:left;
    position:relative;
    margin-left:20px;}
    
.container .coat .panel .line .invbox .invoice{
    width:auto;
    height:26px;
    float:left;
    border:1px solid #e4e7eb;
    background:#FFFFFF;
    border-radius:1000px;
    position:relative;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
    -webkit-box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);}
    
.container .coat .panel .line .invbox .invoice.paid{
    background:#f0f3eb;}
    
.container .coat .panel .line .invbox .invoice.paid .text{
    color:#6c903a}
    
.container .coat .panel .line .invbox .invoice.unpaid{
    background:#f9e5e5}
    
.container .coat .panel .line .invbox .invoice.unpaid .text{
    color:#cc0000}
    
.container .coat .panel .line .invbox .invoice:hover{
    background:#4e5765;}
    
.container .coat .panel .line .invbox .invoice.nohover{
    background:#FFFFFF;}
    
.container .coat .panel .line .invbox .invoice.unfinished{
    background:#4e5765}
    
.container .coat .panel .line .invbox .invoice .text{
    width:auto;
    height:26px;
    float:left;
    margin-left:10px;
    margin-right:10px;
    font-family:nunitobold;
    color:#272d36;
    font-size:13px;
    vertical-align:middle;
    line-height:26px}
    
.container .coat .panel .line .invbox .invoice:hover .text{
    color:#FFFFFF}
    
.container .coat .panel .line .invbox .invoice.nohover .text{
    color:#272d36}  
    
.container .coat .panel .line .invbox .invoice.unfinished .text{
    color:#FFFFFF}
    
.container .coat .panel .line .invbox .invoice.paid2{
    background:#f0f3eb;}
    
.container .coat .panel .line .invbox .invoice.paid2 .text{
    color:#6c903a}
    
.container .coat .panel .line .invbox .invoice.unpaid2{
    background:#f9e5e5}
    
.container .coat .panel .line .invbox .invoice.unpaid2 .text{
    color:#cc0000}
    
.container .coat .panel .line .invbox .invoice.overdue{
    background:#cc0000}
    
.container .coat .panel .line .invbox .invoice.overdue .text{
    color:#FFFFFF}
    
.container .coat .panel .line .status{
    width:auto;
    height:26px;
    float:left;
    position:absolute;
    right:20px;
    border:1px solid #e4e7eb;
    border-radius:1000px;
    top:50%;
    transform:translateY(-50%);
    -webkit-box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    background:#FFFFFF}
    
.container .coat .panel .line .status .status1{
    width:auto;
    height:26px;
    float:left;}
    
.container .coat .panel .line .status .status1 .icon{
    width:18px;
    height:18px;
    float:left;
    margin:4px;
    background:#f9e5e5;
    border-radius:1000px}

.container .coat .panel .line .status .status1 .icon img{
    width:16px;
    height:16px;
    float:left;
    margin:1px}
    
.container .coat .panel .line .status .status1 .text{
    width:auto;
    height:26px;
    float:left;
    vertical-align:middle;
    line-height:26px;
    font-family:nunitobold;
    font-size:14px;
    color:#cc0000;
    margin-right:6px}
    
.container .coat .panel .line .status .status2{
    width:auto;
    height:26px;
    float:left;}
    
.container .coat .panel .line .status .status2 .icon{
    width:18px;
    height:18px;
    float:left;
    margin:4px;
    background:#f0f3eb;
    border-radius:1000px}

.container .coat .panel .line .status .status2 .icon img{
    width:16px;
    height:16px;
    float:left;
    margin:1px}
    
.container .coat .panel .line .status .status2 .text{
    width:auto;
    height:26px;
    float:left;
    vertical-align:middle;
    line-height:26px;
    font-family:nunitobold;
    font-size:14px;
    color:#6c903a;
    margin-right:6px}
    
.container .coat .panel .line .date,
.container .coat .panel .line .date2{
    width:85px;
    height:50px;
    float:left;
    margin-left:20px;}
    
.container .coat .panel .line .date2{
    width:110px;}
    
.container .coat .panel .line .date .text,
.container .coat .panel .line .date2 .text{
    width:auto;
    height:auto;
    float:left;
    left:50%;
    top:50%;
    position:relative;
    transform:translate(-50%, -50%);
    font-family:nunitosemibold;
    color:#7d858d;
    font-size:12px;}
    
.container .coat .panel .line .date .text.bold,
.container .coat .panel .line .date2 .text.bold{
    font-family:nunitoextrabold;}
    
.container .coat .panel .line .date .text.error,
.container .coat .panel .line .date2 .text.error{
    font-family:nunitoextrabold;
    color:#cc0000}
    
.container .coat .panel .line .remains{
    width:110px;
    height:50px;
    float:right;
    margin-right:20px;}
    
.container .coat .panel .line .remains .text{
    width:100%;
    height:50px;
    float:left;
    font-family:nunitosemibold;
    color:#7d858d;
    font-size:14px;
    text-align:right;
    vertical-align:middle;
    line-height:50px;}
    
.container .coat .panel .line .remains .text.bold{
    font-family:nunitoextrabold;}
    
.container .coat .panel .line .remains .text.error{
    font-family:nunitoextrabold;
    color:#cc0000}
    
    
    
    
    
    
    
    
    
.container .coat .panel .line .price{
    width:auto;
    height:26px;
    float:right;
    margin-right:20px;
    border:1px solid #e4e7eb;
    border-radius:1000px;
    top:50%;
    transform:translateY(-50%);
    -webkit-box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    background:#f5f7fa;
    position:relative;}
    
.container .coat .panel .line .price.error{
    background:#cc0000;}
    
.container .coat .panel .line .price.active{
    background:#f0f3eb;}
    
.container .coat .panel .line .price.active .text{
    color:#6c903a;}
    
.container .coat .panel .line .price.nonactive{
    background:#f9e5e5;}
    
.container .coat .panel .line .price.nonactive .text{
    color:#cc0000;}
    
.container .coat .panel .line .price .text{
    width:auto;
    height:26px;
    float:left;
    vertical-align:middle;
    line-height:26px;
    font-family:nunitoextrabold;
    font-size:14px;
    color:#272d36;
    margin-right:10px;
    margin-left:10px;
    letter-spacing:0.5px}
    
.container .coat .panel .line .price.error .text{
    color:#FFFFFF;}
    
.container .coat .panel .line .price .text .light{
    color:#7d858d;
    font-family:nunitosemibold}
    
.container .coat .panel .line .price.error .text .light{
    color:#FFFFFF;}
    
.container .coat .panel .line .service{
    width:calc(100% - 40px);
    height:40px;
    float:left;
    margin-left:20px;
    margin-right:20px;}
    
.container .coat .panel .line .service:last-child{
    margin-bottom:20px;}
    
.container .coat .panel .line .service .line1{
    width:1px;
    height:100%;
    float:left;
    background:#e4e7eb;
    margin-left:30px;}
    
.container .coat .panel .line .service:last-child .line1{
    height:50%;}
    
.container .coat .panel .line .service .line2{
    width:20px;
    height:1px;
    float:left;
    background:#e4e7eb;
    top:50%;
    transform:translateY(-50%);
    position:relative;
    margin-left:-1px}
    
.container .coat .panel .line .service .icon{
    width:auto;
    height:40px;
    float:left;
    margin-left:10px;}
    
.container .coat .panel .line .service .icon img{
    width:auto;
    height:18px;
    float:left;
    position:relative;
    top:50%;
    transform:translateY(-50%);
    opacity:0.2}
    
.container .coat .panel .line .service .project{
    width:550px;
    height:40px;
    float:left;
    margin-left:10px;
    position:relative;
    overflow:hidden}
    
.container .coat .panel .line .service .project .inner{
    width:auto;
    height:40px;
    float:left;
    color:#272d36;
    font-family:nunitosemibold;
    font-size:14px;
    line-height:40px;
    vertical-align:middle;
    position:relative;
    z-index:1100;
    background:#FFFFFF;
    padding-left:10px;
    padding-right:20px}
    
.container .coat .panel .line:hover .service .project .inner{
    background:#f5f7fa}
    
.container .coat .panel .line .service .project .connector{
    width:calc(550px - 20px);
    height:1px;
    float:left;
    background:#7d858d;
    position:absolute;
    left:-100%;
    top:50%;
    transform:translateY(-50%);
    z-index:1000;
    transition:ease-out 250ms;
    -webkit-transition:ease-out 250ms;
    -moz-transition:ease-out 250ms;}
    
.container .coat .panel .line .service:hover .project .connector{
    left:0px;}
    
.container .coat .panel .line .service .validity{
    width:200px;
    height:22px;
    float:left;
    border-radius:1000px;
    border:1px solid #e4e7eb;
    top:50%;
    transform:translateY(-50%);
    position:relative}
    
.container .coat .panel .line .service .validity .show{
    width:100%;
    height:22px;
    float:left;
    position:absolute;
    border-radius:1000px;
    z-index:1000;
    font-family:nunitobold;
    color:#7d858d;
    font-size:13px;
    text-align:center;
    vertical-align:middle;
    line-height:22px}    
    
.container .coat .panel .line .service .validity .show.alert_0{
    background:#BBDC8D;
    color:#272d36}    
    
.container .coat .panel .line .service .validity .show.alert_1{
    background:#f58587;
    color:#272d36}   
    
.container .coat .panel .line .service .validity .show.alert_2{
    background:#cc0000;
    color:#FFFFFF}
    
.container .coat .panel .line .service .validity .hidden{
    width:100%;
    height:100%;
    float:left;
    position:absolute;
    background:#f5f7fa;
    border-radius:1000px;;
    z-index:1100;
    display:none;
    font-family:nunitobold;
    color:#7d858d;
    font-size:12px;
    text-align:center;
    vertical-align:middle;
    line-height:22px}
    
.container .coat .panel .line .service:hover .validity .hidden{
    display:block}
    
.container .coat .panel .line .service .price{
    width:auto;
    height:26px;
    float:right;
    margin-right:20px;
    border:1px solid #e4e7eb;
    border-radius:1000px;
    top:50%;
    transform:translateY(-50%);
    -webkit-box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    background:#f5f7fa;
    position:relative;}
    
.container .coat .panel .line .service .price .text{
    width:auto;
    height:26px;
    float:left;
    vertical-align:middle;
    line-height:26px;
    font-family:nunitoextrabold;
    font-size:14px;
    color:#272d36;
    margin-right:10px;
    margin-left:10px;
    letter-spacing:0.5px}
    
.container .coat .panel .line .service .price .text .light{
    color:#7d858d;
    font-family:nunitosemibold}   
    
    
.container .coat .panel .board{
    width:100%;
    height:auto;
    float:left;
    border-left:1px solid #e4e7eb;
    border-right:1px solid #e4e7eb;
    border-bottom:1px solid #e4e7eb;
    background:#FFFFFF;
    border-radius:0 0 10px 10px;}
    
.container .coat .panel .board .line2{
    width:100%;
    height:1px;
    float:left;
    background:#e4e7eb;
    margin-top:60px}
    
.container .coat .panel .board .box{
    height:auto;
    float:left;
    position:relative}
    
.container .coat .panel .board .box.w120{
    width:120px}
    
.container .coat .panel .board .box.w235{
    width:235px}
    
.container .coat .panel .board .box.w367{
    width:367px}
    
.container .coat .panel .board .box.w376{
    width:376px}
    
.container .coat .panel .board .box.w490{
    width:490px}
    
.container .coat .panel .board .box.w1000{
    width:1000px}
    
.container .coat .panel .board .box.left20{
    margin-left:20px}
    
.container .coat .panel .board .box.top30{
    margin-top:30px}
    
.container .coat .panel .board .box.top60{
    margin-top:60px}
    
.container .coat .panel .board .box.clearleft{
    clear:left}
    
.container .coat .panel .board .box .label{
    width:100%;
    height:auto;
    float:left;
    font-family:nunitobold;
    color:#272d36;
    font-size:14px;
    position:relative} 
    
.container .coat .panel .board .box .label .right{
    width:auto;
    height:19px;
    position:absolute;
    right:0px;
    top:0px;
    font-size:13px;
    font-family:nunitosemibold;
    cursor:pointer}
    
.container .coat .panel .board .box .label .right:hover{
    text-decoration:underline}
    
.container .coat .panel .board .box .input{
    width:100%;
    height:40px;
    float:left;
    font-family:nunitosemibold;
    color:#272d36;
    font-size:14px;
    border:1px solid #e4e7eb;
    outline:none;
    padding-left:10px;
    padding-right:10px;
    margin-top:5px} 
    
.container .coat .panel .board .box .input.textright{
    text-align:right}
    
.container .coat .panel .board .box .input.textcenter{
    text-align:center}
    
.container .coat .panel .board .box .input::-webkit-calendar-picker-indicator{
    height:34px;
    width:30px;
    background-color:#FFFFFF;
    background-image:url(../../../img/icon/calendar.svg);
    background-size: 18px 18px;
    background-repeat: no-repeat;
    background-position: center;
    position:absolute;
    right:1px;
    cursor:pointer;}
    
.container .coat .panel .board .box .input::-webkit-calendar-picker-indicator:hover{
    background-color:#e4e7eb}

.container .coat .panel .board .box .input::-webkit-datetime-edit-text,    
.container .coat .panel .board .box .input::-webkit-datetime-edit-month-field,
.container .coat .panel .board .box .input::-webkit-datetime-edit-day-field,
.container .coat .panel .board .box .input::-webkit-datetime-edit-year-field{
    color:#272d36;
    padding:3px;}
    
.container .coat .panel .board .box .input::-webkit-datetime-edit-text:focus,    
.container .coat .panel .board .box .input::-webkit-datetime-edit-month-field:focus,
.container .coat .panel .board .box .input::-webkit-datetime-edit-day-field:focus,
.container .coat .panel .board .box .input::-webkit-datetime-edit-year-field:focus{
    background:#e4e7eb;}
    
.container .coat .panel .board .box .textarea{
    width:100%;
    height:200px;
    float:left;
    font-family:nunitosemibold;
    color:#272d36;
    font-size:14px;
    border:1px solid #e4e7eb;
    outline:none;
    padding:10px;
    margin-top:5px}
    
.container .coat .panel .board .box .custom-select{
    width:calc(100% - 2px);
    height:38px;
    float:left;
    margin-top:5px;
    margin-left:0px;
    font-family:nunitosemibold;
    font-size:14px;
    color:#272d36;
    position:relative;
    border:1px solid #e4e7eb} 
    
.container .coat .panel .board .change{
    width:auto;
    height:40px;
    float:left;
    position:relative;
    margin-left:20px;
    margin-top:54px}
    
.container .coat .panel .board .change .button{
    width:auto;
    height:40px;
    float:left;
    border:none;
    outline:none;
    font-family:nunitobold;
    font-size:14px;
    padding-left:10px;
    padding-right:10px;
    border-radius:5px;
    color:#FFFFFF;
    letter-spacing:0.5px;
    -webkit-box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    cursor:pointer;
    margin-left:20px;} 
    
.container .coat .panel .board .change .button.rem{
    background:#cc0000}   
    
.container .coat .panel .board .change .button.add{
    background:#6c903a} 
    
.container .coat .panel .board .change .button.rem:hover{
    background:#8E0000}
    
.container .coat .panel .board .change .button.add:hover{
    background:#4B6428}

.container .coat .panel .board .change .button:first-child{
    margin-left:0px;}
    
.container .coat .panel .pricebox{
    width:100%;
    height:auto;
    float:left;}
    
.container .coat .panel .pricebox.add{
    margin-top:60px;}
    
.container .coat .panel .pricebox .set{
    width:100%;
    height:40px;
    float:left;
    border-top:1px solid #e4e7eb;
    position:relative;
    overflow:hidden} 
    
.container .coat .panel .pricebox .set:hover{
    background:#f5f7fa}
    
.container .coat .panel .pricebox .set.nohover:last-child{
    border-bottom:1px solid #e4e7eb}
    
.container .coat .panel .pricebox .set.nohover.nohover2:last-child{
    border-bottom:none}
    
.container .coat .panel .pricebox .set.nohover:hover{
    background:#FFFFFF}
    
.container .coat .panel .pricebox .set.add{
    background:#f5f7fa}
    
.container .coat .panel .pricebox .set:last-child{
    border-bottom:0px solid #e4e7eb}
    
.container .coat .panel .pricebox .set.add:last-child{
    border-bottom:1px solid #e4e7eb}
    
.container .coat .panel .pricebox .set .price_title{
    width:693px;
    height:40px;
    float:left;
    margin-left:52px;
    border:none;
    outline:none;
    background:transparent;
    font-family:nunitobold;
    font-size:14px;
    color:#272d36}
    
.container .coat .panel .pricebox .set .price_title::placeholder{
    color:#7d858d;
    opacity:0.5}
    
.container .coat .panel .pricebox .set:focus-within{
    background:#f5f7fa}
    
.container .coat .panel .pricebox .set.nohover:focus-within{
    background:#FFFFFF}
    
.container .coat .panel .pricebox .set .title{
    width:350px;
    height:40px;
    float:left;
    margin-left:20px;
    border:none;
    outline:none;
    background:transparent;
    font-family:nunitosemibold;
    font-size:14px;
    color:#272d36}
    
.container .coat .panel .pricebox .set .title350{
    width:350px;}
    
.container .coat .panel .pricebox .set .title.add::placeholder,
.container .coat .panel .pricebox .set .price.add::placeholder,
.container .coat .panel .pricebox .set .amount.add::placeholder,
.container .coat .panel .pricebox .set .unit_price.add::placeholder{
    font-family:nunitobold;
    color:#7d858d;
    opacity:0.5}
    
.container .coat .panel .pricebox .set .title.rounding{
    font-family:nunitosemibolditalic}
    
.container .coat .panel .pricebox .set .log_type{
    width:180px;
    height:40px;
    float:left;
    margin-left:20px;
    border:none;
    outline:none;
    background:transparent;
    font-family:nunitosemibold;
    font-size:14px;
    color:#272d36}
    
.container .coat .panel .pricebox .set .log_date{
    width:200px;
    height:40px;
    float:left;
    margin-left:20px;
    border:none;
    outline:none;
    background:transparent;
    font-family:nunitosemibold;
    font-size:14px;
    color:#272d36;
    text-align:center}
    
.container .coat .panel .pricebox .set .log_ip{
    width:580px;
    height:40px;
    float:left;
    margin-left:20px;
    margin-right:20px;
    border:none;
    outline:none;
    background:transparent;
    font-family:nunitosemibold;
    font-size:14px;
    color:#272d36;
    text-align:right}
    
.container .coat .panel .pricebox .set .price_value{
    width:175px;
    height:40px;
    float:left;
    margin-left:20px;
    border:none;
    outline:none;
    text-align:right;
    background:transparent;
    font-family:nunitobold;
    font-size:14px;
    color:#272d36}
    
.container .coat .panel .pricebox .set .price_value::placeholder{
    color:#7d858d;
    opacity:0.5}
    
.container .coat .panel .pricebox .set .unit_price{
    width:90px;
    height:40px;
    float:left;
    margin-left:15px;
    border:none;
    outline:none;
    text-align:right;
    background:transparent;
    font-family:nunitosemibold;
    font-size:14px;
    color:#272d36}
    
.container .coat .panel .pricebox .set .price{
    width:120px;
    height:40px;
    float:left;
    margin-left:15px;
    border:none;
    outline:none;
    text-align:right;
    background:transparent;
    font-family:nunitosemibold;
    font-size:14px;
    color:#272d36;
    opacity:0.5}
    
.container .coat .panel .pricebox .set .amount{
    width:75px;
    height:40px;
    float:left;
    margin-left:15px;
    border:none;
    outline:none;
    text-align:right;
    background:transparent;
    font-family:nunitosemibold;
    font-size:14px;
    color:#272d36}
    
.container .coat .panel .pricebox .set .price.rounding{
    font-family:nunitosemibolditalic}
    
.container .coat .panel .pricebox .set .price_box{
    width:40px;
    height:40px;
    float:right;
    margin-right:20px;
    position:absolute;
    right:-60px;
    transition:ease-out 150ms;
    -webkit-transition:ease-out 150ms;
    -moz-transition:ease-out 150ms;}
    
.container .coat .panel .pricebox .set:hover .price_box,
.container .coat .panel .pricebox .set:focus-within .price_box{
    background:#f5f7fa;
    right:0px;}
    
.container .coat .panel .pricebox .set .price_box .price_button{
    width:40px;
    height:40px;
    float:left;
    border:none;
    outline:none;
    opacity:0;
    z-index:1000;
    position:relative;
    cursor:pointer}
    
.container .coat .panel .pricebox .set .price_box .overlay{
    width:100%;
    height:100%;
    float:left;
    position:absolute;
    left:0px;
    top:0px;
    z-index:900;
    cursor:pointer}
    
.container .coat .panel .pricebox .set .price_box .overlay img{
    width:22px;
    height:22px;
    float:left;
    position:relative;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    border:1px solid #e4e7eb;
    background:#f5f7fa;
    padding:3px;
    border-radius:1000px;}
    
.container .coat .panel .pricebox .set .price_box:hover .overlay img{
    background:#FFFFFF;
    border:1px solid #e4e7eb;}    
    
.container .coat .panel .pricebox .set .service_title{
    width:360px;
    height:40px;
    float:left;
    margin-left:20px;
    border:none;
    outline:none;
    background:transparent;
    font-family:nunitobold;
    font-size:14px;
    color:#272d36}
    
.container .coat .panel .pricebox .set .service_title.highlited{
    color:#cc0000}
    
.container .coat .panel .pricebox .set .service_title::placeholder{
    color:#7d858d;
    opacity:0.5}
    
.container .coat .panel .pricebox .set .service_date{
    width:150px;
    height:40px;
    float:left;
    margin-left:20px;
    border:none;
    outline:none;
    background:transparent;
    font-family:nunitosemibold;
    font-size:14px;
    color:#272d36;
    position:relative}
    
.container .coat .panel .pricebox .set .service_date::placeholder{
    color:#7d858d;
    opacity:0.5;
    text-align:center}
    
.container .coat .panel .pricebox .set .service_date::-webkit-calendar-picker-indicator{
    height:40px;
    width:30px;
    background-color:transparent;
    background-image:url(../../../img/icon/calendar.svg);
    background-size: 18px 18px;
    background-repeat: no-repeat;
    background-position: center;
    position:absolute;
    right:1px;
    cursor:pointer;}

.container .coat .panel .pricebox .set:hover .service_date::-webkit-calendar-picker-indicator{
    background-color:#f5f7fa}
    
.container .coat .panel .pricebox .set .service_date::-webkit-calendar-picker-indicator:hover{
    background-color:#e4e7eb}

.container .coat .panel .pricebox .set .service_date::-webkit-datetime-edit-text,    
.container .coat .panel .pricebox .set .service_date::-webkit-datetime-edit-month-field,
.container .coat .panel .pricebox .set .service_date::-webkit-datetime-edit-day-field,
.container .coat .panel .pricebox .set .service_date::-webkit-datetime-edit-year-field{
    color:#272d36;
    padding:3px;}
    
.container .coat .panel .pricebox .set .service_date::-webkit-datetime-edit-text:focus,    
.container .coat .panel .pricebox .set .service_date::-webkit-datetime-edit-month-field:focus,
.container .coat .panel .pricebox .set .service_date::-webkit-datetime-edit-day-field:focus,
.container .coat .panel .pricebox .set .service_date::-webkit-datetime-edit-year-field:focus{
    background:#e4e7eb;}
    
.container .coat .panel .pricebox .set .service_value{
    width:90px;
    height:40px;
    float:left;
    margin-left:20px;
    border:none;
    outline:none;
    text-align:right;
    background:transparent;
    font-family:nunitobold;
    font-size:14px;
    color:#272d36}
    
.container .coat .panel .pricebox .set .service_value::placeholder{
    color:#7d858d;
    opacity:0.5}
    
.container .coat .panel .pricebox .set .service_extension{
    width:60px;
    height:25px;
    float:left;
    border:none;
    position:absolute;
    left:320px;
    z-index:1200;
    top:50%;
    transform:translateY(-50%);}   
    
.container .coat .panel .pricebox .set .service_extension.first{
    width:35px;
    left:275px}  
    
.container .coat .panel .pricebox .set .service_extension .button{
    width:100%;
    height:100%;
    float:left;
    position:absolute;
    border:none;
    outline:none;
    z-index:1300;
    opacity:0;
    cursor:pointer}
    
.container .coat .panel .pricebox .set .service_extension .overlay{
    width:100%;
    height:23px;
    float:left;
    background:#4e5765;
    outline:none;
    border-radius:5px;
    font-family:nunitobold;
    color:#FFFFFF;
    font-size:13px;
    position:absolute;
    z-index:1200;
    text-align:center;
    vertical-align:middle;
    line-height:23px} 
    
.container .coat .panel .pricebox .set .service_extension:hover .overlay{
    background:#272d36}
    
.container .coat .panel .board .footer{
    width:100%;
    height:60px;
    float:left;
    margin-top:0px;
    background:transparent;
    border-top:1px solid #e4e7eb;
    margin-top:0px;} 
    
.container .coat .panel .board .footer.top0{
    margin-top:0px;}
    
.container .coat .panel .board .footer.top30{
    margin-top:30px;}
    
.container .coat .panel .board .footer.top100{
    margin-top:100px;}
    
.container .coat .panel .board .footer.noborder{
    border:none}
    
.container .coat .panel .board .footer .box{
    width:calc((100% - 100px) / 4);
    height:auto;
    float:left;
    margin-left:20px;
    position:relative;
    top:50%;
    transform:translateY(-50%);}
    
.container .coat .panel .board .footer .box .line1{
    width:100%;
    height:auto;
    float:left;
    text-align:center;
    font-family:nunitosemibold;
    font-size:13px;
    color:#7d858d;
    text-transform:uppercase;}
    
.container .coat .panel .board .footer .box .line2{
    width:100%;
    height:auto;
    float:left;
    text-align:center;
    font-family:nunitoextrabold;
    font-size:16px;
    color:#272d36;
    margin-top:5px;}
    
.dotted{
    width:5px;
    height:5px;
    float:right;
    background:Red}

    
.footer{
    width:100%;
    height:50px;
    float:left;
    background:#4e5765;
    margin-top:60px;}
    
.footer .inner{
    width:calc(1400px - 60px);
    height:50px;
    margin:0 auto;
    padding-left:30px;
    padding-right:30px;}
    
.footer .inner .right{
    width:auto;
    height:50px;
    float:right;
    font-family:nunitobold;
    color:#eff1f4;
    font-size:14px;
    vertical-align:middle;
    line-height:50px;}
    
    
    
    
    
    
/* login */

.loginpage{
    width:100%;
    height:100vh;
    float:left;}
    
.loginpage .box{
    width:400px;
    height:auto;
    float:left;
    position:relative;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);}
    
.loginpage .box .input{
    width:300px;
    height:50px;
    float:left;
    clear:left;
    outline:none;
    border:1px solid #e4e7eb;
    padding-left:20px;
    padding-right:20px;
    font-family:nunitobold;
    font-size:15px;
    color:#272d36;
    left:50%;
    transform:translateX(-50%);
    position:relative;
    text-align:center}
    
.loginpage .box .input:first-child{
    border-radius:10px 10px 0px 0px}
    
.loginpage .box .input:nth-child(2){
    border-top:none;
    border-radius:0px 0px 10px 10px}
    
.loginpage .box .input.round{
    border-radius:10px 10px 10px 10px}
    
.loginpage .box .button{
    width:auto;
    height:auto;
    float:left;
    font-family:nunitoextrabold;
    background:#4e5765;
    color:#FFFFFF;
    font-size:13px;
    border:none;
    outline:none;
    padding:18px;
    padding-bottom:9px;
    padding-top:9px;
    text-transform:uppercase;
    border-radius:5px;
    letter-spacing:0.5px;
    cursor:pointer;
    -webkit-box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    -moz-box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    box-shadow: 0px 0px 10px -5px rgba(0,0,0,0.25);
    text-decoration:none;
    clear:left;
    margin-top:30px;
    left:50%;
    transform:translateX(-50%);
    position:relative;}
    
.loginpage .box .button:hover{
    background:#272d36}
    
.loginpage .box .info a{
    width:100%;
    height:auto;
    float:left;
    font-family:nunitosemibold;
    color:#272d36;
    font-size:14px;
    text-align:center;
    margin-top:30px;
    text-decoration:none;}
    
.loginpage .box .errormessage{
    width:100%;
    height:auto;
    float:left;
    font-family:nunitoextrabold;
    font-size:15px;
    color:#272d36;
    text-align:center}
    
.loginpage .box .errormessage.bottom30{
    margin-bottom:30px;}