html *{

padding: 0px;
margin: 0px;

font-family: 'Titillium Web', sans-serif , monospace;

  /* font-family: 'Bai Jamjuree', sans-serif, monospace; */
  /* font-family: Lucida Console, Courier, monospace;  */
  /* letter-spacing: 0.01vw;*/
  /* font-family: 'Muli', sans-serif , monospace; */

}

.weirdflexbutok1{
  -webkit-clip-path: polygon(25% 0%, 100% 0%, 75% 100%, 0% 100%);
  clip-path: polygon(25% 0%, 100% 0%, 75% 100%, 0% 100%);
  background-color: #cccccc;
  opacity: 0.8;
  transition:  0.5s;
}

td {
/*white-space: nowrap !important;    */
}

.weirdflexbutok1:hover{
  background-color: #d3d3d3;
  transition:  0.5s;
}

.weirdflexbutok3{
  -webkit-clip-path: polygon(25% 0%, 100% 0%, 75% 100%, 0% 100%);
  clip-path: polygon(25% 0%, 100% 0%, 75% 100%, 0% 100%);
  background-color: #c6c6c6;
  opacity: 0.8;
  transition:  0.5s;
}

.weirdflexbutok3:hover{


  background-color: #c1c1c1;
  transition:  0.5s;

}


.weirdflexbutok4{

  -webkit-clip-path: polygon(25% 0%, 100% 0%, 75% 100%, 0% 100%);
  clip-path: polygon(25% 0%, 100% 0%, 75% 100%, 0% 100%);
  background-color: #d1d1d1;
  opacity: 0.8;
  transition:  0.5s;

}

.weirdflexbutok4:hover{


  background-color: #cecece;
  transition:  0.5s;

}


.weirdflexbutok2{

  -webkit-clip-path: polygon(25% 0%, 100% 0%, 75% 100%, 0% 100%);
  clip-path: polygon(25% 0%, 100% 0%, 75% 100%, 0% 100%);
  background-color: #35a81c;
  opacity: 0.8;
  color: white;
  transition:  0.5s;

}


.weirdflexbutok2:hover{

  background-color: #41b728;
  transition:  0.5s;
  color: white;

}



.zelossplash{

  transition: transform 2s linear;
}


.blink_reloadmats {
  animation: blinkereload 1s linear infinite;
}

@keyframes blinkereload {
  50% {
    background-color: red;
  }
}

.arrowHover{

  background-color: '';

}

.arrowHover:hover{

  background-color: '#777777';

}

textarea{

  resize: none;

}

::-webkit-media-controls-panel{

  background-color: rgba(0,0,0,0);

}

.hideScroll{

  overflow: auto;
  transition: 0.5s;

}

.hideSelect{

  background-color: rgba(0,0,0,0);
  font-size: 0.9vw;
  border: none;
  transition: 0.1s;
  color: black;

}

.hideSelect:hover{

  background-color:  #2b2b2b;
  font-size: 0.9vw;
  border: none;
  transition: 0.1s;
  color: white;

}

.hideSelect:focus{

  background-color:  #2b2b2b;
  font-size: 0.9vw;
  border: none;
  transition: 0.1s;
  color: white;

}

td * {

  font-size: 0.8vw;

}

button:focus {outline:0;}
input:focus {outline:0;}
select:focus {outline:0;}


td, tr, table, tbody, input, select, textarea{

  text-shadow: 1px 1.5px 1px rgba(0,0,0,0);

}

.innerbg{

  background-image: linear-gradient(to right top, #cbcbcb, #c7c7c7, #c3c3c3, #c0c0c0, #bcbcbc);

}

.innerbg2{

  background-image: linear-gradient(to right bottom, #b9b9b9, #b5b5b5, #b0b0b0, #acacac, #a8a8a8);

}

.circlelogo{

  background-image: linear-gradient(to right bottom, #3d3d3d, #3a3a3a, #383838, #353535, #333333);

}

.lightshadow{

  box-shadow: 1px 1.5px 1px rgba(0,0,0,0.1);

}

.bg{

background: linear-gradient(218deg, #ffffff, #b7b7b7);
background-size: 400% 400%;
overflow: hidden;

-webkit-animation: AnimationName 13s ease infinite;
-moz-animation: AnimationName 13s ease infinite;
animation: AnimationName 13s ease infinite;

@-webkit-keyframes AnimationName {
    0%{background-position:0% 10%}
    50%{background-position:100% 91%}
    100%{background-position:0% 10%}
}
@-moz-keyframes AnimationName {
    0%{background-position:0% 10%}
    50%{background-position:100% 91%}
    100%{background-position:0% 10%}
}
@keyframes AnimationName {
    0%{background-position:0% 10%}
    50%{background-position:100% 91%}
    100%{background-position:0% 10%}
}

}

.cellborder{

  /*border-top: 0.05vw solid black;
  border-bottom: none;
  border-left: none;
  border-right: 0.05vw solid black;*/

}

.ui-datepicker{

  z-index: 100000 !important;

}

.noshadow{

  text-shadow: 1px 1.5px 1px rgba(0,0,0,0);

}

.dropdown {
    position: relative;
    display: inline-block;
    float: left;
    z-index: 997;
}

.ui-th-div{

    text-shadow: 1px 1.5px 1px rgba(0,0,0,0);
}

.dividerHoursPair{


  border-bottom: 0.5vw solid #9e2525 !important;
  color: #232323 !important;
  background-color: #d3d3d3;
  opacity: 1;

}

.closedRata{

  background-color: #f2c40c;

}

.closedRata2{

  background-color: #4195e2;

}

.matfoundcontracts{

  background-color: #9ae241;

}


.itisBp{

  background-color: #ed8e2f;

}

.itisedited{

  color: #c2ff08 !important;
  background-color: #8c8c8c;

}

.materialFound{

  background-color: #4dc14d;

}

.materialFoundButExpired{

  background-color: yellow;

}

.materialnotFound{

 background-color: #ff7f7f;


}

.dividerHoursDis{

  border-bottom: 0.25vw solid #9e2525 !important;
  color: #232323;
  background-color: #d8d8d8;

}

.row1{

  color: #232323 !important;
  background-color: #d3d3d3;
  opacity: 1;
  transition: 0.1s;

}
.row2{

  color: #232323;
  background-color: #d8d8d8;
  transition: 0.1s;

}


.ui-state-hover {


}

.context{

background-color: #c4c4c4;
transition: .2s;

}

.context:hover{

background-color: #aaaaaa;
transition: .2s;
}

.ui-jqgrid .ui-state-hover {
  background: #bababa !important;
  border-right: 1px solid #bababa !important;

}


.dropdown-content {

    transition: .5s;
    display: none;
    position: fixed;
    background-color: #333333;
    width: 30vw;
    margin-top: 0.55vw;
    z-index: 997;

}

.blur5{

  filter:blur(5px);
  transition: .5s;

}

.blur1{

  transition: .5s;

}

.menu{

 color: white;
 border-right: 1px solid #383838;
 border-bottom: none;
 transition: .2s;


}

.menu:hover{

background-color: #1c1c1c;
border-top: 2px solid #ff5151;
transition: .2s;


}

.menuitem{

  color: white;
  transition: .2s;
}

.menuitem:hover{

  color: #ff5151;
  transition: .2s;
  font-weight: bold;
}

.dropdown:hover .dropdown-content {
    display: block;
    transition: .5s;
}

textarea:focus, input:focus{
    outline: none;
}

html *{
  /*-webkit-user-select: none;*/
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;

  padding: 0px;
  margin: 0px;
}

input[type='checkbox'] {
    width:1.5vw;
    height:3vh;
    background:white;
    border-radius:5px;
    border:2px solid #555;
}



::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #cccccc;
    opacity: 1; /* Firefox */
}

.reminder{
 -webkit-transition: background 0.1s;
  background: none;

}

.reminder:hover{
 -webkit-transition: background 0.1s;
  background: rgba(0, 0, 0,0.5);

}

.body{

  max-width: 32vw;
  max-height: 27vw;
  background-color: #282828;
  color: white;
}

.lead{
  font-family: Verdana;
}

button:focus {
    outline: none;
}

img {
  pointer-events: none
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -o-user-select: none;
  user-select: none;
}

::-webkit-scrollbar-track
{

	border-radius: 1vw;
	background-color: trasparent;
}

::-webkit-scrollbar
{
	width: 0.5vw;
  height: 0.75vw;
  border-radius: 0.25vw;
  margin-top: 0.5vw;
	background-color: trasparent;
  position: absolute;
}

::-webkit-scrollbar-thumb
{
	border-radius: 0.5vw;
	background-color: #a8a8a8;
}
::-webkit-scrollbar-corner {
    background-color: transparent;
}


.text{
font-family: 'Titillium Web', sans-serif;
}

.topbar{
  box-sizing: border-box;
  max-width: 100%;
  max-height: 6%;
  min-width: 100%;
  min-height: 6%;
  background-color: #212121;
  border-bottom: 2px solid #3369af;
}

.main{
  color: white;
  max-width: 100%;
  max-height: 100%;
  min-width: 100%;
  min-height: 100%;
  overflow-y: hidden;
  overflow-x: hidden;

}


.scrollbar{
::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	border-radius: 0.5vw;
	background: none;
}

::-webkit-scrollbar
{
	width: 0.4vw;
  border-radius: 0.5vw;
  margin-top: 0.25vw;
	background-color: none;
  position: absolute;
}

::-webkit-scrollbar-thumb
{
	border-radius: 0.5vw;
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
	background-color: #afafaf;
}
::-webkit-scrollbar-corner {
    background-color: transparent;
}
}

.inputv2{

  color: #3a3a3a;  font-size: 0.95vw; background-color: #d8d8d8; padding-top: 0vw !important;
  border: 1px solid  #8c8c8c; width: 100%; height: 1.75vw; box-sizing: border-box; padding-left: 0.5vw; border-radius: 0.5vw;

}

.calendarDay{

  opacity: 0.65;
  transition: 0.3s;

}

.calendarDay:hover{

  opacity: 0.8;
  transition: 0.3s;

}

.inputv2no{

  color: #3a3a3a;  font-size: 0.95vw; background-color: #d8d8d8;
  border: 1px solid  #8c8c8c; width: 100%; height: 1.75vw; box-sizing: border-box; padding-left: 0.5vw; padding-top: 0vw !important; border-radius: 0.5vw;
  transition: 0.7s;

}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    /* display: none; <- Crashes Chrome on hover */
    -webkit-appearance: none;
    margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}

.inputv2no:hover{

  color: #d6d6d6;  font-size: 0.95vw; background-color: #a83737; border: 0.05vw solid #7c2626;
  transition: 0.7s;
  border: 1px solid  #8c8c8c; width: 100%; height: 1.75vw; box-sizing: border-box; padding-left: 0.5vw; border-radius: 0.5vw;

}

.inputv3{

 background-color:#e0e0e0;
    color: #3a3a3a;  font-size: 0.95vw;
    border: 1px solid  #8c8c8c; width: 100%; height: 1.75vw; box-sizing: border-box; padding-left: 0.5vw; border-radius: 0.5vw;
}

.buttonv2{

  width: 10vw; margin-top: 4vw; background-color: #848484; border: 0.05vw solid #6d6d6d; color: #1c1c1c;
   border-radius: 0.5vw; box-sizing: border-box;  padding: 0.25vw; height: 2vw;
   transition: .7s;

}

.buttonv2:hover{

  width: 10vw; margin-top: 4vw; background-color: #4fa341; border: 0.05vw solid #3c7533; color: #d6d6d6;
   border-radius: 0.5vw; box-sizing: border-box;  padding: 0.25vw; height: 2vw;
   transition: .7s;

}

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #969696;
    opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #969696;
}

::-ms-input-placeholder { /* Microsoft Edge */
    color: #969696;
}

.buttonv3{

  width: 10vw; margin-top: 4vw; background-color: #d6d6d6; border: 0.05vw solid #6d6d6d; color: #1c1c1c;
   border-radius: 0.5vw; box-sizing: border-box;  padding: 0.25vw; padding-top: 0.1vw; height: 2vw;
   transition: .7s;

}

.buttonv3:hover{

  width: 10vw; margin-top: 4vw; background-color: #4fa341; border: 0.05vw solid #3c7533; color: #d6d6d6;
   border-radius: 0.5vw; box-sizing: border-box;  padding: 0.25vw; padding-top: 0.1vw height: 2vw;
   transition: .7s;

}



.buttonv3no{

    width: 10vw; margin-top: 4vw; background-color: #d6d6d6; border: 0.05vw solid #6d6d6d; color: #1c1c1c;
   border-radius: 0.5vw; box-sizing: border-box;  padding: 0.25vw; height: 2vw;
   transition: .7s;

}

.buttonv3no:hover{

   width: 10vw; margin-top: 4vw; background-color: #a83737; border: 0.05vw solid #7c2626; color: #d6d6d6;
   border-radius: 0.5vw; box-sizing: border-box;  padding: 0.25vw; height: 2vw;
   transition: .7s;

}


.disabled{

  opacity: 0.5;

}

.menuSide{

  transition: .5s;
  color: #2b2b2b;
  background-color: #cecece;

}

.menuSide:hover{

  transition: .5s;
  color: #2b2b2b;
  background-color: #d8d8d8;

}

.loginButton{
width: 10vw; height: 2vw; float: right; border-radius: 2.5vw; margin-top: 2vw; margin-right: 1.5vw; color: #dbdbdb; background-color: #939393; font-size: 1vw; border: none;
transition: .5s;
}

.loginButton:hover{
width: 10vw; height: 2vw; float: right; border-radius: 2.5vw; margin-top: 2vw; margin-right: 1.5vw; color: #dbdbdb; background-color: #4ba045; font-size: 1vw; border: none;
transition: .5s; transform: scale(1.05);
}

.buttonImage{

  opacity: 0.7;
  transition: 0.4s;

}

.buttonImage:hover{

    opacity: 0.9;
    transition: 0.4s;


}

.nextgen{

    width: 15; position: relative;
    font-size: 1vw;
    float: left; border: none;
    height: 2vw; box-sizing: border-box;
    padding-left: 0.5vw;
    background-color: #c1c1c1; color: black;
    transition: .3s;

}

.nextgen:hover{

    width: 15; position: relative;
    font-size: 1vw;
    float: left; border: none;
    height: 2vw; box-sizing: border-box;
    padding-left: 0.5vw;
    background-color: #b2b2b2; color: black;
    transition: .3s;

}



.nextgen2 , .nextgen2yes , .nextgen2no{

    width: 15; position: relative;
    font-size: 1vw;
    float: left; border: none;
    height: 2vw; box-sizing: border-box;
    padding-left: 0.5vw;
    background-color: #b2b2b2; color: black;
    transition: .3s;

}

.nextgen2:hover , .nextgen2:focus{

    width: 15; position: relative;
    font-size: 1vw;
    float: left; border: none;
    height: 2vw; box-sizing: border-box;
    padding-left: 0.5vw;
    background-color: #a5a5a5; color: black;
    transition: .3s;

}

.nextgen2yes:hover{

    width: 15; position: relative;
    font-size: 1vw;
    float: left; border: none;
    height: 2vw; box-sizing: border-box;
    padding-left: 0.5vw;
    background-color: #58a531; color: black;
    transition: .3s;

}

.nextgen2no:hover{

    width: 15; position: relative;
    font-size: 1vw;
    float: left; border: none;
    height: 2vw; box-sizing: border-box;
    padding-left: 0.5vw;
    background-color: #a81b1b; color: black;
    transition: .3s;

}

.nextgen3{

    width: 15; position: relative;
    font-size: 1vw;
    float: left; border: none;
    height: 2vw; box-sizing: border-box;
    padding-left: 0.5vw;
    background-color: #828282; color: black;
    transition: .3s;

}

.nextgen3:hover{

    width: 15; position: relative;
    font-size: 1vw;
    float: left; border: none;
    height: 2vw; box-sizing: border-box;
    padding-left: 0.5vw;
    background-color: #969696; color: black;
    transition: .3s;

}



.nextgen4{

    width: 15; position: relative;
    font-size: 1vw;
    float: left; border: none;
    height: 2vw; box-sizing: border-box;
    padding-left: 1vw;
    background-color: #aaaaaa; color: black;
    transition: .3s;

}

.nextgen4:hover{

    width: 15; position: relative;
    font-size: 1vw;
    float: left; border: none;
    height: 2vw; box-sizing: border-box;
    padding-left: 1vw;
    background-color: #b2b2b2; color: black;
    transition: .3s;

}



.shakebell {
  animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
  transform: translate3d(0, 0, 0);
  backface-visibility: hidden;
  perspective: 1000px;
}

@keyframes shake {
  10%, 90% {
    transform: translate3d(-1px, 0, 0);
  }

  20%, 80% {
    transform: translate3d(2px, 0, 0);
  }

  30%, 50%, 70% {
    transform: translate3d(-2px, 0, 0);
  }

  40%, 60% {
    transform: translate3d(2px, 0, 0);
  }
}


.notificationMenu {

  -webkit-clip-path: polygon(0 100%, 100% 100%, 100% 8%, 70% 8%, 50% 0, 30% 8%, 0 8%);
  clip-path: polygon(0 100%, 100% 100%, 100% 8%, 70% 8%, 50% 0, 30% 8%, 0 8%);
  width: 16vw; height: 17.5vw;

}

.tasksInner {

  -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 95%, 58% 95%, 50% 100%, 42% 95%, 0 95%);
  clip-path: polygon(0% 0%, 100% 0%, 100% 95%, 58% 95%, 50% 100%, 42% 95%, 0 95%);
  width: 31vw; height: 20vw;

}

.messagew100h100{

  -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 95%, 58% 95%, 50% 100%, 42% 95%, 0 95%);
  clip-path: polygon(0% 0%, 100% 0%, 100% 95%, 58% 95%, 50% 100%, 42% 95%, 0 95%);
  width: 100%; height: 100%;

}

.isto1{

  opacity: 0.8;
  transition: 0.3s;

}

.isto1:hover{

    opacity: 1;
    transition: 0.3s;

}

.isto2{

  opacity: 0.8;
  transition: 0.3s;

}

.isto2:hover{

    opacity: 1;
    transition: 0.3s;

}

.istoRightTime{

-webkit-clip-path: polygon(11% 0, 100% 0, 100% 100%, 11% 100%, 0 46%);
clip-path: polygon(11% 0, 100% 0, 100% 100%, 11% 100%, 0 46%);

}



@keyframes blink {
   from, to {
        border-color: transparent
    }
   50% { border-color: #e80000; }
}
.blinkBorder{ /*or other element you want*/
    animation-name: blink ;
    animation-duration: .45s ;
    animation-timing-function: step-end ;
    animation-iteration-count: infinite ;
    animation-direction: alternate ;
}
