html, body {
	margin:0px; 
	padding:0px; 
	background-color:#ffffff;
	width : 100%;
	-webkit-text-size-adjust: 100%;
	-moz-text-size-adjust : 100%;
	-ms-text-size-adjust : 100%;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	overflow-x : hidden;
	font-size : 13pt;	 
	color : white;
	font-family: 'Maven Pro', sans-serif;
}

ul {
	list-style-type: none;
	padding:0; 
	margin:0;
}

a {
	color : #ffffff;
	text-decoration : none;
	outline:none;
	outline: 0;
}

p {
	margin : 0;
	padding : 0;
}

input, select, textarea{
	box-sizing: border-box; /* css3 rec */
    -moz-box-sizing: border-box; /* ff2 */
    -ms-box-sizing: border-box; /* ie8 */
    -webkit-box-sizing: border-box; /* safari3 */
    -khtml-box-sizing: border-box; /* konqueror */
    color: white;
	background-color : #3EC4D0;	
	font-size : 12pt;
	padding : 2px;
}

.mainContent {
	background-image : url('../imgs/bg/blue-bg.jpg');
	background-size : 100px 100px;
	background-repeat : repeat;
	background-color : #3BC4CE;
	position : relative;
	width : 100%;
	z-index : 1;
	overflow-x : hidden;
}

.mainPage {
	position : relative;
	width : 100%;
	overflow : hidden;
}

.puzzleBg {
	position : absolute;
	background: url('../imgs/home/home-puzzle-shadow.png') no-repeat;
	background-size: cover;
	background-position : center;
	border : 0px solid black;
	z-index : 2;
}

.puzzle {
	position : absolute;
	background: url('../imgs/home/home-puzzle.png') no-repeat;
	background-size: cover;
	background-position : center;
	border : 0px solid black;
	z-index : 3;	
}

.puzzleMobile {
	display : none;
}

.hand {
	position : absolute;
	background: url('../imgs/home/puzzle-hand.png') no-repeat;
	background-size: cover;
	background-position : center;
	border : 0px solid black;
	z-index : 4;		
}

.workForYou {
	border : 0px solid black;
	position : absolute;
	font-weight : 900;
	font-size : 26pt;
    opacity: 0.4;
    filter: alpha(opacity=40); /* For IE8 and earlier */	
	text-align : center;
}

.arrowDown {
	width : 68px;
	height : 47px;
	position : absolute;
	background: url('../imgs/home/arrow-down.png') no-repeat;
	background-size: cover;
	background-position : center;
	border : 0px solid black;
	bottom : 15px;
	left : 50%;
	margin-left : -35px;
}

.menuButton {
	width : 49px;
	height : 38px;
	position : fixed;
	right : 20px;
	top : 20px;
	background: url('../imgs/home/main-navi.png') no-repeat;
	background-size: contain;
	background-position : center;	
	z-index : 4;
	cursor : pointer;
}

.menu {
	position : fixed;
	top : 0px;
	left : 100%;
	width : 180px;
	height : 100%;
	z-index : 99;
	background-color : black;
}

.homeButton {
	margin-top : 5px;
}

.menu ul li{
	width : 100%;
	padding : 15px 30px;
	font-weight : 700;
	cursor : pointer;
	font-size : 14pt;
	color : #78D2DB;
}

.menu ul li:hover {
	color : white;
}

.aboutUs {
	position : relative
}

.aboutImg {
	position : relative;
	width : 94px;
	height : 75px;
	background: url('../imgs/about-us/about-icon.png') no-repeat;
	background-size: cover;
	background-position : center;
	margin : auto;
	margin-top : 40px;
	border : 0px solid black;	
}

.aboutUsTitle {
	font-size : 40pt;
	text-align : center;
	font-weight : 900;
	margin-top : 10px;
}

.aboutDesc {
	width : 700px;
	margin : auto;
	text-align : center;
	font-weight : 500;
	margin-top : 10px;	
}

.aboutSmallP {
	margin-top : 5px;
}

.aboutSmallPExtra {
	margin-top : 20px;
}

.boldText {
	font-weight : 900;
}

.ourService {
	margin : auto;
	margin-top : 100px;
	width : 100%;
	min-height : 500px;
	overflow : hidden;
	background-image : url('../imgs/bg/blue-bg.jpg');
	background-size : 100px 100px;
	background-repeat : repeat;	
	position : relative;
}

.curveOutsideOurService {
	background-image : url('../imgs/bg/bluetolight.jpg');
	background-size : cover;
	background-repeat : repeat;
	background-position : center;	
	position : absolute;
	width : 100%;
	height : 500px;
	z-index : 1;
	bottom : 0px;
	border : 0px solid black;
}

.ourServiceWordColumn {
	position : relative;
	width : 900px;
	margin : auto;
	z-index : 2;	
}

.ourServiceGuy {
	display : inline-block;
	position : relative;
	vertical-align : top;
	width : 349px;
	height : 166px;
	background: url('../imgs/service/service-icon.png') no-repeat;
	background-size: contain;
	background-position : center;
}

.ourServiceDetailColumn {
	vertical-align : top;
	display : inline-block;
	position : relative;
	width : 730px;	
	margin-left : -180px;
	margin-top : -10px;
}

.ourServiceTitle {
	font-size : 40pt;
	text-align : left;
	font-weight : 900;
	margin-top : 0px;
	border : 0px solid black;
}

.ourServiceDetail {
	margin-top : 10px;
}

.aboutUsSlogan {
	width : 1100px;
	margin : auto;	
	margin-top : 40px;
}

.attitudeColumn {
	display : inline-block;
	position : relative;
	width : 363px;
	margin-right : 4px;
	border : 0px solid white;
	vertical-align : top;
	background-color : #70CCD7;
	height : 420px;
}

.beliefColumn {
	display : inline-block;
	position : relative;
	width : 363px;
	margin-right : 4px;
	border : 0px solid white;
	vertical-align : top;
	height : 420px;
	background-color : #70CCD7;	
}

.creativeColumn {
	display : inline-block;
	position : relative;
	width : 363px;
	border : 0px solid white;
	vertical-align : top;
	height : 420px;
	background-color : #70CCD7;	
}

.attitudeImg {
	display : inline-block;
	position : relative;
	vertical-align : top;
	margin-left : 15px;
	width : 192px;
	height : 193px;
	background: url('../imgs/about-us/atitude.png') no-repeat;
	background-size: contain;
	background-position : center;	
}

.beliefImg {
	display : inline-block;
	position : relative;
	vertical-align : top;
	width : 192px;
	height : 193px;
	background: url('../imgs/about-us/belief.png') no-repeat;
	background-size: contain;
	background-position : center;	
}

.creativeImg {
	display : inline-block;
	position : relative;
	vertical-align : top;
	width : 192px;
	height : 193px;
	margin-left : 15px;
	background: url('../imgs/about-us/creative.png') no-repeat;
	background-size: contain;
	background-position : center;	
}

.aboutUsSloganTitle {
	position : relative;
	width : 390px;
	margin : auto;
	z-index : 3;
}

.beliefColumn .aboutUsSloganTitle {
	width : 330px;
}

.aboutUsSloganTitle .title{
	display : inline-block;
	position : relative;
	vertical-align : bottom;
	font-size : 24pt;
	margin-left : -10px;
}

.titleHead {
	font-size : 30pt;
	font-weight : 700;
}

.titleTail {
    opacity: 0.6;
    filter: alpha(opacity=60); /* For IE8 and earlier */	
}

.aboutUsDetailDescColumn {
	position : relative;
	margin-top : 20px;
	font-size : 12pt;
	z-index : 4;
}

.aboutUsDetailDescColumn ul{
	margin-left : 30px;
}

.aboutUsDetailDescColumn ul li {
	margin-top : 10px;
	list-style-type: disc;
	color : white;
	margin-left : 0;
	left : 0;
	padding-right : 10px;
}

.aboutUsDetailDescColumn ul li span{
	color : #196468;
}

.curveBg {
	position : absolute;
	background-color : white;
	width : 100%;
	height : 100%;
	z-index : 2;
    opacity: 0.3;
    filter: alpha(opacity=30); /* For IE8 and earlier */	
}

.curveInside {
	width : 100%;
	height : 100px;
	background-color : white;
	position : absolute;
    opacity: 0;
    filter: alpha(opacity=0); /* For IE8 and earlier */		
}

.curveOutside {
	background-image : url('../imgs/bg/services-curve.jpg');
	background-size : cover;
	background-repeat : no-repeat;
	background-position : center;
	position : absolute;
	width : 100%;
	height : 41px;
	z-index : 3;
}

.serviceChartContainer {
	margin : auto;
	width : 966px;
	height : 942px;
	position : relative;
	z-index : 2;
}

.serviceChart {
	width : 848px;
	height : 854px;
	background-image : url('../imgs/service/services-chart.png');
	background-size : contain;
	background-repeat : no-repeat;	
	background-position : center;	
	position : absolute;
	left : 60px;
	top : 40px;
	z-index : 3;
}

.serviceChartBg {
	position : relative;
	margin : auto;
	margin-top : 100px;
	width : 966px;
	height : 942px;
	background-image : url('../imgs/service/services-chart-shadow.png');
	background-size : contain;
	background-repeat : no-repeat;	
	border : 0px solid black;
    opacity: 0.6;
    filter: alpha(opacity=60); /* For IE8 and earlier */		
}

.ourTeam {
	margin-top : -400px;
	overflow : hidden;
	width : 100%;
	background-image : url('../imgs/bg/second-bluebg.jpg');
	background-size : 100px 100px;
	background-repeat : repeat;		
}

.dashLine {
	position : relative;
	margin : auto;
	margin-top : -400px;	
	width : 909px;
	height : 1301px;
	margin-bottom : 200px;
}

.dashLineImg {
	top : 0px;
	position : absolute;
	width : 909px;
	height : 1301px;
	background-image : url('../imgs/our-team/dash-line.png');
	background-size : cover;
	background-repeat : no-repeat;		
}

.keatColumn {
	position : absolute;
	left : -90px;
	top : 520px;
	display : none;
}

.personImg {
	width : 246px;
	height : 285px;
	background-size : contain;	
	background-repeat : no-repeat;	
	background-position : center;
	z-index : 3;
	position : relative;
}

.personImgSecond {
	width : 207px;
	height : 257px;
	background-size : contain;	
	background-repeat : no-repeat;	
	background-position : center;	
	z-index : 3;
	position : relative;
}

#personKeat {
	background-image : url('../imgs/our-team/keet.png');
}

.andyColumn {
	position : absolute;
	left : 340px;
	top : 520px;
	display : none;	
}

#personAndy {
	background-image : url('../imgs/our-team/andy.png');
}

.pennyColumn {
	position : absolute;
	left : 770px;
	top : 520px;
	display : none;	
}

#personPenny {
	background-image : url('../imgs/our-team/penny.png');
}


.veronColumn {
	position : absolute;
	left : 90px;
	top : 880px;
	display : none;	
}

#personVeron {
	background-image : url('../imgs/our-team/veron.png');
}

.janielColumn {
	position : absolute;
	left : 600px;
	top : 880px;
	display : none;	
}

#personJaniel {
	background-image : url('../imgs/our-team/janiel.png');
}

.personShadow {
	top : 0px;
	left : -15px;
	position : absolute;
	width : 296px;
	height : 296px;
	background-image : url('../imgs/our-team/row1-shadow.png');
	background-size : cover;	
	background-repeat : no-repeat;	
	z-index : 2;
}

.personShadowSecond {
	top : -15px;
	left : -35px;
	position : absolute;
	width : 296px;
	height : 296px;
	background-image : url('../imgs/our-team/row1-shadow.png');
	background-size : cover;	
	background-repeat : no-repeat;	
	z-index : 2;
}

.careerColumn {
	position : absolute;
	left : 340px;
	top : 1200px;	
	display : none;	
	cursor : pointer;
}

#personCareer {
	width : 207px;
	height : 257px;
	background-image : url('../imgs/our-team/vacancy.png');
}

.personShadow2 {
	top : 0px;
	left : -10px;
	position : absolute;
	width : 263px;
	height : 263px;
	background-image : url('../imgs/our-team/row2-shadow.png');
	background-size : cover;	
	background-repeat : no-repeat;	
	z-index : 2;	
}

.personName {
	text-align : center;
	color : #196468;	
	font-weight : 900;	
}

.personTitle {
	text-align : center;	
	color : #196468;	
}

.ourProject {
	width : 100%;
	padding-top : 100px;
	overflow : hidden;
	background-image : url('../imgs/bg/light-blue-bg.jpg');
	background-size : 100px 100px;
	background-repeat : repeat;	
	position : relative;
}

.curveOutsideOurProject {
	background-image : url('../imgs/bg/lighttolightblue.jpg');
	background-size : cover;
	background-repeat : repeat;
	position : absolute;
	width : 100%;
	height : 200px;
	z-index : 1;
	top : 0px;
}	

.ourContact {
	background-image : url('../imgs/bg/white-bg.jpg');
	background-size : 100px 100px;
	background-repeat : repeat;
	width : 100%;
	padding-top : 100px;
	overflow : hidden;
	position : relative;	
}

.curveOutsideOurContact {
	background-image : url('../imgs/bg/lighttowhite.jpg');
	background-size : cover;
	background-repeat : repeat;
	position : absolute;
	width : 100%;
	height : 155px;
	z-index : 1;
	top : 0px;
}

.contactForm {
	width : 900px;
	margin : auto;
	padding-top : 200px;
}

.skipHeadache {
	position : absolute;
	top : -140px;
	left : 130px;
	border : 0px solid black;
	color : #196468;
	width : 583px;
	height : 146px;
	background-image : url('../imgs/contact/talk-bubble.png');
	background-size : contain;
	background-repeat : no-repeat;	
	font-size  : 18pt;
	text-align : center;
	z-index : 2;
	font-weight : 500;
}

.skipRow1 {
	margin-top : 35px;
}

.skipRow2 {
	margin-top : 10px;
}

.contactLogo {
	width : 248px;
	height : 83px;
	background-image : url('../imgs/contact/small-logo.png');
	background-size : contain;
	background-repeat : no-repeat;	
	border : 0px solid blue;
}

.addressColumn {
	display : inline-block;
	position : relative;
	color : #196468;
	font-size : 12pt;
	vertical-align : top;
	width : 45%;
}

.companyName {
	margin-top : 5px;
}

.companyBold {
	font-weight : 900;
}

.addressColumn a {
	color : #196468;
}

.formColumn {
	display : inline-block;
	position : relative;
	vertical-align : top;
	width : 40%;
}

.snamerow {
	width : 48%;
	display : inline-block;
	position : relative;
	vertical-align : top;
}

.semailrow {
	margin-left : 2%;
	width : 50%;
	display : inline-block;
	position : relative;
	vertical-align : top;	
}

#sname {
	width : 100%;
}

#semail {
	width : 100%;	
}

.smsgrow {
	width  : 100%;
	margin-top : 5px;
}

#smsg {
	width  : 100%;
	height : 130px;
	font-family: 'Maven Pro', sans-serif;	
}

.submitButton {
	border : 0px solid black;
	display : inline-block;
	position : relative;
	width : 15%;
	height : 121px;
	background-image : url('../imgs/contact/send-butt.png');
	background-size : contain;
	background-position : center;
	background-repeat : no-repeat;
	cursor : pointer;
	margin-top : 10px;
}

.error {
	color : red;
	height : 15px;
	margin-top : -18px;
	margin-bottom : 3px;
	font-size : 10pt;
}

.copy {
	width : 100%;
	position : relative;
	padding-top : 100px;
	font-size : 10pt;	
	overflow : hidden;
	background-image : url('../imgs/bg/white-bg.jpg');
	background-size : 100px 100px;
	background-repeat : repeat;
	padding-bottom : 10px;
	color : #51CADB;
}

.copyWriteUp {
	width : 100%;
	text-align :center;
}

.backToTop {
	position : absolute;
	right : 20px;
	bottom : 10px;
	cursor : pointer;
}

.popJoin {
	position : fixed;
	display : none;
	z-index : 20;
	top : 0px;
	left : 0px;
	width : 650px;
	height : 350px;
	color : #4D64A4;
}

.popBg {
	position : absolute;
	width : 100%;
	height : 100%;
	background-color : black;
    opacity: 0.5;
    filter: alpha(opacity=50); /* For IE8 and earlier */
	top : 0px;
	left : 0px;
	cursor : pointer;
	z-index: 19;
	display : none;
}

.popJoinContainer {
	position : relative;
	width : 100%;
	height : 100%;
	padding : 20px 30px;
	background-color: white;
	border-radius : 20px;	
}

.popTitle {
	font-size : 16pt;
	font-weight : 900;
}

.popRow {
	margin-top : 10px;
}

.popRow a {
	color : #4D64A4;
	font-weight : 700;
}

.popSmallTitle {
	display : inline-block;
	position : relative;
	width : 30%;
}

.popInput {
	display : inline-block;
	position : relative;	
	width : 70%;
}

.popInput input {
	width : 100%;
}

.furtherRow {
	margin-top : 40px;
}

.popRowSmallLetter {
	font-size : 11pt;
}

.popRowFirst {
}

.submitPop {
	padding : 5px 10px;
	font-weight : 900;
	background-color : #4D64A4;	
	color : white;
	position : absolute;
	right : 0px;
	cursor : pointer;
}

.popError {
	margin-top : 10px;
	height : 10px;
	color : red;
	font-size : 10pt;
}

.personScale {
	-webkit-animation: scale 200ms ease-out;
	-moz-animation: scale 200ms ease-out;
	-o-animation: scale 200ms ease-out;
	animation: scale 200ms ease-out;	
}

::-webkit-input-placeholder {
	color : white;
}

:-moz-placeholder { /* Firefox 18- */
	color : white;
}

::-moz-placeholder {  /* Firefox 19+ */
	color : white;
}

:-ms-input-placeholder {  
	color : white;
}

.overTower {
	width : 200px;
	height : 200px;
	z-index : 99;
	top : 0px;
	left : 0px;
	border : 1px solid black;
}

/* bounce */
/* Webkit, Chrome and Safari */
@-webkit-keyframes bounce {
  0% {
	-webkit-transform:translateY(-10%);
  }
  20% {
  	-webkit-transform:translateY(-0%);
  }
  40% {
  	-webkit-transform:translateY(-10%);
  }
  60% {
  	-webkit-transform:translateY(0);
  }
  80% {
  	-webkit-transform:translateY(-5%);	
  }
  100% {
  	-webkit-transform:translateY(0);
  }
}

/* Mozilla Firefox 15 below */
@-moz-keyframes bounce {
  0% {
	-moz-transform:translateY(-10%);
  }
  20% {
  	-moz-transform:translateY(-0%);
  }
  40% {
  	-moz-transform:translateY(-10%);
  }
  60% {
  	-moz-transform:translateY(0);
  }
  80% {
  	-moz-transform:translateY(-5%);	
  }
  100% {
  	-moz-transform:translateY(0);
  }
}

/* Opera 12.0 */
@-o-keyframes bounce {
  0% {
	-o-transform:translateY(-10%);
  }
  20% {
  	-o-transform:translateY(-0%);
  }
  40% {
  	-o-transform:translateY(-10%);
  }
  60% {
  	-o-transform:translateY(0);
  }
  80% {
  	-o-transform:translateY(-5%);	
  }
  100% {
  	-o-transform:translateY(0);
  }
}

@keyframes bounce {
  0% {
	transform:translateY(-10%);
  }
  20% {
  	transform:translateY(-0%);
  }
  40% {
  	transform:translateY(-10%);
  }
  60% {
  	transform:translateY(0);
  }
  80% {
  	transform:translateY(-5%);	
  }
  100% {
  	transform:translateY(0);
  }
}

/* end bounce */

/* scale */
@keyframes scale {
  0% {
	transform:scale(0,0);
  }
  20% {
  	transform:scale(0.2,0.2);
  }
  40% {
  	transform:scale(0.4,0.4);
  }
  60% {
  	transform:scale(1,1);
  }
  80% {
  	transform:scale(1.1,1.1);
  }
  100% {
  	transform:scale(1,1);
  }
}
/* end scale */