﻿#container {width:100%}
#centered {width:1000px; margin:0 auto}
.BgDetail
{
    border-radius:5px;
    margin: 10px 10px 10px 10px;
}
.middleLock {
  transition: .5s ease;
  opacity: 1;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
}
.gv_ScrollBar
{
    overflow:auto;
    height:300px;
    scrollbar-arrow-color:cornflowerblue;
    scrollbar-shadow-color:rgba(235, 235, 235, 1);
    scrollbar-face-color:rgba(209, 221, 241, 1);
    scrollbar-shadow-color:rgba(209, 221, 241, 1);
    border-radius : 10px;
}
.DivEvaluate
{
    display:none;
    position:fixed;
    background-color:rgba(0,0,0,0.2);
    width:100%;
    height:100%;
    border-radius:5px;
    z-index:0px;
    top: 0px;
    left:0px;
}
.DivAskForHelpStep
{
    position:fixed;
    background-color:rgba(255,251,247,1);
    width:50%;
    height:50%;
    border-radius:15px;
    z-index:0px;
    top:25%;
    left:25%;
}
.Wrapper
{
    position:relative;
    display:inline-block;
}
.Slash
{
    position:relative;
    width:100%;
    height:100%;
    border-top:1px solid red;
    transfrom:rotate(-16deg);
    top: 0px;
}
.DivEvaluateBox
{
    background-color:red;
    position: absolute;
    height:50px;
    width:200px;
}
.BgIssue
{
    background-color : rgba(240, 244, 250, 1);
    border-radius:10px;
    margin: 10px 10px 10px 10px;
    padding:20px 20px 20px 20px;
}
.DivYinDee
{
    background-color : #fef9f0;
    border-radius:10px;
    margin: 10px 10px 10px 10px;
    padding:20px 20px 20px 20px;
    position:relative;
    transition:.9s;
}
.BgWelcomeYinDee
{
    background-color : #fef9f0;
    border-radius:10px;
    padding:5px 5px 5px 5px;
    position:relative;
    transition:.5s;
}
.divAskForHelp
{
    display:none;
    background-color : White;
    border-radius:10px;
    margin: 10px 10px 10px 10px;
    padding:20px 20px 20px 20px;
}
@keyframes animatetop{from{top:-300px;opacity:0} to{top:0;opacity:1}}
@keyframes opac{from{opacity:0} to{opacity:1}}
.w3-animate-top{position:relative;animation:animatetop 0.6s}@keyframes animatetop{from{top:-300px;opacity:0} to{top:0;opacity:1}}
.w3-animate-left{position:relative;animation:animateleft 0.6s}@keyframes animateleft{from{left:-300px;opacity:0} to{left:0;opacity:1}}
.w3-animate-right{position:relative;animation:animateright 0.6s}@keyframes animateright{from{right:-300px;opacity:0} to{right:300;opacity:1}}
.w3-animate-bottom{position:relative;animation:animatebottom 0.6s}@keyframes animatebottom{from{bottom:-300px;opacity:0} to{bottom:0;opacity:1}}
.w3-animate-zoom {animation:animatezoom 0.6s}@keyframes animatezoom{from{transform:scale(0)} to{transform:scale(1)}}
.w3-animate-input{transition:width 0.4s ease-in-out}.w3-animate-input:focus{width:100%!important}
 .customDrop, customDropHeader
 {
    padding-left:0px !important;
     position:absolute;
     box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
     }
 .listItemPL
 {g
     cursor:pointer;
     padding:5px;
     border:1px solid #898989;
     list-style:none;
     border-bottom-style:none;
     background-color:white;
}
.listItemPL:hover
{
   background-color: #898989;
}
.AFH_Box
{
    border-radius:5px;
    border: 1px solid #2d6a9c;
    margin: 2px;
    padding:5px 5px 5px 5px;
}
.Gv_AFHStep-div
{
    background-color : White;
    border: 1px solid White;
    border-radius:20px;
    box-shadow: 0px 0px 0px 0.5px rgba(0,0,0,0.1),0px -1px 10px 2px rgba(0,0,0,0.1);
}
.Gv_AFHStep
{
    background-color : White;
    padding :10px;
    margin : 10px;
}
.Gv_AFHStep-Detail-YinDee
{
    background-color : #A4C8F0;
    border: 1px solid #A4C8F0;
    border-radius:20px;
    color:black;
    padding :5px;
}
.Gv_AFHStep-Detail-Send
{
    background-color : Orange;
    border: 1px solid Orange;
    border-radius:20px;
    color:White;
    padding :5px;
}
.Detail
{
    background-color : White;
    border: 1px solid #ffffff;
    border-radius:5px;
    margin : 5px 5px 5px 5px;
    box-shadow: 0px 0px 0px 0.5px rgba(0,0,0,0.1),0px -1px 10px 2px rgba(0,0,0,0.3);
    opacity:1;
}
.Button
{   
    cursor:pointer;
    color:White;
    border: 0px solid #ffffff;
    background-color : #003399;
    border-radius:5px;
    margin: 5px;
    padding:5px 15px;
}
.Button:hover
{   
    box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.2),0px 3px 10px 0px rgba(0,0,0,0.19);
    transition: 0.2s;
}
.TextBox_AFH
{
    color:#898989;
    border:2px solid #898989;
    border-radius:5px;
}
.ActionTextbox
{
    color:#898989;
    border:1px solid #898989;
    border-left:0px;
    border-right:0px;
}
.ActionTextbox:focus
{
    color:Black;
}
.SearchBox
{
    color:#898989;
    border:2px solid #898989;
    border-radius:5px;
    padding:10px 5px;
}
.SearchBox:focus
{
    color:Black;
}
.GvBox
{
    margin : 5px 5px 5px 5px;
    box-shadow: 0px 0px 0px 0.5px rgba(0,0,0,0.1),0px -1px 10px 2px rgba(0,0,0,0.3);
    opacity:1;
}
.gv_Issue
{
    background-color : white;
    border-radius:10px;
    margin: 5px 5px 5px 5px;
    padding : 3px;
    box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.2),0px 6px 20px 0px rgba(0,0,0,0.19);
}
.gv_Issue:hover
{
    background-color : #fef0f0;
    cursor:pointer;
}
.gv_Issue:active
{
    background-color : Black;
     border-radius:411px;
}
.ActionDesign
{
    background-color:rgba(209, 221, 241,1);
    border-radius:10px;
    padding:5px 10px;
    margin:2px;
}
.DashBoardBox
{
    border : 0px;
    border-radius:10px;
    margin:10px;
}
.DashBoardBox:hover
{
    box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.2),0px 6px 20px 0px rgba(0,0,0,0.19);
    transition:.3s;
    cursor:pointer;
}
.DashBoardBox:active
{
    transform: translateY(4px);
}
 .swiper-container {
 width: 100%;
 height: 100%;
 }
 .swiper-slide {
 text-align: center;
 font-size: 18px;
 background: #fff;
 display: -webkit-box;
 display: -ms-flexbox;
 display: -webkit-flex;
 display: flex;
 -webkit-box-pack: center;
 -ms-flex-pack: center;
 -webkit-justify-content: center;
 justify-content: center;
 -webkit-box-align: center;
 -ms-flex-align: center;
 -webkit-align-items: center;
 align-items: center;
 }
 .swiper-pagination {
 position: absolute;
 top: 10px;
 right: 10px;
 width: auto !important;
 left: auto !important;
 margin: 0;
 }
 .swiper-pagination-bullet {
 padding: 5px 10px;
 border-radius: 0;
 width: auto;
 height: 30px;
 text-align: center;
 line-height: 30px;
 font-size: 12px;
 color:#000;
 opacity: 1;
 background: rgba(0,0,0,0.2);
 }
 .swiper-pagination-bullet-active {
 color:#fff;
 background: #007aff;
 }
