/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : Dec 28, 2020, 11:15:33 AM
    Author     : LOYNSS
*/
/*  Shake animation  */
@charset "UTF-8";

.animated {
  -webkit-animation-duration: 1s;
       -moz-animation-duration: 1s;
         -o-animation-duration: 1s;
            animation-duration: 1s;
    -webkit-animation-fill-mode: both;
       -moz-animation-fill-mode: both;
         -o-animation-fill-mode: both;
            animation-fill-mode: both;
}

.animated.hinges {
    -webkit-animation-duration: 2s;
       -moz-animation-duration: 2s;
         -o-animation-duration: 2s;
            animation-duration: 2s;
}

.animated.slow {
    -webkit-animation-duration: 3s;
       -moz-animation-duration: 3s;
         -o-animation-duration: 3s;
            animation-duration: 3s;
}

.animated.snail {
    -webkit-animation-duration: 4s;
       -moz-animation-duration: 4s;
         -o-animation-duration: 4s;
            animation-duration: 4s;
}

@-webkit-keyframes shake {
    0%, 100% {-webkit-transform: translateX(0);}
    10%, 30%, 50%, 70%, 90% {-webkit-transform: translateX(-10px);}
    20%, 40%, 60%, 80% {-webkit-transform: translateX(10px);}
}

@-moz-keyframes shake {
    0%, 100% {-moz-transform: translateX(0);}
    10%, 30%, 50%, 70%, 90% {-moz-transform: translateX(-10px);}
    20%, 40%, 60%, 80% {-moz-transform: translateX(10px);}
}

@-o-keyframes shake {
    0%, 100% {-o-transform: translateX(0);}
    10%, 30%, 50%, 70%, 90% {-o-transform: translateX(-10px);}
    20%, 40%, 60%, 80% {-o-transform: translateX(10px);}
}

@keyframes shake {
    0%, 100% {transform: translateX(0);}
    10%, 30%, 50%, 70%, 90% {transform: translateX(-10px);}
    20%, 40%, 60%, 80% {transform: translateX(10px);}
}

.shake {
    -webkit-animation-name: shake;
    -moz-animation-name: shake;
    -o-animation-name: shake;
    animation-name: shake;
}
/* Style the tab */
.tab {
  overflow: hidden;
  width: 98%;
  margin-left: 0px;
}

/* Style the buttons inside the tab */
.tab button {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 20px 22px;
  transition: 0.3s;
  font-size: 12px;
  color: blue;
}

/* Change background color of buttons on hover */
.tab button:hover {
  background-color: #8B0000;
}

/* Create an active/current tablink class */
.tab button.active {
  background-color: #8B0000;
}

/* Style the tab content */
.tabcontent {
  display: none;
  width: 100%;
  padding: 6px 6px;
  margin-left: 0px;
  border-top: 1px solid #ccc;
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
  border-top: none;
  max-height: 240px;
  min-height: 240px;
}

.dropdownlist1 {
     display: none;
}
