/*
// Project - Especial Bras�lia 55 Anos 
//
// Developer Team
//  - Bruno Rodrigues - brunorodrigues.df@dabr.com.br
//  - Vin�cius Paix�o - viniciuspaixao.df@dabr.com.br
//
// --------------------
// 1 - Global Styles
// 2 - Typography Styles
// 3 - Navigation Styles
// 4 - Content Styles
// 5 - Video Styles
// 6 - Mansory Styles
// 7 - Galery Styles
// 8 - Resposive Styles
// 9 - Default Reset
// 10 - Animation CSS
*/
/* 1 - Global Styles */
	@import url("https://fonts.googleapis.com/css?family=Poiret+One");
	@import url("https://fonts.googleapis.com/css?family=Josefin+Sans");
	@import url("https://weloveiconfonts.com/api/?family=iconicfill");
	[class*="iconicfill-"]::before { font-family:"iconicfill", sans-serif; }
	html,body {
	color:#999;
	font-family:"Josefin Sans", sans-serif;
	font-size:100%;
	height:100%;
	line-height:1.45;
	}
	.img-center {
		margin: 0px auto;
	}
	header.primary {
    	background-color: transparent !important;
	}
	.nav-main {
    	background: transparent !important;
	}
/* 2 - Typography Styles */
/* 3 - Navigation Styles */
		.navbar-nav {
		  width: 100%;
		  text-align: center;
		}
		.navbar-nav > li {
		  float: none;
		  display: inline-block;
		}
		.navbar-default {
			background-color: rgba(0,0,0,0.4) !important;
			border-bottom: 0px;
			box-shadow: 0px 0px 10px 0px #000
		}
		.navbar-default .navbar-brand {
    	color: #FFF;
		}
		.navbar-brand {
				float: left;
				padding: 2px 10px;
				font-size: 0px;
				line-height: 0px;
				height: 30px;
				top: 0px !important;
				left: 5px !important;
				position: absolute;
		}
		.navbar-default .navbar-nav > li > a {
    		color: #fff;
    		font-size: 20px;
		}
		.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
    		color: #43b6bd;
    		font-size: 20px;
				text-decoration: none;
		}
		.navbar-default .navbar-toggle {
		    border-color: #43b6bd;
		}
		.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
    		background-color: #00a7af;
		}
		.navbar-default .navbar-toggle .icon-bar {
   			background-color: #fff;
		}
		.navbar-toggle .icon-bar {
				display: block;
				width: 28px;
				height: 4px;
				border-radius: 0px;
				margin-top: 2px;
				margin-bottom: 2px
		}	
/* 4 - Content Styles */
	
		/* Social Share Style */
			#sharer-bottom {
				height: 50px;
				float: right;
				width: 208px;
			}
			#sharer-bottom .sharer-icon {
				margin-right: 2px;
			}
			#sharer-bottom a {
				cursor: pointer;
			}
		
		/* Social Share - Icon */
			.sharer-icon {
				background-image: url(../img/eusoubsb/sharer.png);
				float: left;
				height: 50px;
				width: 50px;
			}
			.sharer-icon.sharer-icon-facebook {
				background-position: 0 0;
			}
			.sharer-icon.sharer-icon-twitter {
				background-position: -50px 0;
			}
			.sharer-icon.sharer-icon-googleplus {
				background-position: -100px 0;
			}
			.sharer-icon.sharer-icon-pinterest {
				background-position: -150px 0;
			}
		.open_grid h2, .open_gallery h2 {
			font-family:"Poiret One", sans-serif;
			font-size:3.0em;
			padding:.4em 0em 0em;
			color: #666;
			text-align: left;
			margin-bottom: 0.1em;
			font-weight: 600;
		}
		.open_grid h3, .open_gallery h3 {
			font-family: "Josefin Sans",sans-serif;
			color: #43b6bd;
			text-align: left;
			margin-bottom: 1.2em;
			margin-top: 0.1em;
			font-size: 1.6em;
			font-weight: 100;
		}
		#content {
			background-color:#fff;
			padding:0em;
			
		}
		footer {
			text-align: center;
			margin-top: 25px;
			background-color: #00a2a7;
			min-height: 80px;
			padding-top: 20px;
		}
		#btn_grid, #btn_gallery {
			background-color: #43b6bd;
			border: none;
			padding: 20px 35px;
			color: white;
			text-shadow: 1px 1px 1px rgba(0, 162, 167, 0.87);
			font-size: 1.8em;
			margin-top: 40px;
			float: right;
		}
		div#title {
			position: absolute;
			top: 20%;
			left: 25%;
			right: 25%;
			bottom: 20%;
			text-align: center;
			z-index: 1;
		}
		
		#title>h1 {
			font-size: 50px;
			line-height: 60px;
			font-weight: 600;
			color: #FFF;
			font-family: "Poiret One",sans-serif;
			margin-bottom: 25px;
			display: inline-block;
			text-shadow: 1px 1px 3px rgba(0,0,0,0.3)
		}
		#title>a {
			padding: 10px 20px;
			font-size: 35px;
			background-color: #00a2a7;
			border: none;
			display: inline-block;
		}
		#title>a:hover, #title>a:focus {
			box-shadow: 0px 0px 8px rgba(0, 162, 167, 0.87);
		}
		/* Modal Boxes */
			.modal-dialog {
				width: 75%;
				margin: 75px auto;
				color: #777;
				font-size: 1.5em;
				line-height: 1.5em
			}
			
			.modal-header {
				padding: 15px;
				border-bottom: 1px solid #E5E5E5;
				min-height: 16.4286px;
				background-color: rgb(67, 182, 189);
				color: white;
			}
			#modal-video>.modal-dialog {
				padding: 0px;
				position: absolute;
				top: 0px;
				bottom: 0px;
				left: 0px;
				right: 0px;
				width: 100%;
			}
			#modal-video>.modal-dialog>.modal-content {
				background-color: transparent;
				border: none;
				border-radius: 0px;
				box-shadow: none;
				background-clip: none;
				outline: 0px none;
			}
			#modal-video>.modal-dialog>.modal-content>.modal-body {
				padding: 0px;
			}
			
			#modal-video>.modal-dialog>.modal-content>.modal-body>button{
				padding: 15px;
				background-color: #00a2a7;
				border: none;
				box-shadow: 0px 0px 5px rgba(0, 162, 167, 0.87);
				position: absolute;
				right: 5%;
				color: white;
				font-size: 20px;
			}
			a.next>i {
			    position: absolute;
    			top: 6px;
			    right: 8px;
				}
			a.pref>i {
			    position: absolute;
    			top: 6px;
			    left: 8px;
				}
            .modal-backdrop {
              z-index: 900 !important;
            }
/* 5 - Video Styles */
	/* Video Overlay */
		#overlay {
			/*background-color:rgba(0,0,0,.65);*/
			height:100%;
			left:0;
			position:relative;
			top:0;
			transition:background-color 300ms ease;
			width:100%;
		}
		.fade { background-color:rgba(0,0,0,.85) !important; }
	/* Hero Video + Fallback */
		#hero-vid, #hero-pic {
            background: url(../img/eusoubsb/cover_video.jpg) center center no-repeat
			background-size:cover;
			bottom:0;
			height:auto;
			min-height: 100%;
			position: absolute;
			right:0;
			width:100%;
			z-index:0;
		}
		#state {
			background-color:rgba(0,0,0,.8);
			bottom:0;
			cursor:pointer;
			font-size:2.25em;
			left:0;
			padding:0.55em 1.05em 0.35em 1em;
			position:absolute;
		}
		#hero-vid-campanha {
			bottom: 0px;
			height: 100%;
			position: fixed;
			margin-right: 0px;
			width: 100%;
			z-index: -1;
			top: 30px;
			left: 0px;
		}
/* 6 - Mansory Styles 
	
	/* -- Masonry Grid -- */
		.container_grid {
		  width: 100%;
		  margin-bottom: 20px;
		}
		.item {
		  width:  19.93%;
		  float: left;
		  border: none;
		  background: #fff;
		  margin-top: 1px;
		  margin-bottom: 0px;
			margin-left: 1px;
		}
		.item.w2 { width: 113px; }
		.item.w3 { width: 180px; }
		.item.w4 { width: 240px; }
		.item.h2 { height: 113px; }
		.item.h3 { height: 160px; }
		.item.h4 { height: auto; }
		.item.h5 { height: 280px; }
		.stamp {
		  background: red;
		  opacity: 0.75;
		  position: absolute;
		  border: 1px solid;
		}
/* 7 - Galery Styles */

    div#links>a>img {
        width:150px;
        height:150px;
    }

/* 8 - Responsive Styles */	
	/* Visibility Helpers */
	@media only screen and (min-width:769px) {
	.visible-mobile,.visible-tablet,.hidden-desktop { display:none !important; }
	}
	@media only screen and (min-width:480px) and (max-width:768px) {
	.visible-mobile,.hidden-tablet,.visible-desktop { display:none !important; }
	}
	@media only screen and (max-width:479px) {
	.hidden-mobile,.visible-tablet,.visible-desktop { display:none !important; }
	}
	/* Changing Toogle Visibility */
		@media (min-width: 468px) {
		    .navbar-header {
		        float: none;
		    }
		    .navbar-left,.navbar-right {
		        float: none !important;
		    }
		    .navbar-toggle {
		        display: block;
		    }
		    .navbar-collapse {
		        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
		    }
		    .navbar-fixed-top {
				top: 0;
				border-width: 0 0 1px;
			}
		    .navbar-collapse.collapse {
		        display: none!important;
		    }
		    .navbar-nav {
		        float: none!important;
				margin-top: 0px;
			}
			.navbar-nav>li {
		        float: none;
		    }
		    .navbar-nav>li>a {
		        padding-top: 10px;
		        padding-bottom: 10px;
		    }
		    .collapse.in{
		  		display:block !important;
			}
		}
@media (min-width:480px) and (max-width:991px) {
	
	div#title {
			position: absolute;
			top: 16%;
			left: 10%;
			right: 10%;
			bottom: 20%;
			text-align: center;
			z-index: 1;
		}
		
		#title>h1 {
			font-size: 40px;
			line-height: 50px;
			font-weight: 600;
			color: #FFF;
			font-family: "Poiret One",sans-serif;
			margin-bottom: 25px;
			display: inline-block;
			text-shadow: 1px 1px 3px rgba(0,0,0,0.3)
		}
		#title>a {
			padding: 10px 20px;
			font-size: 30px;
			background-color: #00a2a7;
			border: none;
			display: inline-block;
		}
}
@media (max-width:480px) {
	
	div#title {
			position: absolute;
			top: 18%;
			left: 15%;
			right: 15%;
			bottom: 10%;
			text-align: center;
			z-index: 1;
		}
		
		#title>h1 {
			font-size: 35px;
			line-height: 40px;
			font-weight: 600;
			color: #FFF;
			font-family: "Poiret One",sans-serif;
			margin-bottom: 35px;
			display: inline-block;
			text-shadow: 1px 1px 3px rgba(0,0,0,0.3)
		}
		#title>a {
			padding: 10px 20px;
			font-size: 35px;
			background-color: #00a2a7;
			border: none;
			display: inline-block;
		}
}
	/* Masonry Grid */
		@media (max-width: 1200px) {
			.item {
			  width:  24.86%;
			}
		}
		@media (max-width: 991px) {
			.item {
			  width:  33.1%;
			}
		}
		@media (min-width: 480px) and (max-width: 768px) {
			.item {
			  width:  49.7%;
			}
		}
		@media (max-width: 479px) {
			.item {
			  width:  99.5%;
			}
		}
		@media (min-width: 1200px) {
			.item.w2 {
			  width: 12.4%;
			}
		}
		@media (max-width: 1199px) {
			.item.w2 {
			  width: 16.55%;
			}
		}
		@media (max-width: 991px) {
			.item.w2{
			  width:  19.85%;
			}
		}
		@media (min-width: 480px) and (max-width: 768px) {
			.item.w2{
			  width:  24.5%;
			}
		}
		@media (max-width: 479px) {
			.item.w2{
			  width:  49.5%;
			}
			
			.
		}
	/* Open Text Adjustments */
		@media (max-width: 767px) {
			.open_grid h2, .open_gallery h2 {
				text-align: center;
			}
			.open_grid h3, .open_gallery h3 {
				text-align: center;
			}
		}
	/* Button Trigger Adjustment */
		
		@media (min-width: 769px) and (max-width: 991px) {
			#btn_grid {
				margin: 65px -10% 0px 0px ;
				display: inline-block;
				padding: 15px;
				width: 117%;
			}
			
			#btn_gallery {
				margin-top: 85px;
			}
						
			#btn_grid i, #btn_gallery i {
				font-size: 25px;
				float: left;
				margin-top: 7px
			}
			
			#btn_grid span, #btn_gallery span {
				font-size: 20px;
				float: left;
				margin-top: 5px;
				display: inline-block;				
				width: 50%
			}
		}
		@media (min-width:480px) and (max-width: 768px) {
			#btn_grid, #btn_gallery {
				margin: 0px 0px 30px;
				display: inline-block;
				width: 100%;
				float: none;
				font-size: 2em;
				padding: 15px;
			}
		}
		@media (max-width: 479px) {
			#btn_grid, #btn_gallery {
				margin: 0px 0px 30px;
				display: inline-block;
				width: 100%;
				float: none;
				font-size: 1.3em;
				padding: 15px;
			}
		}
/* 9 - Default Reset */	
	
	.row { 
		-webkit-transition: width 0.8s ease   ;
		-moz-transition: width 0.8s ease   ;
		-o-transition: width 0.8s ease  ;
		transition: width 0.8s ease ;
		margin-left: 0px !important;
		margin-right: 0px !important;
	}
	/*Reset*/
		.reset-mg{margin:0 !important;}			.reset-mgl{margin-left: 0 !important;}		.reset-mgr{margin-right: 0 !important;}				.reset-pdt{padding-top:0 !important;}			.reset-pdl{padding-left:0 !important;}
		.reset-pd{padding:0 !important;}		.reset-mgt{margin-top: 0 !important;}		.reset-mgb{margin-bottom: 0 !important;}			.reset-pdb{padding-bottom:0 !important;}		.reset-pdr{padding-right:0 !important;}
	
	/*Margin*/
		.mgt-xxxlarge{margin-top: 40px !important;}		.mgb-xxxlarge{margin-bottom: 40px !important;}	.mgl-xxxlarge{margin-left: 40px !important;}	.mgr-xxxlarge{margin-right: 40px !important;}
		.mgt-xxlarge{margin-top: 30px !important;}		.mgb-xxlarge{margin-bottom: 30px !important;}	.mgl-xxlarge{margin-left: 30px !important;}     .mgr-xxlarge{margin-right: 30px !important;}
		.mgt-xlarge{margin-top: 20px !important;}		.mgb-xlarge{margin-bottom: 20px !important;}	.mgl-xlarge{margin-left: 20px !important;}    	.mgr-xlarge{margin-right: 20px !important;}
		.mgt-large{margin-top: 15px !important;}		.mgb-large{margin-bottom: 15px !important;}		.mgl-large{margin-left: 15px !important;}     	.mgr-large{margin-right: 15px !important;}
		.mgt-normal{margin-top: 10px !important;}		.mgb-normal{margin-bottom: 10px !important;}	.mgl-normal{margin-left: 10px !important;}      .mgr-normal{margin-right: 10px !important;}
		.mgt-small{margin-top: 5px !important;}			.mgb-small{margin-bottom: 5px !important;}		.mgl-small{margin-left: 5px !important;}		.mgr-small{margin-right: 5px !important;}	
		.mgt-xsmall{margin-top: 2px !important;} 		
		.mga {margin-left: auto !important; margin-right:auto !important;}
	
	/*Padding*/
		.pd-xxxxlarge{padding: 45px !important;}
		.pd-xxxlarge{padding: 40px !important;}				.pd-xxlarge{padding:30px !important;}					.pd-xlarge{padding:20px !important;}
		.pd-normal{padding: 10px !important;}				.pd-small{padding:5px !important;}						.pd-large{padding:15px !important;}
		
		.pdt-xxxlarge{padding-top: 40px !important;}		.pdb-xxxlarge{padding-bottom: 40px !important;}			.pdl-xxxlarge{padding-left: 40px !important;}			.pdr-xxxlarge{padding-right: 40px !important;}
		.pdt-xxlarge{padding-top: 30px !important;}			.pdb-xxlarge{padding-bottom: 30px !important;}			.pdl-xxlarge{padding-left: 30px !important;}			.pdr-xxlarge{padding-right: 30px !important;}	
		.pdt-xlarge{padding-top: 20px !important;}			.pdb-xlarge{padding-bottom: 20px !important;}        	.pdl-xlarge{padding-left: 20px !important;}      		.pdr-xlarge{padding-right: 20px !important;}
		.pdt-large{padding-top: 15px !important;}			.pdb-large{padding-bottom: 15px !important;}    		.pdl-large{padding-left: 15px !important;}      		.pdr-large{padding-right: 15px !important;}
		.pdt-normal{padding-top: 10px !important;}			.pdb-normal{padding-bottom: 10px !important;}   		.pdl-normal{padding-left: 10px !important;}    			.pdr-normal{padding-right: 10px !important;}
		.pdt-small{padding-top: 5px !important;}		 	.pdb-small{padding-bottom: 5px !important;}         	.pdl-small{padding-left: 5px !important;}       		.pdr-small{padding-right: 5px !important;}
		.pdt-xsmall{padding-top:3px !important;}
	
	/*Line-height*/
		.lineH0{line-height: 0 !important;}
		.lineH10{line-height: 10px !important;}			.lineH25{line-height: 25px !important;}
		.lineH12{line-height: 12px !important;}			.lineH30{line-height: 30px !important;}
		.lineH16{line-height: 16px !important;}			.lineH40{line-height: 40px !important;}
		.lineH18{line-height: 18px !important;}			.lineH50{line-height: 50px !important;}
		.lineH20{line-height: 20px !important;}			.lineH60{line-height: 60px !important;}
	
	/*Text-align*/
		.taC{text-align: center !important;}	.taR{text-align: right !important;}		.taL{text-align: left !important;}		.taJ {text-align: justify !important;}
	
	/*Text-transformation*/
		.ttU{text-transform: uppercase !important;}		.ttL{text-transform: lowercase !important;}		.ttC{text-transform: capitalize !important;}
	/*Font-size*/
		.fs-08{font-size: 8px !important;}
		.fs-10{font-size: 10px !important;}			.fs-12{font-size: 12px !important;}			.fs-13{font-size: 13px !important;}			.fs-14{font-size: 14px !important;}	
		.fs-15{font-size: 15px !important;}			.fs-16{font-size: 16px !important;}			.fs-18{font-size: 18px !important;}			.fs-19{font-size: 19px !important;}	
		.fs-20{font-size: 20px !important;} 		.fs-22 {font-size: 22px !important;} 		.fs-24{font-size: 24px !important;}			.fs-30{font-size: 30px !important;}	
		.fs-40{font-size: 40px !important;} 		.fs-50{font-size: 50px !important;}			.fs-80{font-size: 80px !important;}			.fs-100{font-size: 100px !important;}
	/*Font-weight*/
		.fw-100 {font-weight: 100 !important;} 		.fw-200 {font-weight: 200 !important;} 		.fw-300 {font-weight: 300 !important;} 		.fw-400 {font-weight: 400 !important;} 		
		.fw-500 {font-weight: 500 !important;} 		.fw-600 {font-weight: 600 !important;} 		.fw-700 {font-weight: 700 !important;} 		.fw-800 {font-weight: 800 !important;}  .fw-900 {font-weight: 900 !important;}
	/*Font Color*/
		.white {color: #fff;} 				.brown{color: #998A4D;} 			.green{color: #598019;} 				.orange{color: #FF5C0D;} 				.gray{color: #999;} 				
		.black {color: #000;}				.dark-brown{color: #272B1E;} 		.dark-green{color: #004D36;} 			.dark-orange{color: #AB350E;} 		.dark-gray{color: #333;}
		.red {color: #B92519;}
	/*Border Radius */
		.br-0 {border-radius: 0px;} 		.br-4 {border-radius: 4px;} 		.br-10 {border-radius: 10px;}	
	/*Position*/
		.pos-rel {position: relative;} 	.pos-abs {position: absolute;} .pos-fix {position: fixed;}
					
/* 10 - Animation CSS */
	.masonry,
	.masonry .masonry-brick {
	  -webkit-transition-duration: 0.7s;
	     -moz-transition-duration: 0.7s;
	      -ms-transition-duration: 0.7s;
	       -o-transition-duration: 0.7s;
	          transition-duration: 0.7s;
	}
	.masonry {
	  -webkit-transition-property: height, width;
	     -moz-transition-property: height, width;
	      -ms-transition-property: height, width;
	       -o-transition-property: height, width;
	          transition-property: height, width;
	}
	.masonry .masonry-brick {
	  -webkit-transition-property: left, right, top;
	     -moz-transition-property: left, right, top;
	      -ms-transition-property: left, right, top;
	       -o-transition-property: left, right, top;
	          transition-property: left, right, top;}