@charset "utf-8";
/*  Main CSS Document */
/*
******************************************************************************************************

Title:            main.css
Browser(s):     All 

Website:        http://www.innova.gi
Company:        Innova Limited

******************************************************************************************************
*/
/*-------------------------------DEFINE BODY PROPERTIES----------------------------------------*/
* { margin: 0 auto 0 auto; /* GLOBAL RESET */ padding: 0; }
body { margin: 0; font-size: 62.5%; font-family: Helvetica, Arial, sans-serif; /*change font*/ color: #4b4d4a; /*change font color*/ background: #DCDCDA url(i/bg.png) repeat-x top center; }
div,
p,
ul,
img { padding: 0px; margin: 0px; border: none; }
ul { list-style-type: none }
.spacer { clear: both; font-size: 0px; line-height: 0px; }
a { outline: none; /* Remove Firefox's dotted borders */ text-decoration: none; padding: 0; margin: 0; color: #2F83C3; }
a:active { outline: none }
/* Firefox Dotted Outline Fix */
a:focus { -moz-outline-style: none }
/* Firefox Dotted Outline Fix */
a img { border: none }
/* Remove IE's blue borders */
h1 { font-size: 2.4em }
h2 { font-size: 2.2em; line-height: 1.2em; font-weight: normal; border: none; margin: 0 0 35px 0; padding: 0; color: #333; }
h3 { font-family: Helvetica, Arial, sans-serif; font-weight: bold; font-size: 2.8em; line-height: 0.8em; font-weight: normal; border: none; margin: 0; color: #2F83C3; }
h4 { font-size: 1.6em }
h5 { font-size: 1.8em }
h6 { font-size: 1.2em }
.hr { border-bottom: 1px solid #fff; border-left: none; border-right: none; border-top: none; margin: 5px 0 17px 0; }
.left { float: left }
.left_margin_right { float: left; margin: 0 10px 0 0; font-size: 1.2em; }
.left_margin_right_top { float: left; margin: 4px 10px 0 0; }
.right { float: right }
.right_margin_top { margin: 20px 0 0 0 }
.right_margin_right { float: right; margin: 0 20px 0 0; }
/*------------------------------GLOBAL TYPOGRAPHY--------------------------------*/
p { font-size: 1.2em; padding: 0; line-height: 1.4em; }
.gray { color: #666; font-size: 1em; font-style: normal; }
.fat { font-weight: bold }
.small { font-size: 1.1em; padding: 0; line-height: 1.4em; }
.big { font-size: 1.8em; padding: 0; line-height: 1.2em; color: #666; padding: 10px 10px 0 0; margin: 0 0 10px 0; }
.quote1 { font-size: 1.8em; line-height: 1.0em; padding: 0; color: #666; }
.white { font-size: 1.2em; padding: 0 10px 0 0; line-height: 1.4em; color: #fff; }
.title { font-size: 1.1em; font-style: italic; color: #227ab0; padding-left: 30px; }
.stroke { border: 0px solid #fff }
/*------------------------------CONTENT--------------------------------*/
#header { background: url(i/bg_header.png) top center repeat-x; height: 100px; }
#featuredFX { background: url(i/bg_featured.png) top center repeat-x; height: 290px; }
#main { background: url(i/bg_main.png) top center repeat-x; height: 720px; }
#footer { background: url(i/bg_footer.png) top center repeat-x; height: 357px; }
#footer_nav { background: url(i/bg_footernav.png) top center repeat-x; height: 42px; }
/* #featuredFX{ background:transparent url(../images/seo.png) top center no-repeat; } */
#footerFX { background: transparent url(i/overlay_footer.jpg) top center no-repeat }
.ftImage { position: relative; right: 10px; top: 90px; }
.center { width: 960px; height: 100%; margin: 0 auto; padding: 0; }
.center_footer { width: 960px; height: 100%; margin: 0 auto; padding: 0; background: transparent url(i/overlay_footer.jpg) top center no-repeat; }
h1 a { float: left; margin: 18px 0px 0px 5px; display: block; width: 230px; height: 75px; background: transparent url(../images/logo.png) no-repeat; text-indent: -9999px; overflow: hidden; }
.csw { width: 100%; height: auto; background: #fff; overflow: scroll; }
.csw .loading { margin: 200px 0 300px 0; text-align: center; }
.left_column_header { width: 450px; float: left; padding: 10px 0 10px 0; }
.right_column_header { width: 450px; float: left; padding: 10px 0 20px 0; }
.left_column { width: 450px; float: left; padding: 10px 0 5px 20px; }
.right_column { width: 460px; float: left; padding: 25px 10px 5px 20px; }
.right_column .description { float: left; width: 95%; padding-left: 10px; }
.featured { width: 430px; height: 250px; padding: 23px 0 0 18px; background: transparent url(i/frame.png) no-repeat; }
ul.listing { font-size: 11px; float: left; padding: 5px 10px 5px 10px; margin: 0; }
ul.listing li { list-style-image: none; background-image: url(i/bullet-blue.png); background-repeat: no-repeat; background-position: left center; padding: 0 0 0 22px; margin: 0 0 10px 0; font-size: 1.2em; }
ul.listing li:hover { list-style-image: none; background-image: url(i/bullet-white.png); background-repeat: no-repeat; background-position: left center; padding: 0 0 0 22px; margin: 0 0 10px 0; font-size: 1.2em; }
ul.listing li a { color: #333; font-weight: normal; }
/*NAVIGATION*/
.nav ul { font-family: Helvetica, Arial, sans-serif; font-weight: bold; margin: 7px 0 0 0; padding: 0; list-style: none; float: right; }
.nav ul li { font-family: Helvetica, Arial, sans-serif; font-weight: bold; float: left; display: block; margin: 0 15px 0 0; padding: 0; }
.nav ul li a.navbutton { /* Sliding right image */ display: block; float: left; height: 71px; /* CHANGE THIS VALUE ACCORDING TO IMAGE HEIGHT */ margin-right: 0px; padding-right: 9px; /* CHENGE THIS VALUE ACCORDING TO RIGHT IMAGE WIDTH */: ; /* FONT PROPERTIES */ text-decoration: none; color: #fff; font-size: 1.2em; font-family: Helvetica, Arial, sans-serif; font-weight: bold; text-transform: uppercase; text-shadow: 1px 1px 0px #600; }
.nav ul li a.navbutton span { /* Background left image */ display: block; line-height: 71px; /* CHANGE THIS VALUE ACCORDING TO BUTTONG HEIGHT */ padding: 13px 0 0 7px; }
.nav ul li a.navbutton:hover { /* Sliding right image */ background: transparent url(i/button_nav_right.png) no-repeat scroll top right; display: block; float: left; height: 71px; /* CHANGE THIS VALUE ACCORDING TO IMAGE HEIGHT */ margin-right: 0px; padding-right: 9px; /* CHENGE THIS VALUE ACCORDING TO RIGHT IMAGE WIDTH */: ; /* FONT PROPERTIES */ text-decoration: none; color: #fff; font-size: 1.2em; font-family: Helvetica, Arial, sans-serif; font-weight: bold; text-transform: uppercase; text-shadow: 1px 1px 0px #039; }
.nav ul li a.navbutton:hover span { /* Background left image */ background: transparent url(i/button_nav_left.png) no-repeat; display: block; line-height: 71px; /* CHANGE THIS VALUE ACCORDING TO BUTTONG HEIGHT */ padding: 13px 0 0 7px; }
.nav ul li.selected a { /* Sliding right image */ background: transparent url(i/button_nav_right.png) no-repeat scroll top right; display: block; float: left; height: 71px; /* CHANGE THIS VALUE ACCORDING TO IMAGE HEIGHT */ margin-right: 0px; padding-right: 9px; /* CHENGE THIS VALUE ACCORDING TO RIGHT IMAGE WIDTH */: ; /* FONT PROPERTIES */ text-decoration: none; color: #fff; font-size: 1.2em; font-family: Helvetica, Arial, sans-serif; font-weight: bold; text-transform: uppercase; text-shadow: 1px 1px 0px #039; }
.nav ul li.selected a span { /* Background left image */ background: transparent url(i/button_nav_left.png) no-repeat; display: block; line-height: 71px; /* CHANGE THIS VALUE ACCORDING TO BUTTONG HEIGHT */ padding: 13px 0 0 7px; }
/* END OF NAVIGATION */
/* FEATURED SLIDER */
#slider { width: 960px; padding: 0 0 0 0; margin: 0 auto; }
div#slideshow { float: left; width: 100%; height: 270px; }
.slider-item { width: 100% !important; height: 250px; clear: both; }
.slider-item img { float: right; margin: 0; padding: 8px 15px 0 0; }
.slider-item .text_item { width: 480px; float: left; margin: 0; padding: 10px 0 0 0; }
.slider-item .text_item h2 { font: bold 30px Arial, Helvetica, sans-serif; color: #fff; padding: 10px 0; margin: 0; line-height: 1.2em; }
.slider-item .text_item p { font: normal 14px Arial, Helvetica, sans-serif; color: #d8f4ff; padding: 0 0 10px 0; margin: 0; line-height: 1.8em; }
.slider-item .text_item img { margin: 10px auto; padding: 0; float: left; }
.slider_content_inner img { border: none }
.controls-center { width: 960px; margin: 0 auto; padding: 0; }
#slider_controls { margin: 0 auto; z-index: 1000; width: 960px; }
#slider_controls h2 { width: 700px; float: left; font: normal 14px Arial, Helvetica, sans-serif; color: #4c4c4c; padding: 10px 0 0 0; margin: 0; }
#slider_controls h2 span { font: normal 11px Arial, Helvetica, sans-serif; color: #6d6d6d; padding: 0; margin: 0; }
#slider_controls ul { margin: 0; padding: 0; width: 254px; float: right; }
#slider_controls ul li { margin: 0; padding: 0; list-style: none; }
#slider_controls ul li { float: right; display: block; }
#slider_controls ul li a { text-align: center; font: normal 12px Arial, Helvetica, sans-serif; color: #1993b6; text-decoration: none; width: 25px; height: 15px; background: url('images/tabs_2.gif') no-repeat center center; display: block; float: left; padding: 3px 2px 0 2px; margin: 2px !important; margin: 1px 1px; outline: none; }
#slider_controls ul li a:focus { outline: none }
#slider_controls ul li a:hover,
#slider_controls ul li a.activeSlide { color: #979797; background: url('images/tabs_1.gif') no-repeat center center; }
/* FEATURED SLIDER */
/*
    WIDGET STRUCTURE
*/
.stripViewer .panelContainer .panel ul { text-align: left }
.slider-wrap { /* This div isn't entirely necessary but good for getting the side arrows vertically centered */ position: relative; width: 100%; }
/* These 2 lines specify style applied while slider is loading */
.csw { width: 100%; height: 35px; overflow: hidden; }
.csw .loading { margin: 0px; text-align: center; size: 2.8em; }
.stripViewer { /* This is the viewing window */ position: relative; overflow: hidden; margin: auto auto 5px auto; width: 945px; /* Also specified in  .stripViewer .panelContainer .panel  below */ clear: both; }
.stripViewer .panelContainer { /* This is the big long container used to house your end-to-end divs. Width is calculated and specified by the JS  */ position: relative; left: 0; top: 0; width: 100%; list-style-type: none; -moz-user-select: none; /* This breaks CSS validation but stops accidental (and intentional - beware) panel highlighting in Firefox. Some people might find this useful, crazy fools. */ }
.stripViewer .panelContainer .panel { /* Each panel is arranged end-to-end */ float: left; height: 100%; position: relative; width: 1000px; /* Also specified in  .stripViewer  above */ }
.stripViewer .panelContainer .panel .wrapper { /* Wrapper to give some padding in the panels, without messing with existing panel width */ padding: 5px; }
.stripNav { /* This is the div to hold your nav (the UL generated at run time) */ margin: 5px 5px 5px 5px; }
.stripNav ul { /* The auto-generated set of links */ list-style: none; }
.stripNav ul li { float: left }
.stripNav li a { /* Generic "CSS image replacement" */ display: block; height: 62px; text-indent: -9999px; }
.stripNav li.tab1 a { background: url(i/tab1.png) top center no-repeat; width: 232px; }
.stripNav li.tab2 a { background: url(i/tab2.png) top center no-repeat; width: 240px; }
.stripNav li.tab3 a { background: url(i/tab3.png) top center no-repeat; width: 240px; }
.stripNav li.tab4 a { background: url(i/tab4.png) top center no-repeat; width: 229px; }
.stripNav li.tab1 a:hover { background: url(i/tab1.png) bottom center no-repeat; width: 232px; }
.stripNav li.tab2 a:hover { background: url(i/tab2.png) bottom center no-repeat; width: 240px; }
.stripNav li.tab3 a:hover { background: url(i/tab3.png) bottom center no-repeat; width: 240px; }
.stripNav li.tab4 a:hover { background: url(i/tab4.png) bottom center no-repeat; width: 229px; }
.stripNav li a:active,
.stripNav li a:focus { /* Restore focus styling that we removed when we removed outlines */ background-position: top center; }
.stripNav li.tab1 a.current { background: url(i/tab1.png) bottom center no-repeat }
.stripNav li.tab2 a.current { background: url(i/tab2.png) bottom center no-repeat }
.stripNav li.tab3 a.current { background: url(i/tab3.png) bottom center no-repeat }
.stripNav li.tab4 a.current { background: url(i/tab4.png) bottom center no-repeat }
.stripNavL,
.stripNavR { height: 0px; text-indent: -9000em; }
/* 
    END OF SLIDER
*/
/*
    TESTIMONIAL
*/
.centertextwrap { margin: 0 auto; text-align: center; padding: 45px 0 0 0; background: url(../images/hr-trans.png) no-repeat bottom; }
.quoteslides { padding-bottom: 40px }
.quoteslides div { margin: 0 auto; text-align: center; width: 100%; }
.mcycletextwrap { margin: 0 auto; text-align: center; padding-top: 10px; padding-bottom: 5px; background: url(../images/hr-trans.png) no-repeat; }
.mcycletitle { font-size: 18px; color: #424242; font-weight: bold; }
.mcycletitle a { color: #424242 }
.mcycletitle a:hover { color: #111; text-decoration: none; }
.mcycledesc { font-size: 14px; color: #888888; padding-top: 5px; }
/* Quotation Navigation -------- */
.quotenav { padding-top: 10px; color: #A2A2A2; font-size: 11px; text-indent: 3000px; overflow: hidden; margin: 0 auto; width: 30px; height: 20px; }
.quotenext { float: right; width: 9px; }
.quoteprev { float: left; width: 9px; }
.quotenext,
.quoteprev { color: #A2A2A2; cursor: pointer; }
.quotenext:hover,
.quoteprev:hover { color: #747474; text-shadow: #fff 1px 1px; }
.quotenext { background-image: url(../images/quotenext.png) }
.quotenext:hover { background-position: 0 -28px }
.quoteprev { background-image: url(../images/quoteprev.png) }
.quoteprev:hover { background-position: 0 -28px }
/* 16.-------- Pullquote -------- */
#contents .pullquote-c { padding: 5px 5px 5px 0; margin: 10px 10px 5px 0; width: 100%; font-family: georgia; font-size: 18px; font-style: italic; }
#contents .pullquote-r { padding: 5px 0 5px 5px; margin: 10px 0 5px 10px; float: right; width: 250px; font-family: georgia; font-size: 18px; font-style: italic; }
#contents .pullquote-l { padding: 5px 5px 5px 0; margin: 10px 10px 5px 0; float: left; width: 250px; font-family: georgia; font-size: 18px; font-style: italic; }
/*
    END OF TESTIMONIAL
*/
/* 
    CONTENT
*/
.dotted-line { height: 5px; border-bottom: 1px dotted #999; margin-bottom: 10px; }
#content { width: 945px; height: 45%; margin: 0 auto; padding: 0 15px 0 0; }
#col1 { width: 650px; height: auto; float: left; background: #FFF; }
#col1_inner { margin: 10px; padding: 10px; width: 610px; background: #FCFCFC; }
#col1_inner p.custom { font-size: 1.4em; line-height: 1.4em; text-align: justify; color: #333; }
#col1_inner h4 { font-size: 2.2em; color: #2F83C3; padding: 5px 0 10px 0; text-shadow: 1px 1px 1px #CCC; }
#col1_inner strong { text-shadow: 1px 1px 0px #CCC }
#col2 { width: 280px; height: auto; float: right; background: #FFF; }
#col2_inner { margin: 10px; padding: 10px; width: 240px; background: #FCFCFC; }
#col2_inner p.custom { font-size: 1.4em; line-height: 1.5em; text-align: justify; }
#col2_inner h4 { font-size: 1.6em; text-transform: uppercase; color: #2F83C3; text-align: center; padding: 6px 0 0 0; text-shadow: 1px 1px 1px #CCC; }
#col2_inner hr { border: none; padding-bottom: 6px; padding-top: 6px; }
#col2_inner .dotted-line { color: #2F83C3 }
#col2_inner a.all { display: block; width: 185px; background: #f2f2f2; border: 1px solid #e0e0e0; color: #6c6c6c; font-size: 1.1em; padding: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
#col2_inner a.all:hover { display: block; width: 185px; background: #fff; border: 1px solid #e0e0e0; color: #6c6c6c; font-size: 1.1em; padding: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; }
#col2_inner p.sig { float: right; padding: 0 5px 10px 0; }
#col2_inner p.sig span { font-size: 1.1em; font-style: normal; color: #666; }
#col2_inner a.logo { float: right; width: 86px; height: 20px; display: block; background: transparent url(../images/gibyellow-logo.jpg) no-repeat; text-indent: -9999px; overflow: hidden; }
.clients-served { height: 70px; width: 170px; margin: auto; text-align: center; }
.clients-served img { max-height: 70px; max-width: 170px; }
/* 
    FOOTER CONTENT
*/
.columnb  a { color: #fff }
.columnb  a:hover { color: #BFBFBF }
div#creditfooter { display: none; text-align: justify; margin: -5px; }
/* Latest Blog Posts */
.columnb { width: 460px; padding: 0 15px 0 0; margin: 15px 0; float: left; color: #2F83C3; }
.columnb h5 { font-size: 1.2em; letter-spacing: 1px; color: #FFF; text-transform: uppercase; font-family: Helvetica, Arial, sans-serif; text-shadow: 1px 1px 0px #06C; }
.columnb h6 { margin: 0 0 5px 0 }
.columnb h6 a { margin: 0 0 5px 0; font-size: 1.0em; letter-spacing: 1px; color: #d8f4ff; text-transform: uppercase; font-family: Helvetica, Arial, sans-serif;}
.columnb h6 a:hover { margin: 0 0 5px 0; color: #FFF; }
.columnb .date { float: left; width: 60px; height: 17px; padding: 2px 0 0 4px; margin: 5px 10px 0 0; background: transparent url(i/ico_date.png) no-repeat; font-size: 1.1em; font-weight: 100 ; color: #FFF; letter-spacing:normal;}
.columnb p { font-size: 1.0em; color: #FFF; }
.columnb p.lead { font-size: 1.0em; margin: 0 0 8px 0; letter-spacing:1px; }
/* END Latest Blog Posts */
.column { width: 225px; padding: 0 15px 0 0; margin: 15px 0; float: left; color: #2F83C3; }
.column h5 { font-size: 1.2em; letter-spacing: 1px; color: #FFF; text-transform: uppercase; font-family: Helvetica, Arial, sans-serif; text-shadow: 1px 1px 0px #06C; }
.column h6 { margin: 0 0 5px 0 }
.column h6 a { margin: 0 0 5px 0; color: #fff; font-size: 1.2em; letter-spacing: 1px; color: #FFF; text-transform: uppercase; font-family: Helvetica, Arial, sans-serif; }
.column h6 a:hover { margin: 0 0 5px 0; color: #BFBFBF; }
.column .date { float: left; width: 60px; height: 17px; padding: 2px 0 0 4px; margin: 5px 10px 0 0; background: transparent url(i/ico_date.png) no-repeat; font-size: 1.1em; font-weight: bold; }
.column p { font-size: 1.1em }
.column p.lead { font-size: 1em; margin: 0 0 8px 0; }
.column_odd { width: 225px; padding: 0; margin: 15px 0; float: left; color: #f0f0f0; }
.column_odd p { font-size: 1.1em }
.column_odd h5 { font-size: 1.2em; letter-spacing: 1px; color: #FFF; text-transform: uppercase; font-family: Helvetica, Arial, sans-serif; text-shadow: 1px 1px 0px #06C; }
.column_odd #twitter { width: 190px; height: 210px; padding: 15px 20px 10px 20px; position: relative; font-size: 1.2em; color: #333; font-family: Helvetica, Arial, sans-serif; font-style: italic; line-height: 18px; }
.column_odd #twitter a.twitter { font-weight: bold; margin: 80px 0px 5px 5px; }
.column_odd #twitter a.follow { position: absolute; bottom: 70px; left: 0; padding: 0 0 0 20px; color: #fff; font-family: Helvetica, Arial, Sans-Serif; text-decoration: underline; font-size: 0.8em; }
.column_odd #twitter a.follow:hover { position: absolute; bottom: 70px; left: 0; padding: 0 0 0 20px; color: #C00; font-family: Helvetica, Arial, Sans-Serif; text-decoration: underline; font-size: 0.8em; }
.column_odd #twitter p.posted { font-size: 0.8em; margin: 2px 0 0 0; color: #999; }
.column .fport { float: left; display: block; width: 213px; height: 125px; padding: 3px 3px 3px 3px; margin: 0 0 8px 4px; background: #FFF; }
.column .fport:hover { float: left; display: block; width: 213px; height: 125px; padding: 3px 3px 3px 3px; margin: 0 0 8px 4px; background: #d8f4ff; }
.column a.comment { display: block; font-size: 0.9em; margin: 5px 0 0 0; color: #f0f0f0; }
.column a.comment:hover { display: block; font-size: 0.9em; margin: 5px 0 0 0; color: #d05606; }
/* 
    FOOTER NAVIGATION
*/
#footer_nav .center a.footer_logo { float: left; display: block; width: 70px; height: 20px; padding: 35px 0px 0px 35px; background: transparent url(../images/footer_logo.png) no-repeat; background-position: 0% 50%; text-indent: -9999px; overflow: hidden; }
#footer_nav .center p { float: left; font-size: 1.1em; color: #848484; padding: 20px 0 0 0; }
#footer_nav .center ul { float: right }
#footer_nav .center ul li { float: left; margin: 20px 20px 0 0; }
#footer_nav .center ul li a { font-size: 1.1em; text-transform: uppercase; color: #848484; }
#footer_nav .center ul li a:hover { color: #505457 }
#footer_nav .center ul li a:active { color: #505457 }
