@charset "UTF-8";
/* CSS Document */

/* PAGE ELEMENTS */

body {
        background-color: #808080;       /* grey */
        margin: 0px;
        padding: 0px;
        font-size: 1em;
        /* width: 1350px;  */
}

/* NAVIGATION */

#navigation {
        background-color: #000;       /* black */
        font-weight: bold;
        font-size: 110%;
        font: Arial, sans-serif;
        width: 100%;
        height: 75px;
}
#navigation ul#navlinks {
        text-align: center;
        padding-top: 2%;
}
#navigation ul#navlinks li {
        display: inline;
        padding-left: 20px;
        list-style: none;
}
#navigation ul#navlinks a:link, #navlinks a:active, #navlinks a:visited {
        font-weight: bold;
        color: #b2beb5;        /* grey */
        text-decoration: none;
}
#navigation ul#navlinks a:hover {
        font-weight: bold;
        color: #fff;       /* white */
        text-decoration: none;
}

/* HEADER */

#header {
        background: #006a4e;       /* teal */
        padding: 5px 0px 5px 0px;
        height: 100px;
        margin-left: 0px;
        margin-right: 0px;
        width: 100%;
}

#namehdr {
        /* float: left;  */
        list-style-type: none;
}

#namehdr ul {
        list-style-type: none;
}

#namehdr li {
        display: inline;
}

#namehdr li#hdrfrmt01 {              /* Name */
       font-weight: bold;
       font-size: 350%;
       font: Arial, sans-serif;
       text-align: left;
       margin: 0% 0% 0% 0%;
       color: #fff;          /* white */
}

#namehdr li#hdrfrmt02 {               /* Description */
       font-weight: bold;
       font-size: 200%;
       font: Arial, sans-serif;
       /* letter-spacing: -.10em;  */
       text-align: left;
       padding-left: 4%;
       color: #000;        /* black */
}

/* HOME PAGE */

#homecontent {
        margin-top: 0%;
        height: 360px;
        width: 100%;
        background: #d0d0d0;       /* light grey */
}

#homeleftcontent {
       margin: 1% 0% 1% 2%;
       width: 48%;
       float: left;
       overflow: hidden;
       text-align: justify;
       padding: 2%;
       font: bold 14px Arial, Helvetica, sans-serif;
       color: #767676;        /* dark grey */
}

/* HOME PHOTO SHOWCASE */

#picshome {
        background: #fff;
        /* width: 40%;  */
        float: right;
        margin-top: 3%;
        margin-right: 4%;
}

#picshome li {
        background: none;
        list-style-type: none;
}

#picshome img {
       padding-left: 40px;
       width: 300px;
       height: 250px;
}

/* ABOUT CONTENT */

#aboutcontent {
        height: 475px;
        width: 100%;
        background: #d0d0d0;       /* light grey */
        padding-bottom: 15px;
}

/* ABOUT Content01 */

#aboutleftcontent01 {
       margin: 1% 0% 0% 2%;
       width: 50%;
       float: left;
       overflow: hidden;
       text-align: justify;
       padding: 2%;
       font: bold 14px Arial, Helvetica, sans-serif;
       color: #767676;        /* dark grey */
}

#aboutleftcontent01 h3 {
       text-align: left;
       padding: 1%;
       font: bold 16px Arial, Helvetica, sans-serif;
       color: #767676;        /* dark grey */
}

/* ABOUT Content01 Photo Showcase */

#picsabout01 {
        height: 190px;
        width: 280px;
        background: #fff;
        float: right;
        margin: 2% 10% 0% 0%;
        padding-left: 30px;
}

#picsabout01 li {
        background: none;
        list-style: none;
}

#picsabout01 img {
        height: 154px;
        width: 249px;
}

/* ABOUT Content02 */

#aboutleftcontent02 {
       margin-left: 2%;
       width: 50%;
       float: left;
       overflow: hidden;
       text-align: justify;
       padding: 2%;
       font: bold 14px Arial, Helvetica, sans-serif;
       color: #767676;        /* dark grey */
}

#aboutleftcontent02 h3 {
       text-align: left;
       padding: 1%;
       font: bold 16px Arial, Helvetica, sans-serif;
       color: #767676;        /* dark grey */
}

/* ABOUT Content02 Photo Showcase */

#picsabout02 {
        height: 190px;
        width: 280px;
        background: #fff;
        float: right;
        margin: 2% 10% 0% 0%;
        padding-left: 30px;
}

#iframe01 li {
        background: none;
        list-style: none;
}

#iframe01 img {
        height: 154px;
        width: 249px;
}

/* HOMES FOR SALE PAGE */

#homesforsalecontent {
        margin-top: 0%;
        height: 600px;
        width: 100%;
        background: #d0d0d0;       /* light grey */
}

#homesforsaleleftcontent {
       /* margin: 1% 0% 1% 2%; */
       width: 45%;
       float: left;
       overflow: hidden;
       text-align: justify;
       padding: 2%;
       font: bold 14px Arial, Helvetica, sans-serif;
       color: #767676;        /* dark grey */
}

#homesforsaleleftcontent h3.house01 {
       margin: 10% 0% 1% 2%;
}

#homesforsaleleftcontent h3.house02 {
       margin: 20% 0% 1% 2%;
}

/* HOMES FOR SALE PHOTO SHOWCASE */

/* HOUSE 1 SLIDE SHOW 01 */

/* Slideshow01 container */
.slideshow01-container {
   float: right;
   position: relative;
   width: 35%;
   /*margin: auto;    */
   /*padding: 30px;   */
}

/* Hide the images by default */

.mySlides01 {
    display: none;
}

.mySlides01 img {
   /* width: 325px; */
    height: 250px;
    padding-top: 20px;
    padding-left: 40px;
}

/* Next & previous buttons */
.prev01, .next01 {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  margin-top: -22px;
  padding: 16px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
}

/* Position the "next button" to the right */
 .next01 {
     right: 0;
     border-radius: 3px 0 0 3px;
 }

/* On hover, add a black background color with a little bit see-through */
.prev01:hover, .next01:hover {
  background-color: rgba(0,0,0,0.8);
}

/* SLIDE SHOW 02 */

/* Slideshow02 container */
.slideshow02-container {
   float: right;
   position: relative;
   width: 35%;
   /*margin: auto;    */
   /*padding: 30px;   */
}

/* Hide the images by default */

.mySlides02 {
    display: none;
}

.mySlides02 img {
   /* width: 325px; */
    height: 250px;
    padding-top: 20px;
    padding-left: 40px;
}

/* Next & previous buttons */
.prev02, .next02 {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  margin-top: -22px;
  padding: 16px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
}

/* Position the "next button" to the right */
 .next02 {
     right: 0;
     border-radius: 3px 0 0 3px;
 }

/* On hover, add a black background color with a little bit see-through */
.prev02:hover, .next02:hover {
  background-color: rgba(0,0,0,0.8);
}

#picshomesforsale {
        background: #fff;
        float: right;
        margin-top: 2%;
        margin-right: 8%;
}

#picshomesforsale li {
        background: none;
        list-style-type: none;
}

#picshomesforsale img {
       padding-left: 40px;
       width: 300px;
       height: 250px;
}


/* SIGON PAGE */

#signoncontent {
        margin-top: 5%;
        margin-bottom: 5%;
        height: 100px;
        width: 100%;
}

#signoninput {
        height: 75px;
        width: 70%;
        margin-left: 15%;
        background: #d0d0d0;       /* light grey */
}

#signoninput h3 {
        margin-left: 40%;
        font-size: 100%;
        font-family: Times New Roman, serif;
        font-weight: 700;
        color: #ff0000;          /* red */
        width: 30%;
}

#signoninput table {
        margin-left: 10%;
        padding: 2%;
        width: 80%;
}

#signoninput table.format02 {
        margin: -2% 0% 1% 10%;
        width: 80%;
}

#signoninput td.data01 {
        padding-top: 5px;
        background: #fff;
        font-size: 100%;
        font-family: Times New Roman, serif;
        font-weight: 700;
        color: #000;
        width: 50%;
        text-align: center;
}

#signoninput td.data02 {
        padding-top: 5px;
        background-color: #fff;
        font-size: 100%;
        font-family: Times New Roman, serif;
        font-weight: 500;
        color: black;
        width: 50%;
        text-align: left;
}

#signoninput td.data03 {
        background: #fff;
        font-size: 100%;
        font-family: Times New Roman, serif;
        font-weight: 700;
        color: #000;
        width: 50%;
        text-align: center;
}

#signoninput td.data04 {
        background-color: #fff;
        font-size: 100%;
        font-family: Times New Roman, serif;
        font-weight: 500;
        color: black;
        width: 50%;
        text-align: left;
}

#signoninput table.format01 {
        margin-left: 45%;
        margin-top: 1%;
        margin-bottom: 2%;
}

#signoninput td.descrip1 input.buttonA {
        display: block;
        cursor: pointer;
        padding: 2px;
        text-decoration: none;
        background-color: #fff;
        color: #767676;        /* dark grey */
        border: 2px solid color: #767676;        /* dark grey */
        font-size: 100%;
        font-family: Arial;
        font-weight: 600;
        text-align: center;
}

#signoninput td.descrip1 input.buttonARoll {
        display: block;
        cursor: pointer;
        padding: 2px;
        text-decoration: none;
        background-color: #767676;        /* dark grey */
        color: #fff;
        border: 2px solid color: #767676;        /* dark grey */
        font-size: 100%;
        font-family: Arial;
        font-weight: 600;
        text-align: center;
}

/* CONNECT SCREEN */

#connectheader {
        background: #006a4e;       /* teal */
        padding: 5px 0px 5px 0px;
        height: 100px;
        margin-left: 0px;
        margin-right: 0px;
        width: 100%;
}

#connectnamehdr {
        /* float: left;  */
        list-style-type: none;
}

#connectnamehdr ul {
        list-style-type: none;
}

#connectnamehdr li {
        display: inline;
}

#connectnamehdr li#hdrfrmt01 {              /* Name */
       font-weight: bold;
       font-size: 350%;
       font: Arial, sans-serif;
       text-align: left;
       margin: 0% 0% 0% 0%;
       color: #fff;          /* white */
}

#connectnamehdr li#hdrfrmt02 {               /* Description */
       font-weight: bold;
       font-size: 200%;
       font: Arial, sans-serif;
       /* letter-spacing: -.10em;  */
       text-align: left;
       padding-left: 4%;
       color: #000;        /* black */
}

#connectcontent {
        height: 80px;
        width: 60%;
        margin-top: 10%;
        margin-left: 20%;
        background: #fff;        /* white */
}

#connectcontent table {
        margin-left: 15%;
        padding-top: 10px;
}

#connectcontent td.data01 {
        padding-top: 20px;
        background: #fff;
        font-size: 120%;
        font-family: Times New Roman, serif;
        font-weight: bold;
        color: #000;
        width: 70%;
        text-align: center;
}

#connectfooter {
        margin: 2% 0% 2% 42%;
}

#connectfooter td.descrip1 input.buttonA {
        display: block;
        cursor: pointer;
        padding: 10px;
        text-decoration: none;
        background-color: #fff;
        color: #767676;        /* dark grey */
        border: 2px solid color: #767676;        /* dark grey */
        font-size: 120%;
        font-family: Arial;
        font-weight: 600;
        /*text-align: center;*/
}

#connectfooter td.descrip1 input.buttonARoll {
        display: block;
        cursor: pointer;
        padding: 10px;
        text-decoration: none;
        background-color: #767676;        /* dark grey */
        color: #fff;
        border: 2px solid color: #767676;        /* dark grey */
        font-size: 120%;
        font-family: Arial;
        font-weight: 600;
        /*text-align: center; */
}

#connectfooter td.descrip2 input.buttonA {
        display: block;
        cursor: pointer;
        padding: 10px;
        margin-left: 15%;
        text-decoration: none;
        background-color: #fff;
        color: #767676;        /* dark grey */
        border: 2px solid color: #767676;        /* dark grey */
        font-size: 120%;
        font-family: Arial;
        font-weight: 600;
        /*text-align: center;*/
}

#connectfooter td.descrip2 input.buttonARoll {
        display: block;
        cursor: pointer;
        padding: 10px;
        margin-left: 15%;
        text-decoration: none;
        background-color: #767676;        /* dark grey */
        color: #fff;
        border: 2px solid color: #767676;        /* dark grey */
        font-size: 120%;
        font-family: Arial;
        font-weight: 600;
        /*text-align: center; */
}

#connectcopyright p.copyright {
        text-align: center;
        padding: 4px 0px 20px;
        font-weight: 500;
        font-size: 90%;
        color: #000;        /* black */
}


/* BOTTOM OF PAGE */

#footer {
        font-weight: bold;
        font-size: 80%;
        font: Arial, sans-serif;
        color: #b2beb5;        /* grey */
        height: 40px;
        width: 100%;
        clear: left;
}
#footer ul#linksfooter {
        text-align: center;
        padding-right: 20px;
}
#footer ul#linksfooter li {
        display: inline;
        margin-right: 10px;
        list-style: none;
}
#footer ul#linksfooter a:link, #linksfooter a:active, #linksfooter a:visited {
        font-weight: bold;
        color: #fff;        /* white */
        text-decoration: none;
}
#footer ul#linksfooter a:hover {
        font-weight: bold;
        color: #000;        /* black */
        text-decoration: none;
}
#footer p.copyright {
        text-align: center;
        margin: 0px;
        padding: 4px 0px 20px;
        font-weight: 500;
        font-size: 90%;
        color: #000;        /* black */
}

#extension {
        height: 150px;
        width: 100%;
}

/* This id should be placed on a div or break element and should be the final element */
/* before the close of a container that should fully contain a float */
#clearfloat {
        clear: both;
        height: 0px;
        line-height: 0px;
}