@media (max-width: 991px) {
  :root {
    font-size: 14px !important; }

  .card {
    width: 100% !important; }

  .card ul {
    text-align: left; }

  #contact .btn {
    width: 70% !important; }

  .cuadro-foto {
    height: 20em !important;
    width: 16em !important;
    background-size: 20em 22em !important; }

  .foto-col {
    width: 100% !important; }

  nav, header .col.xl6 {
    display: none !important; }

  .logo {
    width: 12em !important;
    height: 10em !important;
    margin-bottom: 2em; }

  .elcentro {
    margin: 0 auto !important; } }
@media (min-width: 1201px) {
  :root {
    font-size: 16px !important; } }
h1, h2, h3 {
  font-family: 'Lobster Two', cursive; }

p, li {
  font-family: 'Oswald', sans-serif; }

section {
  padding: 4em 0; }

header li {
  font-family: 'Lobster Two', cursive !important; }
  header li a:hover {
    color: #FEFF89;
    transition: .3s;
    text-decoration: none; }

.yello {
  color: #FF9F68; }

.main-banner {
  height: 100vh;
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ef5777+4,f53b57+99 */
  background-image: url(../img/contact21.png);
  background-size: 100% 100%;
  background-attachment: fixed;
  color: white; }
  .main-banner .banner {
    text-align: center;
    margin: -40px auto; }
    .main-banner .banner h1 {
      font-size: 4em; }
    .main-banner .banner h2 {
      font-size: 2em;
      font-family: 'Oswald', sans-serif; }
    .main-banner .banner .circle {
      border-radius: 500px;
      background: url("../img/perfil.jpeg");
      background-size: 250px 300px;
      height: 15em;
      width: 15em;
      margin: 0 auto;
      box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22); }

header nav {
  margin-left: 18em !important; }

#bio {
  display: none; }

.logo {
  height: 12em;
  width: 15em;
  display: inline-block; }

li {
  display: inline-block;
  padding: 15px;
  font-size: 1.5em; }

nav, ul {
  display: inline-block;
  margin-right: 0px;
  margin-top: 20px; }

.btn {
  padding: 10px;
  background: #F86078; }

a {
  color: white;
  text-decoration: none; }

i {
  font-size: 3em !important;
  margin-top: 1em; }

#bio {
  padding: 50px; }
  #bio ol {
    text-align: left; }
  #bio li {
    font-size: 1em; }

#bio h1 {
  color: #f53b57;
  font-size: 4em; }

.cuadro-foto {
  height: 32em;
  width: 32em;
  border-radius: 20px;
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
  background-image: url(../img/fabiola.jpeg);
  background-size: 520px 525px;
  margin: 0 auto; }

#portafolio {
  background-image: url(../img/contact.JPG);
  background-attachment: fixed;
  background-size: 100% auto;
  color: white;
  text-align: center; }
  #portafolio h1 {
    font-size: 5em;
    margin: .5em 0; }
  #portafolio h2 {
    margin: 1em 0;
    font-size: 3em; }
  #portafolio .col {
    padding-right: 0px !important;
    padding-left: 0px !important;
    display: flex;
    justify-content: center; }

#contact {
  background-image: url(../img/contact2.jpg);
  background-size: 100% 100%;
  background-attachment: fixed;
  color: #333333;
  text-align: center; }
  #contact li {
    display: block; }
  #contact h1 {
    font-size: 3.5em; }
  #contact .btn {
    width: 30%;
    margin: 0 auto; }
  #contact .btn:hover {
    background-color: rgba(255, 255, 255, 0.8);
    transition: .3s;
    border: 2px solid #444444; }
  #contact .btn:hover i {
    color: #444444 !important; }
  #contact i {
    margin: 0 auto !important;
    display: inline !important; }

video {
  margin: 2em 0; }

.card {
  background-color: rgba(255, 255, 255, 0.8);
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
  width: 70%;
  padding: 1em 0;
  margin: 0 auto; }

.instagram {
  color: white; }

.foto {
  height: 300px;
  width: 80%;
  background-size: 320px 350px;
  margin: 1em 0;
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22); }

.foto:before {
  background: url(background.png) 0 0 repeat;
  -webkit-transform: rotate(30deg);
  transform: rotate(30deg); }

#foto1 {
  background-image: url(../img/foto1.JPG); }

#foto2 {
  background-image: url(../img/foto2.JPG); }

#foto3 {
  background-image: url(../img/foto3.JPG); }

#foto4 {
  background-image: url(../img/foto4.jpg); }

#foto5 {
  background-image: url(../img/foto5.jpg); }

#foto6 {
  background-image: url(../img/foto6.JPG); }

#foto7 {
  background-image: url(../img/foto7.jpg); }

#foto8 {
  background-image: url(../img/foto8.JPG); }

#foto9 {
  background-image: url(../img/foto9.JPG); }

#foto10 {
  background-image: url(../img/foto10.JPG); }

#foto11 {
  background-image: url(../img/foto11.JPG); }

#foto12 {
  background-image: url(../img/foto12.JPG); }

#foto13 {
  background-image: url(../img/foto13.JPG); }

#foto14 {
  background-image: url(../img/foto14.jpg); }

#foto15 {
  background-image: url(../img/foto15.jpg); }

#foto16 {
  background-image: url(../img/foto16.jpg); }

#foto17 {
  background-image: url(../img/foto17.jpg); }

#foto18 {
  background-image: url(../img/foto18.jpg); }

#foto19 {
  background-image: url(../img/foto19.jpg); }

#foto20 {
  background-image: url(../img/foto20.jpg); }

#foto21 {
  background-image: url(../img/foto21.jpg); }

#foto22 {
  background-image: url(../img/foto22.jpg); }

#foto23 {
  background-image: url(../img/foto23.jpg); }

#foto24 {
  background-image: url(../img/foto24.jpg); }

#foto25 {
  background-image: url(../img/foto25.jpg); }

#foto26 {
  background-image: url(../img/foto26.jpg); }

#foto27 {
  background-image: url(../img/foto27.jpg); }

#foto28 {
  background-image: url(../img/foto28.jpg); }

#foto29 {
  background-image: url(../img/foto29.jpg); }

#foto30 {
  background-image: url(../img/foto30.jpg); }

/*# sourceMappingURL=master.css.map */
