/* 	Reset Styling
----------------------------------------------------------------------*/

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;
	
}

article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, img {
	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;
}
* {
	outline: none;
	padding: 0px;
	margin: 0px
}

/*	General Styling
----------------------------------------------------------------------*/
body {
	margin: 0 auto;
	color: #006;
	line-height: 18px;
	font-family: "Tahoma", Helvetica, Arial;
/*	alterei aqui, estava hidden, mas parou de funcionar o scroll no chrome mobile 25.06.2015*/
	overflow: auto;
	font-size: 14px
}
::selection{
	color:#fff;
	background:#191919
}
::-moz-selection{
	color:#fff;
	background:#191919
}
img {
	border: none;
	max-width: 100%
}
a {	text-decoration: none !important;
	color: #006;
}
.toptel { background: #003;  color:#CCC; font-size:1em }
a.toptel:link { color:#CCC; }
a:link { color: #006; } 
a:visited { color:#006; }
a.toptel:hover { color:#CCC;  } 
a:active { color:#006;}

h1, h2, h3, h4, h5, h6 {
	color: #000;
	padding: 0;
	margin: 0 0 10px 0;
	font-family: "Marcellus", Tahoma, Arial;
	font-weight: bold;
	line-height: 1;
	text-transform: uppercase;
}
h1 { font-size: 32px }
h2 { font-size: 26px }
h3 { padding-left:1em; font-size: 20px  }
h4 { font-size: 18px }
h5 { font-size: 14px }
h6 { font-size: 12px }
.invisivel{display:none;}


h5_2 {
	color: #006;
	padding: 0;
	margin: 0 0 10px 0;
	font-family: "Marcellus", Tahoma, Arial;
	font-weight: bold;
	line-height: 1.5;
    font-size: 16px;
}

.pad { padding:0 1em 1em 1em;}
.duz { width:200px;}
.dc { width:250px; height:170px;}

p {
	margin-bottom: 30px
}
p:last-child {
	margin-bottom: 0
}
strong {
	font-weight: bold
}
em {
	font-style: italic
}
ol {
	padding: 0;
	margin: 0
}
ol li {
	list-style: decimal;
	padding: 0 0 10px 0;
	margin: 0 0 0 20px;
	line-height: 24px
}
ul {
	padding: 0;
	margin: 0;
	list-style-type: none
}
cite {
	float: right;
	padding: 0 0 5px 0
}
hr {
	background: #e6e6e6;
	border: 0;
	clear: both;
	width: 100%;
	height: 1px;
	padding: 0;
	margin: 20px 0;
	position: relative
}
pre {
	color: #333;
	white-space: initial;
	border-radius: 3px;
	background: #ccc;
	border-left: 8px solid #1ABC9C;
	padding: 14px 20px;
	white-space: initial;
	margin: 5px 0 20px 0;
	overflow: auto;
	font-size: 12px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
}
code {
	background: #ccc;
	border-left: 8px solid #1ABC9C;
	padding: 14px 20px;
	border-radius: 3px;
	margin: 5px 0 20px 0;
	clear: both;
	display: block;
	font-size: 12px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
}
iframe {
	max-width: 100%;
}
mark {
	padding: 3px 5px;
}
textarea { 
	white-space:pre; 
}

/*	Grid >> Global
----------------------------------------------------------------------------------------------------*/
.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12 {
	display:inline;
	float: left;
	position: relative;
	margin-left: 0%;
	margin-right: 0%;
}

/*	Grid >> Children (Alpha ~ First, Omega ~ Last)
----------------------------------------------------------------------------------------------------*/
.alpha {
	margin-left: 0 !important
}
.omega {
	margin-right: 1em !important
}

/*	Grid >> 12 Columns
----------------------------------------------------------------------------------------------------*/
.grid_1 {
	width:6.333%;
}
.grid_2 {
	width:14.667%;
}

.grid_3 {
	width:23.0%;
}

.grid_4 {
	width:31.333%;
}

.grid_5 {
	width:39.667%;
}

.grid_6 {
	width:48.0%;
}

.grid_7 {
	width:56.333%;
}

.grid_8 {
	width:64.667%;
}

.grid_9 {
	width:73.0%;
}

.grid_10 {
	width:81.333%;
}

.grid_11 {
	width:89.667%;
}
.grid_12 {
	width:98.0%;
}
.grid_12:after {
	content: "";
	clear: both;
}
.grid_full {
	width:100%;
}



/*	Clear Floated Elements
----------------------------------------------------------------------------------------------------*/
.clear {
	  clear: both;
	  display: block;
	  overflow: hidden;
	  visibility: hidden;
	  width: 0;
	  height: 0;
}
.clearfix:before,
.clearfix:after {
	  content: '\0020';
	  display: block;
	  overflow: hidden;
	  visibility: hidden;
	  width: 0;
	  height: 0;
}
.clearfix:after {
	clear: both;
}
.clearfix {
	zoom: 1;
}

/*	Header
----------------------------------------------------------------------------------------------------*/
.dropdown {
	background: ;
	color: #fff
}
.bloco {width:100%; float:right; margin-left:0em;}
.bloco1 {padding:1%; margin-left:2%; }
.tamanho100 { width:100%;}
.tamanhomax100 { max-width:100%;}

.aq {text-align:left;}.ali {text-align:center;}.ala {text-align:justify;}.la {text-align: right;}
.arrow-down {
	position: absolute;
	width: 0; 
	height: 0; 
	border-left: 22px solid transparent;
	border-right: 22px solid transparent;
	border-top: 22px solid #191919;
	right: 20px;
	bottom: -22px;
	color: #FFF;
	z-index: 9999;
	cursor: pointer;
	-webkit-transition: all 1s;
	transition: all 1s;
}
.arrow-down i {
	position: absolute;
	bottom: 6px;
	right: -4px;
}
.opened {
	border-top: 0;
	border-bottom: 22px solid #FFF;
	bottom: 0px;
	color: #191919;
	-webkit-transition: all 0.5s;
	transition: all 0.5s;
}
.opened i {
	bottom: -20px;
}
.extrabox {
	position: absolute;
	top: -1000px;
	right: 0;
	z-index: 999;
	width: 100%;
	background: #002059;
	background: rgba(0, 32, 89, 0.99);
}
.extra-content {
	padding: 32px 16px;
	display: inline-block;
	width: 100%;
	color: #4d4d4d;
}
.extra-content h3 {
	color: #fff;
	border-bottom: 1px solid #fff;
	font-size: 14px
}
.extra-content .liner, 
#footer .liner {
	border-bottom: 1px solid #313131;
}

/*	contactForm
----------------------------------------------------------------------------------------------------*/
#contactForm-widget span {
	margin-left: 10px;
	color: #F00;
}
#contactForm-widget span i {
	color: #fff;
}
#contactForm-widget #message {
	display: block;
	width: 100%;
	border: 1px solid #2C2C2C;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	padding: 16px 10px;
	font-size: 11px;
	background: #F7F7F7;
	color:#000000;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
}
#contactForm-widget #senderName, 
#contactForm-widget #senderEmail {
	display: block;
	width: 100%;
	border: 1px solid #2C2C2C;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	padding: 0 10px;
	line-height: 24px;
	height: 34px;
	font-size: 11px;
	background: #F7F7F7;
	color:#000000;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
}
#contactForm-widget #senderEmail {
	float: right;
}
#contactForm-widget .flr {
	margin: 0 0 10px 0 !important;
	padding:1em;
}
#contactForm-widget .fll {
	margin: 0 0px 10px 0 !important;
	padding:1em;
}
#contactForm-widget #senderName:focus, 
#contactForm-widget #senderEmail:focus, 
#contactForm-widget #message:focus {
	-webkit-box-shadow: none;
	box-shadow: none;
	border: 1px solid #696969
}
.fieldtrue {
	border: 1px solid #1ABC5B !important
}
.fielderror {
	border-color: #F00 !important;
}
#contactForm-widget #sendMessage {
	background: #00519d;
	color: #FFF;
	margin: 10px 0 0 0;
	padding: 10px 20px;
	border: 0;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
	cursor: pointer;
}
#contactForm-widget #sendMessage:hover {
	background: #696969;
}
.error {
	color: red
}
.load-color {
	background: #002059 !important;
	cursor: default !important;
}
#contactForm-widget textarea {
	width: 98%;
}
#contactForm-widget #comment-button {
	background: #2C3E50;
	color: #FFF;
	margin: 20px 0 0 0;
	padding: 10px 20px;
	border: 0;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	text-transform: uppercase;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
	cursor: pointer;
}
#contactForm-widget #comment-button:hover {
	background: #1ABC9C
}

/*	contactForm
----------------------------------------------------------------------------------------------------*/
#contactForm span {
	margin: 11px 10px;
	display: inline-block;
	color: #F00;
}
#contactForm span strong {
	color: #F00;
}
#contactForm i {
	color: #fff;
	margin: 0 10px 0 0
}
#track_input, 
#contactForm #senderName, 
#contactForm #senderEmail {
	display: block;
	width: 100%;
	border: 1px solid #EAEAEA;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	padding: 0 10px;
	line-height: 24px;
	height: 34px;
	background: #F7F7F7;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
}
#contactForm #message {
	display: block;
	width: 100%;
	border: 1px solid #EAEAEA;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
	padding: 16px 10px;
	background: #F7F7F7;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
}
#track_input:focus, 
#contactForm #senderName:focus, 
#contactForm #senderEmail:focus, 
#contactForm #message:focus {
	background: #fff;
	border: 1px solid #C5C5C5;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
}
#track_order label {
	font-weight: 600;
	margin-bottom: 14px;
}
#contactForm #senderEmail {
	float: right;
}
#contactForm .flr {
	margin: 0 0 10px 0 !important;
	padding:  1em 1em 1em 0;
	
}
#contactForm .fll {
	margin: 0 0px 10px 0 !important;
	padding:  1em 1em 1em 0;
}
#contactForm #sendMessage, #sendOrder {
	width: auto;
	margin-top: 10px;
	float: right;
	padding: 8px 10px;
	display:inline-block;
	cursor:pointer;
	position:relative;
	background:#191919;
	-webkit-border-radius: 2px;
	border-radius: 2px;
	color:#fff;
	text-shadow:0 -1px 0 rgba(0,0,0,0.2);
	border:1px solid rgba(0,0,0,0.1);
	background-image: linear-gradient(bottom, rgba(0,0,0,0.08) 0%, rgba(128,128,128,0.08) 50%, rgba(255,255,255,0.08) 100%);
	background-image: -o-linear-gradient(bottom, rgba(0,0,0,0.08) 0%, rgba(128,128,128,0.08) 50%, rgba(255,255,255,0.08) 100%);
	background-image: -moz-linear-gradient(bottom, rgba(0,0,0,0.08) 0%, rgba(128,128,128,0.08) 50%, rgba(255,255,255,0.08) 100%);
	background-image: -webkit-linear-gradient(bottom, rgba(0,0,0,0.08) 0%, rgba(128,128,128,0.08) 50%, rgba(255,255,255,0.08) 100%);
	background-image: -ms-linear-gradient(bottom, rgba(0,0,0,0.08) 0%, rgba(128,128,128,0.08) 50%, rgba(255,255,255,0.08) 100%);
	background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, rgba(0,0,0,0.08)),color-stop(0.5, rgba(128,128,128,0.08)),color-stop(1, rgba(255,255,255,0.08)));
	-moz-box-shadow:inset 0 0 1px rgba(0,0,0,0.1);
	-webkit-box-shadow:inset 0 0 1px rgba(0,0,0,0.1);
	box-shadow:inset 0 0 1px rgba(0,0,0,0.1);
	-webkit-transition: all 0.2s ease;
	transition: all 0.2s ease;
}
#contactForm #sendMessage:hover, #sendOrder:hover {
	background:#333
}
#contactForm textarea {
	width: 98%;
}
#contactForm #comment-button {
	background: #2C3E50;
	color: #FFF;
	margin: 20px 0 0 0;
	padding: 10px 20px;
	border: 0;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	text-transform: uppercase;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
	cursor: pointer;
}
#contactForm #comment-button:hover {
	background: #1ABC9C
}

/*	Page Content
----------------------------------------------------------------------*/
.page-content {
	margin: 70px 0;
}
.grey-line {
	width: 100%;
	padding: 40px 0;
	background: #F2F2F2  repeat;
	border-top: 2px solid #e9e9e9;
	border-bottom: 2px solid #e9e9e9;
}
.grey-line.official_feature_one {
	padding: 40px 0 0;
}

@-webkit-keyframes animate-stripes { 
	0% {background-position: 0 0;} 100% {background-position: 60px 0;}
}
@-moz-keyframes animate-stripes {
	0% {background-position: 0 0;} 100% {background-position: 60px 0;}
}


.google-maps {
          position: relative;
          padding-bottom: 30%; // This is the aspect ratio
          height: 0;
          overflow: hidden;
          }
         .google-maps iframe {
          position: absolute;
          top: 0;
          left: 0;
          width: 100% !important;
          height:100% !important;
          }


/*	Portfolio
----------------------------------------------------------------------*/
.portfolio {
	width: 100% !important;
}
.portfolio-carousel, .client-carousel, .magazine-carousel {
	width: 100% !important;
	overflow: visible !important;
}
.clients {
	float: left;
	overflow: hidden !important;
	width: 101% !important;
	margin-left: -10px;
}
.clients ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}
.clients li {
	width: 248px;
	height: 120px;
	margin: 6px 10px;
	padding: 0;
	border: 1px solid #F3F3F3;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	-webkit-transition: border 0.2s ease;
	transition: border 0.2s ease;
}
.clients li:hover {
	border: 1px solid #C0C0C0
}
.anyClass {
	width:100% !important;

}
.anyClass ul {
	list-style-type: none;
}
.anyClass li {
	overflow: hidden;
	float: left;
	width: 18%;
	height:450px; !important;
	margin: 0.5% 1%;
	padding: 0;
	border: 1px solid #e6e6e6;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	-webkit-transition: border 0.2s ease, box-shadow 0.2s ease;
	transition: border 0.2s ease, box-shadow 0.2s ease;
	border-bottom: 3px solid #e6e6e6;
}
.anyClass1 ul {
	list-style-type: none;
}
.anyClass1 {
	width:100% !important;
}
.anyClass1 li {
	overflow: hidden;
	float: left;
	width: 18%;
	height:300px !important;
	margin: 0.5% 1%;
	padding: 0;
	border: 1px solid #e6e6e6;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	-webkit-transition: border 0.2s ease, box-shadow 0.2s ease;
	transition: border 0.2s ease, box-shadow 0.2s ease;
	border-bottom: 3px solid #e6e6e6;
}

.anyClass2 ul {
	list-style-type: none;
}
.anyClass2 {
	width:100% !important;
}
.anyClass2 li {
	overflow: hidden;
	float: left;
	width: 30%;
	height:auto !important;
	margin: 0.5% 1%;
	padding: 0;
}


.portfolio li {
	margin: 6px 10px;
	padding: 0;
	border: 1px solid #e6e6e6;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	-webkit-transition: border 0.2s ease, box-shadow 0.2s ease;
	transition: border 0.2s ease, box-shadow 0.2s ease;
	border-bottom: 3px solid #e6e6e6;
}
.portfolio li {
	float: left;
	margin: 0 7px 20px;
	overflow: hidden;
	position: relative;
}
.anyClass li:hover, .portfolio li:hover {
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
	border-bottom: 3px solid;
}
.ie8 .anyClass li:hover, .ie8 .portfolio li:hover {
	border: 1px solid #000;
}
.anyClass1 li:hover, .portfolio li:hover {
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
	border-bottom: 3px solid;
}
.ie8 .anyClass1 li:hover, .ie8 .portfolio li:hover {
	border: 1px solid #000;
}

.detailes {
	text-align: center;
	padding: 20px 0;
	display: block;
	color: #545454;
	background: #fff;
	height: 100%;
}
.detailes h5 {
	margin: 0 0 2px 0;
	font-weight: normal;
}
.detailes h5 a {
	color: #002059;
}
.detailes a {
	color: #545454;
}
.detailes a:hover, .detailes h5 a:hover {
	color: #000;
}
.single-first-row h4 {
	float: left;
}
.project-links {
	float: right;
	color: #ccc;
}
.project-links a {
	font-size: 14px;
	padding: 0 4px
}
.project-links a:last-child {
	padding: 0 0 0 4px
}

/* 	Filters
----------------------------------------------------------------------------------------------------*/
.filterable {}
.filterable ul.filter {
	padding: 0;
	display: inline-block;
}
.filterable ul.filter li {
	display: inline-block;
	color: #272727;
	margin: 0;
	position: relative;
}
.filterable li a {
	padding: 0 10px;
	font-size: 13px;
	color: #ccc;
	-webkit-transition: all 0.2s;
	transition: all 0.2s;
}
.filterable li a:hover {
	color: #191919;
}
.filterable li.current a {
	color: #191919;
	font-weight: 600;
}
.filterable ul.filter li:last-child {
	padding-right: 0;
	margin-right: 0;
}
.filterable li:before {
	content: "/";
	position: absolute;
	display: block;
	font-size: 8px;
	left: -6px;
	top: 1px;
}
.filterable li:first-child:before {
	content: "";
	height: 0;
	width: 0;
	border: 0;
}

/* 	Image-overlay
----------------------------------------------------------------------*/
.O_hover {
	overflow: hidden;
	position: relative;
	background: #000
}
.O_hover img {
	transform: scale(1);
	-webkit-transform: scale(1);
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
.O_hover:hover img {
	transform: scale(1.2);
	-webkit-transform: scale(1.2);
	-moz-opacity: 0.50;
	opacity: .50;
	filter: alpha(opacity=50);
}
.hover-fx {
	overflow: hidden;
	position: relative;
	background: #000
}
.hover-fx img {
	float: left;
	opacity: 1;
	width: 100%;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
.anyClass li:hover img, .portfolio li:hover img {
	transform: scale(1.2);
	-ms-transform: scale(1.2);
	-webkit-transform: scale(1.2);
	-moz-opacity: 0.50;
	opacity: .50;
	filter: alpha(opacity=50);
}
.anyClass1 li:hover img, .portfolio li:hover img {
	transform: scale(1.2);
	-ms-transform: scale(1.2);
	-webkit-transform: scale(1.2);
	-moz-opacity: 0.50;
	opacity: .50;
	filter: alpha(opacity=50);
}
.anyClass2 li:hover img, .portfolio li:hover img {
	transform: scale(1.2);
	-ms-transform: scale(1.2);
	-webkit-transform: scale(1.2);
	-moz-opacity: 0.50;
	opacity: .50;
	filter: alpha(opacity=50);
}
.hover-fx .fLeft {
	position: absolute;
	top: -40%;
	left: 35%;
	background: #fff;
	background: rgba(255, 255, 255, 0.9);
	padding: 0;
	color: #525252;
	-webkit-border-radius: 100%;
	border-radius: 100%;
	height: 40px;
	width: 40px;
	display: block;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
.hover-fx .fRight {
	position: absolute;
	bottom: -40%;
	left: 48%;
	background: #fff;
	background: rgba(255, 255, 255, 0.9);
	padding: 0;
	color: #525252;
	-webkit-border-radius: 100%;
	border-radius: 100%;
	height: 40px;
	width: 40px;
	display: block;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
}
.hover-fx span {
	font-size: 16px;
	padding: 10px 0 0 12px;
	display: block;
}
.anyClass li:hover .fLeft, .portfolio li:hover .fLeft { top: 40% }
.anyClass li:hover .fRight, .portfolio li:hover .fRight { bottom: 37.8% }

.anyClass li.grid_3:hover .fLeft, .portfolio li.grid_3:hover .fLeft { top: 38% }

.anyClass li.grid_4:hover .fLeft, .portfolio li.grid_4:hover .fLeft { top: 43%;left: 37%; }
.anyClass li.grid_4:hover .fRight, .portfolio li.grid_4:hover .fRight { bottom: 40%;left: 47%; }

.anyClass li.grid_6:hover .fLeft, .portfolio li.grid_6:hover .fLeft { top: 45%;left: 40%; }
.anyClass li.grid_6:hover .fRight, .portfolio li.grid_6:hover .fRight { bottom: 43.5%;left: 47%; }

.anyClass1 li:hover .fLeft, .portfolio li:hover .fLeft { top: 40% }
.anyClass1 li:hover .fRight, .portfolio li:hover .fRight { bottom: 37.8% }

.anyClass1 li.grid_3:hover .fLeft, .portfolio li.grid_3:hover .fLeft { top: 38% }

.anyClass1 li.grid_4:hover .fLeft, .portfolio li.grid_4:hover .fLeft { top: 43%;left: 37%; }
.anyClass1 li.grid_4:hover .fRight, .portfolio li.grid_4:hover .fRight { bottom: 40%;left: 47%; }

.anyClass1 li.grid_6:hover .fLeft, .portfolio li.grid_6:hover .fLeft { top: 45%;left: 40%; }
.anyClass1 li.grid_6:hover .fRight, .portfolio li.grid_6:hover .fRight { bottom: 43.5%;left: 47%; }

.anyClass2 li:hover .fLeft, .portfolio li:hover .fLeft { top: 40% }
.anyClass2 li:hover .fRight, .portfolio li:hover .fRight { bottom: 37.8% }

.anyClass2 li.grid_3:hover .fLeft, .portfolio li.grid_3:hover .fLeft { top: 38% }

.anyClass2 li.grid_4:hover .fLeft, .portfolio li.grid_4:hover .fLeft { top: 43%;left: 37%; }
.anyClass2 li.grid_4:hover .fRight, .portfolio li.grid_4:hover .fRight { bottom: 40%;left: 47%; }

.anyClass2 li.grid_6:hover .fLeft, .portfolio li.grid_6:hover .fLeft { top: 45%;left: 40%; }
.anyClass2 li.grid_6:hover .fRight, .portfolio li.grid_6:hover .fRight { bottom: 43.5%;left: 47%; }


.fLeft:hover, 
.fRight:hover {
	background: #191919;
	color: #fff;
	z-index: 999;
}

.box {
	cursor: pointer;
	position: relative;
	overflow: hidden;
}
.box h3 {
	color: #fff
}
.box img {
	position: absolute;
	left: 0;
	-webkit-transition: all 300ms ease-out;
	transition: all 300ms ease-out;
}
.box .caption {
	position: absolute;
	color: #fff;
	z-index: 100;
	-webkit-transition: all 300ms ease-out;	
	transition: all 300ms ease-out;
	left: 0;
	width: 100%;
}
.box .simple-caption {
	background-color: rgba(0,0,0,0.8);
	width: 100%;
	display: block;
	bottom: -30px;
	line-height: 25pt;
	text-align: center;
	opacity: 0;
}
.innerPad {
	padding: 20px;
}
.box .full-caption {
	background-color: rgba(0,0,0,0.8);
	width: 100%;
	height: 100%;
	top: -200px;
	text-align: left;
	padding: 0;
	opacity:0;
}
.box .fade-caption  {
	background-color: rgba(0,0,0,0.8);
	opacity: 0;
	width: 100%;
	height: 100%;
	text-align: left;
	padding: 0;
}
.box .slide-caption {
	width: 100%;
	height: 100%;
	text-align: left;
	padding: 0;
	left: 200px;
	opacity:0;
}
#box-5.box .rotate-caption {
	width: 100%;
	height: 100%;	
	text-align: left;
	padding: 0;
	top: 0;
	-moz-transform: rotate(-180deg);
	-o-transform: rotate(-180deg);
	-webkit-transform: rotate(-180deg);
	transform: rotate(-180deg);
}
.box .rotate {
	width: 100%;
	height: 400px;
	-webkit-transition: all 300ms ease-out;
	-moz-transition: all 300ms ease-out;
	-o-transition: all 300ms ease-out;
	-ms-transition: all 300ms ease-out;	
	transition: all 300ms ease-out;
}
.box .rotate .caption {
	opacity:0;
}
.box .scale-caption h3, .box .scale-caption p {
	position: relative;
	left: -200px;
	opacity: 0;
	-webkit-transition: all 300ms ease-out;
	-moz-transition: all 300ms ease-out;
	-o-transition: all 300ms ease-out;
	-ms-transition: all 300ms ease-out;	
	transition: all 300ms ease-out;
}
.box .scale-caption h3 {
	-webkit-transition-delay: 300ms;
	-moz-transition-delay: 300ms;
	-o-transition-delay: 300ms;
	-ms-transition-delay: 300ms;	
	transition-delay: 300ms;
}
.box .scale-caption p {
	-webkit-transition-delay: 500ms;
	-moz-transition-delay: 500ms;
	-o-transition-delay: 500ms;
	-ms-transition-delay: 500ms;	
	transition-delay: 500ms;
}
.box:hover .simple-caption {
	bottom: 0;
	opacity: 1;
}
.box:hover .full-caption {
	top:0;
	opacity: 1;
}
.box:hover .fade-caption, .box:hover .scale-caption  {
	opacity: 1;
}
.box:hover .slide-caption {
	background-color: #000 !important;
	left:0;
	opacity: 1;
}
.box:hover img#image-4 {
	-moz-transform: translateX(-100%);
	-o-transform: translateX(-100%);
	-webkit-transform: translateX(-100%);
	transform: translateX(-100%);
	opacity: 1;
}
.box:hover .rotate {
	background-color: rgba(0,0,0,1) !important;
	-moz-transform: rotate(-180deg);
	-o-transform: rotate(-180deg);
	-webkit-transform: rotate(-180deg);
	transform: rotate(-180deg);
}
.box:hover .caption {
	opacity:1;
}
.box:hover #image-6 {
	-moz-transform: scale(1.4);
	-o-transform: scale(1.4);
	-webkit-transform: scale(1.4);
	transform: scale(1.4);
}
.box:hover .scale-caption h3, .box:hover .scale-caption p {
	left: 0;
	opacity: 1;
}
.box:hover .scale-caption {
	height: 100%;
	background-color: rgba(0,0,0,0.8);
}
.box .zoom-caption {
	opacity: 0;
	-webkit-transform: scale(0.1);
	transform: scale(0.1);
	height: 100%;
	width: 100%;
}
.box .revzoom-caption {
	opacity: 0;
	-webkit-transform: scale(4);
	transform: scale(4);
	height: 100%;
	width: 100%;
}
.box:hover .zoom-caption, .box:hover .revzoom-caption {
	background: #000;
	background: rgba(0, 0, 0, 0.77);
	opacity: 1;
	-webkit-transform: scale(1);
	transform: scale(1);
}


/*	Footer
----------------------------------------------------------------------*/
#footer {
	background: #003;
	padding: 50px;
	color: #bfbfbf;
	border-bottom: 5px solid #101010;
}
#footer hr {
	background: #0C0C0C;
	box-shadow: 0px 1px 0 rgba(255, 255, 255, 0.07);
	margin: 10px 0;
}
#footer .col-title {
	font-size: 14px;
	font-weight: normal;
}
.footer-last {
	background: #003;
	padding: 15px 0 !important;
	width:100%;
	align-center:100%;
}
.copyright {
	float: left;
	padding: 0 20px;
	color: #696969;
}



/* =Forms
-------------------------------------------------------------- */

#bbpress-forums fieldset.bbp-form {
	clear: left;
}

#bbpress-forums fieldset.bbp-form {
	border: 1px solid #eee;
	padding: 10px 20px;
	margin-bottom: 10px;
}

#bbpress-forums fieldset.bbp-form legend {
	padding: 5px;
}

#bbpress-forums fieldset.bbp-form label {
	margin: 0;
	font-weight:bold;
	display: inline-block;
}

#bbp-edit-topic-tag.bbp-form fieldset.bbp-form label,
#bbp-login fieldset label,
#bbp-register fieldset label,
#bbp-lost-pass fieldset label {
	width: 100px;
}

#bbpress-forums fieldset.bbp-form p,
#bbpress-forums fieldset.bbp-form textarea,
#bbpress-forums fieldset.bbp-form select,
#bbpress-forums fieldset.bbp-form input {
	margin: 0 0 8px;
}

textarea#bbp_reply_content,
textarea#bbp_topic_content,
textarea#bbp_forum_content {
	width: 97%;
	box-sizing: border-box;
}

textarea#bbp_forum_content {
	height: 210px;
}

#bbpress-forums fieldset.bbp-forum-form-attributes {
	width: 200px;
	float: right;
	clear: none;
	margin-left: 25px;
}





/*	IE
----------------------------------------------------------------------*/
.ie8 .accordion-head p, .ie8 .toggle-head p {margin-bottom: 0}
.ie8 .testimonial p {font-family: tahoma}
td .avatar {width: 20px;height: 20px}
.ie8 .modern-slider img, .ie8 .modern-slider {max-width: auto;width: auto}


/* #Tablet (Landscape)
----------------------------------------------------------------------*/
@media only screen and (min-width: 959px) and (max-width: 1177px) {
	body {overflow-x: hidden;font-size: 12px}
	.boxed, .boxed-margin, body[class^="frame_"] .full, body[class^="frame_"] .boxed, body[class^="frame_"] .boxed-margin {width: 96%;margin: 0 auto !important}
	.anyClass li {width:30% !important;height:400px !important}
.anyClass1 li {width:18% !important; height:350px !important}
.anyClass2 li {width:30% !important; height:auto !important}
}

/* #Tablet (Portrait)
----------------------------------------------------------------------*/
@media only screen and (min-width: 768px) and (max-width: 959px) {
	body {overflow-x: hidden; font-size: 12px}
	.boxed, .boxed-margin, body[class^="frame_"] .full, body[class^="frame_"] .boxed, body[class^="frame_"] .boxed-margin {width: 100%;margin: 0 !important}
	.grid_9 {width: 100%;}
	.grid_3, .grid_6 {width: 100%;margin: 0 0 40px}
	.copyright {float: none;display: table;margin: 0 auto 20px}
	.foot-menu {float: none;text-align: center;display: table;margin: 0 auto 0}
	.foot-menu li {float: none;display: inline-block}
	.grid_2 {width: 48%;}
	.portfolio li {width: 47%}
	.anyClass li {width: 48% !important;height: 350px !important}
	.anyClass li:hover .fRight, .portfolio li:hover .fRight {bottom: 40%}
	.anyClass li:hover .fLeft, .portfolio li:hover .fLeft {top: 43%}
	.anyClass1 li {width: 48% !important;height: 350px !important}
	.anyClass1 li:hover .fRight, .portfolio li:hover .fRight {bottom: 40%}
	.anyClass1 li:hover .fLeft, .portfolio li:hover .fLeft {top: 43%}
	.anyClass2 li {width: 48% !important;height: 350px !important}
	.anyClass2 li:hover .fRight, .portfolio li:hover .fRight {bottom: 40%}
	.anyClass2 li:hover .fLeft, .portfolio li:hover .fLeft {top: 43%}
	.hover-fx .fLeft {left: 38%}
}

/* #Mobile (Landscape)
----------------------------------------------------------------------*/
@media only screen and (min-width: 480px) and (max-width: 767px) {
	body {overflow-x: hidden; font-size: 12px}
	.boxed, .boxed-margin, body[class^="frame_"] .full, body[class^="frame_"] .boxed, body[class^="frame_"] .boxed-margin {width: 100%;margin: 0 !important}
	.grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12, .action-one .action-t {width: 100%;margin: 0 0 30px}
	.logo {float: none;margin: 0px auto;width: 200px}
	.info {float: none !important;margin: 4px auto !important;display: table}
	.head {padding: 10px 0}
	.copyright {float: none;display: table;margin: 0 auto 20px;text-align: center}
	.foot-menu {float: none;display: table;text-align: center;margin: 0 auto 0}
	.foot-menu li {float: none;display: inline-block}
	.animated {opacity:1}
	.anyClass li {width:45% !important; height:500px !important}
	.anyClass li:hover .fRight, .portfolio li:hover .fRight {bottom: 42%}
	.anyClass li:hover .fLeft, .portfolio li:hover .fLeft {top: 43%}
	.anyClass1 li {width:45% !important; height:350px !important}
	.anyClass1 li:hover .fRight, .portfolio li:hover .fRight {bottom: 42%}
	.anyClass1 li:hover .fLeft, .portfolio li:hover .fLeft {top: 43%}
	.anyClass2 li {width:45% !important; auto !important}
	.anyClass2 li:hover .fRight, .portfolio li:hover .fRight {bottom: 42%}
	.anyClass2 li:hover .fLeft, .portfolio li:hover .fLeft {top: 43%}
	.hover-fx .fLeft {left: 38%}
	.dc { width:250px; height:200px;}
}

/*  #Mobile (Portrait) 320px
----------------------------------------------------------------------*/
@media only screen and (min-width: 100px) and (max-width: 479px) {
	body {overflow-x: hidden; font-size: 12px}
	.boxed, .boxed-margin, body[class^="frame_"] .full, body[class^="frame_"] .boxed, body[class^="frame_"] .boxed-margin {width: 100%;margin: 0 !important}
	.grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12, .action-one .action-t {width: 100%;margin: 0 0 30px}
	.logo {float: none;margin: 0px auto;width: 200px}
	.header_v2 .logo {float: left;margin: 10px auto}
	.head {padding: 10px 0}
	.copyright {float: none;display: table;margin: 0 auto 20px;text-align: center}
	.foot-menu {float: none;display: table;text-align: center;margin: 0 auto 0}
	.foot-menu li {float: none;display: inline-block}
	.animated {opacity:1}
	.anyClass li {width:90% !important;height: auto !important}
	.anyClass li:hover .fLeft, .portfolio li:hover .fLeft {top: 42%}
	.anyClass1 li {width:90% !important;height: auto !important}
	.anyClass1 li:hover .fLeft, .portfolio li:hover .fLeft {top: 42%}
	.anyClass2 li {width:90% !important;height: auto !important}
	.anyClass2 li:hover .fLeft, .portfolio li:hover .fLeft {top: 42%}
	.dc { width:250px; height:200px;}
}