@charset "utf-8";
/* CSS Document */
body {font:100% Arial, Geneva, sans-serif; background-color:#fff; color:#000; margin:0; padding:0; text-align:center; }
h1 {text-align:center; color:#000; font-weight:bold; font-family:Arial, Verdana, Geneva, sans-serif; font-size:22px; margin-bottom:12px; }
h2 {text-align:center; color:#000; font-weight:bold; font-family:Arial, Verdana, Geneva, sans-serif; font-size:18px; margin-bottom:12px; }
h3 {text-align:center; color:#000; font-weight:bold; font-family:Arial, Verdana, Geneva, sans-serif; font-size:16px; margin-bottom:10px; }
@media screen and (min-width:641px) and (max-width:680px) {h1, h2  {font-size:18px; margin-bottom:10px; } }
@media screen and (max-width:640px) {h1, h2, h3  {font-size:14px; margin-bottom:10px; } }
a {color:#003; cursor:pointer; background-color:inherit; }
a:hover {color:#000; cursor:pointer; }

p {font:100% Arial, Geneva, sans-serif; color:#000; margin-bottom:12px; text-align:left;  }
object {max-width:100%; max-height:auto; }

img {max-width:100%; height:auto; border:none; }
* {box-sizing:border-box;}
hr {width:100%; margin:8px auto; color:#000; }
form {border:1px solid #903; border-radius:8px; background-color:#eee; width:50%; margin:0 auto; padding:8px; } 
@media only screen and (max-width:420px) {form {width:88%; } }
@media only screen and (min-width:1080px) {form {width:35%; } }
form.full {border:1px solid #903; border-radius:8px; background-color:#eee; width:100%; margin:0 auto; padding:8px; } 

input {border-radius:8px; width:100%; padding:5px; margin: 5px 0 5px 0; }
textarea {border-radius:8px; width:100%; padding:5px; margin: 5px 0 5px 0; }
input[type=text]:focus, input[type=password]:focus { background-color: #ddd; outline: none;}

iframe {width:100%; height:auto; border:none; }

#top {width:100%; margin:0; padding:12px; text-align:left; }
@media only screen and (max-width:420px) {#top img {width:35%; height:auto; } }
#top_rt {width:70%; margin:0 96px 0 0; padding:0; text-align:center; float:right; font-size:120%; }
@media only screen and (max-width:720px) {#top_rt {width:60%;} }
#top_event {width:72px; height:72px; margin:10px; padding:0; z-index:3; position:fixed; top:96px; right:10px; }
@media only screen and (max-width:720px) {#top_event {width:48px; height:48px; top:36px; right:0px; } }
@media only screen and (max-width:720px) {#top_event img{width:48px; height:48px; } }
#top_menu {width:72px; height:72px; margin:10px 10px 10px 96px; padding:0; z-index:3; position:fixed; top:10px; right:10px; }

#pics_wide {width:100%; height:auto; margin:0; padding:0; background-size:cover; }
#pics_lp {width:100%; height:auto; margin:0 0 12px 0; padding:0; background-size:cover; }
@media only screen and (min-width:800px) {.hide700 {display:none; } }
@media only screen and (min-width:481px) and (max-width:799px) {.hide700 {display:inherit; } }
@media only screen and (min-width:800px) {.show700 {display:inherit; } }
@media only screen and (max-width:799px) {.show700 {display:none; } }
@media only screen and (min-width:481px) {.show400 {display:none;  } }
@media only screen and (max-width:480px) {.show400 {display:inherit; margin:0; } }
@media only screen and (max-width:480px) {.hide400 {display:none; } }
@media only screen and (max-width:480px) {#pics_lp {margin:0 0 12px 0; } }

#over {width:65%; position:absolute; top:35%; left:50%; transform: translate(-50%, -50%); color:#777; padding:12px; border-radius:12px; font-size:130%; font-weight:bold; text-align:center; background-color:rgba(255,255,255,0.5); }
@media only screen and (max-width:700px) {#over {width:88%; padding:8px; font-size:100%;   } }
#over h2 {font-size:150%; color:#000; margin:0; }
@media only screen and (max-width:700px) {#over h2 {font-size:120%; } }

#over_land { width:45%; position:absolute; top:20%; left:3%; color:#777; padding:10px; border:1px solid #903; border-radius:12px; font-weight:bold; 	text-align:center; background-color:rgba(255,255,255,0.75); z-index: 1; }
@media only screen and (max-width:680px) {#over_land {width:80%; left:50%; transform: translate(-50%, -50%); top:25%; } }
#over_land:hover {background-color:rgba(255,255,255,.9); }
#over_land h1, #over_land h2 {font-size:140%;  margin:0; color:#000;  }
#over_land p {font-size:110%;  margin:0; }
#over_land a {color:#777; cursor:pointer; font-weight:bold; background-color:inherit; }
#over_land a:hover {color:#000; font-weight:bold; cursor:pointer; }
@media only screen and (max-width:380px) {#over_land h2 {font-size:120%; } }
@media only screen and (max-width:380px) {#over_land p {font-size:90%; } }

#over_land2 {
	background-color:transparent;
	width:80%;
	height:auto;
	position: absolute;
	top:99px;
	left:88px;
}


.float_lft_50 {float:left; text-align:left; width:48%; padding-left:8px; padding-right:12px; text-align:center; }
.float_lft_50bord {float:left; text-align:left; width:48%; padding-left:12px; padding-right:8px; border-left:2px solid #777; text-align:center; }


#container {width:88%;  margin:0 auto; border:none; text-align:left; }
#container a {color:#777; cursor:pointer; background-color:inherit; }
#container a:hover {color:#000; cursor:pointer; }
@media only screen and (min-width:481px) and (max-width:900px) {#container {width:98%;} }
@media only screen and (max-width:480px) {#container {width:100%;} }

#container2 {width:35%;  margin:36px auto; border:none; text-align:left; }
#container2 a {color:#777; cursor:pointer; background-color:inherit; }
#container2 a:hover {color:#000; cursor:pointer; }
@media only screen and (min-width:481px) and (max-width:900px) {#container2 {width:50%;} }
@media only screen and (max-width:480px) {#container2 {width:80%;} }



#header {background-color:#fff; color:#000;  padding:0 0 0 10px; margin-top:24px; margin-bottom:24px;  }
#header h1 {text-align:left; margin-bottom:12px;}
#header p {text-align:left; color:#000; margin-bottom:12px; }

#ftr {width:100%; background-color:#eee; color:#777; margin:0 0 24px 0; padding:12px; }
@media only screen and (max-width:480px) {#ftr {margin-bottom:36px; } }
#ftr p {font-size:80%; color:#777; font-weight:bold;  }

#ftr2 {width:100%; background-color:#eee; color:#777; margin:0 0 0 0; padding:12px; }
#ftr2 p {font-size:88%; color:#777; font-weight:bold;  }
@media only screen and (max-width:740px) { #ftr2 p {font-size:90%; line-height:1.5; color:#777; font-weight:bold;  }  }
#btm {width:100%; margin:0; padding:0; background-color:#f5f5f5; border:solid 1px #f5f5f5; }
#btm p {font-size:80%; color:#777; font-weight:bold;  }

@-webkit-keyframes fade {from {opacity:.3} to {opacity:1} }
@keyframes fade {from {opacity:.3} to {opacity:1} }

.float_lft_logo {float:left; text-align:center; max-width:22%; height:auto; margin:10px 24px 10px 0;}
.float_lft_logo img {padding:0; }
@media only screen and (min-width:641px) {.float_lft_logo {float:left; text-align:center; max-width:22%; height:auto; margin:10px 24px 10px 0;}    }
@media only screen and (min-width:481px) and (max-width:640px) {.float_lft_logo {float:left; text-align:center; max-width:38%; height:auto; margin:10px 24px 10px 0;}    }
@media only screen and (max-width:480px) {.float_lft_logo {float:none; text-align:center; max-width:70%; height:auto; margin:0 auto;}    }

.float_lft_main {float:left; text-align:left; width:40%; line-height:2em; padding-left:12px; padding-right:24px; }
@media only screen and (min-width:641px) {.float_lft_main {float:left; text-align:left; width:40%; line-height:2em; padding-left:12px; padding-right:24px; } }
@media only screen and (min-width:481px) and (max-width:640px) {.float_lft_main {float:left; text-align:left; width:55%; line-height:2em; padding-left:12px; padding-right:2px; }    }
@media only screen and (max-width:480px) {.float_lft_main {float:none; text-align:left; width:65%; line-height:1.5em; padding-left:12px; padding-right:0px; margin:0 auto; }    }


.float_lft_logo2 {float:left; text-align:center; margin:10px 10px 10px 0; max-width:36%;}
@media only screen and (max-width:680px) { .float_lft_logo2 {float:left; text-align:center; margin:4px 12px 4px 0; max-width:36%;}   }
.float_lft_logo2 img {width:160px; height:207px; max-width:100%; height:auto;  }
.float_lft_main2 {float:left; text-align:left; width:60%; line-height:1.35em; padding-left:8px; padding-right:8px; margin:0; }


.float_lft_cont {float:left; text-align:left; width:33%; line-height:2em; padding-left:24px; padding-right:8px; border-left:2px solid #000; }
@media only screen and (min-width:641px) {.float_lft_cont {float:left; text-align:left; width:33%; line-height:2em; padding-left:24px; padding-right:8px; border-left:2px solid #000; } }
@media only screen and (min-width:481px) and (max-width:640px) {.float_lft_cont {float:left; text-align:left; width:55%; line-height:2em; padding-left:12px; padding-right:2px; border:none; }    }
@media only screen and (max-width:480px) {.float_lft_cont {float:none; text-align:left; width:65%; line-height:1.5em; padding-left:12px; padding-right:0px; border:none; margin:0 auto;}    }

.float_lft_cont33 {float:left; text-align:left; width:33%; line-height:1.25em; padding-left:24px; padding-right:8px; border-left:2px solid #000; background:transparent; }
@media only screen and (max-width:480px) {.float_lft_cont33 {float:none; text-align:left; width:100%; line-height:1.35em; padding-left:10px; padding-right:2px; margin:0 auto;}    }

.float_lft_cont30 {float:left; text-align:center; width:29%; line-height:1.35em; padding:0; margin-right:12px; background:#f8f8f8; }
@media only screen and (max-width:740px) {.float_lft_cont30 {float:none; text-align:left; width:100%; line-height:1.35em; padding-left:24px; padding-right:8px; margin:0 auto; border-bottom:2px solid #000; border-left:none;}    }
@media only screen and (max-width:740px) {.padplus {padding-left:24px; } }

.float_lft_cont40 {float:left; text-align:left; width:40%; line-height:1.35em; padding-left:24px; padding-right:8px; border-left:2px solid #000; background:transparent; }
@media only screen and (max-width:740px) {.float_lft_cont40 {float:none; text-align:left; width:100%; line-height:1.35em; padding-left:24px; padding-right:8px; margin:0 auto; border-bottom:2px solid #000; border-left:none;}    }

.float_lft_cont70 {float:left; text-align:left; width:65%; line-height:1.35em; padding-left:24px; padding-right:8px; border-left:2px solid #000; background:transparent; }
@media only screen and (max-width:740px) {.float_lft_cont70 {float:none; text-align:left; width:100%; line-height:1.35em; padding-left:24px; padding-right:8px; margin:0 auto; border-bottom:2px solid #000; border-left:none;}    }

.fltrtsoc {float:right; width:auto; padding:0; margin:0 0 0 12px; padding:0; }
.caravellogo {color:#2e3192; font-family:"Myriad Pro", Arial, sans-serif; font-weight:bold; font-size:120%; }
.caption {text-align:center; margin:10px -55px 10px -55px; font-weight:bold; font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif; color:#900; }
.caption_main {text-align:center; margin:10px; font-weight:bold; font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif; color:#900; }
.clear {clear:both; margin:0; padding:0;}
.clrlft {clear:left; }
.clrrt {clear:right; }

.bold {font-weight:bold; }
.black {color:#000; }

.btn {float:left; padding:0px 12px 0 0; border:none; }
.btn2 {float:left; padding:8px 12px 8px 0; border:none; }
.btnctalft {float:left; padding:8px 12px 8px 12px; margin:4px; border:none; color:#fff; background-color:#066; font-weight:bold; }
.bgmaroon {  background-color: #b50102; color:#fff; font-weight:bold; }
.bggold { background-color:#c7aa5f; color:#000; font-weight:bold; }
.bgocean {background-image:url(/images/ocean-wave-waves-beach-water-352150.jpg); background-size:cover; }
.bgbtm {background-color:#f5f5f5; }
.bgfltlft {background-color:#f8f8f8; }
.bgfrtlit { background-image:url(/images/New_Home_Ventura_front_door_lit.png); background-size:cover; height:100vh; width:auto;  }
@media only screen and (min-width:401px) and (max-width:740px)  { .bgfrtlit { background-image:url(/images/Images_Main_front_door_lit.png); background-size:cover; height:100vh; width:auto;  }  }
@media only screen and (max-width:400px) { .bgfrtlit { background-image:url(/images/New_Homes_Ventura_v_front_door_lit.png); background-size:cover; height:100vh; width:auto;  }  }
.big {font-size:24pt;  }
@media only screen and (max-width:640px) {.big  {font-size:14pt;  } }
.brdrbtm {border-bottom:thin 1px #333; }
.brdrred {border-top:solid 1px #900; border-bottom:solid 1px #900;  }
.brdrteal {border-top:solid 1px #099; border-bottom:solid 1px #066; }

.block {width:50%; margin:0 auto; padding:24px; display:block; border:groove 1pt #000; background-color:#f0f0f0;  }
.center {text-align:center; }
.frmbtn {font-size:150%; padding:4px; font-weight:bold; text-align:center; margin:0 auto; border-radius:8px; background-color:#903; color:#fff; border:1px solid #903; }
.floatno {float:none; max-width:100%; }
.hide520 {display:inherit; }
@media only screen and (max-width:520px) {.hide520 {display:none; } }

.imgrtpad8 {float:right; margin:0 8px; }
.imglftpad8 {float:left; margin:0 8px; }
.imgpad2 {padding:0 2px; vertical-align:middle; }
.imgpad8 {padding:0 8px; vertical-align:middle; }
.imgctr {margin:0 auto; }

.left {text-align:left; }
.max55 {max-width:55%; height:auto; margin-left:auto; margin-right:auto; }
@media only screen and (max-width:550px) {.max55 {width:480px; max-width:100%; float:none; } }
.pad26 {padding:26px; }
.small {font-size:10pt; }
.small10 {font-size:90%; }
.top36 {margin-top:36px; }
.wid88 {width:88%; margin: 0 auto; }
@media only screen and (max-width:550px) { .wid88 {width:100%; }}
.white {color:#fff; background-color:inherit; }
.yellow {color:#FF0; text-align:center; }
.dkteal {color:#066; }
.teal {color:#099; }
.RainiAssoclogo {color:#026064; font-size:120%; font-weight:bold; font-family:"Tekton Pro", Verdana, sans-serif; }
.red {color:#900; }
 /* Popup container */

.popup {
  position: relative;
  display: inline-block;
  cursor: pointer;
}

/* The actual popup (appears on top) */
.popup .popuptext {
  visibility: hidden;
  width: 160px;
  background-color: #c7aa5f;
  color: #000;
  text-align: center;
  font-weight:bold;
  border-radius: 6px;
  border: solid 3px #000;
  padding: 8px;
  position: absolute;
  z-index: 3;
  top: 0;
  right: 125%;
  margin-left: 0;
}

/* Popup arrow */
.popup .popuptext::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: #c7aa5f transparent transparent transparent;
}
.popuptext a:hover {color:#000; }

/* Toggle this class when clicking on the popup container (hide and show the popup) */
.popup .show {
  visibility: visible;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s
}

/* Add animation (fade in the popup) */
@-webkit-keyframes fadeIn {
  from {opacity: 0;}
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
} 

/* dup June 2018 from: W3.CSS 4.10 February 2018 by Jan Egil and Borge Refsnes and edited - for animation*/

.w3-animate-zoom {animation:animatezoom 1s}@keyframes animatezoom{from{transform:scale(1)} to{transform:scale(.5)}}