/* ######################################################################### */
/* ############## CSS Authored by Mart Gordon - Juretic Media ############## */
/* ######################################################################### */

/* ####### Masthead ####### */
/* ######################## */

#masthead {
clear: both;
float: left;
width: 100%;
height: 177px;
background: transparent url(img/_backgrounds/masthead-bg.jpg) no-repeat top center;
}

#masthead-content {
position: relative;
top: 0;
left: 50%;
margin-left: -478px;
float: left;
width: 955px;
height: 177px;
}

#masthead h1 {
text-indent: -9999em;
}

/* ####### Navigation ####### */
/* ########################## */

#navigation {
float: left;
background: url(img/_navigation/top-navigation.gif) no-repeat;
width: 814px;
height: 31px;
position: absolute;
top: 125px;
left: 74px;
}

#navigation ul {
float: left;
width: 814px;
height: 31px;
margin: 0;
padding: 0;
list-style: none;
}

#navigation ul li {
display: block;
float: left;
height: 31px;
margin: 0;
padding: 0;
}

#navigation ul li#prods {
width: 133px;
}

#navigation ul li#distro {
width: 265px;
}

#navigation ul li#school {
width: 188px;
}

#navigation ul li#forum {
width: 228px;
}

#navigation ul li a {
display: block;
text-indent: -9999em;
height: 31px;
}

#navigation ul li#prods a:hover, #navigation ul li#prods a:focus {
background: url(img/_navigation/top-navigation.gif) no-repeat 0 -31px;
}

#navigation ul li#distro a:hover, #navigation ul li#distro a:focus {
background: url(img/_navigation/top-navigation.gif) no-repeat -133px -31px;
}

#navigation ul li#school a:hover, #navigation ul li#school a:focus {
background: url(img/_navigation/top-navigation.gif) no-repeat -398px -31px;
}

#navigation ul li#forum a:hover, #navigation ul li#forum a:focus {
background: url(img/_navigation/top-navigation.gif) no-repeat -586px -31px;
}

/* ####### Content styling ####### */
/* ############################### */

#content-wrapper {
clear: both;
float: left;
width: 100%;
height: auto;
background: transparent url(img/_backgrounds/main-bg.jpg) repeat-y top center;
padding: 10px 0 20px;
}

.homepage #content-wrapper {
background: transparent url(img/_backgrounds/home-main-bg.jpg) repeat-y top center;
}

#content-content {
position: relative;
top: 0;
left: 50%;
margin-left: -495px;
float: left;
width: 990px;
height: auto;
padding: 0;
}

#left-column {
float: left;
width: 152px;
height: auto;
position: relative;
}

/* ####### Home Content styling ####### */
/* #################################### */

#home-main {
float: left;
width: 509px;
height: auto;
margin-left: 5px;
padding: 0 5px 40px;
}

#latest-news {
float: left;
width: 509px;
height: auto;
margin-bottom: 10px;
}

#home-video {
float: left;
width: 509px;
height: 331px;
margin-bottom: 10px;
}

#home-right {
float: left;
width: 280px;
height: auto;
margin-left: 10px;
}

#home-right div {
margin-bottom: 10px;
}

#home-content-wrapper {
float: left;
width: 508px;
height: 227px;
background: url(img/_backgrounds/home-scroll-bg.png) no-repeat;
}

#home-content {
float: left;
width: 462px;
height: 207px;
padding: 10px 30px 10px 10px;
overflow: auto;
color: #292929;
}

/* ####### News Scroller ####### */
/* ############################# */

#latest-news img {
float: left;
width: 82px;
height: 30px;
}

#news-scroller {
float: left;
width: 420px;
height: auto;
padding: 8px 0;
margin-left: 7px;
background: url(img/_backgrounds/news-scroller-bg.gif) repeat-x;
}

#news-scroller a {
font-size: 12px;
font-weight: bold;
}

/* ####### Content styling ####### */
/* ############################### */

#content-main {
float: left;
width: 800px;
height: auto;
margin-left: 10px;
padding: 0 5px 40px;
position: relative
}

#content-main ul {
font-weight: bold;
list-style: disc inside;
}

#content-main ul li {

}

#products-wrapper {
float: left;
width: 624px;
height: auto;
padding-left: 5px;
}

p.top-para {
width: 600px;
}

#powered-logo {
position: absolute;
top: 27px;
right: 0;
}

#gallery-wrapper {
float: left;
width: 624px;
height: 375px;
background: url(img/_backgrounds/gallery-bg.png) no-repeat;
margin-bottom: 10px;
overflow: hidden;
position: relative;
}

#thegallery {
float: left;
width: 594px;
height: 355px;
padding: 10px 20px 10px 10px;
overflow: auto;
color: #fff;
}

#thegallery img {
float: left;
width: 136px;
height: 102px;
}

.distrobox-wrapper {
background: url(img/_backgrounds/distro-content.png) no-repeat;
float: left;
width: 378px;
height: 335px;
}

.expertbox-wrapper {
background: url(img/_backgrounds/expert-content.png) no-repeat;
float: left;
width: 194px;
height: 517px;
}

.distrobox {
float: left;
width: 320px;
height: 283px;
padding: 0 30px 10px 20px;
color: #fff;
}

.expertbox {
float: left;
width: 139px;
height: 465px;
padding: 0 30px 10px 20px;
color: #fff;
}

.distrobox h4, .expertbox h4 {
color: #41E407;
}

.distrobox a, .expertbox a {
color: #fff;
}

#hs-right {
position: absolute;
width: 163px;
height: auto;
right: 0px;
top: 30px;
float: left;
}

#hs-right p {
font-weight: bold;
}

#hs-right div {
clear: left;
float: left;
margin-bottom: 10px;
}

.news-tease {
padding:  10px;
background: transparent url(img/_navigation/right-nav-bg.png);
margin-bottom: 0 !important;
height: 150px;
width: 145px;
}

.expand-tease, .expand-tease-about {
padding:  10px;
background: transparent url(img/_navigation/right-nav-bg.png);
margin-bottom: 0 !important;
width: 143px
}

.expand-tease-about p {
clear: left;
float: left;
width: 93px;
height: 41px;
margin-bottom: 5px;
}

.expand-tease-about img {
flaot: left;
width: 50px;
height: 41px;
margin-bottom: 5px;
}

.expand-tease-about p a {
float: left;
width: 83px;
height: 12px;
font-size: 12px;
line-height: 12px;
padding: 15px 5px;
text-align: right;
display: block;
background: transparent url(img/_backgrounds/about.png) no-repeat 0 0;
color: #fff;
vertical-align: middle;
margin: 0;
font-weight: bold
}

.expand-tease-about p a:hover, .expand-tease-about p a:focus {
background: transparent url(img/_backgrounds/about_ro.png) no-repeat 0 0;
}

/* ####### Heading image replacement ####### */
/* ######################################### */

.h2-exhibitions {
width: 100%;
height: 42px;
background: url(img/_title/exhibitions-H2.jpg) no-repeat;
text-indent: -9999em;
}

.h2-coming-soon {
width: 100%;
height: 42px;
background: url(img/_title/Coming-soon-H2.jpg) no-repeat;
text-indent: -9999em;
}

.h2-coming-soon {
width: 100%;
height: 42px;
background: url(img/_title/Coming-soon-H2.jpg) no-repeat;
text-indent: -9999em;
}

.h2-special-projects {
width: 100%;
height: 42px;
background: url(img/_title/Special-project-H2.jpg) no-repeat;
text-indent: -9999em;
}

.h2-products {
width: 100%;
height: 42px;
background: url(img/_title/Products.png) no-repeat;
text-indent: -9999em;
}

.h2-productsMS {
width: 100%;
height: 42px;
background: url(img/_title/ProductsMS.png) no-repeat;
text-indent: -9999em;
}

.h2-productsKF {
width: 100%;
height: 42px;
background: url(img/_title/ProductsKF.png) no-repeat;
text-indent: -9999em;
}

.h2-productsMC {
width: 100%;
height: 42px;
background: url(img/_title/ProductsMC.png) no-repeat;
text-indent: -9999em;
}

.h2-productsMCTC {
width: 100%;
height: 42px;
background: url(img/_title/ProductsMCTC.png) no-repeat;
text-indent: -9999em;
}

.h2-distro {
width: 100%;
height: 42px;
background: url(img/_title/distroRental.png) no-repeat;
text-indent: -9999em;
}

.h2-hippoSchool {
width: 100%;
height: 42px;
background: url(img/_title/HippoSchool.png) no-repeat;
text-indent: -9999em;
}

.h2-latestNews {
width: 100%;
height: 42px;
background: url(img/_title/latest-news.png) no-repeat;
text-indent: -9999em;
}

.h2-testionials {
width: 100%;
height: 42px;
background: url(img/_title/testimonials.png) no-repeat;
text-indent: -9999em;
}

.h2-hippoExperts {
width: 100%;
height: 42px;
background: url(img/_title/hippoExperts.png) no-repeat;
text-indent: -9999em;
}

.h2-gallery {
width: 100%;
height: 42px;
background: url(img/_title/gallery.png) no-repeat;
text-indent: -9999em;
}

.h2-about {
width: 100%;
height: 42px;
background: url(img/_title/about-us.png) no-repeat;
text-indent: -9999em;
}

.h2-videos {
width: 100%;
height: 42px;
background: url(img/_title/videos-H2.jpg) no-repeat;
text-indent: -9999em;
}

.h2-vacancies {
width: 100%;
height: 42px;
background: url(img/_title/vacancies.png) no-repeat;
text-indent: -9999em;
}

.h2-mailingList {
width: 100%;
height: 42px;
background: url(img/_title/mailingList.png) no-repeat;
text-indent: -9999em;
}

.h2-contact {
width: 100%;
height: 42px;
background: url(img/_title/contact.png) no-repeat;
text-indent: -9999em;
}

.texth3 {
width: 609px;
height: 19px;
padding: 5px 10px;
background: url(img/_backgrounds/h3title.png) no-repeat;
color: #fff;
font-size: 1.6em;
font-weight: bold;
}

.h3-distro {
width: 369px;
height: 32px;
margin: 5px 5px 5px 4px;
background: url(img/_title/distributors.png) no-repeat;
text-indent: -9999em;
}

.h3-rentalAgents {
width: 368px;
height: 32px;
margin: 5px;
background: url(img/_title/rentalAgents.png) no-repeat;
text-indent: -9999em;
}

.h3-expertUK {
width: 161px;
height: 32px;
margin: 5px 5px 5px 4px;
background: url(img/_title/expertUK.png) no-repeat;
text-indent: -9999em;
}

.h3-expertEurope {
width: 161px;
height: 32px;
margin: 5px 5px 5px 4px;
background: url(img/_title/expertEurope.png) no-repeat;
text-indent: -9999em;
}

.h3-expertNA {
width: 161px;
height: 32px;
margin: 5px 5px 5px 4px;
background: url(img/_title/expertNAmerica.png) no-repeat;
text-indent: -9999em;
}

.h3-expertAsia {
width: 161px;
height: 32px;
margin: 5px 5px 5px 4px;
background: url(img/_title/expertAsia.png) no-repeat;
text-indent: -9999em;
}

.h3-media-servers {
width: 100%;
height: 18px;
background: url(img/_title/media-servers.png) no-repeat;
text-indent: -9999em;
}

.h3-media-content {
clear: left;
float: left;
width: 100%;
height: 18px;
background: url(img/_title/media-content.png) no-repeat;
text-indent: -9999em;
}

.h3-hippotizerHD {
clear: left;
float: left;
width: 100%;
height: 22px;
background: url(img/_title/HippotizerHD.png) no-repeat;
text-indent: -9999em;
}

.h3-hippotizerStage {
clear: left;
float: left;
width: 100%;
height: 22px;
background: url(img/_title/HippotizerStage.png) no-repeat;
text-indent: -9999em;
}

.h3-hippoPortamus {
clear: left;
float: left;
width: 100%;
height: 22px;
background: url(img/_title/HippoPortamus.png) no-repeat;
text-indent: -9999em;
}

.h3-hippoCritter {
clear: left;
float: left;
width: 100%;
height: 22px;
background: url(img/_title/HippoCritter.png) no-repeat;
text-indent: -9999em;
}

.h3-mediaManagement {
clear: left;
float: left;
width: 100%;
height: 22px;
background: url(img/_title/media-management.png) no-repeat;
text-indent: -9999em;
}

.h3-hippoNet {
clear: left;
float: left;
width: 100%;
height: 22px;
background: url(img/_title/HippoNet.png) no-repeat;
text-indent: -9999em;
}

.h3-hippoFeed {
clear: left;
float: left;
width: 100%;
height: 22px;
background: url(img/_title/HippoFeed.png) no-repeat;
text-indent: -9999em;
}

.h3-timeline {
clear: left;
float: left;
width: 100%;
height: 22px;
background: url(img/_title/timeline.png) no-repeat;
text-indent: -9999em;
}

.h3-control-software {
clear: left;
float: left;
width: 100%;
height: 22px;
background: url(img/_title/control-software.png) no-repeat;
text-indent: -9999em;
}

.h3-user-interface {
clear: left;
float: left;
width: 100%;
height: 22px;
background: url(img/_title/user-interface.png) no-repeat;
text-indent: -9999em;
}

.h3-mediaEncoding {
clear: left;
float: left;
width: 100%;
height: 22px;
background: url(img/_title/media-encoding.png) no-repeat;
text-indent: -9999em;
}

.h3-screenWarp {
clear: left;
float: left;
width: 100%;
height: 22px;
background: url(img/_title/screen-warp.png) no-repeat;
text-indent: -9999em;
}

.h3-pixelMapper {
clear: left;
float: left;
width: 100%;
height: 22px;
background: url(img/_title/pixel-mapper.png) no-repeat;
text-indent: -9999em;
}

.h3-synch {
clear: left;
float: left;
width: 100%;
height: 22px;
background: url(img/_title/synch.png) no-repeat;
text-indent: -9999em;
}

/* ####### left Sub Nav ####### */
/* ############################ */

#left-subnav {
float: left;
width: 140px;
height: 341px;
background: transparent url(img/_navigation/left-subnav.png) no-repeat top left;
margin-left: 13px;
/* margin-bottom: 50px;*/
}

#left-subnav li {
display: block;
float: left;
height: 31px;
width: 140px;
margin: 0;
padding: 0;
}

#left-subnav li a {
display: block;
text-indent: -9999em;
height: 31px;
}

#left-subnav li#nav-news a:hover, #left-subnav li#nav-news a:focus {
background: transparent url(img/_navigation/left-subnav.png) -140px 0;
}

#left-subnav li#nav-specialprojects a:hover, #left-subnav li#nav-specialprojects a:focus {
background: transparent url(img/_navigation/left-subnav.png) -140px -31px;
}

#left-subnav li#nav-testimonials a:hover, #left-subnav li#nav-testimonials a:focus {
background: transparent url(img/_navigation/left-subnav.png) -140px -62px;
}

#left-subnav li#nav-experts a:hover, #left-subnav li#nav-experts a:focus {
background: transparent url(img/_navigation/left-subnav.png) -140px -93px;
}

#left-subnav li#nav-gallery a:hover, #left-subnav li#nav-gallery a:focus {
background: transparent url(img/_navigation/left-subnav.png) -140px -124px;
}

#left-subnav li#nav-about a:hover, #left-subnav li#nav-about a:focus {
background: transparent url(img/_navigation/left-subnav.png) -140px -155px;
}

#left-subnav li#nav-vacancies a:hover, #left-subnav li#nav-vacancies a:focus {
background: transparent url(img/_navigation/left-subnav.png) -140px -186px;
}

#left-subnav li#nav-comingsoon a:hover, #left-subnav li#nav-comingsoon a:focus {
background: transparent url(img/_navigation/left-subnav.png) -140px -217px;
}

#left-subnav li#nav-videos a:hover, #left-subnav li#nav-videos a:focus {
background: transparent url(img/_navigation/left-subnav.png) -140px -248px;
}

#left-subnav li#nav-exhibitions a:hover, #left-subnav li#nav-exhibitions a:focus {
background: transparent url(img/_navigation/left-subnav.png) -140px -279px;
}

#left-subnav li#nav-contact a:hover, #left-subnav li#nav-contact a:focus {
background: transparent url(img/_navigation/left-subnav.png) -140px -310px;
}

/* ####### right Sub Nav ####### */
/* ############################ */

#right-subnav {
position: absolute;
width: 163px;
height: 221px;
padding-top: 57px;
background: transparent url(img/_navigation/right-subnav.png) no-repeat top left;
right: 6px;
top: 165px;
}

#right-subnav li {
display: block;
float: left;
height: 24px;
width: 163px;
margin: 0;
padding: 0;
}

#right-subnav li a {
display: block;
text-indent: -9999em;
height: 24px;
}

#right-subnav li#hipponet a:hover, #right-subnav li#hipponet a:focus {
background: transparent url(img/_navigation/right-subnav.png) -164px -57px;
}

#right-subnav li#timeline a:hover, #right-subnav li#timeline a:focus {
background: transparent url(img/_navigation/right-subnav.png) -164px -81px;
}

#right-subnav li#software a:hover, #right-subnav li#software a:focus {
background: transparent url(img/_navigation/right-subnav.png) -164px -105px;
}

#right-subnav li#interface a:hover, #right-subnav li#interface a:focus {
background: transparent url(img/_navigation/right-subnav.png) -164px -129px;
}

#right-subnav li#encoding a:hover, #right-subnav li#encoding a:focus {
background: transparent url(img/_navigation/right-subnav.png) -164px -153px;
}

#right-subnav li#warp a:hover, #right-subnav li#warp a:focus {
background: transparent url(img/_navigation/right-subnav.png) -164px -177px;
}

#right-subnav li#LED a:hover, #right-subnav li#LED a:focus {
background: transparent url(img/_navigation/right-subnav.png) -164px -201px;
}
#right-subnav li#synch a:hover, #right-subnav li#synch a:focus {
background: transparent url(img/_navigation/right-subnav.png) -164px -225px;
}
#right-subnav li#MGMT a:hover, #right-subnav li#MGMT a:focus {
background: transparent url(img/_navigation/right-subnav.png) -164px -249px;
}

#hf-right-subnav {
position: absolute;
width: 163px;
height: auto;
right: 6px;
top: 51px;
}

#hf-right-subnav ul {
list-style: none;
padding:  10px;
background: transparent url(img/_navigation/right-nav-bg.png);
margin-bottom: 0;
}

/* ####### Footer styling ####### */
/* ############################## */

#footer-wrapper {
clear: both;
float: left;
width: 100%;
height: auto;
padding: 10px 0 15px 0;
background: #000 url(img/_backgrounds/footer-bg.jpg) no-repeat bottom center;
text-align: center;
color: #fff;
}

/* ####### Form input ####### */
/* ########################## */

.form-input {
float: left;
width: 609px;
height: 28px;
padding: 5px 10px;
background: url(img/_backgrounds/form-input.png) no-repeat;
margin-bottom: 10px;
}

.form-input label {
font-size: 1.6em;
font-weight: bold;
color: #fff;
}

.form-label {
float: left;
margin-right: 10px;
width: 140px;
height: auto;
padding: 5px 0;
text-align: right;
}

.form-input input {
border: 2px solid #555;
background: #fff;
padding: 5px;
font-size: 1.2em;
color: #333;
width: 440px;
}

.form-submit {
width: 142px;
height: 38px;
margin-left: 487px;
}

/* ####### Contact Table ####### */
/* ############################# */

.contact-table {
float: left;
width: 100%;
height: auto;
font-size: 1.2em;
}

.contact-table td {
width: 150px;
vertical-align: top;
padding-bottom: 10px;
font-weight: bold;
}

.contact-table td+td {
font-weight: normal;
}

/* ####### Sundry styling ####### */
/* ############################## */

.floatleft {
float: left;
}

.marginright {
margin-right: 10px;
}

.marginright2 {
margin-right: 5px;
}

.marginleft {
margin-left: 10px;
}

.marginbottom {
margin-bottom: 10px;
}

.marginbottom2 {
margin-bottom: 3px;
}

.margintop2 {
margin-top: 3px;
}

.backlink {
text-transform: uppercase;
font-weight: bold;
}

.hippoportamus {
position: relative;
top: -12px;
}

.strong {
font-weight: bold;
}

.bigText {
font-size: 1.6em;
line-height: 1.4em;
}

.floatright {
float: right;
}

.clearright {
clear: right;
}

.floatleft {
float: left;
}

#home-testimonials {
float: left;
width: 152px;
height: auto;
}

#testimonials-content {
float: left;
width: 138px;
height: 243px;
background: transparent;
}

/* ####### Experts Form Styling ####### */
/* #################################### */

.expert-form {
float: left;
width: 807px;
height: 633px;
padding: 8px 0;
background: url(img/_backgrounds/expert-form-bg.png) no-repeat;
margin-top: 5px;
}

.expert-form fieldset {
border: 0;
padding: 0;
margin: 0;
}

.expert-form fieldset#personal-details label, .expert-form fieldset#contact-details label, .radio-title {
clear: left;
float: left;
font-size: 1.2em;
font-weight: bold;
width: 142px;
height: auto;
color: white;
text-align: right;
padding-right: 10px;
margin-bottom: 5px;
position: relative;
top: 2px;
}

.expert-form fieldset#personal-details input, .expert-form fieldset#contact-details input {
float: left;
border: 1px solid white;
width: 560px;
height: auto;
padding: 2px 2px;
margin-left: 5px;
margin-bottom: 5px;
}

.expert-form fieldset#region-details input, .expert-form fieldset#experience-details input, .expert-form fieldset#console-details input, .expert-form fieldset#designer-details input {
float: left;
margin: 0;
padding: 0;
margin-left: 10px;
margin-right: 5px;
}

.expert-form fieldset#region-details label, .expert-form fieldset#experience-details label, .expert-form fieldset#console-details label, .expert-form fieldset#designer-details label, .expert-form fieldset#region-details label{
float: left;
width: auto;
height:auto;
font-size: 1.2em;
font-weight: bold;
color: white;
margin-right: 10px;
margin-bottom: 5px;
}

.expert-form fieldset#personal-details {
float: left;
width: 734px;
height: auto;
margin-bottom: 8px;
!margin-bottom: 8px;
}

.expert-form fieldset#contact-details {
clear: left;
float: left;
width: 734px;
height: auto;
margin-bottom: 5px;
!margin-bottom: 15px;
}

.expert-form fieldset#region-details {
float: left;
width: 734px;
height: auto;
margin-bottom: 10px;
!margin-bottom: 10px;
}

.expert-form fieldset#experience-details {
float: left;
width: 734px;
height: auto;
margin-bottom: 0;
!margin-bottom: 10px;
margin-top: 0;
}

.expert-form fieldset#console-details {
float: left;
width: 734px;
height: auto;
margin-bottom:0;
}

.expert-form fieldset#designer-details {
float: left;
width: 734px;
height: auto;
margin-bottom: 0;
margin-top: 4px;
}

.expert-form fieldset#programmer-details {
float: left;
width: 734px;
height: auto;
margin-top: 15px;
margin-bottom: 0;
}

.radio-group {
float: left;
width: 550px;
margin: 0;
}


.radio-region {
float: left;
width: 550px;
margin: 0;
}

.radio-region input {clear: both;}
.radio-region label {float: none!important; display: block;}

td.radio-inp {
display: block;
margin: 0;
padding: 0;
}

.clearthis {
clear: left;
float: left;
}

.expert-form fieldset#contact-details textarea, .expert-form fieldset#personal-details textarea,  .expert-form fieldset#programmer-details textarea  {
float: left;
border: 1px solid white;
width: 554px;
height: 35px;
padding: 2px 5px;
margin-left: 5px;
margin-bottom: 5px;
}

.submit-butt {
position: relative;
top: 8px;
left: 35px;
}

.expert-form table, .expert-form table tr. .expert-form table tr td {
padding: 0;
margin: 0;
border: 0;
}

#HippoPortamusmain {
position: relative;
top: -13px;
}
#bottom-banner
{
	width: 279px;
	height:227px;
	float:left;
	clear:both;
}

#line {display: block;border-top: 1px solid #7d7d7d; border-bottom: 1px solid #7d7d7d; float: left; padding-bottom:2px;}

.newsletter-signup {
float: left;
width: 152px;
height: auto;
overflow: hidden;
margin-top: 20px;
}

.newsletter-signup p {
float: left;
width: 112px;
height: auto;
padding: 10px 20px;
margin: 0;
font-weight: bold;
}

.short-input {
border: 1px solid #82AB3F;
margin: 0 20px 10px;
padding: 5px;
width: 100px;
}

.nf-submit {
position: relative;
left: 17px;
}
#footer-wrapper p{
	font-size: 9pt;
}
