/*==================================================
=            Bootstrap 3 Media Queries             =
==================================================*/

/*==========  Mobile First Method  ==========*/

/* Custom, iPhone Retina */
@media only screen and (min-width: 320px) {
}

/* Extra Small Devices, Phones */
@media only screen and (min-width: 480px) {
}

/* Small Devices, Tablets */
@media only screen and (min-width: 768px) {
}

/* Medium Devices, Desktops */
@media only screen and (min-width: 992px) {
  .container-1 {
    display: none;
  }
}

@media only screen and (min-width: 1000px) {
  .container-1 {
    display: block;
  }
}

/* Large Devices, Wide Screens */
@media only screen and (min-width: 1200px) {
}

/*==========  Non-Mobile First Method  ==========*/

/* Large Devices, Wide Screens */
@media only screen and (max-width: 1199px) {
  .container-1 {
    margin-left: 35% !important;
  }

  .fa-2 {
    font-size: 47px;
    color: #ffd23d;
    margin-left: 20px;
    margin-top: -200px;
  }

  .card-4 p {
    padding-top: 35px !important;
  }

  .card-6 p {
    padding-top: 30px !important;
  }

  .card-9 p {
    padding-top: 40px !important;
  }

  .login {
    text-align: center;
    padding-top: 0px;
    padding-bottom: 0px;
  }

  .input-2 {
    margin-top: 10px;
  }
  
  .btn-login{
    margin-top: 10px;
  }
}

/* Medium Devices, Desktops */
@media only screen and (max-width: 991px) {
  .fa-2 {
    font-size: 50px;
    color: #ffd23d;
    margin-left: 30px;
    margin-top: -200px;
  }

  .card-3 p {
    padding-top: 50px !important;
  }

  .card-8 p {
    padding-top: 28px !important;
  }

  .login-logo-2{
    margin-top: 30px;
    margin-left: 7%;
  }
}

/* Small Devices, Tablets */
@media only screen and (max-width: 767px) {
  .login {
    text-align: center;
    padding-top: 0px;
    padding-bottom: 0px;
  }

  .input-2 {
    margin-top: 10px;
  }
  
  .btn-login{
    margin-top: 10px;
  }

  .login-logo-2{
    margin-top: 100px;
    margin-left: 25%;
  }
}

@media only screen and (max-width: 636px) {
  .fa-2:hover {
    font-size: 50px;
    color: orangered;
    margin-left: 20px;
    margin-top: -200px;
  }
}

@media only screen and (max-width: 617px) {
  .fa-2 {
    font-size: 40px;
    color: #ffd23d;
    margin-left: 20px;
    margin-top: -200px;
  }
}

@media only screen and (max-width: 599px) {
  .login-logo-2{
    margin-top: 100px;
    margin-left: 20%;
  }
}

@media only screen and (max-width: 546px) {
  .fa-2:hover {
    font-size: 50px;
    color: orangered;
    margin-left: 30px;
    margin-top: -200px;
  }
}

@media only screen and (max-width: 530px) {
  .fa-2 {
    font-size: 40px;
    color: #ffd23d;
    margin-left: 20px;
    margin-top: -200px;
  }

  .login-logo-2{
    margin-top: 100px;
    margin-left: 15%;
  }
}

@media only screen and (max-width: 526px) {
  .fa-2:hover {
    font-size: 45px;
    color: orangered;
    margin-left: 20px;
    margin-top: -200px;
  }
}

@media only screen and (max-width: 522px) {
  .fa-2:hover {
    font-size: 50px;
    color: orangered;
    margin-left: 20px;
    margin-top: -200px;
  }
}

@media only screen and (max-width: 502px) {
  .fa-2:hover {
    font-size: 45px;
    color: orangered;
    margin-left: 20px;
    margin-top: -200px;
  }
}

@media only screen and (max-width: 491px) {
  .fa-2:hover {
    font-size: 45px;
    color: orangered;
    margin-left: 15px;
    margin-top: -200px;
  }
}

/* Extra Small Devices, Phones */
@media only screen and (max-width: 479px) {
  .fa-2 {
    font-size: 40px;
    color: #ffd23d;
    margin-left: 15px;
    margin-top: -200px;
  }

  .fa-2:hover {
    font-size: 45px;
    color: orangered;
    margin-left: 15px;
    margin-top: -200px;
  }

  .login-logo-2{
    margin-top: 100px;
    margin-left: 10%;
  }
}

@media only screen and (max-width: 455px) {
  .fa-2:hover {
    font-size: 38px;
    color: orangered;
    margin-left: 10px;
    margin-top: -300px !important;
  }
}

@media only screen and (max-width: 445px) {
  .fa-2 {
    font-size: 38px;
    color: #ffd23d;
    margin-left: 15px;
    margin-top: -300px !important;
  }
}

@media only screen and (max-width: 433px) {
  .fa-2 {
    font-size: 35px;
    color: #ffd23d;
    margin-left: 15px;
    margin-top: -300px;
  }
}

@media only screen and (max-width: 414px) {
  .fa-2 {
    font-size: 30px;
    color: #ffd23d;
    margin-left: 15px;
    margin-top: -300px;
  }

  .login-logo-2{
    margin-top: 100px;
    margin-left: 5%;
  }
}

@media only screen and (max-width: 388px) {
  .fa-2:hover {
    font-size: 32px;
    color: orangered;
    margin-left: 10px;
    margin-top: -300px !important;
  }
}

/* Extra Small Devices, Phones */
@media only screen and (max-width: 360px) {
  .h1-1 {
    font-size: 20px;
  }
  .fa-2 {
    font-size: 25px;
    color: #ffd23d;
    margin-left: 15px;
    margin-top: -300px;
  }

  .fa-2:hover {
    font-size: 30px;
    color: orangered;
    margin-left: 10px;
    margin-top: -200px;
  }
}

/* Custom, iPhone Retina */
@media only screen and (max-width: 319px) {
  .h1-1 {
    font-size: 15px;
  }

  .fa-2 {
    font-size: 20px;
    color: #ffd23d;
    margin-left: 10px;
    margin-top: -300px;
  }
}
