/** cim css **/

/* by boris grudinin */
/* http://www.connexion.co.uk/ */
/* ---------------------------- */

/* ---------------------------- */
/*** main styles ***/

* { margin: 0; padding: 0; }
body { background: #ffffff; font-family: Trebuchet MS, Helvetica, sans-serif; }

.left { float: left; }
.right { float: right; }

a img { border: none; }

/* ---------------------------- */
/*** setting up the page ***/

div#main { position: relative; width: 936px; margin: 0 auto; }
div#content { position: relative; width: 749px; height: 382px; overflow: hidden; float: left; }
div#content div.content { position: relative; width: 530px; height: 307px; margin: 34px 0px 0px 188px; overflow: auto; }
div#top { position: relative; height: 513px; }
div#bottom { position: relative; clear: both; height: 50px; }

/* ---------------------------- */
/*** home ***/

body#home div#bottom { background: url(../img/home/bottom.jpg) left top no-repeat; }

body#home div#left { float: left; width: 387px; }
body#home div#right { float: right; width: 549px; height: 514px; background: url(../img/home/bg-right.jpg) -1px top no-repeat; }
body#home div#right object { width: 548px; height: 514px; }

body#home div#left div#logo { position: relative; height: 130px; background: url(../img/home/bg-top-left.jpg) left top no-repeat; }

/* ---------------------------- */
/*** green ***/

body#green div#bottom { background: url(../img/bg/bg-bottom-green.jpg) left top no-repeat; }

body#green div#right { float: left; width: 186px; height: 382px; background: url(../img/bg/bg-right-green.jpg) -1px top no-repeat; }

body#green div#logo { background: url(../img/bg/bg-top-green.jpg) left top no-repeat; height: 133px; }
body#green div#content { background: url(../img/bg/bg-content-green.jpg) left top no-repeat; }

body#green div#content h1 { background: url(../img/arrows/green-arrow2.gif) left center no-repeat; color: #92c954; padding-left: 24px; }
body#green div#content h2 { color: #92c954; }
body#green div#content h3 { color: #92c954; }
body#green div#content span.page { color: #92c954; }
body#green div#content div.page a.next { background: url(../img/arrows/green-arrow2.gif) left center no-repeat; color: #92c954; }
body#green div#content div.page a.back { background: url(../img/arrows/green-arrow3.gif) left center no-repeat; color: #92c954; }

/* ---------------------------- */
/*** blue ***/

body#blue div#bottom { background: url(../img/bg/bg-bottom-blue.jpg) left top no-repeat; }

body#blue div#right { float: left; width: 186px; height: 382px; background: url(../img/bg/bg-right-blue.jpg) -1px top no-repeat; }

body#blue div#logo { background: url(../img/bg/bg-top-blue.jpg) left top no-repeat; height: 133px; }
body#blue div#content { background: url(../img/bg/bg-content-blue.jpg) left top no-repeat; }

body#blue div#content h1 { background: url(../img/arrows/blue-arrow2.gif) left center no-repeat; color: #0096a8; padding-left: 24px; }
body#blue div#content h2 { color: #0096a8; }
body#blue div#content h3 { color: #0096a8; }
body#blue div#content span.page { color: #0096a8; }
body#blue div#content div.page a.next { background: url(../img/arrows/blue-arrow2.gif) left center no-repeat; color: #0096a8; }
body#blue div#content div.page a.back { background: url(../img/arrows/blue-arrow3.gif) left center no-repeat; color: #0096a8; }
body#blue div#content p strong { color: #0096a8; }

/* ---------------------------- */
/*** purple ***/

body#purple div#bottom { background: url(../img/bg/bg-bottom-purple.jpg) left top no-repeat; }

body#purple div#right { float: left; width: 186px; height: 382px; background: url(../img/bg/bg-right-purple.jpg) -1px top no-repeat; }

body#purple div#logo { background: url(../img/bg/bg-top-purple.jpg) left top no-repeat; height: 133px; }
body#purple div#content { background: url(../img/bg/bg-content-purple.jpg) left top no-repeat; }

body#purple div#content h1 { background: url(../img/arrows/purple-arrow2.gif) left center no-repeat; color: #992a8c; padding-left: 24px; }
body#purple div#content h2 { color: #992a8c; }
body#purple div#content h3 { color: #992a8c; }

/* ---------------------------- */
/*** orange ***/

body#orange div#bottom { background: url(../img/bg/bg-bottom-orange.jpg) left top no-repeat; }

body#orange div#right { float: left; width: 186px; height: 382px; background: url(../img/bg/bg-right-orange.jpg) -1px top no-repeat; }

body#orange div#logo { background: url(../img/bg/bg-top-orange.jpg) left top no-repeat; height: 133px; }
body#orange div#content { background: url(../img/bg/bg-content-orange.jpg) left top no-repeat; }

body#orange div#content h1 { background: url(../img/arrows/orange-arrow2.gif) left center no-repeat; color: #f68912; padding-left: 24px; }
body#orange div#content h2 { color: #f68912; }

/* ---------------------------- */
/*** red ***/

body#red div#bottom { background: url(../img/bg/bg-bottom-red.jpg) left top no-repeat; }

body#red div#right { float: left; width: 186px; height: 382px; background: url(../img/bg/bg-right-red.jpg) -1px top no-repeat; }

body#red div#logo { background: url(../img/bg/bg-top-red.jpg) left top no-repeat; height: 133px; }
body#red div#content { background: url(../img/bg/bg-content-red.jpg) -1px top no-repeat; }

body#red div#content h1 { background: url(../img/arrows/red-arrow2.gif) left center no-repeat; color: #cd3a59; padding-left: 24px; }
body#red div#content h2 { color: #cc0000; }
body#red div#content p strong { color: #cc0000; }
body#red div#content p strong a { color: #cc0000; }

/* ---------------------------- */
/*** logo ***/

div#logo a.logo { position: absolute; top: 0; left: -18px; padding-top: 17px; display: block; width: 191px; height: 48px; margin-bottom: 24px;}
div#logo a.about { position: absolute; top: 93px; left: 79px; display: block; color: #808285; text-decoration: none; width: 80px; }
div#logo a.about:hover, div#logo a.active { color: #cc0000; text-decoration: underline; }

/* ---------------------------- */
/*** content ***/

div#content h1 { display: inline; float: left; font-size: 140%; font-weight: normal; margin-bottom: 6px; }
div#content h2 { font-size: 130%; font-weight: normal; margin: 0px 0px 8px 23px; }
div#content h3 { font-size: 90%; margin: 0px 0px 2px 23px; }

div#content p { margin: 0px 0px 8px 24px; color: #454545; line-height: 140%; font-size: 80%; clear: both; width: 480px; }
div#content p a { color: #454545; }
div#content p a:hover { text-decoration: none; }
div#content p a.pdf { display: block; width: 190px; background: url(../img/pdf.gif) left center no-repeat; padding-left: 36px; }
div#content p a.sample { display: block; width: auto; margin-right: 15px; }

div#content ul.text { color: #454545; font-size: 80%; line-height: 140%; margin: 0px 0px 0px 40px; }
div#content ul.text li { margin-bottom: 6px; }

div#content ul.form { list-style: none; line-height: 150%; overflow: hidden; margin: 20px 0px 0px 24px; width: 485px; }
div#content ul.form li { float: left; width: 220px; margin-right: 20px; overflow: hidden; margin-bottom: 4px; }
div#content ul.form li label { float: left; width: 95px; font-size: 75%; padding-bottom: 4px; color: #454545; }
div#content ul.form li label.short { width: 86px !important; }
div#content ul.form li label.required { font-weight: bold; }
div#content ul.form li input { float: right; width: 108px; padding: 2px; font-size: 75%; }
div#content ul.form li input.button { width: 50px; font-size: 70%; font-weight: bold; padding: 2px 1px; float: left; }
div#content ul.form li.title { }
div#content ul.form li.title label { width: 40px; }
div#content ul.form li.title input { float: left; width: 40px; margin-left: 10px; }
div#content ul.form li.title select { float: left; width: 70px; margin-left: 10px; }
div#content ul.form li.member label { width: 120px; }
div#content ul.form li.member input { width: 85px; }
div#content ul.form li.long { width: 460px; float: none; clear: both; }
div#content ul.form li.long label { width: 280px; }
div#content ul.form li.long select { width: 150px; }
div#content ul.form li.medium { width: 384px; float: none; clear: both; }
div#content ul.form li.medium label { width: 200px; }
div#content ul.form li.medium input { width: 175px; }
div#content ul.form li.medium select { width: 140px; }
div#content ul.form li.short { width: 220px; float: none; clear: both; }
div#content ul.form li.short label { width: 95px; }
div#content ul.form li.radio span.radio { float: left; }
div#content ul.form li.radio span.radio label { width: 40px; float: left; }
div#content ul.form li.radio span.radio input { float: left; }
div#content ul.form li.radio span.radio br { display: none; }
div#content ul.form li.radio input { width: auto; float: left; margin: 6px 4px 0px 3px; }
div#content ul.form li span.disc { display: block; font-size: 70%; width: 460px; line-height: 140%; }
div#content ul.form li.margin input { margin-left: 0; }

div#content span.page { float: left; font-size: 80%; padding: 6px 0px 0px 4px; line-height: 160%; }

div#content div.page { position: absolute; bottom: 0; left: 2px; }
div#content div.page a { text-decoration: none; }
div#content div.page a.next { padding-left: 23px; margin-right: 10px; }
div#content div.page a.back { padding-left: 23px; }
div#content div.page a:hover { color: #454545 !important; }

/* ---------------------------- */
/*** info ***/

div#content div.info p { margin: 0px 0px 0px 24px; color: #454545; line-height: 140%; font-size: 80%; }
div#content div.info p a { color: #454545; }
div#content div.info p a:hover { text-decoration: none; }

/* ---------------------------- */
/*** right ***/

div#right ul { list-style: none; margin: 250px 0px 0px 22px; font-size: 75%; line-height: 170%; }
div#right ul li.green, div#right ul li.green a { color: #92c954; text-decoration: none; }
div#right ul li.orange, div#right ul li.orange a { color: #f68912; text-decoration: none; }
div#right ul li.purple, div#right ul li.purple a { color: #992a8c; text-decoration: none; }
div#right ul li.blue, div#right ul li.blue a { color: #0096a8; text-decoration: none; }
div#right ul li a:hover, div#right ul li a.active { font-weight: bold; }

div#right div.links { position: relative; width: 80px; margin: 19px 0px 0px 102px; }
div#right a.green { display: block; width: 35px; height: 32px; float: left; margin-right: 2px; }
div#right a.orange { display: block; width: 35px; height: 32px; float: left; }

/* ---------------------------- */
/*** bottom ***/

div#bottom span.apply { padding: 21px 0px 0px 80px; color: #808285; line-height: 130%; }
div#bottom span.apply a { color: #cc0000; }
div#bottom span.apply a:hover { text-decoration: none; }
div#bottom span.apply img { float: left; padding: 1px 5px 0px 0px; }

div#bottom span.quote { padding: 19px 0px 0px 76px; color: #ffffff; line-height: 130%; font-style: italic; font-size: 90%; width: 410px; }
div#bottom span.double { padding: 4px 0px 0px 76px !important; }

div#bottom div.links { float: right; width: 80px; margin: 4px 5px 0px 0px; }
div#bottom a.purple { display: block; width: 35px; height: 32px; float: left; margin-right: 2px; }
div#bottom a.blue { display: block; width: 35px; height: 32px; float: left; }