.servicio-1{
	margin:auto;
	max-width: 600px;
	margin-top: 120px
}
.services .texto{
	max-width: 250px;
	margin-top: 20px
}
.services .texto p{
	margin: 0
}
.control-services{
	position: relative;
	margin: 100px 0;
	min-height: 500px;
}
.control-services .service-2{
	position: absolute;
	top: 0;
	left: 0;
	width: 575px;
}
.service-2 .image,
.service-2 .texto{
	display: inline-block;
	vertical-align: top;
}
.service-2 .image{
	width: 65%;
}
.service-2 .texto{
	width: 34%;
	padding-left: 30px
}

.control-services .service-3{
	width: 600px;
	position: absolute;
	bottom: 0;
	right: 0;
}

.service-3 .image{
	width: 80%;
	float: right;
}
.service-3 .texto{
	position: absolute;
	bottom: 61px;
	left: 26px;
}
.service-3 .texto p{ 
	transform: rotate(-90deg);
}
.banner-red{
	background-color: #5F0E08;
	color: white;
	padding: 100px 0
}
.banner-red p{
	margin:0;
}
.banner-red a{
	color: white
}
.banner-red .contenido{
	max-width: 850px;
	margin-left: auto;
}
.banner-red .contenido > *{
	display: inline-block;
	vertical-align: bottom;
}
.banner-red .contenido .texto{
	width: 27%;
	padding-right: 15px
}
.banner-red .contenido .image{
	width: 72%;
}
.service-4{
	padding-top: 100px;
	padding-bottom: 40px
}
.service-4 .control-service-4{
	max-width: 950px;
}
.service-4 .control-service-4 .image,
.service-4 .control-service-4 .texto{
	display: inline-block;
	vertical-align: top;
}
.service-4 .control-service-4 .image{
	width: 75%
}
.service-4 .control-service-4 .texto{
	width: 24%;
	padding-left: 15px
}

.service-5{
	padding-bottom: 100px
}
.service-5 .control-service-5{
	width: 450px;
	height: 500px;
	position: relative;
	margin-left: auto;
}

.service-5 .image{
	width: 80%;
	position: absolute;
	right: 0;
	bottom: 0
}
.service-5 .texto{
	position: absolute;
	bottom:36px;
	left: 6px;
}
.service-5 .texto p{ 
	transform: rotate(-90deg);
}
.banner-red .desktop-visible{
	display: inline-block;
}
.banner-red .mobile-visible{
	display: none;
}
.service-4 .control-service-4 .texto p{
	margin:0;
}

@media only screen and (max-width: 1500px) {
	
}

@media only screen and (max-width: 1200px) {
	.control-services .service-3 {
	    width: 500px;
	}
	.control-services .service-2{
		width: 650px
	}
	.service-3 .texto{
		left: 10px
	}
	.service-4 .control-service-4 {
	    max-width: 850px;
	}
	.service-5 .control-service-5 {
	    width: 400px;
	    height: 400px
	}
}
@media only screen and (max-width:991px) {
	.control-services{
		height: auto !important
	}
	.control-services .service-2{
		position: relative;
		max-width: 600px;
		margin:auto;
	}
	.control-services .service-3{
		position: relative;
		max-width: 600px;
		margin:auto;
		width: auto
	}
	.service-3 .image {
	    width: 65%;
	    float: none;
	    display: inline-block;
	    vertical-align: top;
	}
	.service-3 .texto{
		width: 34%;
		left: auto;
		display: inline-block;
	    vertical-align: top;
	    position: relative;
	    bottom: auto;
	    padding-left: 30px
	}
	.service-3 .texto p {
	    transform: rotate(0deg);
	}
	.control-services {
	    position: relative;
	    margin: 40px 0;
	}
	.service-4 .control-service-4 {
	    max-width: 600px;
	    margin:auto;
	}
	.service-4 .control-service-4 .image {
	    width: 65%;
	}
	.service-4 .control-service-4 .texto{
		width: 34%
	}
	.service-5 .control-service-5 {
	    width: auto;
	    max-width: 600px;
	    height: auto;
	    margin:auto;
	}
	.service-5 .control-service-5 .image {
	    width: 65%;
	    position: relative;
	    display: inline-block;
	    vertical-align:top;
	    right: auto;
	    bottom: auto;
	}
	.service-5 .control-service-5 .texto{
		width: 34%;
		position: relative;
		left: auto;
		bottom: auto;
		display: inline-block;
		vertical-align:top;
		padding-left: 15px
	}
	.service-5 .texto p {
    	transform: rotate(0deg);
	}

	

}

@media only screen and (max-width: 767px) {
	.service-2 .image,
	.service-2 .texto{
		display: block;
		width: 100%
	}
	.control-services .service-2{
		max-width: 100%
	}
	.service-2 .texto{
		padding-left: 0
	}
	.service-3 .texto,
	.service-3 .image{
		display: block;
		width: 100%
	}
	.service-3 .texto{
		padding-left: 0
	}
	.control-services .service-3{
		margin-top: 40px
	}
	.banner-red .contenido > *{
		display: block;
		width: 100%
	}
	.banner-red .contenido .texto{
		width: 100%
	}
	.banner-red .contenido .image{
		width: 100%;
	}
	.banner-red .mobile-visible{
		display: block;
		margin-top: 40px;
	}
	.banner-red .desktop-visible{
		display: none;
	}
	.servicio-1{
		margin-top: 40px
	}
	.service-4 .control-service-4 .image,
	.service-4 .control-service-4 .texto{
		display: block;
		width: 100%
	}
	.service-4 .control-service-4 .texto{
		padding-left: 0;
		margin-top: 20px
	}
	.service-5 .control-service-5 .image,
	.service-5 .control-service-5 .texto{
		display: block;
		width: 100%
	}
	.service-5 .control-service-5 .texto{
		margin-top: 20px;
		padding-left: 0
	}
	.service-5{
		padding-bottom: 40px
	}
}

@media only screen and (max-width: 575px) {
	
	
}

