﻿/*
 * styles.css
 * Copyright (C) 2008
 * Author: Andrey Kotsar <Andrey.Kotsar@intego-group.com>
 * Created: November 11, 2008
 *
 * Main stylesheets for the Intego Group Web site.
 */
 
*
{
    margin: 0;
    padding: 0;
}

IMG
{
	border: none;
}

.clear
{
    clear: both !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    visibility: hidden !important;
}

.hide
{
	display: none !important;
}

UL
{
    list-style: none;
}

UL.list
{
    list-style: disc;
    margin: 18px 0 0 60px;
}

UL.list.largemargin LI
{
	margin-bottom: 20px;
}

HTML
{
	height: 100%;
}

BODY
{
    width: 100%;
    height: 100%;
    text-align: center;
    font-family: Arial, Tahoma, Verdana;
    font-size: 13px;
    color: black;
    background: Silver;
}

P
{
    text-align: justify;
    margin-bottom: 14px;
    margin-top: 14px;
}

H4, H5
{
	text-align: center;
}

A
{
    color: #004080;
    font-weight: bold;
    text-decoration: none;
}

A:hover
{
    text-decoration: underline;
}

SPAN.required
{
	color: Red;
}

P.topmargin
{
	margin-top: 35px;
}

IMG.center
{
	margin: 0 auto;
	display: block;
}

TABLE
{
	border: 2px #fff;
}

TABLE THEAD
{
	background-color: #f26522;
	color: White;
	font-family: Arial, Tahoma, Verdana;
	font-size: 11px;
	font-weight: bold;
	white-space: nowrap;
}

TABLE THEAD TH
{
	padding: 8px 5px;
}

TABLE TBODY TD
{
	padding: 10px 5px;
}

DIV.left
{
	float: left;
	padding: 0 20px 0 0;
}

/* Common parts */
#wrapper
{
	position: relative;
    width: 1056px;
    margin: 0 auto;
    border-left: 1px solid #999999;
    border-right: 1px solid #999999;
    text-align: left;
    background: white;
    min-height: 100%;
}

#int-wrapper
{
    padding: 0 9px 0 9px;
}

/* Header */
#header
{
    position: relative;
    height: 87px;
}

H1.logo A
{
    display: block;
    background: url('../images/logo_intego.jpg') center no-repeat;
    width: 171px;
    height: 85px;
    text-indent: -4000px;
    margin-left: 51px;
}

UL.top-links
{
    position: absolute;
    top: 0;
    right: 0;
    background-color: #3a7492;
}

UL.top-links LI
{
    float: left;
    padding: 1px 10px;
}

UL.top-links LI A
{
    width: 19px;
    height: 19px;
    overflow: hidden;
    display: block;
    text-indent: -4000px;
}

UL.top-links LI.home A { background: url('../images/icon_home.png') center no-repeat; }
UL.top-links LI.contact A { background: url('../images/icon_contact1.png') center no-repeat; }

#main-menu
{
    height: 250px;
}

#main-menu #static-menu
{
	width: 1038px;
	height: 250px;
	position: relative;
}

#main-menu #static-menu UL.main-menu
{
	position: absolute;
	left: 844px;
	top: 127px;
}

#main-menu #static-menu UL.main-menu LI A, #main-menu #static-menu UL.sub-menu LI A
{
	font-family: Arial, Tahoma;
	font-size: 13px;
	line-height: 24px;
	color: Black;
	text-decoration: none;
}

#main-menu #static-menu UL.main-menu LI A.selected, #main-menu #static-menu UL.sub-menu LI A.selected
{
	font-size: 16px;
}

#main-menu #static-menu UL.main-menu LI.about A.selected, #main-menu #static-menu UL.sub-menu.about LI A.selected { color: #9f0c10; }
#main-menu #static-menu UL.main-menu LI.centers A.selected, #main-menu #static-menu UL.sub-menu.centers LI A.selected { color: #f36623; }
#main-menu #static-menu UL.main-menu LI.ukraine A.selected, #main-menu #static-menu UL.sub-menu.ukraine LI A.selected { color: #01afef; }
#main-menu #static-menu UL.main-menu LI.people A.selected, #main-menu #static-menu UL.sub-menu.people LI A.selected { color: #007038; }
#main-menu #static-menu UL.main-menu LI.join A.selected, #main-menu #static-menu UL.sub-menu.join LI A.selected { color: #ffb500; }

#main-menu #static-menu UL.main-menu LI A:hover, #main-menu #static-menu UL.sub-menu LI A:hover
{
	font-size: 16px;
	color: Black;
}

#main-menu #static-menu UL.sub-menu
{
	position: absolute;
	right: 318px;
	bottom: 130px;
	text-align: right;
}

#main-menu #static-menu UL.sub-menu LI A:hover
{
	font-size: 14px;
}

#main-menu #static-menu UL.sub-menu LI A.selected:hover
{
	font-size: 16px;
}


#subheader { height: 96px; padding-top: 6px; }

#subheader DIV.promo, #subheader H2
{
    text-indent: -4000px;
    width: 1036px;
    display: block;
}

#subheader DIV.promo
{
	height: 70px;
}

#subheader DIV { float: left; }
#subheader H2 { width: 798px; }

DIV.title-links A
{
    display: block;
    float: left;
    font-family: Verdana, Arial, Tahoma;
    color: #F26522;
    font-size: 11px;
    padding: 9px 28px 0 20px;
    height: 18px;
}

DIV.title-links A.contact
{
    background: url('../images/icon_contact.png') right 8px no-repeat;
}

DIV.title-links A.saleskit
{
    background: url('../images/icon_downloads.png') right 2px no-repeat;
    padding-right: 26px;
}

H3#subsubheader
{
    display: block;
    padding-left: 20px;
    margin: 20px 0 0 50px;
    background: url('../images/red_cube.png') left 10px no-repeat;
    font-size: 21px;
}

#content
{
    padding-left: 10px;
    margin-top: 8px;
    width: 756px;
    float: left;
    overflow: hidden;
}

#additional-info
{
    float: left;
    width: 270px;
    margin-top: 22px;
    text-align: center;
}

#footer
{
    width: 1036px;
    background: url('../images/img17.jpg') right no-repeat;
    height: 96px;
    color: black;
    font-size: 10px;
    font-family: Verdana, Arial, Tahoma;
    padding-top: 65px;
}

DIV.info-box
{
    padding-top: 24px;
    width: 168px;
    margin: 0 auto;
    margin-bottom: 30px;
    text-align: left;
}

DIV.info-box H5
{
    background: url('../images/back_right.jpg') center top no-repeat;
    height: 21px;
    display: block;
    text-align: center;
    width: 168px;
    color: white;
    font-size: 13px;
    font-weight: bold;
    padding-top: 3px;
}

DIV.info-box DIV.content
{
    width: 153px;
    border-left: 1px solid #cdcdcd;
    border-right: 1px solid #cdcdcd;
    padding: 15px 5px 15px 8px;
    font-family: Verdana, Arial, Tahoma;
    font-size: 11px;
    position: relative;
}

DIV.info-box DIV.content.center
{
	text-align: center;
}

DIV.info-box DIV.content A
{
	text-decoration: none;
}

DIV.info-box DIV.content A SPAN
{
    margin: 0 0 13px 0;
    text-align: left;
    font-weight: normal;
    text-decoration: none;
}

DIV.info-box DIV.content A:hover SPAN
{
	text-decoration: underline;
}

DIV.info-box DIV.footer
{
    width: 168px;
    background: url('../images/back_right1.jpg') center bottom no-repeat;
    height: 6px;
    position: absolute;
    left: -1px;
    bottom: -2px;
}

DIV.info-box HR
{
	border: none;
	background: #B6B6B6;
	height: 1px;
	margin-bottom: 13px;
}

DIV.contact-info-box
{
	margin-left: 50px;
}

DIV.contact-info-box P.country-name
{
	margin-top: 50px;
}

DIV.gray-box
{
	width: 540px;
	margin: 0 auto;
	background-color: #d8d8d8;
	position: relative;
	padding: 18px 30px;
}

DIV.gray-box.large
{
	width: 696px;
}

DIV.gray-box DIV.corner-tl, DIV.gray-box DIV.corner-tr, DIV.gray-box DIV.corner-bl, DIV.gray-box DIV.corner-br
{
	position: absolute;
	width: 10px;
	height: 10px;
}

DIV.gray-box DIV.corner-tl
{
	background: url('../images/coner_2.png') center no-repeat;
	left: 0;
	top: 0;
}

DIV.gray-box DIV.corner-tr
{
	background: url('../images/coner_3.png') center no-repeat;
	right: 0;
	top: 0;
}

DIV.gray-box DIV.corner-bl
{
	background: url('../images/coner_1.png') center no-repeat;
	left: 0;
	bottom: 0;
}

DIV.gray-box DIV.corner-br
{
	background: url('../images/coner_4.png') center no-repeat;
	right: 0;
	bottom: 0;
}

DIV.gray-box UL.list
{
	margin-left: 25px;
	margin-top: 0;
}

DIV.companylogos
{
	margin: 50px 30px 0 41px;
}

DIV.companylogos DIV
{
	margin-bottom: 2px;
}

DIV.companylogos DIV.left
{
	float: left;
}

DIV.companylogos DIV.left.ml20
{
	margin-left: 20px;
}

DIV.companylogos DIV.left.ml15
{
	margin-left: 15px;
}

DIV.companylogos DIV.right
{
	float: right;
}

DIV.companylogos DIV.center
{
	margin-left: auto;
	margin-right: auto;
}

DIV.top-margin
{
	margin-top: 60px;
}

DIV.shadow
{
	position: absolute;
	left: 0px;
	top: 0px;
	z-index: 999;
	background-color: Black;
	width: 100%;
	height: 100%;
}

DIV.modal
{
	z-index: 1000;
	background-color: White;
	position: absolute;
}

DIV.modal DIV.corner-tl, DIV.modal DIV.corner-tr, DIV.modal DIV.corner-bl, DIV.modal DIV.corner-br
{
	width: 3px;
	height: 3px;
	position: absolute;
	display: block;
}

DIV.modal DIV.corner-tl
{
	background: url(../images/modal_tl.gif) 0 0 no-repeat;
	left: 0;
	top: -3px;
}

DIV.modal DIV.corner-tr
{
	background: url(../images/modal_tr.gif) 0 0 no-repeat;
	right: 0;
	top: -3px;
}

DIV.modal DIV.corner-bl
{
	background: url(../images/modal_bl.gif) 0 0 no-repeat;
	left: 0;
	bottom: -3px;
}

DIV.modal DIV.corner-br
{
	background: url(../images/modal_br.gif) 0 0 no-repeat;
	right: 0;
	bottom: -3px;
}

DIV.modal DIV.top-line, DIV.modal DIV.bottom-line
{
	background-color: White;
	position: absolute;
	left: 3px;
	height: 3px;
	right: 3px;
	overflow: hidden;
}

DIV.modal DIV.top-line
{
	top: -3px;
}

DIV.modal DIV.bottom-line
{
	bottom: -3px;
}

DIV.modal H5
{
	font-size: 13px;
	margin: 5px auto;
	overflow: hidden;
}

DIV.modal A.close
{
	display: block;
	float: right;
	text-indent: -4000px;
	overflow: hidden;
	width: 22px;
	height: 22px;
	background-color: Red;
	margin: 1px 10px 0 0;
	background: url('../images/modal_close.gif') center no-repeat;
}

DIV.modal DIV.content-container
{
	position: absolute;
	left: 10px;
	top: 28px;
	right: 10px;
	bottom: 10px;
	overflow: hidden;
}

/******************************************************************
 * Business card
 *******************************************************************/

DIV#businessCard DIV.content-container
{
	background-color: Black;
}

DIV#businessCard DIV.content-container DIV.loading
{
	padding: 150px 0 0 0;
	margin: 0 auto;
	color: White;
}

/******************************************************************
 * Hot Openings
 *******************************************************************/
UL.hot-openings
{
	font-size: 10px;
}

UL.hot-openings LI
{
	display: block;
	margin-bottom: 16px;
	background: url('../images/cyrcle.jpg') left 2px no-repeat;
}

UL.hot-openings LI A
{
	text-decoration: none;
	display: block;
	padding-left: 11px;
}

UL.hot-openings LI A:hover, UL.hot-openings LI A:hover STRONG
{
	text-decoration: underline;
}

DIV.info-box A.rss-feed
{
	display: block;
	font-family: Arial, Tahoma, Verdana;
	font-size: 12px;
	padding-left: 17px;
	background: url('../images/rss.png') 0 0 no-repeat;
}

/******************************************************************
 * Contacts Form
 *******************************************************************/

DIV.contacts-form, DIV.sent
{
	width: 513px;
	margin: 70px auto 0 auto;
}

DIV.sent
{
	background: url('../images/send1.jpg') 0 40px no-repeat;
	height: 440px;
}

DIV.sent.saleskit
{
	background: url('../images/send2.jpg') 0 40px no-repeat;
}

DIV.contacts-form LABEL
{
	display: block;
	float: left;
	width: 80px;
	margin-bottom: 10px;
}

DIV.contacts-form SELECT
{
	float: left;
}

DIV.contacts-form DIV.state
{
	float: left;
}

DIV.contacts-form INPUT.shift
{
	margin: 0 0 10px 80px;
}

DIV.contacts-form INPUT.longtext
{
	float:left;
	width: 410px;
}

DIV.contacts-form INPUT.shorttext, DIV.contacts-form SELECT.shorttext, DIV.contacts-form DIV.state INPUT, DIV.contacts-form DIV.state SELECT
{
	float:left;
	width: 310px;
}

DIV.contacts-form SELECT.shorttext, DIV.contacts-form DIV.state SELECT
{
	width: 314px;
}

DIV.contacts-form TEXTAREA
{
	width: 410px;
	margin-bottom: 10px;
}

DIV.contacts-form INPUT.button
{
	float: right;
	margin-left: 7px;
	padding: 3px 10px;
	border: none;
	background-color: #3A7492;
	color: White;
	cursor: pointer;
	font-size: 11px;
	font-family: Verdana, Tahoma, Arial;
}

/******************************************************************
 * Index
 *******************************************************************/
#wrapper.index #subheader DIV.promo
{
    background: url('../images/title_index2.jpg') center no-repeat;
}

#wrapper.index #subheader H2
{
    height: 26px;
    background: url('../images/title_welcome.jpg') center no-repeat;
}

#wrapper.index #content
{
	width: 1036px;
	padding-left: 0;
}

#wrapper.index #additional-info
{
	display: none;
}

DIV.boxes
{
	background: url('../images/boxes_footer.gif') 0 0 repeat-y;
	padding-bottom: 1px;
	float: left;
}

DIV.boxes DIV.boxes-inner
{
	float: left;
	overflow: hidden;
}

DIV.boxes DIV.box
{
	float: left;
	border: 1px solid #b9b9b9;
	background: #d9d9d9;
	margin-bottom: -1000px;
	padding-bottom: 1010px;
}

DIV.boxes DIV.box.b1
{
	width: 420px;
	text-align: center;
}

DIV.boxes DIV.box.b1 IMG
{
	margin: 18px auto 0 auto;
}

DIV.boxes DIV.box.b1 DIV.list-container
{
	margin: 24px auto 0 auto;
	width: 325px;
}

DIV.boxes DIV.box.b1 DIV.list-container UL
{
	text-align: left;
}

DIV.boxes DIV.box.b1 UL LI
{
	font-weight: bold;
	font-size: 13px;
	margin-top: 8px;
	background: url('../images/index_bullet.gif') 0px 3px no-repeat;
	padding-left: 21px;
}

DIV.boxes DIV.box.b1 UL LI STRONG
{
	font-size: 17px;
	display: block;
	float: left;
	width: 40px;
	position: relative;
	top: -2px;
}

DIV.boxes DIV.box.b2
{
	width: 540px;
	margin-left: 9px;
	padding: 23px 19px 1010px 43px;
	font-size: 12px;
}

DIV.boxes DIV.box.b2 P
{
	margin-top: 18px;
	line-height: 18px;
}

DIV.boxes DIV.box.b2 P A
{
	font-weight: normal;
	text-decoration: underline;
	color: black;
}

DIV.boxes DIV.box.b2 P A:hover
{
	text-decoration: none;
}

DIV.boxes DIV.box.b2 P.first
{
	margin-top: 0;
}

/******************************************************************
* About
*******************************************************************/
#wrapper.about #subheader DIV.promo
{
     background: url('../images/title_about1.jpg') center no-repeat;
}

#wrapper.about.profile #subheader DIV.promo
{
     background: url('../images/title_about_company_profile.jpg') center no-repeat;
}

#wrapper.about.services #subheader DIV.promo
{
     background: url('../images/title_about_our_services.jpg') center no-repeat;
}

#wrapper.about.outsourcing #subheader DIV.promo
{
     background: url('../images/title_about_it_outsourcing.jpg') center no-repeat;
}

#wrapper.about.infrastructure #subheader DIV.promo
{
     background: url('../images/title_about_infrastructure.jpg') center no-repeat;
}

#wrapper.about.management #subheader DIV.promo
{
     background: url('../images/title_about_management_team.jpg') center no-repeat;
}

#wrapper.management #additional-info
{
	display: none;
}

#wrapper.management #content
{
	width: 1036px;
}

/*DIV.manager
{
	margin-top: 30px;
}

DIV.manager:first-child
{
	margin-top: 0;
}*/

DIV.manager DIV
{
	float: left;
}

DIV.manager DIV.description
{
	width: 756px;
}

DIV.manager DIV.photo
{
	margin: 30px 50px 0 40px;
}

#wrapper.about #subheader H2
{
    height: 26px;
    background: url('../images/title_about3.jpg') center no-repeat;
}

/******************************************************************
* Contact
*******************************************************************/
#wrapper.contact #subheader DIV.promo
{
    background: url('../images/title_contact2.jpg') center no-repeat;
}

#wrapper.contact #subheader H2
{
    height: 26px;
    background: url('../images/title_contact3.jpg') center no-repeat;
}

/******************************************************************
* Captive Centers
*******************************************************************/
#wrapper.centers H3#subsubheader
{
	background: url('../images/orange_cube.png') left 10px no-repeat;
}

#wrapper.centers #subheader DIV.promo
{
    background: url('../images/title_vision.jpg') center no-repeat;
}

#wrapper.centers.benefits #subheader DIV.promo
{
    background: url('../images/title_vision_long_term_benefits.jpg') center no-repeat;
}

#wrapper.centers.pm #subheader DIV.promo
{
    background: url('../images/title_vision_pm.jpg') center no-repeat;
}

#wrapper.centers.startup #subheader DIV.promo
{
    background: url('../images/title_vision_start_up.jpg') center no-repeat;
}

#wrapper.centers.businessmodels #subheader DIV.promo
{
    background: url('../images/title_vision_business_models.jpg') center no-repeat;
}

#wrapper.centers #subheader H2
{
    height: 26px;
    background: url('../images/title_vision3.jpg') center no-repeat;
}

/******************************************************************
* Human Capital
*******************************************************************/
#wrapper.people H3#subsubheader
{
	background: url('../images/green_cube.png') left 10px no-repeat;
}

#wrapper.people #subheader H2
{
    height: 26px;
    background: url('../images/title_people3.jpg') center no-repeat;
}

#wrapper.people #subheader DIV.promo
{
    background: url('../images/title_people2.jpg') center no-repeat;
}

#wrapper.people.recruiting #subheader DIV.promo
{
    background: url('../images/title_people_local_recruiting.jpg') center no-repeat;
}

#wrapper.people.training #subheader DIV.promo
{
    background: url('../images/title_people_retention_training.jpg') center no-repeat;
}

#wrapper.people.association #subheader DIV.promo
{
    background: url('../images/title_people_association.jpg') center no-repeat;
}

#wrapper.people.pmi #subheader DIV.promo
{
    background: url('../images/title_people_pmi.jpg') center no-repeat;
}

/******************************************************************
 * Ukraine
 *******************************************************************/
#wrapper.ukraine HR
{
	height: 1px;
	border: none;
	border-top: 1px solid #00ACEE;
	margin: 10px 0;
}
 
#wrapper.ukraine H3#subsubheader
{
	background: url('../images/blue_cube.png') left 10px no-repeat;
}

#wrapper.ukraine #subheader H2
{
    height: 26px;
    background: url('../images/title_ukraine3.jpg') center no-repeat;
}

#wrapper.ukraine #subheader DIV.promo
{
    background: url('../images/title_ukraine2.jpg') center no-repeat;
}

#wrapper.ukraine.summary #subheader DIV.promo
{
    background: url('../images/title_ukraine_brief_summary.jpg') center no-repeat;
}

#wrapper.ukraine.outsourcing #subheader DIV.promo
{
    background: url('../images/title_ukraine_outsourcing_ukraine.jpg') center no-repeat;
}

#wrapper.ukraine P.photos
{
	margin-top: 25px;
}

#wrapper.ukraine P.photos IMG
{
	margin-left: 17px;
}

#wrapper.ukraine P.photos IMG.first
{
	margin-left: 0;
}

/******************************************************************
 * Work with Us
 *******************************************************************/
#wrapper.join #subheader H2
{
    height: 26px;
    background: url('../images/title_career3.jpg') center no-repeat;
}

#wrapper.join #subheader DIV.promo
{
    background: url('../images/title_career.jpg') center no-repeat;
}

A.apply-online
{
	display: block;
	width: 100%;
	background: #e5e5e5;
	margin: 18px 0 25px 0;
	padding: 7px 11px;
	font-size: 12px;
	font-weight: bold;
	color: #3A7492;
}


DIV.position P
{
	padding-left: 15px;
}

DIV.position P.position-title
{
	background: url('../images/bullet_join.jpg') 1px 4px no-repeat;
}

/******************************************************************
 * Sales Kit
 *******************************************************************/
#wrapper.saleskit #subheader H2
{
    height: 26px;
    background: url('../images/title_sales_kit.jpg') center no-repeat;
}

#wrapper.saleskit #subheader DIV.promo
{
    background: url('../images/title_downloads2.jpg') center no-repeat;
}
