/*-----------------------MERCADO DE PÁGINAS-2017-RESPONSIVE DESIGN 100%--------------------------------------
-------------------------------------------LIMA-PERÚ-------------------------------------------------------
------------------------------------------VERSIÓN-1.0-----------------------------------------------------*/

/*ACA PUEDE EDITAR LAS PROPIEDADES DEL PORTAFOLIO DE SERVICIOS, SOLO DEBE EDITAR LOS VALORES QUE NECESITE CAMBIAR Y DAR CLICK EN EL BOTON GUARDAR*/

/*------------------------------PROPIEDADES DE LOS CONTENEDORES DE PORTAFOLIO DE SERVICIOS--------------------------------------*/
.articuloss{
	/*----COLOR DE FONDO PARA EL CONTENEDOR PRINCIPAL----*/
	

	/*----ESPACIADO DE EXTREMOS PARA EL CONTENEDOR PRINCIPAL----*/
	padding: 20px;
	
	/*----ALINEACION DEL TEXTO PARA EL CONTENEDOR PRINCIPAL----*/
	
}

.titulops{
        font-family:arial;   
    font-size:40px;
    text-align: center;
    color:#797272;
}



.tituloserv{
    font-family:arial;   
    font-size:40px;
}

.tituloserv_appweb{
    font-family:arial;   
    font-size:50px;
    color:#cc2800;
}

.textoserv{
    font-family:arial;   
    font-size:45px;
    text-align: center;
}

.textoserv_appweb{
    font-family:arial;   
    font-size:40px;
    text-align: justify;
    margin:10px;
}

.vista{
    width:48%;
    float:left;
}

.tvista{
    width:48%;
        display: inline-block;
}

.descserv{
    font-family: arial;
    font-weight: bold; 
    font-size:22px;
    text-align: left;
    padding-left:10px;
}

.TransformDemoDivserv {
    margin:25px 25px;
    padding:10px;
    width:35%;
    min-width:250px;
    height:auto;
 /*   font-family:arial;
    text-align: center;*/
    /*vertical-align: middle;*/
  /*  float: left;
    display: flex;
    justify-content: center;
    align-content: center;
    flex-direction: column;
 
    margin-right:auto;*/
}

.left {
        transition: 1s ease;
    -ms-transform: skewY(25deg);
    -webkit-transform: skewY(25deg);
    -moz-transform: skewY(25deg);
    -o-transform: skewY(25deg);
    transform: skewY(25deg);
 /*codigo para el reflejo de imagen inferior*/
     -webkit-box-reflect: below -180px
     -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(255, 255, 255, 0.5)));
}

.right {
        transition: 1s ease;
    -ms-transform: skewY(-25deg);
    -webkit-transform: skewY(-25deg);
    -moz-transform: skewY(-25deg);
    -o-transform: skewY(-25deg);
    transform: skewY(-25deg);
 /*codigo para el reflejo de imagen inferior*/
     -webkit-box-reflect: below -180px
     -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(255, 255, 255, 0.5)));
}

.TransformDemoDivTransformed0serv {
        border: 0px;
}

.left:hover{
    transition: 1s ease;
    width: 50%;
    height:auto;
      -ms-transform: skewY(0deg);
    -webkit-transform: skewY(0deg);
    -moz-transform: skewY(0deg);
    -o-transform: skewY(0deg);
    transform: skewY(0deg);
 /*codigo para el reflejo de imagen inferior*/
     -webkit-box-reflect: below -180px
     -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(255, 255, 255, 0.5)));  
}

.right:hover{
    transition: 1s ease;
    width: 50%;
    height:auto;
      -ms-transform: skewY(0deg);
    -webkit-transform: skewY(0deg);
    -moz-transform: skewY(0deg);
    -o-transform: skewY(0deg);
    transform: skewY(0deg);
 /*codigo para el reflejo de imagen inferior*/
     -webkit-box-reflect: below -180px
     -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(255, 255, 255, 0.5)));  
}

.buttonss {
    border-radius: 10px 10px 10px 10px;
   background: rgba(224,239,249,1);
background: -moz-linear-gradient(top, rgba(224,239,249,1) 0%, rgba(181,198,208,1) 1%, rgba(216,225,231,1) 50%, rgba(242,246,248,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(224,239,249,1)), color-stop(1%, rgba(181,198,208,1)), color-stop(50%, rgba(216,225,231,1)), color-stop(100%, rgba(242,246,248,1)));
background: -webkit-linear-gradient(top, rgba(224,239,249,1) 0%, rgba(181,198,208,1) 1%, rgba(216,225,231,1) 50%, rgba(242,246,248,1) 100%);
background: -o-linear-gradient(top, rgba(224,239,249,1) 0%, rgba(181,198,208,1) 1%, rgba(216,225,231,1) 50%, rgba(242,246,248,1) 100%);
background: -ms-linear-gradient(top, rgba(224,239,249,1) 0%, rgba(181,198,208,1) 1%, rgba(216,225,231,1) 50%, rgba(242,246,248,1) 100%);
background: linear-gradient(to bottom, rgba(224,239,249,1) 0%, rgba(181,198,208,1) 1%, rgba(216,225,231,1) 50%, rgba(242,246,248,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e0eff9', endColorstr='#f2f6f8', GradientType=0 );
    border: none;
    color:#545759;
     text-align: center;
    text-decoration: none;
    font-size: 16px;
     cursor: pointer;
    font-family: arial;
    font-weight: bold;
    width:80px;
    height:50px;
}

.botondemo{
        border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
	/*----COLOR DE LOS BOTONES "SEGUIR_ELIGIENDO" "TERMINE_DE_ELEGIR"----*/
   background: rgba(224,239,249,1);
background: -moz-linear-gradient(top, rgba(224,239,249,1) 0%, rgba(181,198,208,1) 1%, rgba(216,225,231,1) 50%, rgba(242,246,248,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(224,239,249,1)), color-stop(1%, rgba(181,198,208,1)), color-stop(50%, rgba(216,225,231,1)), color-stop(100%, rgba(242,246,248,1)));
background: -webkit-linear-gradient(top, rgba(224,239,249,1) 0%, rgba(181,198,208,1) 1%, rgba(216,225,231,1) 50%, rgba(242,246,248,1) 100%);
background: -o-linear-gradient(top, rgba(224,239,249,1) 0%, rgba(181,198,208,1) 1%, rgba(216,225,231,1) 50%, rgba(242,246,248,1) 100%);
background: -ms-linear-gradient(top, rgba(224,239,249,1) 0%, rgba(181,198,208,1) 1%, rgba(216,225,231,1) 50%, rgba(242,246,248,1) 100%);
background: linear-gradient(to bottom, rgba(224,239,249,1) 0%, rgba(181,198,208,1) 1%, rgba(216,225,231,1) 50%, rgba(242,246,248,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e0eff9', endColorstr='#f2f6f8', GradientType=0 );
	
	/*OTROS FORMATOS DE LOS BOTONES, CAMBIAR LOS VALORES SOLO SI TIENE LOS CONOCIMIENTOS NECESARIOS----*/	
	font-size: 15px;
	font-weight: normal;
	padding: 8px;
	border-top: 4px solid #000;
	border-bottom: 1px solid #fff;
    color:#545759;
	width:40%;
	height:50px;
}

.botondemoappweb{
        border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;
	/*----COLOR DE LOS BOTONES "SEGUIR_ELIGIENDO" "TERMINE_DE_ELEGIR"----*/
background: rgba(231,56,39,1);
background: -moz-linear-gradient(top, rgba(231,56,39,1) 0%, rgba(240,47,23,1) 29%, rgba(241,111,92,1) 50%, rgba(246,41,12,1) 69%, rgba(248,80,50,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(231,56,39,1)), color-stop(29%, rgba(240,47,23,1)), color-stop(50%, rgba(241,111,92,1)), color-stop(69%, rgba(246,41,12,1)), color-stop(100%, rgba(248,80,50,1)));
background: -webkit-linear-gradient(top, rgba(231,56,39,1) 0%, rgba(240,47,23,1) 29%, rgba(241,111,92,1) 50%, rgba(246,41,12,1) 69%, rgba(248,80,50,1) 100%);
background: -o-linear-gradient(top, rgba(231,56,39,1) 0%, rgba(240,47,23,1) 29%, rgba(241,111,92,1) 50%, rgba(246,41,12,1) 69%, rgba(248,80,50,1) 100%);
background: -ms-linear-gradient(top, rgba(231,56,39,1) 0%, rgba(240,47,23,1) 29%, rgba(241,111,92,1) 50%, rgba(246,41,12,1) 69%, rgba(248,80,50,1) 100%);
background: linear-gradient(to bottom, rgba(231,56,39,1) 0%, rgba(240,47,23,1) 29%, rgba(241,111,92,1) 50%, rgba(246,41,12,1) 69%, rgba(248,80,50,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e73827', endColorstr='#f85032', GradientType=0 );
	
	/*OTROS FORMATOS DE LOS BOTONES, CAMBIAR LOS VALORES SOLO SI TIENE LOS CONOCIMIENTOS NECESARIOS----*/	
	font-size: 15px;
	font-weight: normal;
	padding: 8px;
	border-top: 4px solid #000;
	border-bottom: 1px solid #fff;
    color:#fff;
	width:40%;
	height:50px;
}

.botondemo:hover{
    /*    border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;*/
	/*----COLOR DE LOS BOTONES "SEGUIR_ELIGIENDO" "TERMINE_DE_ELEGIR"----*/
   background:#000;
	
	/*OTROS FORMATOS DE LOS BOTONES, CAMBIAR LOS VALORES SOLO SI TIENE LOS CONOCIMIENTOS NECESARIOS----*/	
	font-size: 15px;
	font-weight: normal;
	padding: 8px;
	border-top: 4px solid #000;
	border-bottom: 1px solid #fff;
    color:#fff;
	width:40%;
	height:50px;
}