/* css styles for phplist.com by Bevan bevan@tincan.co.uk

***** colors *****
#FC9807 phplist orange
#7E7F84 phlist grey
#bbb    alternate to phplist grey ('AUDIENCE')
#eee    light grey background (body and head)
#F5F5F5 lighter background (bars)
#fff    white (middle/content background)
#ccc    medium grey background (borders)

*******************************
********* global tags *********
*******************************/

body, td, th { font: small Arial,Helvetica,Verdana,sans-serif; color: #333; margin: 0px; text-align:justify; }
body, th { background: #eee; }
a:link, a:visited { color: #FC9807; text-decoration: none; font-weight: bold; padding: 2px 2px; }
a:link:hover, a:link:active, a:visited:hover, a:visited:active { background: #FC9807; color: #fff; }
table, td, th { border-spacing: 0px; border-collapse: collapse; margin: 0px; padding: 0px; vertical-align: top; text-align: left; font-size: 1em; }
hr { width: 80%; height: 0px; border-top: 2px solid #FC9807; }
#pageContent #maintext h1 {margin-bottom:-5px !important;}

/**** images and images with links ****/
img, img.noBorder, .noBorder img, a img.noBorder, a .noBorder img, a:link img.noBorder, a:link .noBorder img, a:visited img.noBorder, a:visited .noBorder img { border: 0px; }
a img, a:link img, a:visited img { border: 2px solid #fff; }
a:hover img, a:active img { border-color: #FC9807; }
a.nobg, .nobg a, a.nobg:link, .nobg a:link, a.nobg:visited, .nobg a:visited, a.nobg:hover, .nobg a:hover, a.nobg:active, .nobg a:active { background: transparent; color: #FC9807; padding: 0em; }

/********************************
******** Template styles ********
********************************/

/**** miscellaneous styles ****/
#pageContainer { background: #fff; margin-bottom: 1.5em; width: 960px; border-right: 1px solid #ccc}

/* makes 'fixed'-width, centered template: *
body { background: #fbfbfb; }
#pageContainer { border: 1px solid #777; margin: 1.5em 10%; }
/* remove padding and margins of lists */
#pageNavbar, #pageNavbar ul, #pageNavbar li, .submenu, .submenu ul, .submenu li, .pageSidebarItem ul.list, .pageSidebarItem ul.list li { padding: 0em; margin: 0em; }
/* bars */
#pageNavbar ul, #pageFooterContent { border: 1px #ccc; border-style: solid none; }
/* inactive menu item menu colors */
.submenu a, .submenu a:link, .submenu a:visited, #pageNavbar a, #pageNavbar a:link, #pageNavbar a:visited { background: #F5F5F5; color: #7E7F84; text-transform: lowercase; }
/*active menu item colors */
.submenu a:hover, .submenu a:active, #pageNavbar a:hover, #pageNavbar a:active { background: #FC9807; color: #FFF; }

/**** header ****/
#pageHead { padding: 1em 1em 0em; background: #eee; clear: both; height: 78px; }
a#plLogo { float: left; }
/* Slogan styles */
.plSlogan { float: right; font-weight: bold; font-size: 16px; line-height: 125%; margin: 8px; }
.sloganCreate, .sloganCapture, .sloganMaintain { float: left; text-transform: lowercase; }
.sloganAudience { clear: both; text-transform: uppercase; font-size: 208%; color: #bbb; }
.sloganCreate, .sloganMaintain { color: #FC9807; }
.sloganCapture { color: #7E7F84; }
/* primary navigation menu */
#pageNavbar { background: #fff url("https://www.phplist.com/images/shadow-top.png") repeat-x bottom; padding-bottom: 10px; clear:both; }
#pageNavbar ul { background: #F5F5F5; height: 35px; list-style-type: none; padding: 0em 1em; }
#pageNavbar li { float: none; }
#pageNavbar li.first a { border-left: 1px solid #ccc; }
#pageNavbar a, #pageNavbar a:link, #pageNavbar a:visited { display: block; float: left; border-right: 1px solid #ccc; padding: 0.3em 1em; text-transform: uppercase; font-size: larger; height: 25px; line-height: 25px; }

#pageHead .bannerAd a {display: block; width: 312px; float: left; margin: -5px 0 0 160px;}
#pageHead .bannerAd a img, #pageHead .bannerAd a:hover {border: none !important; background: none !important}

/**** middle of page ****/
#pageMiddle { background: #fff; }
#pageMiddleTop { clear: both; }
/* page functions larger cmaller print email etc.*/
#pageFunctions { float: right; margin-right: 2em; padding-top: 0.5em; }
#pageFunctions a { padding: 0em 0.1em; }
/* pathway */
#pathway { font-weight: bold; margin: 0.5em 1em; float: left; text-transform: lowercase; }
/* sidebar, sidebar items and testimonial */
#pageSidebarLeft { float: left; margin: 0em 1em 1em; clear: left; display: inline;}
.pageSidebarItem, #testimonial { width: 150px; margin: 1em 0em; }
.pageSidebarItem h3 {/*border-bottom: 14px solid #fff*/padding:17px 0 0 20px;}
.pageSidebarItemHead, .testimonialHead { background: url(https://www.phplist.com/images/box-top.png) no-repeat top left; padding-top: 8px; }
.pageSidebarItemFoot, .testimonialFoot { background: url(https://www.phplist.com/images/box-bottom.png) no-repeat bottom left; padding-bottom: 8px; }
.pageSidebarItemFootFir, .pageSidebarItemHeadFir {padding-top: 8px;}
.pageSidebarItemContent, .pageSidebarItemFoot .leaflist, .testimonialContent { border: 1px #ccc; border-style: none solid; background: #F5F5F5; padding-left: 10px; }
.pageSidebarItemContentFir {padding-left: 10px; }
/*#opensource {}*/
.opensourcebox a:link, .opensourcebox a:active { background:#fff; color:#fff; }
.opensourcebox { border:0;  padding-left: 10px;  }
/* submenu */
.submenu ul { list-style-type: none; }
.submenu li { width: 148px; display: inline; }
.submenu li.text { width: 134px; padding: 3px; }
.submenu a, .submenu a:link, .submenu a:visited, .submenu li.text { display: block; margin-left: 8px; border-bottom: 1px solid #ccc; text-align: left }
.submenu a, .submenu a:link, .submenu a:visited { padding: 0.3em 0.2em 0.3em 0.5em; text-transform: capitalize !important }
.submenu li.first a, .submenu li.first.text { border-top: 1px solid #ccc; }
/* testimonials */
#testimonial { width: 300px; float: right; margin-left: 1em; clear: right; }
.testimonialHead { background-image: url("https://www.phplist.com/images/wide-box-top.png"); }
.testimonialFoot { background-image: url("https://www.phplist.com/images/wide-box-bottom.png"); }
.testimonialContent { padding-right: 10px; }
.testimonialContent h4 { margin: 0px; padding: 0px; font-size: 1em; }
/* content */
#pageContent { padding: 1em; display: inline; float:left; width: 74%; }
#pageContent ul { padding: 0em 0em 0em 3em; margin: 0em; }
#pageContent li { padding: 0px; margin: 4px 0px; }
/* blog */
#blog { margin-top: 2em; }
.blog-title { border: 1px solid #ccc; background: #F5F5F5; padding: 0.5em; }
.blog-title h2 { display: inline; font-size: 1.1em; margin: 0em; padding: 0em; }
.blog-intro { margin: 1em 1em 1em 3em; }
/**** footer of page ****/
#pageFooter { background: #eee ; padding-top: 10px; clear:both; }
#pageFooterContent { background: #F5F5F5; text-align: right; text-transform: lowercase; font-weight: bold; font-size: smaller; padding: 0.5em 2em;  }
#footerads { float: left; text-align: left; text-transform: lowercase; font-weight: bold; font-size: smaller; padding: 0 0 0 0; display: inline;}
#footerads p { display: inline; }
#pageFootSpacer { font-size: xx-small; height: 1px; }

/*********** content tags ********/
hr.spacer { background: none transparent; border: 0px none transparent; height: 2px; padding: 0.5em; color: transparent; }
.block { display: block; }
.inline { display: inline; }
.clear { clear: both; }
.left { float: left; }
.right { float: right; }
.txtcenter { text-align: center; }
.txtmiddle { text-align: center; vertical-align: middle; }
.txtright { text-align: right; }
.txttop { vertical-align: top; }
.txtbottom { vertical-align: bottom; }
.txtleft { text-align: left; }
.smaller { font-size: smaller; }
.larger { font-size: larger; }
.small { font-size: small; }
.large { font-size: large; }
.important { font-size: larger; font-weight: bold; }
.box, .fullwidthbox { border: 2px solid #FC9807; background-color: #FFFAE8; padding: 1em; }
.fullwidthbox { margin: 1em 10%; padding: 1em; }

/********** form html *********/
input:focus, select:focus, textarea:focus { border: 2px solid #FC9807; background-color: #FFFAE8; padding:4px;}

.errormsg, .error { border: 2px solid #FC9807; background-color: #FFFAE8; padding:4px; float: left; width: 365px; margin: 10px 0; }
.error p {padding: 0; margin: 0; font-weight: bold}
.error ol {float: left; clear: both; padding: 0 0 0 25px; margin: 0}

.requiredmsg {float:none !important}

#form {display: block; float: left; margin: 0 0 20px 0}
#form p{display: block; float: left; width: 625px; clear: left; padding: 0; margin: 0.4em 0}
#form p span.required {color: red; }
#form fieldset {margin: 0; padding: 0; border: 0; float: left; width: 100%}
#form label {display: block; font-weight: bold; float: left; width: 120px; text-transform: capitalize; text-align: left}
#form input.inputitem {border: 1px solid #000; padding: 2px; width: 250px; float: left; margin: 0 5px 0 0}
#form textarea {border: 1px solid #000; padding: 2px; width: 250px; float: left; margin: 0 5px 0 0}
#form select {border: 1px solid #000; padding: 2px; width: 255px; float: left; margin: 0 5px 0 0}
#form p span.explain {float: left}
#form p span.black {color: #000}
#form h3 {float:left;margin:0;padding:0.4em 0;width:100%;}
/*
#form h4 {margin: 10px 0 0 0; padding: 10px 0 0 0; float: left; border-top: 1px solid; width: 375px}
*/
#submit {float: left; border: 10px solid green; }
/*#form a.formsubmit {float: left; border: 1px solid; background: #fc9807; color: #fff !important; padding: 5px 8px !important; text-transform: uppercase; border: 10px solid green;}*/
#attribute12 {float:none !important;margin:0 -3px !important;width:98px !important;}
.url {margin-right:3px }
#form #foreignkey {float:none !important;margin:0 -2px 0 !important;padding:0 !important;width:101px !important;}

/********** rack-info *********/
#rack-info {display: block; float: left; width: 760px; border-top: 1px solid #ccc; margin:5px 0 0;}
#rack-info .wp_info {display: block; float: left; width: 310px}
#rack-info .tc_info {display: block;float: left; width: 295px;}
#rack-info .terms_info {display: block;float: left; clear: both}

/********** pricing *********/
#pricing {width: 100%; background: #f2f2f2; margin:1.2em 0 0;float: left; }
#pricing td {padding: 5px 10px; border-bottom: 1px solid #fff; border-right: 1px solid #fff; font-weight: bold}
#pricing th {padding: 5px 10px; background: #f2f2f2; border-bottom: 1px solid #fff; border-right: 1px solid #fff; font-weight: bold}
#pricing th.trial {background: #eee}
#pricing th.paid {background: #ddd;}
#pricing td.trial {background: #eee; font-weight: normal}
#pricing td.paid {background: #ddd; font-weight: normal}
#pricing .signup {padding:10px}
#pricing .signup a {background: #d9242b; color: #fff; border:2px solid #fff; padding: 0.3em 0.8em; text-transform: uppercase; -moz-border-radius: 10px;-webkit-border-radius:10px; text-shadow:1px 1px 2px #000000;}
#pricing .signup a:hover {background: #fc9807}

#pageContent a.signup_phph {background: #d9242b; color: #fff; border:2px solid #fff; padding: 0.3em 0.8em; text-transform: uppercase; -moz-border-radius: 10px;-webkit-border-radius:10px; text-shadow:1px 1px 2px #000000;}
#pageContent a.signup_phph:hover {background: #fc9807}

/********** loginLink *********/
#loginLink {background: #fc9807; -moz-border-radius: 10px;-webkit-border-radius:10px; padding: 10px 0 10px 5px}
#loginLink li {list-style: none;}
#loginLink li a {color: #fff; width: 135px; display: block; padding: 5px 0 5px 10px; border-bottom: 1px solid #fff}
#loginLink li a:hover {background: #fff; color: #fc9807}

#pageContent h2.yourInstall a {background: #fc9807; color: #fff; padding: 0.1em 0.3em}
#pageContent h2.yourInstall a:hover {background: green; }
#pageContent #activate a {background: green; color: #fff; text-transform: uppercase; padding: 1em; margin: 10px 0; float: left; -moz-border-radius: 10px;-webkit-border-radius:10px}
#pageContent #activate a:hover {background: #fc9807}
#form input.activate_button {background: green; border: 1px solid green; color: #fff; text-transform: uppercase; padding: 1em; margin: 0; float: left; -moz-border-radius: 10px;-webkit-border-radius:10px}
#form input.activate_button:hover {background: #fc9807; border: 1px solid #fc9807; cursor: pointer}

/* fix for the 'Jump to...' select options in the forums */
#pageFunctions select:focus { border: 1px solid #FC9807 !important;}

/* monthly payments table */

#monthlyPayments {width: 100%; background: #f2f2f2; margin:1.2em 0 0;float: left; }
#monthlyPayments td {padding:10px 0 10px 10px; border-bottom: 1px solid #fff; border-right: 1px solid #fff; font-weight: bold}
#monthlyPayments th {background:none repeat scroll 0 0 #F2F2F2;border-bottom:1px solid #FFFFFF;border-right:1px solid #FFFFFF;font-size:16px;min-width:155px;padding:10px;}

#monthlyPayments td select {border:1px solid #000000;float:left;margin:-4px 5px -5px 0;padding:2px;width:255px;}

#monthlyPayments td input {margin:0 5px 0 0; padding: 0}
#monthlyPayments .options {background: #ddd}

#activate { float: left; margin: 1.2em 0 0 0}

#costpermessage {display: none; padding:15px 10px; float: left;background: #fc9807; text-transform: uppercase; 0; color: #fff; font-weight: bold; width: 376px}
#paymentSummary {display: none; float: left; margin:0.4em 0;}

#paymentSummary li {list-style: circle; margin: 0 0 0 15px}
#paymentSummary li a {color: #fff; display: block; padding: 5px 0 5px 10px; border-bottom: 1px solid #fff}
#paymentSummary li a:hover {background: #fff; color: #fc9807}

h3.paymentHeader {padding: 0 !important; margin: 1em 0 -5px 0 !important}
