/* -------------------------------- */
/*   Main font-face                 
/* -------------------------------- */

@font-face {
    font-family: MyriadProLight;
    src: url(/fonts/MyriadPro-Light.woff);
}

@font-face {
    font-family: MyriadProLightIt;
    src: url(/fonts/MyriadPro-LightIt.woff);
}

@font-face {
    font-family: MyriadPro;
    src: url(/fonts/MyriadPro-Regular.woff);
}

@font-face {
    font-family: MyriadProSemibold;
    src: url(/fonts/MyriadPro-Semibold.woff);
}

@font-face {
    font-family: MyriadProSemiboldIt;
    src: url(/fonts/MyriadPro-SemiboldIt.woff);
}

@font-face {
    font-family: MyriadProBold;
    src: url(/fonts/MyriadPro-Bold.woff);
}

@font-face {
    font-family: MyriadProIt;
    src: url(/fonts/MyriadPro-It.woff);
}

@font-face {
    font-family: MyriadProBoldIt;
    src: url(/fonts/MyriadPro-BoldIt.woff);
}

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

body, p, h1, h2, h3, h4, h5, h6 {
	color:#5b5b5b;
	font-family: "MyriadProLight", source-han-sans-simplified-c, source-han-sans-traditional, Arial, sans-serif;
	font-weight: 300;
	letter-spacing:normal;
}
/*
h1 {
	color: #FFF;
	margin: 0 0 30px;	
	font-size:5em / 1;
	font-weight: 700;
	letter-spacing: 2px;
	text-shadow: 0 0 0.2em #1c202b;
	text-transform: uppercase;
}

h2 {
	color: #FFF;
	display: block;
	margin: 20px 0 25px;	
	font-size:5em / 1;
	text-shadow: 0 0 0.2em #1c202b;
	letter-spacing: 0px;
	text-transform: none;
}
*/

p {
	font-size:16px;
	letter-spacing:0.5px;
	line-height:21px;	
}

#hitBtn {
	display:block;				
	position:absolute;
	z-index:1000;				
}

a {
	transition: 0.3s;
}

.section-inner a {
	text-decoration: underline !important;	
}

.section-inner a:hover {
	text-decoration: none !important;	
}

i {
	font-family: "MyriadProIt", source-han-sans-simplified-c, source-han-sans-traditional, Arial, sans-serif;
	font-style: normal;
	font-weight: 300;
}

strong {
	font-family: "MyriadProSemibold", source-han-sans-simplified-c, source-han-sans-traditional, Arial, sans-serif;
	font-style: normal;
	font-weight: 300;
}

::selection { background: #00acc0; }

::-moz-selection { background: #00acc0; }

::-webkit-selection { background: #00acc0; }

.button.button-full strong {    
    font-weight: 300;
}

.separator-new {
  position: relative;
  width: 16px;
  height: 19px;
  margin: 50px auto;
  background: url("/d5_template/separator-gray.png") no-repeat center center;
  background-size: 16px 19px;
  /* background: currentColor; */
  /* border-radius: 50%; */
  /* color: #000; */
}

/* Menu
-----------------------------------------------------------------*/

#header.full-header #logo {
  border-right: none;
  margin: 0;
  padding:0 15px;
}

#header.project-header, #header.project-header #header-wrap {
	height: 70px;
}

/*#header.full-header #logo img {
	opacity:0;
}*/

#header.full-header.sticky-header #logo img {	
	opacity:1;
}

.sticky-logo {
	display:block;
	height:106px;
	left:46px;
	position:fixed;
	top:0;	
	width:239px;
	z-index:1;
}

#primary-menu ul li a {
	display: block;
	height: 70px;
	line-height: 70px;
	padding: 0 15px;
	color: #6a6a6a;
	font-family: "MyriadProSemibold", source-han-sans-simplified-c, source-han-sans-traditional, Arial, sans-serif;
	font-weight: 300;
	font-size: 16px;
	letter-spacing: 0;
	padding:0 22px;
	text-align:center;
	text-transform: none;
	transition: all 200ms linear 0s;
}

#primary-menu > ul > li:hover a {
	color: #a1a1a1;
}

#primary-menu > ul > li.current a {
	color: #00acc0;
}

.not-dark #primary-menu > ul > li:hover a {
	color: #a1a1a1;
}

/* Slider Caption
-----------------------------------------------------------------*/
.slider-caption {	
	max-width: none !important;
	padding-right:45px;
	text-align:right;	
}

.slider-caption img {
	height:auto;	
}

.slider-caption p {
	font-size: 14px;
	float:right;
	line-height: 18px;
	max-width:740px;
}

.slider-caption-mob {
	display: none;	
	padding:25px 15px;
	overflow:hidden;
}

.slider-caption-mob p {
	color:#aab0b3;
	font-size: 14px;
	line-height: 18px;
	margin:0;
}

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

.button.button-dark:hover {
	background-color: #00acc0;
}

.heading-block::after {
  border-top: 2px solid #f47920;
}

#gotoTop:hover {
  background-color: #00acc0;
}

.portfolio-overlay a:hover,
.portfolio-desc h3 a:hover {
  color: #00acc0;
}

.button.button-full .see-more i {
	font-size:20px;
	top:1px;
}

/* footer
-----------------------------------------------------------------*/

#footer .footer-widgets-wrap {
	padding:54px 0 0;
}

.footer-logo { margin-bottom:26px; }

.spost, .mpost {
	margin-top:40px;
	padding-top:40px;
}

#footer.dark, .dark #footer, #footer.dark a, .dark #footer a, .widget_links li a {
	color: #848989 !important;
	font-size:16px;
	letter-spacing:0.5px;
	line-height:21px;
}

 #footer.dark a:hover, .dark #footer a:hover, .widget_links li a:hover { color:#aaa !important; }

address {
	line-height:inherit;
	margin-bottom:40px;
}

.contact-list {
	line-height:25px;	
}

#footer.dark h4, .dark #footer h4 {
	color:#FFF;	
	font-family: "MyriadProSemibold", source-han-sans-simplified-c, source-han-sans-traditional, Arial, sans-serif;
	font-size:17px;	
	font-style: normal;
	font-weight: 300;
	margin:28px 0 23px;
}

.widget .spost > h4 { letter-spacing:2px; }

#footer.dark .txt-justify, .dark #footer .txt-justify {
	text-align:justify;
}

#footer.dark strong, .dark #footer strong {
	font-family: "MyriadPro", source-han-sans-simplified-c, source-han-sans-traditional, Arial, sans-serif;
	font-style: normal;
	font-weight: 300;
}

.copyright {
	font-size:14px;
	line-height:18px;	
}

.widget_links ul { margin-bottom:15px; }
.widget_links li { padding:3px; }

.dark #footer .social-icon.si-borderless, #footer.dark .social-icon.si-borderless {
	color:inherit !important;  
}

.show-desktop {
	margin-bottom:75px;	
}

.show-mobile {
	display:none;
}

/* Google Map
-----------------------------------------------------------------*/

#map {
  height: 786px;
}


/* -------------------------------- */
/*   Mobile Warning                 */
/* -------------------------------- */

.mobile_warning {
	background: 	#FFF url(/images/warning.gif) no-repeat center center;
	display:		none;
	top:			0;
	bottom:			0;
	left:			0;
	right:			0;
	position:		fixed;
	z-index:		999;
}


/* -------------------------------- */
/*   SharpMotion Project                 
/* -------------------------------- */

.intro h1 {	
	color: #FFF;
	margin: 0 0 30px;
	font-family: "MyriadProBold", source-han-sans-simplified-c, source-han-sans-traditional, Arial, sans-serif;
	font-size:74px;
	font-style: normal;
	font-weight: 300;
	line-height:78px;	
	letter-spacing: 0.4px;
	margin-bottom:15px;
	text-shadow: 0 0 16px rgba(0,0,0,0.8);
	text-transform: uppercase;	
}

.intro h2 {	
	color: #FFF;
	margin: 0 0 30px;
	font-family: "MyriadProLight", source-han-sans-simplified-c, source-han-sans-traditional, Arial, sans-serif;
	font-size:42px;
	font-style: normal;
	font-weight: 300;
	line-height:42px;	
	letter-spacing: 0.4px;
	margin-bottom:15px;
	text-shadow: 0 0 16px rgba(0,0,0,0.8);
	text-transform: none;	
}

.section-inner h3 {
	color:#333;	
	font-family: "MyriadProSemibold", source-han-sans-simplified-c, source-han-sans-traditional, Arial, sans-serif;
	font-size: 26px;
	font-style: normal;
	font-weight: 300;
}

section .container {
    margin: auto;
	/*max-width:940px;*/
    position: relative;
    /*width: 940px;*/
    z-index: 10 !important;
}

.section {	
	position: relative;
	overflow: visible !important;
}

#intro {
	margin-top:0 !important;
}

#about {
	padding:0 !important;
	margin-bottom:0 !important;
/*	padding:0 !important;
	margin:0 !important;*/
}

.section .section-inner {
  overflow: hidden;
  padding-top: 150px;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  background-color: #fff;
}

[class*="section-bg"] .section-inner,
.section:last-child .section-inner {
  padding-bottom: 150px;
}

.section + [class*="section-bg"] {
  margin-top: 150px;
}

[class*="section-bg"] + [class*="section-bg"] {
  margin-top: 0;
}

.section-top-rise,
.section-top-fall,
.section-bottom-rise,
.section-bottom-fall {
  z-index: 10;
}

.section-top-rise:before, .section-top-rise:after,
.section-top-fall:before,
.section-top-fall:after,
.section-bottom-rise:before,
.section-bottom-rise:after,
.section-bottom-fall:before,
.section-bottom-fall:after {
  content: '';
  display: none;
  position: absolute;
  left: 0;
  width: 100%;
  height: 150px;
  z-index: 5;
}

.section-top-rise:before,
.lte-ie9 .section-top-rise .before,
.section-top-fall:before,
.lte-ie9
.section-top-fall .before,
.section-bottom-rise:before,
.lte-ie9
.section-bottom-rise .before,
.section-bottom-fall:before,
.lte-ie9
.section-bottom-fall .before {
  top: -149px;
}

.section-top-rise:after,
.lte-ie9 .section-top-rise .after,
.section-top-fall:after,
.lte-ie9
.section-top-fall .after,
.section-bottom-rise:after,
.lte-ie9
.section-bottom-rise .after,
.section-bottom-fall:after,
.lte-ie9
.section-bottom-fall .after {
  bottom: -150px;
}

.lte-ie9 .section-top-rise:before,
.lte-ie9 .section-top-rise:after, .lte-ie9
.section-top-fall:before,
.lte-ie9
.section-top-fall:after, .lte-ie9
.section-bottom-rise:before,
.lte-ie9
.section-bottom-rise:after, .lte-ie9
.section-bottom-fall:before,
.lte-ie9
.section-bottom-fall:after {
  display: none;
}

.lte-ie9 .section-top-rise .before,
.lte-ie9 .section-top-rise .after, .lte-ie9
.section-top-fall .before,
.lte-ie9
.section-top-fall .after, .lte-ie9
.section-bottom-rise .before,
.lte-ie9
.section-bottom-rise .after, .lte-ie9
.section-bottom-fall .before,
.lte-ie9
.section-bottom-fall .after {
  position: absolute;
  left: 0;
  width: 0;
  height: 0;
  border-width: 0;
  border-style: solid;
  border-color: transparent;
  z-index: 5;
}

.section-top-rise.section-bg-img:before, .section-top-rise.section-bg-img:after,
.lte-ie9 .section-top-rise.section-bg-img .before,
.lte-ie9 .section-top-rise.section-bg-img .after,
.section-top-fall.section-bg-img:before,
.section-top-fall.section-bg-img:after,
.lte-ie9
.section-top-fall.section-bg-img .before,
.lte-ie9
.section-top-fall.section-bg-img .after,
.section-bottom-rise.section-bg-img:before,
.section-bottom-rise.section-bg-img:after,
.lte-ie9
.section-bottom-rise.section-bg-img .before,
.lte-ie9
.section-bottom-rise.section-bg-img .after,
.section-bottom-fall.section-bg-img:before,
.section-bottom-fall.section-bg-img:after,
.lte-ie9
.section-bottom-fall.section-bg-img .before,
.lte-ie9
.section-bottom-fall.section-bg-img .after {
  -webkit-transform: rotate(180deg);
      -ms-transform: rotate(180deg);
          transform: rotate(180deg);
}

[class*="section-top"]:before {
  display: block;
}

.section + [class*="section-top"] {
  margin-top: 225px;
}

[class*="section-top"].section-bg-img .bg {
  top: -150px;
}

[class*="section-top"] .section-inner {
  padding-top: 75px;
}

[class*="section-bottom"] {
  margin-bottom: 75px;
}

[class*="section-bottom"]:after {
  display: block;
}

[class*="section-bottom"].section-bg-img .bg {
  bottom: -150px;
}

[class*="section-bottom"] .section-inner {
  padding-bottom: 75px;
}

[class*="section-bottom"] + .section {
  margin-top: 150px;
}

[class*="section-bottom"] + .section .section-inner {
  padding-top: 75px;
}

.section-top-rise:before {
  background: linear-gradient(to bottom right, transparent, transparent 50%, #f9f9f9 50%, #f9f9f9);
}

.section-top-rise.section-bg-dark:before {
  background: linear-gradient(to bottom right, transparent, transparent 50%, #1C202B 50%, #1C202B);
}

.section-top-rise.section-bg-dark.section-bg-grey:before {
  background: linear-gradient(to bottom right, transparent, transparent 50%, #57595f 50%, #57595f);
}

.section-top-rise.section-bg-light:before {
  background: linear-gradient(to bottom right, transparent, transparent 50%, #E4EBEE 50%, #E4EBEE);
}

.lte-ie9 .section-top-rise .before {
  border-left-width: 1500px;
  border-bottom-width: 150px;
  border-bottom-color: #fff;
}

.lte-ie9 .section-top-rise.section-bg-dark .before {
  border-bottom-color: #1C202B;
}

.lte-ie9 .section-top-rise.section-bg-dark.section-bg-grey .before {
  border-bottom-color: #57595f;
}

.lte-ie9 .section-top-rise.section-bg-light .before {
  border-bottom-color: #E4EBEE;
}

.section-top-fall:before {
  background: linear-gradient(to bottom left, transparent, transparent 50%, #fff 50%, #fff);
}

.section-top-fall.section-bg-dark:before {
  background: linear-gradient(to bottom left, transparent, transparent 50%, #1C202B 50%, #1C202B);
}

.section-top-fall.section-bg-dark.section-bg-grey:before {
  background: linear-gradient(to bottom left, transparent, transparent 50%, #57595f 50%, #57595f);
}

.section-top-fall.section-bg-light:before {
  background: linear-gradient(to bottom left, transparent, transparent 50%, #E4EBEE 50%, #E4EBEE);
}

.lte-ie9 .section-top-fall .before {
  border-left-width: 1500px;
  border-top-width: 150px;
  border-left-color: #fff;
}

.lte-ie9 .section-top-fall.section-bg-dark .before {
  border-left-color: #1C202B;
}

.lte-ie9 .section-top-fall.section-bg-dark.section-bg-grey .before {
  border-left-color: #57595f;
}

.lte-ie9 .section-top-fall.section-bg-light .before {
  border-left-color: #E4EBEE;
}

.section-bottom-rise:after {
  background: linear-gradient(to bottom right, #fff, #fff 50%, transparent 50%, transparent);
}

.section-bottom-rise.section-bg-dark:after {
  background: linear-gradient(to bottom right, #1C202B, #1C202B 50%, transparent 50%, transparent);
}

.section-bottom-rise.section-bg-light:after {
  background: linear-gradient(to bottom right, #E4EBEE, #E4EBEE 50%, transparent 50%, transparent);
}

.lte-ie9 .section-bottom-rise .after {
  border-top-width: 150px;
  border-right-width: 1500px;
  border-top-color: #fff;
}

.lte-ie9 .section-bottom-rise.section-bg-dark .after {
  border-top-color: #1C202B;
}

.lte-ie9 .section-bottom-rise.section-bg-light .after {
  border-top-color: #E4EBEE;
}

.section-bottom-fall:after {
  background: linear-gradient(to bottom left, #fff, #fff 50%, transparent 50%, transparent);
}

.section-bottom-fall.section-bg-dark:after {
  background: linear-gradient(to bottom left, #1C202B, #1C202B 50%, transparent 50%, transparent);
}

.section-bottom-fall.section-bg-light:after {
  background: linear-gradient(to bottom left, #E4EBEE, #E4EBEE 50%, transparent 50%, transparent);
}

.lte-ie9 .section-bottom-fall .after {
  border-bottom-width: 150px;
  border-right-width: 1500px;
  border-right-color: #fff;
}

.lte-ie9 .section-bottom-fall.section-bg-dark .after {
  border-right-color: #1C202B;
}

.lte-ie9 .section-bottom-fall.section-bg-light .after {
  border-right-color: #E4EBEE;
}

.section-bg-img {
  z-index: 5;
}

.section-bg-img:before {
  top: -151px;
}

.section-bg-img:after {
  bottom: -151px;
}

.section-bg-img .bg {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
  z-index: 4;
}

.section-bg-img.section-bg-overlay {
  color: #fff;
}

.section-bg-img.section-bg-overlay .bg:before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(28, 32, 43, 0.7) url("/images/overlay.png");
  z-index: 5;
}

.section-bg-img.section-bg-img-dark {
  color: #fff;
}

.section-bg-dark .section-inner {
  background-color: #1C202B;
  color: #ffffff;
}

.section-bg-grey .section-inner {
  background-color: #57595f;
}

.section-bg-dark + .section-bg-dark .section-inner {
  padding-top: 0;
}

.section-bg-light .section-inner {
  background-color: #E4EBEE;
  color: #000000;
}

.section-bg-light + .section-bg-light .section-inner {
  padding-top: 0;
}

.content-box-dark {
  background-color: #1C202B;
  color: #ffffff;
}

.section-bg-dark .content-box-dark {
  background-color: #262b3a;
}

.content-box-light {
  background-color: #E4EBEE;
  color: #000000;
}

.section-bg-light .content-box-light {
  background-color: #d4dfe4;
}

#intro {
  text-align: center;
}

#intro .bg {
  background-image: url("/images/header-bg.jpg");
  background-position: center top;
}

#intro #particles {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 5;
}

#intro .bg {
  background-image: url("/images/header-bg-01.jpg");
}

.intro {
  position: relative;
  /*padding: 100px 0 260px;*/
  padding: 210px 0 260px;
  z-index: 10;
  text-align: center;
}

.sharpmotion-portfolio {
	background-color:#e4ebee;	
}

/* -------------------------------- */
/*   About Us
/* -------------------------------- */

.aboutus-bg-img {
	background: #f9f9f9 url(/d5_template/aboutus-bg-img.jpg) left 70px no-repeat;
	background-size: 100%;	
}

.aboutus-bg-img .section-bottom-rise:after {
  background: none;
}

.aboutus-header {
	background:none;
	padding:0;	
}

.aboutus-header	.section-inner {
	background:none;
	padding:0;
}

.aboutus-header canvas {
	float:left;	
}

.aboutus-header .container {
	float:right;
	padding:0;
	width:62%;
}

.aboutus-header .container .intro {
	padding:18% 51px 0 0;
	text-align: right;
}
.aboutus-header h1 {
	color: #FFF;	
	font-family: "MyriadProSemiboldIt", source-han-sans-simplified-c, source-han-sans-traditional, Arial, sans-serif;
	font-size: 40px;	
	font-style: normal;
	font-weight: 300;
	line-height:45px;
	margin-bottom:5px;
	text-transform:none;	
}

.aboutus-header p {	
	font-family: "MyriadProIt", source-han-sans-simplified-c, source-han-sans-traditional, Arial, sans-serif;
	color: rgba(255,255,255, 0.65);
	font-size: 12px;	
	line-height:17px;	
}

#aboutus-detail .heading-block, #aboutus-clients .heading-block, #design-services .heading-block {
	margin-bottom:32px !important;	
}

#aboutus-detail h3 {	
	font-family: "MyriadProLightIt", source-han-sans-simplified-c, source-han-sans-traditional, Arial, sans-serif !important;	
}

#aboutus-clients h3, #design-services h3 {
	font-family: "MyriadProLight", source-han-sans-simplified-c, source-han-sans-traditional, Arial, sans-serif !important;
}

#aboutus-detail h3 strong {
	font-family: "MyriadProSemiboldIt", source-han-sans-simplified-c, source-han-sans-traditional, Arial, sans-serif;
}

#aboutus-detail p {
	font-size:28px;
	line-height:34px;
	text-align:left;
}

#wrapper.aboutus-bg-img {
	background-color:#f9f9f9;
}

.portfolio-6 .portfolio-item .portfolio-image,
.portfolio-6 .portfolio-item .portfolio-image a,
.portfolio-6 .portfolio-item .portfolio-image img {
	width: 80%;
	margin:0 auto;
}

#aboutus-clients .testimonial {
	padding: 0;
	background-color: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	max-width: 800px;
	margin: 0 auto;
}

.testimonial-full .testi-image, .testimonial-full .testi-image a, .testimonial-full .testi-image img {
	border-radius:0;
	height:100px;
	width:200px;	
}

.testimonial-full a {
	display:inline-block;
	text-decoration:none !important;	
}

.testimonial .flex-control-nav li a {
	background-color: #f47920;
}

#aboutus-clients .testi-content p::before, #aboutus-clients .testi-content p::after, #aboutus-clients .testi-meta::before {
	content:"";
}

#aboutus-clients .testi-content p {
	color:#333;
	font-family: "MyriadProSemiboldIt", source-han-sans-simplified-c, source-han-sans-traditional, Arial, sans-serif;
	font-size:17px;
	font-style:normal;
	font-weight:300;
	text-transform:none;
}

#aboutus-clients .testi-content .testi-meta {
	color:#5b5b5b;
	font-family: "MyriadProSemibold", source-han-sans-simplified-c, source-han-sans-traditional, Arial, sans-serif;
	font-size:15px;
	font-weight:300;
	letter-spacing:0.5px;
	text-transform:none;	
}

#aboutus-clients .testi-content a .testi-meta {
	transition: all 200ms linear 0s;
}

#aboutus-clients .testi-content a:hover .testi-meta {
	color:#00acc0;
}

#aboutus-clients .testi-content .testi-meta span {
	font-family: "MyriadProLight", source-han-sans-simplified-c, source-han-sans-traditional, Arial, sans-serif;
	font-size:14px;
	font-weight:300;
}

/* -------------------------------- */
/*   Our Services
/* -------------------------------- */

.aboutus-header p span {
	display:block;
}

#design-services h3 span {
	color:#888;
}

.portfolio-item a {
	text-decoration:none !important;
}

.portfolio-item .portfolio-desc {
	display:block;
	padding-top:0;	
}

.portfolio-item a .portfolio-desc {
	font-family: "MyriadProSemibold", source-han-sans-simplified-c, source-han-sans-traditional, Arial, sans-serif;
	font-size:15px;
	font-weight:300;
	letter-spacing:0.5px;	
}

.portfolio-item a .portfolio-desc span {
	font-family: "MyriadProLight", source-han-sans-simplified-c, source-han-sans-traditional, Arial, sans-serif;
}

/* -------------------------------- */
/*   Contact Us
/* -------------------------------- */

#map-overlay {		
    padding: 50px 0;
}

#contact-form-overlay-mini {
	overflow: hidden;
	width: 382px;
}

.form-control.error, .sm-form-control.error {
	border-color: #f47920;	
}

#template-contactform-submit {
  	background-color: #00acc0;
  	border-bottom: 0 none;
	transition: all 200ms linear 0s;
}

#template-contactform-submit:hover {
  	background-color: #f47920 !important;  
}

#template-contactform-submit:disabled {
	background-color: #00acc0 !important;
	opacity: 0.4;
}

.toast { background-color: #f47920; }

.toast-success { background-color: #f47920; }

.toast-error { background-color: #f47920; }

.toast-info { background-color: #f47920; }

.toast-warning { background-color: #f47920; }

/* -------------------------------- */
/*   Portfolio
/* -------------------------------- */

#page-menu-wrap {
	background-color:#00acc0;	
}

#page-menu .menu-title span {
	font-family: "MyriadProSemibold", source-han-sans-simplified-c, source-han-sans-traditional, Arial, sans-serif;
	font-weight: 300;
}

/* -------------------------------- */
/*   Media Query                    */
/* -------------------------------- */

@media (min-width: 768px) {
	iframe {
		height:405px;
		width: 720px;
	}
}
@media (min-width: 992px) {
	iframe {
		height:529px;
		width: 940px;
	}
}
@media (min-width: 1200px) {
	iframe {
		height:641px;
		width: 1140px;
	}
	
	.aboutus-header .container .intro {
		padding:20% 51px 0 0;
		text-align: right;
	}
	
	.aboutus-header h1 {		
		font-size: 50px;	
		line-height:55px;
	}
	
	.aboutus-header p {		
		font-size: 14px;	
		line-height:19px;
	}
}

@media (min-width: 1640px) {
	.slider-caption p {
		font-size: 16px;
		line-height: 19px;
	}
	
	.aboutus-header .container .intro {
		padding:22% 51px 0 0;
		text-align: right;
	}
	
	.aboutus-header h1 {		
		font-size: 55px;	
		line-height:60px;
	}
	
	.aboutus-header p {		
		font-size: 16px;	
		line-height:21px;
	}		
}

@media (max-width: 991px) {
	#primary-menu {		
		left:0;		
		position:absolute;		
		width:100%;
		/*box-shadow: 0px 9px 6px 2px rgba(0,0,0,0.6);*/
	}	
	
	#primary-menu ul {
		background-color:#FFF;
		border:#EEE 1px solid !important;
		border-top:none !important;
		border-radius: 0 0 7px 7px;			
	}
	
	#header.full-header #primary-menu > ul {
		text-align:center;
	}
	.icon-reorder::before {
		color:#5b5b5b;
		
	}
	
	.sticky-logo {
		display:none;		
	}
	
	#header.full-header #logo img {
		height:100px;
		opacity:1;		
	}
	
	.button.button-full .see-more i {
		font-size:14px;
		top:1px !important;		
	}
	
	#footer .footer-widgets-wrap {
		padding:54px 0 0;
	}
	
	.about-heading p span {
		display: inline;		
	}
	
	.aboutus-bg-img {
		background: #f9f9f9 url(/d5_template/aboutus-bg-img.jpg) left 100px no-repeat;
		background-size: 100%;			
	}
	
	#aboutus-detail p {
		font-size:22px;
		line-height:30px;
		text-align:center;		
	}
    
    #contact-form-overlay-mini {
        padding: 20px;
        width: auto;
    }
    
    #html_element {
		/*
		transform:scale(0.85); 
        -webkit-transform:scale(0.85);
		transform-origin:0 0;
		-webkit-transform-origin:0 0;
		*/
	}
}

@media (min-width: 768px) and (max-width: 991px) {
	.portfolio .portfolio-item { width: 50% !important; }
	
	.portfolio .portfolio-item.pf-media { width: 33.33333333% !important; }
}

@media (max-width: 767px) {
	.slider-caption-mob {
		display: block;
		text-align:center;		
	}
	
	.slider-caption-mob img {
		margin-bottom:8px;
	}
	
	.slider-caption-mob p {		
		font-size:15px;
		line-height:20px !important;		
	}
	
	.show-desktop {
		display:none;
	}
	
	.show-mobile {
		display:block;
	}
	
	.button.button-full .see-more i {
		font-size:13px;
		top:1px !important;		
	}
	
	#map {
	  height: 420px;
	}
	
	/* -------------------------------- */
	/*   SharpMotion Project                 
	/* -------------------------------- */
	
	.intro h1 {
		font-size:62px;
		line-height:66px;
		margin-bottom:10px;
	}
	
	.intro h2 {
		font-size:36px;
		line-height:40px;
		margin-bottom:10px;
	}
	
	.section-inner h3 {
		font-size: 22px;
	}
	
	.intro {	  
	  padding: 0 0 260px;
	}
	
	iframe {
		display:block;
		height:243px;
		width:430px;
		margin:0 auto;		
	}
	
	/* -------------------------------- */
	/*   About Us
	/* -------------------------------- */
	
	.aboutus-bg-img {
		background: #f9f9f9 url(/d5_template/aboutus-bg-img-mobile.jpg) center 100px no-repeat !important;
		background-size: 100% !important;	
	}
	
	.aboutus-header canvas {
		padding-bottom:50px;
		
	}
	
	.aboutus-header .container {
		float: none;
		left:0;
		padding:0 15px;
		position:absolute;		
		top:65%;
		width:100% !important;		
	}
	
	.aboutus-header .container .intro {
		padding:0;
		text-align:center;
	}
	
	#aboutus-detail p {
		font-size:18px;
		line-height:26px;
		text-align:center;		
	}
	
	/* -------------------------------- */
	/*   Service                
	/* -------------------------------- */
	
	.portfolio-item:first-child .portfolio-desc,
	.portfolio-item:first-child + .portfolio-item .portfolio-desc {
		margin-bottom:50px;
	}
	
	/* -------------------------------- */
	/*   Portfolio                
	/* -------------------------------- */
	/*
	#portfolio-detail .container {
		padding-left:20px;
		padding-right:20px;
		width:100% !important;
	}
	
	#portfolio-detail .container .profile-text {
		padding-left:20px;
		padding-right:20px;	
	}
	
	#portfolio-detail .container p span {
		display:inline-block;
		padding-left:20px;
		padding-right:20px;
		width:100%;
	}
	*/
}

@media (max-width: 559px) {
	.slider-caption p {
		font-size: 11px;
		line-height: 15px;
	}
	
	.see-more {
		display:block;
	}
	
	#map {
	  height: 360px;
	}
	
	.aboutus-header h1 {		
		font-size: 40px;	
		line-height:45px;
	}	
			
}

@media (max-width: 479px) {
	.button.button-full .see-more i {
		font-size:12px;
		top:1px !important;		
	}
	
	/* -------------------------------- */
	/*   SharpMotion Project                 
	/* -------------------------------- */
	
	.intro h1 {
		font-size:45px;
		line-height:50px;
	}
	
	.intro h2 {
		font-size:26px;
		line-height:30px;
	}
	
	#portfolio-detail .container {		
		width:380px !important;
	}
	
	iframe {
		display:block;
		height:197px;
		width: 350px;
		margin:0 auto;	
	}	
	
	.aboutus-header .container {		
		top:60%;
	}
	
	.aboutus-header h1 {		
		font-size: 40px;	
		line-height:45px;
	}
	
	#aboutus-clients .portfolio .portfolio-item { width: 50%; }
	
	.aboutus-header p span {
		display: inline;
	}
	
	/* -------------------------------- */
	/*   Service                
	/* -------------------------------- */
	
	#pieces .portfolio .portfolio-item {
		width:100%;		
	}
	
	.portfolio-item:first-child .portfolio-desc,
	.portfolio-item:first-child + .portfolio-item .portfolio-desc,
	.portfolio-item:first-child + .portfolio-item + .portfolio-item .portfolio-desc {
		margin-bottom:50px;
	}
    
    /* -------------------------------- */
	/*   SharpMotion Contact Us     
	/* -------------------------------- */
	
	#map-overlay {		
		margin-bottom: 820px;
		max-height: 100vh;
		padding: 0;
	}
	
	#map-overlay .container {
		top: calc(100vh + 20px);
        width: 100% !important;
    }
	
	#map-overlay #google-map {
		height: 100vh;
	}
    
    #contact-form-overlay-mini {
		box-shadow: none;
	}
}

@media (max-width: 399px) {
	#portfolio-detail .container {		
		width:365px !important;
	}
	/*
	iframe {
		display:block;
		height:158px;
		width: 280px;
		margin:0 auto;
	}
	*/
	iframe {
		display:block;
		height:189px;
		width: 335px;
		margin:0 auto;
	}
}

@media screen and (orientation: landscape) and (max-device-height: 640px) and (max-device-width: 1136px) { /* Resolution of iPhone 5s */
	.mobile_warning {
		display:	block;
	}
}

@media screen and (-webkit-min-device-pixel-ratio: 2) {	
	.mobile_warning {
		background-image: url(../images/warning_2x.gif);
		background-size:	220px 160px;
	}
}