/* Getting the new tags to behave */
article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video {
	display: block;
}
mark, rp, rt, ruby, summary, time {display:inline;}

/* Global properties ======================================================== */
html {width:100%;}
body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 100%;
	color: #06C;
	min-width: 90px;
	background: #CCC	/*color de la parte de abajo*/
}
.ic {
	border: 0;
	float: right;
	background: #666;
	color: #666;
	width: 50%;
	line-height: 10px;
	font-size: 10px;
	margin: -220% 0 0 0;
	overflow: hidden;
	padding: 0
}
.bg {width:100%; background:url(../images/bg-top.jpg) center 0 no-repeat;}

.main {
	width: 960px;
	padding: 0;
	margin: 0 auto;
	font-size: 13px;
	line-height: 25px;
	color: #FFF;/*jndcontadore.com*/
}
.container {
	width:940px; 	
	padding:0;
	margin:0 auto;
}
.containerServi {
	width:940px; 	
        height:420px;
	padding:0;
	margin:0 auto;
}
a {
	color: #000033;
	outline: none;
}
a:hover {
	text-decoration: none;
	font-family: Arial, Helvetica, sans-serif;/*Verdana, Geneva, sans-serif*/
	color: #006;
}

.col-1, .col-2,
.column-1, .column-2, .column-3 {
	float: left;
	width: 400px;
}

.wrapper {
	width: 100%;
	overflow: hidden;
	color: #999;
}
.extra-wrap {overflow:hidden;}
.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}
 
p {
	margin-bottom: 10px;
	font-weight: normal;
}
.p1 {
	margin-bottom: 8px;
	color: #333333;
}
.p2 {margin-bottom:15px;}
.p3 {margin-bottom:30px;}
.p4 {margin-bottom:40px;}
.p5 {margin-bottom:50px;}

.reg {text-transform:uppercase;}

.fleft {float:left;}
.fright {float:right;}

.alignright {text-align:right;}
.aligncenter {
	text-align: center;
	color: #333;
}

.it {font-style:italic;}

.color-1 {color:#fff;}
.color-2 {color:#999;}
.color-3 {color:#fff;}

.img-border {border:10px solid #fff;}

/*********************************boxes**********************************/
.indent {padding:20px;}
.indent-left {padding-left:10px;}
.indent-right {padding-right:50px;}

.indent-bot {
	margin-bottom: 10px;
}
.indent-bot2 {margin-bottom:30px;}
.indent-bot3 {margin-bottom:45px;}

.prev-indent-bot {margin-bottom:10px;}
.img-indent-bot {margin-bottom:25px;}
.margin-bot {margin-bottom:35px;}

.img-indent {float:left; margin:0 30px 0px 0;}	
.img-indent2 {float:left; margin:0 13px 0px 0;}	
.img-indent-r {float:right; margin:0 0px 0px 40px;}	

.buttons a:hover {cursor:pointer;}

.menu li a,
.list-1 li a,
.link,
.button-1,
.button-2,
h1 a {text-decoration:none;}	

/*********************************header principal*************************************/
header {
	width: 100%;
	background:#f2f2f2;
	position: relative;
	z-index: 2;
}

.row-top {
	width: 100%;
	padding: 10px 0;
	background: #CCC;/*Azul Marino parte de arriba*/
}

h1 {
	padding:0px 0 0 10px; 
	float:left;
}
	h1 a {
	display: inline-block;
	font-size: 40px;
	font-weight: normal;
	line-height: 1.4em;
	color: #006;
	letter-spacing: -3px;
	margin-top: -10px;
	font-family: Arial, Helvetica, sans-serif;/*Verdana, Geneva, sans-serif03082016*/
	}
		h1 a span {
	color: #666 /*color Letras lado superior*/
}
		
h2 {
	font-size: 30px;
	font-weight: normal;
	line-height: 108px;
	color: #666;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
}
	h2 span {
	color: #004;
}
	#page1 h2 {margin-bottom:9px;}
	
/***** menu *****/
.menu {
	padding:26px 10px 0 0; 
	float:right;
}
.menu li {
	float:left;
	padding-left:40px;
}
.menu li a { 
	font-size:14px; 
	line-height:18px; 
	padding:0; 
	color:#fff; 
}
.menu li a.active,
.menu > li > a:hover {
	color: #004;
}

.row-bot {
	width:100%;
	background:url(../images/row-bot-tail.gif) center top repeat-x;
}
.row-bot-bg {
	width:100%;
	min-height:20px;
	border:hidden;
	text-align:center;
	color: #006;
    font-family: Verdana, Geneva, sans-serif;
	font-size:20px;
	line-height:18px; 
	background:#f2f2f2;

}

/***** slider *****/
.slider-wrapper {
	width:940px;
	height:466px;
	padding:10px;
	background:#fff;
	overflow:hidden;
}
.slider {
	width: 940px;
	height: 466px;
}
.items {display:none;}

.pagination {
	position:absolute;
	left:427px;
	bottom:19px;
	z-index:99;
}
	.pagination li {
		float:left;
		padding-right:4px;
	}
	.pagination a {
		display:block;
		width:26px;
		height:26px;
		background:url(../images/slider-pagination.png) right top no-repeat;
		cursor:pointer;
	}
	.pagination li.current a {cursor:default;}
	.pagination li.current a,
	.pagination a:hover {background-position:left top;}

/*********************************content*************************************/
#content {
	width:100%; 
	padding:15px 0 50px;
	background:#f2f2f2;
	position:relative;
	z-index:1;
}

.spacer-1 {
	width:100%; 
	background:url(../images/pic-1.gif) 217px 0 repeat-y;
}

h3 {
	font-size: 16px;
	line-height: 2em;
	color: #000066;
	background: #f2f2f2;
	letter-spacing: -1px;
	margin-bottom: 5px;
	text-align: center;
	font-weight: normal;
}
h5 {margin-bottom:2px;}
h6 {color:#f2f2f2;}

.border-bot {
	width:100%; 
	padding-bottom:20px; 
	background:url(../images/pic-1.gif) 0 bottom repeat-x;
}

.box {
	width:100%; 
	background:url(../images/box-tail.gif) 0 0 repeat-x;
}

.button-1 {
	display:inline-block; 
	padding:12px 19px;
	font-size:13px;
	line-height:1.23em;
	color:#fff; 
	background:url(../images/button1-tail.gif) 0 0 repeat-x #c42e02;
	cursor:pointer;
}
.button-1:hover {background:#c42e02;}

.button-2 {
	display:inline-block; 
	padding:12px 19px;
	font-size:13px;
	line-height:1.23em;
	color:#fff; 
	background:url(../images/button2-tail.gif) 0 0 repeat-x #779f02;
	cursor:pointer;
}
.button-2:hover {background:#779f02;}

.list-1 li {
	line-height: 18px;
	padding: 6px 0 6px 20px;
	background: url(../images/marker-1.png) 0 12px no-repeat;
	color: #7f7f7f;
}
	.list-1 a {
		display:inline-block;
		color:#7f7f7f;
	}
	.list-1 a:hover {
	color: #000033;
	text-decoration: underline;
}
	.list-1 span {display:block; line-height:25px; padding:8px 0 17px;}
	.list-1 strong {display:block;}
	
.list-2 {width:270px;}
.list-2 dt {font-weight:bold; margin-bottom:5px;}
.list-2 dt,
.list-2 dd {width:100%; overflow:hidden;}
.list-2 em {font-style:normal; float:left;}
.list-2 span {float:right; text-align:right; width:auto; font-weight:normal;}
.list-2 dt span {font-weight:bold;}

.price-list li {
	overflow: hidden; 
	vertical-align: top;
	line-height: 18px;
	padding:6px 0 6px 20px;
	background:url(../images/marker-2.png) 0 12px no-repeat;
}
	.price-list strong {
		display: block; 
		overflow: hidden;
	}
	.price-list span {
		float: right;
		color: #7f7f7f;
	}
	.price-list a {
		float: left;
		text-decoration: none;
		color: #7f7f7f;
	}
	.price-list a:hover {color:#00066; text-decoration:underline;}/*color anterir #81a60b*/

.link:hover {text-decoration:underline;} 

.link-1 {
	display:inline-block; 
	font-size:14px; 
	padding-right:8px; 
	background:url(../images/marker-3.gif) right 8px no-repeat;
}
.link-1:hover {color:#fff;} 

.text-1 {font-size:14px;} 

dl span {float:left; width:96px; font-weight:bold;}

/***** bx-slider *****/
.bx-wrapper {overflow:hidden; position:relative;}
	#page2 .bx-wrapper {width:450px; height:545px;}
	#page3 .bx-wrapper {width:940px; height:752px;}
.bx-window {height:510px; overflow:hidden; width:100%; position:relative;}
	#page3 .bx-window {height:710px;}
#slider {
	width:100%;
	height:510px;
	overflow:hidden;
}
#slider > div {
	overflow:hidden;
	width:160px;
	height:510px;
}
#slider-2 > div {
	overflow: hidden;
	width: 300px;
	height: 710px;
}
#slider figure {margin-bottom:8px;}
#slider-2 figure {margin-bottom:17px;}
#slider-2 h5 {margin-bottom:5px}
.bx-next {
	display: inline-block;
	font-size: 19px;
	line-height: 1.2em;
	color: #0066FF;
	text-transform: capitalize;
	text-decoration: none;
	position: absolute;
	z-index: 99;
	left: 63px;
	bottom: 4px;
}
.bx-prev {display:none;}

.bx-pager {padding:16px 0 0 0; text-align:center;}
	#page3 .bx-pager {text-align:right; padding:23px 20px 0 0;}
.pager-link {
	display:inline-block;
	color:#CCC;
	margin-right:12px;
	cursor:pointer;
	text-decoration:none;
}
.pager-link:hover, 
.pager-active{color:#004;}
.pager-active {cursor:default;}


/***** Lightbox image *****/
.lightbox-image {
	position:relative;
	z-index:1;
	overflow:hidden;
	display:inline-block;
	cursor:pointer;
	}
	.lightbox-image img {
		position:relative;
		z-index:1;
	}
	.lightbox-image span {
		display:inline-block;
		position:absolute;
		left:0px;
		top:-100%;
		width:100%;
		height:100%;
		background:url(../images/magnify.png) no-repeat 50% 50%;
		z-index:2;
		padding:0;
	}

/***** contact form *****/
#contact-form {
	display:block;
	width:100%;
}
	#contact-form label {
		display:block; 
		height:30px; 
		overflow:hidden;
	}
	#contact-form input {
		float:left; 
		width:232px; 
		font-size:12px; 
		line-height:1.25em;
		color:#808080;
		padding:2px 10px; 
		margin:0; 
		font-family:Arial, Helvetica, sans-serif; 
		border:1px solid #ededed;
		background:#fff;
		outline:none;
	}
	#contact-form textarea {
		float:left;
		height:204px; 
		width:474px;
		max-height:204px; 
		max-width:474px;
		font-size:12px; 
		line-height:1.25em;
		color:#004;
		padding:5px 10px; 
		margin:0; 
		font-family:Arial, Helvetica, sans-serif; 
		border:1px solid #ededed;
		background:#fff;
		overflow:auto;
		outline:none;
	}
.text-form {
	float:left; 
	display:block; 
	line-height:24px;
	width:115px; 
}

.buttons {
	padding: 10px 0 0 0;
	text-align: center;
}
.buttons a {margin-left:6px; padding:12px 35px;}
		
/****************************footer************************/
footer {
	width: 100%;
	padding: 23px 0 30px;
	color: #999;
	text-align: center;
}
	footer a {
	color: #000066;
}
	footer span {
	display: block;
	color: #333;
}
	footer .main {font-size:14px; line-height:25px;}

.list-services {
	padding:0;
}
.list-services li {
    float:left;
    padding:0 0 0 10px;
}

@keyframes slidy {
    0% { left: 0%; }
    20% { left: 0%; }
    25% { left: -100%; }
    45% { left: -100%; }
    50% { left: -200%; }
    70% { left: -200%; }
    75% { left: -300%; }
    95% { left: -300%; }
    100% { left: -400%; }
}

div#slider-footer { overflow: hidden; }
div#slider-footer figure p {
	width: 18%;
	float: left;
	color: #666666;
}
div#slider-footer figure {
	position: relative;
	width: 500%;
	margin: 0;
	left: 0;
	text-align: center;
	font-weight: bold;
	color: #000033;
	font-size: 18px;
	animation: 30s slidy infinite;
	background-color: #333333;
}

.black_overlay{
	display: none;
	position: absolute;
	top: 0%;
	left: 0%;
	width: 100%;
	height: 100%;
	background-color: black;
	z-index:1001;
	-moz-opacity: 0.8;
	opacity:.80;
	filter: alpha(opacity=80);
}
 
.white_content {
	display: none;
	position: absolute;
	top: 25%;
	left: 25%;
	width: 50%;
	height: 50%;
	padding: 16px;
	border: 16px solid gray;
	background-color: white;
	z-index:1002;
	overflow: auto;
}

/* Style the Image Used to Trigger the Modal */
#myImg {
    border-radius: 5px;
    cursor: pointer;
    transition: 0.3s;
}

#myImg:hover {opacity: 0.7;}

/* The Modal (background) */
.modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 100px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 80%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: transparent; /* Black w/ opacity */
}

/* Modal Content (Image) */
.modal-content {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
}

/* Caption of Modal Image (Image Text) - Same Width as the Image */
#caption {
    margin: auto;
    display: block;
    width: 80%;
    max-width: 700px;
    text-align: center;
    color: #ccc;
    padding: 10px 0;
    height: 150px;
}

/* Add Animation - Zoom in the Modal */
.modal-content, #caption { 
    -webkit-animation-name: zoom;
    -webkit-animation-duration: 0.6s;
    animation-name: zoom;
    animation-duration: 0.6s;
}

@-webkit-keyframes zoom {
    from {-webkit-transform:scale(0)} 
    to {-webkit-transform:scale(1)}
}

@keyframes zoom {
    from {transform:scale(0)} 
    to {transform:scale(1)}
}

/* The Close Button */
.close {
    position: absolute;
    top: 15px;
    right: 35px;
    color: #f1f1f1;
    font-size: 40px;
    font-weight: bold;
    transition: 0.3s;
}

.close:hover,
.close:focus {
    color: #bbb;
    text-decoration: none;
    cursor: pointer;
}

/* 100% Image Width on Smaller Screens */
@media only screen and (max-width: 700px){
    .modal-content {
        width: 100%;
    }
}
/* To Navigation Style */
.codrops-top {
	background: #fff;
	background: rgba(255, 255, 255, 0.2);
	text-transform: uppercase;
	width: 100%;
	font-size: 0.69em;
	line-height: 2.2;
}

.codrops-top a {
	padding: 0 1em;
	letter-spacing: 0.1em;
	display: inline-block;
}

.codrops-top a:hover {
	color: #e74c3c;
	background: rgba(255,255,255,0.6);
}

.codrops-top span.right {
	float: right;
}

.codrops-top span.right a {
	float: left;
	display: block;
}

.codrops-icon:before {
	font-family: 'codropsicons';
	margin: 0 4px;
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
}

.codrops-icon-drop:before {
	content: "\e001";
}

.codrops-icon-prev:before {
	content: "\e004";
}

button {
	border: none;
	padding: 0.6em 1.2em;
	background: #CCC;
	color: #fff;
	font-family: 'Lato', Calibri, Arial, sans-serif;
	font-size: 1em;
	letter-spacing: 1px;
	text-transform: uppercase;
	cursor: pointer;
	display: inline-block;
	margin: 3px 2px;
	border-radius: 2px;
}

button:hover {
	background: #003;
}
.redondo img {
border: 2px solid grey;
margin: 0;
padding: 0;
border-radius: 40%;
overflow: hidden;
display:block;
	position: absolute;
	width: 105%;
	height: 50%;
}
