.container_12,.container_16{margin-left:auto;margin-right:auto;width:960px}.grid_1,.grid_2,.grid_3,.grid_4,.grid_5,.grid_6,.grid_7,.grid_8,.grid_9,.grid_10,.grid_11,.grid_12,.grid_13,.grid_14,.grid_15,.grid_16{display:inline;float:left;position:relative;margin-left:10px;margin-right:10px}.container_12 .grid_3,.container_16 .grid_4{width:220px}.container_12 .grid_6,.container_16 .grid_8{width:460px}.container_12 .grid_9,.container_16 .grid_12{width:700px}.container_12 .grid_12,.container_16 .grid_16{width:940px}.alpha{margin-left:0}.omega{margin-right:0}.container_12 .grid_1{width:60px}.container_12 .grid_2{width:140px}.container_12 .grid_4{width:300px}.container_12 .grid_5{width:380px}.container_12 .grid_7{width:540px}.container_12 .grid_8{width:620px}.container_12 .grid_10{width:780px}.container_12 .grid_11{width:860px}.container_16 .grid_1{width:40px}.container_16 .grid_2{width:100px}.container_16 .grid_3{width:160px}.container_16 .grid_5{width:280px}.container_16 .grid_6{width:340px}.container_16 .grid_7{width:400px}.container_16 .grid_9{width:520px}.container_16 .grid_10{width:580px}.container_16 .grid_11{width:640px}.container_16 .grid_13{width:760px}.container_16 .grid_14{width:820px}.container_16 .grid_15{width:880px}.container_12 .prefix_3,.container_16 .prefix_4{padding-left:240px}.container_12 .prefix_6,.container_16 .prefix_8{padding-left:480px}.container_12 .prefix_9,.container_16 .prefix_12{padding-left:720px}.container_12 .prefix_1{padding-left:80px}.container_12 .prefix_2{padding-left:160px}.container_12 .prefix_4{padding-left:320px}.container_12 .prefix_5{padding-left:400px}.container_12 .prefix_7{padding-left:560px}.container_12 .prefix_8{padding-left:640px}.container_12 .prefix_10{padding-left:800px}.container_12 .prefix_11{padding-left:880px}.container_16 .prefix_1{padding-left:60px}.container_16 .prefix_2{padding-left:120px}.container_16 .prefix_3{padding-left:180px}.container_16 .prefix_5{padding-left:300px}.container_16 .prefix_6{padding-left:360px}.container_16 .prefix_7{padding-left:420px}.container_16 .prefix_9{padding-left:540px}.container_16 .prefix_10{padding-left:600px}.container_16 .prefix_11{padding-left:660px}.container_16 .prefix_13{padding-left:780px}.container_16 .prefix_14{padding-left:840px}.container_16 .prefix_15{padding-left:900px}.container_12 .suffix_3,.container_16 .suffix_4{padding-right:240px}.container_12 .suffix_6,.container_16 .suffix_8{padding-right:480px}.container_12 .suffix_9,.container_16 .suffix_12{padding-right:720px}.container_12 .suffix_1{padding-right:80px}.container_12 .suffix_2{padding-right:160px}.container_12 .suffix_4{padding-right:320px}.container_12 .suffix_5{padding-right:400px}.container_12 .suffix_7{padding-right:560px}.container_12 .suffix_8{padding-right:640px}.container_12 .suffix_10{padding-right:800px}.container_12 .suffix_11{padding-right:880px}.container_16 .suffix_1{padding-right:60px}.container_16 .suffix_2{padding-right:120px}.container_16 .suffix_3{padding-right:180px}.container_16 .suffix_5{padding-right:300px}.container_16 .suffix_6{padding-right:360px}.container_16 .suffix_7{padding-right:420px}.container_16 .suffix_9{padding-right:540px}.container_16 .suffix_10{padding-right:600px}.container_16 .suffix_11{padding-right:660px}.container_16 .suffix_13{padding-right:780px}.container_16 .suffix_14{padding-right:840px}.container_16 .suffix_15{padding-right:900px}.container_12 .push_3,.container_16 .push_4{left:240px}.container_12 .push_6,.container_16 .push_8{left:480px}.container_12 .push_9,.container_16 .push_12{left:720px}.container_12 .push_1{left:80px}.container_12 .push_2{left:160px}.container_12 .push_4{left:320px}.container_12 .push_5{left:400px}.container_12 .push_7{left:560px}.container_12 .push_8{left:640px}.container_12 .push_10{left:800px}.container_12 .push_11{left:880px}.container_16 .push_1{left:60px}.container_16 .push_2{left:120px}.container_16 .push_3{left:180px}.container_16 .push_5{left:300px}.container_16 .push_6{left:360px}.container_16 .push_7{left:420px}.container_16 .push_9{left:540px}.container_16 .push_10{left:600px}.container_16 .push_11{left:660px}.container_16 .push_13{left:780px}.container_16 .push_14{left:840px}.container_16 .push_15{left:900px}.container_12 .pull_3,.container_16 .pull_4{left:-240px}.container_12 .pull_6,.container_16 .pull_8{left:-480px}.container_12 .pull_9,.container_16 .pull_12{left:-720px}.container_12 .pull_1{left:-80px}.container_12 .pull_2{left:-160px}.container_12 .pull_4{left:-320px}.container_12 .pull_5{left:-400px}.container_12 .pull_7{left:-560px}.container_12 .pull_8{left:-640px}.container_12 .pull_10{left:-800px}.container_12 .pull_11{left:-880px}.container_16 .pull_1{left:-60px}.container_16 .pull_2{left:-120px}.container_16 .pull_3{left:-180px}.container_16 .pull_5{left:-300px}.container_16 .pull_6{left:-360px}.container_16 .pull_7{left:-420px}.container_16 .pull_9{left:-540px}.container_16 .pull_10{left:-600px}.container_16 .pull_11{left:-660px}.container_16 .pull_13{left:-780px}.container_16 .pull_14{left:-840px}.container_16 .pull_15{left:-900px}.clear{clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0}.clearfix:after{clear:both;content:' ';display:block;font-size:0;line-height:0;visibility:hidden;width:0;height:0}* html .clearfix{height:1%}
/* ####### Reset ####### */
* {margin:0; padding:0;}
body, input, textarea {color:#666666; font-family:Arial, Helvetica, sans-serif;}
h1, h2, h3, h4, h5, h6 {font-family:Tahoma, Arial, Verdana, sans-serif; font-weight:normal; color:#464646;}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {color:#464646; text-decoration:none;}
h1 {font-size:36px;}
h2 {font-size:28px;}
h3 {font-size:20px;}
h4 {font-size:18px;}
h5 {font-size:16px;}
h6 {font-size:14px;}
p {color:#666666; font-size:15px; line-height:1.5em;}
small {color:#666666; font-size:12px;}
img {border:0;}
a {color:#42b7d4; text-decoration:none; outline:none;}
a:hover {color:#42b7d4; text-decoration:underline;}
hr {border:0 #ccc solid; border-top-width:1px; clear:both; height:0;}
/* ######## Misc ######## */
img.centered {display:block; margin-left:auto; margin-right:auto;}
img.alignright {margin:3px 0 3px 15px; display:inline;}
img.alignleft {margin:3px 15px 3px 0; display:inline;}
img.noBorder {border:0; padding:0; background:none;}
img.noBorder:hover {border:0; padding:0; background:none;}
.noLeftMargin {margin-left:0;}
.noRightMargin {margin-right:0;}
.alignright {float:right;}
.alignleft {float:left;}
.blue {color:#42b7d4;}
.grey {color:#b4b4b4;}
.red {color:#FE3131;}
.size11 {font-size:11px;}
.size12 {font-size:12px;}
.size13 {font-size:13px;}
.size14 {font-size:14px;}
.size15 {font-size:15px;}
.size16 {font-size:16px;}
.size17 {font-size:17px;}
.size18 {font-size:18px;}
.size19 {font-size:19px;}
.size20 {font-size:20px;}
.size21 {font-size:21px;}
.size22 {font-size:22px;}
.size23 {font-size:23px;}
.size24 {font-size:24px;}
.size25 {font-size:25px;}
/* ######## Buttons and Menus ######## */
.simpleButton {background:url(/images/blueArrow.gif) no-repeat left 60%; color:#42b7d4; padding-left:10px; cursor:pointer;}
.simpleButton:hover {color:#42B7D4;}
.simpleMenu {list-style-type:none;}
.simpleMenu li {float:left; margin:0 0 0 10px;}
.simpleMenu li a {color:#666666; font-size:11px; text-decoration:none; border-right:1px solid #666666; padding:0 10px 0 0;}
.simpleMenu li a:hover {color:#42b7d4; text-decoration:underline;}
.learnMore, .hireNow, .signUpButton, .logIn {
background:url(/images/buttons/learnMore.png) no-repeat left top;
text-indent:-9999px;
height:45px;
width:195px;
display:block;
border:0;
cursor:pointer;
font-size:0;
line-height:0;
}
.learnMore:hover {background-position:left -45px;}
.learnMore:active {background-position:left -90px;}
.hireNow {background:url(/images/buttons/hireNow.png) no-repeat left top; width:205px;}
.hireNow:hover {background-position:left -45px;}
.hireNow:active {background-position:left -90px;}
.signUpButton {background:url(/images/buttons/signUp.png) no-repeat left top; width:224px;}
.signUpButton:hover {background-position:left -45px;}
.signUpButton:active {background-position:left -90px;}
.logIn {background:url(/images/buttons/logIn.png) no-repeat left top; width:150px;}
.logIn:hover {background-position:left -45px;}
.logIn:active {background-position:left -90px;}
.previous {background:url(/images/buttons/previousButton.png) no-repeat top right; width:24px; height:23px; float:left; display:block; cursor:pointer;}
.next {background:url(/images/buttons/nextButton.png) no-repeat top right; width:24px; height:23px; margin-left:28px; display:block; cursor:pointer;}
.previous:hover {background-position:left bottom;}
.next:hover {background-position:left bottom;}
.previous:active {background-position:right bottom;}
.next:active {background-position:right bottom;}
.previous.disabled {cursor:default; background-position:top left;}
.next.disabled {cursor:default; background-position:top left;}
.videoThumb {position:relative;}
.videoThumb span {background:url(/images/buttons/thumbPlay.png) no-repeat center center; position:absolute; display:block; width:100%; height:100%; cursor:pointer;}
.videoThumb:hover span {background:url(/images/buttons/thumbPlayHover.png) no-repeat center center;}
/* ######## Main Blocks ######## */
#header {background:url(/images/headerBg.jpg) repeat-x top left;}
#breadcrumbs {background:url(/images/breadcrumbsBg.jpg) repeat-x top left; height:40px;}
#center {background:url(/images/centerBg.jpg) repeat-x top left; padding-top:30px;}
#footer {background: #373737 url(/images/footerBg.jpg) repeat-x top left; margin-top:50px;}
/* ######## Top Header which contains the top menu and the search box ######## */
#topHeader {height:50px;}
#topHeader .simpleMenu {height:50px; line-height:50px; float:left;}
#topHeader .search {float:right; position:relative; height:21px; margin-right:10px; margin-top:13px;}
#topHeader .search .textInput {
background:url(/images/forms/searchBg.png) no-repeat top right;
font-size:11px;
border:0;
height:17px;
width:127px;
color:#666;
padding:4px 25px 0 10px;
}
#topHeader .search .textInput:focus {outline:none;}
#topHeader .search .button {
background:url(/images/buttons/searchButton.png) no-repeat center center;
text-indent:-9999px;
cursor:pointer;
border:none;
position:absolute;
right:5px;
top:5px;
height:14px;
width:14px;
}
#topHeader .search .button:hover {background:url(/images/buttons/searchButtonHover.png) no-repeat center center;}
/* ######## Main header contains the main menu, the logo and description ######## */
#mainHeader {background:url(/images/mainHeader.jpg) repeat-x left top; height:98px; position:relative;}
#mainHeader .left {background:url(/images/mainHeaderLeft.jpg) no-repeat top left; margin-left:-40px; }
#mainHeader .right {background:url(/images/mainHeaderRight.jpg) no-repeat top right; height:98px; margin-right:-40px; padding:0 60px 0 70px;}
#mainHeader .title {float:left; margin-top:5px; margin-right:10px;}
#mainHeader .description {float:left; color:#def7fb; margin-top:36px; font-size:11px; line-height:22px;}
#mainHeader .mainMenu {list-style-type:none; float:right; line-height:32px; margin-top:30px;}
#mainHeader .mainMenu li {float:left; margin-left:10px; height:35px; padding:0 0 0 15px;}
#mainHeader .mainMenu li a {
text-shadow:0 -0.8px 0.5px #20B3DC, 0 0.5px 0.8px #D3F2F8;
font-family:Tahoma, Arial, Verdana, sans-serif;
text-decoration:none;
color:#FFF;
display:block;
height:35px;
padding-right:15px;
font-size:14px;
letter-spacing:1px;
}
#mainHeader .mainMenu li:hover {background:url(/images/mainMenuHoverL.png) no-repeat top left;}
#mainHeader .mainMenu li:hover a {
background:url(/images/mainMenuHover.png) no-repeat top right;
text-shadow:0 -0.8px 0.5px #2e95b2, 0 0.5px 0.4px #7bd1e5;
color:#232323;
}
#mainHeader .mainMenu li:active {background:url(/images/mainMenuDownL.png) no-repeat top left; outline:none;}
#mainHeader .mainMenu li:active a {
background:url(/images/mainMenuDown.png) no-repeat top right;
text-shadow:0 0.5px 0.4px #77cbe0, 0 -0.8px 0.5px #2d7083;
color:#232323;
outline:none;
}
#mainHeader .mainMenu .current {background:url(/images/mainMenuDownL.png) no-repeat top left; outline:none;}
#mainHeader .mainMenu .current a {
background:url(/images/mainMenuDown.png) no-repeat top right;
text-shadow:0 0.5px 0.4px #77cbe0, 0 -0.8px 0.5px #2d7083;
color:#232323;
}
/* ######## The Heading below the main menu ######## */
#heading {margin:30px 0 0 0; padding-bottom:30px; overflow:hidden; clear:both;}
#heading h5 {color:#32b0cc; line-height:26px;}
/* ######## Home Page Slider ######## */
#slider {margin:30px 0 0 0; height:330px; overflow:hidden; clear:both;}
#slider h1 {margin-bottom:5px;}
#slider h5 {color:#32b0cc; line-height:26px;}
#slider ul {list-style-type:none;}
#slider .column {margin:5px 0 15px 0;}
#slider .simpleButton {color:#666666; font-size:14px; line-height:35px;}
#slider .thumbnail {height:340px; position:relative;}
#slider .thumbnail img {position:absolute; top:5px; right:0;}
#slider .coda-slider .panel-wrapper {position:relative;}
#slider .coda-slider, .coda-slider .panel {width: 960px}
#slider .coda-slider p.loading { padding: 20px; text-align: center }
#sliderNav {float:right; margin-top:10px; margin-right:-10px;}
#sliderNav .coda-nav ul {clear:both; display:block; overflow:hidden}
#sliderNav .coda-nav ul li {display:inline;}
#sliderNav .coda-nav ul li a {background:url(/images/buttons/slideshowButton.png) no-repeat top center; height:24px; width:24px; display: block; float: left;}
#sliderNav .coda-nav ul li a:hover {background-position:center -24px;}
#sliderNav .coda-nav ul li a.current {background-position:bottom center; outline:none;}
#slider .coda-slider {float:left; overflow:hidden; position:relative;}
#slider .coda-slider .panel {display:block; float:left;}
#slider .coda-slider .panel-container {position:relative;}
#slider .coda-nav-left, .coda-nav-right {float:left;}
#slider .coda-nav-left a, .coda-nav-right a {display:block; text-align:center; text-decoration:none;}
/* ######## Breadcrumbs ######## */
#breadcrumbs .container_16 {width:940px;}
#breadcrumbs p {font-size:13px; line-height:42px; float:left;}
#breadcrumbs ul.crumbs {list-style-type:none; line-height:40px;}
#breadcrumbs ul.crumbs li {color:#666666; display:inline; font-size:13px; margin-right:3px;}
#breadcrumbs ul.crumbs li a {color:#666666; background:url(/images/greyArrow.gif) no-repeat right 4px; padding-right:12px; cursor:pointer;}
#breadcrumbs ul.crumbs li a:hover {color:#42b7d4;}
/* ######## Content ######## */
#content hr {margin:35px 0;}
#content ul, #content ol {margin-left:35px;}
#content li {line-height:1.5em;}
#content p {margin-bottom:10px; margin-top:5px;}
#content img {border:1px solid #cccccc; padding:2px; background-color:#FFF;}
#content img:hover {border:1px solid #42b7d4;}
#content blockquote {margin:15px 0 15px 30px; border-left:10px solid #cccccc; padding-left:30px;}
#content blockquote p {color:#cccccc; font-style:italic;}
#content table {border:1px solid #d8d8d8; border-collapse:collapse; margin:5px 0 20px 0;}
#content td {border:1px solid #d8d8d8; padding:5px 10px 5px 10px;}
#content th {border:1px solid #d8d8d8; padding:5px 10px 5px 10px; background-color: #EFEDEE;}
#content caption {margin-bottom:10px; font-size:18px;}
#content img.noBorder {border:0; padding:0; background:none;}
#content img.noBorder:hover {border:0; padding:0; background:none;}
#content .client h3 {margin-top:25px;}
#content .column h3 {margin-bottom:-4px;}
#content .column .thumbnail {text-align:center; line-height:140px;}
#content .column .thumbnail img {vertical-align:middle; border:none; padding:0; background:none;}
/* ######## Home Page Tagline ######## */
#tagline {background:url(/images/tagline.jpg) repeat-x left top; height:96px; margin-bottom:30px;}
#tagline .left {background:url(/images/taglineLeft.jpg) no-repeat top left; }
#tagline .right {background:url(/images/taglineRight.jpg) no-repeat top right; height:96px;}
#tagline h3 {margin-top:20px; margin-left:30px; line-height:26px;}
#tagline #tour {border-left:1px solid #cccccc; height:85px; padding:11px 0 0 9px; margin-left:0;}
#tagline #tour p { line-height:12px;}
#tagline #tour .simpleButton {font-size:12px;}
#tagline #tour .videoThumb {float:left; margin-right:10px;}
#tagline #tour .videoThumb img {border:1px solid #cccccc; padding:2px; background-color:#FFF;}
#tagline #tour .videoThumb:hover img {border:1px solid #42b7d4;}
/* ######## About Page ######## */
#content .block {margin:25px 10px 25px 0;}
#content .block p {margin-top:4px; margin-bottom:4px; padding-right:10px;}
#content .block small {color:#42b7d4; font-size:11px;}
#content .block .simpleButton {font-size:12px;}
#content .block .grid_2 {margin-left:0;}
#content .block .grid_4 {margin-right:0;}
/* ######## Projects Page ######## */
#projectBrowser {margin-top:10px;}
#projectBrowser .project {background:url(/images/projectBg.gif) repeat-x left top; height:271px; margin:30px 10px 0 0;}
#projectBrowser .project .left {background:url(/images/projectBgL.png) no-repeat top left; margin-left:-10px;}
#projectBrowser .project .right {
background:url(/images/projectBgR.png) no-repeat top right;
height:271px;
margin-right:-10px;
padding-top:20px;
}
#projectBrowser .project small {font-size:11px;}
#projectBrowser .project .simpleButton {font-size:12px;}
#projectBrowser .thumbnail {margin-right:0; margin-left:20px;}
#projectBrowser .info {margin-left:0;}
#projectBrowser .info .text {padding:0 10px 0 10px;}
#projectBrowser .controlsTop {height:39px; border-bottom:1px solid #cccccc; margin-bottom:30px; margin-left:-10px; line-height:39px; color:#666666;}
#projectBrowser .controlsBottom {height:39px; border-top:1px solid #cccccc; margin-top:30px; margin-left:-10px; line-height:39px; color:#666666;}
#projectBrowser .controls small {font-size:13px; margin-left:10px; float:left;}
#projectBrowser .controls small a {color:#666666; margin:0 5px;}
#projectBrowser .controls small a:hover {color:#42b7d4;}
#projectBrowser .navigation {float:right; background:url(/images/tabL.png) no-repeat top left; height:39px;}
#content #projectBrowser .navigation {padding:0 0 0 10px;}
#projectBrowser .navigation div {
background:url(/images/tab.png) no-repeat top right;
height:39px;
display:block;
padding:10px 13px 0 3px;
}
#projectBrowser .controlsBottom .navigation {background:url(/images/tabBottomL.png) no-repeat top left;}
#projectBrowser .controlsBottom .navigation div {background:url(/images/tabBottom.png) no-repeat top right; }
#center .projectPage .grid_8 { margin-left:0;}
#center .projectPage .grid_4 { margin-right:0;}
#center .projectPage .grid_4 hr { margin:15px 0;}
#center .projectPage .projectGallery {background:url(/images/projectGallery.gif) repeat-x left top; height:530px; margin:0 10px 20px 0;}
#center .projectPage .projectGallery .left {background:url(/images/projectGalleryL.png) no-repeat top left; margin-left:-10px;}
#center .projectPage .projectGallery .right {
background:url(/images/projectGalleryR.png) no-repeat top right;
height:530px;
margin-right:-10px;
padding:15px 20px 15px 20px;;
}
#center .projectPage .projectGallery .title {margin-bottom:15px;}
#center .projectPage .projectGallery .panel img { height:403px;}
#center .projectGallery #projectGallerySlider {overflow:hidden; clear:both; float:left; position:relative; width:669px;}
#center .projectGallery #projectGallerySlider .panel {display:block; float:left; width:699px;}
#center .projectGallery #projectGallerySlider .panel-container {position:relative;}
#center .projectGallery .controls {padding-top:22px; line-height:22px; clear:both; position:relative; clear:both;}
#center .projectGallery .controls .counter {float:left; position:absolute; left:10px; bottom:0px;}
#center .projectGallery .controls #sliderNav {float:none; margin:0 auto;}
#center .projectGallery .controls #sliderNav ul {width:56px; margin:0 auto; float:none;}
#center .projectGallery .controls .link { float:right; margin-top:-23px;}
#center .projectPage .relatedProjects {background:url(/images/relatedProjects.gif) repeat-x left top; height:206px; margin:30px 10px 0 0;}
#center .projectPage .relatedProjects .left {background:url(/images/relatedProjectsL.png) no-repeat top left; margin-left:-10px;}
#center .projectPage .relatedProjects .right {
background:url(/images/relatedProjectsR.png) no-repeat top right;
height:206px;
margin-right:-10px;
padding:15px 0 15px 20px;;
}
#center .projectPage .relatedProjects .grid_4 {margin-left:0; margin-right:10px; margin-top:20px;}
#center .projectPage .relatedProjects h3 {float:left;}
#center .projectPage .relatedProjects img {float:left; margin-right:10px; width:83px; height:48px;}
#center .projectPage .relatedProjects .title {font-weight:bold; display:block;}
#center .projectPage .relatedProjects .viewAll {float:right; font-size:12px; margin-top:6px; margin-right:20px;}
#center .projectPage .relatedProjects .simpleButton {font-size:12px;}
/* ######## Services Page ######## */
#priceTable {margin:50px 0; overflow:hidden;}
#priceTable ul {list-style-type:none; margin-left:0;}
#priceTable .priceTabs li {float:left; height:39px; padding:0 0 0 10px; margin-right:10px;}
#priceTable .priceTabs li a {color:#464646; font-size:18px; height:40px; display:block; line-height:39px; padding:0 13px 0 3px;}
#priceTable .priceTabs li:hover {background:url(/images/tabL.png) no-repeat top left; height:39px; padding:0 0 0 10px;}
#priceTable .priceTabs li:hover a {background:url(/images/tab.png) no-repeat top right; color:#666666; text-decoration:none;}
#priceTable .priceTabs li:active {background:url(/images/tabDownL.png) no-repeat top left;}
#priceTable .priceTabs li:active a {background:url(/images/tabDown.png) no-repeat top right; outline:none;}
#priceTable .priceTabs .active {float:left; background:url(/images/tabL.png) no-repeat top left; height:39px; padding:0 0 0 10px;}
#priceTable .priceTabs .active a {
background:url(/images/tab.png) no-repeat top right;
color:#464646;
height:40px;
display:block;
line-height:39px;
padding:0 13px 0 3px;
}
#priceTable .priceMask {overflow:hidden; border-top:1px solid #cccccc; display:block;}
#priceTable .middle {overflow:hidden; background: url(/images/servicesThumbBg.jpg) repeat-y top right;}
#priceTable .tabContent {float:left; margin-right:30px;}
#priceTable .tabContent hr {margin:25px 10px 25px -10px;}
#priceTable .tabContent li {margin-bottom:20px;}
#priceTable .tabContent .simpleButton {font-size:14px; color:#666666;}
#priceTable .tabContent .grid_4 {margin-left:0;}
#priceTable .tabContent .grid_8 {margin:15px 10px 5px 10px;}
#priceTable .tabContent .notes {font-size:11px; color:#cccccc; margin-left:10px;}
#priceTable .noBorder{ float:right; margin-top:30px;}
#priceTable .price {background:url(/images/tagline.jpg) repeat-x left bottom; height:80px; border-top:1px solid #cccccc;}
#priceTable .price .left {background:url(/images/taglineLeft.jpg) no-repeat bottom left; }
#priceTable .price .right {background:url(/images/taglineRight.jpg) no-repeat bottom right; height:80px; padding-left:10px;}
#priceTable .price .grid_4 {margin-top:10px;}
#priceTable .price .amount { margin-left:10px;}
#priceTable .price .curency {float:left; line-height:30px; color:#42b7d4; margin-right:3px; font-size:18px;}
#priceTable .price .hireNow {margin-top:7px; margin-left:7px;}
#priceTable .price h2 {color:#42b7d4; font-weight:bold;}
/* ######## Contact Page ######## */
#content .contact {color:#666666; font-size:15px;}
#content .contact .firstCol {margin-left:0; margin-top:15px;}
#content .contact .secondCol {margin-right:0; margin-top:15px;}
#content .contact hr {margin:15px 0 40px 0;}
#content .contact .grid_4 hr { margin-left:-10px;}
#content .contact .sexy .list-wrapper ul {list-style-type:none; padding:0; margin:0; height:200px;}
#content .contact .address {margin-bottom:50px;}
#content .contact .simpleButton {font-size:12px;}
#content .contact .text {font-size:12px; line-height:20px;}
#content .contact .errorText {text-align:right; clear:both; display:block; color:#FE3131; font-size:11px; line-height:12px;}
#contactForm input, #contactForm select {float:right;}
#contactForm p {clear:both; display:block; height:26px; padding-bottom:20px; margin:0;}
#contactForm .messageBox {clear:both; overflow:hidden; margin-bottom:0; padding-bottom:20px; height:168px;}
#contactForm .responseText {text-align:right; display:none; clear:both;}
#contactForm .requiered {margin-top:0px; margin-bottom:0px;}
#contactForm .requiered small {margin-left:120px; font-size:11px; color:#42b7d4; float:left;}
#contactForm .loadingImage {margin:4px 2px 0 0px; display:block; float:right; display:none;}
#contactForm .formText {float:left; line-height:26px;}
#contactForm .textInput {
background:url(/images/forms/textInput340.png) no-repeat top right;
font-size:12px;
border:0;
height:15px;
width:310px;
color:#666666;
padding:6px 15px 6px 15px;
}
#contactForm .textInput:focus {background-position:right -27px; outline:none;}
#contactForm .textInput.error {background-position:right bottom;}
#contactForm .textarea {float:right; width:340px; margin-bottom:3px;}
#contactForm .textarea .top {background:url(/images/forms/textInput340.png) no-repeat left top; height:14px;}
#contactForm .textarea .bottom {background:url(/images/forms/textInput340.png) no-repeat left -13px; height:14px;}
#contactForm .textarea textarea {
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#666666;
background:none;
border:0;
background-color:#f9f9f9;
border-left:1px solid #d3d1d1;
border-right:1px solid #d3d1d1;
padding:0 15px 0 15px;
margin-bottom:0;
overflow:auto;
width:308px;
height:140px;
}
#contactForm .textarea.focus .top {background-position:left -27px;}
#contactForm .textarea.focus .bottom {background-position:left -40px;}
#contactForm .textarea.focus textarea {background:none; background-color:#f9f9f9; border-left:1px solid #b6e4ef; border-right:1px solid #b6e4ef;}
#contactForm .textarea.error .top {background-position:left -54px;}
#contactForm .textarea.error .bottom {background-position:left -67px;}
#contactForm .textarea.error textarea {background:none; background-color:#ffeded; border-left:1px solid #f9acac; border-right:1px solid #f9acac;}
#contactForm .button {
background:url(/images/buttons/send.png) no-repeat left top;
text-indent:-9999px;
height:24px;
width:68px;
display:block;
float:right;
border:0;
}
#contactForm .button:hover {background-position: left -24px;}
#contactForm .button:active {background-position: left -48px;}
#contactForm .clearButton {background:url(/images/buttons/clear.png) no-repeat left top; margin-right:20px;}
/* ######## Blog Page ######## */
#content .post {margin-bottom:70px;}
#content .postHeadline {border-bottom:1px solid #cccccc; height:87px; margin-bottom:40px; margin-left:-10px;}
#content .postHeadline h2 a {color:#464646;}
#content .postHeadline h2 a:hover {color:#42B7D4; text-decoration:none;}
#content .postHeadline small {font-size:11px; color:#b4b4b4;}
#content .postDate {background:url(/images/postDateR.png) no-repeat right top; float:left; height:87px; margin-left:10px; margin-right:20px;}
#content .postDate .left {
background:url(/images/postDateL.png) no-repeat left top;
padding:10px 15px 0 15px;
margin-left:-10px;
height:77px;
text-align:center;
font-size:18px;
color:#464646;
}
#content .postDate .year {font-weight:bold;}
#content .postDate h5 {line-height:20px;}
#content .postMeta {background:url(/images/postMeta.gif) repeat-x left top; height:40px; margin:20px 10px 0 0; font-size:12px; color:#cccccc;}
#content .postMeta .left {background:url(/images/postMetaL.png) no-repeat top left; margin-left:-10px;}
#content .postMeta .right {
background:url(/images/postMetaR.png) no-repeat top right;
height:40px;
margin-right:-10px;
padding:13px 20px 0 20px;
position:relative;
}
#content .postMeta .readMore {position:absolute; left:20px; top:13px;}
#content .postMeta .bookmark {text-align:center; margin:0 auto; width:200px;}
#content .postMeta .bookmark a {margin:0 5px;}
#content .postMeta .comments {position:absolute; right:20px; top:13px; text-align:right;}
#content .postMeta .nextPosts {position:absolute; right:20px; top:13px; text-align:right;}
#content .navigation {font-size:12px; padding-bottom:30px;}
#content .nextPosts {float:right; background:url(/images/blueArrow.gif) no-repeat right 4px; padding-right:10px;}
#content .previousPosts {float:left; background:url(/images/prevBlueArrow.gif) no-repeat left 4px; padding-left:10px;}
/* ######## Post Comments ######## */
#content #comments .grid_10 { margin-right:0;}
#content #comments .grid_8 { margin-right:0;}
#content #comments {margin:0 0 0 -10px;}
#content #comments .commentsTitle {float:left; margin-left:10px;}
#content #comments .note {color:#b4b4b4; float:right;}
#content #comments .leaveComment {font-size:12px; float:right;}
#content #comments .avatar {margin-bottom:20px; display:block;}
#content #comments .reply {font-size:12px;}
#content #comments .author {margin:0; color:#b4b4b4;}
#content #comments .author a {font-weight:bold;}
#content #comments .date {margin-bottom:20px; display:block;}
#content #comments hr { margin:15px 0 35px 0;}
#content #comments .comment hr { margin:40px 0 40px 0;}
/* ######## Comments Form ######## */
#content #commentsForm .textInput {
background:url(/images/forms/textInput220.png) no-repeat top right;
font-size:12px;
border:0;
height:15px;
width:190px;
color:#666666;
padding:6px 15px 6px 15px;
margin-bottom:15px;
}
#content #commentsForm .textInput:focus {background-position:right -27px; outline:none;}
#content #commentsForm .textInput.error {background-position:right bottom;}
#content #commentsForm .requiered {font-size:11px; color:#42b7d4; line-height:11px; display:block;}
#content #commentsForm .textarea {
background:url(/images/forms/textareaInput.gif) repeat-x left top;
height:100px;
position:relative;
margin:0 15px;
margin-bottom:20px;
}
#content #commentsForm .textarea .left {background:url(/images/forms/textareaInputL.png) no-repeat top left; margin-left:-15px;}
#content #commentsForm .textarea .right {background:url(/images/forms/textareaInputR.png) no-repeat top right; height:100px; margin-right:-15px;}
#content #commentsForm .textarea textarea {width:430px; height:90px; background:none; font-family:Arial,Helvetica,sans-serif; font-size:12px; overflow:auto;}
#content #commentsForm .textarea textarea:focus {background:none;}
#content #commentsForm .textarea.focus .left {background-position:left -100px;}
#content #commentsForm .textarea.focus .right{background-position:right -100px;}
#content #commentsForm .textarea.focus {background-position:left -100px;}
#content #commentsForm .textarea.error .left {background-position:left -200px;}
#content #commentsForm .textarea.error .right{background-position:right -200px;}
#content #commentsForm .textarea.error {background-position:left -200px;}
#content #commentsForm .button {
font-size:0;
text-indent:-999px;
background:url(/images/buttons/post.png) no-repeat left top;
height:24px;
line-height:10px;
width:68px;
display:block;
float:right;
border:0;
}
#content #commentsForm .button:hover {background-position: left -24px;}
#content #commentsForm .button:active {background-position: left -48px;}
#content #commentsForm .clearButton {background:url(/images/buttons/cancel.png) no-repeat left top; margin-right:20px;}
/* ######## Sidebar ######## */
#sidebar .widget {margin-bottom:50px; list-style-type:none;}
#sidebar .widget ul {list-style-type:none;}
#sidebar .widget hr {margin:15px -10px 15px 0;}
#sidebar .widget img {border:1px solid #cccccc; padding:2px; background-color:#FFF;}
#sidebar .widget img:hover {border:1px solid #42b7d4;}
#sidebar .widgetTitle {font-size:18px; background:url(/images/blueArrow.gif) no-repeat left 9px; padding-left:10px; margin-left:10px;}
#sidebar .widgetContent {margin-left:10px;}
/* ######## Pages Widget ######## */
#sidebar .widgetPages {margin-bottom:50px; list-style-type:none;}
#sidebar .widgetPages li {border-bottom:1px solid #cccccc; padding:15px 0 15px 10px;}
#sidebar .widgetPages li a {background:url(/images/blueArrow.gif) no-repeat left 6px; color:#464646; padding-left:10px; cursor:pointer;}
#sidebar .widgetPages li a:hover {text-decoration:none; color:#42b7d4;}
#sidebar .widgetPages li.current a {color:#42b7d4;}
/* ######## Archives Widget ######## */
#sidebar .widgetArchives {font-size:12px;}
#sidebar .widgetArchives li {padding:5px 0;}
#sidebar .widgetArchives a {color:#464646;}
#sidebar .widgetArchives a:hover {color:#42b7d4;}
#sidebar span {color:#42b7d4; margin-left:5px;}
/* ######## Categories Widget ######## */
#sidebar .widgetCategories {margin-bottom:50px; list-style-type:none; font-size:12px;}
#sidebar .widgetCategories li {padding:5px 0;}
#sidebar .widgetCategories li a {color:#464646;}
#sidebar .widgetCategories li a:hover {color:#42b7d4;}
/* ######## Twitter Widget ######## */
#sidebar .widgetTwitter {background:url(/images/twitterBird.png) no-repeat right top;}
#sidebar .widgetTwitter .widgetTitle {padding-right:50px;}
#sidebar .widgetTwitter .simpleButton {font-size:12px; margin-left:10px;}
#sidebar .widgetTwitter a {color:#42b7d4;}
#sidebar .widgetTwitter small {color:#b4b4b4; font-size:11px;}
#sidebar .widgetTwitter li {margin-bottom:10px;}
/* ######## Flickr Widget ######## */
#sidebar .widgetFlickr .widgetContent {margin-left:0;}
#sidebar .widgetFlickr .simpleButton {font-size:12px; margin-left:10px;}
#sidebar .widgetFlickr li {float:left; margin:0 0 10px 10px;}
#sidebar .widgetFlickr img {border:1px solid #cccccc; padding:2px; background-color:#FFF; display:block;}
#sidebar .widgetFlickr img:hover {border:1px solid #42b7d4;}
/* ######## Tags Widget ######## */
#sidebar .widgetTags a {color:#464646; line-height:30px; word-spacing:-2px;}
#sidebar .widgetTags a:hover {color:#42b7d4;}
/* ######## Testimonials Widget ######## */
#sidebar .testimonial {background:url(/images/quotes.png) no-repeat top left; margin-bottom:50px; padding:10px 0 10px 10px;}
#sidebar .testimonial h4 {text-indent:50px; line-height:30px;}
#sidebar .testimonial small {color:#b4b4b4; font-size:11px; float:right; margin-top:10px;}
/* ######## Tab Menu ######## */
#tabMenu {width:230px; margin-bottom:50px;}
#tabMenu ul {list-style-type:none;}
#tabs li {float:left; height:39px; padding:0 0 0 10px; margin-right:10px;}
#tabs li:last-child {margin-right:0; float:right;}
#tabs li a {color:#464646; font-size:16px; height:40px; display:block; line-height:39px; padding:0 13px 0 3px;}
#tabs li:hover {background:url(/images/tabL.png) no-repeat top left; height:39px; padding:0 0 0 10px;}
#tabs li:hover a {background:url(/images/tab.png) no-repeat top right; color:#666666; text-decoration:none;}
#tabs li:active {background:url(/images/tabDownL.png) no-repeat top left;}
#tabs li:active a {background:url(/images/tabDown.png) no-repeat top right; outline:none;}
#tabs .active {float:left; background:url(/images/tabL.png) no-repeat top left; height:39px; padding:0 0 0 10px;}
#tabs .active a {
background:url(/images/tab.png) no-repeat top right;
color:#464646;
font-size:16px;
height:40px;
display:block;
line-height:39px;
padding:0 13px 0 3px;
}
#tabMask {overflow:hidden; width:230px;}
#tabContainer {border-top:1px solid #cccccc; background:url(/images/tabMenuBottom.png) no-repeat bottom left;}
#tabContainer .tabContent {float:left; margin-right:30px;}
#tabContainer .tabContent li {padding:15px 10px; border-top:1px solid #cccccc;}
#tabContainer .tabContent li:hover {background-color:#eaeaea;}
#tabContainer .tabContent li:hover img {border:1px solid #42b7d4;}
#tabContainer .tabContent li:first-child {border-top:none; padding-top:16px;}
#tabContainer .tabContent img {border:1px solid #cccccc; padding:2px; background-color:#FFF; float:left; margin-right:15px;}
#tabContainer .tabContent p {font-size:12px;}
#tabContainer .tabContent .simpleButton {font-size:12px;}
#tabContainer .tabContent .headline {font-weight:bold;}
#tabContainer .tabContent .info {color:#b4b4b4; font-size:11px; display:block;}
#tabMenu .tabContent .viewAll {text-align:right; line-height:40px; margin-right:10px; float:right;}
#tabMenu .tabContent .viewAll a {font-size:12px;}
#tabNav {height:29px; position:relative; padding:10px 0 0 10px; display:none;}
#tabNav .previous {background:url(/images/buttons/upButton.png) no-repeat top right;}
#tabNav .next {background:url(/images/buttons/downButton.png) no-repeat top right;}
#tabNav .previous:hover {background-position:left bottom;}
#tabNav .next:hover {background-position:left bottom;}
#tabNav .previous:active {background-position:right bottom;}
#tabNav .next:active {background-position:right bottom;}
#tabNav .previous.disabled {cursor:default; background-position:top left;}
#tabNav .next.disabled {cursor:default; background-position:top left;}
#tabNav .viewAll {text-align:right; line-height:16px; margin-right:10px; position:absolute; right:0; top:10px;}
#tabNav .viewAll a {font-size:12px;}
#tabMenu .jcarousel-container {position:relative;}
#tabMenu .jcarousel-clip {z-index:2; padding:0; margin:0; overflow:hidden; position:relative; margin-top:-1px; width:230px;}
#tabMenu .jcarousel-list {z-index:1; overflow:hidden; position:relative; top:0; left:0; margin:0; padding:0;}
#tabMenu .jcarousel-list li, #tabMenu .jcarousel-item {float:left; min-height:50px; width:210px;}
/* ######## Portofolio Slider ######## */
#portofolioSlider {background:url(/images/portofolioSlider.jpg) repeat-x left top; height:271px; margin-top:60px; margin-left:0; margin-right:0; width:960px;}
#portofolioSlider .left {background:url(/images/portofolioSliderL.jpg) no-repeat top left;}
#portofolioSlider .right {background:url(/images/portofolioSliderR.jpg) no-repeat top right; height:271px;}
#portofolioSlider h3 {margin-bottom:20px;}
#portofolioSlider img {border:1px solid #cccccc; padding:2px; background-color:#FFF; float:left; margin-right:10px;}
#portofolioSlider img:hover {border:1px solid #42b7d4;}
#portofolioSlider .title {float:left; margin-top:10px;}
#portofolioSlider .title a {color:#666666; font-weight:bold;}
#portofolioSlider .date {color:#42b7d4; float:right; margin-top:10px;}
#portofolioSlider .winner {position:relative; display:block;}
#portofolioSlider .winner span {
background:url(/images/winnerRibbon.png) no-repeat left top;
position:absolute;
top:-2px;
right:-2px;
width:65px;
height:65px;
z-index:10;
}
#portofolioSlider .controls {margin-top:15px; line-height:22px;}
#portofolioSlider .controls .counter {float:left; margin-left:20px;}
#portofolioSlider .controls .navigation {width:56px; margin:0 auto;}
#portofolioSlider .controls .link { float:right; margin-right:20px; margin-top:-23px;}
#portofolioSlider .carousel {padding: 10px 0 10px 20px;}
#portofolioSlider .jcarousel-container {position:relative; padding-right:20px;}
#portofolioSlider .carousel .jcarousel-clip {z-index:2; padding:2px 0 0 0; margin:0 0 0 -2px; overflow:hidden; position:relative; height:160px;}
#portofolioSlider .carousel .jcarousel-list {z-index:1; padding:0; margin:0; position:relative; top:0; left:0;}
#portofolioSlider .carousel .jcarousel-list li, #portofolioSlider .carousel .jcarousel-item {
float: left;
list-style: none;
width: 215px;
height: 160px;
margin-right: 20px;
}
/* ######## Newsletter Form ######## */
#newsletter {height:80px; padding-top:10px; position:relative;}
#newsletter .highlight {background:url(/images/newsletterHighlight.jpg) no-repeat left top; height:90px; width:288px; position:absolute; top:0; left:-30px; z-index:0;}
/* ######## Newsletter Columns ######## */
#newsletter .firstCol {z-index:1;}
#newsletter .secondCol {margin-top:8px; z-index:1;}
#newsletter .thirdCol {margin-top:4px; z-index:1;}
#newsletter .fourthCol {margin-top:12px; z-index:1;}
#newsletter small {color:#def7fb;}
#newsletter .textInput {
background:url(/images/forms/textInputNewsletter.png) no-repeat top right;
font-size:12px;
border:0;
height:15px;
line-height:15px;
width:190px;
color:#666666;
padding:6px 15px 6px 15px;
margin-bottom:10px;
}
#newsletter .textInput:focus {background-position:right -27px; outline:none;}
#newsletter .textInput.error {background-position:right bottom;}
#newsletter .subscribe {float:left;}
#newsletter .unsubscribe {float:right;}
#newsletter .subscribe input, #newsletter .unsubscribe input {margin:1px 5px 0 0; display:block; float:left;}
#newsletter .signUpOption {font-size:12px; color:#FFF; font-weight:bold;}
#newsletter .signUpOption input {margin:5px 5px 0 0; display:block; float:left;}
#newsletter .info {margin-left:20px;}
/* ######## Footer Widgets ######## */
#footer hr {border:0; border-top:1px solid #444444; clear: both; height: 0;}
#footerWidgets {padding-top:40px; padding-bottom:40px;}
#footerWidgets h3 {color:#FFF;}
#footerWidgets p {color:#FFF; line-height:1.45em;}
#footerWidgets hr {margin-top:15px; margin-bottom:15px;}
#footerWidgets img {border:1px solid #cccccc; padding:2px; background-color:#FFF; float:left; margin:3px 10px 0 0;}
#footerWidgets img:hover {border:1px solid #42b7d4;}
#footerWidgets img.noBorder {border:0; padding:0; background:none;}
#footerWidgets img.noBorder:hover {border:0; padding:0; background:none;}
#footerWidgets small {color:#42b7d4; font-size:11px;}
#footerWidgets ul {list-style-type:none;}
#footerWidgets ul small {color:#b4b4b4;}
#footerWidgets ul li {margin-bottom:25px;}
#footerWidgets .simpleButton {font-size:12px;}
#footerWidgets .lastComments p {font-style:italic;}
#footerWidgets .lastComments p:before {content: open-quote;}
#footerWidgets .lastComments p:after {content: close-quote;}
/* ######## Footer Contact Form ######## */
#footerWidgets .contactForm p {margin-bottom:10px;}
#footerWidgets .contactForm .errorText {text-align:right; clear:both; display:block; color:#FE3131; line-height:14px; font-size:11px;}
#footerWidgets .contactForm .textInput {
background:url(/images/forms/textInputBlack.png) no-repeat top right;
font-size:12px;
border:0;
height:15px;
width:190px;
color:#fff;
padding:6px 15px 6px 15px;
}
#footerWidgets .contactForm .textInput:focus {background-position:right -27px; outline:none;}
#footerWidgets .contactForm .textInput.error {background-position:right bottom;}
#footerWidgets .contactForm .textarea {width:220px; margin-bottom:10px;}
#footerWidgets .contactForm .textarea .top {background:url(/images/forms/textAreaBlack.png) no-repeat left top; height:13px; margin-bottom:-1px;}
#footerWidgets .contactForm .textarea .bottom {background:url(/images/forms/textAreaBlack.png) no-repeat left -18px; height:13px; margin-top:-4px;}
#footerWidgets .contactForm .textarea textarea {
background:url(/images/forms/textAreaBlackBg.jpg) repeat-y top left;
font-family:Arial,Helvetica,sans-serif;
font-size:12px;
border:0;
color:#fff;
padding:0 15px 0 15px;
margin-bottom:0;
overflow:auto;
width:190px;
height:185px;
}
#footerWidgets .contactForm .textarea textarea:focus {background:url(/images/forms/textAreaBlackBg.jpg) repeat-y -220px top; outline:none;}
#footerWidgets .contactForm .textarea.focus .top {background-position:left -31px;}
#footerWidgets .contactForm .textarea.focus .bottom {background-position:left -49px;}
#footerWidgets .contactForm .textarea.focus textarea {background-position:-220px top ;}
#footerWidgets .contactForm .textarea.error .top {background-position:left -62px;}
#footerWidgets .contactForm .textarea.error .bottom {background-position:left bottom;}
#footerWidgets .contactForm .textarea.error textarea {background-position:top right;}
#footerWidgets .responseText {text-align:right; display:none; clear:both;}
#footerWidgets .loadingImage {margin:4px 2px 0 0px; display:block; float:right; display:none;}
#footerWidgets .contactForm .button {
background:url(/images/buttons/send.png) no-repeat left top;
text-indent:-9999px;
height:24px;
width:68px;
display:block;
float:right;
border:0;
}
#footerWidgets .contactForm .button:hover {background-position:left -24px;}
#footerWidgets .contactForm .button:active {background-position:left -48px;}
/* ######## Bottom Footer ######## */
#bottomFooter {margin-bottom:20px;}
#bottomFooter .simpleMenu {font-size:11px; height:30px; line-height:30px; float:left;}
#bottomFooter .simpleMenu li {margin:0 10px 0 0;}
#bottomFooter .copyright {font-size:11px; height:30px; line-height:30px; text-align:right;}
/* ######## Login lightbox ######## */
#loginContainer {display:none;}
#login {width:280px; height:340px; margin:0 auto; padding:30px 0;}
#login hr {margin:10px 0 25px 0;}
#login p {margin-bottom:15px;}
#login .rememberMe {float:left; margin-top:5px;}
#login .forgotPassword {float:right; font-size:12px; margin-top:7px;}
#login .logIn { margin:25px auto 0 auto;}
#login .textInput {
background:url(/images/forms/textInput280.png) no-repeat top right;
font-size:12px;
border:0;
height:22px;
width:250px;
color:#666666;
padding:5px 15px 0 15px;
margin-top:20px;
}
#login .textInput:focus {background-position:right -27px; outline:none;}
#login .textInput.error {background-position:right bottom;}
/* ######## Custom Checkbox and Custom Radio Inputs ######## */
.customCheckbox, .customRadio {position:relative;}
.customCheckbox input, .customRadio input {position:absolute; left:3px; top:3px; margin:0; z-index:0;}
.customCheckbox label, .customRadio label {display:block; position:relative; z-index:1; padding-right:1em; line-height:1; padding:0.35em 0 0.5em 19px; cursor:pointer;}
.customCheckbox label {background:url(/images/buttons/radioButton.png) no-repeat 3px 4px;}
.customRadio label {background:url(/images/buttons/radioButton.png) no-repeat 3px 4px;}
.customCheckbox label.hover, .customRadio label.hover {background-position:3px -38px;}
.customCheckbox label.checked, .customRadio label.checked {background-position:3px -80px;}
.customCheckbox label.checkedHover, .customCheckbox label.checkedFocus {background-position:3px -80px;}
/* ######## Custom Select Form using sexy-combo http://code.google.com/p/sexy-combo/ ######## */
div.combo {position:relative; left: 0px; top: 0px;}
.combo .visible {display: block;}
.combo .invisible {display: none;}
div.sexy {
margin: 0; padding: 0;
width: 340px; height: 21px;
white-space: nowrap;
border: 0;
float:right;
font-size:12px;
}
div.sexy input {
background: url(/images/forms/selectInput.png) no-repeat 0 0;
padding:6px 15px 6px 15px;
margin:0; border:0;
position: absolute;
left:0px; top:0px;
width:310px; height:15px;
line-height:15px;
vertical-align:middle;
cursor:pointer;
font-size:12px;
color:#666666;
outline: none;
}
div.sexy input:hover {background-position:0 -27px;}
div.sexy input:active {background-position:0 -54px;}
div.showList input {background-position:0 -54px;}
div.showList input:hover {background-position:0 -54px;}
div.sexy div.list-wrapper {
left:0px; top:26px;
padding:0; margin:0;
border-top:1px solid #D9D9D9;
width:314px;
bottom:auto;
position: absolute;
overflow: hidden;
height: 200px;
max-height: 200px;
z-index: 99999;
}
div.sexy div.list-wrapper-up {top:auto; bottom:21px;}
div.sexy ul {list-style-type:none; padding:0; margin:0; height:200px;}
div.sexy li {
border-left:1px solid #D9D9D9;
border-right:1px solid #D9D9D9;
border-bottom:1px solid #cccccc;
background-color:#FFFFFF;
padding:0 0 0 15px; margin:0;
line-height:25px;
height:25px;
cursor:pointer;
}
div.sexy li:last-child {
-webkit-border-bottom-left-radius: 10px;
-khtml-border-radius-bottomleft: 10px;
-moz-border-radius-bottomleft: 10px;
border-bottom-left-radius: 10px;
-webkit-border-bottom-right-radius: 10px;
-khtml-border-radius-bottomright: 10px;
-moz-border-radius-bottomright: 10px;
border-bottom-right-radius: 10px;
}
div.sexy li.active {background-color:#eaeaea;}
div.sexy li:active {background-color:#4bc8e7; color:#FFF;}
div.sexy a, div.sexy a:visited, div.sexy a:active {
display: block;
width: 100%;
width: 146px;
text-decoration: none;
color: #666666;
cursor: pointer;
margin: 0;
height: 20px;
}
div.sexy input.empty {color:#666666;}
a.to-highlight:hover {background-color:#eaeaea;}
/* ######## Lightbox using nyroModal - http://nyromodal.nyrodev.com ######## */
div#nyroModalFull {font-size: 12px; color: #000;}
div#nyroModalLoading {
border: 4px solid #777;
width: 150px;
height: 150px;
text-indent: -9999em;
background: #fff url(/images/nyroModal/ajaxLoader.gif) no-repeat;
background-position: center;
}
div#nyroModalLoading.error {
border: 4px solid #f66;
line-height: 20px;
padding: 20px;
width: 300px; height: 100px;
text-indent: 0;
background: #fff;
}
div#nyroModalWrapper {
background: #fff;
border:1px solid #fff;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
a#closeBut {
position: absolute;
display: block;
top: 5px; right: -13px;
width: 100px; height: 12px;
outline: 0;
}
h1#nyroModalTitle {
margin:0; padding:0;
top:5px; left:10px;
position:absolute;
font-size:12px;
color: #666666;
}
div#nyroModalContent {overflow: auto;}
div.wrapper div#nyroModalContent {
border:1px solid #cccccc;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
div.wrapperImg div#nyroModalContent {
overflow: hidden;
text-align: center;
padding:25px 10px 10px 10px;
border:1px solid #cccccc;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}
div.wrapperImg img {vertical-align: baseline;}
div.wrapperImg div#nyroModalContent div {
position: absolute;
bottom: 0;
left: 0;
background: black;
padding: 10px;
margin: 10px;
border: 1px white dotted;
overflow: hidden;
opacity: 0.2;
}
div.wrapperImg div#nyroModalContent div:hover {opacity: 0.5; cursor: help;}
a.nyroModalPrev, a.nyroModalNext {
z-index: 105;
outline: none;
position: absolute;
top: 0;
height: 100%;
width: 40%;
cursor: pointer;
text-indent: -9999em;
background: left 20% no-repeat;
background-image: url(data:image/gif;base64,AAAA); /* Trick IE6 */
}
div.wrapperSwf a.nyroModalPrev, div.wrapperSwf a.nyroModalNext, div.wrapper a.nyroModalPrev, div.wrapper a.nyroModalNext {height: 60%; width: 20%;}
a.nyroModalPrev {left: 0;}
a.nyroModalPrev:hover {background-image: url(/images/nyroModal/prev.gif);}
a.nyroModalNext {right: 0; background-position: right 20%;}
a.nyroModalNext:hover {background-image: url(/img/images/nyroModal/next.gif);}
/* ######## Saf3+, Chrome1+ hacks ######## */
@media screen and (-webkit-min-device-pixel-ratio:0) {
#mainHeader .mainMenu li a {text-shadow:0 -1px 0.5px #20B3DC, 0 0.5px 1px #D3F2F8;}
#mainHeader .mainMenu li:hover a {text-shadow:0 0.8px 0.5px #2e95b2, 0 1px 0.4px #7bd1e5;}
#mainHeader .mainMenu li:active a {text-shadow:0 1px 0.4px #77cbe0, 0 -0.8px 0.5px #2d7083;}
#mainHeader .mainMenu .current a {text-shadow:0 1px 0.4px #77cbe0, 0 -0.8px 0.5px #2d7083;}
#content #commentsForm .textarea textarea {resize:none; padding:5px 5px 20px 15px; height:73px;}
#content .contact .textarea textarea {resize:vertical; max-width:308px; margin-bottom:-3px; outline:none;}
#footerWidgets .contactForm .textarea textarea {resize:vertical; max-width:190px;}
}
/* Remove the outlines from links and buttons and sIFR text replacement */
a, .customCheckbox label.focus, .customRadio label.focus, .sIFR-flash {outline:none;}
/* Remove the drag handles from the textarea in Safari and Chrome */
#footerWidgets .contactForm .textarea textarea, #content .contact .textarea textarea {resize:none;}
/*****************************************************************************
scalable Inman Flash Replacement (sIFR) version 3.
Copyright 2006 – 2008 Mark Wubben,
Older versions:
* IFR by Shaun Inman
* sIFR 1.0 by Mike Davidson, Shaun Inman and Tomas Jogin
* sIFR 2.0 by Mike Davidson, Shaun Inman, Tomas Jogin and Mark Wubben
See also and .
This software is licensed and provided under the CC-GNU LGPL.
See
*****************************************************************************/
@media screen {
.sIFR-flash {
visibility: visible !important;
margin: 0;
padding: 0;
}
.sIFR-replaced, .sIFR-ignore {
visibility: visible !important;
}
.sIFR-alternate {
position: absolute;
left: 0;
top: 0;
width: 0;
height: 0;
display: block;
overflow: hidden;
}
.sIFR-replaced div.sIFR-fixfocus {
margin: 0pt;
padding: 0pt;
overflow: auto;
letter-spacing: 0px;
float: none;
}
}
@media print {
.sIFR-flash {
display : none !important;
height : 0;
width : 0;
position : absolute;
overflow : hidden;
}
.sIFR-alternate {
visibility : visible !important;
display : block !important;
position : static !important;
left : auto !important;
top : auto !important;
width : auto !important;
height : auto !important;
}
}
/*
Place CSS rules for to-be-replaced elements here. Prefix by .sIFR-active
so they only apply if sIFR is active. Make sure to limit the CSS to the screen
media type, in order not to have the printed text come out weird.
*/
@media screen {
.sIFR-active h1, .sIFR-active h2, .sIFR-active h3, .sIFR-active h4, .sIFR-active h5 {
line-height:1em;
margin-bottom:-5px;
visibility: hidden;
color:#464646;
}
.sIFR-active h1 {font-size:40px;}
.sIFR-active h2 {font-size:30px;}
.sIFR-active h3 {font-size:22px;}
.sIFR-active h4 {font-size:20px;}
.sIFR-active h5 {font-size:17px;}
.sIFR-active #slider h1, .sIFR-active #heading h1 {margin-bottom:0;}
.sIFR-active #sidebar h2 {margin-bottom:-3px; background-position:left 6px;}
.sIFR-active #sidebar .testimonial h4 {text-indent:0;}
.sIFR-active #content .postHeadline h2, .sIFR-active #content .postHeadline h2 object {cursor:pointer}
.sIFR-active #center .projectPage .projectGallery .title {margin-bottom:12px;}
.sIFR-active #content .column h3 {margin-bottom:-8px;}
.sIFR-active #portofolioSlider h3.sIFR-replaced {margin-bottom:15px;}
.sIFR-active #newsletter h3.sIFR-replaced {margin-bottom:-3px;}
.sIFR-active #footerWidgets h3.sIFR-replaced {margin-bottom:-7px;}
}
html,body{height:100%;}#ps_hover{left:0;top:0;position:absolute;z-index:1000;}.ps_hd{background: url(/images/prettySociable/backgrounds/tr.png) top right no-repeat;padding:0 8px 0 0;}.ps_hd .ps_c{background: url(/images/prettySociable/backgrounds/tl.png) top left no-repeat;}.ps_ft{background: url(/images/prettySociable/backgrounds/br.png) top right no-repeat;padding:0 8px 0 0;}.ps_ft .ps_c{background: url(/images/prettySociable/backgrounds/bl.png) top left no-repeat;}.ps_bd{background: url(/images/prettySociable/backgrounds/cr.png) top right repeat-y;padding:0 8px 0 0;}.ps_bd .ps_c{background: url(/images/prettySociable/backgrounds/cl.png) top left repeat-y;padding:0 0 0 8px;}.ps_bd .ps_s{background:#fff;}.ps_hd,.ps_bd,.ps_ft{position: relative;z-index:1000;}.ps_hd .ps_c,.ps_ft .ps_c{font-size:1px;height:8px;}#ps_title{background: url(/images/prettySociable/backgrounds/tt_r.png) top right no-repeat;padding:0 5px 0 0;color:#fff;font-size:10px;font-weight: normal;left:8px;position:absolute;top:0;z-index:999;}#ps_title .ps_tt_l{background: url(/images/prettySociable/backgrounds/tt_l.png) top left no-repeat;line-height:20px;padding:0 0 0 5px;}#ps_tooltip{font-size:10px;left:0;position:absolute;top:0;width:250px;z-index:1010;}#ps_tooltip p{margin:0;}#ps_tooltip strong{font-size:1.2em;}#ps_websites{left:50%;position:absolute;top:50%;z-index:1005;}#ps_websites .ps_label{color:#fff;display: none;font-size:2em;left:0;position:absolute;top:0;white-space: nowrap;}#ps_websites ul{list-style: none;position: relative;z-index:1010;width:400px;}#ps_websites li{display:block;float: left;margin:0 30px 40px 0;}#ps_websites a{display:block;}#ps_overlay{background:#000;height:100%;left:0;position:absolute;top:0;width:100%;z-index:1005;}
ol.tag_cloud { list-style: none; margin: 0px ; padding: 0px;}
.tag_cloud li { display: inline; padding: 2px; }
/* hide the extra context from CSS-enabled browsers, but not screenreaders */
.tag_cloud span { position: absolute; left: 0px; top: -500px; width: 1px; height: 1px; overflow: hidden; }
.tag_cloud .size1 { font-size: 1em; }
.tag_cloud .size2 { font-size: 1.3em; }
.tag_cloud .size3 { font-size: 1.6em; }
.tag_cloud .size4 { font-size: 1.9em; }
.tag_cloud .size5 { font-size: 2.2em; }
.tag_cloud .size6 { font-size: 2.5em; }
/* ######## Testimonials Widget ######## */
.testimonial {background:url(/images/quotes.png) no-repeat top left; margin-bottom:20px; padding:10px 0 10px 10px;}
.testimonial p {text-indent:50px; }
.testimonial small {color:#b4b4b4; font-size:11px; float:right; margin-top:10px;}