/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/

/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */

/* #Site Styles
================================================== */


/* Tipografia ------------------------- */

/*h1,h2,h3,h4 {font-family: "Aero Matics"}
h5,h6,p,a {font-family: "Helvetica"}*/


/* Fondos y Margenes ------------------------- */
b{
	font-weight: bold;
}
.white{ background: #f1f1f1; }
.white h1,h2,h3,h4,h5,h6,p {color:#000; font-family: "opensans";}


.head{background:url(../images/bghead.jpg) no-repeat top center;}

.black{ background: #334a8d;}
.black h1,h2,h3,h4,h5,h6,p {color:#fff; font-family: "opensans";}

.dark{ background: #383838;}
.dark h1,h2,h3,h4,h5,h6,p {color:#fff; font-family: "opensans";}

.space {padding:2% 0 2% 0;}



/* Menu ------------------------- */

#menu {background:#fff;  border-bottom: 2px solid #d2d2d2;
}

#menu ul {
    width: 100%;
    padding: 2% 0 0 0;
    list-style-type: none;
}

#menu a {
	font-size:20px;
    width: 6em;
    text-decoration: none;
    color: #334a8d;
    padding: 0.5em 1em;
   

}

#menu  a:hover {
    color:#ccc;
}

#menu  li {
    display: inline;
    border-left:1px #ccc solid;

}

#menu li.first {
    border:none;
    
}

/* Tiny Menu ------------------------- */

#tinymenu {background:#fff; padding: 2% 0 2% 0;}

#tinymenu ul {
    width: 100%;
    padding: 1% 0 1% 0;
    margin: 5% 0 5% 0;
    
   
}

#tinymenu a {
	font-size:20px;
    width: 6em;
    text-decoration: none;
    color: white;
    padding: 0.2em 1em;
}

#tinymenu  li {
	max-width: 300px;
	padding: 2% 0 2% 0;
	border-bottom:solid #680000 1px;
    
}





/* Elementos ------------------------- */

.logo{width:90%; max-width:400px; }
.logo-contact{width:90%; max-width:200px;}
.banner-contact{height:180px; margin-left: 15%;}
 .highlight {background:#000; padding:1% 2%;}


.info{padding-top:3%;}

.social{padding-top:6.5%;}
.socialfooter{padding:2%;}

.banner{height:400px;}

a.buttonred{background:#d8252a; width:30%; padding:1% 2% 1% 2%; border-radius:5px; display: inline-block; color: #fff; font-weight: 600;}

a.buttonphone{background-image: linear-gradient(to right, #334a8d , #4660a9); width:30%; padding:1% 2% 1% 2%; border-radius:5px; display: inline-block; color: #fff; font-weight: 600;}

.buttonbig{background:#d8252a; width:100%; padding:2% 0 2% 0; border-radius:5px;}
.buttonbig  h5,a{ text-decoration: none;}

.buttonwhite{background:#fff; width:70%; padding:0 1% 0 1%; border-radius:3px; cursor:pointer;}
.buttonwhite  h5,a{ text-decoration: none;}


.circle {margin:10% 0;}

.circle img {
	width:70%;
   -webkit-transition: all .5s ease; /* Safari and Chrome */
   -moz-transition: all .5s ease; /* Firefox */
   -ms-transition: all .5s ease; /* IE 9 */
   -o-transition: all .5s ease; /* Opera */
   transition: all .5s ease;
   
}

.circle:hover img {
   -webkit-transform:scale(1.1); /* Safari and Chrome */
   -moz-transform:scale(1.1); /* Firefox */
   -ms-transform:scale(1.1); /* IE 9 */
   -o-transform:scale(1.1); /* Opera */
    transform:scale(1.1);
   
}



.arrow-up {
	width: 0; 
	height: 0; 
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	
	border-bottom: 5px solid black;
}

.arrow-down {
	width: 0; 
	height: 0; 
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
	
	border-top: 10px solid #680000;
	margin-top:-7px;
}

.arrow-right {
	width: 0; 
	height: 0; 
	border-top: 60px solid transparent;
	border-bottom: 60px solid transparent;
	
	border-left: 60px solid green;
}

.arrow-left {
	width: 0; 
	height: 0; 
	border-top: 10px solid transparent;
	border-bottom: 10px solid transparent; 
	
	border-right:10px solid blue; 
}


.view-desktop {display:block;}
.view-mobile {display:none;}



/* #Page Styles
================================================== */
.badge{
    font-size: 15px;
    padding:5px 10px;
    -webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	display: inline-block;
	font-weight: 600;
}

.badge-red{
    background: #d8252a;
    color: #fff;
}

/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {


	}


	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 960px) and (max-width: 1065px) {

		#menu a {
		font-size:18px;
	    padding: 0.2em 0.8em;}


	}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {

		#menu a {
		font-size:14px;
	    padding: 0.2em 0.8em;
	}

	}

	/* All Mobile Sizes (devices and browser) */
	@media only screen and (max-width: 767px) {
		
		.buttonred{width:50%;}
		.buttonred h4{font-size: 16px;}

		.view-desktop {display:none;}
		.view-mobile {display:block;}


		.info{ text-align: center;}
		.social{ text-align: center;}

		.flip-clock-wrapper {zoom: 60%;}
.banner-contact{height:180px; margin-left: 0%; text-align: center;}

	}


	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {}



	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {
		
		.flip-clock-wrapper {zoom: 40%; margin:50% 0;}
		.banner{height:330px;}

			}


/* #Font-Face
================================================== */


	@font-face {
	    font-family: 'opensans';
	    src: 
	         url('../fonts/OpenSans-Regular.ttf') format('truetype');
	    font-weight: normal;
	    font-style: normal; }