/* ----- COLORS ----- */
/* GREEN: #35B09C */
/* BLUE: #4BA3D3; */
/* PINK: #E1007A; */
/* YELLOW: #FFCC19; */
/* ----- END COLORS ----- */


/* -------- BASIC COMPONENTS -------- */

/* BASIC HTML TAGS */
body {background:#FFFFFF url("../images/bodyBack.jpg") left top repeat-x; font-family:arial;}

/* CONTAINER */
#allContainer {width:60em; margin:0 auto; padding:20px 0px 0px 160px;}

/* HEADER */
#header {position:relative;}

/* MAIN */
#main {border-left:1px solid #BEBEBE;border-right:1px solid #BEBEBE; background:url("../images/leftShadow.jpg") left top repeat-y;}
#main h1 {font-family:"trebuchet ms",arial; font-size:140%; padding:2em 0em 0em 3.6em;}
#main h2 {font-size:110%; padding-bottom:0.2em;}
#main p {padding:0.5em 0em;}
#main a {text-decoration:none;}
#main a:hover {text-decoration:underline;}
#main .promoBox p {padding:2em 30em 4em 4em; line-height:1.5em; color:#333333; font-weight:700; font-size:120%;}
#main .promoBox p span {line-height:1.5em;}
/* FOOTER */
#footer {border-top:1px solid #BEBEBE; padding:0.5em 0em; xborder-bottom:4px double #BEBEBE; xbackground: #00090E url("../images/bodyBack.jpg") 0px 0px repeat-x;}
#footer p {font-size:85%; font-weight:300; text-align:center; color:#666666}
#footer p a {color:#666666; text-decoration:none;}
#footer p a:hover {text-decoration:underline;}

/* BOXES */
.logoBox {width:99px; height:190px; position:absolute; left:-125px;}
.logoBox a {display:block;width:99px; height:190px;}
.promoBox {height:21em;}
.content {border-top:1px solid #D4D8D7;}
.clientBox {margin-top:1em; margin-right:-1em;}
.clientBox ul {}
.clientBox ul li {display:block; float:left; margin:0em 0.75em 1.15em 0em; border:1px solid #BEBEBE;}
.clientBox ul li span {display:block; width:85px; height:85px; border:4px solid #EFEFEF;}
.xclientBox ul li a:hover {border:4px solid #DEDEDE;}
.clientBox ul li a img {}

.paddingBox ul {padding-left:1.2em; margin-top:0.5em; margin-bottom:0.5em;}
.paddingBox ul li {margin-bottom:0.5em; line-height:1.22em;}

/* promobox on homepage */
.home .promoBox {position:relative;}
.home .promoBox h2.title {position:absolute; left:-9999em; top:-9999em;}
.home .promoBox .infoBox {position:absolute; left:-9999em; top:-9999em;}

/* -------- COLORS AND IMAGES FOR  BRANDING -------- */


h3 span {font-size:93%;}

/* CLIENTS */
#main h1, #main h2 {color:#4BA3D3;}
#main a {color:#4BA3D3;}
.mainNav ul li.active a {border-top:5px solid #4BA3D3;;}
.promoBox {border-bottom:10px solid #4BA3D3;}
.promoBox p span {color:#4BA3D3;}
.logoBox {background:url("../images/ia_logo_blue.jpg") 0em 0.5em no-repeat;}
.subNav ul li.active a {color:#4BA3D3;}
.subNav ul li a:hover {color:#4BA3D3;}
.twoColLeft .sideBar .paddingBox {border-color:#4BA3D3;}
.clients .paddingBox ul li {list-style-image: url("/images/bullet_clients.gif");}

/* HOME */
.newsItem h2 {color:#4BA3D3; border-bottom:4px double #4BA3D3;}
#main .newsItem h2 {font-family:"trebuchet ms",arial; font-size:140%; padding-bottom:0.2em;}
.newsItem p.newsMeta {font-size:90%; color:#999999;}
.home .paddingBox ul li {list-style-image: url("/images/bullet_clients.gif");}

/* COMPANY */
.company #main h1, .company #main h2 {color:#E1007A;}
.company #main a {color:#E1007A;}
.company .mainNav ul li.active a {border-top:5px solid #E1007A;;}
.company .promoBox {border-bottom:10px solid #E1007A;}
.company .promoBox p span {color:#E1007A;}
.company .logoBox {background:url("../images/ia_logo_pink.jpg") 0em 0.5em no-repeat;}
.company .subNav ul li.active a {color:#E1007A;}
.company .subNav ul li a:hover {color:#E1007A;}
.company .twoColLeft .sideBar .paddingBox {border-color:#E1007A;}
.company .paddingBox ul li {list-style-image: url("/images/bullet_company.gif");}


/* APPROACH */
.approach #main h1, .approach #main h2 {color:#35B09C;}
.approach #main a {color:#35B09C;}
.approach .mainNav ul li.active a {border-top:5px solid #35B09C;;}
.approach .promoBox {border-bottom:10px solid #35B09C;}
.approach .promoBox p span {color:#35B09C;}
.approach .logoBox {background:url("../images/ia_logo_green.jpg") 0em 0.5em no-repeat;}
.approach .subNav ul li.active a {color:#35B09C;}
.approach .subNav ul li a:hover {color:#35B09C;}
.approach .twoColLeft .sideBar .paddingBox {border-color:#35B09C;}
.approach .paddingBox ul li {list-style-image: url("/images/bullet_approach.gif");}

/* NEWS */
.news #main h1, .news #main h2 {color:#FFCC19;}
.news #main a {color:#DFB00D;}
.news .mainNav ul li.active a {border-top:5px solid #FFCC19;;}
.news .promoBox {border-bottom:10px solid #FFCC19;}
.news .promoBox p span {color:#FFCC19;}
.news .logoBox {background:url("../images/ia_logo_yellow.jpg") 0em 0.5em no-repeat;}
.news .subNav ul li.active a {color:#FFCC19;}
.news .subNav ul li a:hover {color:#FFCC19;}
.news .twoColLeft .sideBar .paddingBox {border-color:#FFCC19;}
.news .paddingBox ul li {list-style-image: url("/images/bullet_news.gif");}

/* -------- PROMOBOX IMAGES -------- */
.company .promoBox {background:url("../images/company.jpg") right bottom  no-repeat;}
#approach .promoBox {background:url("../images/approach.jpg") right bottom  no-repeat;}
#define .promoBox {background:url("../images/define.jpg") right bottom  no-repeat;}
#design .promoBox {background:url("../images/design.jpg") right bottom  no-repeat;}
#realize .promoBox {background:url("../images/realize.jpg") right bottom  no-repeat;}
#optimize .promoBox {background:url("../images/optimize.jpg") right bottom  no-repeat;}
.news .promoBox {background:url("../images/news.jpg") right bottom  no-repeat; height:23.5em;}
body.clients .promoBox {background:url("../images/clients.jpg") right bottom  no-repeat; height:0px;}
#clients.clients .promoBox { height:23.5em;}
.home .promoBox {height:306px;}

/* -------- NAVIGATION COMPONENTS -------- */

/*SERVICE NAVIGATION */
.serviceNav {padding:1em 1em 0em 0em;}
.serviceNav ul {float:right;}
.serviceNav ul li {float:left; padding:0em 0.5em;}
.serviceNav ul li a {color:#000000; text-decoration:none;}
.serviceNav ul li a:hover {text-decoration:underline;}

/* MAIN NAVIGATION */
.mainNav {margin-top:0.5em; background: #00090E url("../images/mainNavBack.jpg") 0px 5px repeat-x;}
.mainNav ul {}
.mainNav ul li {display:block; float:left; width:25%; background:url("../images/mainNavSep.jpg") right 5px no-repeat;}
.mainNav ul li a {display:block; padding:0.7em 0em; text-align:center; color:#FFFFFF; font-size:110%; font-weight:700; text-decoration:none;border-top:5px solid #000000;}
.mainNav ul li a:hover {}
.mainNav ul li.active {}
.mainNav ul li.active a {}
.mainNav ul li.last {background:none;}

.mainNav ul li.approach a:hover {border-top:5px solid #35B09C;}
.mainNav ul li.company a:hover {border-top:5px solid #E1007A;}
.mainNav ul li.clients a:hover {border-top:5px solid #4BA3D3;}
.mainNav ul li.news a:hover {border-top:5px solid #FFCC19;}


/* SUB NAVIGATION */
.subNav {background: #00131A; border-top:1px solid #FFFFFF; padding-left:3.4em;}
.subNav ul {}
.subNav ul li {display:block; float:left; padding:0.7em 1.5em;}
.subNav ul li a {text-align:center; color:#FFFFFF; font-size:100%; font-weight:700; text-decoration:none;}
.subNav ul li a:hover {}
.subNav ul li.active {background:url("../images/arrow_up_white.gif") center bottom no-repeat;}
.subNav ul li.active a {}


/* -------- CONTENT GRIDS -------- */

/* ONE COL */
.oneCol {}
.oneCol .paddingBox {margin:0.5em 5em; padding-top:0.5em; border-top:4px double #BEBEBE;}


/* TWO COL LEFT */
.twoColLeft {}
.twoColLeft .mainCol {width:66%; float:left;}
.twoColLeft .mainCol .paddingBox {margin:0.5em 2em 2em 5em; padding-top:0.5em; border-top:4px double #BEBEBE;}
.twoColLeft .sideBar {width:33%; float:left;}
.twoColLeft .sideBar .paddingBox {margin:0.5em 2em 2em 2em; padding-top:0.5em; border-top:4px double #BEBEBE;}


/* TWO COL RIGHT */
.twoColRight {}
.twoColRight .mainCol {width:74.5%; float:left;}
#main .twoColRight .mainCol h1 {padding-left:1.5em;}
.twoColRight .mainCol .paddingBox {margin:0.5em 2em 2em 2em; padding-top:0.5em; border-top:4px double #BEBEBE;}
.twoColRight .sideBar {width:24.5%; float:left;}
.twoColRight .sideBar .paddingBox {margin:0.5em 2em 2em 5em; padding-top:0.5em; border-top:4px double #4BA3D3;}

/* TWO COL MIDDLE */
.twoColMiddle {}
.twoColMiddle .leftCol {width:49.5%; float:left;}
.twoColMiddle .leftCol .paddingBox {margin:2.5em 2.5em 2em 5em; padding-top:0.5em;}
.twoColMiddle .rightCol {width:49.5%; float:left;}
.twoColMiddle .rightCol .paddingBox {margin:2.5em 5em 2em 2.5em; padding-top:0.5em;}

.contact .twoColMiddle .leftCol {width:32.5%;}
.contact .twoColMiddle .rightCol {width:66.5%;}


.twoColRight .twoColMiddle .leftCol {width:66%;}
.twoColRight .twoColMiddle .leftCol .paddingBox {margin:1em; margin-left:2em; border:none;}
.twoColRight .twoColMiddle .rightCol {width:33%; float:right;}
.twoColRight .twoColMiddle .rightCol .paddingBox {margin:1em; margin-right:2em;  border:none;}


ul.clientList {padding-left:0;}
.clients .paddingBox ul.clientList li {padding:0.3em 0em; background:none; list-style:none;}
ul.clientList li a {}
ul.clientList li span {color:#000000;}
ul.clientList li a:hover {}
ul.clientList li.active span {font-weight:700;}

.article .header .heading {margin-top:0.5em;}
.article .header .meta {color:#999; margin-bottom:0.5em; font-size:93%;}
.article .footer {color:#777; margin-top:0.25em; margin-bottom:0.5em; font-size:85%;}

.spec.name {margin-bottom:0.5em;}
.spec.email {margin-top:0.5em;}
.spec.btw {margin-top:0.75em;}

.conditions {margin-top:0.25em;}

.newsItem .footer {color:#777; margin-top:0.25em; margin-bottom:0.5em; font-size:85%;}

/* download link ------------------------------------------------------------ */
a.download {padding-left:18px;}
a.download.pdf {background:url("img/pdf.gif") left 0em no-repeat;}


.article {margin-bottom:1.5em;}
#main .article h2 {font-size:123.1%;}

.job {margin-top:1.5em; margin-bottom:1.5em;}
#main .job h2 {font-size:123.1%;}

/* generic notification ----------------------------------------------------- */
.notify {padding:0em 0.5em 0.5em 26px; margin:0.5em;}
.notify .title {margin:0; margin-top:0.5em;}
.notify .title span {font-size:135%; font-weight:700;}
.notify .message {margin-top:0.5em;}

/* confirmation (notification) ---------------------------------------------- */
.notify.confirm {border:1px solid #87ab87; background:#f5fff5 url("../images/notifyConfirm.gif") 0.25em 0.6em no-repeat;}
.notify.confirm .title {color:#87ab87;}
.notify.confirm .message {color:#87ab87;}





/* ========================================================================== */
/* 08. form layout                                                            */
/* ========================================================================== */

/* formbox ------------------------------------------------------------------ */
.formbox {border:1px solid #a9a9a9; background:#fdfdff; margin:0.5em 0em;}
.formbox .formheader {padding:0.5em 1em; background:#e8ecff;}
.formbox .formcontent {padding:0.5em 1em;}
.formbox .formfooter {padding:0.5em 1em; background:#e8ecff;}

/* formbox (inline) --------------------------------------------------------- */
.formbox.inline {border:none; background:none;}
.formbox.inline .formcontent {display:inline; padding:0; float:left;}
.formbox.inline .formcontent form {display:inline;}
.formbox.inline .formcontent .controls {display:inline; margin:0;}
.formbox.inline .formfooter {display:inline; padding:0; background:none; float:right;}

/* required legend ---------------------------------------------------------- */
.formheader .requiredLegend {text-align:right; font-weight:700;}
fieldset .requiredLegend {border:1px solid #a9a9a9; margin:0.5em 0em; padding:0.5em; background:#e8ecff;}

/* fieldset ----------------------------------------------------------------- */
fieldset {margin-top:1.5em;}
fieldset .fields {margin:1.25em 0em;}
fieldset.level1 {border-top:2px solid #2483b3; padding-left:0.01em;}
fieldset.level1 legend.level1 {padding:0em 0.5em; margin-left:0.75em; font-weight:700; color:#000000;}
fieldset.level2 {margin-left:2em; border:1px solid #78b1d1; border-left:none; border-right:none; padding-left:0.01em;}
fieldset.level2 legend.level2 {padding:0em 0.5em; margin-left:0.75em; font-weight:700; color:#909090;}

/* fieldset error ----------------------------------------------------------- */
fieldset.error {border-top-color:#f36161; border-top-style:dashed;}
fieldset.error legend.level1, fieldset.error legend.level2 {color:#f36161;}
.fieldgroupError {border:1px solid #f36161; background:#fff1ee url("img/fielderror.gif") 6px 0.8em no-repeat; padding:0.5em; padding-left:20px; color:#f36161; margin:0.5em 0em;}

/* formrow ------------------------------------------------------------------ */
.formrow {margin:0.75em 0em;}
.formrow:after {content: "."; display:block; height:0; clear:both; visibility:hidden;}
.formrow {display:inline-block;}
/* Hides from IE-mac \*/
* html .formrow {height:1%;}
.formrow {display:block;}
/* End hide from IE-mac */

/* formrow feedback --------------------------------------------------------- */
.formrow .rowFeedback {clear:both; margin-left:9.5em; line-height:1.22em;}
.formrow .rowFeedback .error {color:#f36161;}

/* input element ------------------------------------------------------------ */
.formrow .inputElement {float:left;}
.formrow fieldset.inputElement {position:relative; margin-top:0;}

/* input caption ------------------------------------------------------------ */
.formrow .inputElement .inputCaption {float:left; text-align:right; line-height:1.75em;}
.formrow .inputElement .inputCaption .label {width:8em; display:block; margin-right:1em; position:relative;}
.formrow .inputElement .inputCaption .label .required {position:absolute; right:-0.5em; top:0em;}
.formrow fieldset.inputElement .inputCaption .label {position:absolute; left:0; top:0;}

/* input caption hint ------------------------------------------------------- */
.formrow .inputElement .inputCaption .label .captionHint {font-size:85%; color:#666666;}

/* input control -------------------------------------------------------------*/
.formrow .inputElement .inputControl {margin-left:9.5em;}
.formrow .inputElement .inputControl .controls, .formrow .inputElement .inputControl .controlHint {display:inline;}
.formrow .inputElement .inputControl .controls .control {display:inline;}
.formrow .inputElement .inputControl .controls .control input {border:1px solid #a5acb2;}
.formrow .inputElement .inputControl .controls .control input {height:1.25em; display:inline;}

/* input element hint ------------------------------------------------------- */
.formrow .inputElement .inputControl div.controlHint {line-height:1.5em; font-size:85%; color:#666666;}

/* input element help ------------------------------------------------------- */
.formrow .inputElement .inputControl .controls .inputHelp img {vertical-align:bottom;}

/* input element feedback --------------------------------------------------- */
.formrow .inputElement .inputControl .inputFeedback {display:block;}
.formrow .inputElement .inputControl .inputFeedback div {margin:0.25em 0em; display:block;}
.formrow .inputElement .inputControl .inputFeedback .error {color:#f36161; padding-left:13px; background:url("img/fielderror.gif") left 0.1em no-repeat;}
.formrow .inputElement .inputControl .inputFeedback .confirmation {color:#959595;}

/* input element (extra) ---------------------------------------------------- */
.formrow .inputElement.extra {margin-left:1em; width:auto;}
.formrow .inputElement.extra .inputCaption .label {width:auto; margin-right:0.5em; position:static; display:inline;}
.formrow .inputElement.extra .inputCaption .label .required {position:static;}
.formrow .inputElement.extra .inputControl {margin-left:0; float:left;}

/* input element (compact) -------------------------------------------------- */
.formrow .inputElement.small .inputCaption {float:none; display:block; text-align:left; margin-bottom:0.5em;}
.formrow .inputElement.small .inputCaption .label {position:static;}
.formrow .inputElement.small .inputControl {margin-left:0;}

/* button group ------------------------------------------------------------- */
.buttongroup .abort {float:left;}
.buttongroup .advance * {float:right; margin-left:1em;}

/* form error --------------------------------------------------------------- */
.expandCollapse.formError .head {border-color:#f36161;}
.expandCollapse.formError .head .title span {color:#f36161;}
.expandCollapse.formError .box {border-color:#f36161; background:#fff1ee; color:#f36161; padding:0.5em; }
.expandCollapse.formError .box ul li {padding-left:12px; background:url("img/error-list.gif") left 0.45em no-repeat; line-height:1.25em;}
/* classes for javascript */
.expandCollapse.formError .open .head .title span {background-image:url("img/error-collapse.gif");}
.expandCollapse.formError .closed .head .title span {background:url("img/error-expand.gif");}
 .home .paddingBox .expandCollapse.formError ul li {list-style-image:none;}
 
/* form help ---------------------------------------------------------------- */
.expandCollapse.formHelp .head {border-color:#2483b3;}
.expandCollapse.formHelp .head .title span {color:#2483b3; background-image:url("img/help-collapse-none.gif");}
.expandCollapse.formHelp .box {border-color:#2483b3; background:#fdfdff; color:#000000; }
/* classes for javascript */
.expandCollapse.formHelp .open .head .title span {background-image:url("img/help-collapse.gif");}
.expandCollapse.formHelp .closed .head .title span {background-image:url("img/help-expand.gif");}

/* ========================================================================== */
/* 09. specific input elements                                                */
/* ========================================================================== */

/* radiobutton list --------------------------------------------------------- */
.formrow .inputElement.radiolist {float:none;}
.formrow .inputElement.radiolist .inputControl .controls {line-height:1.75em; position:relative; padding-left:20px; display:block;}
.formrow .inputElement.radiolist .inputControl .controls input {position:absolute; left:0; top:0.4em; width:15px; height:15px; vertical-align:middle;}

/* checkbox list ------------------------------------------------------------ */
.formrow .inputElement.checklist {float:none;}
.formrow .inputElement.checklist .inputControl .controls {line-height:1.75em; position:relative; padding-left:20px; float:left; clear:left;}
.formrow .inputElement.checklist .inputControl .controls input {position:absolute; left:0; top:0.4em; width:15px; height:15px; vertical-align:middle;}

/* checkbox grid ------------------------------------------------------------ */
.formrow .inputElement.checklist.grid .col {float:left; border-right:1px solid #c0c0c0; margin-right:1em; padding-right:1em;}
.formrow .inputElement.checklist.grid .col.last {border-right:none;}

/* transfer list ------------------------------------------------------------ */
.formrow .inputElement.transfer .inputControl .controls {float:left;}
.formrow .inputElement.transfer .inputControl .controls select {padding-right:0.25em; padding-left:0.25em; height:10em;}
.formrow .inputElement.transfer .inputControl .controls select option {margin-top:0.1em;}
.formrow .inputElement.transfer .inputControl .controls.actions {margin:0.5em 1.25em;}
.formrow .inputElement.transfer .inputControl .controls.actions button {width:3em; display:block; margin:0.5em 0em;}

/* date --------------------------------------------------------------------- */
.formrow .inputElement.date .inputControl .controls .datepickerIcon img {vertical-align:-20%;}
