/*Website Colors:
"043359" aka Dark Blue;
"4dafff" aka Light Blue;
"ffffff" aka White*/

body {background-color: #fafdff}

#logo {width: 300px; margin: 0px auto}
header div a img {width: 300px; margin: 20px auto 30px auto}

h1 {font-size: 50px}



/*Dropdown Menu*/
.dropdown {}
nav ul li:hover .dropdown {opacity: 99%; border-bottom: 2px dashed #4dafff}
nav .dropdown:after {}
nav ul li ul {
    z-index: 1000;
    border-radius: 0px 0px 15px 15px;
    background: #043359;
    box-sizing: border-box;
    left: 0;
    width: 100%;
    padding: 15px 0px;
    opacity: 0;
    position: absolute;
    top: 40px;
    visibility: hidden;
    -webkit-transition: all .25s ease;
       -moz-transition: all .25s ease;
        -ms-transition: all .25s ease;
         -o-transition: all .25s ease;
            transition: all .25s ease;
}
nav ul li:hover ul {
    border-bottom: 1px dotted #4dafff;
    background: #043359;
    opacity: 1;
    top: 50px;
    visibility: visible;
}
nav ul li ul li {
    font-size: 20px;
    border-bottom: 1px dotted #4dafff;
    display: block;
    width: 220px;
    margin: 15px auto;
    padding: 0px auto;
    -webkit-transition: all .25s ease;
       -moz-transition: all .25s ease;
        -ms-transition: all .25s ease;
         -o-transition: all .25s ease;
            transition: all .25s ease;
}


/*Slideshow*/
.slideshow {user-select: none; overflow: hidden; position: relative; width: 1000px; height: 450px; margin: 0px auto; border: 5px double black; border-radius: 15px; background: #ffffff; transition: border-color 0.3s, box-shadow 0.3s}

div input[type="radio"] {display: none}

.slides-movement {
  display: flex;
  width: 600%;
  transition: transform 0.7s cubic-bezier(0.4, 0, 0.2, 1)
}
.slide {width: 16.666%; list-style: none; position: relative; margin: 0px auto}

.slideshow:hover {
    box-shadow: 0 0 25px 2px rgba(0, 123, 255, 0.5)
}

#Agent1:checked ~ .slides-movement { transform: translateX(0); }
#Agent2:checked ~ .slides-movement { transform: translateX(-16.666%)}
#Agent3:checked ~ .slides-movement { transform: translateX(-33.333%)}
#Agent4:checked ~ .slides-movement { transform: translateX(-50%)}
#Agent5:checked ~ .slides-movement { transform: translateX(-66.666%)}
#Agent6:checked ~ .slides-movement { transform: translateX(-83.333%)}

#Agent1:checked ~ .slides-movement .slide:nth-child(1) label,
#Agent2:checked ~ .slides-movement .slide:nth-child(2) label,
#Agent3:checked ~ .slides-movement .slide:nth-child(3) label,
#Agent4:checked ~ .slides-movement .slide:nth-child(4) label,
#Agent5:checked ~ .slides-movement .slide:nth-child(5) label,
#Agent6:checked ~ .slides-movement .slide:nth-child(6) label {display: block}

.slide label {position: absolute; top: 43%; transform: translateY(-50%); background: rgba(0, 0, 0, 0.4); color: white; padding: 10px; cursor: pointer; font-size: 20px; display: none; z-index: 50}

#Agent1:checked ~ .controls label [for="Agent1"] {background: #333}
#Agent2:checked ~ .controls label [for="Agent2"] {background: #333}
#Agent3:checked ~ .controls label [for="Agent3"] {background: #333}
#Agent4:checked ~ .controls label [for="Agent4"] {background: #333}
#Agent5:checked ~ .controls label [for="Agent5"] {background: #333}
#Agent6:checked ~ .controls label [for="Agent6"] {background: #333}

.prev {left: 0; border-radius: 0 5px 5px 0;}
.next {right: 0; border-radius: 5px 0 0 5px;}

.slide label:hover {background: rgba(0, 0, 0, 0.75)}

.agent_description {font-size: 30px; margin: 100px; }

div li img {width: 300px; padding-right: 20px; align-items: center; float: left}
#special-agent {margin-top: 85px}


/*back to norm*/
header {width: 1000px; margin: 10px auto 50px auto; background-color: lightskyblue}
header ul {}
header ul li {list-style: none; display: inline; font-weight: bold; font-family: "TikTok Sans", sans-serif; font-weight: 500; font-style: normal}
  
a:link {text-decoration: none; color: #4dafff}
a:active {text-decoration: none; color: #ffffff}
a:visited {text-decoration: none; color: #4dafff}
a:hover {text-decoration: none; color: #a2d3ff}
#active_link {color: #a2d3ff}

#mainhome {width: 900px; margin: 10px auto;}

.homep {font-size: 25px; text-align: center; margin-bottom: 50px}

.aboutp-box {width: 1100px; margin: 50px auto}
.aboutp {text-align: center; font-size: 30px}




.pagelinks {
    position: relative;
    color: #4dafff;
    font-size: 30px;
    background-color: #043359;
    border-radius: 15px;
    padding: 15px 20px;
    margin: 10px 30px;
}


#house_front-box {width: 100%; border: 2px solid black; display: block}
.house_fronts {width: 400px; height: 270px; padding: 24px}


#mainbuy {width: 1300px; height: 2345px; margin: 10px auto; border-left: 2px solid black; border-right: 2px solid black; padding: 0px 20px; border-radius: 1%}
.house_box {
    width: 1200px;
    margin: 30px auto;
    font-size: 20px;
/*    border-bottom: 1px dotted black;*/
}
.content_box {
    width: 500px;
    float: left;
    border-right: 2px dashed black;
}
.img_box {
    width: 650px;
    float: left;
    padding-top: 25px;
    padding-left: 48px;
/*    border-right: 2px dashed black;*/
}
.house_box .descriptionp {width: 400px; margin: 10px 30px}
.house_box .detailsp {width: 400px; margin: 10px 30px}
.house_box ul li {list-style-type: "-   "; margin: 15px 50px}
.house_box img {
    width: 300px;
    height: 200px;
    margin-left: 5px;
    margin-top: 5px;
/*    padding: 2px;*/
/*    border: 1px dotted black;*/
    float: left;
}
.hr-block {display: block; border-bottom: 1px solid black; margin-top: 500px}


#h1house1 {font-size: 50px; margin: 0px; border-bottom: 1px solid black; width: 173px}
#h1house2 {font-size: 50px; margin: 0px; border-bottom: 1px solid black; width: 173px}
#h1house3 {font-size: 50px; margin: 0px; border-bottom: 1px solid black; width: 173px}
#h1house4 {font-size: 50px; margin: 0px; border-bottom: 1px solid black; width: 173px}



#maincontact {width: 1200px; margin: 10px auto; padding-left: 150px;}

.contactp {margin: 30px 70px;}
.contactp-box {margin-bottom: 50px}

#webform-box {margin-bottom: 50px; width: 500px; margin: 10px 100px;}
#birthmonth_label {margin-left: 17px; margin-right: 30px}
#yearfromday_labelpadding {margin-right: 15px}


.contact_content-left {width: 500px; margin: 10px 30px; float: left}
.contact_content-left img {width: 40px; margin-left: 20px}

/*.contact_pics-box {width: 70px}*/
.contact_pics-box img {width: 400px}



.inline {display: inline}

.white_background-text {background-color: #ffffff; text-decoration: underline}

footer {margin-bottom: 25px;}
#footer_icon {border-radius: 100%}

/*Dropdown Menu*/
/*
nav ul {
    text-align: center;
    width: 100%;
}
nav li {
    display: inline-block;
    margin: 0;
    padding: 0;
    position: relative;
    min-width: 100%;
}
nav a {
    display: block;
    text-align: center;
    -webkit-transition: all .25s ease;
       -moz-transition: all .25s ease;
        -ms-transition: all .25s ease;
         -o-transition: all .25s ease;
            transition: all .25s ease;
}
nav .dropdown:after {
    content: ' \25bc';
}

nav li ul {
    opacity: 0;
    position: absolute;
    top: 35px;
    visibility: hidden;
    -webkit-transition: all .25s ease;
       -moz-transition: all .25s ease;
        -ms-transition: all .25s ease;
         -o-transition: all .25s ease;
            transition: all .25s ease;
}
nav li:hover ul {
    border-bottom: 4px solid #acff57;
    background: #e2dbd1;
    opacity: 1;
    top: 50px;
    visibility: visible;
}
nav li ul li {
    width: 100%;
}
nav li ul a:hover {
    background: #d7c8b1;
}*/
