/* CSS Document */

*{margin: 0; padding: 0; border: 0; outline:none;}
body{font: 12px/18px Arial, Helvetica, sans-serif; color: #2c2c2c; background-color: #EFEFEF;}
.clear{clear: both;} 
.right{float: right;}
.left{float: left;}

.red{ color:#FF0000;}
@font-face {
    font-family: 'blackout_serifregular';
    src: url('../fonts/nav-font/blackou0-webfont.eot');
    src: url('../fonts/nav-font/blackou0-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/nav-font/blackou0-webfont.woff') format('woff'),
         url('../fonts/nav-font/blackou0-webfont.ttf') format('truetype'),
         url('../fonts/nav-font/blackou0-webfont.svg#blackout_serifregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

.bgBodyHome{background: url(../images/bg-body-home.jpg) repeat top center; background-color: #9fc4ca; background-repeat:no-repeat;}
.bgBodyCareer{background: url(../images/bg-body-careers.jpg) no-repeat top center; background-color:#083a41; background-repeat:no-repeat;}
.bgBodyServices{background: url(../images/bg-body-services.jpg) no-repeat top center; background-color:#0a4658; background-repeat:no-repeat;}
.bgBodyAndroid{background: url(../images/bg-body-android.jpg) no-repeat top center; background-color:#afb7a0; background-repeat:no-repeat;}
.bgBodyBrand{background: url(../images/bg-body-brand.jpg) no-repeat top center; background-color:#baa390; background-repeat:no-repeat;}
.bgBodyFlash{background: url(../images/bg-body-flash.jpg) no-repeat top center; background-color:#b7d5c9; background-repeat:no-repeat;}
.bgBodyWebsite{
	background: url(../images/bg-body-website.jpg) no-repeat top center;
	background-color:#b4a285;
	background-repeat:no-repeat;
	position: relative;
}
.bgBodyContact{background: url(../images/bg-body-contact.jpg) no-repeat top center;  background-color:#9b9391; background-repeat:no-repeat;}
.bgBodyAbout{background: url(../images/bg-body-about.jpg) no-repeat top center;  background-color: #abb6b2; background-repeat:no-repeat}
.bgBodySocial{background: url(../images/bg-body-social.jpg) no-repeat top center; background-color:#b4a38d; background-repeat:no-repeat;}
.bgBodyclients{background: url(../images/bg-body-clients.jpg) no-repeat top center;  background-color:#b4a38d; background-repeat:no-repeat;}


/*.bgHomeWrap{background: url(../images/bg-home-content.png) no-repeat top center;}
.bgCareerWrap{background: url(../images/bg-career-content-01.png) no-repeat top center;}
.bgServiceWrap{background: url(../images/bg-servics-content.png) no-repeat top center;}
.bgAndroidWrap{background: url(../images/bg-fbandroid-content.png) no-repeat top center;}
.bgBrandWrap{background: url(../images/bg-brand-content.png) no-repeat top center;}
.bgFlashWrap{background: url(../images/bg-flash-content.png) no-repeat top center;}
.bgWebsiteWrap{background: url(../images/bg-website-content.png) no-repeat top center;}
.bgContactWrap{background: url(../images/bg-contact-content.png) no-repeat top center;}
.bgAboutWrap{background: url(../images/bg-aboutus-content.png) no-repeat top center;}
.bgSocialWrap{background: url(../images/bg-social-content.png) no-repeat top center;}
.bgclientWrap{background: url(../images/bg-clients-content.png) no-repeat top center;}
*/


.wrapper-home{width: 1008px; min-height: 680px; margin: 0 auto; position: relative;}
.wrapper{width: 1008px; min-height: 768px; margin: 0 auto; position: relative;}
.hdrSection{width: 1008px; background: url(../images/bg-header.png) no-repeat 0 0; height: 146px;}
.logoSyrup{background: url(../images/logo-syrup-technologies.png) no-repeat 0 0; display: block; width: 192px; height: 112px; float: left; margin: 0 0 0 18px;}
.logoSyrup strong{display: none;}

.nav{float: right; padding: 62px 100px 0 0;}
.nav li{list-style: none; display: inline; padding: 5px;}
.nav li a{color: #FFFFFF; font-family: blackout_serifregular; font-size: 18px; text-decoration: none;}

.container{width: 898px; padding: 0 50px 0 60px; background-color: #FFFF99;}
.container p{margin: 0 0 10px 0;}
.ltContainer{width: 328px; float: left; padding:10px; position: relative;}
.rtContainer{width: 535px; float: left; padding:10px 5px 10px 10px;}
.detailWrap{background: url(../images/ver-hr.png) no-repeat 0 0;  margin: 10px 0; padding: 10px 0 0 12px; min-height: 234px;}
.detailBox p{margin: 0;}
.detailBox h2{ padding: 18px 25px 5px 40px; color: #FFFFFF; font-size: 14px; margin: 0 0 0 -43px;}
.detailBox h2 a{color: #FFFFFF; text-decoration: none;}
.detailBox .listItem01{background: url(../images/bg-arrow.png) no-repeat 0 0;} 
.detailBox .listItem02{background: url(../images/bg-arrow.png) no-repeat 0 -60px;} 
.detailBox .listItem03{background: url(../images/bg-arrow.png) no-repeat 0 -121px;} 
.detailBox ul{margin: 10px 0; padding: 0 0 0 20px;}
.detailBox ul li{list-style: none; margin: 0 0 5px 0; padding: 0 0 0 15px; background: url(../images/bullet2-1.png) no-repeat 0 3px; }
.detailBox ul li a{color: #2c2c2c; text-decoration: none; font-weight:bold;}
.contactWrap{width: 523px; float: left;}
.contactCol{float: left; border-right: 1px dotted #666666; padding: 4px; }
.contactCol span{color:#952a28; font-weight: bold; }
.noBorder{border: 0;}
.contactForm {margin: 0 0 10px 0; position:relative;}
.contactForm ul li{margin: 0 0 5px 0; list-style: none; background-image:none;}
.contactForm label{width: 150px; float: left;}
.contactForm input, .contactForm textarea, .contactForm select{border: 1px solid #03c8d3; padding: 2px; width: 200px; color: #666666; -moz-box-shadow:inset 2px 0px 5px #cccccc; -webkit-box-shadow:inset 2px 0px 5px #cccccc; box-shadow:inset 2px 0px 5px #cccccc; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px;}
.contactForm span.asterisk{color: #ff3300;}
.contactForm textarea{resize: none; height: 60px;}
.btnSubmit{background: url(../images/btn-submit.png) no-repeat 0 0; width: 82px; height: 60px; display: block; cursor: pointer; position:absolute; top: 244px; right: 40px;}
.btnSubmit strong{display: none;}
.imgWrap{margin: 0 0 10px 0;}

.clientImg{margin: 20px 0 10px 0; position: relative; height: 190px;}
.clientImg a{
	display: block;
	width: 134px;
	height: 155px;
	float: left;
}
.clientImg a.clntSocImg01{position: absolute; left:55px; top:0; z-index:1;}
.clientImg a.clntSocImg02{position: absolute; left:177px; top:15px; z-index:2;}
.clientImg a.clntSocImg03{position: absolute; left:315px; top:0; z-index:3;}

.clientImg a.clntWebImg01{position: absolute; z-index:1;}
.clientImg a.clntWebImg02{position: absolute; z-index:2;}
.clientImg a.clntWebImg03{position: absolute;  z-index:3;}
.clientImg a.clntWebImg04{position: absolute; z-index:4;}


.clientImg a.clntFlashImg01{position: absolute; left:0; top:0; z-index:1;}
.clientImg a.clntFlashImg02{position: absolute; left:126px; top:15px; z-index:2;}
.clientImg a.clntFlashImg03{position: absolute; left:264px; top:-10px; z-index:3;}
.clientImg a.clntFlashImg04{position: absolute; right:0; top:18px; z-index:4;}

.clientImg a.clntBrandImg01{position: absolute; left:0; top:0; z-index:1;}
.clientImg a.clntBrandImg02{position: absolute; left:126px; top:15px; z-index:2;}
.clientImg a.clntBrandImg03{position: absolute; left:264px; top:-10px; z-index:3;}
.clientImg a.clntBrandImg04{position: absolute; right:0; top:18px; z-index:4;}

.clientImg a.clntFbImg01{position: absolute; left:0; top:0; z-index:1;}
.clientImg a.clntFbImg02{position: absolute; left:126px; top:15px; z-index:2;}
.clientImg a.clntFbImg03{position: absolute; left:264px; top:-10px; z-index:3;}
.clientImg a.clntFbImg04{position: absolute; right:0; top:18px; z-index:4;}


.linkWrap{margin: 0 0 10px 0;}
.linkWrap a.more{margin: 0 25px 0 0; float: right;}
.ltContainer a{background: url(../images/bg-link-01.png) no-repeat 0 0; display: block; width: 75px; height: 24px;}

/*home page service link*/
.container .serviceLink {position: relative;}
.container .serviceLink a{color: #3366FF; text-decoration: none;}
.container .serviceLink a.parentLink{ float: left; display: block; width: 100%; height: 100%; z-index: 10; position: relative;}
.serviceLink .webLink{position: absolute; left:40px; top:164px;  display:block; width:164px; height:60px; z-index:2;}
.serviceLink .fnmLink{position: absolute; left:182px; top:120px;display:block; width:150px; height:60px;z-index:2;}
.serviceLink .bbmLink{position: absolute; left:368px; top:70px;  display:block; width:144px; height:74px;z-index:2;}
.serviceLink .smLink{position: absolute; right:202px; top:60px;  display:block; width:165px; height:75px;z-index:2;}
.serviceLink .faLink{position: absolute; right:26px; top:112px; display:block; width:165px; height:79px;z-index:2;}

.serviceLink .webLink a.parentLink { background: url(../images/website_designing_a.png) no-repeat;  }
.serviceLink .fnmLink a.parentLink{ background: url(../images/flash_multimedia_a.png) no-repeat; }
.serviceLink .bbmLink a.parentLink{ background: url(../images/brnad_building_a.png) no-repeat;}
.serviceLink .smLink a.parentLink{background: url(../images/social_media_a.png) no-repeat; }
.serviceLink .faLink a.parentLink{ background: url(../images/facebook_android_a.png) no-repeat;}

.serviceLink em{display: none;}

.fbAppsExpandBox{display: none; background:url(../images/bg-expand-div.png) no-repeat; width:190px; height:174px; padding: 0 20px 0 20px; position:absolute; top:11px; left: 0px; z-index:1;}
.webExpandBox{display: none; background:url(../images/bg-expand-div.png) no-repeat; width:190px; height:174px; padding: 0 20px 0 20px; position:absolute; top: -3pxpx; left:0px; z-index:1;}
.flashExpandBox{display: none; background:url(../images/bg-expand-div.png) no-repeat; width:190px; height:174px; padding: 0 20px 0 20px; position:absolute; top:-4px; left:0px;z-index:1;}
.brandExpandBox{display: none; background:url(../images/bg-expand-div.png) no-repeat; width:190px; height:174px; padding: 0 20px 0 20px; position:absolute; top:9px; left:0px;z-index:1;}
.socialExpandBox{display: none; background:url(../images/bg-expand-div.png) no-repeat; width:190px; height:174px; padding: 0 20px 0 20px; position:absolute; top:14px; left:0px;z-index:1;}
.submenuDiv { display: block;}
.submenuDiv p{ margin: 60px 0 0;}

/* links Flash page*/
a.linkFlash01{background: url(../images/bg-link-02.png) no-repeat 0 0; display: block; width: 101px; height: 41px; position: absolute; left: 48px; top:124px;}
a.linkFlash02{ position: absolute; left:0; top:350px;}
a.linkFlash03{ position: absolute; left:78px; top:288px;}
a.linkFlash04{ position: absolute; left:178px; top:290px;}
a.linkFlash05{ position: absolute; left:242px; top:340px;}

/* link FB Android page*/
a.linkFBAndorid01{background: url(../images/bg-link-02.png) no-repeat 0 0; display: block; width: 101px; height: 41px; position: absolute; left: 136px; top:95px;}
a.linkFBAndorid02{ position: absolute; left:0; top:350px;}
a.linkFBAndorid03{ position: absolute; left:78px; top:300px;}
a.linkFBAndorid04{ position: absolute; left:162px; top:298px;}
a.linkFBAndorid05{ position: absolute; left:256px; top:330px;}

/* link Brand page*/
a.linkBrand01{background: url(../images/bg-link-02.png) no-repeat 0 0; display: block; width: 101px; height: 41px; position: absolute; left: 76px; top:115px;}
a.linkBrand02{ position: absolute; left:-4px; top:350px;}
a.linkBrand03{ position: absolute; left:78px; top:300px;}
a.linkBrand04{ position: absolute; left:178px; top:300px;}
a.linkBrand05{ position: absolute; left:258px; top:330px;}

/* link Website page*/
a.linkWebsite01{background: url(../images/bg-link-02.png) no-repeat 0 0; display: block; width: 101px; height: 41px; position: absolute; left: 72px; top:125px;}
a.linkWebsite02{ position: absolute; left:-4px; top:345px;}
a.linkWebsite03{ position: absolute; left:78px; top:292px;}
a.linkWebsite04{ position: absolute; left:178px; top:292px;}
a.linkWebsite05{ position: absolute; left:248px; top:341px;}


/* link Social page*/
a.linkSocial01{background: url(../images/bg-link-02.png) no-repeat 0 0; display: block; width: 101px; height: 41px; position: absolute; left: 136px; top:98px;}
a.linkSocial02{ position: absolute; left:-4px; top:350px;}
a.linkSocial03{ position: absolute; left:78px; top:300px;}
a.linkSocial04{ position: absolute; left:157px; top:300px;}
a.linkSocial05{ position: absolute; left:244px; top:342px;}

.ltContainer a strong{display: none;}



.footerWrap{width: 390px; position: fixed; bottom:0px; right: 177px; z-index: 999;}
.expand{background: url(../images/bg-ftr.png) no-repeat ; display:block; width: 390px; height:64px;}
.newrexox{background: url(../images/bg-ftr-close.png) no-repeat ; display:block; width: 390px; height:64px; cursor:pointer;}
.footerWrap em{display: none;}
.slidingDiv{display:none; width: 388px; position:absolute; bottom:0; right: 0; /*background-color: #0D3841;*/ padding: 28px 0 0 0;  border-radius: 5px 5px 0 0; z-index: 999;}
.mailWrap{background-color: #FFFFFF; padding: 25px 5px 10px 17px; border: 1px solid #0D3841; width:351px; float:right;}
.mailWrap ul li{margin: 0 0 10px 0; list-style:none;}
.mailWrap input, .mailWrap textarea{background-color: #e5e5e5; border:1px solid #0D3841; padding:2px; color: #0D3841; width:258px; -moz-box-shadow:inset 0px 0px 7px #333333; -webkit-box-shadow:inset 0px 0px 7px #333333; box-shadow:inset 0px 0px 7px #333333; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px;}
.mailWrap label{width: 70px; float: left; color:#003706; font-weight:bold;}
.mailWrap textarea{resize: none; height: 60px;}
.mailWrap input.btnSbmt{padding: 2px 4px; background-color:#0D3841; color: #FFFFFF; font-weight: bold; text-decoration: none; cursor:pointer; float; width: auto; margin: 0 0 0 82px; box-shadow:none;}
.emailImg{position:absolute; top:-26px; left:-40px;}


.bottomInfo{position: absolute; left:19px; bottom:10px; background: url(../images/bottam-img.png) no-repeat 0 0; width:682px; height:36px; color:#FFFFFF; padding: 25px 0 0 50px; font-size: 14px; font-style:italic;}
.bottomInfo a{color: #FFFFFF; text-decoration: none; margin:0 10px 0 0; }

.enquiry-div{position:absolute; z-index:6; width:316px; height:249px; background:url(../images/syrup-enquiry-bg.png) no-repeat 0 0; bottom:0; right:0;}
.click-div-text{position:absolute; z-index:5; width:278px; height:63px; margin-top:60px; margin-left:445px; line-height:30px; font-family: 'brad'; color:#2e0e09; font-size:22px; font-weight:bold; text-decoration:none;}
.enquiry-formdiv{float:left; width:251px; left:50px; top:20px; height:190px; position:relative;}
.form-div{position:absolute; z-index:7; height:15px; top:16px; left:70px; width:120px;}
.form-diva{position:absolute; z-index:7; height:15px; top:38px; left:70px; width:120px;}
.form-divb{position:absolute; z-index:7; height:15px; top:60px; left:70px; width:120px;}
.form-divc{position:absolute; z-index:7; height:50px;top:81px; left:70px; width:120px;}
.form-stylea{width:120px; height:40px; background-color:transparent; border: 1px; border-color: #999; font-size:11px; color:#333;}
.form-style{width:120px; height:13px; background-color:transparent; border: solid 1px; border-color:#999; font-size:12px; color:#333; font-family:Arial, Helvetica, sans-serif; -moz-box-shadow:inset 0px 0px 7px #333333; -webkit-box-shadow:inset 0px 0px 7px #333333; box-shadow:inset 0px 0px 7px #333333; border-radius: 2px; }
.send-button{position:absolute; z-index:7; height:31px; top:190px; left:140px; width:49px;}
.enquiry-div textarea{resize: none; float: left;}
/*input.form-style:hover{background-color: #dad7c8;border: 1px;}
textarea.form-style:hover{background-color: #dad7c8;}*/
.client-img{ float:left; margin-left:10px; margin-top:15px;/* border:#999999 solid 2px; box-shadow: 10px 10px 5px #888888;*/}
.fright{ float:right;}
.fleft{ float:left;}
a.linkother01{background: url(../images/bg-link-02.png) no-repeat 0 0; display: block; width: 66px; height: 28px; position: absolute; left: 121px; top:226px;}
a.linkother02{ position: absolute; left:-9px; top:318px;}
a.linkother03{ position: absolute; left:41px; top:260px;}
a.linkother04{ position: absolute; left:197px; top:251px;}
a.linkother05{ position: absolute; left:250px; top:297px;}
 .contactForm select{border: 1px solid #03c8d3; padding: 2px; width: 206px; color: #666666; -moz-box-shadow:inset 2px 0px 5px #cccccc; -webkit-box-shadow:inset 2px 0px 5px #cccccc; box-shadow:inset 2px 0px 5px #cccccc; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px;}.dis-n-c{ display:none;}.dis-n{ display:clock;}