/*
Theme Name: Video Float
Theme URI: http://jadm.com.ar
Author: JADM Asistencia Informática Integral
Author URI: http://jadm.com.ar
Description: Floating blocks of data (i.e. posts, images, ...) over custom video background
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: blog, blocks, accessibility-ready, custom-background, custom-colors, custom-header, custom-logo, custom-menu, editor-style, featured-images, microformats, post-formats, rtl-language-support, sticky-post, threaded-comments, translation-ready
Text Domain: videofloat

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/


/**
 * Table of Contents
 *
 * 1.0 - Reset
 * 2.0 - Genericons
 * 3.0 - Typography
 * 4.0 - Elements
 * 5.0 - Forms
 * 6.0 - Navigations
 *   6.1 - Links
 *   6.2 - Menus
 * 7.0 - Accessibility
 * 8.0 - Alignments
 * 9.0 - Clearings
 * 10.0 - Header
 * 11.0 - Widgets
 * 12.0 - Content
 *    12.1 - Posts and pages
 *    12.2 - Post Formats
 *    12.3 - Comments
 * 13.0 - Footer
 * 14.0 - Media
 *    14.1 - Captions
 *    14.2 - Galleries
 * 15.0 - Multisite
 * 16.0 - Media Queries
 *    16.1 - Mobile Large
 *    16.2 - Tablet Small
 *    16.3 - Tablet Large
 *    16.4 - Desktop Small
 *    16.5 - Desktop Medium
 *    16.6 - Desktop Large
 *    16.7 - Desktop X-Large
 * 17.0 - Print
 */




/* RESET*/
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/* FIN DEL RESET */

/* BODY GENERICO */
body{
	height:100%;width:100%;
	margin:0 auto;
	background: url("img/BAiresWeb.jpg") no-repeat center center fixed; 
  	-webkit-background-size: cover;
  	-moz-background-size: cover;
  	-o-background-size: cover;
  	background-size: cover;
}

#videocontainer{
	margin:0 auto;
	padding:0;
	position:fixed;
	z-index:-1;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
	text-align:center;
}

#videofondo{
	margin:0 auto;
	padding:0;
	height:100%;
	overflow:hidden;
}

.canvas{
	margin:0 auto;
	padding:0;
	height:100%;
	overflow:hidden;
}

#audio{
	display:none;
}

#audiocontrol{
	position:fixed;
	top:20px;
	right:20px;
	z-index:1002;
}

#menu {
	background: rgba(8, 27, 101, 0.8);
	width:100%;
	position:fixed;
	top: 0%;
	padding: 20px;
	left: 0%;
	z-index:1001;
	font-family: 'Comfortaa', cursive;
	font-weight:2em;
	font-size:2em;
	color:#FFF;
	text-align:center;
}

#menualter {
	width:100%;
	background: rgba(8, 27, 101, 0.4);
	position:fixed;
	top: -177px;
	padding: 20px;
	left: 0px;
	z-index:1001;
	font-family: 'Comfortaa', cursive;
	font-weight:400 !important;
	font-size:24px !important;
	color:#FFF;
	text-align:center;
	transition:all 1s;
	display:none;
}

#menualter img{
	width:30px;
	height:20px;
	padding-top:10px;
}

#menu ul, #menualter ul {
	list-style:none;
}

#menu ul a, #menualter ul a{
	text-decoration:none;
	color:#FFF;
}

#menu li {
	float:left;
}

#menualter li{
	padding:3px;
	border-bottom:1px solid #fff;
}

#menu li a, #menualter li a {
	padding: 10px;
}

#menu ul a:hover, #menualter ul a:hover {
	padding: 10px;
	text-shadow: 0 0 6px #FFFFFF; /* horizontal-offset vertical-offset 'blur' colour */
	-moz-text-shadow: 0 0 6px #FFFFFF;
	-webkit-text-shadow: 0 0 6px #FFFFFF;
}

#titulo {
	position:relative;
	margin-top:10%;
	z-index:1000;
	text-align:center;
}

#titulo img{
	height:85%;
	width:85%;
}

/* BLOQUES ---------------------------------- */

#bloques {
	margin-top:2%;
	margin-left:0 auto;
	margin-right:0 auto;
	position:relative;
	width:95%;
	padding: 20px;
	left: 0%;
	z-index:1000;
	text-align:center;
}

#bloquesucontador{
	display:inline-block;
	border: 2px solid #87c5f3;
   	background: rgba(8, 27, 101, 0.75);
    	border-radius: 25px;
	font-family: 'Comfortaa', cursive;
	font-weight:700;
	font-size:2em;
	color:#FFF;
	text-align:center;
	padding-top:1%;
	padding-bottom:1%;
	padding-left:25%;
	padding-right:25%;
	margin:1%;
	transition: all 0.75s;
	-webkit-transition: all 0.75s;
}

#bloquesucontador img{
	width: 100%;
}

#bloquesucontador a{
	text-decoration:none;
	color:#FFF;
}

#bloquecontable img, #bloqueauditoria img, #bloqueremuneraciones img, #bloqueimpuestos img, #bloqueconsultoria img {
	width: 100%;
}

#bloquecontable a, #bloqueauditoria a, #bloqueremuneraciones a, #bloqueimpuestos a, #bloqueconsultoria a{
	text-decoration:none;
	color:#FFF;
}


#bloquecontable , #bloqueauditoria , #bloqueremuneraciones , #bloqueimpuestos , #bloqueconsultoria {
	width:150px;
	height:167px;
	display:inline-block;
	border: 2px solid #87c5f3;
    	background: rgba(8, 27, 101, 0.75);
    	border-radius: 25px;
	font-family: 'Comfortaa', cursive;
	font-weight:700;
	font-size:1em;
	color:#FFF;
	text-align:center;
	padding-top:2%;
	padding-bottom:2%;
	padding-left:2%;
	padding-right:2%;
	margin:1%;
	transition: all 0.75s;
	-webkit-transition: all 0.75s;
}


/* FIN BLOQUES -------------------------------------- */

/* FRANJABLANCA -------------------------------------- */

#franjablanca {
	margin: 0 auto;
	position:relative;
	width:95%;
	padding: 20px;
	padding-top: 5%;
	padding-bottom: 5%;
	left: 0%;
	text-align:center;
	background-color:#FFFFFF;
	font-family: 'Comfortaa', cursive;
	font-weight:1em;
	font-size:1.5em;
	color:#09F;
}

/* FIN FRANJABLANCA -------------------------------- */
	

/* POSTEOS ------------------------------------------ */

#bloqueposteos {
	margin: 0 auto;
	position:relative;
	width:100%;
	padding: 20px;
	left: 0%;
	text-align:center;
	background-color:#299def;
	font-family: 'Comfortaa', cursive;
	font-weight:1em;
	font-size:1em;
	color:#fff;
}

#posteo {
	position:relative;
	display: inline-block;
	margin:0.5%;
	padding: 1.5%;
	border-left: 1px solid #0d418c;
	/*border-right: 1px solid #0d418c;*/
	text-align:left;
	width: 300px;
	height:410px;
	overflow:hidden;
	transition: all 0.75s;
	-webkit-transition: all 0.75s;
	color:#fff;
}

#posteo:hover {
	background-color:#009;
	color:#fff !important;
}

#posteo a {
	text-decoration: none;
	color: #ffffff;
}

#posteo #titu {
	font-size:2em;
	padding-bottom:1%;
}

#posteo #conte {
	padding-top:2%;
	line-height:1.3em;
	color:#fff;
}

#posteo #conte img {
	padding:1%;
}

/* ************** SINGLE ************** */

/* ******* ESTILOS AGREGADOS A EDITOR VISUAL DE WP */
#principal #conte .jadm-franjaverde {
	width:97% !important;
	background: -webkit-linear-gradient(darkblue, cyan);
	background: -moz-linear-gradient(darkblue, cyan);
	background: -o-linear-gradient(darkblue, cyan);
	background: linear-gradient(darkblue, cyan);
	color: #fff !important;
	font-family: 'Comfortaa', cursive !important;
	font-size: 1.5em;
	font-weight:bolder;
	line-height:2em;
	text-align:center !important;
	padding: 3% !important;
	-moz-border-radius:12px;
	-webkit-border-radius:12px;
	border-radius:12px;
	margin-top:2% !important;
	margin-bottom:2% !important;
}
#principal #conte .jadm-franjaverde img {
	padding-bottom: 2% !important;
	padding-top: 2% !important;
}

#principal #conte .titular-gris {
	color:#333;
	font-size: 1.75em;
	clear:both;
	line-height:1.75em;
}

/* ********** FIN ESTILOS AGREGADOS A EDITOR */

#cabecera-single {
	position:relative;
	padding-top:10%;
	padding-bottom:7%;
	text-align:center;
	background: -webkit-linear-gradient(blue, cyan);
	background: -moz-linear-gradient(blue, cyan);
	background: -o-linear-gradient(blue, cyan);
	background: linear-gradient(blue, cyan);
}

#cabecera-single img{
	height:85%;
	width:85%;
}

#container{
	margin:0 auto;
	/*margin-top:5% !important;*/
	height:100%;width:100%;
	background-color:#fff;
	border-top-style:solid;
	border-top: 1px solid #0d418c;
}

#principal{
	width:73%;
	padding: 2%;
	background-color:#ffffff;
	font-family: 'Comfortaa', cursive;
	font-weight:1em;
	font-size:1em;
	color:#299def;
	float:left;
}

#principal #titu {
	font-size: 2em;
	color:#299def;
	padding:1%;
}

#principal #conte {
	font-size:1em;
	color:#333;
	line-height:1.4em;
	padding:1%;
}

#principal #conte h1, h2, h3, h4 {
	background-color:#299def !important;
	clear:both;
	margin-top:3%;
	margin-bottom:1%;
	padding-top: 2%;
	padding-bottom:1.5%;
	padding-left: 1%;
	-moz-border-radius:12px;
	-webkit-border-radius:12px;
	border-radius:12px;
}

#principal #conte h1 {
	font-size:2em;
}
#principal #conte h2 {
	font-size:1.75em;
}
#principal #conte h3 {
	font-size:1.5em;
}
#principal #conte h4 {
	font-size:1.25em;
}

#principal #conte p {
	clear:both;
	padding-bottom: 3%;
}

#principal #conte a {
	text-decoration:none;
	color:#00F;
	font-weight:bold;
}

#derecha{
	float:left;
	width:18%;
	margin: 0 auto;
	margin-top:2% !important;
}

#posteoder {
	float:left;
	margin-left:0.5%;
	margin-right:0.5%;
	margin-bottom:10%;
	padding: 5% !important;
	background-color:#f5f5f5;
	border-left: 1px solid #0d418c;
	text-align:left;
	width: 300px;
	height:410px;
	overflow:hidden;
	transition: all 0.75s;
	-webkit-transition: all 0.75s;
	font-family: 'Comfortaa', cursive;
	color:#333;
	-moz-border-radius:12px;
	-webkit-border-radius:12px;
	border-radius:12px;
}

#posteoder:hover {
	background: -webkit-linear-gradient(darkblue, cyan);
	background: -moz-linear-gradient(darkblue, cyan);
	background: -o-linear-gradient(darkblue, cyan);
	background: linear-gradient(darkblue, cyan);
	color:#fff;
}

#posteoder a {
	text-decoration: none;
	color: #333;
}
#posteoder:hover a{
	color:#fff;
}

#posteoder #titu {
	font-size:2em;
	padding-bottom:1%;
}

#posteoder #conte {
	padding-top:2%;
	line-height:1.3em;
}

#posteoder #conte img {
	padding:1%;
}

/* ************** FIN SINGLE */

/* ************ BARRA DE NAVEGACION DE POSTS */


#jadm-navigation {
	clear:both;
	margin-top:3%;
	margin-bottom:1%;
	padding-top: 2%;
	padding-bottom:1.5%;
	padding-left: 1%;
	-moz-border-radius:12px;
	-webkit-border-radius:12px;
	border-radius:12px;
	background-color:#f5f5f5;
	border-top: 1px solid #0d418c;
	border-bottom: 1px solid #0d418c;
	border-left: 1px solid #0d418c;
	border-right: 1px solid #0d418c;
	font-size: 2em !important;
	color: #ccc !important;
	font-weight:900 !important;
}

#jadm-navigation #jadm-navigation-prev {
	margin-top: 2%;
	font-size: 0.8em !important;
	clear: both;
	text-align:left;
	padding: 0,5%;
}
#jadm-navigation #jadm-navigation-next {
	font-size: 0.8em !important;
	clear: both;
	text-align:right;
	padding: 0.5%;
}

#jadm-navigation #jadm-navigation-prev a {
	text-decoration:none;
	color: #999 !important;
}
#jadm-navigation #jadm-navigation-next a {
	text-decoration:none;
	color: #999 !important;
}

#jadm-navigation #jadm-navigation-prev a:hover {
	color:#299def !important;
}
#jadm-navigation #jadm-navigation-next a:hover {
	color:#299def !important;
}

/* ********* FIN BARRA DE NAVEGACION  */

/* ************ NOTICIAS */
#noticiasbloqueposteos {
	margin: 0 auto;
	position:relative;
	width:100%;
	padding: 20px;
	left: 0%;
	text-align:center;
	background-color:#299def;
	font-family: 'Comfortaa', cursive;
	font-weight:1em;
	font-size:1em;
	color:#fff;
}

/* ********* FIN NOTICIAS */

@media (max-width:1435px) {
	
		#derecha{
			float:none;
			width:100%;
		}
		
		#principal{
			width:95%;
		}
		
}

@media (max-width:800px), (orientation:portrait) {
	
	#menu{
		display:none;
	}
	
	#menualter{
		display:block;
	}
	
	#titulo{
		position:relative;
		margin-top:20%;
	}
	
}

@media (max-width:500), (max-height:400px) {
	
	#menu{
		font-size:1.5em;
	}
	
}

@media (max-height:768px), (max-width:1000px) {
	
	#bloques{
		margin-top:1%;
	}

}

@media all and (orientation:portrait){
	
	#bloquecontable, #bloqueauditoria, #bloqueremuneraciones, #bloqueimpuestos, #bloqueconsultoria {
		width:150px;
		height:250px;
		margin:5%;
	}
	
}