/* -----  Google Font  -----*/
@import url('https://fonts.googleapis.com/css?family=Roboto:200,300,400,500,700,900');
/* =====  INDEX OF STYLES ===== */
/*

===== BASIC STYLE =====
  + General 
  + Typography   
  + Spacing    
  + Button
  + Input       
      
===== HEADER ===== 
  + Header
  + Navbar

===== CONTANT =====
  + Banner
  + Breadcrumb
  + Portfolio
  + Blog
  + Client
  + About Us Page
  + Team
  + pricing
  + Contact Us
  

===== FOOTER =====


*/

/* =====  GENERAL STYLE =====*/

body, html {
	height: 100%;
	margin: 0;
	padding: 0;
}
body {
	line-height: 24px;
	color: #000;
	font-size: 14px;
	font-family: 'Roboto', sans-serif;
	font-weight: 400;
	letter-spacing: 1px;
}
.loder {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	background: url(../images/loder.gif) center no-repeat #fff;
}
/* =====  scroll top  ===== */

.scroll-top {
    bottom: 40px;
    position: fixed;
    right: 40px;
}
.scroll-top .scrolltop {
    background: #3060AC none repeat scroll 0 0;
    cursor: pointer;
    display: none;
    padding: 8px 15px;
}
.scroll-top .scrolltop::before {
    color: #ffffff;
    content: "";
    font-family: "FontAwesome";
    font-size: 18px;
}
/* =====  scroll top end  ===== */

::-moz-selection {
 background-color: #1A1A1A;
 color: #FFF;
}
::selection {
	background-color: #1A1A1A;
	color: #FFF;
}
img {
	height: auto;
	max-width: 100%;
	border: none;
	outline: none;
	transition: all 0.4s ease 0s;
	-moz-transition: all 0.4s ease 0s;
	-webkit-transition: all 0.4s ease 0s;
	-o-transition: all 0.4s ease 0s;
}
ul li {
	list-style: none;
}
br {
	font-size: 0;
	line-height: 0;
}
hr {
	margin-bottom: 0px;
	margin-top: 0px;
	border-top: 1px solid #000;
	border-bottom: none;
	border-left: none;
	border-right: none;
}
ul {
	list-style: none;
	padding-left: 0px;
	margin-bottom: 0;
}
.bg-gray {
	background: #f7f7f7;
}
.bg-dark-gray{
	background:#ededed;
}
.bg-dark {
	background: #000000;
	color:#fff;
}
.bg-light {
	background: #ffffff;
}
/* =====  TYPOGRAPHY =====*/
a {
	cursor: pointer;
	text-decoration: none;
	color: #999999;
	transition: all 0.25s ease 0s;
	-moz-transition: all 0.25s ease 0s;
	-webkit-transition: all 0.25s ease 0s;
	-o-transition: all 0.25s ease 0s;
}
a:hover {
	color: #000;
	text-decoration: none;
	transition: all 0.25s ease 0s;
	-moz-transition: all 0.25s ease 0s;
	-webkit-transition: all 0.25s ease 0s;
	-o-transition: all 0.25s ease 0s;
}
a:hover, a:focus{	color: #000000;
}
a:hover {
	text-decoration: none;
	color: #000000;
}
a, a:focus, a:active, a:link, img {
	outline: none;
	text-decoration: none;
}
p {
	margin: 0;
	padding: 0;
}
h1, h2, h3, h4, h5, h6, h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
	color: #000;
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
	margin-top: 0px;
	margin-bottom: 0px;
}
h1 {
	font-size: 36px;
	line-height: 42px;
}
h2 {
	font-size: 30px;
	line-height: 36px;
}
h3 {
	font-size: 22px;
	line-height: 22px;
}
h4 {
	font-size: 18px;
	line-height: 18px;
}
h5 {
	font-size: 16px;
	line-height: 16px;
}
h6 {
	font-size: 14px;
	line-height: 14px;
}
.uppr{
	text-transform:uppercase;
}
.lower{
	text-transform:lowercase;
}
.capitalize{
	text-transform:capitalize;
}
/* =====  SPACING =====*/

.no-margin {
	margin: 0;
}
/* =====  margin top  ===== */

.mt_10 {
	margin-top: 10px;
}
.mt_20 {
	margin-top: 20px;
}
.mt_30 {
	margin-top: 30px;
}
.mt_40 {
	margin-top: 40px;
}
.mt_50 {
	margin-top: 50px;
}
.mt_60 {
	margin-top: 60px;
}
.mt_70 {
	margin-top: 70px;
}
.mt_80 {
	margin-top: 80px;
}
.mt_90 {
	margin-top: 90px;
}
.mt_100 {
	margin-top: 100px;
}
/* =====  margin bottom  ===== */

.mb_10 {
	margin-bottom: 10px;
}
.mb_20 {
	margin-bottom: 20px;
}
.mb_30 {
	margin-bottom: 30px;
}
.mb_40 {
	margin-bottom: 40px;
}
.mb_50 {
	margin-bottom: 50px;
}
.mb_60 {
	margin-bottom: 60px;
}
.mb_70 {
	margin-bottom: 70px;
}
.mb_80 {
	margin-bottom: 80px;
}
.mb_90 {
	margin-bottom: 90px;
}
.mb_100 {
	margin-bottom: 100px;
}
/* =====  margin top bottom ===== */
.mtb_10 {
	margin: 10px 0;
}
.mtb_20 {
	margin: 20px 0;
}
.mtb_30 {
	margin: 30px 0;
}
.mtb_40 {
	margin: 40px 0;
}
.mtb_50 {
	margin: 50px 0;
}
.mtb_60 {
	margin: 60px 0;
}
.mtb_70 {
	margin: 70px 0;
}
.mtb_80 {
	margin: 80px 0;
}
.mtb_90 {
	margin: 90px 0;
}
.mtb_100 {

	margin: 100px 0;
}
/* =====  padding  ===== */

.no-padding {
	padding: 0;
}
/* =====  padding top ===== */
.pt_10 {
	padding-top: 10px;
}
.pt_20 {
	padding-top: 20px;
}
.pt_30 {
	padding-top: 30px;
}
.pt_40 {
	padding-top: 40px;
}
.pt_50 {
	padding-top: 50px;
}
.pt_60 {
	padding-top: 60px;
}
.pt_70 {
	padding-top: 70px;
}
.pt_80 {
	padding-top: 80px;
}
.pt_90 {
	padding-top: 90px;
}
.pt_100 {
	padding-top: 100px;
}
/* =====  padding bottom ===== */
.pb_10 {
	padding-bottom: 10px;
}
.pb_20 {
	padding-bottom: 20px;
}
.pb_30 {
	padding-bottom: 30px;
}
.pb_40 {
	padding-bottom: 40px;
}
.pb_50 {
	padding-bottom: 50px;
}
.pb_60 {
	padding-bottom: 60px;
}
.pb_70 {
	padding-bottom: 70px;
}
.pb_80 {
	padding-bottom: 80px;
}
.pb_90 {
	padding-bottom: 90px;
}
.pb_100 {
	padding-bottom: 100px;
}
/* =====  padding top bottom ===== */
.ptb_10 {
	padding: 10px 0;
}
.ptb_20 {
	padding: 20px 0;
}
.ptb_30 {
	padding: 30px 0;
}
.ptb_40 {
	padding: 40px 0;
}
.ptb_50 {
	padding: 50px 0;
}
.ptb_60 {
	padding: 60px 0;
}
.ptb_70 {
	padding: 70px 0;
}
.ptb_80 {
	padding: 80px 0;
}
.ptb_90 {
	padding: 90px 0;
}
.ptb_100 {
	padding: 100px 0;
}
/* =====  button  =====*/
.btn-link {
	color: #000;
	text-transform: uppercase;
	border-bottom: 1px solid;
	padding: 0 0 10px;
	letter-spacing: 0;
}
.btn-link:hover, .btn-link:focus, .btn-link.light:hover, .btn-link.light:focus {
	color: #999999;
	text-decoration: none;
	border-bottom: 1px solid;
}
.btn-link.light {
	color: #fff;
	border-bottom: 1px solid;
	padding: 0 0 10px;
}
/* =====  Inputs  =====*/
input[type="text"], input[type="email"], input[type="tel"], input[type="number"], input[type="password"], input[type="radio"], input[type="checkbox"],input[type="file"], textarea, select {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-color: #ddd;
    border-image: none;
    border-radius: 0;
    border-style: solid;
    border-width: 0 0 1px;
	background-color:transparent;
    color: #888;
    display: inline-block;
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 1px;
    margin:0 0 30px;
    outline: medium none;
    transition: all 0.2s ease 0s;
	padding:10px 0;

}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #000;
  opacity:1
}
::-moz-placeholder { /* Firefox 19+ */
  color: #000;
  opacity:1
}
:-ms-input-placeholder { /* IE 10+ */
  color: #000;
  opacity:1
}
:-moz-placeholder { /* Firefox 18- */
  color: #000;
  opacity:1
}
input:focus,textarea:focus{
    border-color: #000;
	
}
.full-with-form {
    width: 100%;
	max-width:100%;
}
/*.input-group input {
  width: 100%;
  color: white;
  border: none;
  outline: none;
  padding: 5px 0;
  line-height: 1;
  font-size: 16px;
  font-family: 'Raleway';
  border-bottom: solid 1px white;
  background-color: transparent;
  -webkit-transition: box-shadow 0.2s ease-in;
  -moz-transition: box-shadow 0.2s ease-in;
  -ms-transition: box-shadow 0.2s ease-in;
  -o-transition: box-shadow 0.2s ease-in;
  transition: box-shadow 0.2s ease-in;
}


input + label ,textarea + label{
  left: 15px;
  position: absolute;
  pointer-events: none;
  -webkit-transition: all 0.2s ease-in;
  -moz-transition: all 0.2s ease-in;
  -ms-transition: all 0.2s ease-in;
  -o-transition: all 0.2s ease-in;
  transition: all 0.2s ease-in;
}

input:focus + label, input.active + label, textarea:focus + label, textarea:active + label{
  font-size: 12px;
  -webkit-transform: translateY(-20px);
  -moz-transform: translateY(-20px);
  -ms-transform: translateY(-20px);
  -o-transform: translateY(-20px);
  transform: translateY(-20px);
}*/

/* =====  HEADER CSS START =====*/

/* ===== Header Style ===== */
header {
	background: #fff none repeat scroll 0 0;
	width: 100%;
	z-index: 1;
}
#header.top-fix {
	transition: 2s;
}
.top-fix {
	position: fixed;
	width: 100%;
	top:0;
}

/* ===== Navbar Style ===== */

.navbar-header .navbar-brand {
	height: auto;
/*	padding: 26px 0;*/
	margin-top: 0 !important;
	margin-left: 0 !important;
}
.navbar {
	margin-bottom: 0;
}

/* ===== Search Style ===== */
.search-box {
	position: relative;
	top: 24px;
}
.search-box input.input-text {
	border: 1px solid #CCC;
	width: 0;
	opacity: 0;
	padding: 6px;
	margin-top: -5px;
	position: absolute;
	right: 0;
	transition: all 0.4s ease 0s;
	-moz-transition: all 0.4s ease 0s;
	-webkit-transition: all 0.4s ease 0s;
	-o-transition: all 0.4s ease 0s;
}
.search-box:hover input.input-text, .search-box input.input-text:focus {
	width: 250px;
	opacity: 1;
}
.search-box button.search-btn {
	background: url("../images/sprite.png") no-repeat scroll 0px 0px transparent;
	border: none;
	height: 30px;
	width: 25px;
	position: relative;
	right: 0;
	top: 6px;
}
.search-box button.search-btn:hover {
	background-position: 0 -30px;
}
.header-search .search-box input {
    background-color: #fff;
}
/* =====  HEADER CSS END =====*/



/* =====  CONTANT CSS START =====*/

/* =====  Babnner CSS  ===== */
.banner {
	position: relative;
}
.banner-detail {
	left: 0;
	position: absolute;
	top: 30%;
	width: 100%;
	text-align: center;
}
.cd-intro {
	text-align: center;
}
.cd-headline {
	font-size: 30px;
	line-height: 1.2;
	color: #fff;
}
.cd-words-wrapper {
	display: inline-block;
	position: relative;
	text-align: left;
}
.cd-words-wrapper b {
	display: inline-block;
	position: absolute;
	left: 0;
	top: 0;
}
.cd-words-wrapper b.is-visible {
	position: relative;
}
.cd-headline.type .cd-words-wrapper {
	vertical-align: top;
	overflow: hidden;
}
.cd-headline.type .cd-words-wrapper::after {
	/* vertical bar */
	content: '';
	position: absolute;
	right: 0;
	top: 50%;
	bottom: auto;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	height: 90%;
	width: 2px;
	background-color: #fff;
}
.cd-headline.type .cd-words-wrapper.waiting::after {
	-webkit-animation: cd-pulse 1s infinite;
	-moz-animation: cd-pulse 1s infinite;
	animation: cd-pulse 1s infinite;
}
.cd-headline.type .cd-words-wrapper.selected {
	background-color: #fff;
}
.cd-headline.type .cd-words-wrapper.selected::after {
	visibility: hidden;
}
.cd-headline.type .cd-words-wrapper.selected b {
	color: #0d0d0d;
}
.cd-headline.type b {
	visibility: hidden;
}
.cd-headline.type b.is-visible {
	visibility: visible;
}
.cd-headline.type i {
	position: absolute;
	visibility: hidden;
	font:inherit;

}
.cd-headline.type i.in {
	position: relative;
	visibility: visible;
}
@media only screen and (min-width: 320px) {
.cd-headline {
	font-size: 14px;
	font-weight: 200;
	text-transform: uppercase;
}
}
@media only screen and (max-width: 320px) {
.banner-detail {
	top: 18%;
}
}
@media only screen and (min-width: 480px) {
.cd-headline {
	font-size: 22px;
	font-weight: 200;
}
}
@media only screen and (min-width: 768px) {
.cd-headline {
	font-size: 36px;
	font-weight: 200;
}
}
@media only screen and (min-width: 1170px) {
.cd-headline {
	font-size: 50px;
	text-transform: uppercase;
}
}
 @-webkit-keyframes cd-pulse {
 0% {
 -webkit-transform: translateY(-50%) scale(1);
 opacity: 1;
}
 40% {
 -webkit-transform: translateY(-50%) scale(0.9);
 opacity: 0;
}
 100% {
 -webkit-transform: translateY(-50%) scale(0);
 opacity: 0;
}
}
@-moz-keyframes cd-pulse {
 0% {
 -moz-transform: translateY(-50%) scale(1);
 opacity: 1;
}
 40% {
 -moz-transform: translateY(-50%) scale(0.9);
 opacity: 0;
}
 100% {
 -moz-transform: translateY(-50%) scale(0);
 opacity: 0;
}
}
@keyframes cd-pulse {
 0% {
 -webkit-transform: translateY(-50%) scale(1);
 -moz-transform: translateY(-50%) scale(1);
 -ms-transform: translateY(-50%) scale(1);
 -o-transform: translateY(-50%) scale(1);
 transform: translateY(-50%) scale(1);
 opacity: 1;
}
 40% {
 -webkit-transform: translateY(-50%) scale(0.9);
 -moz-transform: translateY(-50%) scale(0.9);
 -ms-transform: translateY(-50%) scale(0.9);
 -o-transform: translateY(-50%) scale(0.9);
 transform: translateY(-50%) scale(0.9);
 opacity: 0;
}
 100% {
 -webkit-transform: translateY(-50%) scale(0);
 -moz-transform: translateY(-50%) scale(0);
 -ms-transform: translateY(-50%) scale(0);
 -o-transform: translateY(-50%) scale(0);
 transform: translateY(-50%) scale(0);
 opacity: 0;
}
}

/* ===== End Banner CSS ===== */


/* ===== Breadcrumb CSS Start===== */

.breadcrumb{
   	/*background-image:url("../images/banner.jpg");*/
	border-radius:0;
}
.breadcrumb li {
    display: inline-block;
}

.breadcrumb li.active {
    color: #fff;
}
.breadcrumb h1 {
    color: #fff;
    font-size: 38px;
    font-weight: 800;
}
.breadcrumb li{
	font-size:20px;
	font-weight:300;
}


.breadcrumb li::after {
    content: "/";
    display: inline-block;
    height: 15px;
    margin: 0 ;
    width: 30px;
	color:#fff;
}
.breadcrumb li:last-child::after {
    content: "";
    display: inline-block;
    height: 15px;
    margin: 0;
    width: auto;
}
.breadcrumb li a:hover{
	color:#fff!important;
}
/* ===== End Breadcrumb CSS ===== */


/* ===== Portfolio css ===== */
.main_title {
	display: inline-block;
	font-weight: bold;
	text-transform: uppercase;
	color: #000;
}
.project-title{
    color: #fff;
}
.portfolio-filter.nav.navbar-nav {
	float: none;
}
.nav > li > a:hover, .nav > li > a:focus {
	background: #fff;
}

.tab-bar ul {
	list-style: none;
	text-align: center;
	display: inline-block;
}
.tab-bar ul li {
	display: block;
}
.tab-bar ul li a {
	padding: 5px 15px;
}
.tab-bar ul li.active a, .tab-bar ul li:hover a {
	color: #000000;
}
.isotope {
	display: inline-block;
	width: 100%;
}
.grid {
	margin: 0 -15px;
}
.grid-item{
	display: block;
	position: relative;
	padding: 15px;
}
.grid-item a {
	background: #6b6b6b;
	overflow: hidden;
	display: block;
	position: relative;
}
.four-col-work .grid-item, .fout-col-blog .blog-item {
	width: 25%;
	min-height: 1px;
}

.three-col-work .grid-item, .three-col-blog .blog-item {
	width: 32.9%;
	min-height: 1px;
}

.two-col-work .grid-item, .two-col-blog .blog-item {
	width: 50%;
	min-height: 1px;
}
.three-col-blog,.two-col-blog,.four-col-work,.three-col-work,.two-col-work {
    display: inline-block;
}
.grid .two-col-work .grid-item,.grid .three-col-work .grid-item,.grid .four-col-work .grid-item {
    float: left;
    position: relative;
}
.isotope .grid-item.filtered {
	-moz-transform: scale(0);
	-ms-transform: scale(0);
	transform: scale(0);
	opacity: 0;
	filter: alpha(opacity=0);
}
.grid-item a:hover img {
	opacity: 0.6;
	filter: alpha(opacity=60);
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-ms-transform: scale(1.1);
	transform: scale(1.1);
}
.grid-item .work-detail {
	position: absolute;
	text-align: center;
	width: 100%;
	bottom: -40px;
	opacity: 0;
	transition: all 0.4s ease-in-out 0s;
	-webkit-transition: all 0.4s ease-in-out 0s;
	-moz-transition: all 0.4s ease-in-out 0s;
	-o-transition: all 0.4s ease-in-out 0s;
}
.grid-item a:hover .work-detail {
	opacity: 1;
	bottom: 20px;
}

#portfolio .isotope, #portfolio .masonry-brick, #portfolio .grid-item img{
	max-width: 100%;
	transition: all 0.4s ease-in-out 0s;
	-webkit-transition: all 0.4s ease-in-out 0s;
	-moz-transition: all 0.4s ease-in-out 0s;
	-o-transition: all 0.4s ease-in-out 0s;
}


.two-col-work .grid-item > a ,.three-col-work .grid-item > a ,.four-col-work .grid-item > a {
    position: relative;
}

/* =====  End Portfolio css  ===== */

/* =====  Blog css  ===== */

.post-type {
    background: rgba(255, 255, 255, 0.50) none repeat scroll 0 0;
    color: #000;
    cursor: default;
    font-size: 20px;
    height: 40px;
    left: 25px;
    line-height: 40px;
    position: absolute;
    text-align: center;
    top: 10px;
    width: 40px;
}
.blog .date i {
    margin-right: 10px;
}
/* =====  Single Blog css  ===== */
article, .author {
    display: inline-block;
	width:100%;
}
.author-avatar,.comment-avatar {
    float: left;
    margin-right: 20px;
    width: 80px;
}
.author-name {
    display: inline-block;
    margin-top: 0;
}
blockquote{
	border-color:#000;	
	}

/* =====  End Single Blog css  ===== */

/* =====  End Blog css  ===== */

/* =====  Client css  ===== */
#client .type-01 {
	margin: 0 20px;
}
.client .owl-nav {
	position: absolute;
	top: 0;
	width: 100%;
}
.client .owl-nav > div {
	height: 300px;
	width: 300px;
	font-size: 0px;
	position: absolute;
}
.client .owl-nav .owl-next {
	cursor: url(../images/right_arrow.png), auto !important;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.client .owl-nav .owl-prev {
	cursor: url(../images/left_arrow.png), auto !important;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.client .owl-nav .owl-prev {
	left: -200px;
}
.client .owl-nav .owl-next {
	right: -200px;
}
.client .type-01 h2 {
	margin-left: 30px;
	margin-right: 30px;
}
.client .fa.fa-quote-left {
	color: #ccc;
	font-size: 50px;
}
.client-designation {
	display: inline-block;
}
.client-title strong {
	color: #000;
}
/* =====  End Client css  ===== */

/* =====  Aboutus css  ===== */
.about-heading {
    text-transform: uppercase;
	font-size:50px;
	font-weight:700;
	border-bottom:2px solid #000;
	display:inline-block;
}
.about-heading span {
	font-weight:300;
}
.about-text > p::first-letter {
    font-size: 18px;
    color: #000;
}
.about-text {
    margin: 0 40px;
}
/* =====  End Aboutus css  ===== */


/* =====  Team css  ===== */
.team .owl-nav {
	position: absolute;
	top: 0;
	width: 100%;
}
.team .owl-nav > div {
    font-size: 0;
    height: 360px;
    position: absolute;
    width: 200px;
}
.team .owl-nav .owl-next {
	cursor: url(../images/right_arrow.png), auto !important;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.team .owl-nav .owl-prev {
	cursor: url(../images/left_arrow.png), auto !important;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
.team .owl-nav .owl-prev {
	left: 0px;
}
.team .owl-nav .owl-next {
	right: 0px;
}
.team-detail{
	padding:0 15px;
}
.team-designation,.team-title {
    text-transform: uppercase;
}
.team .social > li,.team_grid .social > li {
    background: #dfdfdf none repeat scroll 0 0;
    border-radius: 50%;
    display: inline-block;
    height: 40px;
    margin: 0 5px;
    width: 40px;
}
.social li a i {
    margin: 12px;
}
.team-detail:hover .team-item-img {
    filter: grayscale(100%);
}
 
/* =====  End Team css  ===== */

/* =====  Pricing css  ===== */
.price {
    color: #000;
	font-weight:700;
	border-bottom: 1px solid #cccccc;
}
.plan li {
    border-bottom: 1px solid #ccc;
    padding: 10px 0;
}
.main-price {
    font-size: 50px;
    line-height: 40px;
}
sub, sup {
    font-size: 100%;
}
sup {
    top: -1.8em;
}
sub {
    bottom: 0em;
}

/* =====  End Pricing css  ===== */

/* =====  Contact us css  ===== */
.contact .fa {
    margin-right: 10px;
}

/* =====  End Contact us css  ===== */

#map {
        width: 100%;
        height: 400px;
        background-color: grey;
      }


/* =====  FOOTER CSS START=====*/

 
.footer {
	background: #1a1a1a;
	text-align: center;
}
.footer-logo a img {
	transition: all 0.4s ease-in-out 0s;
	-webkit-transition: all 0.4s ease-in-out 0s;
	-moz-transition: all 0.4s ease-in-out 0s;
	-o-transition: all 0.4s ease-in-out 0s;
}
.footer-logo a:hover img {
	-webkit-filter: grayscale(100%);
	filter: grayscale(100%);
	opacity: 0.3;
}
.footer-link li {
	display: inline-block;
}
.footer-link li a {
	border-left: 1px solid #808080;
	padding: 0 10px;
	display: inline-block;
	line-height: 1;
}
.footer-link li a:hover {
	color: #fff !important;
}
.footer-link li:first-child a {
	border: none;
}
.social_icon li {
	display: inline-block;
	height: 25px;
	width: 25px;
}
.social_icon ul li i.fa {
	background-color: transparent;
	font-size: 16px;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	-o-border-radius: 50px;
	border-radius: 50px;
	transition: all 0.4s ease-in-out 0s;
	-webkit-transition: all 0.4s ease-in-out 0s;
	-moz-transition: all 0.4s ease-in-out 0s;
	-o-transition: all 0.4s ease-in-out 0s;
}
.social_icon ul li a i.fa:hover {
	color: #fff;
}
/* =====  FOOTER CSS END=====*/


html{
	font-family: "DFKai-sb",
    "微軟正黑體", "Microsoft JhengHei";
}



.nav-logo{
	height: auto;
	width: 25%;
}

.top_banner{
	background-image: url(/images/NA5_3.png);
	background-size: cover;
}

.history li span{
	width: 10em;
    display: inline-block;
}

.history li a{
	width: 10em;
    display: inline-block;
    color: #000;
    cursor: none;
}

ul.history li{
	display: inline-block;
	list-style: none;
    margin-left: 20px;
    margin-bottom: 10px;
}

.about_gallery img{
	margin: 20px 0 20px 0;
}

.lang_btn img{
	width: 20px;
	height: 20px;
}

#menu > ul > li > .lang_btn_list{
	padding-right: 5px;
	padding-left: 5px;
}

#menu > ul >li > a.lang_btn{
	padding: 10px;
	padding-top: 32px;
	padding-right: 5px;
}

.contact_logo img{
	padding: 20px;
}

.contact_info{
	margin: 30px;
}

.copyright-part{
	color: #999;
}



.mp_img_row img{
	padding-left: 5px;
	padding-right: 5px;
	margin-bottom: 40px;
}

.mp_title_ch{
	margin-top: 40px;
}

.mp_title_en{
	margin-bottom: 10px;
}

.fa.fa-chevron-down{
	font-size: 50px;
}

.hs{
 position: relative;
}

.OR{
	position: absolute;
	left:50%;
	transform: translateX(-50%);
	top: 55px;
}

.lower-arroew{
	margin-top: -30px;
}

.contact_title{
	margin: 50px;
	margin-bottom: 20px;
}

.grid-item a img{
 background-color: #FFF;
}

img.net_spec{
	width: 40vw;
}

.trawl_net_bg{
	/*background: #94D6F5;*/
}

.slide_trawl{
	margin-top: 30px;
	margin-bottom: 30px;
}

.gill_net_bg{
	/*background: #94D6F5;*/
}

.slide_gill{
	margin-top: 30px;
	margin-bottom: 30px;
}

.pr_0{
	padding-right: 0px;
}

.pl_o{
	padding-left: 0px;
}

.down_argri{
	padding:40px;
}

.top_banner ul li a{
	color: #FFF;
}

#contact_body{
	margin-top: 40px;
}

.product_sidebar{
	margin-top: 30px;
}

.product_sidebar ul li{
	text-align: left;
	list-style: none;
	border-bottom: 1px dotted #b3b3b3; 
		
}

.product_sidebar ul li a{
	color: #000;
	display: block;
	padding-top: 10px;
	padding-bottom: 10px;
}

.product_sidebar{
	/*padding-top: 15px;*/
}

.product_sidebar ul li a:hover{
	background-color: #94D6F5;
	color: #FFF !important;
}



/*ul.product_sidebar_ul li{
	border-bottom: 1px dotted #b3b3b3; 
}
*/

ul.product_sidebar_ul li a:before{
	content: "■ ";
}

a.map_link{
	border-bottom: 1px solid;
    color: #FF0000 !important;
    background-color: #FFFF00;
    padding: 2px 3px 1px 3px;
}

a:hover.map_link{
	border-bottom: 1px solid;
    color: #FFFF00 !important;
    background-color: #FF0000;
    padding: 2px 3px 1px 3px;
}

p.enlarge_inst{
	color:#3060AC;
	padding-left: 15px;
}

.navbar-brand {
    padding: 15px 0px;
}



 
 
/* =====  RESPONSIVE CSS START  =====*/ 

@media (min-width: 1200px) {
.container {
	width: 1200px;
}
}
/*-----------------------------------*/

@media (max-width:1199px) {
.four-col-work .grid-item {
	width: 33.33%;
}
}
 @media (min-width: 992px) and (max-width: 1199px) {
.about-title {
	font-size: 40px;
	line-height: 55px;
}
}
/*----------------------------------*/

@media (max-width:991px) {
.center-md {
	text-align: center !important;
}
.client .owl-nav .owl-prev {
	left: 0px;
}
.client .owl-nav .owl-next {
	right: 0px;
}
.about-title {
	font-size: 30px;
	line-height: 45px;
}
.team-part {
	margin: 0 auto;
	max-width: 572px;
	text-align: center;
}
.three-col-work .grid-item, .three-col-blog .blog-item, .four-col-work .grid-item {
	width: 50%;
}
.newslatter-big input {
	width: 280px;
}
}
/*-----------------------------------*/
	
@media (min-width: 768px) and (max-width: 991px) {
}
/*-----------------------------------*/
	
@media (max-width: 767px) {
.portfolio-filter.nav.navbar-nav {
	display: inline;
}
.portfolio-filter.nav.navbar-nav > li {
	background: #f5f5f5 none repeat scroll 0 0;
	margin: 2px 0;
}
.mt-xs-30 {
	margin-top: 30px;
}
.mb-xs-30 {
	margin-bottom: 30px;
}
.mtb-xs-30 {
	margin: 30px 0;
}
.center-sm {
	text-align: center !important;
}
.heading {
	font-size: 24px;
}
.main_title {
	font-size: 22px;
}
.story_detail_part {
	text-align: center;
	max-width: 100%;
	padding-right: 15px;
	padding-left: 15px;
}
.tab-bar ul li a {
	padding: 5px 15px;
}
.about-title {
	line-height: 35px;
	margin-bottom: 20px;
}
.about-detail {
	margin-top: 30px;
}
.client-detail p {
	font-size: 16px;
	line-height: 25px;
}
.team-item {
	display: inline-block;
}
.customNavigation .btn.next {
	right: 0px;
}
.customNavigation .btn.prev {
	left: 0px;
}
.error-block {
	min-height: 885px;
}
.error-block-detail .main-error-text {
	font-size: 220px;
	line-height: 180px;
}
.three-col-work .grid-item, .three-col-blog .blog-item, .two-col-work .grid-item, .two-col-blog .blog-item, .four-col-work .grid-item {
	width: 100%;
}
.error-slogan {
	font-size: 24px;
}
.nav-tabs {
	margin-bottom: 10px;
	border-bottom: none;
}
.nav-tabs > li {
	margin-bottom: 5px;
	float: none;
}
.product-detail-tab .nav > li > a {
	border: 1px solid #dddddd;
	background: #fff;
}
#tabs .nav-tabs > li a.selected {
	background: #eeeeee;
	position: relative;
}
#tabs .nav-tabs > li a.selected:after {
}
.Description, .items-Product-Tags, .items-Reviews {
	border-top: 1px solid #eaeaea;
}

.navbar-brand{
	display: none;
}




















}
/*-----------------------------------*/

@media (max-width:650px) {
.without-background {
	padding-top: 51px;
}
.logo {
	margin-left: 50px;
}
.logo a {
	padding: 10px 0 10px 10px;
}
.round-icon {
	margin-top: 8px;
}
.header_right > ul > li > a {
	padding: 15px;
}
.sidebar {
	top: 51px;
}
.search-box .close-btn {
	top: 12px;
}
.top-search-bar {
	padding-left: 51px;
}
.text-slider ul li > p {
	font-size: 30px;
	line-height: 50px;
}
.text-slider {
	width: 130px;
}
.banner-logo > img {
	height: 40px;
}
.work-single img {
	max-height: 100%;
}
.error-small-text {
	font-size: 28px;
}
}


















/*-----------------------------------*/

@media (max-width:480px) {
.error-block-detail .main-error-text {
	font-size: 150px;
	line-height: 120px;
	margin-bottom: 0;
}
.error-slogan {
	font-size: 22px;
}
.big-btn a {
	padding: 15px 40px;
}
.newslatter-big input {
	padding: 8px;
	width: 180px;
}
.big-btn a {
	padding: 8px 20px;
}
}
/* =====  END RESPONSIVE CSS  =====*/