/*{border: 1px solid black;}*/
.html {font-family: 'Roboto Condensed', sans-serif;}

.header {font-size: 10px;
         position: fixed; width: initial; border:none;
         left:0px; right:0px;top:0px; margin:0px; left:0px; right:0px}


#brick{position: absolute; opacity: 1;
          z-index: -1;
          object-fit: cover;
          height:150px;
          width: 100%; top: 0px;}

.imgira{position:absolute; top: 3px; left: 30px; height: 68px;
            animation-name: logo;
            animation-duration: 7s;
            animation-delay: 3s;
            animation-iteration-count: infinite;
            -webkit-animation-duration: 7s;
            -moz-animation-duration: 7s;}

@keyframes logo {100% {transform: rotateY(360deg);}}
@-webkit-keyframes logo {100% {transform: rotateY(360deg);}}       

/*
.nav {border-radius: 10px; background: rgb(199, 198, 198, 0.4);
      margin:0px 30px; padding: 0px 0px;}
ul {list-style: none;margin-bottom: 5px; margin-top: 5px; padding: 0px 0px;
    font-size: 20px; border: none}
ul li {display: inline-block; border-radius: 10px; margin: 0px 20px;}
ul li a {text-decoration: none;
          transition: 1s; padding: 0px 40px; color:black; display: block;
          border: 1px solid rgb(138, 138, 138); border-radius: 10px;}
ul li a:hover{background: rgb(209, 79, 79); color: white;
              border-radius: 10px;}
 
.item-r {float:right; margin-right: 20px;}
*/

.nav {border-radius: 10px; background: rgb(199, 198, 198, 0.4);
  margin: 0px 30px; padding: 0px 0px; justify-content: center;}
ul{list-style: none;margin-bottom: 5px; margin-top: 5px; padding: 0px 0px;
  font-size: 20px; border: none; line-height: 22px; font-family: 'Roboto Condensed', sans-serif; text-align: center; }
ul li{display: inline-block; border-radius: 10px; margin: 0px 20px;}
ul li a {text-decoration: none; display: block;
       transition: 1s; padding:1px 40px; color:black;
       border: 1px solid rgb(136, 134, 134); border-radius: 10px;}
ul li a:hover{background: rgb(209, 79, 79); color: white;
            border-radius: 10px;}

.item-r{float: right; margin-right: 20px;}

hr{margin: 5px 0px;}

.img {border: none; width: 300px;}

.h1 {padding: 0px 25px; width: initial;
        margin:5px 0px; font-size: 0px; border:none} 
    
.h2 {margin: 0px 0px; width: initial; font-size: 20px; line-height: 22px; letter-spacing: 1px;
       font-family: 'Orbitron', Georgia, 'Times New Roman', Times, serif;
       padding-left: 30px; border: none; font-weight: 600;}

body {margin-top:140px; background-attachment:fixed; margin-left: 0px; margin-right: 0px;
      margin-bottom: 0px;}

#formulario {width: 75%; margin: 0px auto; font-weight: 500; text-align: center; color:rgb(20, 20, 20); letter-spacing: 1px;}

.main{position: relative; 
  height: 160px; width: auto; padding-top: 10px;}

#imgmain{position: absolute; height: 200px; width: 100%;
    left: 0px; top: 15px; z-index: -1; object-fit: cover;}

.footer{text-align: center; background: linear-gradient(0deg, rgb(119, 115, 115) 30%, white);
        padding-bottom: 10px; font-family: 'Roboto Condensed', sans-serif}

.divfoot2{display:flex; justify-content: center;}
.divfoot{display:flex; justify-content: center;}

#margen{margin-left: 100px;}
#margen2{margin-left: 220px;}



@media screen and (min-width: 1100px){
  #formulario{width: 750px; margin-top: 50px; margin-bottom: 50px;}}

@media screen and (max-width: 720px){ 
  #margen{margin-left: 50px;}
  #margen2{margin-left: 150px;}
  #imgmain{top: 35px;}
  .footer{margin-top: 25px;}
  #formulario{margin-top: 25px;}}

@media screen and (max-width: 650px){
  .divfoot{display:flex; flex-direction: column; align-items: center;}
.nav{margin: 0px 20px;}  
  #margen{margin-left: 0px;}
  #margen2{margin-left: 30px;}
  #imgmain{top: 0px;}
  .footer{margin-top: 0px;}
  #formulario{margin-top: 0px;}}


@media screen and (max-width: 590px){  
 .h2{font-size: 18px;}
  ul li a{padding: 0px 15px;}
.nav{font-size: 18px;}
}


@media screen and (max-width: 390px){
    .h2{font-size: 16px; padding-left: 46px;}
  .nav ul{font-size: 18px;}
  ul li a{padding: 0px 10px;}
  .imgira{left: 40px;}
  .h1{padding: 0px 35px;}
.footer{margin-top: -90px;}}

/*SCROLLBAR
/* width */
::-webkit-scrollbar {
    width: 10px;}
  
  /* Track */
  ::-webkit-scrollbar-track {
    background: #e9e6e6;
  border-radius: 10px;}
  
  /* Handle */
  ::-webkit-scrollbar-thumb {
    background: rgb(185, 183, 183);
  border-radius: 10px;}
  
  /* Handle on hover */
  ::-webkit-scrollbar-thumb:hover {
    background: rgb(209, 79, 79);}