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 {display: block;}body {line-height: 1;font-family: segoeu;}ol, ul {list-style: none;}blockquote, q {quotes: none;}.clear{ clear:both; margin:0; padding:0;}blockquote:before, blockquote:after, q:before, q:after {content: '';content: none;}table {border-collapse: collapse;border-spacing: 0;}*{box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;}.hide{display:none !important;}input, select, textarea{ outline:none;}

/*
==================================
			GLOBAL CSS
==================================
*/

html,body{ height:100%;}
body{font-family: 'Titillium Web', sans-serif; font-size:13px; color:#5A6868; font-weight:300; background:#ffffff; line-height:1.2;}
ul, li{margin:0; padding:0; list-style:none;}
.clear{clear:both; margin:0; padding:0;}
.wrapper{width:100%; overflow:hidden; margin: 0;}
.container{position:relative;width:100%; margin:auto; padding:0 92px; box-sizing:border-box; }
img{ vertical-align:middle; max-width:100%; height:auto;}
a{-webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;}
.vspace1{ height:10px; clear:both}  
.vspace2{ height:20px; clear:both} 
.vspace3{ height:30px; clear:both}
.vspace4{ height:40px; clear:both}  
.vspace5{ height:50px; clear:both}  
/*
===================================
		   HEADER & BANNER CSS
===================================
*/
header{ float:left; width:100%; padding:35px 0 10px 0; box-sizing:border-box; position: relative; z-index: 999; background: #fff;}
.logo{ float:left;}
nav {float: right;}
nav ul li{ float:left; min-width:106px;}
nav ul li a{ text-decoration:none; color:#263838; font-size:14px; padding:13px; border-bottom:2px solid transparent; display: block; position:relative;}
nav ul li a:after {    
  background: none repeat scroll 0 0 transparent;
  bottom: 0;
  content: "";
  display: block;
  height: 2px;
  left: 50%;
  position: absolute;
  background: #009688;
  transition: width 0.3s ease 0s, left 0.3s ease 0s;
  width: 0;
}
nav ul li a:hover, nav ul li a.active{color:#009688; font-weight:600;}
nav ul li a:hover:after,nav ul li a.active:after { 
  width: 100%; 
  left: 0; 
}
.hireCandidate nav ul li a:hover,.hireCandidate nav ul li a.active{ color:#227CD0}
.hireCandidate nav ul li a:after { background: #227CD0;} 

.banner{ float:left; width:100%; background: #ffffff; padding-bottom:180px;}
.bannerLeft{width: 51%; float:left; position: relative; background:#FFF8ED; height:491px;}
.bnrBtm{float:left; width:100%; display:none;    position: relative; margin:20px 0}
.btmInner{float:left; width:100%; position: relative;}
.bnrBtm img.mobileBg{right:0; top:0px; padding:28px;}
.hireCandidate .bannerLeft{background:#EDF7FF}
.textBar {text-align: center;float:left; width:100%; padding-top:30px;}
.bnrBtm .textBar{ padding-top:0;}
.textSlider{font-size: 23px; font-weight: 700; letter-spacing: 2px; color:#FFD697; line-height:38px; padding:0 10px;}
.textSlider .slick-center{font-size: 33px; letter-spacing:0; line-height:33px;}
.hireCandidate .textSlider{color:#97CCFF}
.hireCandidate .textBar li{color:#97CCFF}
.circle { border-radius: 50%; 
  background-color: transparent;  border:1px solid rgba(255, 214, 151, 0.42); box-shadow: 0 1px 43px 0 rgba(0, 0, 0, 0.03);
  width: 550px;
  height: 550px;
  position: absolute; top:42px; left:0; right:0; margin:auto;
  opacity:0;
  animation:scaleIn  2s infinite cubic-bezier(.36, .11, .89, .32);
  -webkit-animation:scaleIn  2s infinite cubic-bezier(.36, .11, .89, .32);
  -moz-animation:scaleIn  2s infinite cubic-bezier(.36, .11, .89, .32);
  -ms-animation:scaleIn  2s infinite cubic-bezier(.36, .11, .89, .32);
}
.hireCandidate .circle{border: 1px solid rgba(151, 204, 255, 0.35);box-shadow: 0 1px 43px 0 rgba(0, 0, 0, 0.03);}  
  
  
 @keyframes scaleIn {
  from {
    transform: scale(.8, .8);
    opacity: 1;
  }
  to {
    transform: scale(1.2, 1.2);
    opacity: 0;
  }
} 

	
.phone{margin:0 auto; width:230px;  overflow:hidden; height:415px; border-radius:20px; -webkit-border-radius:20px; margin-top:110px; }
img.mobileBg { max-width:420px;
    position: absolute;
    top: 95px;
    right: 0;
    left: 0;
    margin: auto;
}

.bannerRight{float:right; width:49%; padding:112px 95px 0 127px; box-sizing:border-box;}
.bannerRight h3{width:359px; color: #263838; font-size:36px; font-weight: 300; line-height:42px; text-align: left; margin-bottom:17px;}
.bannerRight h3 strong{ font-weight:700;}
.bannerRight h6{color: #263838; font-size: 22px; font-weight: 300; line-height:34px; text-align: left;}
.bannerRight p{  line-height:18px; text-align: left; margin-bottom:28px;  padding-right: 100px;font-family: 'Titillium Web', sans-serif;}
  
.getApp{ width:335px; float:left;height:41px;  border:1px solid #979797; border-radius:19px; -webkit-border-radius:19px; -moz-border-radius:19px; padding-left:20px; -webkit-box-shadow: 0px 4px 1px 0px rgba(244,244,244,1);
-moz-box-shadow: 0px 4px 1px 0px rgba(244,244,244,1);
box-shadow: 0px 4px 1px 0px rgba(244,244,244,1);}  
.input{ border:0; width:212px; line-height:1; outline:0;padding:12px 0 8px 0; border-radius:0; margin-top: 1px;} 
input[type="number"]::-webkit-outer-spin-button, input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none;margin: 0; } 

input[type=number] {
    -moz-appearance:textfield;
}
.submit{display:block;  border:0; width:93px; float:right; text-decoration:none; text-align:center; background:#15A095; font-weight:600; color:#ffffff; height:41px; line-height:37px; font-size:12px;font-family: 'Titillium Web', sans-serif;top: -1px; cursor:pointer;
    position: relative;
    border-radius: 0 20px 20px 0; -moz-border-radius: 0 20px 20px 0; -webkit-border-radius: 0 20px 20px 0;
    right: -1px; -webkit-appearance:none;}
.hireCandidate .submit{background:#227CD0}	
.success { float:left; margin:15px 0 0 0; display:none;
  background-color: #ECFCEA;
  border-radius: 3px;
  width: 370px;
  height: 25px;padding:0 0 0 10px
}
.success img{ margin-right:5px;}
.success p{ line-height:25px; font-size:12px; font-weight:600; color:#167D02; padding-right: 0!important; }
.error,.error2{ float:left; margin:8px 0 0 0; display:none;
  background-color: #ffffff;
  border-radius: 3px;
  width: 253px;
  height: 25px;padding:0}
.error p,.error2 p{line-height:25px; font-size:12px; font-weight:600;  color:#C61C15; padding-right: 0!important;}

.androidApp{ display:block;  text-decoration:none; font-weight:600; font-size:10px; color:#15A095; margin:31px 0 0 10px; max-width:115px;}

  


/*
===================================
		   MAIN BODY CSS
===================================
*/

::-webkit-input-placeholder { color:#9D9D9D;; opacity:1; font-weight:300;font-family: 'Titillium Web', sans-serif;}
::-moz-placeholder { color:#9D9D9D;; opacity:1; font-weight:300;font-family: 'Titillium Web', sans-serif;}
:-ms-input-placeholder { color:#9D9D9D; opacity:1; font-weight:300;font-family: 'Titillium Web', sans-serif;}
:-moz-placeholder { color:#9D9D9D; opacity:1; font-weight:300;font-family: 'Titillium Web', sans-serif;}

.main{ width:100%; float:left; background-image: linear-gradient(180deg, #FFF8ED 0%, #FFFFFF 100%); padding:0 0 30px 0}
.hireCandidate .main{background-image: linear-gradient(180deg, #EDF7FF 0%, #FFFFFF 100%);}
h2{color: #263838;
  font-size: 25px;
  font-weight: 600;
  text-align: center; clear:both; margin-bottom:34px;}
h2:after{ content:""; display:block; margin:auto; width:120px; height:1px; background:#FFD697;margin-top:18px;} 
.hireCandidate h2:after{ background:#97CCFF}

.sec1{width:100%; float:left; background:#ffffff; text-align:center; font-size:0; margin:-90px 0 45px 0; padding:30px 0 33px 0; box-shadow: 0 -1px 27px 0 rgba(0, 0, 0, 0.04); -webkit-box-shadow:0 -1px 27px 0 rgba(0, 0, 0, 0.04); -moz-box-shadow: 0 -1px 27px 0 rgba(0, 0, 0, 0.04);border-radius: 16px; -webkit-border-radius: 16px; -moz-border-radius: 16px;} 
.iconBox{ display:inline-block; width:13%; margin:0 45px;}
.iconBox img{ margin-bottom:38px; display:inline-block;max-height: 52px;}
.iconBox h4{font-size: 20px;font-weight: 300;line-height: 24px;  text-align: center; margin-bottom:14px;}
.iconBox p{color: #5A6868; font-size:12px; line-height: 17px; text-align: center;}

.sec2{width:100%; float:left; padding:36px 0 0 0;}

.sec3{width:100%; float:left;box-shadow:0 2px 24px 0 rgba(0, 0, 0, 0.1); -webkit-box-shadow:0 2px 24px 0 rgba(0, 0, 0, 0.1); -moz-box-shadow:0 2px 24px 0 rgba(0, 0, 0, 0.1); border-radius:16px; -webkit-border-radius:16px; -moz-border-radius:16px; position:relative; overflow:hidden;}
video{ width:100%;}
video::-webkit-media-controls {
  display: none;
}
#playpause { cursor:pointer;    z-index: 999999;
    width: 90px;
    height: 90px;
    position: absolute; top:0; bottom:0; left:0; right:0; margin:auto;
}

footer{width:100%; float:left; background:#ffffff; padding:30px 0 0 0;}
footer h6{color: #263838;font-size: 18px; font-weight: 400; letter-spacing: 2.5px; line-height: 30px; text-align: center; margin-bottom:24px}
footer ul{font-size:0; text-align:center;}
footer ul li{ display:inline-block; font-size:18px; color:#263838; margin:0 24px;}
footer ul li a{color: #00796B; text-decoration:none; font-size: 16px; font-weight: 700; line-height: 19px; text-align: center;}
.hireCandidate footer ul li a{ color:#227CD0}
.copyright{width:100%; float:left; background:#D8D8D8; text-align:center; padding: 19px 0; margin-top:40px;}
.copyright p{color: #54747A;font-size: 12px; font-weight: 500;}



.privacy{width:100%; float:left; padding:80px 100px;background:#ffffff; margin-top:25px; box-shadow: 0 2px 24px 0 rgba(0, 0, 0, 0.1); border-radius:16px; -webkit-border-radius:16px; -moz-border-radius:16px; color:#555555}
.privacy h2{ font-size:24px; font-weight:700; text-align:center; margin-bottom:20px;}
.privacy h3{ font-size:20px; font-weight:600; text-align:left; margin-bottom:10px;}
.privacy p{ font-size:14px; line-height:20px; margin-bottom:8px;}
.privacy p strong{ font-weight:600;}
.privacy em{ font-style:italic;}
.privacy a{ color:#15A095}
.privacy ul{ margin:0 0 0 20px; clear:both;}
.privacy li{font-size:14px; line-height:20px; margin-bottom:8px; list-style-type:lower-alpha;}
.ukTable{ border:1px solid #dcdcdc;font-size:14px; line-height:20px;}
.ukTable thead{ background:#eaeaea;}
.ukTable th{ padding:10px 20px; font-weight:600; border-right:1px solid #dcdcdc; text-align:left;}
.ukTable td{ padding:10px 20px; text-align:left;border-right:1px solid #dcdcdc;}
.ukTable tr{border-bottom:1px solid #dcdcdc;}
.privacy .ukUL li{ list-style-type:lower-roman}
.privacy .ukUL li ul li{ list-style-type:lower-alpha;}
.privacy .romanLi li{ list-style-type:lower-roman!important}
.privacy .numberLi li{ list-style-type:decimal!important}
.privacy .alphaLi li{ list-style-type:lower-alpha!important}

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

@media only screen and (min-width:1023px) and (max-width:1220px)
{
	.container{ padding:0 50px}
	header{ padding:20px 0}
	.bannerLeft{ width:55%;}
	img.mobileBg{top:98px; right: 75px;}
	.bannerRight{ width:45%;padding:60px 50px;}
	.bannerRight p{ padding-right:0;}
	.outerCircle,.circle{ left:40px;}
}

@media only screen and (min-width:768px) and (max-width:1023px)
{
	.container{ padding:0 30px;}
	header{ padding:20px 0}
	
	.banner{ padding-bottom:130px;}
	.bannerLeft{ width:55%;}
	img.mobileBg{ padding:10px; right:4px;}
	.bannerRight{padding:60px 30px 0 30px;width: 45%; box-sizing:border-box;}
	.bannerRight h3{ width:100%; font-size:34px; line-height:40px;}
	.bannerRight p{ padding-right:0}
	.bannerRight p br{ display:none;}
	.bannerRight h1{ font-size:50px;    margin-bottom: 40px;}
	.getApp{ width:100%}
	.input{ width:178px;font-size: 12px;}
	.submit{ width:80px;}
	
	.circle{width: 450px; height: 450px; left:-15px; top:95px;}
	.outerCircle{transform: scale(0.8); left:0;width: 450px;  height: 450px;}
	
	.main{ padding: 0 0 20px 0;}
	
	.iconBox { width: 18%;
    margin: 0 15px;}
	
	.textSlider{ font-size:18px;}
	.textSlider .slick-center{ font-size:22px;}
	
}

@media only screen and (max-width:767px)
{
	.container{ padding:0 15px;}
	.logo{width:60px;}
	nav{ margin-top:0;}
	nav ul li{ min-width:100px;}
	nav ul li a{ padding:7px;}
	
	.banner{ padding:0 15px;}
	.bnrBtm{ display:block;}
	.bnrBtm .bannerLeft{ display:block;}
	.bannerRight{width:100%; padding:40px 0 ;}
	.lookForJob .bannerRight{padding:40px 0 0 0}
	.bannerRight h3{  width:100%; font-size:34px;}
	.bannerRight p{ padding-right:0;}
	.bannerRight p br{ display:none;}
	.bannerRight h6,.bannerRight h4{ margin-bottom:12px;}
	.bannerRight h6:after{ margin-top:5px}
	.bannerRight h1{ font-size:50px; margin-bottom: 20px;}
	.fixedInput{width:100%; position:fixed;bottom: 0;left: 0; background:#ffffff; z-index:999999999;padding: 10px;}
	.getApp{ width:100%;}	
	.input{ width:70%;}
	.bannerLeft{ display:none;}
	
	
	.main{ padding: 0 0 20px 0;}
	h2{ font-size:24px;}
	.sec1{ margin:20px 0;padding: 20px;}
	.iconBox{ width:50%;
    margin: 0;
    padding:10px;
    margin-bottom: 12px;vertical-align:top;}
	.iconBox img{ margin-bottom:10px;}
	.iconBox h4{ margin-bottom:8px; font-size:16px; line-height:20px;}
	
	.sec2{padding: 16px 0 0 0;}
	
	.privacy{ padding:15px;}
	
	footer{ padding:30px 0 0 0;}
	footer ul li{ margin:0 4px;}
	footer ul li, footer ul li a{ font-size:15px;}
	.copyright{ margin-top:15px;padding-bottom: 70px;}
	.copyright p{ font-size:11px;}
	
	img.mobileBg{ max-width:100%; right:3px;}
	
	.bnrBtm .phone{width: 198px; height:330px; margin-top:38px;}
	.bnrBtm .uk-wrapper{ margin-left:2px;}
	.bnrBtm .textSlider{ font-size:12px;}
	.bnrBtm .textSlider .slick-center{ font-size:16px;}
	
}

@media only screen and (max-width:374px)
{
	.input{ width:61%;font-size: 11px;}
	h2{ font-size:20px;}
	
	.iconBox p{ font-size:11px;}
	
	.bnrBtm .phone{ width:165px; height:305px; margin-top:35px;}
	.success{width:290px}
	.success p{font-size:10px;}
}

