@import url('../font-awesome/css/font-awesome.css');
@import url('https://fonts.googleapis.com/css?family=Offside|Ubuntu+Mono:400,700');
@font-face {
  font-family: 'spin_cycleregular';
  src: url('../fonts/spinc___.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/spinc___.woff') format('woff'), /* Pretty Modern Browsers */
       url('../fonts/spinc___.ttf')  format('truetype'); /* Safari, Android, iOS */
	font-weight: normal; font-style: normal;}

html, body {width:100%; height:100%;}
body {color:#888; background:#000; font-size:16px; line-height:24px; font-family: 'Ubuntu Mono', monospace; font-family: 'Offside', cursive;}
a:link {text-decoration:none;}
a, a:active, a:focus  {outline:none; color:#4c7ac4} 
a:hover	{color:#6f87c3}
h1 {font-size:35px; font-family:'spin_cycleregular', cursive; letter-spacing:px; color:#CCC; text-shadow:1px 1px 2px rgba(0, 0, 0, 0.4); margin:0 0 50px 0!important;}
h2 {font-size:20px; color:#CCC; margin-bottom:5px;}
.container h1 hr {display:block; height:1px; border:0; border-top:15px solid #333; margin:0; padding:0;}
.round {border-radius:50%;
-webkit-box-shadow:11px 11px 20px 0px rgba(50, 50, 50, 0.75);
-moz-box-shadow:   11px 11px 20px 0px rgba(50, 50, 50, 0.75);
box-shadow:        11px 11px 20px 0px rgba(50, 50, 50, 0.75);}
.transp		{opacity:0.5}
.wow { visibility: hidden; }
.no-gutter > [class*='col-'] {padding-right:1px; padding-left:1px;}



/* GENERAL STYLES =========================*/
*, *:before, *:after {-moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; border:none;}
a:link, a:visited, a:active {text-decoration:none;}

/* SECTION STYLES =========================*/
#home	{position:relative; height:200%; text-align:center; overflow:hidden;}
#quienes, #servicios, #cursos, #clientes, #contacto {padding:60px 0; margin-bottom:0%; background:#000; background:rgba(0, 0, 0, .0);
 min-height:100%; overflow:hidden;}
section .container {text-align:justify;}
.text	{background:#000; background:rgba(0, 0, 0, .75);}
  
/* HOME =========================*/  
#home-logo		{position:absolute; z-index:1; width:100%; height:auto; left:0; top:10%; margin:0 auto; text-align:center}
#home-logo img	{width:40%!important; max-width:180px; height:auto; opacity:0.5;}
#home-logo img:hover	{opacity:1;}
  
/* QUIENES =========================*/
#quienes p	{line-height:1.5;}
.avidlogos	{background:#000; background:rgba(0, 0, 0, 0.5); padding:20px}


/* CLIENTES =========================*/
.cliente img	{background:#333; background:rgba(51, 51, 51, 1); width:100%; padding:0 0%; border-radius:5px; filter:grayscale(100%); margin-bottom:1px; opacity:0.75; }
.cliente img:hover	{background:#000; background:rgba(0, 0, 0, 1); opacity:1; -webkit-animation: bounce 1s; animation: bounce 1s;}
#sld-nosotros	{width:100%; height:100%; padding-bottom:62.5%; border-radius:9px; opacity:0.75; margin-bottom:15px;}

/* SERVICIOS =========================*/
#sld-servicios	{width:100%; height:100%; padding-bottom:62.5%; border-radius:9px; opacity:0.75; margin-bottom:15px;}
#servicios li	{line-height:1.3;}
.martop-0	{margin-top:0;}
/* FOOTER =========================*/
#myCanvasContainer	{text-align:center;}
#myCanvas {width:100%; height:auto; background:#}





/* BACKGROUND =========================*/
#bg2 {opacity:0.15; position:fixed; top:50%; left:50%; min-width:100%; min-height:100%; width:auto; height:auto; z-index:-99;
    -webkit-transform:translateX(-50%) translateY(-50%);
    transform:translateX(-50%) translateY(-50%);
    background:url(../img/bg.jpg) no-repeat; background-size:cover;}
/* VIDEO =========================*/
#background	{position: fixed; top: 50%; left: 50%; min-width: 100%; min-height: 100%; width: auto; height: auto; z-index: -100;
			-webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%);}
			
/* RESPONSIVE ===========================================================================*/
		
@media (min-width:768px) {
/* SIDE-NAV =========================*/
.side-nav {position:fixed; top:30%; right:14px; z-index:10;}
.side-nav ul.nav-side-nav {text-align:center; list-style:none; margin:0; padding-left:0;}
.side-nav ul.nav-side-nav > li {display:block; line-height:1.42857; margin:0 0 20px 0; padding:8px 0;}
.side-nav ul.nav-side-nav > li > a {display:block; width:16px; height:16px; border-radius:50%; background:#5975B9; border:0px solid #999;}
.side-nav ul.nav-side-nav > li > a:hover, .side-nav ul.nav-side-nav > li > a:focus {background:#FF0000; text-decoration:none; -webkit-animation: fadeIn 1s infinite; animation: fadeIn 1s infinite;}
.avidlogos img	{width:75%; margin:0 auto;}
}

@media (max-width:767px) {
	body		{padding-top:px!important;}
	.navbar-default	{background:transparent!important; border:none;}
	#navbar	{background:#222;}
	#navbar .nav li a, .nav li.active a	{color:#999!important; background:transparent!important; border-bottom:1px dashed #444;
	 font-family:'spin_cycleregular', cursive;}
	#myCanvas {width:200%!important; height:200%!important; margin-left:-50%;}
}

 /* TOOLTIP =========================*/
.tooltip	{position:absolute; z-index:10; display:block; visibility:visible; font-size:12px; line-height:1.4;
			opacity:0; filter:alpha(opacity=0);}
.tooltip.in {opacity:0.9; filter:alpha(opacity=90);}
.tooltip.left {margin-left:-3px; padding:0 5px;}
.tooltip-inner {max-width:200px; padding:3px 8px; color:white; text-align:center; text-decoration:none; background:#555; border-radius:4px;}
.tooltip-arrow {position:absolute; width:0; height:0; border-color:transparent; border-style:solid;}
.tooltip.left .tooltip-arrow {top:50%; right:0; margin-top:-5px; border-width:5px 0 5px 5px; border-left-color:#555;}


/* ============================= Contact us START ===================================== */

#contact_form	{width: 100%; float:left; padding-top:4px; overflow:hidden; background:#;	}
#contact_form .clearfix	{width:100%; margin-bottom:9px;	position:relative}
#contact_form input[type="text"], #contact_form textarea		{float:left; margin:0; border:none;	padding:10px 18px; color:#ccc; background:#333;	-webkit-border-radius:9px;	-moz-border-radius:9px;	border-radius:9px; position:relative; width:100%; outline:none; font-size:14px;}
#contact_form input[type="text"]:hover, #contact_form textarea:hover		{background:#CCC; color:#333;}
#contact_form textarea		{height:88px;	overflow:auto;	resize:none;}
#contact_form .buttons	{margin-right:22px;	float:left;}
#contact_form input[type="submit"], input[type="reset"] 				{width:90px; margin:3px; border:none; background:#5975B9; color:#FFF;}
#contact_form input[type="submit"]:hover, input[type="reset"]:hover		{background:#CCC; color:#333;}

.button, input[type="submit"], input[type="text"], textarea {
	font-size:16px;
	color:#FFF;
	padding:5px 20px 5px 20px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 2px;
	border-radius: 15px;
	background-color:#5975B9;
	-moz-transition:all 0.3s linear;
	-webkit-transition:all 0.3s linear;
	-o-transition:all 0.3s linear;
	-ms-transition:all 0.3s linear;
	transition:all 0.3s linear;
	cursor:pointer;
}
.button:hover, input[type="submit"]:hover, input[type="text"]:hover, textarea:hover {
	background-color:#ccc;
	-moz-transition:all 0.3s linear;
	-webkit-transition:all 0.3s linear;
	-o-transition:all 0.3s linear;
	-ms-transition:all 0.3s linear;
	transition:all 0.3s linear;
	color:#000000;
}

.msg	{font-size: 11px;	font-weight: normal; color:#ee6b26;	margin-left: 10px;}

#social			{text-align:right; padding-top:100px}
#social	a:first-child i		{color:#4267B2}
#social	a:nth-child(2) i	{color:#128C7E}

/* ============================== Contact us END ====================================== */



