* {
  box-sizing: border-box;
}
body{
		background: linear-gradient(30deg, #2BB5FF, #333fff);
        background-position: center;
        background-size: 100%;
}
.logo{
		width: 20%;
		cursor: not-allowed;
        float: left;
		animation: movedown 1s linear 1;
		animation-delay: 1s;
		visibility: hidden;
		animation-fill-mode: forwards;
}
@keyframes movedown{
        0%{
		transform: translateY(-100px);
		visibility: visible;
        }
        100%{
		transform: translateY(0);
		visibility: visible;
	}
}
.titlu {
       float: left;
       width: 80%;
       padding: 0.5%;
       text-align: center;
       font-family: Arial;
       color: #edfffb;
}
.titlu_logo{
            float: left;
            width: 20%;
            text-align: center;
            color: #ffffff;
}
.titlu_dreapta{
               float: left;
               width: 80%;
               text-align: center;
               animation: moveleft 1s linear 1;
               animation-delay: 2s;
               visibility: hidden;
               animation-fill-mode: forwards;
}
@keyframes moveleft{
        0%{
		transform: translateX(100px);
		visibility: visible;
        }
        100%{
		transform: translateX(0);
		visibility: visible;
	}
}
.titlu_dreapta a{
               background: linear-gradient(30deg, #2BB5FF, #ffffff, #2BB5FF);
               width: 100%;
               padding: 1.5%;
               border-bottom-style:groove;
               border-radius: 8px;
               text-decoration: none;
               color: black;
               font-size: smaller; 
}
.titlu_dreapta a:hover{
               color: #333fff;
}
.menu {
      float: left;
      width: 15%;
      text-align: center;
}
.menu a{
      background: linear-gradient(30deg, #ffffff, #2BB5FF);
      padding: 3%;
      margin-top: 1%;
      display: block;
      width: 100%;
      border-bottom-style:groove;
      border-radius: 15px;
      text-decoration: none;
      color: black;
}
.main {
      float: left;
      width: 100%;
      font-family: Times New Roman;
      color: #e5e5e5;
      animation: moveright 1s linear 1;
      animation-delay: 3s;
      visibility: hidden;
      animation-fill-mode: forwards;
}
@keyframes moveright{
        0%{
		transform: translateX(-100px);
		visibility: visible;
        }
        100%{
		transform: translateX(0);
		visibility: visible;
	}
}
.tabel_1{
       width: 100%;
}
th{
   font-family: Times New Roman;
   color: #edfffb;
   font-size: 15px;
}
td{
   font-family: Arial;
   color: #edfffe;
   font-size: 15px;
}
.tabel_2{
        width: 100%;
        font-family: Times New Roman;
        color: black;
}
.tabel_2 td,th{
   font-family: Times New Roman;
   color: #333333;
   font-size: small;  
}
.tabel_3{
        width: 100%;
}
.tabel_3 th{
   font-family: Times New Roman;
   color: black;
   font-size:large;
}        
.tabel_3 td{
   font-family: Times New Roman;
   color: #333333;
   font-size: medium;  
}
.left {
       float: left;
       width: 50%;
       padding: 0.5%;
       text-align: center;
}
.right {
       float: left;
       width: 50%;
       padding: 0.5%;
       text-align: center;
}
.extra{
          background: linear-gradient(30deg, #2BB5FF, #ffffff, #2BB5FF);
          float: left;
          width: 100%;
          font-family: Times New Roman;
          color: #333333;
          font-size: smaller; 
}
.pagina_jos{
          float: left;
          width: 100%;
          text-align: center;
          font-family: Times New Roman;
          color: #800000;
          font-size: smaller;          
}
.pagina_jos a{
        margin-top: 1%;
        width: 100%;
        text-align: center;
        text-decoration: none;
        font-family: Times New Roman;
        color: #80476C;
}
.button {
  display: inline-block;
  width: 50%;
  padding: 15px 25px;
  font-size: 18px;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  outline: none;
  color: #ffffff;
  background: linear-gradient(30deg, #2BB5FF, #333fff);
  border: none;
  border-radius: 15px;
  box-shadow: 0 7px #333fff;
}

.button:hover {
              background-color: #2BB5FF;
              color: #333333;              
}

.button:active {
  background-color: #3e8e41;
  box-shadow: 0 5px #666;
  transform: translateY(4px);
}

@media only screen and (max-width: 620px) {
  /* For mobile phones: */
  .main, .left, .right, .titlu, .titlu_logo, .titlu_dreapta, .tabel_1, .tabel_2, tabel_3, .extra, .button, .pagina_jos{
    width: 100%;
  }
}