/*
Style Name: GXM Web Revamp
Description: Customized Style for GXM Web Revamp Website
Author: Fauzan Rani
Author URI: http://www.fauzanrani.com
*/

/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/
/*--------------------------------------------------------------- OVERRIDE ON VARY DEVICES  --------------*/



@media (max-width: 768px) {
	.sectionWrapper {
		padding: 80px 0px;
	}
	.container{


		margin: 0 auto;
		text-align: center;
	}



	h1, h2, h3, h4, h5 {
		margin-bottom: 15px;
		line-height: 1.4em;
	}

	h1{
		font-size: 36px;
	}
	h2{
		font-size: 27px;
	}
	h3{
		font-size: 20px;
	}
	p{
		font-size: 14px;
		line-height: 1.6;
		margin: 0 0 30px;
		text-align: center;
	}
	.width780, .width570{
		width: 90%;
	}

	#headerWrapper,#scrollMenu{ display: none; }

	.btn.btn-cool {
		margin-bottom: 15px;
	}

	.emptySpace{
		height:30px;
	}
	.smallSpace {
		height: 10px;
	}

	.smallheading {
		margin-bottom: 10px;
	}

	.goLeft,.goRight{
		float: none;
		clear: both;
		margin-bottom: 20px;
	}

	.mobileHide{
		display: none !important;
	}
	.mobileShow{
		display: block !important;
	}
	.responsiveSlider {
		margin: 0 0 20px;
		box-shadow: none;
	}


	/*------------------- fix for FOOTER */
	#footerContent .lineSep{ display: none; }
	.block_static {
		display: none;
	}
	.block-enews #enewsbox{
		display: block;
		width: 100%;
	}
	.block-enews input[type=text] {
		text-align: center;
	}
	.blockInvadeWrap {
		display: none;
	}

	#socialLink{ display: none;}
	#subscribe .form-box {
		margin-bottom: 16px;
	}


	/*------------------- fix for Homepage */
	#introduction {
		height: 500px;
		margin-top: 75px;
	}
	#introduction .theContent {
		margin: 100px auto;
		padding: 0;
	}

	.block_static.block-enews {
		display: block;
		text-align: center;
	}

	.works {
		width: 100%;
		margin: 0;
		text-align: center;
	}
	.block_work {
		display: block;
		margin: 10px auto;
	}



	.block_work img{
		width: 90%;
	}

	#testimonials{
		padding: 0px;
	}

	#testimonialSlider .slide-title{
		display: none;
	}

	#testimonials .container{
		width: 100% !important;
		padding: 0;
	}

	#testimonialSlider{
		height: auto;
		background-color: #222;
	}

	#testimonialSlider .slides li{
		background-size: auto 368px;
		background-position: center top;
	}
	#testimonialSlider .sliders-caption {
		width: 83%;
		padding: 50px 0;
	}

	#testimonialSlider .slides .sliders-caption h3 {
		font-size: 22px;
		margin-bottom: 30px;
	}

	#testimonialSlider .slide-desc {
		font-size: 12px;
	}

	.flex-control-nav {
	position: absolute;
	bottom: -40px;
	}

	#testimonialSlider .flex-control-paging {
		margin: -85px 0 0;
		width: 100%;
		float: none;
	}

	#testimonialSlider .flex-direction-nav {
		display: inline-block;
		height: 40px;
		margin-top: 15px;
		min-width: 280px;
		width: 90%;
		clear: both;
		text-align: left;
	}
	#testimonialSlider .flex-direction-nav li {
		display: inline-block;
		float: left;
		height: 30px;
		width: 50%;
		vertical-align: top;
	}

	#testimonialSlider .flex-direction-nav a {
		position: relative;
		top: 0;
		z-index: 100;
		left: 0;
		margin: 0;
	}

	#testimonialSlider .flex-direction-nav .flex-prev{
		width: 22px;
		height: 30px;
		background-image: url('../img/slider-arrow-prev.png');
		background-repeat: no-repeat;
		background-size: auto 100%;
		background-position: center center;
	}
	#testimonialSlider .flex-direction-nav .flex-next{
		float: right;
		width: 22px;
		height: 30px;
		background-image: url('../img/slider-arrow-next.png');
		background-size: auto 100%;
		background-position: center center;
	}
	#testimonialSlider .flex-prev:before,
	#testimonialSlider .flex-next:before{
		content: '' !important;
	}






	#allWorks .block_work {
		margin: 0 auto;
	}

	#allWorks .theContent > h2, #allWorks .theContent > p {
		width: 90% !important;
	}
	#allWorks .theContent > h2 {
		margin-top: 30px;
	}

	.block_work,
	.block_work.display_thumb {
		/*height: auto !important;*/
		overflow: visible;
	}

	#allWorks .emptySpace{
		height: 50px;
	}

	.responsiveSlider .flex-direction-nav {
		display: inline-block;
		height: 40px;
		margin-top: 20px;
		min-width: 280px;
		width: 90%;
		clear: both;
		text-align: left;
	}
	.responsiveSlider .flex-direction-nav li {
		display: inline-block;
		float: left;
		height: 30px;
		width: 50%;
		vertical-align: top;
	}

	.responsiveSlider .flex-direction-nav a {
		position: relative;
		top: 0;
		z-index: 100;
		left: 0;
		margin: 0;
	}

	.responsiveSlider .flex-direction-nav .flex-prev{
		width: 22px;
		height: 30px;
		background-image: url('../img/slider-blackarrow-prev.png');
		background-repeat: no-repeat;
		background-size: auto 100%;
		background-position: center center;
	}
	.responsiveSlider .flex-direction-nav .flex-next{
		float: right;
		width: 22px;
		height: 30px;
		background-image: url('../img/slider-blackarrow-next.png');
		background-size: auto 100%;
		background-position: center center;
	}
	.responsiveSlider .flex-prev:before,
	.responsiveSlider .flex-next:before{
		content: '' !important;
	}

	.responsiveSlider .flex-control-paging{
		position: relative;
	}


	/*  Project details page */
	#mobileProjectMenu{
		background-color: #131313;
	}

	#closeContainer img {
		width: 65%;
	}


	#project_intro{
		padding: 30px 0px 50px 0px;
	}
	#project_problem, #project_result {
		padding: 40px 0px 30px;
	}

	#project_image .container .theContent {
		width: 100%;
	}
	#project_image .container img {
		width: 100%;
	}

	#backtotop {
		padding: 0px 0px 0px;
		margin-top: 0px;
		text-align: center;
	}
	#backtotop a {
		float: none;
	}

	/*  SERVICES */
	#featuredProject {
		margin: 78px 0 0;
		height: 240px;
		background-size: cover;
	}
	#featuredProject.page_contact {

		overflow: visible;

	}
	#featuredProject .theContent {
		margin-top: 80px;
	}
	#featuredProject.page_contact .theContent{
		/*margin-top: 80px;*/
		margin-top: 0%;
	}

	#listOfService {
		margin-top: -65px;
	}
	.page_contact .process .block_process {
		width: 100%;
		margin: 0 auto;
	}
	.block_service .theContent {
		width: 100%;
		height: 370px;
		border:0px solid;
	}
	.block_process {
		margin: 30px 0 0;
	}
	.block_process:nth-child(-n+2):after{
		display: block;
		width: 30px;
		height: 40px;
		content: url(../img/service/arrow-dotted-vertical.png);
		margin: 0 auto;
		left: 46%;
	}

	.block_process .theContent {
		width: 90%;
		height: auto;
		padding: 36px 0 0;
	}

	.block_approach {
		width: 95%;
	}



	.block_service:hover {
		background-size: 100% 88%;
	}


	/* CAREER */
	#careerTop {
		padding: 80px 0 0;
	}
	#sliderCareer {
		height: 350px;
	}

	#sliderCareer .slides li{
		height: 350px;
		background-position: center top;
		background-size: auto 350px;
	}
	#sliderCareer .sliders-caption {
		width: 90%;
		margin: 120px 0 0;
	}
	#sliderCareer .sliders-caption h4 {
		font-size: 18px;
	}
	#careerTop .sliderTitle {
		top: -260px;
	}
	.flex-direction-nav {
		display: none;
	}


	#careerBottom .block_position {

		height: 150px;
		padding: 40px 0 35px;
	}


	.position_title {
		font-size: 20px;
	}

	/* CONTACT */
	.block_location .rightMap {
		padding: 0px;
		overflow: hidden;
	}
	.leftDetails {
		padding: 20px 15px !important;
	}


	/* Career Details */
	.career_details .attach_files {
		width: 100%;
	}

	.block_location{
		margin: 0;
	}

	.block_sitemap{
		display: inline-block;
		width: 90%;
	}

	.block_sitemap:nth-child(-n+3){ /* for first 3*/
		border-top: none;
	}

	.block_sitemap .sitemap_title{
		font-size: 26px;
	}

	.clientBlock {
		display: block;

	}

.clientBlock {margin-top:20px; margin-bottom:20px;}
}


@media (min-width: 768px) and (max-width: 991px) { /* ipad potrait*/
	.align-left{text-align: center;}

	.container{
	/*	width: 90%;
		padding: 0px 3%;*/
		margin: 0 auto;
		text-align: center;
	}

	#allWorks .col-sm-12 {padding:0 15px;}

	#allWorks .col-sm-12 {padding:0 15px;}
	/*.row > div {
		width: 75%;
		margin: 0 auto;
		padding: 20px 0;
	}*/
	.inlineMobile > div{
		display: inline-block !important;
	}
	.row.inlineMobile > .col-md-2,
	.row.inlineMobile > .col-md-3 {
		width: 25% !important;
		margin-bottom: 30px !important;
	}
	.row.inlineMobile > .col-md-4,
	.row.inlineMobile > .col-md-5,
	.row.inlineMobile > .col-md-6{
		width: 40% !important;
		margin-bottom: 30px !important;
	}
	.row.inlineMobile > .col-md-7,
	.row.inlineMobile > .col-md-8,
	.row.inlineMobile > .col-md-9 {
		width: 70% !important;
		margin-bottom: 30px !important;
	}


	h1, h2, h3, h4, h5 {
		margin-bottom: 20px;
		line-height: 1.4em;
	}


	.mobileHide{
		display: none;
	}
	.mobileShow{
		display: block;
	}



	/* HOMEPAGE  */
	#allWorks .container.mobileHide {
		display: block !important;
	}
	#allWorks .container.mobileShow {
		display: none !important;
	}
	#allWorks .block_work{
		display: inline-block;
		width: 40%;
		margin: 20px;
	}
	#allWorks .block_work {
		display: inline-block !important;
		text-align: left;
	}

	#testimonials .container {
		padding: 0;
	}

	#testimonialSlider .sliders-caption {
		padding: 150px 0 60px;
	}
	#testimonialSlider .slide-title {
		display: block;
		height: 0;
	}



	.work_summary {
		display: none;
		width: 250px;
	}


	/* FOOTER  */
	.goLeft, .goRight {
		clear: initial;
	}
	.block-enews #enewsbtn {
		width: 18%;
		float: left;
		text-align: left;
	}
	.block-enews #enewsbox {
		width: 78%;
		float: left;
	}

	.page_work#featuredProject {
		display: block !important;
		height: 400px;
		background-size: auto 400px;
	}
	.page_work#featuredProject .theContent {
		margin-top: 90px;
	}

	.page_work #allWorks .block_work:first-child{
		display: none !important;
	}

	/* CLIENT */
	.clientBlock {margin-top:20px; margin-bottom:20px;}

	/* CAREER */
	#sliderCareer .flex-direction-nav{
		display: block;
	}
	#sliderCareer .flex-direction-nav a{
		width: 50px;
		height: 94px;
	}

	#careerBottom .block_position {
		height: 180px;
		padding: 50px 0 45px;
	}


	.block_process:nth-child(-n+2):after{
		display: block;
		width: 30px;
		height: 40px;
		content: url(../img/service/arrow-dotted-vertical.png);
		margin: 0 auto;
		left: 48%;
	}

	#testimonialSlider .sliders-caption {
	width: 600px;
	padding: 120px 0 60px;
	}


	/* CONTACT */
	.block_location .rightMap {
		padding: 0px;
		overflow: hidden;
	}


}

@media (min-width: 992px) and (max-width: 1199px) { /* ipad landscape */

	/*.container{
		width: 98%;
	}*/

	.mobileWidth90{
		width: 90%;
	}

	#mobileMenuWrapper{ display: none;}

	.theContent h2 {
		width: 654px;
	}

	/*--------------------------------  WORK FIX ------*/
	.mobileShow{
		display: none;
	}


	/* FOOTER  */
	.block-enews #enewsbtn {
		width: 30%;
	}
	.block-enews #enewsbox {
		width: 62%;
	}

	/* CLIENT */



	/* SERVICES */
	.block_service {
		width: 27%;
		margin: 30px 0 0 45px;
	}
	.block_service .theContent {
		width: 100%;
	}

	/* CAREER */
	#careerBottom .positions {
		width: 100%;
	}


	.page_contact .process .block_process {
		width: 100%;
		margin: 0 auto;
	}


	.block_process .theContent {
		width: 290px;
	}

	/*	.block_process:nth-child(-n+2):after{
		display: block;
		width: 30px;
		height: 40px;
		content: url(../img/service/arrow-dotted-vertical.png);
		margin: 0 auto;
		left: 48%;
	}*/

	.block_process:nth-child(-n+2):after{
		display: block;
		width: 126px;
		height: 11px;
		content: url(../img/service/arrow-dotted-medium.png);
		margin: -275px 0 0 240px;
	}

	/* CONTACT */
	.block_location .rightMap {

		padding: 0px;
		overflow: hidden;
	}

}


@media (min-width: 1200px) { /* small desktop landscape */

	#mobileMenuWrapper{
		display: none;
	}
	.theContent h2 {
		/*width: 654px;*/
		width: 900px;
	}

	/*--------------------------------  WORK FIX ------*/
	.mobileShow{
		display: none;
	}
}