/* ============================== */
/* ! Layout for desktop version   */
/* ============================== */
@font-face {
    font-family: 'Cuprum';
    src: url('../fonts/Cuprum-Regular.ttf');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/OpenSans-Regular.ttf');
    font-weight: normal;
    font-style: normal;
}


	body {

		font-family: 'Open Sans', sans-serif;
		font-size:14px;
	}
	
	h2 {
	text-align: center	;
	line-height:150%;
	font-weight:300;
		
	}

.mainmenu {
	margin-top:15px;
    color: #333;
    font-family: 'Cuprum',Georgia,"Times New Roman",Times,Serif;
    font-size: 16px;
    height: 57px;
}
.mainmenu ul {margin: 0; padding: 0; }
.mainmenu li i { position: absolute; margin-left: -35px; margin-top: 6px;}
.mainmenu li {
	float: left;
	display: block;
	padding: 10px 10px 10px 50px;
	cursor: pointer;
	border-right-width: 1px;
	border-top-style: none;
	border-right-style: solid;
	border-bottom-style: none;
	border-right-color: #333;
}
.mainmenu li:last-child{ border-right:none;}
.mainmenu li main {font-weight: 700; margin-top: -18px; }
.mainmenu li span {
	position: relative;
	float: left;
	font-size: 12px;
	color: #333333;
}

.mainmenu li, .mainmenu li i, .mainmenu li main, .mainmenu li span {
    -moz-transition: all 0.8s ease-in-out;
    -o-transition: all 0.8s ease-in-out;
    transition: all 0.8s ease-in-out;
    -webkit-transition: all 0.8s ease-in-out;
}

.mainmenu li:hover main { 
	margin-left: 10px; 
   -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
	color:#FFF;
}
.mainmenu li:hover span { 
	margin-left: 25px; 
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
	color:#FFF;
}

/* COLOR MANAGEMENT */

.ccblue .mainmenu { background: none repeat scroll 0 0 #FFF;}

.ccblue .mainmenu li a:link, .ccblue .mainmenu li a:visited {  text-decoration:none;
 color: #333; }


.ccblue .mainmenu li:hover { background: #212a70; text-decoration:none }
.ccblue .mainmenu li:hover i {color: #FFF;}
.ccblue .mainmenu li i { color: #212a70; }
.ccblue .mainmenu li:hover i {color: #ffffff;}

.ccred .mainmenu { background: none repeat scroll 0 0 #f00940;}
.ccred .mainmenu li:hover { background: #a30328; }
.ccred .mainmenu li i { color: #a30328; }
.ccred .mainmenu li:hover i {color: #ffffff;}

.ccgreen .mainmenu { background: none repeat scroll 0 0 #98c304;}
.ccgreen .mainmenu li:hover { background: #5e7902; }
.ccgreen .mainmenu li i { color: #5e7902; }
.ccgreen .mainmenu li:hover i {color: #ffffff;}

.cssbron .mainmenu { background: none repeat scroll 0 0 #af4004;}
.cssbron .mainmenu li:hover { background: #7c2e03; }
.cssbron .mainmenu li i { color: #7c2e03; }
.cssbron .mainmenu li:hover i {color: #ffffff;}

section{ float:left; width:100%;}
	
	.sombra {
	background-color: #f4f4f4;
	background-image: url(../images/header_shadow.png);
	background-repeat: no-repeat;
	background-position: center top;		
	}
	
	.sombra p {
		padding:30px;
		text-align:center;
		
	}
	
	.sombra h2 {
		margin-top:30px;
		
	}
	
	.titulos {
	background-color: #f4f4f4;
	background-image: url(../images/header_shadow.png);
	background-repeat: no-repeat;
	background-position: center top;		
	}
	
	.marco {
	border: 4px solid #CCC;
	display:block;
	overflow:hidden;
	padding:10px;
	}
	
	.somos {
		background-color:#cacaca;
		font-size:16px
		
		
	}
	
	.footer {
	background-color: #000;
	color: #999;
	font-size: 10px;

	}
	
	.contact {
	background-image: url(../images/footer3.gif);
	background-repeat: no-repeat;
	background-position: center top;
	background-color: #2a2a2a;
	background-size:cover;
	text-align:center;
	padding-right:20px;
	}
	
	.contact h1 {
		font-size:44px;
		color:#676767;
		line-height:48px;
		
	}
	.contact h4 {
		font-size:18px;
		color:#676767;
		line-height:24px;
		
	}
	
	
	ul {
		margin-left:20px;
		
	}
	li {
	border-top-width: 1px;
	border-bottom-width: 1px;
	border-top-style: dotted;
	border-bottom-style: dotted;
	border-top-color: #CCC;
	border-bottom-color: #CCC;
	line-height:20px;
	margin-top:2px;		
	}
	
	.main2{
	width: 980px;
	height: 400px;
	padding: 30px 0;
	margin: 0 auto;
	position: relative;
	overflow: hidden;
	
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
}


p,
pre {
    margin: 1em 0;
}

.nombres {
	float:left;
	width:100%;
	overflow:hidden
	
	
}

.comentarios {
	float:left;
	width:100%;
	overflow:hidden
	
	
}
.nombres input {
	border: 1px solid #CCC;
	padding:10px;
	-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
margin-top:5px;
width:80%;
}


.nombres textarea {
	width:80%;
		border: 1px solid #CCC;
	padding:10px;
	-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
margin-top:5px;
margin-bottom:5px
	
}

.form_message_fail {
	color:#F00;
	font-size:14px;
	font-weight:bold
	
}
form_message_success {
	color:#06F;
	font-size:14px;
	font-weight:bold
	
	
}
nav#mobile {
	display:none
	
}


/* ============================= */
/* ! Layout for mobile version   */
/* ============================= */

@media handheld, only screen and (max-width: 767px) {

	body {
		
	}
	
	.mainmenu {
		display:none;
		
	}
	
	#nav#full {
		display:none
	}

	nav#mobile {
		background-color:#131a8c;
		box-shadow: 0 0 3px 2px rgba(0,0,0,0.3);
		display:block;
	}

	/*
	Top black bar that holds the toggle button
	*/

	nav#mobile #toggle-bar {
		line-height:45px;
		height:45px;
	}

	/*
	Toggle button #1 ("Menu")
	*/

	nav#mobile strong a {
		margin-left:30px;
		border:1px solid #6CF;
		padding:10px;
		color:#FFF;
		text-decoration:none
	}
	
	nav#mobile strong a:hover {
		color:#CCC;
		text-decoration:none
		
	}

	/*
	Toggle button #2 ("Navicon")
	*/

	nav#mobile .navicon {
		float: right;
		height: 6px;
		width: 34px;
		margin-right: 20px;
		margin-top:7px;
		border-top: 18px double #FFF;
		border-bottom: 6px solid #FFF;
		font-size:0;
	}

	/*
	The dropdown menu
	*/
nav#mobile ul {
	margin-left:0 !important;
}
	nav#mobile ul li {
		clear:both;
		list-style:none;
		margin-left:0;
		padding-left:0;
	}

	nav#mobile ul li a {
	display: block;
	background-color: #BDD1E8;
	text-transform: uppercase;
	letter-spacing: 0.2em;
	margin: 2px 0;
	padding: 6px 0 6px 8px;
	color: #333;
	text-decoration:none
	}

	nav#mobile ul ul {
		font-size:small;
	}

	nav#mobile ul ul li {
		margin-left:0px;
	}

	nav#mobile ul ul a {
		background-color:#AFC9E2;
		padding-left:8px;
		color:#333
	}

	nav#mobile ul ul a:before {
		content: "2192";
		padding-right:8px;
	}

}


/* ========================================== */
/* ! Provide higher res assets for iPhone 4   */
/* ========================================== */

@media only screen and (-webkit-min-device-pixel-ratio: 2) { 

/*	.logo {
		background: url(logo2x.jpg) no-repeat;
		background-size: 212px 303px;
	}*/

}