@charset 'UTF-8';

 /* ------------------ */
 /*   GENERAL CSS      */
 /* ------------------ */

 @font-face {
  font-family: Bebas Neue;
  src: url(../fonts/BebasNeue.otf);
  src: url(../fonts/BebasNeue.woff);
}

 body {
  background: white;
  color: white;
  font-size: 12pt;
  margin: 0;
  padding: 0;
  font-family: 'Myriad Pro', sans-serif;
  /* overflow: hidden; */
}

ul {
  margin: 0;
  padding: 0;
}

li {
  text-decoration: none;
  list-style: none;
}

table {
  margin: 1em 0;
  width: 100%;
}

thead {
  font-weight: bold;
}

label {
  margin-top: 0.5em;
}

input, textarea, select, option {
  width: auto;
  color: white;
  width: 70%;
  font-family: 'Myriad Pro', sans-serif;
  border: 2px solid white;
  background: transparent;
  border-radius: 5px;
  line-height: 1.1em;
  font-size: 1em;
  padding: 0.3em;
  margin: 0.3em auto; 
}

/* width */
::-webkit-scrollbar {
    width: 5px;
}

/* Track */
::-webkit-scrollbar-track { 
    background: #00634f;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #d3d828;
}

::placeholder {
  color: white;
  text-align: center;
}

select {
  width: 91%;
  line-height: 1.25em;
  border-radius: 5px;
}

textarea {
  height: 8em;
  max-height: 6em;
  resize: none;
}

button {
  font-family: 'Bebas Neue';
  background: transparent;
  border: 2px solid white;
  border-radius: 5px;
  margin: 1em auto;
  width: 8em;
  font-size: 1em;
  padding: 0.5em 2em;
  text-align: center;
  cursor: pointer;
  color: white;
}

button:hover {
  background: white;
  color: #00634f;
  transition: 0.25s;
}

button:disabled {
  background: grey;
  color: #141414;
}

hr {
  margin: 1em auto;
  border: 1px solid white;
}

.title {
  font-family: 'Bebas Neue';
  font-size: 3em;
  margin: 0 auto;
  color: #00634f;
}

.head {
  width: 100%;
  height: 3.5em;
  background: white;
  position: fixed;
  z-index: 1;
  display: flex;
  flex-direction: row;
}

.branding {
  position: absolute;
}

.branding img {
  height: 3em;
  margin: 0.25em 3em; 
}

.menu {
  margin: 0 auto;
}

.menu li {
  display: inline-block;
  color: #00634f;
  font-size: 1.5em;
  margin: 0.5em 1em;
  font-family: 'Bebas Neue';
  cursor: pointer;
}

.mobile {
  display: none;
}

.section {
  	background-repeat: no-repeat;
  	background-position: top;
  	background-size: cover;
  	position: relative;
  	display: flex;
  	flex-direction: row;
  	overflow: auto;
  	height: 100vh;
}

.column {
    display: flex;
    flex-direction: column;
}

.row {
    display: flex;
    flex-direction: row;  
}

.half {
  width: 50%;
}

.inner {
  width: 80%;
  margin: 3em auto;
  text-align: center;
}

.inner img {
  width: 8em;
  margin: 0 auto;
}

.fluid, .nofluid {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
}

.local {
  right: 10px;
  position: absolute;
  font-size: 0.9em;
  color: #00634f;
  margin: 1em;
}

.label {
    position: fixed;
    width: 200px;
    font-size: 0.9em;
    text-align: center;
    padding: 10px 5px;
    background: tomato;
    cursor: pointer;
    color: white;
    top: 4em;
    right: 0;
    z-index: 1;
}

.main {
    background-image: url(../images/main.jpg);
}

.about {
  color: #161616;
}

.contact {
  background: #00634f;
}

.values {
    background-image: url(../images/patio.jpg);
}

.main .logo {
  	width: 28em;
  	display: flex;
  	margin: 0 auto;
  	justify-content: center;
  	flex-direction: column;
  	align-content: center;
  	text-align: center;
  	font-style: italic; 
}

.container, .container2, .container3 {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    margin: 0 auto;
    width: 90%;
}

.container2 {
    width: 90%;
}

.container3 {
    width: 100%;
}

.masonry, .masonry-gallery {
    column-count: 4;
    column-gap: 1em;
    margin: 4em 1em 0 1em;
    padding: 0;
    column-gap: 1em;
    font-size: .85em;
}

.masonry-gallery { 
    column-count: 5;
}

.masonry-gallery .item img {
    width: 100%;
    height: 25vh;
    object-fit: cover;
}

.item {
    position: relative;
    display: inline-block;
    background: #fff;
    padding: 0;
    margin: 0.5em auto;
    width: 100%;
    box-sizing: border-box;
    cursor: pointer;
    /* box-shadow: 2px 2px 4px 0 #ccc; */
}

.image {
    max-width:100%;
    padding: 0;
    margin: 0 auto;
    object-fit: cover;
    opacity: 1;
    display: block;
    height: auto;
    transition: .5s ease;
    backface-visibility: hidden;
}

.tall img {
  height: 50vh;
}

.medium img {
  height: 41vh;
}

.small img {
  height: 30vh;
}

.item:hover .image {
  opacity: 0.3;
}

.item:hover .middle {
  opacity: 1;
}

.middle {
  transition: .5s ease;
  opacity: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
}

.small-label {
  position: absolute;
  padding: 2.5% 5%;
  width: 90%;
  bottom: 0;
}

.yellow {
  background: #d3d828;
  color: #00634f;
}

.green {
  background: #00634f;
}

.text {
  font-family: 'Bebas Neue';
  color: #00634f;
  font-size: 2em;
}

.box {
  background: rgba(255, 255, 255, 0.9);
  color: #161616;
  text-align: left;
  padding: 1em;
  border-radius: 5px;
  width: -moz-available;          /* WebKit-based browsers will ignore this. */
  width: -webkit-fill-available;  /* Mozilla-based browsers will ignore this. */
  width: fill-available;
  margin: 0.5em;
}

 /* ------------------ */
 /*   MODAL CSS    */
 /* ------------------ */

.modal, .modal-extra, .modal-galeria {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100vh;
    margin: 0 auto;
    padding: 0;
    background: #fff;
    border-radius: 4px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.3);
    overflow: auto;
    z-index: 2;
}

.modal-extra {
    top: 2em;
    width: 770px;
    max-height: 500px;
    border: 5px solid tomato;
    background: url(../images/bg-covid.jpg);
    background-repeat: no-repeat;
    color: white;
}

.modal-galeria {
    top: 1em;
    width: 80%;
    max-height: 90vh;
}

.modal-galeria img {
    width: 100%;
    margin: auto;
}

.modal-galeria .small-label {
  position: absolute;
  height: 20px;
  padding: 1em;
  width: auto;
  top: 0;
}

.banner {
    background: rgba(0,0,0, 0.7);
    position: relative;
    width: 70%;
    margin: 7em auto;
    padding: 1em;
}

.bg_image {
    width: 100%;
}

.overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.75);
    z-index: 2;
}

.slash {
    top: 1.5em;
    padding: 1em;
    position: fixed;
    border-radius: 5px;
    background: rgba(0, 0, 0, 0.6);
    z-index: 3;
    width: 270px;
    left: -305px;
    transition: 0.5s;
}

.slash.move {
    left: 5px;
    transition: 0.5s;
}

.slash_btn {
    position: absolute;
    top: 30px;
    left: 310px;
    padding: 0;
    width: 50px;
    font-size: 2em;
    background: #00634f;
}

.modal-close-btn {
    position: fixed;
    right: 15px;
    top: 0;
    font-size: 1.5em;
    width: 40px;
    height: 40px;
    padding: 0.25em 0.5em;
    cursor: pointer;
    border: none;
    background: #00634f;
}

.modal-close-btn:hover {
    background: #d3d828;
    transition: 0.5s;
    color: white;
}

 /* -------------------- */
 /*      PRELOADER       */
 /* -------------------- */

#page-loader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
    background: #FFF none repeat scroll 0% 0%;
    z-index: 4;
}

#page-loader .preloader-interior {
    display: block;
    position: relative;
    left: 50%;
    top: 50%;
    width: 150px;
    height: 150px;
    margin: -75px 0 0 -75px;
    border: 3px solid transparent;
    animation: rotate 3s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
}

@keyframes rotate {
    from {
      -moz-transform: rotateY(0deg);
      -ms-transform: rotateY(0deg);
      transform: rotateY(0deg);
    }
    to {
      -moz-transform: rotateY(-360deg);
      -ms-transform: rotateY(-360deg);
      transform: rotateY(-360deg);
    }
  }

/* ------------------ */
 /*     BUTTON CSS     */
 /* ------------------ */

 /*   button     */
#button {
    display: inline-block;
    background: #00634f;
    width: 40px;
    height: 40px;
    padding: 0.1em;
    text-align: center;
    position: fixed;
    bottom: 50px;
    right: 30px;
    transition: background-color .3s, 
    opacity .5s, visibility .5s;
    opacity: 0;
    visibility: hidden;
    z-index: 1;
    transform: rotate(-90deg);
}

#button img {
    width: 40px;
}

#button::after {
    font-weight: normal;
    font-style: normal;
    font-size: 2em;
    line-height: 50px;
    color: white;
}

#button:hover {
    cursor: pointer;
    background: #d3d828;
}

#button:active {
    background-color: #555;
}

#button.show {
    opacity: 1;
    visibility: visible;
}

 /* -------------------- */
 /*  TABLET-DESKTOP CSS  */
 /* -------------------- */

@media screen and (max-width:968px)
{
  .section {
      height: auto; 
  }

  .main {
      height: 100vh !important;
  }

  .container, .container2 {
      margin-top: 6em;
      width: 95%;
  }

  .inner img {
      width: 6em;
      margin: 1em auto;
  }

  .bg_image {
      width: auto; 
      height: 100vh;
  }

  #mySidenav {
      position: fixed;
      width: 100%;
      top: -480px;
      transition: 0.5s;
  }

  #mySidenav.move {
      top: 55px;
      transition: 0.5s;
  }

  .mobile {
      display: block;
      position: absolute;
      top: 0;
      margin: 0;
      right: 20px;
      z-index: 2;
  }

  .mobilenav {
      border: 3px solid #00634f;
      margin-top: 40px;
      background: white;
      border-radius: 10px;
      font-size: 3em;
      padding: 0;
      width: 50px;
      color: #00634f;
  }

  .menu ul {
      width: 100%;
      height: auto;
      background: white;
      margin: 0;
  }

  .menu ul li {
      display: flex;
      flex-direction: column;
      text-align: center;
      padding: 1em 0;
      margin: 0 auto;
      width: 60%;
      border-bottom: 1px solid white;
  }

  .active {
    background: #00634f !important;
    color: white !important;
  }

  .label {
      right: 80px;
  }
  
  .nofluid {
    flex-wrap: wrap;
  }
}

 /* -------------------- */
 /*  TABLET-DESKTOP CSS  */
 /* -------------------- */

@media screen and (max-width:768px)
{
  .masonry, .masonry-gallery {
      column-count: 2;
      column-gap: 1em;
  }

  .office {
      overflow-y: auto;
  }

  .modal-extra {
    top: 40px;
    width: 95%;
    max-height: auto;
    background-position: center center;
  }

  .modal-galeria {
    max-height: none;
    height: auto;
  }

  .banner {
    width: 85%;
  }
}

 /* -------------------- */
 /*  TABLET-MOVIL CSS    */
 /* -------------------- */

@media screen and (max-width:640px)
{
  .main .logo {
    width: 20em;
    margin: 0.5em auto;
  }

  .container {
    justify-content: end;
  }

  .row {
    flex-direction: column;
  }

  .inner {
    margin: 1em auto;
  }

  .contact .inner {
    margin: 3em auto;
  }

  .half {
    width: 100%;
  }

  iframe {
    height: 50vh;
  }
}

 /* -------------------- */
 /*  TABLET-MOVIL CSS    */
 /* -------------------- */

@media screen and (max-width:480px)
{
  .main .logo {
    width: 16em;
    margin: 0.5em auto;
  }

  .masonry {
      column-count: 1;
      column-gap: 1em;
  }
}

 /* -------------------- */
 /*       ALERTAS        */
 /* -------------------- */

.alert {
    display: none;
    flex-direction: row;
    align-items: center;
    border: none; 
    color: white; 
    padding: 1em; 
    cursor: pointer; 
    font-family: futura, sans-serif;
    position: fixed;
    z-index: 1000;
    top: 5%;
    right: 2.5%;
    font-size: 0.8em;
}

.close {
    margin: 0 0 0 1em;
    border: 1px solid white;
    padding: 0.2em 0.5em;
    border-radius: 50px;
}

.success {
    background-color: #b3d8cc;;
} 

.success:hover {
    background-color: white;
    color: #b3d8cc;;
    transition: 0.25s;
    border: 2px solid #b3d8cc;;
}

.danger {
    background-color: tomato;
} 

.danger:hover {
    background-color: white;
    color: tomato;
    transition: 0.25s;
    border: 2px solid tomato;
}

 /* -------------------- */
 /*      PRELOADER       */
 /* -------------------- */

#page-loader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
    background: #FFF none repeat scroll 0% 0%;
    z-index: 4;
}

#page-loader .preloader-interior {
    display: block;
    position: relative;
    left: 50%;
    top: 50%;
    width: 150px;
    height: 150px;
    margin: -75px 0 0 -75px;
    border: 3px solid transparent;
    animation: rotate 3s linear infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
}

@keyframes rotate {
    from {
      -moz-transform: rotateY(0deg);
      -ms-transform: rotateY(0deg);
      transform: rotateY(0deg);
    }
    to {
      -moz-transform: rotateY(-360deg);
      -ms-transform: rotateY(-360deg);
      transform: rotateY(-360deg);
    }
  }

/* ----------------------------------------------
 * Generated by Animista on 2020-10-5 18:10:58
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation slide-in-top
 * ----------------------------------------
 */

.slide-in-top {
  -webkit-animation: slide-in-top 2.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
          animation: slide-in-top 2.5s cubic-bezier(0.250, 0.460, 0.450, 0.940) both;
}

@-webkit-keyframes slide-in-top {
  0% {
    -webkit-transform: translateY(-1000px);
            transform: translateY(-1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@keyframes slide-in-top {
  0% {
    -webkit-transform: translateY(-1000px);
            transform: translateY(-1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}


/* -------------------- */
/* ---- ADMIN STYLE --- */
/* -------------------- */

.adm {
  background: white;
  color: white;
  font-size: 14pt;
  margin: 0;
  color: #5d5d5d;
  font-family: 'Myriad Pro', 'Sans-serif';
}


nav {
  padding: 1em 0; 
}

.divide {
  width: 100%;
  border: 1px solid grey;
}

.main_adm {
  margin: 0 3em;
}

.foot_adm {
  border-top: 2px solid #00634f;
  text-align: center;
  font-size: 0.9em;
  width: 99%;
  margin-left: 0.3em;
  position: fixed;
  bottom: 0.5em;
  background: white;
  color: #141414;
}

.codebox-admin {
  width: 150px;
}

.table_adm {
  width: 100%;
  border-spacing: 0;
  margin: 0.5em 0;
  color: #5d5d5d;
}

.table_adm th {
  padding: 0.25em 0;
  border-bottom: 1px solid grey;
  text-align: left;
  color: #5d5d5d;
}

.table_adm td {
  margin: 0.5em 0.5em;
}

.table_adm tr:nth-child(even) {
  background-color: #f2f2f2;
}

.table_adm .tr:hover {
  background: rgba(26,188,156,0.15);
}

.table_adm button {
  border: none;
  font-size: 1.1em;
  background: transparent;
}

.button_adm {
  font-family: 'Bebas Neue' !important;
  border: 2px solid #00634f !important;
  border-radius: 5px !important;
  margin: 1em auto !important;
  width: 8em !important;
  font-size: 1em !important;
  padding: 0.5em 2em !important;
  text-align: center !important;
  cursor: pointer !important;
  color: #141414 !important;
}

.button_adm:hover {
  color: #00634f !important;
  transition: 0.25s !important;
}

.button_adm:disabled {
  background: grey !important;
  color: #141414 !important;
}

.main_adm .diamond_adm {
  display: flex;
  justify-content: center;
  align-items: center;
  border: 3px solid #00634f;
  width: 2em;
  height: 2em;
  margin: 0 0.25em;
}

.main_adm .diamond_adm i {
  font-size: 1em;
}

.main_adm .red_adm {
  border: 3px solid tomato !important;
  color: tomato;
}

.col100_adm {
  width:100%;
}

.col70_adm {
  width: 70%;
}

.col45_adm {
  width: 45%;
}

.col33_adm {
  width: 33%;
}

.col20_adm {
  width: 20%;
}

.col10_adm {
  width: 10%;
}

.col5_adm {
  width: 5%;
}

.height10_adm {
  height: 10em;
} 

.row_adm {
  display: flex;
  flex-direction: row;
  margin: 0 auto;
}

.left_adm {
  display: flex;
  justify-content: flex-start;
}

.center_adm {
  display: flex;
  justify-content: center;
  margin: 0 auto;
}

.logo_adm {
  margin-top: 3em;
}

.logo_adm img {
  width: 25%;
  margin: 0 auto;
  display: flex;
  justify-content: center;
}

.navigation_adm {
  color: #5d5d5d;
  position: fixed;
  top: 1em;
  left: 1em;
}

.navigation_adm h1, .navigation_adm h6  {
  margin:0;
}

.full {
    width: 100%;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
}

.block_adm {
  width: 25px;
  height: 25px;
  border: 2px solid #00634f;
  margin: 0.5em;
}

.tag_adm {
  padding: 0.5em;
  margin: 0.25em;
  border: 4px solid #8c8c8c;
  font-size: 0.9em;
}

.tag_adm i {
  font-size: 1.25em;
  margin-left: 0.15em;
  cursor: pointer;
}

.on_adm {
  background: #00634f;
}

.block_adm:hover {
  -webkit-animation: rotation 0.5s ease-out both;
  cursor: pointer;
}

.diamond_adm {
  display: flex;
  justify-content: center;
  align-items: center;
  border: 3px solid #00634f;
  width: 3em;
  height: 3em;
  margin: 0 0.5em;
}

.diamond_adm_on {
  -webkit-animation: rotation 0.5s ease-out both;
  cursor: pointer;
}

.diamond_adm i {
  font-size: 2em;
  color: #00634f;
}

.diamond_adm:hover {
  -webkit-animation: rotation 0.5s ease-out both;
  cursor: pointer;
}

.selected_adm .diamond_adm {
  width: 3em;
  height: 3em;
}

.selected_adm .diamond_adm i {
  font-size: 2.25em;
}

.red_adm {
  border: 3px solid tomato;
  color: tomato;
}

.red_adm i {
  color: tomato;
}

.green_adm {
  border: 3px solid #00634f;
  color: #00634f;
}

.green_adm i {
  color: #00634f;
}

/* FORMS */

.form label {
  text-transform: uppercase;
  text-align: left;
  color: #5d5d5d;
  font-size: 0.9em;
  margin: 0 auto;
}

.form input[type="text"],
.form input[type="date"],
.form input[type="password"] {
  height: 1.5em !important;
  width: 80% !important;
  border: 3px solid #5d5d5d!important;
  background: transparent!important; 
  margin: 0em auto 0.5em auto;
  color: black !important;
}

.form select, .form option {
  height: 3em;
  width: 80%;
  border: 3px solid #5d5d5d;
  background: transparent; 
  margin-bottom: 0.75em;
  margin: 0 auto;
  font-size: 0.8em;
  color: #5d5d5d;
}

.form input[type="image"] {
  width: 100%;
  height: 20em;
  border: 3px solid #5d5d5d;
  object-fit: cover;
}

.form textarea {
  height: 21em;
  width: auto;
  border: 3px solid #5d5d5d;
  background: transparent;
}

.img_adm {
  height: 10em !important;
}

.go_adm {
  border: 2px solid #5d5d5d;
  font-size: 0.7em;
  padding: 0.5em 2em;
  margin: 0 auto;
}

.go_adm:hover {
  border: 2px solid #00634f;
  transition: 0.5s;
  color: #00634f;
  cursor: pointer;
}

.total {
  width: 100%;
  margin: 0 0.5em;
}

.box_image {  
  width: 450px;
  height: 280px;
  float: left;
  margin-right: 5px;
  margin-bottom: 5px;
  background: url("../images/default_image.jpg");
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: center;
  border: 3px solid #5d5d5d;
  overflow:hidden;
  border-radius: 5px;
}

.input-error {
  border: 2px solid #e24e42 !important;
}

.label_form {
  margin-left: -50px;
}

/*********************************************************************************/
/* Paginación de listados                                                        */
/*********************************************************************************/
.table_footer {
  text-align: center;
}

.table_column_name {
  cursor: pointer;
}

.pagination {
    display: inline-flex;
    list-style-type: none;
    height: 30px;
    margin: 3px 0px 3px 0px;
}

.pagination li {
    padding: 6px 10px 0px 0px;
    /*border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;*/
}

.pagination li a {
  padding: 8px 16px;
    color: #494e68;
}

.active {
    /*background-color: #494e68;*/
    transition: background-color .2s ease-in-out;
}

.active a {
  color: #00634f !important;
  border: none;
}

.active:hover {
  color: background: #494e68 !important;;
  cursor: pointer;
}

.disabled {
  background: #F4F6F6 !important;
    color: grey !important;
    border: 2px solid #ccc !important;
    border-radius: 3px;
    transition: 0.25s !important;
    cursor: not-allowed !important;
}

.disabled a:hover {
  color: #494e68 !important;
  cursor: not-allowed !important;
  font-weight: normal;
}

.extreme_links a:hover {
  color: white !important;
}

.extreme_links {
  border: 2px solid #00634f !important;
  color: #00634f !important;
  width: auto !important;
  border-radius: 3px !important;
  background: transparent !important;
  cursor: pointer !important;
}

.extreme_links_left {
  border-radius: 3px 0px 0px 3px;
}

.extreme_links_right {
  border-radius: 0px 3px 3px 0px;
}

.extreme_links_left_disabled {
  background: #F4F6F6;
    color: grey;
    border: 2px solid #ccc !important;
    border-radius: 3px;
    transition: 0.25s;
    cursor: not-allowed;
}

.extreme_links_left_disabled a:hover {
  cursor: not-allowed !important;
  font-weight: normal;
}

.extreme_links_right_disabled {
  background: #F4F6F6;
    color: grey;
    border: 2px solid #ccc !important;
    border-radius: 3px;
    transition: 0.25s;
    cursor: not-allowed;
}

.extreme_links_right_disabled a:hover {
  cursor: not-allowed !important;
  font-weight: normal;
}

.extreme_links:hover, .extreme_links_left:hover, .extreme_links_right:hover {
  border: 2px solid white;
  background: #00634f !important;
  color: white;
  transition: 0.25s;
}

.option_active {
  text-decoration: underline !important;
}

.sort {
  width: 16px;
  height: 16px;
  display:inline-block;
}

.sort:hover {
  cursor: pointer;
}

.sort_asc {
  background: url('../images/sort_down.png') no-repeat;
}

.sort_desc {
  background: url('../images/sort_up.png') no-repeat;
}


 /* RESPONSIVE 1000 */

@media screen and (max-width:1000px)
{
  .main_adm {
    margin: 0 0.5em;
  }

  .overflow_adm {
    overflow-x:auto;
  }

  .main_adm table {
    width: 1000px;
  }

  footer {
    width: 98%;
    margin-left: 0;
  }
}

 /* RESPONSIVE 640 */

@media screen and (max-width:640px)
{
  .diamond_adm {
    width: 2em;
    height: 2em;
  }

  .diamond_adm i {
    font-size: 1.5em;
  }

  footer {
    width: 97%;
    margin-left: 0;
  }
}

@-webkit-keyframes rotation {
    from {
        -webkit-transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(45deg);
    }
}