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

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend {
    background: none repeat scroll 0 0 transparent;
    border: 0 none;
    font-size: 100%;
    list-style: outside none none;
    margin: 0;
    outline: 0 none;
    padding: 0;
    vertical-align: baseline;
}
body {
    line-height: 1;
}
ol, ul {
    list-style: outside none none;
}
blockquote, q {
    quotes: none;
}
blockquote::before, blockquote::after, q::before, q::after {
    content: none;
}
blockquote {
    border-left: 5px solid;
    margin: 20px 0 30px;
    padding-left: 20px;
}
:focus {
    outline: 0 none;
}
ins {
    text-decoration: none;
}
del {
    text-decoration: line-through;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
article, aside, footer, header, hgroup, nav, section {
    display: block;
}

/*****FONTS******/
/*@font-face {
    font-family: RobotoMedium;
   src: url(../fonts/Roboto-Medium.ttf) format('truetype'),
	url(../fonts/Roboto-Medium.otf) format('opentype'),
	url(../fonts/Roboto-Medium.svg) format('svg');
}

@font-face {
    font-family: RobotoLight;
    src: url(../fonts/Roboto-Light.ttf) format('truetype'),
	url(../fonts/Roboto-Light.otf) format('opentype'),
	url(../fonts/Roboto-Light.svg) format('svg');
}


@font-face {
    font-family: RobotoThin;
    src: url(../fonts/Roboto-Thin.ttf) format('truetype'),
	url(../fonts/Roboto-Thin.otf) format('opentype'),
	url(../fonts/Roboto-Thin.svg) format('svg');
}*/

/*****SITE******/

#wrapper{
	width:100%;
	height:auto;
	margin:0;
	padding:0;	
}

#loading{
	position:fixed;
	background-color:rgba(255,255,255,0.95);
	background-image:url(../images/loading.gif);
	background-repeat:no-repeat;
	background-position:center center;
	width:100%;
	height:100%;
	top:0;
	z-index:20000;
}





/*******TOP*********/

#top_menu{
	position:fixed;
	top:0;
	width:100%;
	height:187px;
	background-image:url(../images/top_back.png);
	background-repeat:no-repeat;
	
	background-position:top right;
	background-color:rgba(255, 255, 255, 0.5);
	z-index:500;
	background-size:cover;
}

@keyframes animateTop {
	from { height: 187px; }
	to { height: 100px; }
}

#top_menu.minimised{
	animation: animateTop 0.3s ease-out;
	height: 100px;
}

#top_menu img.minimised{
	height:80%;
	margin-top:15px;
	margin-left:15px;
}

#top_menu img{
	float:left;
	width:auto;
	/*height:80%;*/
	height:auto;
	margin-top:35px;
	margin-left:35px;
}

#top_logo{
	width:175px;
	height:138px;
	float:left;
	background:url(../images/rh_logo.png);
	background-size:100% 100%;
	margin-left:30px;
	margin-top:25px;
}

#top_buttons{
	float:right;
	font-family:"Roboto";
	font-size:15px;
	/*margin-right:50px;
	margin-top:145px;*/
	position:absolute;
	bottom:25px;
	right:30px;
	font-weight:normal;
}

#top_buttons.minimised{
	bottom:-5px !important;
}

#top_buttons a{
	text-decoration:none;
	color:#FFF;
	background-repeat:no-repeat;
	background-position:center bottom;
	padding-bottom:10px;
	background-image:none;
	float:left;
}

@keyframes animatedTopButton {
	from { background-position: 50% 50%; }
	to { background-position: 50% 100%; }
}

#top_buttons a:hover{
	background-image:url(../images/top_button_arrow.png);
	animation: animatedTopButton 0.2s linear;
}

#top_buttons span{
	float:left;
	margin-left:10px;
	margin-right:10px;
	border-left:1px solid #FFF;
	border-right:1px solid #FFF;
	height:11px;
	margin-top:2px;
}

#top_buttons a.contacto{
	background-color:#5492a3;
	border-radius:6px;
	padding:5px;
	margin-top:-5px;
	border:1px ##5492a3;
}

#top_buttons a.contacto:hover{
	padding-bottom:10px;
}

#top_buttons a span{
	background-color:#5492a3;
	border-radius:6px;
	padding:5px;
	padding-left:10px;
	padding-right:10px;
	margin-top:-5px;
	border:none;
	height:auto;
}


#space{
	width:100%;
	height:880px;
	overflow:hidden;
	float:left;
	position:relative;
}

#space_back{
	position:absolute;
	width:100%;
	height:auto;
	z-index:10;
}

#space_back img{
	width:100%;
	height:auto;
}

#space_front{
	position:absolute;
	width:100%;
	height:auto;
	z-index:20;
}

.video{
	height: auto !important;
}

/*******HOME SPACE******/

.home{
	height:840px !important;
	/*margin-top:40px;*/
	z-index:100 !important;
}

/*HOME SPACE TOP GALLERY NAVIGATION*/

#top_navigation{
	width:100%;
	height:200px;
	bottom:30px;
	position:absolute;
	display:block;
        z-index:10;
}

#top_navigation h1{
	color:#84a4ac;
	font-size:38px;
	font-family:"Roboto";
	text-align:center;
	font-weight:normal;
}


#top_navigation_buttons{
	margin-top:20px;
	margin-left: auto;
    margin-right: auto;
	text-align:center;
	display:table;
}

#top_navigation_buttons .circle {
	border-radius: 50%;
	width: 8px;
	height: 8px;
	background-color:#009fdf;
	display:inline;
	float:left;
	margin-left:12px;
	margin-right:12px;
}

#top_navigation_buttons .selected {
	background-color:#FFF;
}

#home_mouse{
	position:absolute;
	bottom:25px;
	left:calc(50% - 100px);
	width:200px;
	background:url(../images/home_arrow.png) no-repeat center bottom;
	padding-bottom:10px;
}

#home_mouse_content{
	border-radius: 25px;
    bottom: 50px;
    box-shadow: 0 0 0 3px #CCC inset;
    height: 40px;
    width: 22px;
    z-index: 99;
	position:absolute;
	margin-left:88px;
	
}

@keyframes scroll {
    from {opacity: 1; margin-top:5px;}
    to {opacity: 0; margin-top:35px;}
}

#home_mouse_content::before {
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
    animation-name: scroll;
    background: none repeat scroll 0 0 #009fdf;
    border-radius: 4px;
    content: " ";
    height: 6px;
    margin-left:8px;
    top: 4px;
    width: 6px;
	display:block;
}

#home_mouse p{
	color:#446c83;
	font-family:"Roboto";
	font-weight:normal;
	font-size:15px;
	text-align:center;
	display:block;
	margin-bottom:10px;
}



/*******MODA SPACE******/

.moda{
	z-index:90 !important;
	height:880px !important;
}

#moda_title{
	width:100%;
	font-family:"Roboto";
	font-weight:normal;
	font-size:18px;
	color:#FFF;
	background-image:url(../images/project_arrow.png);
	background-repeat:no-repeat;
	background-position:center bottom;
	padding-bottom:10px;
	text-align:center;
	margin-top:25px;
}

#moda_copete{
	width:100%;
	color:#FFF;
	text-align:center;
	margin-top:100px;
}

#moda_copete h2{
	font-family:"Roboto";
	font-weight:normal;
	font-size:51px;
}

#moda_copete span{
	font-family:"Roboto";
	font-weight:lighter;
	font-size:31px;
}

#moda_buttons{
	width:auto;
	text-align:center;
	margin:auto;
	margin-top:110px;
	display:table;
}

#moda_buttons a{
	padding:6px 10px;
	border-radius:5px;
	font-family:"Roboto";
	font-weight:lighter;
	font-size:14px;
	float:left;
	color:#FFF;
	text-decoration:none;
	position:relative;
}

#moda_buttons a.desarrollo{
	background-color:#aea8a2;
}

#moda_buttons a.desarrollo img{
	margin-left:35px;
}

#moda_buttons a.modelaje{
	background-color:#008c9f;
}

#moda_buttons a.modelaje img{
	margin-left:27px;
}

#moda_buttons a.tendencias{
	background-color:#5bca79;
}

#moda_buttons a.tendencias img{
	margin-left:33px;
}

#moda_buttons a img{
	display:none;
	position:absolute;
}

#moda_buttons a.selected{
}

@keyframes animatedModaButton {
	from { margin-top: 0; }
	to { margin-top:12px; }
}

#moda_buttons a.selected img{
	display:block;
	animation: animatedModaButton 0.2s linear;
	margin-top:12px;
}

#moda_buttons span{
	margin-left:10px;
	margin-right:10px;
	margin-top:7px;
	border-left:1px solid #FFF;
	height:12px;
	width:1px;
	float:left;
}

#moda_texts{
	width:auto;
	text-align:center;
	margin:auto;
	margin-top:30px;
	display:table;
}

#moda_texts p{
	font-family:"Roboto";
	font-weight:lighter;
	font-size:15px;
	max-width:430px;
	text-align:center;
	color:#FFF;
	line-height:18px;
	display:none;
}

#moda_texts p.selected{
	display:inherit;
}

#moda_down{
	position:absolute;
	width:100%;
	background:url(../images/down_arrow.png) no-repeat center center;
	height:40px;
	bottom:20px;
	z-index:100;
	cursor:pointer;
}

/******PROCESOS*********/
.proceso{
	z-index:80 !important;
	background:#d7d1cb;
}

.proceso_copete{
	color:#867570 !important; 
	margin-top:160px !important;
}

#proceso_info{
	max-width:710px;
	margin:auto;
	color:#867570;
	text-align:center;
	margin-top:125px;
}

#proceso_info_conteiner{
	width:33%;
	float:left;
	text-align:center;
	opacity:0; 
	-moz-opacity:0;
}

@keyframes opacityCircle {
	from { opacity:0; -moz-opacity:0; margin-top:-50px; }
	to { opacity:1; -moz-opacity:1; margin-top:0px; }
}

#proceso_info_conteiner.animate{
	animation: opacityCircle 1s ease-out;
	opacity:1; 
	-moz-opacity:1;
}

#proceso_info_conteiner h2{
	font-family:"Roboto";
	font-weight:lighter;
	font-size:27px;
	margin-top:25px;
	display:block;
}

#proceso_info_conteiner span{
	font-family:"Roboto";
	font-weight:lighter;
	font-size:19px;
	margin-top:15px;
	line-height:20px;
	display:block;
}

#moda_down.proceso_moda{
	background-image:url(../images/proceso/proceso_down.png) !important;
}

/******TECNOLOGIA*********/
.tecnologia{
	z-index:70 !important;
}

.tecnologia_front{
	width:705px !important;
	height:550px !important;
	background-color:rgba(0,0,0,0.5);
	margin-left:calc(50% - 352px);
}

#tecnologia_texts{
	font-family:"Roboto";
	font-weight:lighter;
	font-size:15px;
	text-align:center;
	position:absolute;
	bottom:0px;
	line-height:20px;
	color:#FFF;
	padding:40px;
}

.tecnologia_copete{
	margin-top:160px !important;
}

/********SERVICIOS********/

.servicios_copete{
	margin-top:160px !important;
}

.servicios{
	background-color:#0eb1ed;
	background-image:url(../images/servicios_back.png);
	background-repeat:no-repeat;
	background-position:center 470px;
}

#servicios_copete{
	font-family:"Roboto";
	font-weight:normal;
	font-size:15px;
	text-align:center;
	max-width:400px;
	line-height:20px;
	color:#FFF;
	margin:auto;
	margin-top:35px;
}

#moda_buttons.servicios_bots{
	margin-top:50px !important;
}

#moda_buttons a.horma{
	background-color:#87c0d9;
}

#moda_buttons a.horma img{
	margin-left:16px;
}

#moda_buttons a.disenio{
	background-color:#7b9aa3;
}

#moda_buttons a.disenio img{
	margin-left:17px;
}

#moda_buttons a.zapato{
	background-color:#aea8a2;
}

#moda_buttons a.zapato img{
	margin-left:53px;
}

#moda_buttons a.plantilla{
	background-color:#008c9f;
}

#moda_buttons a.plantilla img{
	margin-left:27px;
}

/********CONTACTO********/

.contactop{
	background-color:#FFF;
}

#moda_copete.contacto_copete{
	color:#5492a3 !important;
	margin-top:160px !important;
}

#contacto_content{
	max-width:1015px;
	margin:auto;
	margin-top:90px;
}

#contacto_content_data{
	width:50%;
	float:left;
	min-height:10px;
}

#contacto_content_data:last-child{
	margin-left:30px;
	width:calc(50% - 30px);
}

#contacto_content_data form{
	color:#5492a3;
	font-family:"Roboto";
	font-weight:lighter;
	font-size:14px;
}

#contacto_content_data form label{
	width:30%;
	float:left;
	margin-top:10px;
}

#contacto_content_data form input[type='text'], #contacto_content_data form input[type='email'], #contacto_content_data form textarea{
	width:calc(68% - 10px);
	padding:0px 5px;
	float:left;
	height:30px;
	border:1px solid #CCC;
	color:#5492a3;
	font-family:"Roboto";
	font-weight:lighter;
	font-size:14px;
	margin-bottom:10px;
}

#contacto_content_data form textarea{
	height:80px;
}

#contacto_content_data form input[type='submit']{
	float:right;
	border:none;
	border-radius:5px;
	background:#5492a3;
	padding:5px 25px;
	color:#FFF;
	font-family:"Roboto";
	font-weight:lighter;
	font-size:14px;
	margin-right:1.5%;
	margin-top:10px;
}

#contacto_content_data p{
	width:100%;
	text-align:left;
	color:#303030;
	font-family:"Roboto";
	font-weight:lighter;
	font-size:13px;
	margin-top:5px;
}

#contacto_content_data p a{
	text-decoration:none;
	color:#303030;
}

#contacto_content_data p a:hover{
	text-decoration:underline;
}

#contacto_content_data p:first-of-type{
	margin-top:20px !important;
}

#contacto_msn{
	color: #090;
	font-family:"Roboto";
	font-weight:lighter;
	font-size:13px;
    float: right;
    height: 100px;
    margin-top: 20px;
    text-align: right;
    width: 99%;
	margin-right:7px;
}


#moda_down.contacto_down{
	background-image:url(../images/contacto_down.png) !important;
}

/********NEWSLETTER********/

.newsletter{
	background-color:#5492a3;
	height:163px !important;
}

#newsletter_content{
	max-width:945px;
	margin:auto;
	margin-top:70px;
}

#newsletter_content_left{
	width:calc(40% - 60px);
	padding-left:60px;
	height:25px;
	padding-top:7px;
	background:url(../images/envelope.png) no-repeat left center;
	float:left;
	font-family:"Roboto";
	font-weight:normal;
	font-size:21px;
	color:#FFF;
}

#newsletter_content_right{
	width:60%;
	float:left;
}

#newsletter_content_right form{
	color:#5492a3;
	font-family:"Roboto";
	font-weight:lighter;
	font-size:14px;
}

#newsletter_content_right form input[type='text']{
	width:calc(37% - 10px);
	padding:0px 5px;
	float:left;
	height:30px;
	border:1px solid #CCC;
	color:#5492a3;
	font-family:"Roboto";
	font-weight:lighter;
	font-size:14px;
	margin-right:10px;
}

#newsletter_content_right form input[type='submit']{
	float:left;
	border:none;
	border-radius:5px;
	background:#68afc1;
	padding:5px 25px;
	color:#FFF;
	font-family:"Roboto";
	font-weight:lighter;
	font-size:14px;
}

/********SINERGIA********/

.sinergia{
	height:740px !important;
}

#moda_copete.sinergia_copete{
	color:#000 !important;
	margin-top:160px !important;
}

#sinergia_hp{
	width:100%;
	text-align:center;
	margin-top:70px;
	color:#000;
	font-family:"Roboto";
	font-weight:normal;
	font-size:15px;
}

#sinergia_hp p{
	margin-top:75px;
}

/********PIE********/

.pie{
	height:255px !important;
	background:#FFF;
}

#pie_content{
	max-width:700px;
	margin:auto;
	margin-top:55px;
}

#pie_content_info{
	width:50%;
	float:left;
	color:#303030;
	font-family:"Roboto";
	font-weight:lighter;
	font-size:13px;
	text-align:center;
}

#pie_content_info p{
	margin-top:5px;
	width:100%;
	text-align:left;
}

#pie_content_info p a{
	text-decoration:none;
	color:#303030;
}

#pie_content_info p a:hover{
	text-decoration:underline;
}

#pie_content_info p:first-of-type{
	margin-top:25px;
}

#pie_content_info img{
	margin-left:15px;
}



#pie_pie{
	width:100%;
	background:#4b4b4b;
	height:31px;
	padding-top:17px;
	font-family:"Roboto";
	font-weight:lighter;
	font-size:13px;
	color:#FFF;
	text-align:center;
	position:absolute;
	bottom:0;
}
	
	
	
/*******PHONE*******/

#phone_menu{
	display:none;
}

#phone_logo{
	display:none;
}

#phone_logo_land{
	display:none;
}

#moda_texts span{
	display:none;
}