@charset "utf-8";
/* CSS Document */

@font-face {
    font-family: 'GothamMedium';
    src: url('../fonts/gotham-medium.eot');
    src: url('../fonts/gotham-medium.eot') format('embedded-opentype'),
         url('../fonts/gotham-medium.woff') format('woff'),
         url('../fonts/gotham-medium.ttf') format('truetype'),
         url('../fonts/gotham-medium.svg#GothamMedium') format('svg');
}
@font-face {
    font-family: 'HelveticaLTStdCondRegular';
    src: url('../fonts/helveticaltstd-cond_1-webfont.eot');
    src: url('../fonts/helveticaltstd-cond_1-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/helveticaltstd-cond_1-webfont.woff') format('woff'),
         url('../fonts/helveticaltstd-cond_1-webfont.ttf') format('truetype'),
         url('../fonts/helveticaltstd-cond_1-webfont.svg#HelveticaLTStdCondRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'FuturaMdBTMedium';
    src: url('../fonts/tt0142m-webfont.eot');
    src: url('../fonts/tt0142m-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/tt0142m-webfont.woff') format('woff'),
         url('../fonts/tt0142m-webfont.ttf') format('truetype'),
         url('../fonts/tt0142m-webfont.svg#FuturaMdBTMedium') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'FuturaMdBTBold';
    src: url('../fonts/tt0144m-webfont.eot');
    src: url('../fonts/tt0144m-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/tt0144m-webfont.woff') format('woff'),
         url('../fonts/tt0144m-webfont.ttf') format('truetype'),
         url('../fonts/tt0144m-webfont.svg#FuturaMdBTBold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'MyriadWebProRegular';
    src: url('../fonts/myriadwebpro_0-webfont.eot');
    src: url('../fonts/myriadwebpro_0-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/myriadwebpro_0-webfont.woff') format('woff'),
         url('../fonts/myriadwebpro_0-webfont.ttf') format('truetype'),
         url('../fonts/myriadwebpro_0-webfont.svg#MyriadWebProRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

body
{
    margin:0;
    padding:0;
    background:#e1e6e0;
}


/* ESTILOS GENERALES ---------------------------------------------------------*/
.clear
{
    clear:both;
}
.center
{
    margin: 0 auto;
}
article
{
    float:left;
    width:100%;
    height:auto;
}
.top a
{
    padding:5px 6px 5px 6px;
    text-decoration:none;
    position:fixed;
    bottom:48px;
    right:45px;
    font-size:20px;
    color:#e1e6e0;
    background:#80d177;
    
    border-radius: 40px;
    -moz-border-radius: 40px;
    -o-border-radius: 40px;
    -webkit-border-radius: 40px;
    -ms-border-radius: 40px;
}
.top a:hover
{
    background:green;
    
    -webkit-transition:all .3s linear;  /* Chrome y Safari */
    -o-transition:all .3s linear;  /* Opera */
    -moz-transition:all .3s linear;  /* Mozilla Firefox */
    -ms-transition:all .3s linear;   /* Internet Explorer */
    transition:all .3s linear;  /* W3C */
}


/* /ESTILOS GENERALES --------------------------------------------------------*/

/* ESTILOS DEL HEADER --------------------------------------------------------*/
header
{
    width:960px;
    height:115px;
    border:solid 0px gray;
}

.logo
{
    float:left;
    position:relative;
    margin:12px 0 0 0;
    width:240px;
    height:90px;
}
.bgButtons
{
    float:right;
    position:relative;
    width:590px;
    height:88px;
    background:url('../images/bg-header.png') no-repeat;
}
.bgButtons .btn1
{
    float:left;
    margin:12px 0 0 350px;
    width:94px;
    height:94px;
}
.bgButtons .btn2
{
    float:left;
    margin:12px 0 0 10px;
    width:94px;
    height:94px;
}


nav
{
    width:960px;
    height:25px;
}
nav a
{
    float:left;
    padding:5px 20px 1px 20px;
    color:#0e3e64;
    font-family: 'MyriadWebProRegular';
    font-size:15px;
    font-weight:bold;
    text-decoration:none;
    border:solid 0px red;
}
nav a:hover
{
    color:#3ab44a;
    
    -webkit-transition:all .3s linear;  /* Chrome y Safari */
    -o-transition:all .3s linear;  /* Opera */
    -moz-transition:all .3s linear;  /* Mozilla Firefox */
    -ms-transition:all .3s linear;   /* Internet Explorer */
    transition:all .3s linear;  /* W3C */
}
.activo{ 
    float:left;
    padding:5px 20px 1px 20px;
    color:#3ab44a !important;
    font-family: 'MyriadWebProRegular';
    font-size:15px;
    font-weight:bold;
    text-decoration:none;
    border:solid 0px red;
}
.menu
{
    height:25px !important;
    border-top:solid 1px #477c7f !important;
    border-bottom:solid 1px #477c7f !important;
}
/* /ESTILOS DEL HEADER -------------------------------------------------------*/


/* ESTILOS DE LA SECCIÓN -----------------------------------------------------*/
section
{
    width:960px;
    height:auto;
}
.slider
{
    margin:20px 0 0 0;
}
/* Inician Estilos del Home */
section .home
{
    float:left;
    width:960px;
    height:auto;
    border:solid 0px yellow;
}
section .home .ideasAnimation
{
    float:left;
    position:relative;
    margin:30px 0 20px -100px;
    width:780px;
    height:600px;
    border:solid 0px red;
    z-index:1;
}
section .home .ideasAnimation .fixed-Image
{
    float:right;
    position:relative;
    margin:-200px 0 0 0;
    width:465px;
    height:424px;
    background: transparent url('../images/monos.png') 0 0 no-repeat;
    border:solid 0px blue;
    z-index:10;
}
section .home .ideasAnimation .cloud1
{
    position:relative;
    margin:0 0 0 80px;
    width:300px;
    height:169px;
    background: transparent url('../images/nube.png') 0 0 no-repeat;
    border:solid 0px blue;
    z-index:1;
}
section .home .ideasAnimation .cloud1-1
{
    position:relative;
    margin:-10px 0 0 260px;
    width:50px;
    height:50px;
    background: transparent url('../images/ovalo1.png') 0 0 no-repeat;
    border:solid 0px blue;
    z-index:2;
}
section .home .ideasAnimation .cloud1-2
{
    position:relative;
    margin:-20px 0 0 305px;
    width:37px;
    height:40px;
    background: transparent url('../images/ovalo2.png') 0 0 no-repeat;
    border:solid 0px blue;
    z-index:3;
}
section .home .ideasAnimation .cloud1-3
{
    position:relative;
    margin:-25px 0 0 343px;
    width:32px;
    height:35px;
    background: transparent url('../images/ovalo3.png') 0 0 no-repeat;
    border:solid 0px blue;
    z-index:4;
}

section .home .ideasAnimation .cloud2
{
    position:relative;
    margin:-70px 0 0 0;
    width:300px;
    height:169px;
    background: transparent url('../images/nube.png') 0 0 no-repeat;
    border:solid 0px blue;
    z-index:1;
}
section .home .ideasAnimation .cloud2-1
{
    position:relative;
    margin:-60px 0 0 260px;
    width:50px;
    height:50px;
    background: transparent url('../images/ovalo1.png') 0 0 no-repeat;
    border:solid 0px blue;
    z-index:2;
}
section .home .ideasAnimation .cloud2-2
{
    position:relative;
    margin:-40px 0 0 312px;
    width:37px;
    height:40px;
    background: transparent url('../images/ovalo2.png') 0 0 no-repeat;
    border:solid 0px blue;
    z-index:3;
}
section .home .ideasAnimation .cloud2-3
{
    position:relative;
    margin:-40px 0 0 350px;
    width:32px;
    height:35px;
    background: transparent url('../images/ovalo3.png') 0 0 no-repeat;
    border:solid 0px blue;
    z-index:4;
}


section .home .ideasAnimation .cloud3
{
    position:relative;
    margin:20px 0 0 50px;
    width:300px;
    height:169px;
    background: transparent url('../images/nube.png') 0 0 no-repeat;
    border:solid 0px blue;
    z-index:1;
}
section .home .ideasAnimation .cloud3-1
{
    position:relative;
    margin:-120px 0 0 295px;
    width:50px;
    height:50px;
    background: transparent url('../images/ovalo1.png') 0 0 no-repeat;
    border:solid 0px blue;
    z-index:2;
}
section .home .ideasAnimation .cloud3-2
{
    position:relative;
    margin:-70px 0 0 335px;
    width:37px;
    height:40px;
    background: transparent url('../images/ovalo2.png') 0 0 no-repeat;
    border:solid 0px blue;
    z-index:3;
}
section .home .ideasAnimation .cloud3-3
{
    position:relative;
    margin:-55px 0 0 355px;
    width:32px;
    height:35px;
    background: transparent url('../images/ovalo3.png') 0 0 no-repeat;
    border:solid 0px blue;
    z-index:4;
}

section .home .ideasAnimation .cloud1 .questionSign
{
    float:left;
    margin:10px 0 0 42px;
    width:162px;
    height:148px;
    background: transparent url('../images/nube1-signo.png') 0 0 no-repeat;
    border:solid 0px blue;
}
section .home .ideasAnimation .cloud1 .questionSign:hover
{
    background: transparent url('../images/nubes_producto.png') 0 0 no-repeat;
    
    -webkit-transition:all .5s linear;  /* Chrome y Safari */
    -o-transition:all .5s linear;  /* Opera */
    -moz-transition:all .5s linear;  /* Mozilla Firefox */
    -ms-transition:all .5s linear;   /* Internet Explorer */
    transition:all .5s linear;  /* W3C */
}
section .home .ideasAnimation .cloud2 .questionSign
{
    float:left;
    margin:0px 0 0 30px;
    width:211px;
    height:172px;
    background: transparent url('../images/nube2-signo.png') 0 0 no-repeat;
    border:solid 0px blue;
}
section .home .ideasAnimation .cloud2 .questionSign:hover
{
    background: transparent url('../images/nubes2_producto.png') 0 0 no-repeat;
    
    -webkit-transition:all .5s linear;  /* Chrome y Safari */
    -o-transition:all .5s linear;  /* Opera */
    -moz-transition:all .5s linear;  /* Mozilla Firefox */
    -ms-transition:all .5s linear;   /* Internet Explorer */
    transition:all .5s linear;  /* W3C */
}
section .home .ideasAnimation .cloud3 .questionSign
{
    float:left;
    margin:-10px 0 0 35px;
    width:205px;
    height:174px;
    background: transparent url('../images/nube3-signo.png') 0 0 no-repeat;
    border:solid 0px blue;
}
section .home .ideasAnimation .cloud3 .questionSign:hover
{
    background: transparent url('../images/nube3-producto.png') 0 0 no-repeat;
    
    -webkit-transition:all .5s linear;  /* Chrome y Safari */
    -o-transition:all .5s linear;  /* Opera */
    -moz-transition:all .5s linear;  /* Mozilla Firefox */
    -ms-transition:all .5s linear;   /* Internet Explorer */
    transition:all .5s linear;  /* W3C */
}



section .home .slogan
{
    float:right;
    position:relative;
    margin:-640px 0 0 0;
    width:450px;
    height:auto;
    border:solid 0px blue;
    z-index:2;
}
section .home .slogan .confeccionamos
{
    float:right;
    color:#838f82;
    font-family: 'GothamMedium';
    font-size:50px;
    border:solid 0px red;
}
section .home .slogan .ideas
{
    float:left;
    margin:0 0 0 100px;
    color:#3ab44a;
    font-family: 'GothamMedium';
    font-size:100px;
    border:solid 0px red;
}
section .home .slogan .para_ti
{
    float:right;
    margin:-10px 0 0 0;
    color:#838f82;
    font-family: 'GothamMedium';
    font-size:50px;
    border:solid 0px red;
}
section .home .twitter
{
    float:right;
    position:relative;
    margin:-292px 0 20px 0;
    width:220px;
    height:auto;
    border:solid 0px red;
    z-index:3;
}
/* Terminan Estilos del Home */


/* Inician Estilos de Nosotros */
section .nosotros
{
    float:left;
    width:960px;
    height:auto;
    border:solid 0px yellow;
}
section .nosotros h1
{
    float:left;
    margin:10px 0 0 0;
    width:100%;
    height:auto;
    color:#3ab44a;
    font-family: 'GothamMedium';
    font-size:30px;
    border-bottom:solid 1px #c0d2cc;
}
section .nosotros h2
{
    float:left;
    margin:10px 0 0 0;
    width:100%;
    height:auto;
    color:#3ab44a;
    font-family: 'GothamMedium';
    font-size:20px;
    border-bottom:solid 1px #c0d2cc;
}
section .nosotros p
{
    float:left;
    margin:20px 0 20px 0;
    width:100%;
    height:auto;
    color:#838f82;
    font-family: 'MyriadWebProRegular';
    font-size:16px;
    text-align:justify;
    border:solid 0px red;
}
/* Terminan Estilos de Nosotros */


/* Inician Estilos de Servicios */
section .servicios
{
    float:left;
    width:960px;
    height:auto;
    border:solid 0px yellow;
}
section .servicios a
{
    text-decoration:none;
    color:#23df5c;
}
section .servicios a:hover
{
    text-decoration:underline;
    color:#9ed1f9;
}
section .servicios h1
{
    float:left;
    margin:10px 0 0 0;
    width:100%;
    height:auto;
    color:#3ab44a;
    font-family: 'GothamMedium';
    font-size:30px;
    border-bottom:solid 1px #c0d2cc;
}
section .servicios p
{
    float:left;
    margin:20px 0 20px 0;
    padding:10px 10px;
    width:940px;
    height:auto;
    color:white;
    font-family: 'MyriadWebProRegular';
    font-size:16px;
    text-align:justify;
    background: #0e3e64;
    border:solid 0px red;
    
    border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    -webkit-border-radius: 10px;
    -ms-border-radius: 10px;
}
section .servicios .servicesBox
{
    float:left;
    margin:0 0 0 0;
    width:1000px;
    height:auto;
    border:solid 0px red;
}
section .servicios .servicesBox .service
{
    float:left;
    margin:0 50px 30px 0;
    width:280px;
    height:auto;
    border:solid 0px blue;
    cursor:pointer;
}
section .servicios .servicesBox .service:hover > img
{
    border:solid 8px #0e3e64;
    
    border-radius: 40px;
    -moz-border-radius: 40px;
    -o-border-radius: 40px;
    -webkit-border-radius: 40px;
    -ms-border-radius: 40px;
    
    -webkit-transition:all .3s linear;  /* Chrome y Safari */
    -o-transition:all .3s linear;  /* Opera */
    -moz-transition:all .3s linear;  /* Mozilla Firefox */
    -ms-transition:all .3s linear;   /* Internet Explorer */
    transition:all .3s linear;  /* W3C */
}
section .servicios .servicesBox .service:hover > h2
{
    background:#0e3e64;
    
    -webkit-transition:all .3s linear;  /* Chrome y Safari */
    -o-transition:all .3s linear;  /* Opera */
    -moz-transition:all .3s linear;  /* Mozilla Firefox */
    -ms-transition:all .3s linear;   /* Internet Explorer */
    transition:all .3s linear;  /* W3C */
}
section .servicios .servicesBox .service img
{
    float:left;
    margin:0;
    width:280px;
    height:280px;
    border:solid 8px white;
    
    border-radius: 150px;
    -moz-border-radius: 150px;
    -o-border-radius: 150px;
    -webkit-border-radius: 150px;
    -ms-border-radius: 150px;
}
section .servicios h2
{
    float:left;
    margin:10px 0 0 0;
    padding:5px 0 5px 0;
    width:100%;
    height:auto;
    color:white;
    font-family: 'MyriadWebProRegular';
    font-weight:bold;
    font-size:14px;
    text-align:center;
    background: #80d177;
    border:solid 0px red;
    
    border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    -webkit-border-radius: 10px;
    -ms-border-radius: 10px;
}
/* Terminan Estilos de Servicios */


/* Inician Estilos de Galería */
section .galeria
{
    float:left;
    width:960px;
    height:auto;
    border:solid 0px yellow;
}
section .galeria h1
{
    float:left;
    margin:10px 0 0 0;
    width:100%;
    height:auto;
    color:#3ab44a;
    font-family: 'GothamMedium';
    font-size:30px;
    border-bottom:solid 1px #c0d2cc;
}
section .galeria p
{
    float:left;
    margin:20px 0 20px 0;
    padding:10px 10px;
    width:940px;
    height:auto;
    color:white;
    font-family: 'MyriadWebProRegular';
    font-size:16px;
    text-align:justify;
    background: #0e3e64;
    border:solid 0px red;
    
    border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    -webkit-border-radius: 10px;
    -ms-border-radius: 10px;
}
section .galeria .productsBox
{
    float:left;
    margin:0 0 0 0;
    width:1050px;
    height:auto;
    border:solid 0px red;
}
section .galeria .productsBox .product
{
    float:left;
    margin:0 65px 20px 0;
    width:190px;
    height:250px;
    border:solid 0px blue;
    cursor:pointer;
}
section .galeria .productsBox .product:hover > img
{
    border:solid 5px #0e3e64;
    
    border-radius: 40px;
    -moz-border-radius: 40px;
    -o-border-radius: 40px;
    -webkit-border-radius: 40px;
    -ms-border-radius: 40px;
    
    -webkit-transition:all .3s linear;  /* Chrome y Safari */
    -o-transition:all .3s linear;  /* Opera */
    -moz-transition:all .3s linear;  /* Mozilla Firefox */
    -ms-transition:all .3s linear;   /* Internet Explorer */
    transition:all .3s linear;  /* W3C */
}
section .galeria .productsBox .product:hover > h2
{
    background:#0e3e64;
    
    -webkit-transition:all .3s linear;  /* Chrome y Safari */
    -o-transition:all .3s linear;  /* Opera */
    -moz-transition:all .3s linear;  /* Mozilla Firefox */
    -ms-transition:all .3s linear;   /* Internet Explorer */
    transition:all .3s linear;  /* W3C */
}
section .galeria .productsBox .product img
{
    float:left;
    margin:0;
    width:180px;
    height:180px;
    border:solid 5px white;
    
    border-radius: 100px;
    -moz-border-radius: 100px;
    -o-border-radius: 100px;
    -webkit-border-radius: 100px;
    -ms-border-radius: 100px;
}
section .galeria h2
{
    float:left;
    margin:10px 0 0 0;
    padding:5px 5px;
    width:180px;
    height:auto;
    color:white;
    font-family: 'MyriadWebProRegular';
    font-size:12px;
    text-align:center;
    background: #80d177;
    border:solid 0px red;
    
    border-radius: 10px;
    -moz-border-radius: 10px;
    -o-border-radius: 10px;
    -webkit-border-radius: 10px;
    -ms-border-radius: 10px;
}
section .galeria p a
{
    text-decoration:none;
    color:#23df5c;
}
section .galeria p a:hover
{
    text-decoration:underline;
    color:#9ed1f9;
}
/* Terminan Estilos de Galería */


/* Inician Estilos de Contacto */
section .contacto
{
    float:left;
    width:960px;
    height:auto;
    border:solid 0px yellow;
}section .contacto a
{
    text-decoration:none;
    color:#23df5c;
}
section .contacto a:hover
{
    text-decoration:underline;
    color:#9ed1f9;
}
section .contacto h1
{
    float:left;
    margin:10px 0 0 0;
    width:100%;
    height:auto;
    color:#3ab44a;
    font-family: 'GothamMedium';
    font-size:30px;
    border-bottom:solid 1px #c0d2cc;
}
section .contacto p
{
    float:left;
    margin:20px 0 85px 0;
    width:300px;
    height:auto;
    color:#838f82;
    font-family: 'MyriadWebProRegular';
    font-size:16px;
    text-align:justify;
    border:solid 0px red;
}

section .contacto .formulario
{
    float:right;
    margin:20px 0 20px 0;
    width:600px;
    height:auto;
}
section .contacto .formulario .contInput
{
    float:left;
    width:100%;
    height:auto;
    margin:0 0 10px 0;
}
section .contacto .formulario .contInput label
{
    float:left;
    width:160px;
    height:25px;
    margin:0 0 0 0;
    color:#838f82;
    font-family: 'MyriadWebProRegular';
    font-size:16px;
}
section .contacto .formulario .contInput .required
{
    font-size:12px;
    font-style:italic;
    color:#ababab;
}
section .contacto .formulario input
{
    width:400px;
    height:25px;
    margin:0 0 0 0;
    padding:0 0 0 10px;
    font-family: 'MyriadWebProRegular';
    font-size:14px;
    color:#949494;
    border:solid 1px #c6c6c6;
    
    border-radius: 5px;
    -moz-border-radius: 5px;
    -o-border-radius: 5px;
    -webkit-border-radius: 5px;
    -ms-border-radius: 5px;
}
section .contacto .formulario input:hover
{
    background:#f2f2f2;
    border:solid 1px #dcdcdc;
}
section .contacto .formulario textarea
{
    width:400px;
    height:100px;
    margin:0 0 0 0;
    padding:10px 0 0 10px;
    font-family: 'MyriadWebProRegular';
    font-size:14px;
    color:#949494;
    border:solid 1px #c6c6c6;
    
    border-radius: 5px;
    -moz-border-radius: 5px;
    -o-border-radius: 5px;
    -webkit-border-radius: 5px;
    -ms-border-radius: 5px;
}
section .contacto .formulario textarea:hover
{
    background:#f2f2f2;
    border:solid 1px #dcdcdc;
}
section .contacto .formulario input[type="button"]
{
    float:right;
    margin:0 25px 0 0;
    padding:0;
    width:100px;
    height:40px;
    font-size:14px;
    font-weight:bold;
    text-align:center;
    color:#fff;
    background:#183895;
    cursor:pointer;
    border:0px;
    
    -webkit-transition:all .3s linear;  /* Chrome y Safari */
    -o-transition:all .3s linear;  /* Opera */
    -moz-transition:all .3s linear;  /* Mozilla Firefox */
    -ms-transition:all .3s linear;   /* Internet Explorer */
    transition:all .3s linear;  /* W3C */
}
section .contacto .formulario input[type="button"]:hover
{
    background:#3ab44a;
}
/* Terminan Estilos de Contacto */
/* /ESTILOS DE LA SECCIÓN ----------------------------------------------------*/


/* ESTILOS DEL FOOTER --------------------------------------------------------*/
footer
{
    width:960px;
    height:25px;
}
.greenBG
{
    height:25px !important;
    background:#39b54a !important;
}
.socialMedia
{
    float:left;
    width:30%;
    height:25px;
    border:solid 0px red;
}
.socialMedia .iconFacebook
{
    float:left;
    width:23px;
    height:23px;
}
.socialMedia .iconTwitter
{
    float:left;
    width:23px;
    height:23px;
}
.copyright{ 
    float:right;
    width:500px;
    margin:8px 0 0 0;
    color:white !important;
    font-family: 'MyriadWebProRegular';
    font-size:10px;
    text-align:right;
    border:solid 0px red;
}
.copyright a{ 
    color:white !important;
}
.copyright a:hover{ 
    color:#0e3e64 !important;
}
/* /ESTILOS DEL FOOTER -------------------------------------------------------*/