:root
{
	--blur: blur(2px);
	
	--accent-h: 214deg;
	--accent-s: 37%;
	--accent-l: 48%;
}


@font-face { font-family: 'AcrossTheRoad'; src: url('AcrossTheRoad.ttf'); }
@font-face { font-family: 'DayRoman'; src: url('dayroman.ttf'); }

.fotorama { margin-top: 30px; }

#map_canvas { z-index: 1; }
#map_canvas img { filter: brightness(75%) contrast(200%) saturate(90%); }
#map_canvas .leaflet-marker-icon { filter: none; }

.grecaptcha-badge { opacity: 0.1; }

/*div{ border: 1px solid rgba( 255,0,0, 0.5 ); }*/

html { height: 100%; font-size: 18px; }
* { box-sizing: border-box; }
body { height: 100%; margin: 0; background: white; }
body, input, select, textarea { font-family: 'DayRoman', 'Times New Roman', 'Times'; }
a { text-decoration: none; color: #3065ab; }
a:hover { color: #7CA4D9; }
form { display: inline; }
img { vertical-align: bottom; }
p { margin: 0; padding: 0; width: unset; line-height: 1.7rem; }
p+p { text-indent: 2rem; }
h1 { font-size: 34px; font-weight: normal; margin: 0 0 5px 0; }
h2 { font-size: 25px; font-weight: normal; margin: 0 0 10px 0; }
h3, h4 { font-size: 18px; letter-spacing: 1px; font-weight: normal; margin: 0 0 10px 0; text-transform: uppercase; }
h4 { font-size: 14px; }
ul, ol { list-style-type: none; margin: 0; padding: 0; }
hr { border: 0; height: 1px; background: #D5D5D5; margin: 60px 0; }
input, textarea { font-size: 1rem; padding: 0.3rem; border: 1px solid #ccc; }
input[type="submit"], .button a { color: white; background: linear-gradient( to bottom, #7CA4D9 0%, #446B9E 100% ); border-radius: 16px; padding: 6px 18px; text-shadow: 0 1px 0px black; border: none; }
input[type="submit"]:hover, .button a:hover { background: linear-gradient( to bottom, #88AFE3 0%, #4C74A8 100% ); }
blockquote { border: none; margin: 60px 60px 40px 60px; quotes: "\201C""\201D""\2018""\2019"; position: relative; }
blockquote:before { color: #ccc; content: open-quote; font-size: 4rem; position: absolute; top: -40px; left: -40px; }
blockquote:after { color: #ccc; content: close-quote; font-size: 4rem; position: absolute; right: -40px; bottom: -40px; }

.mobile-nav { display: none; }

.bullets { list-style: disc outside none; margin: 25px 0 0 50px; line-height: 1.7rem; }
.bullets li { margin: 8px 0; }
.textbox-error { box-shadow: 0 0 20px red; }
.msgbox.success, .box-success { background: #F0FFE6; border: 1px solid #C8EDB1; padding: 5px; }
.msgbox.error, .box-error { background: #FFE7E7; border: 1px solid #FF8E8E; padding: 5px; }
.label-sold { position: absolute; top: 0; right: -10px; background: linear-gradient( to bottom, rgba( 232, 13, 13, 0.9 ) 0%, rgba(145, 10, 10, 0.9) 100% ); padding: 9px 12px; text-shadow: 0 1px 2px rgba( 0,0,0, 0.7 );	color: white; box-shadow: 0 3px 25px rgba( 150,4,4, 0.6 ); transform: rotate( 45deg ); border-radius: 12px; }
.split-container { text-align: left; display: inline-block; }
.split-cell { display: inline-block; vertical-align: top; }
.split-cell + .split-cell { padding-left: 40px; }
.text-container { width: 760px; margin: 60px auto; }
.text-container h2, .text-container h3 { text-align: center; margin-bottom: 40px; }
.img-hero { position: relative; }
.img-hero img { width: 100%; }
.img-hero .container { position: absolute; width: 100%; height: 100%; top: 0; text-align: center; }
.img-hero span { position: relative; top: 50%; transform: translateY(-50%); display: inline-block; color: white; text-shadow: 0 0 10px black; background: rgba( 0,0,0, 0.7 ); padding: 50px; }
.img-hero.darker span { background: rgba( 0,0,0, 0.8 ); }
.w100 { width: 100%; }
.fineprint { font-size: 0.7rem; line-height: 1.5; padding: 10px; margin: 0 auto; text-align: center; }
.fullwidth-video { width: 100%; /*height: calc(100vw / 1.77);*/ }

table.striped {	max-width: var(--max-width); overflow-x: auto; margin: 0 auto; border-top: 1px solid #CACACA; border-left: 1px solid #CACACA; border-bottom: 1px solid #CACACA; border-spacing: 0px; }
table.striped tr td { padding: 7px; border-right: 1px solid #CACACA; background: #eee; }
table.striped tr:nth-child(even) td { background: #fff; }
table.striped thead td { background: #fff; }
table.striped tfoot td { border-top: 1px solid #CACACA;	background: #fff }

.index-carousel-viewport { overflow: hidden; height: 100%; }
#index-carousel-container { position: relative; width: 100%; height: 100% }
.index-carousel-sheet { height: 100%; background-size: cover; background-position: center; background-repeat: no-repeat; position: relative; }
.index-carousel-infobox { position: absolute; bottom: 30px; right: 30px; text-align: right; text-shadow: 0 0 20px black; }
.index-carousel-infobox h1 {  }
.index-carousel-infobox a { color: white; }

.nav-id-box { position: absolute; top: 20px; right: 20px; }
.nav-id-box i { vertical-align: middle; margin-left: 6px; opacity: 0.5; }
.nav-id-box input[type="text"] { width: 100px; border: 2px solid rgba( 0,0,0, 0.2 ); border-radius: 12px; }
.nav-stripe { min-width: 1135px; width: 100%; top: 50%; height: 240px; z-index: 99; display: table; /*backdrop-filter: var(--blur); -webkit-backdrop-filter: var(--blur);*/ }
.nav-logo-nav-container { text-align: center; color: white; display: table-cell; vertical-align: middle; }
.nav-logo-nav-container a { color: black; }
.nav-logo { height: 70px; }
.nav-logo-text { margin: 10px 0 30px 0; font-size: 30px; color: #fff; }
.nav-links ul { font-size: 0; /* eliminates white space */ padding: 0; margin: 0; display: inline-block; }
.nav-links li { display: inline-block; margin: 0; padding: 0; }
.nav-links a { color: black; font-size: 16px; letter-spacing: 1px; text-transform: uppercase; line-height: 45px; display: inline-block; padding: 0 18px; margin: 0 2px; }
.nav-stripe.index-mode { text-shadow: 0 0 20px black; background: rgba( 0,0,0, 0.7 ); position: absolute; margin-top: -120px; }
.nav-stripe.index-mode .nav-id-box input[type="text"] { color: white; background: rgba( 0,0,0, 0.5 ); border: 2px solid white; }
.nav-stripe.index-mode a { color: white; }
.nav-links a:hover, .nav-stripe.index-mode a:hover, .nav-selected, .footer a:hover { color: #7CA4D9 !important; }

.footer-container { background: rgb(246,246,246); padding: 40px; }
.footer, .footer input { font-size: 15px; }
.footer input[type="text"] { width: 100%; }
.footer { color: black; width: 1100px; margin: 0 auto; }
.footer a { color: black; }
.footer-contact-container { margin: 0 auto; display: table; }
.footer-contact { display: table-cell; width: 350px; line-height: 26px; }
.footer-contact a { padding: 0; margin: 0; }
.designedbyimcn { text-align: center; font-family: 'AcrossTheRoad'; font-size: 26px; opacity: 0.5; padding-top: 60px; }


.akl-map { position: relative; }
.akl-map img { width: 100%; height: calc(100vw * 0.61); background: linear-gradient( to bottom, #4f6a8c 0%, #1e2e42 100% ); }
.akl-map-label a { position: absolute; display: inline-block; color: black; font-size: 24px; text-align: center; white-space: nowrap; background: rgba( 255,255,255, 0.8 ); border-radius: 30px; padding: 6px 18px; }
.akl-map-label a:hover, .akl-map-label.selected a { background: rgba( 124, 164, 217, 0.8 ); }
.akl-map-label.northland a { left: 12.3%; top: 9.3%; font-size: 16px; padding: 3px 9px; }
.akl-map-label.auckland a { left: 13.5%; top: 15.4%; font-size: 16px; padding: 3px 9px; }
.akl-map-label.auckland-city a { left: 45%; top: 63%; }
.akl-map-label.waitakere a { left: 26%; top: 53%; }
.akl-map-label.northshore a { left: 45%; top: 45%; }
.akl-map-label.rodney a { left: 33%; top: 26%; }
.akl-map-label.clear-selection a { right: 50px; top: 50px; color: white; background: none; border: 5px solid white; }
.akl-map-label.nz { position: absolute; left: 16%; top: 40%; text-transform: uppercase; font-size: 13px; opacity: 0.6; color: white; background: none; }

.ps-searchpanel-container { text-align: center; width: 100%; padding-bottom: 30px; padding: 20px; }
.ps-searchpanel { display: inline-block; }
.ps-searchpanel a { color: black; }
.ps-searchpanel a:hover { color: #7CA4D9; }
.ps-searchpanel i { font-size: 18px; vertical-align: middle; }
.ps-searchpanel-flatlinks a { padding: 0px; margin: 15px 20px; display: inline-block; }
.ps-searchpanel-flatlinks .selected, .ps-searchpanel-mapbutton a { border: 2px solid #7CA4D9; padding: 5px 11px; border-radius: 20px; }
.ps-searchpanel-label { margin-right: 30px; color: #999; }
#ps-searchpanel-form { display: inline-block; }
.ps-searchpanel-select-region { margin: 25px 0 30px 0; }

.ps-listing-strip { width: 100%; border-left: 40px solid white; border-right: 40px solid white; height: 600px; margin-top: 40px; position: relative; display: table; }
.ps-listing-strip-info { display: table-cell; vertical-align: middle; text-align: center; color: white; text-shadow: 0 0 10px black; }
.ps-listing-strip-info-price { display: inline-block; position: relative; background: rgba( 0,0,0, 0.5 ); padding: 50px; }
.ps-listing-strip-info-price.sold { background: rgba( 173, 19, 19, 0.7 ) }
.ps-listing-strip-a { position: absolute; width: 100%; height: 100%; z-index: 3; }

.viewlisting.text-container { margin: 60px auto; text-align: center; position: relative; }
.viewlisting-stats { margin: 60px 0; text-align: center; line-height: 2em; }
.viewlisting-stats span { white-space: nowrap; }
.viewlisting-stats span+span { margin-left: var(--margin); }
.viewlisting-stats i { opacity: 0.3; margin-right: 5px; }
.viewlisting-description { margin: 60px; text-align: left; }
.viewlisting.label-sold { top: -20px; right: -20px; }

.agentbox { line-height: 1.5rem; }
.agentbox .split-container { margin-top: 60px; }
.agentbox .agent-img { width: 250px; margin: 10px 0 40px 0; box-shadow: 0 10px 30px rgba( 0,0,0,0.2 ); }
.agentbox-phone-num-label { opacity: 0.5; margin-right: 15px; }

.contactform-div { width: 600px; padding: 20px 0; margin: 0 auto; /*display: none;*/ }
.contactform { display: block; text-align: right; }
.contactform input[type="text"] { width: 100%; display: block; margin: 15px 0; }
.contactform textarea { width: 100%; display: block; margin: 15px 0; }

.selling-socialmedia { text-align: center; opacity: 0.5; margin: 40px; }
.selling-socialmedia i { font-size: 35px; margin-right: 20px; }

.text-container.concierge { line-height: 1.5em; }
.text-container.concierge h3 { text-align: left; margin-bottom: 15px; }

.aboutus-agentpic { display: block; width: 300px; margin: 40px auto 60px auto; box-shadow: 0 10px 40px rgba( 0,0,0,0.2 ); }
.aboutus-mobileph { text-align: center; margin: 0 0 40px 0;  }

.disclaimer.text-container { margin: 80px auto 160px auto; }

.awardlogo { width: 110px; height: 432px; position: absolute; z-index: 999; right: 50px; top: 0; opacity: 0.8; }

.button.fullwidth { width: 100%; text-align: center; }