/*-----------------NAVIGATION-----------------------------*/

#nav li#menu-home a:hover {
    background-position: 0 0 !important /*override the hover effect for this page*/
}

#nav li#menu-aboutus a {
    background-position: -107px 0;
}

#nav li#menu-services a {
    background-position: -213px 0;
}

#nav li#menu-patients a {
    background-position: -319px 0;
}

#nav li#menu-financial a {
    background-position: -425px 0;
}

#nav li#menu-news a {
    background-position: -532px 0;
}

#nav li#menu-contact a {
    background-position: -638px 0;
}

/*-----------------CONTENT-----------------------------*/
#welcomeImages {
    padding: 27px 0 15px;
    float: left;
    width: 100%;
    border-bottom: dotted #bbbbbb 1px;
    margin-bottom: 18px;
}

#welcomeImages a {
    width: 100%;
    text-decoration: none;
    color: inherit;
}

#welcomeImages a:hover {
    text-decoration: none;
    color: inherit;
}

#welcomeImages a:visited {
    text-decoration: none;
    color: inherit;
}

#welcomePic {
    float: left;
    width: 475px;
    background: white;
}

/*top (Welcome) Boxes On homepage (similar to the ones on patients/index.php*/
.welcomeBox {
    float: right;
    width: 251px;
    clear: right;
    cursor: pointer;
    text-decoration: inherit;
    color: inherit;
}

/*top (Welcome) Box rounded corners*/
.rtop, .rbottom {
    display: block
}

.rtop *, .rbottom * {
    display: block;
    height: 1px;
    overflow: hidden
}

.r1 {
    margin: 0 2px;
    background: #bbbbbb;
}

.r2 {
    margin: 0 1px;
    border-left: #bbbbbb 1px solid;
    border-right: #bbbbbb 1px solid;
}

.r2b {
    margin: 0 0;
    border-left: #d6d5d4 1px solid;
    border-right: #d6d5d4 1px solid;
}

.r3 {
    margin: 0 0;
    border-left: #bbbbbb 1px solid;
    border-right: #bbbbbb 1px solid;
}

.r3b {
    margin: 0 0;
    border-left: #d6d5d4 1px solid;
    border-right: #d6d5d4 1px solid;
}

.welcomeBoxContents {
    padding: 11px 25px 0 18px; /* I only put the 25px border on thie right */
    border-left: solid 1px #bbbbbb; /* side so that the text wrap would be the */
    border-right: solid 1px #bbbbbb; /* same as in the psd */
}

.welcomeBoxContents p {
    padding-left: 2px;
    line-height: 145%;
    color: #6f6860;
}

#welcomeBox1 {
    background: transparent url( "../images/welcomeBox1x2.gif" ) no-repeat;
}

#welcomeBox2 {
    margin-top: 6px;
    background: transparent url( "../images/welcomeBox2x2.gif" ) no-repeat;
}

/*for the most part, the buttons are styled in welcomeHoverButtons.css*/
/*except for the following two styles, which position the buttons on the*/
/*homepage slightly differently than the one on the patients page*/
#getStartedButton {
    left: 55px;
}

#currentPatientsButton {
    left: 44px;
}

/*-----------------Bottom Half-----------------------------*/
#leftColumn{
    float:left;
    margin-bottom:30px;
}

a.more{float:right;clear:both;}

#welcomeText {
    padding-bottom: 5px;
    border-bottom: dotted #bbbbbb 1px;
}

#missionText {
    margin-top:10px;
    width: 359px;
    height: 110px;
    background: url( "../images/missionStatement.jpg" );
    text-indent: -9000px;
    float: left;
    clear: left;
}

#welcomeText {
    float: left;
    clear: left;
    width: 358px;
}

#welcomeText p{
    margin: 2px 0 20px 2px;
}

#whatsNewText {
    float: right;
    width: 360px;
    margin-top: 3px;
    margin-left: 15px;
}

#whatsNewText p {
    margin-left: 2px;
}

#whatsNewText div.post{
	padding-bottom:5px;
	border-bottom:dotted #bbb 1px;
	margin-bottom:5px;
}

/*Bottom Box*/
#bottomBox {
    float: right;
    clear: right;
    height: 110px;
    margin: 10px 0 5px;
    width: 360px;
    background: transparent; url( "../images/bottomBox.png" ) no-repeat;*/
}
#bottomBox2 {
    float: right;
    clear: right;
    height: 110px;
    margin: 10px 0 37px;
    width: 360px;
    background: transparent; url( "../images/bottomBox.jpg" ) no-repeat;
}

/*Don't need anymore, I don't think*/
#bottomBoxContents {
    padding: 14px 0 0 180px;
}

/*Cosmetic Surgery Button*/
/*Turns out we'ere not using a button here anyway, just the whole box as a link*/
#cosmeticDentistryButton {
    width: 98px;
    left: 38px;
}

#cosmeticDentistryButton a {
    width: 98px;
    background: url( "../images/cosmeticDentistryButton.gif" ) no-repeat 0 0;
}

/*Cosmetic Surgery Button hover effects*/
#cosmeticDentistryButton a:hover {
    background-position: 0 -22px;
}