@import url('https://fonts.googleapis.com/css?family=Nunito');

body, html {
    height: 100%;
    font-family: "Nunito", sans-serif;
    font-size: 20px;
}
a,a:active,a:hover{text-decoration:none!important;}
ul {text-align: left; font-size: 20px}
p {font-size: 18px}
#catalogo p {font-size: 18px}
#navSidebar{font-size: 16px!important;}
#navbar{font-size: 20px!important;}
#navbar a:hover, #navbar div:hover{transition: all 0.40s linear 0s;}
.margin-top-texto{margin-top: 5%;}
.margin-top-texto-3{margin-top: 3%;}
.w3-wide{letter-spacing:2.5px!important}
.s1{width:8.33333%}.s2{width:16.66666%}.s3{width:24.99999%}.s4{width:33.33333%}
.s5{width:41.66666%}.s6{width:49.99999%}.s7{width:58.33333%}.s8{width:66.66666%}
.s9{width:74.99999%}.s10{width:83.33333%}.s11{width:91.66666%}.s12{width:99.99999%}
@media (min-width:768px){.m1{width:8.33333%!important}.m2{width:16.66666%!important}.m3,.w3-quarter{width:24.99999%!important}.m4,.w3-third{width:33.33333%!important}
.m5{width:41.66666%!important}.m6,.w3-half{width:49%!important}.m7{width:58.33333%!important}.m8,.w3-twothird{width:66.66666%!important}
.m9,.w3-threequarter{width:74.99999%!important}.m10{width:83.33333%!important}.m11{width:91.66666%!important}.m12{width:99.99999%!important}
.margin-top-texto{margin-top: 1%;}
.margin-top-texto-3{margin-top: 3%;}
}
@media (min-width:993px){.l1{width:8.33333%!important}.l2{width:15%!important}.l3{width:23%!important}.l4{width:32%!important}
	.l5{width:41%!important}.l6{width:49%!important}.l7{width:57%!important}.l8{width:65%!important}
	.l9{width:74%!important}.l10{width:83%!important}.l11{width:91%!important}.l12{width:99.99999%!important}
	.margin-top-texto{margin-top: 5%;}
	.margin-top-texto-2{margin-top: 3%;}
	
}
@media (min-width:1024px){
	.fondoesferas{
		background-image: url('../img/fondoesferasanizq.png'),url('../img/fondoesferasander.png') ;
		background-repeat: repeat-y, repeat-y;
		background-position: left top, right top;
		background-size: 15%, 15%;
		background-attachment: scroll, scroll;
	}

}
.w3-content{width: 90%;}
.border{border: 1px solid black;}
#servicios .w3-content{}
.titulo-arriendos{font-size: 18px}
.titulo-servicios{font-family: 'Tenor Sans', sans-serif;}
#cartones .w3-ul li{border-bottom:0px}
#catalogo .w3-content{max-width:75%;margin:auto}.w3-rest{overflow:hidden} 
#salon .w3-content{max-width:75%}
#catalogo .w3-col{overflow: auto; margin: 10px;display: inline-block; float: none; vertical-align: top;}
.cat-tabcontent{overflow: auto; vertical-align: top;}
#cat-todos .grid-item {width: 30%;margin-left: 10px;}
#arriendos p{font-size: 18px}
.slide-ini{height: 900px;}
@media (min-width:1380px){#cat-todos .grid-item {width: 23%;margin-left: 5px;}}
@media (min-width:1280px){.logoSize{height: 150px!important;}}
@media (max-width:1279px){.logoSize{height: 110px!important;}#cat-todos .grid-item {margin-left: 10px;}}
@media (max-width:1180px){#cat-todos .grid-item {margin-left: 5px;}}
@media (max-width:980px){h6{font-size:15px}.logoSize{height: 90px!important;} #catalogo .w3-content{max-width:100%!important} #salon .w3-content{max-width:90%}
#cat-todos .grid-item {margin-left: 10px;} }
@media (max-width:860px){#cat-todos .grid-item {margin-left: 7px;} .equipo-img{width: 80%!important} }
@media (max-width:768px){.grid-item {width: 40%;}#cat-todos .grid-item {width: 28%;margin-left: 7px;} }
@media (max-width:600px){.equipo-img{width: 50%!important}.equipo-padding{padding-left: 7%} .titulo-arriendos{font-size:18px!important}}
@media (max-width:480px){
	h6{font-size:14px}
	.logoSize{height: 70px!important;}
	.grid-item {width: 40%;}
	#cat-todos .grid-item {width: 43%;margin-left: 5px;}
	.equipo-img{width: 60%!important}
	.equipo-padding{padding-left: 0%} }
@media (max-width:400px){#cat-todos .grid-item {width: 85%;margin-left: 12px;}}
@media (max-width:385px){.w3-large{font-size: 14px!important;}.grid-item {width: 78%;}#cat-todos .grid-item {margin-left: 5px;}}  

.logoImg-7azul{
	width: 50%; 
}
.titulo{
	font-size: 100px;
	font-weight: 150;
	font-stretch: ultra-expanded;
	color: #fff;	
}
/* imagen fondo */
.bgimg-1 {
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
 
    background-image: url('../img/0_fondo-azul-capared.jpg');
}
.bgimg-cont {
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url('../img/bingoSup.jpg');
}
.bgimg-foo {
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url('../img/fndBol.jpg');
}
.fondofoo{
	background-attachment: inherit;
    background-position: bottom;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url('../img/fondofoob.jpg');
}
.textura{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	background-image: url(../img/grid.png);
}
.w3-wide {letter-spacing: 10px;}
.w3-hover-opacity {cursor: pointer;}

.servicios {
    display: none;
}
.grid{
	padding: 15px;	
	
}
.grid:after {
	content: '';
	display: block;
	clear: both;
}
.grid-item {
	width: 30%;
	margin-bottom: 10px; 
}
.item-large {width: 100%!important;min-width: 100px}

#servicios .grid-item:hover {-webkit-transform:scale(0.95);transform:scale(0.95); transition:all .5s ease-in-out;}
.grid-item{overflow:hidden;}

/* PANTALLA MEDIANA */

@media screen and (max-width:768px) {	
	#navbar{font-size: 18px!important}
	.logoImg-7azul{	width:60%;}
	.visible{visibility: hidden;}
}


@media screen and (max-resolution: 300dpi) {
	.visible{visibility: hidden;}
}
/* PANTALLA PEQUE�A */ 
@media screen and (max-width:480px) {
	h1{font-size: 28px!important}
	h2{font-size:24px!important}
	h3{font-size:20px!important}
	h4{font-size:18px!important}
	h5{font-size:16px!important}
	h6{font-size:14px!important}
	p{font-size:14!important}
	a{font-size:18px!important}
	.w3-contentbig{max-width:100%!important; padding:0px!important;}
	.w3-button{width:100%;text-align:center;padding:4px 6px}
	#navSidebar a{font-size: 16px!important;}
	#toggle{font-size: 22px!important;}
	#navSidebar #toggle{font-size: 22px!important;}
	.logoImg-7azul{
		width: 100%; 
	}
	.bgimg-titulos{ background-size: 110%;}
}
@media screen and (max-width:350px) {
	
	.w3-button{width:100%;text-align:center;padding:2px 4px; font-size: 13px;}
	.logoImg-7azul{
		width: 90%; 
	}
	.logoImg-bingo{
		width: 90%;
	}
}
#contact .w3-modal-content{background-color:rgba(60, 129, 144,0.95)}
.w3-contentbig{max-width:90%!important;margin:auto;padding: 70px;}
.w3-panel{margin-top:0px;margin-bottom:0px}
.w3-tag{background-color:#2296ff}
.w3-opacity-min{opacity:0.99}
.w3-padding-right-left-64{padding-right: 64px!important;padding-left: 64px!important;}
.w3-padding-left-small{padding-left: 10px;}
.w3-padding-bottom-34{padding-bottom: 34px;}
.w3-padding-bottom-84{padding-bottom: 84px}
.w3-padding-top-24{padding-top: 24px}
.w3-padding-top-64{padding-top: 64px}
.w3-verde{background-color: #28b788!important}
.w3-blue-sidenavbar {background-color: rgba(52, 82, 113, 1)}
.w3-blue-navbar {background-color: rgba(52, 82, 113, 0.55)}
.w3-green-hover-navbar:hover{background-color: rgba(45, 201, 151,0.8)}  /*#2dc997*/
.w3-dropdown-content-navbar{background-color: rgba(52, 82, 113, 0.55)!important}
.w3-blue-dark{color:#fff!important;background-color:#3f6184!important} 
/* .w3-blue-dark{color:#fff!important;background-color:rgba(22,76,130,1)!important} */
.w3-dark{color:#fff!important;background-color:rgba(0,0,0,0.75)!important}
.w3-blue-nav{background-color: #131642}
.w3-blue-nav-bright{background-color: #0E1558!important}
.w3-blue-light{background-color: #7095ba!important}
.w3-light-blue-border{border-color: #73d0da!important}
.w3-light-verde-border{border-color: #28b788!important}
.w3-marengo{background-color: #5f728c!important}
.w3-blue-pale{background-color: #5f8dc0;}
.w3-light-marengo{background-color: #e8e8e8!important}
.we-light-blue{background-color: #197ec6!important}
.w3-text-verde{color: #0f9e70!important}
.w3-text-blue-dark{color: #4801c0!important}
.w3-text-blue-indigo{color: #73d0da!important}
.w3-text-light-blue{color:#d8d9ea!important}
.w3-text-marengo{color: #2e3436!important;}
.w3-margin-small{margin:8px!important}
.w3-margin-topx{margin-top: 32px!important}
.w3-margin-topxx{margin-top:40px!important}
.w3-margin-bottomx{margin-bottom:32px!important}
.w3-margin-left-15{margin-left:15%;}
.w3-border-medium{border: 3px solid;}
.w3-border-big{border: 10px solid; }
.w3-card{box-shadow: 4px 6px 10px 0 rgba(0,0,0,0.5);}
.w3-card-2{box-shadow:0 2px 8px 0 rgba(0,0,0,0.5),0 2px 10px 0 rgba(0,0,0,0.45)}
.w3-card-3{box-shadow: 4px 4px 6px 0 rgba(4, 0, 45, 0.45);}
.img-shadow{box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.5), 0 6px 20px 0 rgba(0, 0, 0, 0.4);}
.w3-margin-huge{padding-bottom:24px!important; padding-right:16px!important}
.w3-visible-true{visibility: visible;}
.w3-visible-false{visibility: hidden;}
.w3-bloque{height: 400px; width: inherit;}
.w3-vertical-align-middle{vertical-align: middle; padding: 8px 16px;}
.w3-button:hover{
	transition: all 0.40s linear 0s;
  -o-transition: all 0.40s linear 0s;
  -ms-transition: all 0.40s linear 0s;
  -moz-transition: all 0.40s linear 0s;
  -webkit-transition: all 0.40s linear 0s;
}
.w3-btn:hover,.w3-btn-id{
	cursor: pointer;
	background: #2dc997;
  	color: #fff!important;
  	transition: all 0.4s ease-in-out;
}
.w3-hover-shadow:before {
	background-color: transparent;
}
.w3-hover-shadow:hover {
	-webkit-transform:scale(0.95);transform:scale(0.95); transition:all .5s ease-in-out;
}
.w3-hover-shadow div{
	background-color: #FAD201;
	color:#3f6184;
	font-size: 14px!important;
	font-weight: bold;
}
.w3-hover-shadow:hover div{
	color: #fff;
	transition: all 0.3s ease-in-out;
}

#servicios .w3-button,.w3-button:hover{color:#fff!important; font-weight:bold;  background-color: rgba(45, 201, 151,0.8)!important;-webkit-transition: all 0.00s linear 0s;}
#navSidebar .w3-button,.w3-button:hover{font-weight:normal;!important;}
.w3-sidebar{position:absolute!important; height: auto;}
.sticky {
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  width: 100%;
  z-index: 10;
}
.w3-bar{overflow: visible;}
.transition{
	background-color: rgba(52, 82, 113, 1);
	transition: background-color 1s linear;
    -o-transition: background-color 1s linear 0s;
  	-ms-transition: background-color 1s linear 0s;
  	-moz-transition: background-color 1s linear;
  	-webkit-transition: background-color 1s linear;
}
.transition2{
	background-color: rgba(52, 82, 113, 0.55);
	transition: background-color 1s linear;
    -o-transition: background-color 1s linear 0s;
  	-ms-transition: background-color 1s linear 0s;
  	-moz-transition: background-color 1s linear;
  	-webkit-transition: background-color 1s linear;
}
.cat-tabcontent{animation: fadeEffect 1s; }
.tabcontent {animation: fadeEffect 2s; }
#nosotros, #servicios, #catalogo, #salon, #despacho, #contacto, #header {animation: fadeEffect 1s;}
@keyframes fadeEffect {
    from {opacity: 0.5;}
    to {opacity: 1;}
}
.go-top {
	position: fixed;
	bottom: 2.8em;
	right: 2em;
	text-decoration: none;
	text-align:center;
	color: #fff;
	background-color: rgba(0,0,0, 0.7);
	font-size: 12px;
	padding: 1em;
	display: none;
	border-radius: 15px;
}

