.footer{
	position: fixed;
}
/* CSS reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
	margin:0;
	padding:0;
}
html,body {
	margin:0;
	padding:0;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,img {
	border:0;
}
input{
	border:1px solid #b0b0b0;
	padding:3px 5px 4px;
	color:#979797;
	width:190px;
}
address,caption,cite,code,dfn,th,var {
	font-style:normal;
	font-weight:normal;
}
ol,ul {
	list-style:none;
}
caption,th {
	text-align:left;
}
h1,h2,h3,h4,h5,h6 {
	font-size:100%;
	font-weight:normal;
}
q:before,q:after {
	content:'';
}
abbr,acronym { border:0;
}
/* General Demo Style */
body{
	min-width: 350px;
	font-family: AvenirROman;
	color: #fff;
}

a{
	text-decoration: none;
}
.clr{
	clear: both;
}
/* Top Bar Style */
.codrops-top{
	line-height: 24px;
	font-size: 11px;
	background: rgba(255, 255, 255, 1);
	text-transform: uppercase;
	z-index: 9999;
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 24px;
	box-shadow: 1px 0px 2px rgba(0,0,0,0.2);
	-webkit-animation: slideOut 0.5s ease-in-out 0.3s backwards;
	-moz-animation: slideOut 0.5s ease-in-out 0.3s backwards;
	-o-animation: slideOut 0.5s ease-in-out 0.3s backwards;
	-ms-animation: slideOut 0.5s ease-in-out 0.3s backwards;
	animation: slideOut 0.5s ease-in-out 0.3s backwards;
}
.codrops-top a{
	padding: 0px 10px;
	letter-spacing: 1px;
	color: #333;
	text-shadow: 0px 1px 1px #fff;
	display: block;
	float: left;
}
.codrops-top a:hover{
	background: #fff;
}
.codrops-top span.right{
	float: right;
}
.codrops-top span.right a{
	float: left;
	display: block;
}
/* Demo Buttons */
#codrops-demos{
    position: fixed;
	z-index: 2000;
	top: 50px;
	right: 50px;
}
#codrops-demos a{
    display: inline-block;
	font-size: 12px;
	width: 60px;
	height: 24px;
	color: #000;
	line-height: 24px;
	text-align: center;
	box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
	background: rgba(255,255,255,0.9);
	text-transform: uppercase;
}
#codrops-demos a:hover{
	background: #ddd;
	color: #000;
}
#codrops-demos a.current-demo,
#codrops-demos a.current-demo:hover{
	background: #000;
	color: #fff;
	cursor: default;
}
@-webkit-keyframes slideOut{
	0%{top:-30px; opacity: 0;}
	100%{top:0px; opacity: 1;}
}
@-moz-keyframes slideOut{
	0%{top:-30px; opacity: 0;}
	100%{top:0px; opacity: 1;}
}
@-o-keyframes slideOut{
	0%{top:-30px; opacity: 0;}
	100%{top:0px; opacity: 1;}
}
@-ms-keyframes slideOut{
	0%{top:-30px; opacity: 0;}
	100%{top:0px; opacity: 1;}
}
@keyframes slideOut{
	0%{top:-30px; opacity: 0;}
	100%{top:0px; opacity: 1;}
}
html, body {
	height:100%;
}
#likefooter img{
	width:100%;

}
body {
	width: 100%;
	background: #3A62A3;
	overflow: hidden;
}
#header{
	position: absolute;
	z-index: 2000;
	width: 235px;
	top: 50px;
}
.navbar a{
	margin-top: 12px;
width: auto;
}
.navbar > li > a{
	margin-top: 10px;
		line-height: 1;
		font-size: 1em;
}
.navbar li{
	margin-top: 13px;
	line-height: 30px;
	margin-right: 40px;
	height: auto;
	font-family: AvenirHeavy;

	text-align: center;
	font-size: 1.6em;
}
#header h1{
	font-weight: 400;
	text-transform: uppercase;
	color: rgba(255,255,255,0.9);
	text-shadow: 0px 1px 1px rgba(0,0,0,0.3);
	padding: 20px;
	background: #3A62A3;
}
#navigation {
	margin-top: 0px;
	width: 235px;
	display:block;
	list-style:none;
	z-index:3;
}
#navigation a{
	color: #444;
	display: block;
	background: #fff;
	background: rgba(255,255,255,0.9);
	line-height: 50px;
	padding: 0px 20px;
	text-transform: uppercase;
	margin-bottom: 6px;
	box-shadow: 1px 1px 2px rgba(0,0,0,0.2);

}
#navigation a:hover {
	background: #3A62A3;
}
.content{
overflow-y: hidden;

	padding-right: 10%;
	padding-top: 5%;
	position: absolute;
	padding-bottom: 30px;
}
.pequeno{
	font-size: 1.6em;
	height: 100%;
	overflow-y: auto;
	padding-left: 10%;
	padding-right: 10%;
	padding-top: 160px;
	text-align: center;
}
.small{
	height: 50%;
}
.content h2{
	padding: 10px 0px 20px 0px;
	color: #fff;
	color: rgba(255,255,255,0.9);
	text-shadow: 0px 1px 1px rgba(0,0,0,0.3);
}
.content p{
	font-size: 1.8em;
	padding: 10px;
	line-height: 24px;
	color: #fff;

	padding: 10px;
	margin: 3px 0px;
}
.panel{
	overflow-x: hidden;
	overflow-y: scroll;
	background-color: #3A62A3;
	position:fixed;
  top:30px;
  right:0;
  bottom:0;
  left:0;
  opacity:0;
  pointer-events:none;
  transition: all 1s;
}
#protect:target{
  opacity:1;
  pointer-events:auto;
}
#req:target{
  opacity:1;
  pointer-events:auto;
}
#informativas:target{
  opacity:1;
  pointer-events:auto;
}
#restrictivas:target{
  opacity:1;
  pointer-events:auto;
}
#preventivas:target{
  opacity:1;
  pointer-events:auto;
}
@font-face {
    font-family: AvenirBlack
    src: url(../assets/font/AvenirLTStd-Heavy.otf);
    font-weight: bold;
}
@font-face {
    font-family: AvenirROman;
    src: url(../font/AvenirLTStd-Roman.otf);
    font-weight: bold;
}
@font-face {
    font-family: AvenirHeavy;
    src: url(../font/AvenirLTStd-Heavy.otf);
    font-weight: bold;
}
h2{
  text-align: center;
  font-family: AvenirROman;
  font-size: 2em;
}
h3{
	text-align: center;
  font-family: AvenirROman;
  font-size: 1.4em;
}
.imgs{
	padding-left: 30%;
	padding-right:30%;
}

.navbar h2{
	float: left;
}
.navbar-brand{
	margin: 0;
	padding-top: 0;
	float: left;
	width: 50%;
	padding-left: 1%;
	padding-right: 100px;
}
.navbar-brand a{
	color: #3A62A3;
}
.navbar-brand a:hover{
	color: #FFF;
}
@media (min-width: 1251px) and (max-width: 2000px) {
	.container{
		width: 90%;
	}
  .navbar-collapse.collapse {
		width: 90%;
    display: block !important;
  }
}
@media (min-width: 1200px) and (max-width: 1800px) {

	.texto{
		height: 800px
	}

}
.texto{
	width: 100%;
	height: 100%;
	overflow-y: hidden;
	font-size: 1em;
	text-align: left;
	padding-left: 150px;
	margin-left: 6%;
	margin-right: 6%;
}
#req .imagen{
	padding-top: 20%;
}
#informativas .imagen{
	padding-top: 20%;
}
#preventivas .imagen{
	padding-top: 20%;
}
#restrictivas .imagen{
	padding-top: 20%;
}
.imagen h3{
	margin-top: 10px;
	font-size: 2.4em;
}
.imagen{
	position: fixed;
	border-right: solid #FFF;
	padding-top: 15%;
	padding-bottom: 100%;
	padding-left: 10px;
	float: left;
	width: 150px;

}
ol,ul {
	list-style:none;
	font-size: 1.6em;
}
.panel img{
	width: 100%;
	height: 100%;
}
.panel:target{

	background-color: #3A62A3;
}
#home:target ~ #header #navigation #link-home,
#portfolio:target ~ #header #navigation #link-portfolio,
#about:target ~ #header #navigation #link-about,
#contact:target ~ #header #navigation #link-contact{
	background: #3A62A3;
	color: #fff;
}
#home{
	height: 100%;
	overflow-y: hidden;
	overflow-x: hidden;
}
.backhome{
	margin-top: -8%;
}
.container-2 img{
	width: 150px;
}
.container-2 {
	margin-top: 5%;
}
.container-2 h3{
	margin-bottom: 10px;
	margin-top: 10px;
	width: 150px;
}

@media (max-width: 450px) {
	.panel:target{

		background-color: #3A62A3;
	}
}
@media (max-width: 768px) {
	.backhome{
		margin-top: 5%;
	}
	.panel{
		top: 30px;
	}
	.panel:target{

		background-color: #3A62A3;
	}
	.container-2 h3{
		margin-top: 20px;
		margin-bottom: 20px;
		margin-left: 0;
		width: 100%;
	}
.btn-responsive {
  padding:2px 4px;
  font-size:80%;
  line-height: 1;
  border-radius:3px;
}
.container-2 img{
	height: 50%;
	width: 50%;
}
}
.container{
	margin-left: 0 auto;;

}
@media (min-width: 769px) and (max-width: 1150px) {
	.backhome{
		margin-top: 5%;
	}
	.container-2 h3{
		width: 100%;
	}
	.panel:target{

		background-color: #3A62A3;
	}
	h3{
		margin-left: 0;
	}
.btn-responsive {
  padding:4px 9px;
  font-size:90%;
  line-height: 1.2;
}
}

@media screen and (max-width: 500px) {
	.container-2 h3{
		margin-left: 0;
		width: 100%;
	}
  #navmenu li a { font-size: 1.2em; padding: 0 15px; }

  #logo { font-size: 2.1em; }

  h1 { font-size: 2.7em; }
  p { font-size: 2em; }
}
.panel ul{
   list-style: square inside;
}
h3{
	font-size: 1.4em;
}
.panel h3{
	font-size: 2em;
}
 @media (max-width: 400px) {
.texto{
	overflow-x: hidden;
	width: 310px;
}
 }