body{
		background-image: url('../imagenes/3.png');
		background-size: cover;
		background-attachment: fixed;
		background-repeat: no-repeat;
		
	}

	.logo{
		background: rgb(65,113,124);
		background: linear-gradient(90deg, rgba(65,113,124,1) 0%, rgba(90,167,175,1) 45%, rgba(75,201,183,1) 100%);
		border-bottom: 3px solid #5AA7AF;
		padding: 20px;
		border-radius: 5px;
	}

	.form-control{
		border-bottom: 3px solid #5AA7AF;
	}

	.contenedor{
		background:rgba(255,255,255,0.9);
		margin-top: 60px;
		width: 70%;
		margin-bottom: 80px;
		padding: 40px;
		border-radius: 20px 20px 0px 0px;
		border-left: 8px solid #41717C;
		box-shadow: -6px -10px 32px -1px rgba(65,113,124,1);
	}

	.col-3,.col-12,.col-6{
		margin-bottom: 15px;
	}

	label{
		margin-bottom: 5px
	}

	#progressbar {
	    margin-bottom: 30px;
	    overflow: hidden;
	    color: #868686;
	    text-align: center;
	    margin-top: 25px;
	    padding-left: 0;
	     
	}

	#progressbar .active {
	    color: #013F4E
	}

	#progressbar li {
	    list-style-type: none;
	    font-size: 15px;
	    width: 25%;
	    float: left;
	    position: relative;
	    font-weight: 400;
	    z-index: 3;
	}

	#progressbar #account:before {
	    font-family: FontAwesome;
	    content: "\f007"
	}

	#progressbar #credencial:before {
	    font-family: FontAwesome;
	    content: "\f007"
	}

	#progressbar #payment:before {
	    font-family: FontAwesome;
	    content: "\f030"
	}

	#progressbar #confirm:before {
	    font-family: FontAwesome;
	    content: "\f00c"
	}

	#progressbar li:before {
	    width: 50px;
	    height: 50px;
	    line-height: 45px;
	    display: block;
	    font-size: 20px;
	    color: #ffffff;
	    background: #B4B4B4;
	    border-radius: 50%;
	    margin: 0 auto 10px auto;
	    padding: 2px
	}

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

	#progressbar li.active:before,
	#progressbar li.active:after {
	    background: #4BC9B7
	}
	
	button{
		margin-top: 20px;
		position: relative;
		padding: 10px;
		width: 130px;
		color: white;
		text-decoration: none;
		background:linear-gradient(90deg,#41717C,#4BC9B7);
		border-radius: 25px;
		outline: none;
		border: none;
	}

	button:hover{
		
		background:linear-gradient(50deg,#013F4E,#5AA7AF);
	}

	.terminos{
		/*#013F4E oscuro , #41717c oscuro2,#5aa7af segundo claro, #4bc9b7 claro*/
		background: white;
		border: 2px solid #41717c;
		width: 70%;
		height: 300px;
		overflow-x: scroll;
		text-align: justify;
		padding: 25px;
	}

	@media only screen and (max-width: 600px) {
		.contenedor{
			width: 100%;
		}

		.terminos{
		/*#013F4E oscuro , #41717c oscuro2,#5aa7af segundo claro, #4bc9b7 claro*/
			width: 100%;
		}
		

		#credenciales input{
			font-size: 13px;
		}

		.logo img{
			width: 50%;
		}

		#progressbar li:before {
	    	font-size: 20px;
		}

		button{
			width: 90px;
			font-size: 12px;
		}

		strong{
			font-size: 10px;
		}

		#fotousuario .alert{
			margin-top: 20px;
		}

	}