/* Put your custom styles here */
.form-control {
    border-radius: 2px;
}

.navbar {
	min-height: 95px;
}

.padding-50px {
    padding-top: 50px;
}

.bg-blue-cs {
    background-color: #0082CA !important;
    background: url("../images/reticula_blanca@2x.png") center top;
    background-repeat: no-repeat;
    background-size: cover;
}

.bg-white-cs {
    background-color: #ffffff !important;
    background: url("../images/reticula_azul@2x.png") center top;
    background-repeat: no-repeat;
    background-size: cover;
    /*background-attachment: fixed;Posicion fija de imagen*/
}

.bg-gray-cs {
    background-color: #929497;
}

a.bg-blue-cs {
    background-color: #0082CA !important;
    color: #fff;
}

a.bg-white {
    background-color: #fff !important;
    color: #707070;
}

.bg-blue-cs h4 {
    color: #fff;
    text-transform: uppercase;
    font-weight: 700;
}

.bg-blue-cs h2 {
    color: #fff;
    text-transform: uppercase;
    font-weight: 700;
}

.bg-white-cs h4 {
    color: #0082CA;
    text-transform: uppercase;
    font-weight: 700;
}

.bg-white-cs h2 {
    color: #0082CA;
    text-transform: uppercase;
    font-weight: 700;
}

.bg-gray-cs h4 {
    color: #fff;
    text-transform: uppercase;
    font-weight: 700;
}

.bg-gray-cs h2 {
    color: #fff;
    text-transform: uppercase;
    font-weight: 700;
}

.bg-blue-cs p {
    color: #fff;
}

.bg-white-cs p {
    color: #707070;
}

.bg-gray-cs p {
    color: #fff;
}

.btn {
    border-radius: 0px !important;
}

.center-img {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.paddingt20 {
    padding-top: 20px;
}

.paddingt35 {
    padding-top: 35px;
}

.img-section {
    max-width: 400px;
    height: auto;
    object-fit: cover;
}

.img-statistics {
    max-height: 100px;
    width: auto;
}

/*  CONTENT BLOCK PADDING MEDIA QUERIES
/*----------------------------------------------------*/
/* XtraSmall Devices, Phones */
@media only screen and (min-width : 320px){
    .paddingl100{
        padding-left: 10px !important;
    }

    .paddingr100 {
        padding-right: 10px !important;
    }

    h4 {
        font-size: 14px !important;
    }
}
@media only screen and (min-width : 480px){
    .paddingl100{
        padding-left: 10px !important;
    }

    .paddingr100 {
        padding-right: 10px !important;
    }

    h4 {
        font-size: 17px !important;
    }
}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px){
    .paddingl100{
        padding-left: 15px !important;
    }

    .paddingr100 {
        padding-right: 15px !important;
    }

    h4 {
        font-size: 20px !important;
    }
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px){
    .paddingl100{
        padding-left: 20px !important;
    }

    .paddingr100 {
        padding-right: 20px !important;
    }

    h4 {
        font-size: 23px !important;
    }
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px){
    .paddingl100 {
        padding-left: 100px !important;
    }

    .paddingr100 {
        padding-right: 100px !important;
    }


    h4 {
        font-size: 23px !important;
    }
}

/*!
 * Images responsive
 */
figure {
  margin: 1em 0 1em 0;
}


img {
    max-width: 100%;
}

img.img-section {
  transition: width 0.5s;
  width: 50vw;
}

@media screen and (max-width: 700px) {
  img.section {
    max-width: 90vw;
    width: 90vw;
  }
}

.img-responsive {
    margin-right: auto;
    margin-left: auto;
}

/*!
 * Parallax Effect
 * 180808
 */

.slideLeft {
    animation-name: slideLeft;
    -webkit-animation-name: slideLeft;
    animation-duration: 2s;
    -webkit-animation-duration: 2s;
    visibility: visible;
}

@keyframes slideLeft {
    0% {
        opacity: 0;
        -webkit-transform: translateX(355px);
    } 
    100% {
        opacity: 1;
        -webkit-transform: translateX(-100px);
    }
}

@-webkit-keyframes slideLeft {
    0% {
        opacity: 0;
        -webkit-transform: translateX(355px);
    } 
    100% {
        opacity: 1;
        -webkit-transform: translateX(-100px);
    }
}

#img_valid {
	/*visibility: hidden;*/
}

/*!
* Github
* Animate.css
 */

@-webkit-keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInRight {
  -webkit-animation-name: slideInRight;
  animation-name: slideInRight;
}