﻿/* Elements and Specifics */
fieldset {padding: 10px;}
legend {color: #006AAA;margin-left: 10px;}
a {color: #4488bb;}	
a:hover {color: #6cb8ff;}	
#footer a {color: #6cb8ff;}	
#footer a:hover {color: #99CEFF;}	
#header a {color: #fff;text-decoration:none;}	
#header a:hover {text-decoration:underline;color: #FF9C00 !important;}	
#header, #header input {font-size: 12pt;}
#header span {color:#fff;padding-right:75px;font-size:14pt;}
p {margin-bottom: 15px;}
td {vertical-align:top;}
h1, h2, h3, h4, h5, h6 {padding-bottom:10px;}
h1 {font-size:14pt;text-decoration:underline;}
h2 {font-size:12pt;}

/* Top Menu */
ul#topmenu { list-style:none; margin-top:10px; }
ul#topmenu li { float:left;text-align:center;margin:0;list-style:none;padding:0;font-size:14px; }
ul#topmenu li a { text-decoration:none;padding:5px 10px;float:left;color:#fff; }
ul#topmenu li a:hover {color:#6cb8ff;}
   
/* Forms */
.formpair {margin-bottom: 5px}
.formpair label {width: 10em;float: left;text-align: right;margin-right: 1em;display: block}

/* Generic Layout Classes */
.fullWidth {width: 100%;}
.alignCenter {margin: 0 auto; text-align: center;}
.alignRight {text-align:right;}
.smallMarginTop {margin-top: 10px;}
.smallMarginBottom {margin-bottom: 10px;}
.smallMarginRight {margin-right: 10px;}
.smallMarginLeft {margin-left: 10px;}
.smallPaddingRight {padding-right: 10px;}
.smallPaddingTop {padding-top: 10px;}
.smallPaddingBottom {padding-bottom: 10px;}
.smallPaddingLeft {padding-left: 10px;}
.smallTextBox {width: 100px;}
.smallDropDownList {width: 100px;}
.mediumMarginTop {margin-top: 20px;}
.mediumMarginBottom {margin-bottom: 20px;}
.mediumMarginRight {margin-right: 20px;}
.mediumPaddingTop {padding-top: 20px;}
.mediumPaddingBottom {padding-bottom: 20px;}
.mediumPaddingLeft {padding-left: 20px;}
.mediumPaddingRight {padding-right: 20px;}
.largeMarginRight {margin-right: 40px;}
.largePaddingTop {padding-top: 40px;}
.largePaddingLeft {padding-left: 40px;}
.largePaddingRight {padding-right: 40px;}
.largeTextBox {width: 300px;}
.floatRight {float: right;}
.floatLeft {float: left;}

/* Generic Style Classes */
.borderless {border: 0 !important;}
.block {display:block;}
.errorText {color: Red;}
.confirmText {color: Green;}
.boldText {font-weight: bold;}
.italicText {font-style:italic;}
.emphasis {font-weight: bold;text-decoration:underline;}
.defaultButton {border: outset 2px #6cb8ff;background-color:#fff;color: #666;}
.cancelButton {border: outset 2px #000;background-color:Red;color: #fff;}
.gridView {width: 100%;font-size:0.8em;}
.gridView th a {color:#fff;}
.gridViewHeader {background-color:#62A40F;color:#fff;}
.gridViewRow {background-color:#EDF4FF;}
.gridViewRowAlternate {background-color:#fff;}
.imageFloatedLeft {margin: 0 10px 10px 0;border: 1px solid #666;padding: 2px;}
.imageFloatedRight {margin: 0 0 10px 10px;border: 1px solid #666;padding: 2px;}
.unstyledlist {list-style-type: none;}
.smallprint {font-size:80%;}
.infoError {background-color: #ffffd9;background-image: url('http://cms.mdssolutions.co.uk/images/error.png');background-repeat: no-repeat;background-position:left center;padding: 0.4em 0.4em 0.4em 40px;margin: 1em 0 1em 0;border: solid 1px #a7a772;}
.infoWarning {background-color: #ffffd9;background-image: url('http://cms.mdssolutions.co.uk/images/warning.gif');background-repeat: no-repeat;background-position:left center;padding: 0.4em 0.4em 0.4em 40px;margin: 1em 0 1em 0;border: solid 1px #a7a772;}
.infoInformation {background-color: #ffffd9;background-image: url('http://cms.mdssolutions.co.uk/images/information.png');background-repeat: no-repeat;background-position:left center;padding: 0.4em 0.4em 0.4em 40px;margin: 1em 0 1em 0;border: solid 1px #a7a772;}

/* Clearfix methods*/
.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}
.clearfix {display: inline-block;}
* html .clearfix {height: 1%;} /* Hides from IE-mac \*/
.clearfix {display: block;} /* End hide from IE-mac */

/* Main Layout */
* {padding:0;margin:0;}
body {background-image:url('../images/bgsmall.jpg');background-repeat:repeat-x;font-family:"Trebuchet MS", Verdana, Helvetica, Arial;font-size:14px;background-color:#fff;color:#000;}
#header {margin-bottom:20px;}
#headertop {height:66px;padding-top:5px;}
#container, #footer {width:1000px;margin:0 auto;}
#footercontainer {background-color:#000;color:#fff;min-height:225px;padding:10px 0;border-top:solid 3px #6cb8ff;width:100%;margin-top:20px;}
#footerlinks, #footerother, #footernewsletter, #footerfeedback {width:230px;padding:10px;float:left;}
#footerlinks h4, #footerother h4, #footernewsletter h4, #footerfeedback h4 {padding-bottom:3px;margin-bottom:10px;}
#footer ul {list-style-type:none;padding-left:10px;}  
#footer ul a {color:#fff;text-decoration:none;}  
#skiptomain {display:none;}

/* Application Specific */
#mdsintro {width:930px;margin:0 auto;}
.homepagesection {height:300px;width:320px;margin:0 10px 20px 0;float:left;}
.homepagesection p {color:#317DC4;font-size:14pt;}
.homepagesection ul {margin-left:25px;}
.homepagesection h2 {height:43px;line-height:43px;padding-left:53px;font-size:18pt;background-repeat:no-repeat;}
#homepageA h2 {background-image:url('../images/icon_info.png');}
#homepageB h2 {background-image:url('../images/icon_tick.png');}
#homepageC h2 {background-image:url('../images/icon_down.png');}
.homeSection {height:320px;width:220px;float:left;border:1px solid #eee;margin:0 35px 20px 0;}
.homeSection h2 {color:#fff;background-color:#000;padding:5px;text-align:center;}
.homeSection p {padding:10px 5px 5px 5px;text-align:justify;margin-bottom:0;}
.last {margin-right:0 !important;}
.homeSection ul {padding:5px 5px 5px 10px;}
.homeSection ul li {list-style-position:inside;}
#freequote {width:300px;text-align:center;padding-top:15px;}
#freequote a:hover {text-decoration:none;}
#intro {position:relative;width:995px;height:350px;background-image:url('../images/hometopintro.jpg');background-repeat:no-repeat;padding-bottom:20px;}
#introsignup {position:absolute;top:270px;left:800px;}
.homebox {width:298px;height:320px;float:left;padding-right:21px;margin:10px 21px 0 0;border-right:solid 1px #eee;text-align:justify;font-size:10pt;}
.homebox h3 {margin:10px 0;dont-size:16pt;}
.homebox ul {margin:0 0 15px 5px;list-style-position:inside;}
.homeboxlast {margin-right:0 !important;padding-right:0 !important;border:0 !important}
.homeboxupdates {width:450px;min-height:430px;}
.homeboxupdates ul {padding-left:20px;}
.homeboxupdates ul li {list-style-type:none;}
#homefeatures {font-size:0.9em;}
.packagetitle {margin-bottom:5px;display:inline-block;}
#homeapproach h4 {font-size:14pt;}
.approachstage {float:left;width:205px;height:545px;background-color:#fff;border:solid 1px #6cb8ff;margin-right:20px;padding:10px;text-align:justify;}
#laststage {margin-right:0;}
#boxBlogs {float:left;padding:10px;border:solid 1px #CBCCFF;background-color:#F1F1FF;min-height:840px;background-image:url('../images/largerss.png');background-position:right bottom;background-repeat:no-repeat;}
#boxBlogs h5 {background-image:url('../images/rss_icon.png');background-position:left center;background-repeat:no-repeat;height:50px;line-height:50px;margin-bottom:15px;text-align:center;font-size:14pt;}
#boxTwitter {float:right;padding:10px;border:solid 1px #C2EAC2;background-color:#F1FFF1;min-height:840px;background-image:url('../images/twitterbird.png');background-position:right bottom;background-repeat:no-repeat;}
#boxTwitter ul {padding-left:0;}
#boxTwitter li {padding-bottom:10px;}
#boxTwitter h5 {background-image:url('../images/twitter_logo.png');background-position:left center;background-repeat:no-repeat;height:50px;line-height:50px;margin-bottom:15px;text-align:center;font-size:14pt;}
.portfolioitem {width:175px;height:175px;padding:10px;float:left;margin:5px auto;text-align:center;}
.portfolioitem a {margin:0 auto;text-align:center;}
.prev {float:left;width:100px;height:32px;background-image:url('../images/previous.jpg');background-repeat:no-repeat;color:#454545;cursor:pointer;text-indent: -1500px;margin:20px 0;}
.next {float:right;width:100px;height:32px;background-image:url('../images/next.jpg');background-repeat:no-repeat;color:#454545;cursor:pointer;text-indent: -1500px;margin:20px 0;}
.seperator {margin-bottom: 20px;padding-bottom: 20px;border-bottom: dotted 1px #000;}
#companylogo {padding-top: 10px;margin-left: 10px;}
#contactlist {list-style-type: none;}
#featuredsite {margin:0 0 0 25px;}
#websitebuilder {margin:0 0 0 40px;}
#tblAccessKeys {width: 100%; font-size: 95%;}
#tblAccessKeys th, #tblAccessKeys td {text-align: left;padding-right: 10px;}
#packages {margin:0 auto;width:1000px;}
#packagefeatures input[type='radio'] {float:right;}
.packageset {float:left;width:228px;padding:10px;}
.packageset ul li {list-style-position:inside;list-style-type:square;padding:5px 0 5px 5px;}
#packagelist {margin-top:10px;}
#packagelist th {width:160px;padding:10px 0;border-right:1px solid #eee;border-bottom:1px solid #eee;font-size:14pt;vertical-align:top;}
#packagelist td {text-align:center;padding:5px;border-right:1px solid #eee;}
.packagehover {background-color:#6cb8ff;}
ul.feature li {font-size:10pt;cursor:help;}
.featurename {cursor:help;text-align:right !important;padding-right:20px !important;}
.featurehover {background-color:#eee;}
#hostingdetails {margin:0 auto;background-color:#fff;color:#000;}
#hostingpackages .feature {padding-right:20px;cursor:pointer;}
#hostingpackages .bronze {background-color:#d29300;color:#fff;text-align:center;padding:1px 4px;width:6em;}
#hostingpackages .silver {background-color:#b7b7b7;color:#fff;text-align:center;padding:1px 4px;width:6em;}
#hostingpackages .gold {background-color:#ceb614;color:#fff;text-align:center;padding:1px 4px;width:6em;}
#hostingpackages .platinum {background-color:#d4d4d4;color:#fff;text-align:center;padding:1px 4px;width:6em;}
#hostingpackages .price {padding-top:20px;}
.purchase {width:800px;margin:0 auto;}
.buypackage {border:0;width:700px;min-height:800px;}
price {vertical-align:top;color:green;}
.oldprice {font-weight:bold;text-decoration:line-through;vertical-align:top;}
#roadmap {width:100%;color:#000080;}
#roadmap td {padding:5px;border: solid 1px #15478c;}
.roadmapheader {background-color: #e0e7ef;font-weight:bold;color:#000;}
.roadmapplanned {color:#007F46;}
#wbscreenshots {width:700px;padding:20px 0 0 20px;}
#wbscreenshots img {border: solid 1px #6cb8ff; margin: 2px; padding: 2px; background-color: #6cb8ff;}
.testimonial {padding-bottom:40px;}
.testimonial span {font-style:italic;}
#contactform {width:700px;margin:0 auto;}
.Offline {color:#f00;}
.Online {color:#0f0;}
.publishDate {color:#bbb;}
.seo_title {display:none;}
#serviceslist {width:900px;margin:0 auto;}
#serviceslist li {width:275px;float:left;}
.webdesignfeature div {float:left;width:475px;padding:10px;min-height:150px;}
#websitedesignintro p {background-color:#f7f7f7;border-top:1px solid #ccc;border-bottom:1px solid #ccc;padding:10px;}
.pricebreakdown th, .pricebreakdown td {padding:5px;text-align:left;}


/* Floating tooltips */
#tooltip {position: absolute;z-index: 3000;padding:5px;font-size:1em;color:#000;}
#tooltip h3, #tooltip div {margin: 0;width:500px;}
#tooltip h3 {color:#4488bb;}
#tooltip.pretty {border: none;width: 500px;background-color:#fcfcfc;border: solid 2px #ddd;}
#tooltip.pretty h3 {margin-bottom: 0.25em;width: 500px;text-align: center;text-decoration:underline;}
#tooltip.pretty div { width: 500px; text-align:left;}

#TownList {display:block;padding:15px;}
.TownListTitle {clear:both;}
a.TownLink{display:block;width:170px;background-image:url('../images/tick.png');background-repeat:no-repeat;background-position:left center;padding-left:20px;}
.Letter {font-size:22px;font-weight:bold;padding:10px 0px;display:block;clear:both;}


/*---------- left aligned button ----------*/
.btn { display: block; position: relative; background: #aaa; padding: 5px; margin: 0px; float: left; color: #fff; text-decoration: none; cursor: pointer; }
.btn * { font-style: normal; background-image: url('../images/btn2.png'); background-repeat: no-repeat; display: block; position: relative; }
.btn i { background-position: top left; position: absolute; margin-bottom: -5px;  top: 0; left: 0; width: 5px; height: 5px; }
.btn span { background-position: bottom left; left: -5px; padding: 0 0 5px 10px; margin-bottom: -5px; }
.btn span i { background-position: bottom right; margin-bottom: 0; position: absolute; left: 100%; width: 10px; height: 100%; top: 0; }
.btn span span { background-position: top right; position: absolute; right: -10px; margin-left: 10px; top: -5px; height: 0; }

* html .btn span,
* html .btn i { float: left; width: auto; background-image: none; cursor: pointer; }

.btn.blue { background: #2ae; }
.btn.green { background: #9d4; }
.btn.lime { background: #bbce00; }
.btn.pink { background: #e1a; }
.btn:hover { background-color: #000; color: #fff; }
.btn:active { background-color: #444; color: #fff; }
.btn[class] {  background-image: url('../images/btn.png'); background-position: bottom; }

* html .btn { border: 3px double #aaa; }
* html .btn.blue { border-color: #2ae; }
* html .btn.green { border-color: #9d4; }
* html .btn.lime { border-color: #bbce00; }
* html .btn.pink { border-color: #e1a; }
* html .btn:hover { border-color: #a00; }

/*---------- centered button ----------*/
.btnC { display: block; position: relative; background: #aaa; padding: 5px; width: 140px; margin: 0px auto; color: #fff; text-decoration: none; cursor: pointer; text-align: center; }
.btnC * { font-style: normal; background-image: url('../images/btn2.png'); background-repeat: no-repeat; display: block; position: relative; }
.btnC i { background-position: top left; position: absolute; margin-bottom: -5px;  top: 0; left: 0; width: 5px; height: 5px; }
.btnC span { background-position: bottom left; left: -5px; padding: 0 0 5px 10px; margin-bottom: -5px; }
.btnC span i { background-position: bottom right; margin-bottom: 0; position: absolute; left: 100%; width: 10px; height: 100%; top: 0; }
.btnC span span { background-position: top right; position: absolute; right: -10px; margin-left: 10px; top: -5px; height: 0; }

* html .btnC span,
* html .btnC i { width: 120px; text-align: center; padding: 0px; display: block; margin: 0px auto; background-image: none; cursor: pointer; }

.btnC.blue { background: #2ae; }
.btnC.green { background: #9d4; }
.btnC.lime { background: #bbce00; }
.btnC.pink { background: #e1a; }
.btnC:hover { background-color: #000; color: #fff; }
.btnC:active { background-color: #444; color: #fff; }
.btnC[class] {  background-image: url('../images/btn.png'); background-position: bottom; }

* html .btnC { border: 3px double #aaa; }
* html .btnC.blue { border-color: #2ae; }
* html .btnC.green { border-color: #9d4; }
* html .btnC.lime { border-color: #bbce00; }
* html .btnC.pink { border-color: #e1a; }
* html .btnC:hover { border-color: #a00; }

/*---------- centered button ----------*/
.btnC2 { display: block; position: relative; background: #aaa; padding: 5px; margin: 0px auto; min-width: 100px; max-width: 490px; color: #fff; text-decoration: none; cursor: pointer; text-align: center; }
.btnC2 * { font-style: normal; background-image: url('../images/btn2.png'); background-repeat: no-repeat; display: block; position: relative; text-align: center; }
.btnC2 i { background-position: top left; position: absolute; margin-bottom: -5px;  top: 0; left: 0; width: 5px; height: 5px; }
.btnC2 span { background-position: bottom left; left: -5px; padding: 0 0 5px 10px; margin-bottom: -5px; }
.btnC2 span i { background-position: bottom right; margin-bottom: 0; position: absolute; left: 100%; width: 10px; height: 100%; top: 0; }
.btnC2 span span { background-position: top right; position: absolute; right: -10px; margin-left: 10px; top: -5px; height: 0; }

* html .btnC2 span,
* html .btnC2 i { width: auto; text-align: center; padding: 0px; margin: 0px auto; background-image: none; cursor: pointer; }

.btnC2.blue { background: #2ae; }
.btnC2.green { background: #9d4; }
.btnC2.lime { background: #bbce00; }
.btnC2.pink { background: #e1a; }
.btnC2:hover { background-color: #a00; color: #fff; }
.btnC2:active { background-color: #444; color: #fff; }
.btnC2[class] {  background-image: url('../images/btn.png'); background-position: bottom; }

* html .btnC2 { border: 3px double #aaa; }
* html .btnC2.blue { border-color: #2ae; }
* html .btnC2.green { border-color: #9d4; }
* html .btnC2.lime { border-color: #bbce00; }
* html .btnC2.pink { border-color: #e1a; }
* html .btnC2:hover { border-color: #a00; }

/*---------- right aligned button ----------*/
.btnR { display: block; position: relative; background: #aaa; padding: 5px; float: right; color: #fff; text-decoration: none; cursor: pointer; }
.btnR * { font-style: normal; background-image: url('../images/btn2.png'); background-repeat: no-repeat; display: block; position: relative; }
.btnR i { background-position: top left; position: absolute; margin-bottom: -5px;  top: 0; left: 0; width: 5px; height: 5px; }
.btnR span { background-position: bottom left; left: -5px; padding: 0 0 5px 10px; margin-bottom: -5px; }
.btnR span i { background-position: bottom right; margin-bottom: 0; position: absolute; left: 100%; width: 10px; height: 100%; top: 0; }
.btnR span span { background-position: top right; position: absolute; right: -10px; margin-left: 10px; top: -5px; height: 0; }

* html .btnR span,
* html .btnR i { float: right; width: auto; background-image: none; cursor: pointer; }

.btnR.blue { background: #2ae; }
.btnR.green { background: #9d4; }
.btnR.lime { background: #bbce00; }
.btnR.pink { background: #e1a; }
.btnR:hover { background-color: #000; color: #fff; }
.btnR:active { background-color: #444; color: #fff; }
.btnR[class] {  background-image: url('../images/btn.png'); background-position: bottom; }

* html .btnR { border: 3px double #aaa; }
* html .btnR.blue { border-color: #2ae; }
* html .btnR.green { border-color: #9d4; }
* html .btnR.lime { border-color: #bbce00; }
* html .btnR.pink { border-color: #e1a; }
* html .btnR:hover { border-color: #000; }s
