/* YUI Reset */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var,optgroup{font-style:inherit;font-weight:inherit;}del,ins{text-decoration:none;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:baseline;}sub{vertical-align:baseline;}legend{color:#000;}input,button,textarea,select,optgroup,option{font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;}input,button,textarea,select{*font-size:100%;}

/* Defining styles here on */
html, body {
    background: #fafdff url(img/bk_clouds.jpg) top repeat-x fixed;
    color: #565656;
    font: 13.5px/23px Georgia,'Times New Roman',Times,serif;
    min-height: 100%;
}

h1{font-size:138.5%;}
h2{font-size:123.1%;}
h3{font-size:108%;}
h1,h2,h3{margin:1em 0;}
h1,h2,h3,h4,h5,h6,strong,dt{font-weight:bold;}
optgroup{font-weight:normal;}
abbr,acronym{border-bottom:1px dotted #000;cursor:help;}
em{font-style:italic;}
del{text-decoration:line-through;}
caption{margin-bottom:.5em;text-align:center;}
sup{vertical-align:super;}
sub{vertical-align:sub;}
p,fieldset,table,pre{margin-bottom:1em;}

button,
input[type="checkbox"],
input[type="radio"],
input[type="reset"],
input[type="submit"] {
    padding:1px;
}

h4 {
    color: #ed1c24;
}
a, a:visited {
    color: #ed1c24;
    text-decoration: none;
}
a:hover, a:active {
    color: #0054a6;
}

#logins a:link {
    color: #ffffff;
    text-decoration: none;
}
#logins a:visited {
    color: #ffffff;
    text-decoration: none;
}
#logins a:hover {
    color: #ed1c24;
    text-decoration: none;
}
#logins a:active {
    color: #ed1c24;
    text-decoration: none;
}

#capablePage {
    width: 963px;
    margin: 0 auto;
}
#header {
    height: 140px;
    margin-bottom: 10px;
}
#page-content-container {
    width: 870px;
    margin: auto;
    padding: 0;
}
#page-index #page-content-container {
    width: 963px;
}
#contentLeft {
    float: left;
    width: 590px;
    padding: 12px 6px;
}
#quickLinksRight {
    float: right;
    width: 255px;
}
#logo {
    width: 476px;
    float: left;
    clear: left;
    margin-bottom: 10px;
}
#logins_menuHot {
    float: left;
    clear: right;
    width: 487px;
    margin-bottom: 10px;
}
#logins {
    width: 437px;
    padding: 25px;
    height: 59px;
    font: .92em/normal Arial, Helvetica, sans-serif;
    color: #fff;
    overflow: hidden;
}
#menuHot {
    margin-left: 44px;
    margin-right: 10px
}
#menuHot ul li {
    float: left;
    padding-left: 20px;
}

#menuTop {
    width: 963px;
    background: transparent url(img/menuBK.png) no-repeat;
    padding: 0;
    margin: 0;
    clear: both;
}
#menuTop ul {
    margin-left: 30px;
}
/*setting for the dropdown menu*/
#site-menu-container {
    margin: 0;
    padding: 0;
    position: relative;
    font: 16px/30px arial;
    color: white;
    text-shadow: rgba(0,0,0,.12) -1px -1px 0, rgba(0,0,0,.07) 0 0 1px;
    letter-spacing: normal;
    z-index: 100;
    height: 32px;
    text-transform: lowercase;
}
#site-menu-container > ul > li {
    float: left;
    list-style: none;
    font-weight: bold;
    letter-spacing: 0.10em;
    padding: 0 8px 0 0;
    line-height: 29px;
    height: 27px;
}

#site-menu-container li a,
#site-menu-container li span {
    display: block;
    text-decoration: none;
    white-space: nowrap;
}
#site-menu-container > ul > li > a,
#site-menu-container > ul > li > span {
    color: white;
    height: 27px;
    padding: 0 10px;
}
#site-menu-container > ul > li > a.juvo-state-hover,
#site-menu-container > ul > li > span.juvo-state-hover {
    color: white;
    background: #66bbee;
    cursor: pointer;
}

#site-menu-container li ul li a,
#site-menu-container li ul li span {
    color: #444;
}

#site-menu-container li ul {
    background: -moz-radial-gradient(35% 25%, rgba(230,245,255,.97), rgba(195,225,245,.97));
    background: #e0f0ff;
    text-shadow: rgba(255,255,255,.4) 1px 1px 0;
    font-size: .8em;
    font-weight: normal;
    margin: 0;
    padding: 7px 0;
    position: absolute;
    min-width: 100px;
    z-index: 100;
    top: 28px;
    overflow: hidden;
    border: 1px solid #aaa;
    border-top: none;
    -moz-box-shadow: rgba(0,0,0,.25) 0 1px 6px;
    -webkit-box-shadow: rgba(0,0,0,.25) 0 1px 6px;
    box-shadow: rgba(0,0,0,.25) 0 1px 6px;
    display: none;
    line-height: 1;
    -moz-border-radius: 0 0 5px 5px;
    -webkit-border-radius: 0 0 5px 5px;
    border-radius: 0 0 5px 5px;
}

#site-menu-container li ul li {
    float: none;
    margin: 0;
    padding: 0;
}

#site-menu-container li ul li a,
#site-menu-container li ul li span {
    display: block;
    width: auto;
    margin: 0;
    padding: 5px 12px;
}
#site-menu-container li ul li a:hover,
#site-menu-container li ul li span:hover {
    background: #66bbee;
    background: -moz-linear-gradient(top, #88ccff, #6be);
    color: white;
    text-shadow: rgba(0,0,0,.15) -1px -1px 0, rgba(0,0,0,.07) 0 0 1px;
    cursor: pointer;
}

/*end of setting for the dropdown menu*/

#contentSec {
    background: url(img/contentBK.png) repeat-y top;
    clear: both;
    height: 100%;
    margin: 0px auto;
}
#contentMain {
    height: auto;
    width: 963px;
}

#showCase {
    padding: 0px 5px;
    /* This was never visible due to images within being non-transparent-- removing to reduce page
       load times --jvarner@thejuvogroup
    background: url(img/slides/slideBK.png) top no-repeat;
    */
    position: relative;
    margin-top: 20px;
}
#startTrialButtonContainer {
    display: none;
    position: absolute;
    z-index: 200;
    left: -60px;
    top: -20px;
}
#startTrialButtonContainer img:hover {
    cursor: pointer;
}
#capableBlocks {
    clear: both;
    overflow: hidden;
    width: 863px;
    padding-left: 50px;
    padding-right: 50px;
    font-size: 85%;
    color: #565656;
    letter-spacing: 110%;
}
#box1 {
    float: left;
    background: url(img/box1.png) no-repeat;
    height: 135px;
    padding: 105px 15px 10px 15px;
    width: 230px;
    margin-right: 41px;
    text-align: center;
    line-height: 120%;
}
#box2 {
    float: left;
    background: url(img/box2.png) no-repeat;
    height: 135px;
    padding: 105px 15px 10px 15px;
    width: 230px;
    margin-right: 41px;
    text-align: center;
    line-height: 120%;
}
#box3 {
    float: left;
    background: url(img/box3.png) no-repeat;
    height: 135px;
    padding: 105px 15px 10px 15px;
    width: 230px;
    line-height: 120%;
    text-align: center;
}



/*the following settings are for the old front boxes*/
.block01 {
    float: left;
    background: url(img/experienceBox.png) no-repeat;
    height: 111px;
    padding: 70px 15px 10px 15px;
    width: 230px;
    margin-right: 41px;
    text-align: center;
}
.block02 {
    float: left;
    background: url(img/parentingBox.png) no-repeat;
    height: 111px;
    padding: 70px 15px 10px 15px;
    width: 230px;
    margin-right: 41px;
    text-align: center;
    line-height: 120%;
}
.block03 {
    float: left;
    background: url(img/inspiredBox.png) no-repeat;
    height: 111px;
    padding: 70px 15px 10px 15px;
    width: 230px;
    line-height: 120%;
}

/*settings for general pages*/
#pageTitle {
    padding-top: 1.5em;
    clear: right;
    border-bottom: 1px solid #7fd4f7;
    overflow: hidden;
}
#pageTitle h1 {
    font-size: 1.7em;
    color: #777;
    line-height: 1;
    margin: 0;
    padding: 0;
}
#contentLeft ul {
    margin-left: 20px;
}
#contentLeft ul li {
    background: url(img/listIcon.png) left top no-repeat;
    padding-bottom: 10px;
    padding-left: 25px;
}
#quickLinksRight {
    border-left: 1px solid #7fd4f7;
    font-size: 85%;
    letter-spacing: 110%;
}
#quickLinksRight ul {
    margin: 0;
}
#quickLinksRight ul li {
    background: transparent;
    padding: 0;
}
.QLTitle {
    padding: 5px 0px;
    border-bottom: 1px solid #7fd4f7;
    border-top: 0px solid #7fd4f7;
}
.QL_info {
    padding: 15px;
    color: #656565;
    font-size: 85%;
    line-height: 150%;
}

#followDiv {
    clear: both;
    padding-top: 30px;
    height: 30px;
    width: 840px;
    margin: auto;
}
#followCapables {
    width: 840px;
    padding-left: 20px;
    margin: auto;
    clear: both;
}
#followCapables ul li {
    float: left;
    list-style: none;
}

#footer {
    text-align: center;
    padding-top: 15px;
    clear: both;
    overflow: hidden;
}
#bottomMenus {
    font-size: 80%;
    color: #0054a6;
    text-align: center;
}
#pageEnd {
    background: url(img/pageFooter.png) bottom no-repeat;
    height: 32px;
    margin: 0px auto;
}

/*quickLinksRight ul li {
float: left;
}
*/
#badges {
    width: 245px;
    margin-left: 10px;
    margin-right: 5px;
    margin-bottom: 20px;
}
.badges {
    padding: 10px 5px 10px 0px;
    float: left;
    text-align: center;
    width: 75px; /*font-family:"Century Gothic"; */font-size:80%;
    font-weight: bold;
}

.linkBanner {
    width: 100px;
    padding: 10px 20px 10px 0px;
    vertical-align: top;
}
.linkInfo {
    vertical-align: top;
    padding: 10px 0px 10px 0px;
}

.articleText {
    width: 215px;
    padding-right: 10px;
    padding-bottom: 10px;
    vertical-align: top;
}
.articleList li {
    display: block;
    padding: 5px;
    color: #656565;
    font-size: 85%;
    line-height: 1.3em;
    border-bottom: 1px solid #7fd4f7;
    clear: both;
}
.articleList li img {
    float: left;
    width: 80px;
    height: 80px;
    margin-right: 12px;
    margin-bottom: 12px;
}
.articleList li p {
    margin-bottom: 0px;
}
.articleList li a {
    color: #444;
}
.articleList .article-link-container {
    padding: 6px;
    overflow: hidden;
}
.articleList .article-link-container:hover {
    background: rgb(235, 245, 255);
    background: rgba(230, 240, 250, .5);
    border: 1px solid rgb(225, 235, 245);
    padding: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-box-shadow: rgba(0,0,0,.14) 0px 0px 8px;
    -webkit-box-shadow: rgba(0,0,0,.14) 0px 0px 8px;
    cursor: pointer;
}
#menuHot a {
    display: block;
    height: 31px;
    background-image: url('/img/sprite-31.png');
    background-repeat: no-repeat;
}

#menuHot a.menuItemShop {
    background-position: -800px 0;
    width: 82px;
}
#menuHot a.menuItemShop:hover {
    background-position: -1000px 0;
}
#menuHot a.menuItemParents {
    background-position: -400px 0;
    width: 106px;
}
#menuHot a.menuItemParents:hover {
    background-position: -600px;
}
#menuHot a.menuItemClub {
    background-position: 0px 0;
    width: 185px;
}
#menuHot a.menuItemClub:hover {
    background-position: -200px 0;
}


.mailingListSignup {
    width: 250px;
    margin: auto;
    padding-top: 5px;
    clear: both;
    text-align: center;
    font-size: 12px;
    line-height: 14px;
    color: #fff;
    text-shadow: rgba(0,0,0,.075) 1px 1px 0px, rgba(0,0,0,.075) 0 0 1px;
}
.loginCartPreview {
    width: 320px;
    margin: auto;
    margin-top: -5px;
    overflow: hidden;
    font-size: 12px;
    line-height: 14px;
    color: #fff;
    text-shadow: rgba(0,0,0,.075) 1px 1px 0px, rgba(0,0,0,.075) 0 0 1px;
    -moz-box-shadow: rgba(0,0,0,.02) 0px 0px 8px;
    -webkit-box-shadow: rgba(0,0,0,.02) 0px 0px 8px;
    box-shadow: rgba(0,0,0,.02) 0px 0px 8px;
    padding: 5px;
    background: rgba(255,255,255,.1);
    -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px;
}

.loginCartPreview.loginPreviewNoCart {
    width: 151px;
    float: right;
}
.loginCartPreview.loginPreviewNoCart + .mailingListSignup {
    float: right;
    width: 160px;
}

.loginCartPreview .loginPreview, .loginCartPreview .cartPreview {
    padding: 5px 7px;
}

.loginCartPreview .loginPreview {
    float: left;
    width: 127px;
}
.loginCartPreview .loginPreview {
    font-style: italic;
}
.loginCartPreview .loginPreview a {
    font-style: normal;
}
.loginCartPreview .loginPreview .loggedInLinks {
    font-size: .95em;
}
.loginCartPreview .cartPreview {
    display: block;
    width: 165px;
    float: left;
    overflow: visible;
    -moz-border-radius: 4px;
}
#logins .loginCartPreview .cartPreview:hover {
    background: rgba(255,255,255,.25);
    text-shadow: rgba(0,0,0,.3) 1px 1px 0px;
    color: white;
}
#logins a:hover {
    text-shadow: rgba(255,255,255,.4) 0px 0px 3px;
}
.loginCartPreview .cartPreview img {
    float: left;
    margin-right: 8px;
}
#legalInformation li h4:hover {
    cursor: pointer;
    text-decoration: underline;
}