/**********************************************************************

	procurra.com
	version: 	1a
	owner:		james cooke
	handcoded by robots for ewebbed.co.uk

**********************************************************************/

html{}
body{font: 62.5%/1.5em verdana, arial; color: #4F4F4F; background: url(../images/background2.jpg) repeat-x top #545C73;}
/* prev bg color = #0b0b0b */

/* @group TAGS */
h2{clear: both;color: #010101; font-size:2.2em; line-height: 1.4em;}
h3{font-size:1.8em;color:#a73e3a; line-height: 1.4em;}
h4{font-size:1.3em;}
p{font-size:1.3em;}
li{font-size:1.3em; margin: 0 0 6px 0;}
ul,ol{margin:0 0 14px 10px;}

a{outline: none;text-decoration:underline; color: #2A2B59}
a:hover{text-decoration:underline; color: #a73e3a;}

input, textarea{font:1.2em/1.8em verdana, arial;}
/* @end */

/* @group GENERAL STYLES */
.clear{clear:both;}
.paddingT20{padding-top: 20px;}
.loading{position:relative;background: url(../images/ajax-loader.gif) no-repeat center center;}
.marginT-10{margin-top: -10px;}
.marginT-20{margin-top: -50px;}
.marginB-20{margin-bottom: -20px;}
.nomargin{margin: 0;}
.nopadding{padding: 0 !important;}
/* @end */

/* @group TEMPLATE */
#container{position:relative;width: 964px; margin: 0 auto; }
#content{position: relative;padding: 20px 20px 0 20px;width:880px;margin:0 auto 0 auto; background:#fff; }
#mainContent{margin:0; padding: 0 22px 10px 22px;}

#footer{clear: both;border-top:6px solid #bfc1c5;padding:12px 0 12px 0;}
#footer p{font:1em verdana, arial; float:left; display:inline;}
#footer p.details{float:right;}
#footer img{float: left;dispaly:inline;}

.shadowT{padding: 24px 0 0 0; background:url(../images/shadowT.png) no-repeat left top;}
.shadowL{padding: 0 0 0 24px;background:url(../images/shadowL.png) no-repeat left top;}
.shadowB{margin: 0 0 0 -3px;padding: 52px 0 0 0;background:url(../images/shadowB.png) no-repeat left bottom;}
.shadowR{padding: 0 24px 0 0;background:url(../images/shadowR.png) no-repeat right top;}
/* @end */


/* @group BANNERS */
.banner{position: relative;clear:both;width: 880px;height: 256px;margin: 0 0 18px 0px; }
.banner ul.nav{padding:18px 0 0 10px;}
.banner ul.nav li, .banner ul.nav a{color: #fff;}
.banner h1{position:absolute; right:45px; top:195px; width:380px; font-size: 2.2em; color: #fff;}
img.initialBanner{position:absolute; left:0px; top:0px;}

.banner .logo{position:absolute; top:155px; left:0px;}

.banner0{background: url(../images/header/header0.jpg) no-repeat left top;}
.banner1{background: url(../images/header/header0.jpg) no-repeat left top;}
.banner2{background: url(../images/header/header2.jpg) no-repeat left top;}
.banner3{background: url(../images/header/header3.jpg) no-repeat left top;}
.banner4{background: url(../images/header/header4.jpg) no-repeat left top;}
.banner5{background: url(../images/header/header5.jpg) no-repeat left top;}
/* @end */


/* @group LANGUAGES */
ul.languages{position: absolute; left: 855px; top: 2px;margin:0; width: 100px;}
ul.languages li{float: left;display:inline; margin:0 0 0 5px; font-size: 0.9em; font-family: arial, helvetica; line-height: 12px;}
ul.languages li img{padding-top: 2px;}
ul.languages li.languageTxt{width: 45px;}
/* @end */

/* @group SERVICE BOXES */
.serviceBoxes{clear:both;float:left;display:inline;padding:0 0 18px 0; margin: 0 -27px 0 -20px; z-index: 100;}
.serviceBoxes .box{display:block;position: relative;float:left;display:inline; width:210px; height: 70px; text-indent: -1000em; margin:0 13px 0 0; background: url(../images/backgrounds/serviceBox.gif) repeat-x left top; cursor:pointer;}
.serviceBoxes .box img{display: none;}
/*.serviceBoxes .box h3{padding:14px 18px 6px 18px; color:#d3d1d1;} */

body.content .serviceBoxes{margin-top: -4px;}
body.content .serviceBoxes .box{height: 37px;}

/*** v2 ***/
.serviceBoxes #service1{background: url(../images/navigation/our-vision.gif) repeat-x left top;}
.serviceBoxes #service2{background: url(../images/navigation/procurement.gif) repeat-x left top;}
.serviceBoxes #service3{background: url(../images/navigation/consultancy.gif) repeat-x left top;}
.serviceBoxes #service4{margin-right: 0;background: url(../images/navigation/contact-us.gif) repeat-x left top;}

.content #service1{background: url(../images/navigation/content-our-vision.gif) repeat-x left top;}
.content #service2{background: url(../images/navigation/content-procurement.gif) repeat-x left top;}
.content #service3{background: url(../images/navigation/content-consultancy.gif) repeat-x left top;}
.content #service4{background: url(../images/navigation/content-contact-us.gif) repeat-x left top;}

.serviceBoxesFR #service1{background-position: right top !important;}
.serviceBoxes .boxOn1{background-position: left bottom !important;}
#content .serviceBoxesFR .boxOn1{background-position: right bottom !important;}

.serviceBoxesFR #service2{background-position: right top !important;}
.serviceBoxes .boxOn2{background-position: left bottom !important;}
#content .serviceBoxesFR .boxOn2{background-position: right bottom !important;}

.serviceBoxesFR #service3{background-position: right top !important;}
.serviceBoxes .boxOn3{background-position: left bottom !important;}
#content .serviceBoxesFR .boxOn3{background-position: right bottom !important;}

.serviceBoxesFR #service4{background-position: right top !important;}
.serviceBoxes .boxOn4{background-position: left bottom !important;}
#content .serviceBoxesFR .boxOn4{background-position: right bottom !important;}


/* @end */


/* @group CONTENT */
h2{clear: both;margin:0 0 16px 0;}
h3{margin:0 0 6px 0;}
h4{font-weight:bold;padding: 12px 0 0 0;margin:0 0 10px 0;}
p{line-height:1.3em; margin:0 0 14px 0;}

#mainContent ul{margin: 0 0 12px 0;}
#mainContent ul li{position:relative;padding:0 0 0 18px;background: url(../images/icons/bulletGrey.gif) no-repeat left 5px;}
#mainContent ul li.nobg{background:none;}
#mainContent ol li{list-style: decimal; list-style-position: inside;}
#mainContent ul li ul{margin:10px 0 0 0px;}
#mainContent ul li ul li{font-size:1em;}
#mainContent a{color:#2A2B59;}
#mainContent a:hover{color: #a73e3a;}

h3.diagramL{/*float: left;*/ width: 448px;}
h3.pyramidL{float: left; width: 445px;}
#mainContent ul.diagramL{float: left; width: 448px;}

#mainContent .siblingMenu{position: relative;z-index: 1000;float: right;display: inline; width: 240px; padding: 14px 8px 10px 8px; background: url(../images/backgrounds/bgSibling.gif) repeat-x left top #132449; margin:-10px -20px 0 10px; border: 2px solid #2e3d5c;}
#mainContent .siblingMenu ul{margin: 0;}
#mainContent .siblingMenu ul li{font-size: 1.2em !important;padding: 0 0 0 14px;margin: 0 0 2px 0;color: #fff;background: url(../images/icons/bulletWhite.gif) no-repeat left 5px;}
#mainContent .siblingMenu ul li a{color: #fff !important;}
#mainContent .siblingMenu ul li.currentpage{font-weight: bold;}
#mainContent .siblingMenu ul li ul{padding: 4px 0 4px 0px;}
#mainContent .siblingMenu ul li ul li{font-size: 1em !important; font-weight: normal;}

/*.siblingFollow{width: 570px;margin: -1px 0 0 0;}*/
p.siblingFollow{margin-bottom: 15px;}



.section{margin:0 0 15px 0;background: #eee; border:1px solid #ccc; padding:14px 14px 0 14px;}
.section p{margin:0; padding:0 0 14px 0;}

.contactSection{border:2px solid #ccc;background: #1F1F1F;padding:14px 14px 0 20px;}
.contactSection h2{color: #fff;margin:0 0 4px 0;}
.contactSection p{color:#fff; font-size: 1.2em;}
.contactSection a{color:#7ba149; text-decoration:underline;}
.contactSection a:hover{color:#fff;}
/* @end */


/* @group CONTACT */
.contactForm{position:relative;clear:both; padding:24px 0 10px 24px; margin: 0 0 13px 0;background: url(../images/backgrounds/bgContact.jpg) no-repeat right top #000;}
.contactForm fieldset {border:0px;}
.contactForm fieldset .formLine{position: relative;clear:both;float:left; display:inline;margin:0 0 14px 0; width: 624px;}
.contactForm fieldset .formLine label{display:block;float:left;display:inline;width:170px;color:#fff; font-size:1.4em;line-height:26px;}
.contactForm fieldset .formLine input, .contactForm fieldset .formLine textarea{float:left;display:inline; display:block; border:0px;}
.contactForm fieldset .formLine input{width:278px; padding:4px 4px 0 4px;height:23px; background: url(../images/backgrounds/forms/bgInput.gif) no-repeat left;}
.contactForm fieldset .formLine textarea{width:416px; padding:2px 4px 0 4px;height:110px; background: url(../images/backgrounds/forms/bgTextarea.gif) no-repeat left top;}

.contactForm fieldset .error input{background: url(../images/backgrounds/forms/bgInputError.gif) no-repeat left;}

.contactForm fieldset .sendButton{height: 36px;margin: -8px 0 0px 530px;background: none; border: 0px; cursor:pointer;}


.contactForm fieldset .formLine input:focus{color:#222;background: url(../images/backgrounds/forms/bgInputOver.gif) no-repeat left;}
.contactForm fieldset .formLine textarea:focus{color:#222;background: url(../images/backgrounds/forms/bgTextareaOver.gif) no-repeat left;}
.contactForm .contactOther{position:absolute; top:30px; left:655px; width: 180px;}
.contactForm .contactOther p{font-size:1.2em;color:#fff;}

.errorList{margin:0 0 30px 0;}
.errorList li{color: #9a2828;}

.contactCol{float:left;display:inline; width: 270px;height: 210px;margin: 0 10px 20px 0; padding: 20px 0 0 0;background: #000000;}
.contactCol h4{padding: 0px 0 0 20px; color: #eee;}
.contactCol p{padding: 0 0 0 20px;color: #eee;}
.contactCol p:last-child{margin: 0;}
.lastCol{margin: 0 0 20px 2px;}
/* @end */


/* @group CONTENT */
.visionLeft{float: left;dispaly:inline; width: 430px; margin: -1px -20px 0 0;}

.visionDiagram{display: block;padding: 10px 0;margin:0 0 -10px 0;}
.vision{float: right;position: relative; margin: -20px -50px -80px 0px;}
.visionBG{position: absolute; top: -63px; left: 50px;height: 493px; width: 539px;background:url(../images/vision/bgVision.png) no-repeat left top; z-index: 0;}
.vision ol{position: relative;height: 493px; width: 539px; z-index: 100; margin: 0;}
.vision ol li{position:absolute;display: block; text-indent: -1000em;}
.vision ol li a{position: relative;display: block; overflow: hidden; cursor: pointer;}
.vision ol li a span{display:block;position: absolute;top: 0px; left: 0px;}

/*.vision ol li.vision1{top: 0px; left: 0px;}
.vision ol li.vision2{top: 28px; left: 318px;}
.vision ol li.vision3{top: 129px; left: 367px;}
.vision ol li.vision4{top: 254px; left: 284px;}
.vision ol li.vision5{top: 233px; left: 137px;}
.vision ol li.vision6{top: 110px; left: 120px;}

.vision ol li.vision1 a{height:154px; width: 347px;}
.vision ol li.vision2 a{height:141px; width: 176px;}
.vision ol li.vision3 a{height:172px; width: 137px;}
.vision ol li.vision4 a{height:155px; width: 177px;}
.vision ol li.vision5 a{height:140px; width: 167px;}
.vision ol li.vision6 a{height:167px; width: 133px;}

.vision ol li.vision1 a span{height: 400px; width: 347px;background: url(../images/vision/vision1.png) no-repeat left top;}
.vision ol li.vision2 a span{height: 290px; width: 176px;background: url(../images/vision/vision2.png) no-repeat left top;}
.vision ol li.vision3 a span{height: 350px; width: 347px;background: url(../images/vision/vision3.png) no-repeat left top;}
.vision ol li.vision4 a span{height: 320px; width: 177px;background: url(../images/vision/vision4.png) no-repeat left top;}
.vision ol li.vision5 a span{height: 300px; width: 167px;background: url(../images/vision/vision5.png) no-repeat left top;}
.vision ol li.vision6 a span{height: 350px; width: 133px;background: url(../images/vision/vision6.png) no-repeat left top;}

.vision ol li.vision1 a:hover span{top:-245px;}
.vision ol li.vision2 a:hover span{top:-150px;}
.vision ol li.vision3 a:hover span{top:-180px;}
.vision ol li.vision4 a:hover span{top:-167px;}
.vision ol li.vision5 a:hover span{top:-159px;}
.vision ol li.vision6 a:hover span{top:-184px;}

.vision ol li a:hover span{direction: ltr;}*/

.visionSub{float: right;position: relative; margin: -0px -60px -30px 0;width: 448px; height: 330px;}
.visionSub ol{width: 448px; height: 360px;}
.visionSub .visionBG{width: 448px; height: 433px;top: -69px;left: 6px;background:url(../images/vision/sub/bgVision.png) no-repeat left top;}

.visionSub ol li.vision1{top: 0px; left: 0px;}
.visionSub ol li.vision2{top: 20px; left: 233px;}
.visionSub ol li.vision3{top: 94px; left: 269px;}
.visionSub ol li.vision4{top: 186px; left: 208px;}
.visionSub ol li.vision5{top: 173px; left: 99px;}
.visionSub ol li.vision6{top: 82px; left: 74px;}

.visionSub ol li.vision1 a{height:114px; width: 347px;background: url(../images/vision/sub/vision1.png) no-repeat left top;}
.visionSub ol li.vision2 a{height:105px; width: 129px;background: url(../images/vision/sub/vision2.png) no-repeat left top;}
.visionSub ol li.vision3 a{height:126px; width: 100px;background: url(../images/vision/sub/vision3.png) no-repeat left top;}
.visionSub ol li.vision4 a{height:112px; width: 130px;background: url(../images/vision/sub/vision4.png) no-repeat left top;}
.visionSub ol li.vision5 a{height:102px; width: 123px;background: url(../images/vision/sub/vision5.png) no-repeat left top;}
.visionSub ol li.vision6 a{height:123px; width: 111px;background: url(../images/vision/sub/vision6.png) no-repeat left top;}

/*.visionSub ol li.vision1 a span{height: 250px; width: 255px;}
.visionSub ol li.vision2 a span{height: 250px; width: 129px;}
.visionSub ol li.vision3 a span{height: 260px; width: 100px;}
.visionSub ol li.vision4 a span{height: 280px; width: 130px;}
.visionSub ol li.vision5 a span{height: 280px; width: 123px;}
.visionSub ol li.vision6 a span{height: 280px; width: 111px;}*/

.visionSub ol li.vision1 a:hover{background-position:left -138px;}
.visionSub ol li.vision2 a:hover{background-position:left -146px;}
.visionSub ol li.vision3 a:hover{background-position:left -135px;}
.visionSub ol li.vision4 a:hover{background-position:left -167px;}
.visionSub ol li.vision5 a:hover{background-position:left -179px;}
.visionSub ol li.vision6 a:hover{background-position:left -158px;}

.visionFrench ol li.vision1 a{background: url(../images/vision/french/vision1.png) no-repeat left top;}
.visionFrench ol li.vision2 a{background: url(../images/vision/french/vision2.png) no-repeat left top;}
.visionFrench ol li.vision3 a{background: url(../images/vision/french/vision3.png) no-repeat left top;}
.visionFrench ol li.vision4 a{background: url(../images/vision/french/vision4.png) no-repeat left top;}
.visionFrench ol li.vision5 a{background: url(../images/vision/french/vision5.png) no-repeat left top;}
.visionFrench ol li.vision6 a{background: url(../images/vision/french/vision6.png) no-repeat left top;}

.visionSub ol li.vision1 a:hover span{direction: ltr;}
/* @end */

.consultancyNav{float: right;position: relative; margin: 10px -60px -120px -40px;width: 473px; height: 517px;}
.consultancyNavBG{position: absolute; top: -63px; left: 0px;width: 473px; height: 517px; background: url(../images/pyramid/bgPyramid.png) no-repeat left top;}
.consultancyNav ol{position: relative; z-index: 100; margin: 0;}
.consultancyNav ol li{display: block;position: absolute;text-indent: -1000em;}
.consultancyNav ol li a{display: block;}
.consultancyNav ol li.pyramid1{top: -18px; left: 196px;}
.consultancyNav ol li.pyramid2{top: 76px; left: 175px;}
.consultancyNav ol li.pyramid3{top: 121px; left: 155px;}
.consultancyNav ol li.pyramid4{top: 165px; left: 139px;}
.consultancyNav ol li.pyramid5{top: 204px; left: 121px;}
.consultancyNav ol li.pyramid6{top: 244px; left: 102px;}
.consultancyNav ol li.pyramid7{top: 281px; left: 87px;}
.consultancyNav ol li.pyramid8{top: 318px; left: 72px;}

.consultancyNav ol li.pyramid1 a{height: 95px; width: 80px;background: url(../images/pyramid/step1.jpg) no-repeat left top;}
.consultancyNav ol li.pyramid2 a{height: 46px; width: 122px;background: url(../images/pyramid/step2.jpg) no-repeat left top;}
.consultancyNav ol li.pyramid3 a{height: 44px; width: 161px;background: url(../images/pyramid/step3.jpg) no-repeat left top;}
.consultancyNav ol li.pyramid4 a{height: 39px; width: 193px;background: url(../images/pyramid/step4.jpg) no-repeat left top;}
.consultancyNav ol li.pyramid5 a{height: 40px; width: 228px;background: url(../images/pyramid/step5.jpg) no-repeat left top;}
.consultancyNav ol li.pyramid6 a{height: 37px; width: 265px;background: url(../images/pyramid/step6.jpg) no-repeat left top;}
.consultancyNav ol li.pyramid7 a{height: 37px; width: 296px;background: url(../images/pyramid/step7.jpg) no-repeat left top;}
.consultancyNav ol li.pyramid8 a{height: 38px; width: 323px;background: url(../images/pyramid/step8.jpg) no-repeat left top;}

.consultancyNav ol li.pyramid1 a:hover{background-position: left -125px;}
.consultancyNav ol li.pyramid2 a:hover{background-position: left -74px;}
.consultancyNav ol li.pyramid3 a:hover{background-position: left -65px;}
.consultancyNav ol li.pyramid4 a:hover{background-position: left -71px;}
.consultancyNav ol li.pyramid5 a:hover{background-position: left -70px;}
.consultancyNav ol li.pyramid6 a:hover{background-position: left -73px;}
.consultancyNav ol li.pyramid7 a:hover{background-position: left -73px;}
.consultancyNav ol li.pyramid8 a:hover{background-position: left -73px;}


.consultancyFrench ol li.pyramid1 a{background: url(../images/pyramid/french/step1.jpg) no-repeat left top;}
.consultancyFrench ol li.pyramid2 a{background: url(../images/pyramid/french/step2.jpg) no-repeat left top;}
.consultancyFrench ol li.pyramid3 a{background: url(../images/pyramid/french/step3.jpg) no-repeat left top;}
.consultancyFrench ol li.pyramid4 a{background: url(../images/pyramid/french/step4.jpg) no-repeat left top;}
.consultancyFrench ol li.pyramid5 a{background: url(../images/pyramid/french/step5.jpg) no-repeat left top;}
.consultancyFrench ol li.pyramid6 a{background: url(../images/pyramid/french/step6.jpg) no-repeat left top;}
.consultancyFrench ol li.pyramid7 a{background: url(../images/pyramid/french/step7.jpg) no-repeat left top;}
.consultancyFrench ol li.pyramid8 a{background: url(../images/pyramid/french/step8.jpg) no-repeat left top;}

.column{float: left;display:inline; width: 400px; padding: 0 0 20px 0;}
.column1{margin:0 20px 0 0;}

.columns{clear: both;padding: 20px 0 0 0;}
.columns .col-2{width: 390px;}
.columns .col-2 h4{padding-top: 0;}
.columns .col-2:last-child{width: 400px;margin-right: 0;}


/*.diagram{float:left; dispaly:inline; clear: both; width: 99%;}*/
.col-1{clear: both; margin: 0 20px 20px 0;text-align: center;}
.col-2{float:left; dispaly:inline; width: 400px; margin: 0 20px 20px 0;}
.col-right{margin:0 0 10px 0;}

hr.listSpacer{clear: left;border: 1px solid #fff; background:none; margin: 0 0 0 0;}


.loginExtra img{float: left;display:inline; }
.loginExtra p{ text-align: right;line-height:50px; padding-right: 10px;}

.loginButton{position:absolute; left: 470px; top: -6px;height: 37px; width: 111px;border: 0px; cursor:pointer;background: url(../images/template/loginButton.gif) no-repeat left top;}
.loginButton:hover{background-position: left -43px;}

.loginButtonFR{background: url(../images/template/loginButtonFR.gif) no-repeat left top;}
.loginButtonFR:hover{background-position: left -43px;}

.forgotButton{position:absolute; left: 470px; top: -6px;display: block; text-indent:-1000em;width: 125px;height: 19px;left: 320px; top: 0px; background:  url(../images/template/forgotButton.gif) no-repeat left top;}
.forgotButtonFR{background:  url(../images/template/forgotButtonFR.gif) no-repeat left top;}
.forgotButton:hover{background-position:left -30px;}


.checkbox{background:none !important; width:auto !important;}


/* @group DIAGRAM */
.diagrams{position: relative;clear:both; margin-bottom: -10px}
.diagramT{margin: 0 -42px 0 -42px;background: url(../images/diagrams/diagramT.gif) repeat-x center top #292d36;}
.diagramB{position: relative;padding: 20px 0 20px 0;background: url(../images/diagrams/diagramB.gif) repeat-x center bottom;}
.diagrams h3{margin: 0 0 5px 0px;}
.diagrams h4{color: #fff; font-size: 1.2em; text-align: center;margin: 0;}
.diagrams ul li{float: left;display: block; width: 307px;padding: 0 !important; margin: 0 -4px 0 0!important;background: none !important;}
.diagrams ul li a{display: block;height: 180px;background: url(../images/diagrams/bgDiagram.png) no-repeat left top !important;}
.diagrams ul li a img{margin:13px 0 0 12px;}
/* @end */


/* @group POPUP */
#popup{width: 880px;background:#fff;padding: 10px;}
/* @end */