*{
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
}
/*estilos-predeterminados*/
:root {
  --color-green-medium: #8fe2e4;
  --color-purple: #632ce7;
  --color-gray: #eaebed;
  --color-gray-mediem: #817f7f;
  --color-yellow: #e0c527;
  --color-green: #37bb3e;
  --color-blue: #3b4fff;
  --color-red: #ff3838;
  --color-black: #161616;
 }

 body{
   display: flex;
   flex-direction: column;
   background-color: var(--color-gray);
   height: 100vh;
 }

 .login__user{
  min-width: 100%;
  min-height: 100%;
  background-image: url(../img/samuel-scrimshaw-76649-unsplash.jpg);
 	background-repeat: no-repeat;
   background-size: cover;
 }

 /**login usuario**/
 .name__user{
  display: flex;
  height: 89.8%;
  margin: 0 auto;
 }

 .name__user__container{
   display: flex;
   flex-direction: column;
   margin: 15rem auto;
   width: 100%;
   height: 15rem;
 }
 .name__user__container__title{
   font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
   margin: 1rem 0;
   font-size: 2.5rem;
   color: var(--color-yellow);
   text-align: center;
   font-weight: bold;
 }
 .name__user__container__inputs{
   display: flex;
   border-radius: 2%;
   align-self: center;
   background-color: var(--color-yellow);
   flex-direction: column;
   align-content: center;
   width: 17rem;
   height: 7rem;
   text-align: center;
 }
 .name__user__container__inputs input{
  margin: auto 0.5rem;
  display: flex;
  flex-direction: column;
 }
 
 .login__user__input-text{
  display: flex !important;
  align-items: center;
 }
 .name__user__container__inputs #user{
  border-radius: 3%;
  margin-bottom: 0.5rem;
  text-align: center;
  padding: 0.5rem;
  font-weight: bold;
  color: var(--color-black);
  border: none;
}

 .name__user__container__inputs #submit{
   cursor: pointer;
   text-decoration: none;
   margin: auto 0.5rem;
   border-radius: 3%;
   padding: 0.5rem;
   font-weight: bold;
   color: white;
   border: none;
   background-color: var(--color-gray-mediem);
 }
 .name__user__container__inputs #submit:hover{
   background-color: #0d0d0e;
   transition: all 0.8s;
 }

 #submit_send{
   display: flex;
   width: 100%;
   height: 100%;
 }

/**questions**/

.container__questions{
  display: flex;
  width: 100%;
  flex-direction: column;
  margin: auto 0;
  text-align: center;
  background-color: var(--color-gray);
}

.container__questions__title{
  font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
  padding: 1rem 0;
  background-color: #ffffff;
  box-shadow: 0 0 0.5rem 0 black;
}

.container__questions__img > img{
  margin: 1rem 0;
  width: 17rem;
  height: 12rem;
}

.container__questions__answers{
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  height: 100%;
  justify-content: space-evenly;
}

.container__questions__answers__options{
  display: flex;
  cursor: pointer;
  align-items: center;
  margin: 1rem 0;
  width: 48%;
  height: 4rem;
  background-color: var(--color-red);
}

.container__questions__answers__options:hover,.container__questions__answers__options--1:hover,.container__questions__answers__options--2:hover,.container__questions__answers__options--3:hover
{
  transition: all 0.3s;
  background-color: #921c1c;
}
.container__questions__answers__options--1{
  display: flex;
  cursor: pointer;
  align-items: center;
  margin: 1rem 0;
  width: 48%;
  height: 4rem;
  background-color: var(--color-blue);
}

.container__questions__answers__options--1:hover{
  background-color: #1c2892;;
}
.container__questions__answers__options--2{
  display: flex;
  cursor: pointer;
  align-items: center;
  margin: 1rem 0;
  width: 48%;
  height: 4rem;
  background-color: var(--color-yellow);
}

.container__questions__answers__options--2:hover{
  background-color: #b4b230;
}

.container__questions__answers__options--3{
  display: flex;
  cursor: pointer;
  align-items: center;
  margin: 1rem 0;
  width: 48%;
  height: 4rem;
  background-color: var(--color-green);
}

.container__questions__answers__options--3:hover{
  background-color: #349231;
}

.container__questions__answers__icons{
  display: flex;
  color: white;
  text-decoration: none;
}

.container__questions__answers__icons > img{
  display: flex;
  margin: 0 0.5rem;
  width: 1rem;
  height: 1rem;
}

.container__counter__questions{
  display: flex;
  font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
  font-weight: bold;
  font-size: 1.3rem;
  margin: 0.5rem 1rem;
}

/**responses**/

.container{
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
}

.container__title{
  display: flex;
  flex-direction: row;
  justify-content: center;
  width: 100%;
}

.container__title__item{
  display: flex;
  font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
  width: 100%;
  padding: 1rem 0;
  justify-content: center;
}

.container__img{
  display: flex;
  width: 100%;
  height: 100%;
  flex-direction: column;
  background-image: url(../img/the_jungle_book_2016_movie-wide.jpg);
 	background-repeat: no-repeat;
   background-size: cover;
}

.container__background{
  width: 100%;
  height: 8%;
  background-color: var(--color-gray);
}

.container__img__answers{
  display: flex;
  width: 70%;
  height: 8.5%;
  align-items: center;
  background: var(--color-gray);
  justify-content: space-around;
  margin: auto auto;
  font-weight: bolder;
}


.answers__correct{
  color: var(--color-green);
}

.answers__incorrect{
  color: var(--color-red);
}

/* footer */

.container__img__btn{
  display: flex;
  text-decoration: none;
  width: 100%;
  justify-content: center;
  background: transparent;
  margin-bottom: 1rem;
}

.container__img__btn-home{
  width: 13%;
  border-radius: 3%;
  font-size: 0.8rem;
  font-weight: bold;
  padding: 0.8rem;
  cursor: pointer;
  justify-content: center;
  background: var(--color-gray);
  border: none;
}
.container__img__btn-home:hover{
  background: #678983;
  transition: all 0.5s;
}

.footer__bottom{
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: var(--color-gray);
  border-top: 1px solid #19220e;
  padding: 21px 0;
}

.footer__bottom--answers{
  background: white;
  box-shadow: 0 0 0.5rem 0 black;
  border: none;
}

.footer__bottom__container{
   display: flex;
  flex-direction: row;
  justify-content: space-between;
  grid-gap: 35px;
  width: 100%; 
}

.footer__bottom__container__row{
  display: flex;
  margin: 0 94px;
  flex-direction: row;
  justify-content: center;
  width: 100%;
}

.footer__bottom__container__left__text{
  color: var(--color-gray-text);
}

.footer__bottom__container__left__title{
  color: var(--color-blue);
  text-decoration: none;
}


.sub__nav__container__donate--footer{
  margin-left: 1rem;
}



.footer__container__info,.footer__container__quick-links,.footer__container__upcoming-events,.footer__container__subscribe{
  margin-top: 50px;
}