body{
    padding: 0;
    margin: 0;
    font-size: 12px;
    font-weight: inherit;
    font-family: 'Century Gothic';
    color: #666666;
    background: #f7f9fb;
}

.Chk{
  width: 5vh; height: 2.5vh;
  position: relative;
  display: inline-block;
  background: rgba(0, 0, 0, 0.63);
  padding: 0;
  border-radius: 30px;
  overflow: hidden;
  margin: 0;
}

.Chk input[type="hidden"]{
  z-index: -1;
  display: inline-block !important;
  position: absolute;
  top: 200%;
}

.Chk > label{
    width: 2.7vh; height: 2.7vh;
    position: absolute;
    border-radius: 50%;
    top: 0; bottom: 0;
    right: auto; left: 0vh;
    margin: auto;
    -moz-transition: all 0.5s;
    border: none;
    background: #f2f5f6;
    background: -moz-linear-gradient(-45deg, #f2f5f6 0%, #e3eaed 47%, #bbcace 50%);
    background: -webkit-linear-gradient(-45deg, #f2f5f6 0%,#e3eaed 47%,#bbcace 50%);
    background: linear-gradient(135deg, #f2f5f6 0%,#e3eaed 47%,#bbcace 50%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f5f6', endColorstr='#bbcace',GradientType=1 );
}

.Chk input[type='checkbox']{
  z-index: 10000;
  width: 100%; height: 100%;
  position: absolute;
  right: 0; left: 0; 
  bottom: 0; top: 0;
  margin: auto;
  opacity: 0;
  cursor: pointer;
}

.Chk input[type='checkbox']:checked + label{
  left: auto; right: 0vh;
  box-shadow: rgb(23, 100, 200) 0vh 0vh 0vh 20vh;
}

.conter-radio{
  display: inline-block;
  width: 100% !important;
  list-style: none;
  margin: 0;
  padding: 0;
  position: relative;
  text-align: left;
}

.conter-radio > div{
  display: inline-block !important;
  position: relative;
  max-width: 100px;
}

.conter-radio div input[type=radio]{
  z-index: 300;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  display: inline-block;
  width: 100%;
  height: 100%;
  cursor: pointer;
  margin: 0px !important;
}

.conter-radio div label{
  display: block;
  position: relative;
  font-weight: 300;
  font-size: 1em;
  padding: 5px 30px;
  margin: auto;
  z-index: 9;
  cursor: pointer;
  -webkit-transition: all 0.25s linear;
}

@media print {
  .conter-radio div label{
      padding: 5px 30px;
  }
}

.conter-radio div .check{
  display: block;
  position: absolute;
  border: 3px solid #AAAAAA;
  border-radius: 100%;
  height: 20px;
  width: 20px;
  top: 50%; left: 0%;
  -moz-transform: translate(0%, -50%);
  -webkit-transform: translate(0%, -50%);
  padding: 0 !important;
  z-index: 5; padding: 0px !important;
  transition: border .25s linear;
  -webkit-transition: border .25s linear;
}

.conter-radio div .check::before {
  content: "";
  display: block;
  position: absolute;
  border-radius: 100%;
  height: 10px;
  width: 10px;
  top: 2.4px; left: 2.4px;
  transition: background 0.25s linear;
  -webkit-transition: background 0.25s linear;
}

.btn-radio input[type=radio]:checked ~ .check {
  border: 3px solid rgb(23, 100, 200);
}

.btn-radio input[type=radio]:checked ~ .check::before{
  background: rgb(23, 100, 200);
}

.btn-radio input[type=radio]:checked ~ label{
  color: rgb(23, 100, 200);
}

.Chk-2{
    position: relative;
    background: rgba(0,0,0,0.3);
    display: inline-block;
    overflow: hidden;
    padding: 22px;
    border-radius: 50%;
}

.Chk-2 > input[type=checkbox]{
    width: 100%; height: 100%;
    z-index: 100;
    position: absolute;
    top: 0; left: 0;
    margin: 0;
    opacity: 0;
    cursor: pointer;
}

.Chk-2 > label{
  width: 100%; height: 100%;
  z-index: 10;
  position: absolute;
  top: 0; left: 0;
  margin: 0;
  text-align: center;
  font-size: 8px;
}

.Chk-2 > label > i{
  height: 15px; width: 15px;
  position: absolute;
  top: 0; bottom: 0;
  left: 0; right: 0;
  margin: auto;
}

.Chk-2 input[type=checkbox]:checked + label {
  color: #fff; background: #279FD6;
  font-style: normal;
}

.Chk-3{
  position: relative;
  display: inline-block;
  padding: 0px 0px;
}

.Chk-3 input[type="checkbox"]{
  position: absolute;
  top: 0; left: 0; 
  height: 100%;
  width: 100%;
  opacity: 0;
  cursor: pointer;
}

.Chk-3 input[type="checkbox"] ~ i.not-check{
  color: #c8c8c8;
}
.Chk-3 input[type="checkbox"] ~ i.check{
  display: none;
}
.Chk-3 input[type="checkbox"]:checked ~ i.not-check{
  display: none;
}
.Chk-3 input[type="checkbox"]:checked ~ i.check{
  color: rgb(28, 146, 210);
  display: inline;
}
.None{
  display: none !important;
}

#FxBody{
  position: absolute;
  top: 0;
  left: 200px;
  width: calc(100% - 200px);
  height: 100%;
  padding: 0px 15px 0px 15px;
}

#FxMenu{
  z-index: 999;
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 130px;
  text-align: center;
  background: #f7f9fb;
  -webkit-box-shadow: 0px 12px 70px -50px rgba(0,0,0,0.7);
  -moz-box-shadow: 0px 12px 70px -50px rgba(0,0,0,0.7);
  box-shadow: 0px 12px 70px -50px rgba(0,0,0,0.7);
}

#FxMenu .logo{
  display: inline-block;
  height: 90px;
  position: relative;
  margin-top: 20px;
  margin-right: 20px;
  vertical-align: top;
}

#FxMenu > .btn-menu{
  z-index: 100;
  display: inline-block;
  width: 140px;
  height: 110px;
  color: #FFF;
  font-size: 13px;
  position: relative;
  overflow: hidden;
  vertical-align: top;
}

#FxMenu .btn-menu:after{
  content: "";
  z-index: -2;
  display: inline-block;
  position: absolute;
  top: 0;
  left: 0;
  width: 0px;
  height: 110px;
  border-top: 0px solid transparent;
  border-bottom: 20px solid transparent;
  border-left: 140px solid #d51e37;
}

#FxMenu .btn-menu:before{
  content: "";
  z-index: -1;
  display: inline-block;
  position: absolute;
  top: -30px;
  left: 0;
  width: 0px;
  height: 0px;
  border-top: 0px solid transparent;
  border-bottom: 20px solid transparent;
  border-left: 140px solid #63006c;
  -moz-transition: all 0.5s;
  -webkit-transition: all 0.5s;
}

#FxMenu .btn-active:before{
  content: "";
  top: 0px;
  width: 0px;
  height: 110px;
}

#FxMenu .btn-menu:hover:before{
  content: "";
  top: 0px;
  width: 0px;
  height: 110px;
  -moz-transition: all 0.2s;
  -webkit-transition: all 0.2s;
}


#FxMenu .btn-menu img{
  width: 100%; height: 20px;
  margin-bottom: 5px;
}

#FxMenu .btn-menu a{
  padding-top: 20px;
  text-decoration: none;
  color: inherit;
  display: inline-block;
  width: 100%;
  height: 100%;
}

#FxContent{
  width: 100%;
  margin-top: 30px;
  min-height: 100%;
}

#FxFooter{
  min-height: 200px;
  background: #0d1425;
  margin-left: -15px;
  margin-right: -15px;
  margin-top: 50px;
  padding: 0px 15px;
  color: #fff;
}

.form-input{
  display: inline-block;
  position: relative;
  margin-bottom: 15px;
}


.form-input-elastic{
  width: 100%;
}

.form-input > label{
  display: inline-block;
  width: 100%;
  font-size: 12px; 
  font-family: "WorkSans";
  font-weight: bold;
}

.form-input > input,
.form-input > select,
.form-input > textarea{
  display: inline-block;
  width: 100%;
  min-width: 100%;
  padding: 5px 10px 5px 0px;
  border: none;
  border-bottom: 0.1vh solid #454545;
  color: #0f1044;
  font-size: 14px;a
  position: relative;
  font-weight: inherit;
  background: transparent;
}

.form-input > select{
  border-radius: 0% !important;
}

.form-chk{
  margin-top: 5px;
  margin-bottom: 5px;
}

.form-chk > input{
  display: inline-block;
  vertical-align: top;
}

.form-chk > label{
  display: inline-block;
}

.form-input > .border{
  width: 0%;
  border-top: 3px solid #1764c8;
  margin-top: -1px;
  z-index: 10;
  position: relative;
  -moz-transition: all 0.3s;
  -webkit-transition: all 0.3s;
}

.form-input input:focus ~ .border,
.form-input select:focus ~ .border,
.form-input textarea:focus ~ .border{
  width: 100% !important;
  -moz-transition: all 0.5s;
  -webkit-transition: all 0.5s;
}

.font-icon{
  height: 1.1em;
  width: auto;
  display: inline-block;
  vertical-align: initial;
  padding-top: 5px;
}

.form-input input:focus ~ .border ~ label,
.form-input select:focus ~ .border ~ label{
  color: #1764c8;
  -moz-transition: all 0.5s;
  -webkit-transition: all 0.5s;
}

.btn-simple{
  z-index: 2;
  background: #d51e37;
  color: #fff !important;
  position: relative;
  border: none !important;
  border-radius: 0 !important;
}

.btn-simple:after{
  content: "";
  z-index: -1;
  height: 100%;
  width: 0%;
  background: #63006c;
  position: absolute;
  top: 0; left: 0;
  -moz-transition: all 0.5s;
  -webkit-transition: all 0.5s;
}

.box-img-pp{
  width: 25vh;
  height: 25vh;
  display: inline-block;
  margin: 5px;
  background: rgba(0, 0, 0, 0.1);
  position: relative;
  vertical-align: top;
  overflow: hidden;
}

.box-img-pp img{
  width: 100%;
  position: absolute;
  top: 50%; left: 50%;
  -moz-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
}

.box-img-pp img:hover{
  opacity: 0.8;
}

.btn-simple:hover:after{
  content: "";
  width: 100%;
  -moz-transition: all 0.3s;
  -webkit-transition: all 0.3s;
}

#LivFiles{
  width: 100%;
  min-height: 300px;
  margin-top: 15px;
  margin-bottom: 15px;
  text-align: center;
  padding-top: 10px;
  padding-bottom: 10px;
  background-color: #eaecee;
  background-image: url("../imgs/upload.svg");
  background-size: 100px auto;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
}

#LivFiles:before, #LivFiles:after{
  content: "";
  z-index: -1;
  position: absolute;
  bottom: 15px;
  left: 10px;
  width: 50%;
  top: 80%;
  max-width:300px;
  background: #777;
  -webkit-box-shadow: 0 15px 10px #999;
  -moz-box-shadow: 0 15px 10px #999;
  box-shadow: 0 15px 10px #999;
  -webkit-transform: rotate(-3deg);
  -moz-transform: rotate(-3deg);
  -o-transform: rotate(-3deg);
  -ms-transform: rotate(-3deg);
  transform: rotate(-3deg);
}
#LivFiles:after{
  -webkit-transform: rotate(3deg);
  -moz-transform: rotate(3deg);
  -o-transform: rotate(3deg);
  -ms-transform: rotate(3deg);
  transform: rotate(3deg);
  right: 10px;
  left: auto;
}

#ui-datepicker-div {
background: #24313C;
box-shadow: #101010 0vh 0vh 1vh 0.2vh;
margin: 4px;
border-bottom: 1px solid rgb(11, 109, 255);
display: none;
}

#ui-datepicker-div .ui-icon {
display: inherit !important;
text-indent: inherit !important;
}

.ui-datepicker-header a {
display: inline-block;
color: white;
text-decoration: none;
font-family: 'Calibri';
font-weight: bold;
position: relative;
padding: 2px 6px 2px;
border-radius: 50%;
background: rgba(0, 0, 0, 0.23);
cursor: pointer;
}

.ui-datepicker-header a:hover{
  background: #fa3a39;
}

.ui-datepicker-header a[data-handler="prev"] {
float: left;
}

.ui-datepicker-header a[data-handler="next"] {
float: right;
}

.ui-datepicker-header {
position: relative;
background: rgb(0, 106, 245);
color: white;
text-align: center;
padding: 10px;
}

.ui-datepicker-calendar {
width: 100%;
width: 200px;
color: white;
margin: 5px;
}

.ui-datepicker-calendar td {
text-align: right;
background: transparent;
padding: 0;
}

.ui-datepicker-calendar td:hover {
background: rgb(0, 106, 245);
}

.ui-datepicker-calendar td a {
height: 100%;
height: 100%;
text-decoration: none;
color: #808080;
margin: 0;
padding: 1px 5px 1px 3px;
display: block;
}

.ui-datepicker-calendar td a:hover {
color: #fff;
}

.ui-datepicker-calendar th {
text-align: right;
padding: 0;
}

.ui-datepicker-calendar th span {
padding: 1px 5px 1px 3px;
text-align: right;
}

.ui-state-highlight {
background: rgb(0, 106, 245);
color: #fff !important;
}

.ui-datepicker-month, .ui-datepicker-year{
  background: transparent !important;
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  border-bottom: 3px solid rgba(0,0,0,0.25) !important;
  margin-left: 5px;
  padding: 0px 5px;
  border-radius: 0px 0px 5px 5px;
  -webkit-appearance: none;
  -moz-appearance: none;
  cursor: pointer;
}

.ui-datepicker-month:hover, .ui-datepicker-year:hover{
  border-bottom-color: #fa3a39 !important;
}

.ui-datepicker-month option, .ui-datepicker-year option{
  background: #24313C;
  color: #fff;
  border: 0.1vh solid #24313C;
}

.ui-datepicker-month option:hover{
  background: rgb(0, 106, 245);
}

.color-black{
  color: #000;
}

.Header-Form{
  font-family: "BebasNeue-Regular";
}

.boder-table{
  border: 1px solid #454545;
  border-top: 10px solid #454545;
  padding: 5px 15px 15px 15px;
}

.modal{
  z-index: 9999999;
}

.bg-github-dev {
background: #633979;
background: -moz-linear-gradient(45deg, #633979 0%, #e53d3c 100%);
background: -webkit-linear-gradient(45deg, #633979 0%,#e53d3c 100%);
background: linear-gradient(45deg, #633979 0%,#e53d3c 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#633979', endColorstr='#e53d3c',GradientType=1 );
color: #fff !important;
}

.box-widget {
    width: 100%;
    display: inline-block;
    position: relative;
    padding: 0 !important;
    margin-bottom: 10px;
}

.box-widget-head {
    width: 100%;
    min-height: 62px;
    position: relative;
    text-align: left;
    color: rgb(120, 119, 119);
}

.box-widget-body {
    width: 100%;
    min-height: 100px;
    position: relative;
    margin: 0 !important;
    background: rgb(252, 252, 252);
    overflow: hidden;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
}

.box-widget-foot {
    width: 100%;
    min-height: 32px;
    margin: 0 !important;
    position: relative;
    overflow: hidden;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
}

.box-widget-foot h6 {
    margin: 0 !important;
}

.box-widget-tools {
    display: inline-block;
    padding: 5px 10px;
    position: absolute;
    right: 0;
    top: 0;
}

.box-widget-tools > .btn-box-tool {
    border: none;
    background: none !important;
    color: rgba(0, 0, 0, 0.46);
    cursor: pointer;
    padding: 5px;
    display: inline-block;
}

.box-widget-tools > .btn-box-tool:hover {
    color: rgba(0, 0, 0, 0.70);
}

.box-widget-head > .label-box {
    display: inline-block;
    padding: 10px;
}

.box-widget-head > .label-box h1,
.box-widget-head > .label-box h2,
.box-widget-head > .label-box h3,
.box-widget-head > .label-box h4{
  margin-top: 10px;
  padding-left: 10px;
}

#Menu {
position: fixed;
top: 0;
left: 0;
width: 200px;
height: 100%;
-moz-transition: all 0.5s;
-webkit-transition: all 0.5s;
-moz-transition: all 1s ease-in-out;
-webkit-transition: all 1s ease-in-out;
box-shadow: rgba(0, 0, 0, 0.5) 0px 0px 20px 0px;
}

#Menu:after{
  content: "";
  background: url(../imgs/wpp.jpg);
  background-position: top left;
  background-size: auto 100%;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0; left: 0;
  z-index: -2;
}

#Menu:before{
  content: "";
  background: rgba(38, 42, 50, 0.8);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0; left: 0;
  z-index: -1;
}

#Menu > ul:first-of-type {
width: 200px;
height: 100%;
text-decoration: none;
display: block;
position: relative;
overflow: auto;
}

#Menu ul, #Menu > div {
padding-left: 0 !important;
margin-top: 0 !important;
border-radius: 0%;
}

#Menu hr {
margin-top: 10px !important;
margin-bottom: 10px !important;
}

.HidenMenu {
z-index: 400;
width: 200px;
height: 100%;
background: rgb(26, 39, 47);
text-decoration: none;
display: block;
position: absolute;
top: 0;
right: 120%;
overflow-y: auto;
-moz-transition: all 0.3s;
-webkit-transition: all 0.3s;
}

.HidenMenu:target {
right: 0%;
-moz-transition: all 0.3s;
-webkit-transition: all 0.3s;
}


.CloseMenu {
padding-left: 0px !important;
-moz-transition: all 0.5s;
-webkit-transition: all 0.5s;
position: relative !important;
}

.CloseMenu i {
position: relative !important;
}

#Menu ul li,
#Menu > div > div > div > div{
display: flex;
text-decoration: none;
color: #cdcdcd;
position: relative;
}

#Menu ul li:before,
#Menu > div > div > div > div:before{
content: "";
position: absolute;
top: 0; left: 0;
height: 100%; width: 0%;
background: #d51e37;
-moz-transition: all 0.4s;
-webkit-transition: all 0.4s;
}

#Menu ul li:hover,
#Menu > div > div > div > div:hover{
color: #fff;
}

#Menu ul li:hover:before,
#Menu > div > div > div > div:hover:before{
content: "";
width: 100%;
-moz-transition: all 0.1s;
-webkit-transition: all 0.1s;
}

#Menu a {
padding: 14px 14px 14px 25px;
text-decoration: none;
color: inherit;
width: 100%;
position: relative;
font-size: 14px;
}

#Menu i {
position: absolute;
left: 10px;
top: 50%;
-moz-transform: translate(0%, -50%);
-webkit-transform: translate(0%, -50%);
}

#Menu .ReturnIco {
width: 5vh;
}

#Menu ul:first-of-type > div {
width: 100%;
height: 110px;
background: #0059ad;
}

#Menu ul:first-of-type > div > img {
height: 100%;
display: inline-block;
vertical-align: top;
margin-right: 1px;
}

#Menu ul:first-of-type > div > h4 {
display: inline-block;
margin: 0;
padding: 0;
margin-top: 35px;
color: white;
vertical-align: top;
font-size: 12px;
}

#Menu ul:first-of-type > div > h4 hr {
margin: 7px 0vh 10px 0vh;
}

#Menu ul > hr {
margin-top: 5px;
margin-bottom: 5px;
border: none;
border-bottom: 0.1vh solid rgba(6, 92, 146, 0.17);
}

#Menu .mini-navbar-nav {
background: rgb(3, 85, 164) !important;
width: 100%;
display: inline-table;
box-shadow: rgba(0,0,0,0.4) 0px 0px 35px 0px;
z-index: 100;
}

#Menu .mini-navbar-nav li {
display: table-cell;
vertical-align: middle;
width: 10%;
}

#Menu .mini-navbar-nav li a {
display: inline-block;
margin: 0;
text-align: center;
padding: 0;
color: #fff;
font-size: 17px !important;
width: 100%;
height: 100%;
padding: 8px 5px;
}

#Menu .mini-navbar-nav li a i {
width: auto !important;
font-size: inherit !important;
display: inline-block;
position: relative;
top: auto !important;
left: auto !important;
-moz-transform: translate(0%, 0%) !important;
-webkit-transform: translate(0%, 0%) !important;
}

#Menu .mini-navbar-nav form {
width: 10%;
display: table-cell;
}

.text-center{
  text-align: center;
}

.text-left{
  text-align: left;
}

.text-right{
  text-align: right;
}


.li-img-user, .li-img-user > div{
  background: #fff !important;
  color: #000;
  z-index: 10;
  border-top: 2px solid #d51e37;
}

.li-img-user:before{
  content: "";
  z-index: -1;
  background: #fff;
  display: none !important;
}

.li-img-user img{
  width: 100%;
  margin-bottom: 15px;
  margin-top: 25px;
}

.btn-active-left{
  background: #d51e37;
  color: #fff !important;
}

.Market-Left{
  border-left: 10px solid #d51e37;
  padding-left: 15px;
}

.card > .card-body input:checked ~ button {
  background: #d51e37 !important;
  border: 1px solid #fff;
}

.img-responsive{
  width: 100%;
}

.LogIN-Bck{
  z-index: 100;
  color: #4d4c4c !important;
}

.LogIN-Bck input{
  color: #FFF !important;
  background: rgba(0, 0, 0, 0.73);
  padding: 10px;
}

.LogIN-Bck:before{
  content: "";
  width: 100%;
  height: 100%;
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
  background: rgba(255, 255, 255, 0.65);
}

.LogIN-Bck:after{
  content: "";
  width: 100%;
  height: 100%;
  z-index: -2;
  position: absolute;
  top: 0;
  left: 0;
  background: url(../imgs/wpp-login.jpg);
  background-size: auto 160%;
  background-position: center;
}

.row-hover{
  background: #444761 !important;
  color: #fff !important;
}


.ScreenLoad {
    z-index: 10000;
    width: 100%;
    height: 100%;
    position: fixed;
    top: -100%;
    left: 0;
    opacity: 0;
    background: rgba(0,0,0,0.6);
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
}

.filter-process {
    filter: blur(3px) !important;
}

.ScreenLoad > div {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 20vh;
    right: 0;
    margin: auto;
}

.ScreenLoad > .sl1 > i {
    color: #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    -moz-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
}

.ScreenLoad > .sl1 {
    width: 10vh;
    height: 10vh;
    border: 1vh solid #fff;
    border-radius: 50%;
}

.ScreenLoad > .sl1:after {
    content: "";
    width: 110%;
    height: 110%;
    border: 0.5vh solid #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    border-radius: 50%;
    -moz-transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-animation: slAnimationOnda infinite 1s;
    -webkit-animation: slAnimationOnda infinite 1s;
}

@-moz-keyframes slAnimationOnda {
    0% { width: 110%; height: 110%; opacity: 1; }
    100% { width: 250%; height: 250%; opacity: 0; }
}

@-webkit-keyframes slAnimationOnda {
    0% { width: 110%; height: 110%; opacity: 1; }
    100% { width: 250%; height: 250%; opacity: 0; }
}

.ScreenLoad > .sl2 {
    width: 30vh;
    height: 30vh;
    border-top: 0.6vh solid rgba(0,0,0,0);
    border-bottom: 0.6vh solid rgba(0,0,0,0);
    border-left: 0.3vh solid #fff;
    border-right: 0.3vh solid #fff;
    border-radius: 50%;
    -moz-animation: slGiroLeft infinite 3s;
    -webkit-animation: slGiroLeft infinite 3s;
}

@-moz-keyframes slGiroLeft {
    0% { -moz-transform: rotate(0deg); }
    50% { -moz-transform: rotate(360deg); }
    100% { -moz-transform: rotate(0deg); }
}

@-webkit-keyframes slGiroLeft {
    0% { -webkit-transform: rotate(0deg); }
    50% { -webkit-transform: rotate(360deg); }
    100% { -webkit-transform: rotate(0deg); }
}

.ScreenLoad > .sl3 {
    width: 35vh;
    height: 35vh;
    border-top: 0.6vh solid rgba(0,0,0,0);
    border-bottom: 0.6vh solid rgba(0,0,0,0);
    border-left: 0.3vh solid #fff;
    border-right: 0.3vh solid #fff;
    border-radius: 50%;
    -moz-animation: slGiroRight infinite 4s 0.3s;
    -webkit-animation: slGiroRight infinite 4s 0.3s;
}

@-moz-keyframes slGiroRight {
    0% { -moz-transform: rotate(0deg); }
    50% { -moz-transform: rotate(-360deg); }
    100% { -moz-transform: rotate(0deg); }
}

@-webkit-keyframes slGiroRight {
    0% { -webkit-transform: rotate(0deg); }
    50% { -webkit-transform: rotate(-360deg); }
    100% { -webkit-transform: rotate(0deg); }
}

.ScreenLoad > h3 {
    width: 100%;
    height: 30px;
    text-align: center;
    color: #fff;
    position: absolute;
    top: 30vh;
    bottom: 0;
    left: 0;
    margin: auto;
    -moz-animation: AnimateTextLoad 2s infinite;
    -webkit-animation: AnimateTextLoad 2s infinite;
}

@-moz-keyframes AnimateTextLoad {
    0% { top: 50vh; opacity: 0; }
    30% { top: 30vh; opacity: 1; }
    70% { top: 30vh; opacity: 1; }
    100% { top: 20vh; opacity: 0; }
}

@-webkit-keyframes AnimateTextLoad {
    0% { top: 50vh; opacity: 0; }
    30% { top: 30vh; opacity: 1; }
    70% { top: 30vh; opacity: 1; }
    100% { top: 20vh; opacity: 0; }
}

.text-wrap{
  overflow: hidden; 
  text-overflow: ellipsis; 
  white-space: nowrap;
}

.row-over:hover{
  background: rgba(0,0,0,0.06) !important;
}

.dialog-delete {
z-index: 999999999999999 !important;
width: 100%;
height: 100%;
position: fixed;
top: -100%;
left: 0%;
background: rgba(0, 25, 63, 0.84);
text-align: center;
-moz-transition: all 0.5s;
-webkit-transition: all 0.5s;
}

.dialog-delete:target {
top: 0%;
-moz-transition: all 0.5s;
-webkit-transition: all 0.5s;
}

.dialog-delete > div {
width: 65%;
color: white;
display: inline-block;
position: absolute;
top: 50%;
left: 50%;
-moz-transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
}

.dialog-delete > div a {
width: 70px;
background: rgb(228, 228, 228);
padding: 10px;
display: inline-block;
color: rgb(0, 87, 200);
margin: 5px;
text-decoration: none;
}

.dialog-delete > div a:hover {
background: #0093ff;
color: #fff;
}

.input-required{
  box-shadow: rgba(255, 3, 3, 0.6) 0px 0px 20px 0px !important;
  padding-left: 5px !important;
}

#btnCallMenuLeft{
  display: none !important;
  text-align: left;
}

#btnCallMenuLeft > div{
  width: 20px;
  height: 50px;
  display: inline-block;
  float: left;
  margin-right: 5px;
}

#btnCallMenuLeft span{
  width: 100%;
  display: block;
  height: 3px;
  background: #000;
  margin-top: 5px;
}

@media (max-width:700px){
  #FxBody{
    position: absolute;
    top: 0;
    left: 0;
    width:100%;
  }

  #Menu{
    z-index: 999999;
    left: -200px;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
  }
  
  #Menu:target{
    left: 0px;
    -moz-transition: all 0.3s;
    -webkit-transition: all 0.3s;
  }

  #btnCallMenuLeft{
    display: inline-block !important;
  }
}