/* xs */
/* @media (min-width: 475px) {} */

/* sm */
/* @media (min-width: 640px) {} */

/* md */
/* @media (min-width: 768px) {} */

/* lg */
/* @media (min-width: 1024px) {} */

/* xl */
/* @media (min-width: 1280px) {} */

/* 2xl */
/* @media (min-width: 1536px) {} */

.btn {
    display: inline-block;
    font-weight: 700;
    background: none;
    background-color: var(--clr-sky600);
    color: var(--clr-light);
    padding: 0.25em 1em;
    border: none;
    border-radius: 50px;
    cursor: pointer;  
}
  
.btn:hover {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
    opacity: 0.8;
    transition: opacity 0.3s, box-shadow 0.3s;
}

input,
textarea {
  border:none;
  background-image:none;
  background-color:transparent;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}

textarea {
  resize: none;
}

.container {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    
    /* border: 1px solid red; */
}

/* xs */
@media (min-width: 475px) {
    .container {
      max-width: 475px;
    }
  }
  
/* sm */
@media (min-width: 640px) {
    .container {
      max-width: 640px;
    }
}
  
/* md */
@media (min-width: 768px) {
    .container {
      max-width: 768px;
    }
}
  
/* lg */
@media (min-width: 1024px) {
    .container {
      max-width: 1024px;
    }
}
  
/* xl */
@media (min-width: 1280px) {
    .container {
      max-width: 1280px;
    }
}
  
/* 2xl */
@media (min-width: 1536px) {
    .container {
      max-width: 1536px;
    }
}