html, body{ padding:0px; margin:0px; }  .o75{ opacity:.75; } .o65{ opacity:.65; } .w100{ width:100%; } #ribbonCenter{ position:relative; margin:0 auto; width:1000px; height:50px; } #ribbon { position:absolute; width:800px; height:50px; left:100px; overflow:hidden; z-index: 10; } #ribbon .strand{ float:left; position:relative; width:1em; font-size:16px; height:1em; cursor: pointer; } .sizer{ height:50px; width:1em; position:absolute; font-size:1em; top:-34px; } .diamond{ height:1em; width:1em; position:absolute; }  .color0 .diamond { background:url(http://static3.kineticfin.com/images/ribbon_sprites.png) 0px 0px no-repeat; } .color0 .sizer { background:url(http://static3.kineticfin.com/images/ribbon_sprites.png) 0px -50px no-repeat; } .color1 .diamond { background:url(http://static3.kineticfin.com/images/ribbon_sprites.png) -16px 0px no-repeat; } .color1 .sizer { background:url(http://static3.kineticfin.com/images/ribbon_sprites.png) -16px -50px no-repeat; } .color2 .diamond { background:url(http://static3.kineticfin.com/images/ribbon_sprites.png) -32px 0px no-repeat; } .color2 .sizer { background:url(http://static3.kineticfin.com/images/ribbon_sprites.png) -32px -50px no-repeat; } .color3 .diamond { background:url(http://static3.kineticfin.com/images/ribbon_sprites.png) -48px 0px no-repeat; } .color3 .sizer { background:url(http://static3.kineticfin.com/images/ribbon_sprites.png) -48px -50px no-repeat; } .color4 .diamond { background:url(http://static3.kineticfin.com/images/ribbon_sprites.png) -64px 0px no-repeat; } .color4 .sizer { background:url(http://static3.kineticfin.com/images/ribbon_sprites.png) -64px -50px no-repeat; } .color5 .diamond { background:url(http://static3.kineticfin.com/images/ribbon_sprites.png) -80px 0px no-repeat; } .color5 .sizer { background:url(http://static3.kineticfin.com/images/ribbon_sprites.png) -80px -50px no-repeat; } .color6 .diamond { background:url(http://static3.kineticfin.com/images/ribbon_sprites.png) -96px 0px no-repeat; } .color6 .sizer { background:url(http://static3.kineticfin.com/images/ribbon_sprites.png) -96px -50px no-repeat; } .color7 .diamond { background:url(http://static3.kineticfin.com/images/ribbon_sprites.png) -112px 0px no-repeat; } .color7 .sizer { background:url(http://static3.kineticfin.com/images/ribbon_sprites.png) -112px -50px no-repeat; } .color8 .diamond { background:url(http://static3.kineticfin.com/images/ribbon_sprites.png) -128px 0px no-repeat; } .color8 .sizer { background:url(http://static3.kineticfin.com/images/ribbon_sprites.png) -128px -50px no-repeat; } .color9 .diamond { background:url(http://static3.kineticfin.com/images/ribbon_sprites.png) -144px 0px no-repeat; } .color9 .sizer { background:url(http://static3.kineticfin.com/images/ribbon_sprites.png) -144px -50px no-repeat; } .visited .diamond { background:url(http://static3.kineticfin.com/images/ribbon_sprites.png) -160px 0px no-repeat; } .visited .sizer { background:url(http://static3.kineticfin.com/images/ribbon_sprites.png) -160px -50px no-repeat; } .ribbonItem{ height:535px; } .ribbonVideoLayout{ background:url(http://static3.kineticfin.com/images/ribbon_video_bg.png) no-repeat; position:relative; } .ribbonItem .videoTitle{ position: relative; left: 83px; top: 125px; width: 550px; } .ribbonVideo{ position:relative; } .ribbonVideo > div{ margin: 0 auto;} .ribbonVideoLayout .ribbonVideo{ height: 335px; left: 110px; top: 25px; width: 592px; } html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { background: none repeat scroll 0 0 transparent; margin: 0; padding: 0; } h1, h2, h3, h4, h5, h6 { clear:both; font-weight:normal; }  body { font: 14px verdana,tahoma; background: url("http://static3.kineticfin.com/images/bg_filler.png") center top; color: #888585; } html, body{ width: 100%; } .purple{ color:#250b56; } h1{ font-family: 'Metrophobic', arial, serif; font-size: 35px;} h2{ font-family: Georgia, arial, serif; font-size: 24px;} h3{ font-size: 17px;} h5{ font-size: 16px; } ul{ list-style: square outside url("http://static3.kineticfin.com/images/bullet.png"); } ul.none{ list-style: none; overflow:hidden;} ul.small{ list-style: square inside url("http://static3.kineticfin.com/images/bullet_sm.png"); } ul.small li.noBullet{ list-style:square inside url("http://static3.kineticfin.com/images/bullet_clear.png"); font-size:12px; color:#A2A2A2; } ul li{ padding: 2px; } a { color: #250758; text-decoration: none; } a:hover{ color: #9a9a9a; text-decoration: underline; } a.purple{ color: #250758; text-decoration: underline; } a.purple:hover{ color: #9a9a9a; } a img{ border:0px; } object{ z-index:1; }  .metro{ font-family: 'Metrophobic'; } .fsi{font-style: italic;} .fsb{font-weight: bold;} .f26{ font-size:26px; } .f24{ font-size:24px; } .fontLarge{ font-size: 22px; } .f19{ font-size:19px; } .fontMedium{ font-size: 18px; } .f16 { font-size:16px; } .fontSmall { font-size: 14px; } .pr{position:absolute;} .pr{position:relative;} .verdana{font-family: verdana;} .georgia{font-family:georgia;} .burgundy{color: #b84c66;} .teal{color: #4aa3a8;} .pink{color: #ee689c;} .orange{color: #ee705c;} .purple{color: #250758;} .darkTeal{color: #486f86;} .lightpurple{color: #8f4c8f;}  #overallWrapper{ position: relative; width: 100%; } .siteContentWidth { width: 1000px; } #overallNavWrapper{ position: absolute; height: 52px; background: url("http://static3.kineticfin.com/images/nav_bg_filler.png") repeat-x; width: 100%; z-index: 3; left: 0px; top: -1px; position: fixed; } #overallNavWrapper #ribbonSliderWrapper{ display: none; position: absolute; width: 100%; height: 650px; top: 125px; background: white url("http://static3.kineticfin.com/images/bg_filler.png") center top repeat; } #ribbonSliderWrapper #ribbonSliderContent{ width: 820px; height: 500px; margin: 0 auto; top:40px; } #ribbonSliderWrapper #ribbonSliderClose{ position: absolute; background: url("http://static3.kineticfin.com/images/x.png") no-repeat scroll 0 0 transparent; width: 25px; height: 29px; right: 93px; top: 33px; z-index: 20; cursor: pointer; } #ribbonSliderWrapper .ribbonButton{ position: absolute; width: 35px; height: 37px; top: 220px; cursor: pointer; z-index: 20; } #ribbonSliderWrapper #ribbonSliderPrev{ left: 30px; } #ribbonSliderWrapper #ribbonSliderNext{ left: 935px; } #ribbonSlider > li, div.ribbonItem { width:816px; } #overallNavWrapper #scoreKeeper{ position: absolute; left: 715px; top: 9px; width: 150px; height: 35px; background: url("http://static3.kineticfin.com/images/score_bg.png") no-repeat scroll 0 0 transparent; cursor: pointer; } #scoreKeeper #scoreText{ position: relative; left: 25px; top: 6px; font-size: 13px; color: white; } #scoreText #scoreKeeperScore{ color: #cfc552; } #scoreKeeper #help{ position: relative; left: 161px; top: -5px; width: 75px; } #scoreKeeper #help a{ color: #cfc552; text-decoration: underline; font-size: 11px; } #overallNavWrapper #scoreKeeperHelp{ display: none; position: absolute; width: 235px; height: 167px; left: 720px; top: 43px; padding-left: 20px; padding-top: 50px; z-index: 5; background: url("http://static3.kineticfin.com/images/scorebubble.png") no-repeat scroll 0 0 transparent; color: white; } #overallNavWrapper #whiteBand{ position: absolute; height: 8px; background: #ffffff; top: 44px; width: 100%; left: 0px; } #overallNavWrapper #whiteBandDropShadow{ background: none repeat scroll 0 0 #000000; height: 5px; zoom: 1; filter: alpha(opacity=20); opacity: 0.2; position: absolute; top: 51px; width: 100%; left: 0px; } #whiteBandDropShadow .shadow { -moz-box-shadow: 3px 3px 4px #000; -webkit-box-shadow: 3px 3px 4px #000; box-shadow: 3px 3px 4px #000;  -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";  filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000'); } #overallNavWrapper #purpleDropShadow{ background: url("http://static3.kineticfin.com/images/bg_dropshadow_filler.png") repeat-x scroll 0 0 transparent; height: 110px; position: absolute; top: 52px; left:0px; width: 100%; z-index: 2; } #navWrapper{ position: relative; height: 52px; margin: 0 auto; z-index:5 } #navWrapper #kfLogo{ position: absolute; width: 100px; height: 108px; z-index: 3; } #navWrapper #navButtons{ height: 40px; left: 135px; position: relative; top: 3px; width: 600px; z-index: 3; } #navButtons .seperator{ float: left; height: 40px; width: 2px; background: url("http://static3.kineticfin.com/images/nav_button_divider.png") no-repeat; } #navButtons .button{ float: left; height: 40px; min-width: 50px; color:white; line-height:40px; font-size:12px; text-align:center; } #navButtons .button:hover{ background: url("http://static3.kineticfin.com/images/nav_button_hover.png") repeat-x; } #navButtons .selected{ background: url("http://static3.kineticfin.com/images/nav_button_hover.png") repeat-x; } #navButtons a img{ border:0px; } #navButtons .button a, #navButtons .button a:hover { text-decoration:none; color:white; height: 40px; min-width: 50px; display: block; padding:0px 15px 0px 15px; } #mainContentWrapper{ position: relative; margin: 0 auto; } #mainContentWrapper .contentWrapper .seperator{ border-top: 2px solid #999999; position: relative; top: -30px; width:905px; } #mainContentWrapper .contentWrapper{ position: relative; width: 100%; height: 768px; padding-top: 40px; } #mainContentWrapper #home{ padding-top: 140px; height:665px; } #home #homeSlider{ height: 568px; position: relative; width: 100%; } #homeSlider .homeSliderItem{ height: 568px; } #homeSlider div, div div{ position: relative; } #home #homeSliderPager{ height: 45px; left: 745px; letter-spacing: 15px; position: absolute; width: 162px; font-size: 20px; font-family: 'Metrophobic'; } #homeSliderPager a{ color: #888585; text-decoration: none; } #homeSliderPager .pager-active{ color: #250758; } #homeSliderPager a:hover{ color: #250758; text-decoration: none; } #mainContentWrapper #contact{ height: 1500px; } #mainContentWrapper #ourwork{} #ourWorkWrapper{ position: relative; top:60px; padding-left:10px; }  #ourWorkWrapper .selected {background: #250758;} #ourWorkWrapper .selected a { color: white; } #ourWorkWrapper .categories{ } #ourWorkWrapper #clientList{ width: 175px; border-right: 1px dotted #999999; height: 500px; position: relative; top: 35px; } #ourWorkWrapper #clientList ul{ position: relative; width: 100%; } #ourWorkWrapper #clientList ul li{ cursor: pointer; font-size: 12px; color: #a2a2a2; padding:2px 1px 2px 1px; } #clientList ul li:hover{ background: #513979; color: #fff; } #ourWorkWrapper #clientContent{ left: 210px; position: absolute; width: 700px; height: 500px; top: 75px; } #ourWorkWrapper #clientContent .image{ width: 690px; height: 261px; } #clientContent .textWrapper{ position: relative; top: 20px; } #clientContent .textWrapper .title{ padding-top:10px; } #clientContent .textWrapper .desc1{ } #clientContent .textWrapper .desc2{ top: 5px; line-height:20px; font-size:12px; } .clientSlider, .clientSliderItem, .ourWorkSliderItem{ height:495px; width:696px; }  #ourWorkWrapper .image > div{ margin: 0 auto; } .ourWorkSliderItem, .clientSliderItem{ position:relative; } #ourWorkWrapper .ourWorkClientSliderPager{ height: 45px; left: 300px; letter-spacing: 15px; position: absolute; width: 396px; font-size: 16px; font-family: 'Metrophobic'; top:275px; text-align:right; } #ourWorkWrapper .ourWorkClientSliderPager a{ color: #888585; text-decoration: none; } #ourWorkWrapper .ourWorkClientSliderPager .pager-active{ color: #250758; } #ourWorkWrapper .ourWorkClientSliderPager a:hover{ color: #250758; text-decoration: none; }