/* Main file to be used by all pages */

	html {
		color: #222;
		font-size: 1em;
		line-height: 1.4;
		box-sizing: border-box;
	}

	

	*, *:before, *:after {
		box-sizing: inherit;
	}

	::-moz-selection {
		background: #b3d4fc;
		text-shadow: none;
	}

	::selection {
		background: #b3d4fc;
		text-shadow: none;
	}


	hr {
		display: block;
		height: 1px;
		border: 0;
		border-top: 1px solid #ccc;
		padding: 0;
		margin: 0 auto;
	}

	audio,
	canvas,
	iframe,
	img,
	svg,
	video {
		vertical-align: middle;
	}

	fieldset {
		border: 0;
		margin: 0;
		padding: 0;
	}

	textarea {
		resize: vertical;
	}

	.browserupgrade {
		margin: 0.2em 0;
		background: #ccc;
		color: #000;
		padding: 0.2em 0;
	}

	a {
		text-decoration: none;
		color: #0d98d1;
	}

	a:hover {
		color:#e72d37;
	}













/* Containers ------------------------------------------------------------------ */


body {
	background-image: url( ../img/bg-main.jpg);
	background-attachment: fixed;
}


.col-1170-container {
	box-sizing: border-box;
	width:1170px;
	margin:auto;
}

.col-1170-content {
	box-sizing: border-box;
	width:1170px;
	margin:auto;
	padding-top: 0px;/*20px;*/
	padding-right: 54px;
	padding-bottom: 16px;
	padding-left: 54px;
}

.col-fullwidth-container {
	box-sizing: border-box;
	width:100%;
}

.col-fullwidth-content {
	box-sizing: border-box;
	width:1170px;
	margin:auto;
}


.col-responsive-480px-100p {
	width:480px;
}

.col-responsive-640px-100p {
	width:640px;
}




@media screen and (max-width:1300px) {
	.col-1170-container {
		width:100%;
	}
	.col-1170-content {
		width:90%;
	}
	
	.col-fullwidth-content {
		width:90%;
	}
}


@media screen and (max-width:789px) {
	
	.col-1170-content {
		box-sizing: border-box;
		width:100%;
		min-width: 300px;
		padding-top: 0px;/*20px;*/
		padding-right: 18px;
		padding-left: 18px;
		padding-bottom: 25px;
		
	}
	
	.col-fullwidth-content {
		box-sizing: border-box;
		width:100%;
		min-width: 300px;
	}
}





@media screen and (max-width:640px) {
	.col-responsive-640px-100p {
		width:100%;
	}
}





@media screen and (max-width:480px) {
	.col-responsive-480px-100p {
		width:100%!important;
	}
}


















/* Header ------------------------------------------------------------------------- */

	#Header {
		margin-top:38px;
	}

	#Header-simple {
		margin-top:48px;
		background-color: white;
		text-align: center;
	}

	.header-logo-s img{
		padding-top:28px;
		padding-bottom: 10px;
		margin-left: 40px;
		width:300px;
		height:auto;
	}

	.header-logo img {
		padding-top:60px;
		padding-bottom: 80px;
		margin-left: 68px;
	}

	

	.header-bars {
		width: 100%;
		margin:auto;
	}

	#Info-Cliente-Bottom {
		display:none;
	}





@media screen and (max-width:1300px) {
	
	#Header .col-fullwidth-content {
		width:90%;
	}
	
}
	
@media screen and (max-width:780px) {
	
	#Header {
		margin-top:25px;
	}

	#Header img, #Header-simple img {
		width:50%;
		max-width: 300px;
		min-width: 250px;
		height:auto;
		margin-left:0px;
		margin-right:0px;
	}
	
	.header-logo, .header-logo-s {
		width: 100%;
		text-align: center;
		padding-top:40px;
		padding-bottom:40px;
	}
	
	#Bar-bicolor-header-top {
		display: none;
	}
	
	.header-bars {
		display:none;
	}
	
	#Info-Cliente-Top {
		display:none;
	}
	
	#Info-Cliente-Bottom {
		display:block;
	}
	
	
}


@media screen and (max-width:480px) {
	
	#Header-simple {
		margin-top:0px;
	}
	
	
}
	
	








/* Menu ------------------------------------------------------------------------- */
	
	#Menu-main-container{
		/*transition: all 0.5s ease;*/
		z-index: 10;
		width:90%;
		max-width: 1170px;
		margin: 0 auto;
	}

	#Inner-menu-container {
		
	}

	
	.header-bg-red-bar {
		background-image:url(../img/red-box-small.png);
		background-repeat: repeat-x;
		background-position: bottom;
	}

	.header-bg-green-bar {
		background-image:url(../img/green-box-small.png);
		background-repeat: repeat-x;
		background-position: bottom;
	}


	.header-bg-green-bar-top {
		background-image:url(../img/green-box-small.png);
		background-repeat: repeat-x;
		background-position: top;
	}

	.header-bg-red-bar-top {
		background-image:url(../img/red-box-small.png);
		background-repeat: repeat-x;
		background-position: top;
	}



	#Menu-Main {
		transition: all 0.5s ease;
		width:800px;
		float: right;
		margin-right:-9px;
	}

	#Menu-Main-public{
		width:620px;
		float: right;
	}


	#Menu-compressed{
		padding:0px 10px ;
		line-height: 52px;
		text-align: center;
		text-decoration: none;
		color: white;
		width:100%;
		font-size: 24px;
		background-color: #0d98d1;
		display: none;
		transition: all 0.5s ease;
	}

	#Menu-button, #Menu-button-public {
		cursor: pointer;
	}

	#Menu-red-bar {
		background-color: #e72d37;
		height:8px;
		width:56px;
		position: absolute;
		margin-left:34px;
		
	}


	#Menu-Main-v2 {
		display: inline-block;
		float:right;
	}

	.menu-main-v2-button {
		background-color: #0d98d1;
		color:white;
		line-height: 48px;
		display:  inline-block;
		padding-left: 20px;
		padding-right: 20px;
		cursor: pointer;
		box-sizing: border-box;
		float: left;
	}

	.menu-main-v2-button:hover{
		color: red;
	}

	.menu-main-v2-button img {
		width:auto;
		height:46px;
		margin-left:-10px;
		display: none;
	}

	.menu-main-v2-button-disabled {
		color: dimgray;
		background-color: #0d98d1;
		line-height: 48px;
		display:  inline-block;
		padding-left: 20px;
		padding-right: 20px;
		cursor: pointer;
		box-sizing: border-box;
		float: left;
	}



	#productos-en-carro {
		background-color: #e72d37;
		color: white;
		line-height:20px;
		font-weight: 400;
		border-radius: 20px;
		padding: 4px 12px;
		margin-top:6px;
		
		display: inline-block;
	}





	#Menu-Main ul, #Menu-Main-public ul {
		padding: 0px;
		list-style-type: none;
		
	}


	#Menu-Main li, #Menu-Main-public li {
		float: left;
	}

	#Menu-Main a, #Menu-Main-public a {
		padding:0px 20px;
		line-height: 48px;
		text-align: center;
		text-decoration: none;
		color: white;
		float:left;
	}


	#Menu-Main-Carrito {
		padding-left: 20px!important;
		padding-right: 60px!important;
	}

	#Menu-Main-Carrito img {
		width:auto;
		height:46px;
	}

	



	#Menu-Main a:hover, #Menu-Main-public a:hover {
		color:#e72d37;
	}

	.forced-bg-green-bar {
		background-image:url(../img/green-box-small.png)!important;
		background-repeat: repeat-x;
		background-position: bottom;
	}


	.menu-main-fixed{
		position: fixed;
		top:0;
		left:0;
		width:100%!important;
		background-color: white;

		max-width: 100%!important;
		
		/*
		background-image:url(../img/red-box-small.png);
		background-repeat: repeat-x;
		background-position: bottom;
		*/
	}


	.busqueda-small-fixed{
		position: fixed;
		top:48px;
		width:100%!important;
		z-index: 8;
		/*background-color: transparent;*/
		
	}


	#Bar-bicolor-header-bottom {
		display: none;
	}

	#Productos-en-carro {
		background-color: #e72d37;
		color: white;
		font-weight: 400;
		border-radius: 20px;
		padding: 8px 16px;
		margin-top:-45px;
		margin-left:725px;
	}


	#Productos-en-carro-compressed {
		float:right;
		color: white;
		font-weight: 400;
		border-radius: 20px;
		padding: 0px 8px;
	
	}






@media screen and (max-width:780px) {
	
	#Menu-main-container{
		position: fixed;
		top:0;
		left:0;
		width:100%!important;
	}
	
	#Inner-menu-container {
		width: 100%;
	}
	
	#Menu-compressed {
		display: block;
	}
	
	#Menu-Main, #Menu-Main-public {
		position: absolute;
		top:-650px; /*-500*/
		left:0px;
		overflow: hidden;
		width:100%;
		float: none;
		background-color: white;
	}
	
	#Menu-Main-v2 {
		position: absolute;
		top:-650px; /*-500*/
		left:0px;
		overflow: hidden;
		width:100%;
		float: none;
		background-color: white;
	}
	
	.menu-main-v2-button {
		width: 100%;
		float: none;
		font-size: 20px;
		line-height: 55px;
		text-align: center;
		padding:0px 0px;
		margin-bottom:2px;
		
	}
	
	#Button-pedido {
		display: none;
	}
	
	#Menu-Main li, #Menu-Main-public li {
		width: 100%;
		float: none;
	}
	
	
	
	
	
	
	#Menu-Main a, #Menu-Main-public a {
		font-size: 24px;
		line-height: 80px;
		width: 100%;
		text-align: center;
		padding:0px 0px;
		margin-top:2px;
	}
	
	#Menu-red-bar {
		height:8px;
		width:80px;
		position: absolute;
		margin: 0 auto;
		
	}
	
	
	#Menu-Main img:hover, #Menu-Main-public img:hover {
		opacity:0.5;
	}

	#Menu-fulll-width {
		background-image:url(../img/red-box-small.png);
		background-repeat: repeat-x;
		background-position: bottom;
	}

	#Menu-standalone #Menu-Main, #Menu-standalone #Menu-Main-public {
		width:100%;
		float: right;
		background-image:url(../img/red-box-small.png);
		background-repeat: repeat-x;
		background-position: bottom;
	}
	
	.forced-bg-green-bar {
		background-image:url(../img/green-box-small.png)!important;
		background-repeat: repeat-x;
		background-position: bottom;
	}

	#Menu-standalone  #Menu-main-container{
		background-color: white;
		margin-top:0px;
		position: static;
		
	}
	
	#Bar-bicolor-header-bottom {
		display: block;
	}
	
	
	
	
	
}










/* Hero shot --------------------------------------------------------------------------*/

	.hero-shot-container {
		height: auto;
		overflow:hidden;
	}


	.slides {
		position: relative;
	}

	#transparent-image-for-sizing img {
		width:100%; 
	}

	.mySlides {
		width:100%;
		min-width: 789px;
		max-width: 1170px;
		top:0px;
		position: absolute;
		opacity: 1;
		margin-top: 0;
		transition: all 0.3s;
		-moz-transition: all 0.3s;
		-webkit-transition: all 0.3s;
		-o-transition: all 0.3s;		
	}



	.hero-shot-arrows {
		position:relative;
		/*z-index: 2;*/
		width:95%;
    	text-align:center;
		box-sizing: border-box;
		
	}

	.hero-shot-arrow {	
		width:32px;
		height:64px;
		cursor:pointer;
		margin-top:-25%;
		
	}

	.hero-shot-circles {
		position: absolute;
		margin-top: -5%;/*470*/
		left:50%;
		margin-left:-70px;
	}

	.hero-shot-circle {
		width: 20px;
		height: 20px;
		background-color: none;
		border:solid thin white;
		display: block;
		
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		border-radius: 10px;
		
		float:left;
		margin-right:10px;
		
		cursor: pointer;
	}







@media screen and (max-width:789px) {
	
	#transparent-image-for-sizing img {
		height:auto;
		width:100%;
	}
	
	.mySlides {
		width:100%;
		min-width: 350px;
		max-width: 789px;	
	}
	
	.hero-shot-arrow {	
		margin-top:-100px;
	}
	
	.hero-shot-circles {
		margin-top: -30px;

	}
}












/* Contacto  --------------------------------------------------------------------------*/

	.contacto-bar-blue {
		height:18px;

	}

	#Contacto img {
		padding-top:18px;
		padding-right: 30px;
	}

	.icon-mail {
		margin-top: -7px;
	}

	#Contacto a {
		text-decoration: none;
		color:white;
	}

	#Contacto a:hover {
		color:#0d98d1;
	}

	#Contacto-left {
		padding-left:36px;
	}














/* UI Elements --------------------------------------------------------------------------*/

	.button {
		border-radius: 20px;  
		height: 54px; 
		line-height: 24px;
		padding:15px 70px 15px 70px;
		display: table;
		Text-align:center;
		font-weight: 500;
		color: white;
		cursor: pointer;
		font-size: 20px;

	}

	.button:hover {
		opacity: 0.8;
		filter: alpha(opacity=80); /* For IE8 and earlier */
	}

	.button-small {
		border-radius: 25px;  
		height: 36px; 
		line-height: 36px;
		padding:0 30px 0 30px;
		display: table;
		Text-align:center;
		font-weight: 500;
		color: white;
		cursor: pointer;
		font-size: 16px;

	}


	.button-small-header {
		border-radius: 0px 25px 25px 0px;  
		height: 36px; 
		line-height: 36px;
		padding:0 30px 0 30px;
		display: table;
		Text-align:center;
		font-weight: 500;
		color: white;
		cursor: pointer;
		font-size: 16px;

	}

	.button-small:hover {
		opacity: 0.8;
		filter: alpha(opacity=80); /* For IE8 and earlier */
	}



	.button-submit {
		border-radius: 25px;  
		height: 54px; 
		line-height: 54px;
		padding:0 70px 0 70px;

		font-weight: 500;
		color: white;
		cursor: pointer;
		font-size: 20px;

	}

	.button-submit:hover {
		opacity: 0.8;
		filter: alpha(opacity=80); /* For IE8 and earlier */
	}


	.close-window-button {
		background-image:url(../img/icon-close-red.png); 
		background-size: contain; 
		width:35px; 
		height:35px; 
		margin-top:-15px;
		position: absolute; 
		cursor: pointer;
		
	}

	.bubble-small {
		margin: 16px 0px;
	}


	



@media screen and (max-width:640px) {
	.button {
		padding:5px 30px 5px 30px;
		line-height:40px;
	}
	
	.bubble-small {
		margin: 8px 0px;
	}
	
	.button-small {
		width:90%;
		padding:0 0 0 0;
	}

}












/* Spacers --------------------------------------------------------------------------*/

	.vertical-spacer-s {
		height:27px;
		width:27px;
		/*border: thin red dotted;*/
	}

	.vertical-spacer-m {
		height:54px;
		width:54px;
		/*border: thin red dotted;*/
	}

	.vertical-spacer-l {
		height:108px;
		width:108px;
		/*border: thin red dotted;*/
	}

	.margin-top-18 {
		margin-top: 18px;
	}

	.margin-bottom-18 {
			margin-bottom: 18px;
		}


	.underline-white {
		border-bottom:solid white 1px;
	}








/* form Elements --------------------------------------------------------------------------*/

	input[type=submit] {
		border:0 none;
	}


	
	::-webkit-scrollbar {
		width: 14px;
	}

	::-webkit-scrollbar-track {
		background-color:#E4E4E4;
		border-radius: 5px;
	}

	::-webkit-scrollbar-thumb {
		border-radius: 5px;
		background-color:#C0C0C0;
	}



	.select-blue {
		background-color: #d5ecf5;
	}

	.select-white {
		background-color: white;
	}

	.select-blue, .select-white {
		border-radius: 10px;
		width:250px;
		padding:10px;
		font-size: 20px;
		border: none;

		margin: 0;      
		-webkit-box-sizing: border-box;
		  -moz-box-sizing: border-box;
		  box-sizing: border-box;
		  -webkit-appearance: none;
		  -moz-appearance: none;
	}

	select::-ms-expand {
		display: none;
	}

	select.select-blue , select.select-white {
	  background-image:
		linear-gradient(45deg, transparent 50%, blue 50%),
		linear-gradient(135deg, blue 50%, transparent 50%),
		linear-gradient(to right, #0d98d1, #0d98d1);
	  background-position: 
		calc(100% - 25px) calc(1em + 2px),
		calc(100% - 15px) calc(1em + 2px),
		100% 0;
	  background-size:
		10px 10px,
		10px 10px,
		50px 56px;
	  background-repeat: no-repeat;
	}

	select.select-blue:focus , select.select-white:focus{
	  background-image:
		linear-gradient(45deg, white 50%, transparent 50%),
		linear-gradient(135deg, transparent 50%, white 50%),
		linear-gradient(to right, gray, gray);
	  background-position:
		calc(100% - 15px) calc(1em + 2px),
		calc(100% - 25px) calc(1em + 2px),
		100% 0;
	  background-size:
		10px 10px,
		10px 10px,
		50px 56px;
	  background-repeat: no-repeat;
	  border-color: grey;
	  outline: 0;
	}

	.shadow {
		-moz-box-shadow:    2px 2px 5px 0px #ccc;
		-webkit-box-shadow: 2px 2px 5px 0px #ccc;
		box-shadow:         2px 2px 5px 0px #ccc;
	}

	.shadow-black {
		-moz-box-shadow:    2px 2px 5px 0px #000;
		-webkit-box-shadow: 2px 2px 5px 0px #000;
		box-shadow:         2px 2px 5px 0px #000;
	}

	.hover-scale:hover {
		-ms-transform: scale(1.1,1.1); /* IE 9 */
		-webkit-transform: scale(1.1,1.1); /* Safari */
		transform: scale(1.1,1.1); 
		
		transition: all 0.1s;
		-moz-transition: all 0.1s;
		-webkit-transition: all 0.1s;
		-o-transition: all 0.1s;
	}


	.fieldset {

		border: solid thin #a1a1a1; width:90%; margin:0 auto;
	}










/*  columns -------------------------------------------------------------------- */

	.col-5 {
		width:5%;
	}

	.col-10 {
		width:10%;
	}

	.col-15 {
		width:15%;
	}

	.col-20 {
		width:20%;
	}

	.col-25 {
		width:25%;
	}

	.col-30 {
		width:30%;
	}

	.col-35 {
		width:35%;
	}

	.col-40 {
		width:40%;
	}

	.col-45 {
		width:45%;
	}

	.col-50 {
		width:50%;
	}

	.col-55 {
		width:55%;
	}

	.col-60 {
		width:60%;
	}

	.col-65 {
		width:65%;
	}

	.col-70 {
		width:70%;
	}

	.col-75 {
		width:75%;
	}

	.col-80 {
		width:80%;
	}

	.col-85 {
		width:85%;
	}

	.col-90 {
		width:90%;
	}

	.col-95 {
		width:95%;
	}

	.col-100 {
		width:100%;
	}








/*  Alignment -------------------------------------------------------------------- */

	.float-left {
		float:left;
	}

	.float-right {
		float:right;
	}

	.center-div {
		margin: auto;

	}

	.center-image {
		display: block;
		margin: auto;
	}


	.text-align-left {
		text-align: left;
	}

	.text-align-right {
		text-align: right;
	}

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


	.padding-16 {
		padding: 16px;
	}

	.padding-64 {
		padding: 64px;
	}

	.padding-left-18 {
		padding-left: 18px;
	}

	.margin-right-18 {
		margin-right: 14px;
	}
	.margin-left-18 {
		margin-right: 14px;
	}

	.float_center {
	  float: right;
	  position: relative;
	  left: -50%; /* or right 50% */
	  text-align: left;
	}

	.float_center > .child {
	  position: relative;
	  left: 50%;
	}















/* Transitions -------------------------------------------------------------- */
	.fade-3s {
		transition: all 0.3s;
		-moz-transition: all 0.3s;
		-webkit-transition: all 0.3s;
		-o-transition: all 0.3s;
	}

	.fade-5s {
		transition: all 0.5s;
		-moz-transition: all 0.5s;
		-webkit-transition: all 0.5s;
		-o-transition: all 0.5s;
	}







/* ==========================================================================
   Helper classes
   ========================================================================== */


	.hidden {
		visibility: hidden;
	}

	.visible {
		visibility: visible;
	}

	.display-none {
		display: none;
	}

	.display-block {
		display: block;
	}



	.clearfix:before,
	.clearfix:after {
		content: " ";
		display: table;
	}

	.clearfix:after {
		clear: both;
	}

	.clearfix {
		*zoom: 1;
	}

	.border-red {
		border: thin dashed red;
	}

	.border-blue {
		border: thin dashed blue;
	}

	.border-yellow {
		border: thin dashed yellow;
	}

	.border-cyan {
		border: thin dashed cyan;
	}

	.border-gray-light {
		border: thin solid #d7d7d7;
	}

	.border-black {
		border: thin solid black;
	}











/* Windows popup ------------------------------------------------------------------------------------ */

	.window-message {
		visibility: hidden;
		opacity: 0; 

		transition: all 0.3s;
		-moz-transition: all 0.3s;
		-webkit-transition: all 0.3s;
		-o-transition: all 0.3s;

		position: fixed;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		width:100%;
		height:100%;
		background: rgba(0, 0, 0, 0.7);
		z-index: 20;

	}

	.window-message-container {
		position: absolute;
		top: 50%;
		left:50%;
		transform: translate(-50%,-50%);
	}

	.window-message-title {
		box-sizing: border-box;
		color:white;
		background-color: #e72d37;
		width:100%;
		border-radius: 10px 10px 0 0;
		padding: 8px 10px 8px 20px;
		font-family: 'Roboto', sans-serif;
		font-weight: 100;
		font-size: 28px;
	}

	.window-message-content {
		box-sizing: border-box;
		color:black;
		background-color: white;
		width:100%;
		border-radius: 0 0 10px 10px;
		padding: 10px 10px 10px 10px;
		font-size: 16px;
	}


@media only screen and (max-width: 640px) {
	.window-message-container { 
		width:95%!important;
	}
	
	.window-message-content {
		padding: 5px;
		font-size: 18px;
	}
	
	.window-message-title {
		padding: 5px;
		padding-left:18px;
		font-size: 28px;
	}
}


@media only screen and (max-width: 768px) {
	
}









/*------------------------------------------------------------------------
Loader animation */

.loader {
	

	border: 16px solid #f3f3f3;
	border-radius: 50%;
	border-top: 16px solid #3498db;
	width: 100px;
	height: 100px;
	-webkit-animation: spin 2s linear infinite;
	animation: spin 2s linear infinite;
}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.loader-frame {
	
	visibility: hidden;
	opacity: 0;

	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	width:160px;
	height:160px;
	border-radius: 15px;
	padding:30px;
	background: rgba(0, 0, 0, 0.7);
	z-index: 30;

	transition: all 0.3s;
	-moz-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	-o-transition: all 0.3s;

	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);

}


















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

@media screen and (max-width:1000px) {
	
}

	@media only screen and (min-width: 480px) {
	}

	@media only screen and (min-width: 768px) {

	}

	@media only screen and (min-width: 1140px) {

	}