*
{
    margin: 0;
    padding: 0;
    border: 0;
}

body, html
{
    text-align: center; /*** Centers the design in old IE versions ***/
    height: 100%;
}

body
{
    background: #faf6f6;
    font: 11px/20px Tahoma,Helvetica,sans-serif;
    color: #222; /*background-image:url("/content/images/bodybg.jpg"); 	background-repeat:repeat-x; 	background-position:0 96px;*/
}

#fauxcolumns
{
    margin: 0 auto;
    width: 960px;
    min-height: 100%;
    background: transparent url("/content/images/leftcolumnbg.jpg") repeat-y;
    border-left: 2px solid #faf6f6;
}

* html #fauxcolumns
{
    height: 100%; /*** IE doesn't support min-height, but instead it handles height as min-height so we need to hack the height ***/
}

#wrapper
{
    width: 960px;
    margin: 0 auto;
    position: relative;
    padding: 0 0 10px 0;
    min-height: 100%;
    clear: both;
}

* html #wrapper
{
    height: 100%; /*** IE doesn't support min-height, but instead it handles height as min-height so we need to hack the height ***/
}

#leftbanner, #rightbanner, #rightbanner2
{
    float: left;
    height: 220px;
    margin: -1px 2px 2px 0;
    overflow: hidden;
    background: #faf6f6;
}

#leftbannersmall, #rightbannersmall
{
    float: left;
    height: 100px;
    margin: -1px 2px 2px 0;
    overflow: hidden;
}

#leftbanner, #leftbannersmall
{
    width: 230px;
    height: 42px;
    background-color: #292a5c;
    background-image: url("/content/images/paladinhelmet.jpg");
    background-repeat:no-repeat;
    background-position: 78px 10px;
    border-bottom: 2pt solid #fff;
    padding: 178px 15px 0px 15px;
    text-align: left;
}

#leftbannersmall
{
    padding: 20px 15px 0px 15px;
}

#leftbanner h1, #leftbannersmall h1
{
    color: #ccc;
    margin-left: 8px;
}

#leftbanner h4, #leftbannersmall h4
{
    color: #aaa;
}

#rightbanner
{
    width: 696px;
    background-color: #c9d1dd;
}

#rightbannersmall
{
    width: 696px;
    background-color: #c9d1dd;
}

#rightbanner2
{
    width: 696px;
    background-color: #c9d1dd;
    background: url(/content/images/canarywharf2.jpg) no-repeat;
}

#leftcolumn
{
    width: 230px;
    float: left;
    padding: 20px 15px 30px 15px;
    text-align: left;
}

#content
{
    width: 670px;
    padding: 20px 0px 20px 20px;
    text-align: left;
    margin-right: 2px;
    float: left;
}

#inner
{
    padding-bottom: 30px;
}
* html #inner
{
    width: 100%;
}

#inner p
{
    width: 95%;
}

.innerContent
{
    border-top: 1pt solid #ccc;
    padding-top: 10px;
}

.clear
{
    clear: both;
}

#footer
{
    width: 945px;
    height: 26px; /*** The drawback with this solution is that the height of the footer can't be flexible. If you add so much content to the footer that it extends 30px, you will get a vertical scrollbar and the content will overflow the footer if you don't set overflow to hidden ***/
    margin: 0 auto;
    margin-top: -36px; /*** By using a negative margin-top we now moves the footer up the same amount as the footer height to avoid vertical scrolling. Remember, if you use borders and padding on your footer you will have to calculate this in your negative margin-top value also. ***/
    text-align: center;
    background: #aaa;
    text-align: right;
    color: #fff;
    padding: 7px 15px 0px 0px;
    border-top: 2pt solid #fff;
}



#header-top
{
    height: 66px;
    overflow: hidden;
    padding: 28px 10px 0px 10px;
    background-color: #faf6f6;
}

#logo
{
    float: left;
    
}
#logo h1
{
    background: url(/content/images/paladinlogo3.jpg) no-repeat;
    width: 275px;
}
#logo h1 a
{
    display: block;
    height: 55px;
}
#logo h1 a span
{
    display: none;
}

#strapline
{
    float: right;
    padding-top: 26px;
}
#strapline h1
{
    background: url(/content/images/strapline2.jpg) no-repeat;
    width: 517px;
}
#strapline h1
{
    display: block;
    height: 66px;
}
#strapline h1 span
{
    display: none;
}

#s3slider
{
    position: relative;
    height: 220px;
    overflow: hidden;
}
#s3sliderContent
{
    width: 696px; /* important to be same as image width or wider */
    top: 0; /* important */
    margin-left: 0; /* important */
}

.s3sliderImage
{
    float: left; /* important */
    position: relative; /* important */
    display: none; /* important */
}

.s3sliderImage span
{
    position: absolute; /* important */
    left: 0;
    font: 11px/15px Arial, Helvetica, sans-serif;
    padding: 10px 13px 15px 13px;
    width: 675px;
    background-color: #000;
    filter: alpha(opacity=70); /* here you can set the opacity of box with text */
    -moz-opacity: 0.7; /* here you can set the opacity of box with text */
    -khtml-opacity: 0.7; /* here you can set the opacity of box with text */
    opacity: 0.7; /* here you can set the opacity of box with text */
    color: #fff;
    display: none; /* important */
    bottom: 0; /* 	   if you put 	   top: 0; -> the box with text will be shown at the top of the image 	   if you put 	   bottom: 0; -> the box with text will be shown at the bottom of the image    */
}

s3sliderImage span .associate
{
    font-weight: bold;
    font-size: 20px;
    color: Red;
}

#menu
{
    width: 100%;
    height: 37px;
    position: relative;
    z-index: 2;
    float: left;
    background-color: #faf6f6;
    background: transparent url("/content/images/menubg.jpg") repeat-x top right;
}

#menu ul
{
    padding: 0 0 0 0px;
    list-style-type: none;
    width: auto;
    float: left;
}

#menu ul li
{
    display: block;
    float: left;
    margin: 0 1px 0 0;
    border-right: 1pt solid #666;
    margin: auto;
    text-align: center;
}

#menu ul li a
{
    display: block;
    float: left;
    color: #ddd;
    text-decoration: none;
    font-family: Arial, Helvetica, sans-serif;
    font-size: x-small;
    padding: 7px 15px 0 15px;
    height: 27px;
    background: transparent url("/content/images/menubg.jpg") repeat-x right;
    overflow: hidden;
}

#menu ul li a:hover
{
    color: #fff;
    background: transparent url("/content/images/menubghover.jpg") repeat-x right;
}

#menu ul li a.current, #foxmenu ul li a.current:hover
{
    color: #fff;
    background: transparent url("/content/images/menubgselected.jpg") repeat-x right;
}

#menu .first
{
    width: 150px;
    border-left: 1pt solid #666;
}

#menu .home
{
    width: 50px;
}

/* Panel Tab/button */
.tab
{
    background: url(/content/images/tabbg.png) repeat-x 0 0;
    height: 42px;
    position: relative;
    top: 0;
    z-index: 999;
}

.tab ul.login
{
    display: block;
    position: relative;
    float: right;
    clear: right;
    height: 31px;
    width: auto;
    font-weight: bold;
    line-height: 31px;
    margin: 0;
    right: 50px;
    color: white;
    font-size: 80%;
    text-align: center;
}

.tab ul.login li.left
{
    background: url(/content/images/tableft.png) no-repeat left 0;
    height: 31px;
    width: 21px;
    padding: 0;
    margin: 0;
    display: block;
    float: left;
}

.tab ul.login li.right
{
    background: url(/content/images/tabright.png) no-repeat left 0;
    height: 31px;
    width: 21px;
    padding: 0;
    margin: 0;
    display: block;
    float: left;
}

.tab ul.login li
{
    text-align: left;
    padding: 0 6px;
    display: block;
    float: left;
    height: 31px;
    background: url(/content/images/tabbg2.png) repeat-x 0 0;
}

.tab ul.login li a
{
    color: #bfbfbf;
}

.tab ul.login li a:hover
{
    color: white;
}

.tab .sep
{
    color: #414141;
}

.tab a.open, .tab a.close
{
    height: 20px;
    line-height: 20px !important;
    cursor: pointer;
    display: block;
    width: 100px;
    position: relative;
    top: 5px;
}

/* sliding panel */
#toppanel
{
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 999;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

#panel
{
    width: 100%;
    height: 240px;
    color: #aaa;
    background: #292a5c;
    overflow: hidden;
    position: relative;
    z-index: 3;
    display: none;
    border-bottom: 1pt solid #393a3b;
}

#panel h1
{
    font-size: 1.5em;
    padding: 5px 0 10px;
    margin: 0;
    color: white;
}

#panel h2
{
    font-size: 1.2em;
    padding: 10px 0 5px;
    margin: 0;
    color: white;
}

#panel p
{
    margin: 5px 0;
    padding: 0;
}

#panel a
{
    text-decoration: none;
    color: #bfbfbf;
}

#panel a:hover
{
    color: #fff;
}

#panel a-lost-pwd
{
    display: block;
    float: left;
}

#panel .content
{
    width: 960px;
    margin: 0 auto;
    padding-top: 15px;
    text-align: left;
    font-size: 0.90em;
}

#panel .content .left
{
    width: 260px;
    height: 200px;
    float: left;
    padding: 0 15px;
    border-left: 1px solid #333;
    margin-left: 20px;
}

#panel .content .right
{
    border-right: 1px solid #333;
}

#panel .content form
{
    margin: 0 0 10px 0;
}

#panel .content label
{
    float: left;
    padding-top: 8px;
    clear: both;
    width: 280px;
    display: block;
}

#panel .content input.field
{
    border: 1px #393a3b solid;
    background: #f0f0f0;
    margin-right: 5px;
    margin-top: 4px;
    width: 200px;
    color: #1d1d1d;
    height: 16px;
}

#panel .content input:focus.field
{
    background: #545454;
}

.carouselmain
{
    padding-top: 8px;
    border-bottom: 1pt solid #aaa;
    border-top: 1pt solid #aaa;
    text-align: center;
    margin-bottom: 10px;
}

.jCarouselLite
{
    text-align: left;
}

.jCarouselLite ul
{
    height: 300px;
}

.jCarouselLite li
{
    margin-bottom: 12px;
    font: 11px/14px Tahoma,Helvetica,sans-serif;
}

.jCarouselLite li a
{
    font-weight: bold;
}

.next
{
    height: 24px;
    width: 28px;
    background: url(/content/images/uparrow.jpg) no-repeat left 0;
    float: left;
    cursor: hand;
}

.source
{
    float: left;
    margin: 0px 22px 0px 22px;
}

.prev
{
    height: 24px;
    width: 28px;
    background: url(/content/images/downarrow.jpg) no-repeat left 0;
    float: left;
    cursor: hand;
}

#pages
{
    padding-top: 10px;
    margin-top: 8px;
    border-top: 1pt solid #ccc;
}

#pageLinks
{
    border-top: 1pt solid #ccc;
    padding-top: 8px;
}

#pages div
{
    display: none;
    width: 300px;
}

#pageLinks a
{
    font-weight: bold;
    margin: 0px 4px 0px 4px;
}

#pageLinks span
{
    color: #343699;
    font-weight: bold;
    margin: 0px 4px 0px 4px;
}

.managementPhoto
{
    float: left;
    margin-right: 10px;
    margin-bottom: 10px;
}

.testimonials div
{
    padding: 0px 20px 0px 20px;
}

.testimonials p
{
    font: 11px/12px Tahoma,Helvetica,sans-serif;
    font-style: italic;
    margin:0px 20px 0px 20px;
}

.testimonials h5
{
    color:#1c1c48;
}


.clientList
{
    float: left;
    list-style: none;
    border-right: 1pt solid #eee;
    padding: 0px 6px 0px 10px;
    width:155px;
    margin-left:-5px;
}

/* Tooltip */

.tooltip {
	display:none;
	font: 11px/15px Arial, Helvetica, sans-serif;
	width:310px;
	padding:10px;
	background-color: #222;
    filter: alpha(opacity=90); /* here you can set the opacity of box with text */
    -moz-opacity: 0.9; /* here you can set the opacity of box with text */
    -khtml-opacity: 0.9; /* here you can set the opacity of box with text */
    opacity: 0.9; /* here you can set the opacity of box with text */
    color: #fff;
	z-index:999;
	position:absolute;
}

.tooltip p {
	font-size:11px;
}

.tooltip h5 {
	color:#eee;
}

.testimonial, .testimonial2, .testimonial3, .testimonial4
{
	font-weight:bold;
	color:#1c1c48;
	cursor:default;
}

/* Paragraph and list Styles */

#content p
{
    margin: 0 0 15px 0;
}
#content form p
{
    margin: 0 0 5px 0;
}
#content p img.floatleft
{
    margin: 0 20px 0 0;
}
#container p img.floatright
{
    margin: 0 0 0 20px;
}
#content img.floatleft, #mainarea p img.floatleft
{
    margin: 10px 10px 10px 0;
}
#content img.floatright, #mainarea p img.floatright
{
    margin: 10px;
}
#content ul, #container ol
{
    margin: 0 0 0 20px;
}
#content ol
{
    margin: 0 0 0 30px;
}
#content ul#works
{
    list-style: none;
    margin: 0;
}
#content dt
{
    font-weight: bold;
    margin: 5px 0;
}

/* Paragraph Styles */

/* Genric Styles Starts */

.clearfix:after
{
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}
.clearfix
{
    display: inline-block;
}
html[xmlns] .clearfix
{
    display: block;
}
* html .clearfix
{
    height: 1%;
}
a
{
    color: #1c1c48;
    text-decoration: none;
}
a:hover
{
    text-decoration: underline;
    color: #677fa3;
}
.boldLink
{
    font-size: 13px;
    font-weight: bold;
}
h1
{
    font-size: 32px;
}
h2
{
    font-size: 22px;
}
h3
{
    font-size: 18px;
}
h4
{
    font-size: 16px;
}
h5, h6
{
    font-size: 14px;
}
div
{
    font-size: 11px;
}
h1, h2, h3, h4, h5, h6
{
    margin: 0 0 15px 0;
    color: #5c5b5b;
    font-family: "Trebuchet MS";
    font-weight: normal;
}
img
{
    border: none;
}
.clear
{
    clear: both;
}
.floatleft
{
    float: left;
}
.floatright
{
    float: right;
}
.center
{
    text-align: center;
}
.text-left
{
    text-align: left;
}
.text-right
{
    text-align: right;
}
.normal, .normal a
{
    font-weight: normal;
}
.textbold
{
    font-weight: bold;
}
#container .nomargin, .nomargin
{
    margin: 0;
}
#container.nobg, .nobg
{
    background: none;
}
h1
{
    font-size: 32px;
}
h2
{
    font-size: 22px;
}
h3
{
    font-size: 18px;
}
h4
{
    font-size: 16px;
    color: #343699;
    font-weight: bold;
}
h5, h6
{
    font-size: 14px;
    font-weight: bold;
}

/* Genric Styles Ends */