main > .container {
  padding: 80px 15px 0;
}

.navbar-brand {
  padding: 0 15px;
  height: 80px;
  line-height: 80px;
}

.footer, .footer a {
/*   background-color: #000; */
/*   color: #fff; */
}

.footer .copyright p {
  border-top: 1px solid rgba(255, 255, 255, 1);
  border-spacing: 0 1em;
}

@font-face {
   font-family: SantanderText;
   src: url('../fonts/SantanderText-Regular.ttf');
}

* {
   font-family: SantanderText;
}

/*  body { */
/*  font-family:'Raleway' */
/*  } */
 
 .firstsection {
  padding: 120px 15px 0;
}

 .firstsection-index {
  padding: 160px 15px 0;
}

.fondoTriangulo {
/* 	background-image:url('../images/recurso-09.png'); */
	background-repeat:no-repeat;
	background-size:contain;
	background-position:right top;
	background-color: #F9F9F9;
}

.section-background-color{
	background-color: #F9F9F9;
}

.color-text-secundary{
	color: #677177;
}


.fondoRojo {
	background-image:url('../images/nuevos-08.png');
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center;
}

section.fondo-teclado 
{
	padding-top: 10rem;
	background-image:url('../img/fondo-teclado.jpg');
	background-repeat:no-repeat;
	background-size: cover;
	background-color: #D9230F;
	background-position:center;
} 

section.fondo-general-blanco
{
	padding-top: 6rem;
	background-repeat:no-repeat;
	background-size: cover;
	background-position:center;
}

.fondo-blanco-sandbox
{
	padding-top: 9rem;
	background-repeat:no-repeat;
	background-size: cover;
	background-position:center;
}

section.fondo-general-gris
{
	padding-top: 8rem;
	background-repeat:no-repeat;
	background-size: cover;
	background-color: #a0a0a0;
	background-position:center;
}  


/* IE FIX*/

.img-fluid[src$=".svg"] {
    // IE10 code
    width: 100% \9;
}

/* Featurettes
------------------------- */
.featurette {
  margin-top: 7rem;
}

.field-optional{
	color: #a0a0a0;
}

.i-bold-style{
	font-weight: bold;
}

.bg-gray{
	background-color: #eee;
}

/* HEADER TRANPARENTA COLOR */
.navbar-light{
	background-color: #a0a0a080;
}

.navbar-transparent{
	background-color: #a0a0a000;
}

/* BOTONES HEADER EVITA EL BORDE DESPUES DEL CLICK*/
#btnHome:active, #btnDevelopers:active, #btnHelp:active, #idBtnModalVideoEvent:active,
	#btnCloseVideo:active  {
   outline: none !important;
   box-shadow: none;
}

#idBtnModalVideoEvent:focus, #btnCloseVideo:focus  {
   outline: none !important;
   box-shadow: none;
}

.custom-control-input:checked ~ .custom-control-label::before {
  background-color: #E1251B;
}


.card-devices{
	border-radius:1rem;
	border: 4px solid rgba(0, 0, 0, 0.125);
}

/* TUTORIAL DEVELOPERS */
.carousel-indicators.tutorial-developers button{
	height: 30px;
	border-radius: 50%;
	background-color: #E1251B;
	margin-right: 1rem;
	margin-left: 1rem;
}

.tutorial-developers.carousel-item {
    height: 350px;
}

.carousel-indicators.tutorial-developers button {
    width: 10px;
    height: 10px;
    border-radius: 100%;
}
.carousel-indicators.tutorial-developers {
    bottom: -50px;
}

/* STEPS */

#progressbar {
    margin-bottom: 30px;
    overflow: hidden;
    color: #455A64;
    padding-left: 0px;
    margin-top: 30px
}

#progressbar li {
    list-style-type: none;
    font-size: 13px;
    width: 33.33%;
    float: left;
    position: relative;
    font-weight: 400
}

#progressbar #step1:before {
    content: "1";
    color: #fff;
}

#progressbar #step2:before {
    content: "2";
    color: #fff
}

#progressbar #step3:before {
    content: "3";
    color: #fff
}

#progressbar li:before {
    width: 50px;
    height: 50px;
    line-height: 50px;
    display: block;
    font-size: 30px;
    background: #455A64;
    border-radius: 50%;
    margin: auto;
    padding: 0px;
}

#progressbar li:after {
    content: '';
    width: 100%;
    height: 2px;
    background: #455A64;
    position: absolute;
    left: 0;
    top: 21px;
    z-index: -1
}

#progressbar li:last-child:after {
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    position: absolute;
    left: -50%
}

#progressbar li:nth-child(2):after {
    left: -50%
}

#progressbar li:first-child:after {
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    position: absolute;
    left: 50%
}

#progressbar li:last-child:after {
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px
}

#progressbar li:first-child:after {
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px
}

#progressbar li.active:before,
#progressbar li.active:after {
    background: #E1251B;
}

#progressbar li.active:before {
    border: 4px solid #000;
    line-height: 40px;
}

#progressbar li.done:before,
#progressbar li.done:after {
    background: #000;
}

.font-gray{
	color: #a0a0a0;
}

.h6-margin-bottom-0 h6{
	margin-bottom: 0;
}

/* adjust botton next from tutorial*/
@media (min-width: 280px) {
	.modal-footer.custom-margin > :not(:first-child) {
	    margin-left: 20%;
	}
}

@media (min-width: 768px) {
	.modal-footer.custom-margin > :not(:first-child) {
	    margin-left: 50%;
	}
}

/* adjust card */
@media (min-width: 1024px) {
	.adjust-card {
	    flex: 0 0 50%;
	    max-width: 50%;
	}
}

@media (min-width: 1200px){
	.adjust-card  {
	    flex: 0 0 25%;
	    max-width: 25%;
	}
}

/* adjust word */
@media (max-width: 376px){
	.large-word{	
		font-size: 2.5rem;
	}	
}

/* Para centrar boton FAB */
@media (min-width: 320px){
	.navbar-transparent{	
		justify-content: center !important;
	}	
}

@media (min-width: 768px){
	.navbar-transparent{	
		justify-content: flex-end !important;
	}	
}

/* Margen despues de content END */
@media (min-width: 768px){
	.mr-btn-fa{	
		margin-right: 4.5rem !important;
	}	
}

@media (min-width: 992px){
	.mr-btn-fa{	
		margin-right: 7.8rem !important;
	}	
}

@media (min-width: 1200px) {
	.mr-btn-fa{	
		margin-right: 10.1rem !important;
	}
}

@media (min-width: 1600px) {
	.mr-btn-fa{	
		margin-right: 13rem !important;
	}
}

/* padding header */
@media (min-width: 1200px){
	.nav-padding-intelipos  {
	    padding-left: 6rem !important;
   		padding-right: 6rem !important;
	}
}

.navbar-btn-fa{
	padding: 1.5rem 1rem;
	position: fixed;
}

.shadow-btn-fa{
	box-shadow: 0 1rem 3rem rgba(0, 0, 0, 5) !important;	
}

.btn-gray{
	background-color: #887f7e;
	border-color: #5c5757;
	color: #fff;
}

.btn-gray:hover {
    color: #fff;
    text-decoration: none; 
}

a.text-decoration-none:hover{
	color: #000;
}

.smooth {
    text-decoration: none !important;
}

/* Botones de header */
.btn-header-intelipos:focus{
	box-shadow: none;
	border-radius: 0rem;
	color: #000;
}

.btn-header-intelipos{
	border-radius: 0rem;
}

.btn-border-intelipos{
	border-radius: 1rem;
}

.btn-background-color{
	background-color: #732645;
}

.border-color-video{
	border: 3px solid #77CDF8 !important;
}

.border-video{
	border: 3px solid #B4B5B6 !important;
}

.border-color-singup{
	border: 3px solid #E1251B !important;
}

.nav-border-bottom{
	border-bottom: 8px solid;
	border-image-source: linear-gradient(40deg,#732645,#E1251B) !important;
	border-image-slice: 1;
}

/* popovers */
.a-popover-intelipos{
	color: #fff;
}

.a-popover-intelipos:hover{
	color: #fff;
	text-decoration:none;
}

.bagde-popover-intelipos{
	background-color: #007bff;
}

.color-blue-intelipos{
	color: #007bff;
}

.popover-header{
	background-color: #f9e4ae;
	border-bottom: 0;
}

.popover-body{
	background-color: #f9e4ae;
}

.modal-register{
	border-bottom: 0;
	padding: 0 0;	
}

.loader {
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid #3498db;
  width: 120px;
  height: 120px;
  -webkit-animation: spin 2s linear infinite; /* Safari */
  animation: spin 2s linear infinite;
}

/* Safari */
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.rounded-element{
	border-radius:1rem;
}

/* loading page */
.overlay{
     display: none;
     position: fixed;
     width: 100%;
     height: 100%;
     top: 0;
     left: 0;
     z-index: 999;
     background: rgba(255,255,255,0.8) url('../img/loader.svg') center no-repeat;
 }

 /* Turn off scrollbar when body element has the loading class */
 body.loading{
     overflow: hidden;   
 }
 
 /* Make spinner image visible when body element has the loading class */
 body.loading .overlay{
     display: block;
 }