@import url(https://fonts.googleapis.com/css?family=Titillium+Web:400,600);

*:focus{outline:none;}
::-moz-selection {background-color: #dc1b21; color: #FFF;}
::selection {background-color: #dc1b21; color: #FFF;} /* Works in Safari */ 

html, body{width:100%; height:100%; margin:0px; padding:0px; -webkit-font-smoothing: subpixel-antialiased;  overflow-x: hidden; -webkit-overflow-scrolling: touch;}
body{background-color:rgba(255,255,255,1); font-family: 'Titillium Web', sans-serif; font-weight:400; color:rgba(110,110,110,1); font-size:62.5%; line-height: normal;}

h1, h2, h3, p, ul{ margin:0px; padding:0px; font-weight:normal;}

h1, 
h2,
h3{color:rgba(22,22,22,1); font-size:2.4em; text-transform:uppercase; font-weight:600; line-height:1em; padding-bottom:15px;}

h1 span, 
h2 span{font-size:.8em; display:block; line-height:1em;}

h2{ font-size:2.4em; font-weight:400; text-transform: capitalize;}
h3{ font-size:1.5em; font-weight:600; text-transform: uppercase; color:rgba(220,27,33,1); padding:0px; margin:0px; margin-bottom:5px;}


a{text-decoration:none; }
a:hover, a.current{}

.icons{ background:url(../images/icons.png) no-repeat;}
.transitions{-webkit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; -o-transition-duration: 0.3s; -ms-transition-duration: 0.3s; transition-duration: 0.3s;}


.cta{display:block; float:left; padding:10px 30px 0px 30px; height:26px; background:rgba(22,22,22,1); margin:0px 0px 0px 0px; color:rgba(255,255,255,1); text-transform:uppercase; font-weight:600; font-size:1.1em;}
.cta:hover{background:rgba(220,27,33,1)}

.cta_red{background:rgba(220,27,33,1); border:1px solid rgba(22,22,22,1); color:rgba(22,22,22,1)}
.cta_red:hover{background:rgba(22,22,22,1); color:rgba(255,255,255,1)}

._txtF, ._txtA{font-family: 'Titillium Web', sans-serif; border:0; color:rgba(110,110,110,1); padding:2%; font-size:1.3em; border:1px solid rgba(215,215,215,1); -webkit-appearance: none; width:43%; margin-right:2%; margin-bottom:2%;}
._txtF:focus, ._txtA:focus{ border:1px solid rgba(170,170,170,1);}
._txtA{ width:93%; height:175px;}

#main{width:100%; height:100%;}
.container{width:980px; padding:0px 10px 0px 10px; margin:0 auto;}


#topbar{height:62px; background:rgba(255,255,255,1); position: fixed; z-index:99; width:100%;}
#logo{ float:left; width:277px; height:47px; background:rgba(255,255,255,1)}
#logo a{ display:block; width:254px; height:23px; background:url(../images/logo.png) no-repeat; text-indent:-9999px; margin:18px 0px 0px 12px;}

#navigation{ float:left; width:493px; height:62px; padding-left:10px; background:rgba(22,22,22,1)}
#navigation ul li{display:inline-block; list-style:none; padding:20px 12px 0px 12px;}
#navigation ul li a{color:rgba(255,255,255,1); text-transform:uppercase; font-size:1.3em;}
#navigation ul li a:hover,
#navigation ul li a.current{color:rgba(220,27,33,1);}

#social_block{float:right; background:rgba(220,27,33,1); width:200px; height:62px;}
#social_block h1{ font-size:1.2em; color:rgba(255,255,255,1); font-weight:400; width:50px; height:42px; padding:20px 10px 0px 10px; float:left;}
#social_block h1 small{ font-size:.95em; display:block;}
#social_block ul li{ float:left; list-style:none; border-left:1px solid rgba(196,26,27,1); width:30px; padding-left:12px; height:62px;}
#social_block ul li a{ display:block; text-indent:-9999px; width:16px; height:16px; margin-top:23px;}
#social_block ul li a.googleplus{ background-position:0px -90px;}
#social_block ul li a.linkedin{background-position:-17px -90px;}
#social_block ul li a.twitter{background-position:-35px -90px; margin-top:25px;}

#social_block ul li a.googleplus:hover{ background-position:0px -107px;}
#social_block ul li a.linkedin:hover{background-position:-17px -107px;}
#social_block ul li a.twitter:hover{background-position:-35px -107px;}



#header{ min-height:639px;}
#header_inner{height:350px; overflow:hidden; position:relative;}
#header_inner img{ position:absolute; left:50%; top:0px; margin-left:-960px;}
.header_info{position:absolute; left:50%; top:20%; color:rgba(22,22,22,1); color:rgba(255,255,255,1); text-transform:uppercase; font-size:3.6em; line-height:.95em;}
.header_info span{color:rgba(196,26,27,1); font-size:1.3em;}
._slide01{ left:55%; top:150px; font-size:2.6em;}
._slide02{ left:48%; top:430px; color:rgba(0,0,0,1)}
._slide03{ left:48%; top:120px; color:rgba(0,0,0,1); font-size:2.6em;}
._solutions{ left: 60%; top:150px; font-size:3em;}
._whoweare{ left: 60%; top:180px; font-size:2.6em;}
._industries{ left: 28%; top:160px; font-size:2.6em;}
._globalreach{left: 34%; top:180px; font-size:2.6em; text-align:center;}

#content{ margin:50px 0px 0px 0px;}
#content p{ font-size:1.5em; line-height:1.4em;  padding-bottom:20px;}
#content p.larger{ font-size:1.7em; line-height:1.2em;}

.fluid{ width:100%; padding:50px 0px 50px 0px; margin:50px 0px 20px 0px;}
.fluid_content{ text-align:center; width:85%; margin:0 auto;}
.red{background:rgba(220,27,33,1)}
.red h2{ color:rgba(255,255,255,1);}
.red p{ color:rgba(255,255,255,1)}

.grey{background:rgba(240,240,240,1)}
.col_60{ width:50%; padding-right:10%; float:left;}
.col_40{ width:37%; float:right;}
.col_half{ float:left; width:45%; margin-right:5%}
.half_left{margin-right:0%; margin-left:5%;}

#twitter_block{ height:130px; overflow: scroll;}
#twitterB{ width:25%; margin-bottom:20px;}
#twitterB h3{ padding-bottom:10px;}
.twitter_img{ width:100%; height:auto;}
.hp_solution{ margin:0 auto; width:50%; text-align:center;}

.services_block{margin-top:20px}
.services_block h2, 
.services_block p{color:rgba(22,22,22,1);}
.services_ico{ border:1px solid rgba(22,22,22,1); border-radius:50%; width:120px; height:120px; margin:0px 0px 20px 0px;}
.services_ico span{ display:block;}
.bridging,
.search{ width:61px; height:61px; background-position:-61px 0px; margin:0 auto; margin-top:27px;}
.search{background-position:0px 0px;}

.logo_min{ border:0px solid rgba(240,240,240,1)}


.block_header{ width:124px; height:124px; border:1px solid rgba(22,22,22,1); border-radius:50%; margin:0 auto; margin-bottom:10px;}
.block_header span{ display:block; width:61px; height:62px; margin:0 auto; margin-top:30px;}
._search{ background-position:0px 0px;}
._leadership{ background-position:-62px 0px;}

.block_content{ text-align:center;}
.block_content p{ font-size:1.5em; line-height:1.4em; width:85%; margin:0 auto; padding-bottom:20px;}

#industries_block{ margin:100px 0px 50px 0px;}
#industries_block h2{ font-size:1.6em; font-weight:600; width:35%; margin:0 auto; text-align:center; text-transform:uppercase; margin-bottom:20px;}
#timeline{ position:relative; width:2px; background:rgba(215,215,215,1); margin:0 auto;}
.point{width:330px; margin:0px 0px 50px 0px;}
.point_block{ width:10px; height:10px; background:rgba(255,255,255,1); border:2px solid rgba(215,215,215,1); border-radius:50%; margin-top:5px;}
.ico{margin-bottom:10px; float:right !important;}
.point h3{ clear:both;}
.point p{ font-size:1.3em !important; line-height:1em;}

._left{ margin-left:-350px;}
._right{ margin-left:20px;}

._left .point_block{ float:right; margin-right:-28px;}
._left .ico{ float:right;}
._left h3,
._left p{ text-align:right}

._right .point_block{float:left; margin-left:-26px;}
._right .ico{ float:left !important;}
._right h3,
._right p{ text-align:left}

.logos{display:block; margin-bottom:20px; text-align:center;}
._financial{ width:23px; height:25px; background-position:0px -64px;}
._realEstate{ width:23px; height:25px; background-position:-24px -64px;}
._diversifiedGroups{ width:24px; height:25px; background-position:-48px -64px;}
._it{ width:24px; height:25px; background-position:-73px -64px;}
._manufacturing{ width:24px; height:25px; background-position:-98px -64px;}
._consumer{width:17px; height:24px; background-position:-55px -90px;}

.circles_block{ position:relative; width:100%; margin:50px 0px 0px 0px;}
.circles_block p{ font-size:1.3em; line-height:1.3em; padding-bottom:10px;}

.left_block{ float:left; width:270px; margin-right:10px; padding:10px 0px 10px 0px;}
.center_block{ float:left; width:404px; padding:10px 0px 10px 0px;}
.right_block{ float:left; width:270px; margin-left:10px; padding:10px 0px 10px 0px;}

.circles_5, 
.circles_3{background:url(../images/circles_5.png) no-repeat; background-position:center; width:404px; height:262px; position:relative;}
.circles_3{background:url(../images/circles_3.png) no-repeat;}

.circles_5 p,
.circles_3 p{ display:block; width:110px; 	color:rgba(255,255,255,1); line-height:1em; text-align:center; text-transform:uppercase; position:absolute; font-size:1.2em; font-weight:600;}

._01{left:15px; top:72px;}
._02{ left:148px; top:72px;}
._03{ left:282px; top:65px;}
._04{ left:80px; top:195px;}
._05{ left:220px; top:190px;}
._06{ left:79px; top:65px;}
._07{ left:220px; top:65px;}
._08{ left:147px; top:185px;}


.centered{text-align:center; width:320px; margin-left:40px;}
.rightside{ text-align:right; margin:0px 120px 0px 150px;}
.alignedR{ text-align:right;}

#map_canvas{ width:100%; height:100%;}
#alert_msg{ margin:20px 0px 0px 0px;}
#alert_msg p{color:rgba(255,0,0,1); font-size:1.3em; font-weight:600;}



#footer{ min-height:53px}
.inner_footer{ border-top:1px solid rgba(240,240,240,1); padding-top:20px;}
#footer_left{ float:left; font-weight:600; font-size:1.3em; color:rgba(120,120,120,1)}
#footer_left p{ display:block; float:left; margin-right:10px; padding-top:5px;}
#footer_left a{ display:block; float:left; margin-right:10px;}
#footer_left a:hover{ color:rgba(120,120,120,1)}
#footer_right{ float:right;}
.clear{clear:both;}

.dubaifreelancedesigner{ background:url(../images/dubaifreelancedesigner.png) no-repeat; background-position:right top; width:55px; height:17px;  display:block; -webkit-transition-duration: 0.4s; -moz-transition-duration: 0.4s; -o-transition-duration: 0.4s; -ms-transition-duration: 0.4s; transition-duration: 0.4s; font-size:11px !important; text-align:left; margin:0px 0px; text-decoration:none; font-weight:700; color:rgba(120,120, 120,1); float:right; padding-top:4px;}
.dubaifreelancedesigner:hover{ background-position:right bottom; text-decoration:none !important;}


@media screen and (min-width:768px) and (max-width:960px){
body{-webkit-text-size-adjust: none;}
.container{ width:96%; padding:0px; margin:0 auto;}
#topbar{width:100%; background:rgba(255,255,255,1); position:static; margin-left:0px; z-index:99; height:62px;}
#navigation{ display:none;}
#social_block{margin-right:-2%;}
.js #menu {display:none;}
.js .slicknav_menu {display:block;}
.fluid_content{ text-align: left; width:100%; margin:0;}
.col_60{ width:50%; padding-right:10%; float:left;}
.col_40{ width:37%; float:right;}
.col_half{ float:left; width:45%; margin-right:5%}
.half_left{margin-right:0%; margin-left:5%;}
.left_block{ float: none; width:94%; margin:0px; padding:0px; text-align:center; margin:0 auto; margin-bottom:30px;}
.center_block{ float: none; width:94%; padding:0px; text-align:center; margin:0 auto; margin-bottom:30px;}
.right_block{ float: none; width:94%; margin:0px; padding:0px; text-align:center; margin:0 auto; margin-bottom:30px;}
.centered{text-align:center; width:94%; margin-left:0px; margin:0 auto !important;}
.rightside{ text-align: center; margin:0px; width:94%; margin:0 auto; margin-bottom:30px;}
.alignedR{ text-align: center;}
.circles_5 p,
.circles_3 p{width:100%; font-size:1.1em;}
.circles_5, 
.circles_3{width:320px; height:208px; background-size: 320px 208px;}
._01{left:-105px; top:50px;}
._02{ left:0px; top:50px;}
._03{ left:107px; top:44px;}
._04{ left:-55px; top:150px;}
._05{ left:54px; top:145px;}
._06{ left:-56px; top:50px;}
._07{ left:57px; top:50px;}
._08{ left:0px; top:145px;}
.logos{ text-align:left}
}

/*smart tablets devices*/
@media screen and (min-width:481px) and (max-width:768px){
body{-webkit-text-size-adjust: none;}
.container{ width:96%; padding:0px; margin:0 auto;}
#topbar{width:100%; background:rgba(255,255,255,1);  position:static; margin-left:0px; z-index:99;}
#navigation{ display:none;}
#social_block{margin-right:-2%;}
.js #menu {display:none;}
.js .slicknav_menu {display:block;}
#header_inner{height:250px; font-size:.8em;}
#header_inner img{ position:absolute; left:0%; top:0px; margin-left:-350px; height:100%;}
._solutions,
._whoweare,
._industries{ left: auto; right:20px !important; top:80px; font-size:3em;}
._globalreach{left: 24%; top:160px; font-size:2.6em; text-align:center;}
.fluid_content{ text-align: left; width:100%; margin:0;}
.block_header{ float:left;}
.block_content{ text-align: left; clear:both;}
.block_content p{width:100%;}
.col_60{ width:100%; padding-right:0%; margin-bottom:40px;}
.col_40, #twitterB{width:100%;}
.twitter_img{ width: auto;}
.col_half{width:100%; margin-right:0%; margin-bottom:40px;}
.half_left{margin-right:0%; margin-left:0%;}
.services_ico{ margin-bottom:20px; float:left;}
.centered{text-align: left;}
.left_block{ float: none; width:100%; margin:0px; padding:0px; margin:0 auto; margin-bottom:30px;}
.center_block{ float: none; width:100%; padding:0px; margin:0 auto; margin-bottom:30px;}
.right_block{ float: none; width:100%; margin:0px; padding:0px; margin:0 auto; margin-bottom:30px;}
.centered{width:100%; margin-left:0px; margin:0 auto !important;}
.rightside{ text-align: left; margin:0px; width:100%; margin:0 auto; margin-bottom:30px;}
.alignedR{ text-align: left;}
.circles_5 p,
.circles_3 p{width:100%; font-size:1.1em;}
.circles_5, 
.circles_3{width:320px; height:208px; background-size: 320px 208px;}
._01{left:-105px; top:50px;}
._02{ left:0px; top:50px;}
._03{ left:107px; top:44px;}
._04{ left:-55px; top:150px;}
._05{ left:54px; top:145px;}
._06{ left:-56px; top:50px;}
._07{ left:57px; top:50px;}
._08{ left:0px; top:145px;}

.logos{ text-align:left}
#industries_block h2{width:75%;}
#timeline{ float:left; margin-left:10px;}
.point{width:450px; margin:0px 0px 50px 0px;}
.ico{margin-bottom:10px; float: left !important;}
.point h3{ clear:both;}
.point p{ font-size:1.4em !important; line-height:1em;}
.hp_solution{ margin:0px; width:100%; text-align: left;}

._left{ margin-left:20px;}
._right{ margin-left:20px;}

._left .point_block{ float:left; margin-left:-26px;}
._left .ico{ float:left !important;}
._left h3,
._left p{ text-align: left}

._right .point_block{float:left; margin-left:-26px;}
._right .ico{ float:left !important;}
._right h3,
._right p{ text-align:left}
}

/*smart phone devices*/
@media screen and (min-width:320px) and (max-width:480px){
body{-webkit-text-size-adjust: none;}
.container{ width:96%; padding:0px; margin:0 auto;}
#topbar{width:100%; background:rgba(255,255,255,1); position:static; margin-left:0px; z-index:99; height:62px;}
#navigation{ display:none;}
.js #menu {display:none;}
.js .slicknav_menu {display:block;}
#header_inner{height:250px; font-size:.7em;}
#header_inner img{ position:absolute; left:0%; top:0px; margin-left:-500px; height:100%;}
._slide01, ._slide02, ._slide03{ left:20px; top:80px; font-size:2em; display:none;}
._solutions,
._whoweare, 
._industries,
._globalreach{ display:none;}
.block_header{ float:left;}
.block_content{ text-align: left; clear:both;}
.block_content p{width:100%;}
.col_60{ width:100%; padding-right:0%; margin-bottom:40px;}
.col_40, #twitterB{ width:100%; margin-bottom:40px;}
.twitter_img{ width: auto;}
.fluid_content{ text-align: left; width:100%; margin:0;}
.col_half{width:100%; margin-right:0%; margin-bottom:40px;}
.half_left{margin-right:0%; margin-left:0%;}
.services_ico{ margin:0 auto; margin-bottom:20px;}
.centered{width:100%; text-align: left; margin-left:0px; margin:0 auto !important;}
.rightside{ text-align: left; margin:0px; width:100%; margin:0 auto; margin-bottom:30px;}
#logo{ float:left; width:200px; height:40px; background:rgba(255,255,255,1)}
#logo a{background-size: 200px 18px; margin-top:27px;}
#social_block{width:130px; margin-right:-2%;}
#social_block h1{ display:none;}
.left_block{ float: none; width:100%; margin:0px; padding:0px; margin:0 auto; margin-bottom:30px;}
.center_block{ float: none; width:100%; padding:0px; margin:0 auto; margin-bottom:30px;}
.right_block{ float: none; width:100%; margin:0px; padding:0px; margin:0 auto; margin-bottom:30px;}
.centered{width:100%; margin-left:0px; margin:0 auto !important;}
.rightside{margin:0px; width:100%; margin:0 auto; margin-bottom:30px;}
.alignedR{ text-align: left;}
.circles_5 p,
.circles_3 p{width:100%; font-size:1.1em;}
.circles_5, 
.circles_3{width:320px; height:208px; background-size: 320px 208px;}
._01{left:-105px; top:50px;}
._02{ left:0px; top:50px;}
._03{ left:107px; top:44px;}
._04{ left:-55px; top:150px;}
._05{ left:54px; top:145px;}
._06{ left:-56px; top:50px;}
._07{ left:57px; top:50px;}
._08{ left:0px; top:145px;}

.logos{ text-align:left}
#industries_block h2{width:100%;}
#timeline{ float:left; margin-left:10px;}
.point{width:320px; margin:0px 0px 50px 0px;}
.ico{margin-bottom:10px; float: left !important;}
.point h3{ clear:both;}
.point p{ font-size:1.4em !important; line-height:1em;}
.hp_solution{ margin:0px; width:100%; text-align: left;}

._left{ margin-left:20px;}
._right{ margin-left:20px;}

._left .point_block{ float:left; margin-left:-26px;}
._left .ico{ float:left !important;}
._left h3,
._left p{ text-align: left}

._right .point_block{float:left; margin-left:-26px;}
._right .ico{ float:left !important;}
._right h3,
._right p{ text-align:left}

._txtF, ._txtA{width:93%;}
._txtA{ width:93%; height:175px;}

#footer{ padding-bottom:20px;}
#footer_left{width:100%;}
#footer_right{width:100%; float:left;}
.dubaifreelancedesigner{ float: left; margin-top:20px;}
}
