@charset "utf-8";
/* Custom Styles for Swinley Estates website created by Monsters Edge */

/* FONTS */
a { transition: all 0.5s ease 0s; -webkit-transition: all 0.5s ease 0s; -moz-transition: all 0.5s ease 0s; outline: none; color: #575756; text-decoration: none;}
a:hover { text-decoration:none; color: #b7a34e;}
a:focus { outline: none;}

/* SPACING CLASSES */
.pad30 { padding: 30px;}
.pad60 { padding: 60px;}
.pad90 { padding: 90px;}
.pad120 { padding: 120px;}
.padX30 { padding: 0 30px;}
.padX60 { padding: 0 60px;}
.padX90 { padding: 0 90px;}
.padX120 { padding: 0 120px;}
.padY30 { padding: 30px 0;}
.padY60 { padding: 60px 0;}
.padY90 { padding: 90px 0;}
.padY120 { padding: 120px 0;}

/* HEADINGS & TEXT */
h1,h2,h3,h4,h5,h6 { margin: 0 0 1.5rem 0; font-weight: 300;}
h1 { color: #b7a34e;}
p { font-size: 1rem; margin: 0 0 1.5rem 0;}
strong { font-size: 500;}

/* GENERAL */
html, body { overflow-x: hidden;}
body { font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif"; font-weight: 300; color: #575756;}

#shadow { width: 100%; height: 100%; background: url("../images/shadow.png") 0 0 repeat-x;}
header.internal #shadow { background: url("../images/shadow-internal.png") 0 0 repeat-x;}

header { border-top: 10px solid #003e59; height: 700px; background-image: url("../images/hero.jpg"); background-position: center center; background-repeat: no-repeat; background-size: cover;}
header #logo { position: absolute; top: 15px; right: 0;}
header.internal { background-image: none; height: 140px;}
header.contact { background-image: url("../images/hero-contact.jpg");}

.blue-box { background-color: #003e59; color: #fff; padding: 60px; position: relative; top: -140px;}
.blue-box a { color: #b7a34e; font-weight: 500;}
.blue-box a:hover { color: #fff;}

.development { display: block; font-size: 0.75rem; font-weight: 500; color: #b7a34e; margin-bottom: 30px;}
.development img, #carousel-images img { box-shadow: 6px 6px 6px #ccc;}
.development h6 { color: #575756; font-size: 0.9rem;}
.development span { font-size: 0.75rem; font-weight: 300; color: #575756; text-transform: uppercase;}

.carousel-indicators [data-bs-target]{ border-radius: 50%; width: 10px; height: 10px; background-color: #575756;}
.carousel-indicators { bottom: -50px;}
.carousel-control-prev, .carousel-control-next { width: auto; background: none; color: #003e59; font-size: 2rem; opacity: 1;}
.carousel-control-prev:hover, .carousel-control-next:hover { color: #b7a34e;}
.carousel-control-prev { margin-left: -30px;}
.carousel-control-next { margin-right: -30px;}

footer { font-size: 0.75rem;}
footer .container { border-top: 1px solid #003e59;}

/* NAVIGATION */
.navbar { margin-top: 45px;}
.navbar .nav-item { border-left: 1px solid #fff; padding: 0 20px;}
.navbar .nav-item .nav-link { color: #fff; text-transform: uppercase; font-weight: 300; font-size: 0.9rem; line-height: 1rem; padding: 0;}
.navbar .nav-item .nav-link:hover { color: #003e59;}
.navbar .nav-item .nav-link.active { color: #003e59; font-weight: 500;}
.navbar .nav-item:first-child { border-left: 0; padding: 0 20px 0 0;}
.navbar .nav-item:first-child .nav-link.active { color: #fff;}
header.internal .navbar .nav-item .nav-link { color: #003e59;}

/* RESPONSIVE AMENDED STYLES */
/* #Tablet (Landscape)
================================================== */
/* Note: Design for a width of 1080px */
@media only screen and (min-width: 960px) and (max-width: 1080px) {
	header { height: 400px;}
}

/* #Tablet (Portrait)
================================================== */
/* Note: Design for a width of 768px */
@media only screen and (min-width: 768px) and (max-width: 959px) {
	header { height: 400px;}
	.blue-box { top: 0px;}
}

/* #Mobile (Both)
================================================== */
/* Note: Landscape and portrait */
@media only screen and (max-width: 767px) {
	.padY30,.padY60,.padY90,.padY120 { padding: 15px 0;}
	header { height: 300px;}
	header #logo { width: 130px; right: 15px;}
	.blue-box { top: 0px; padding: 40px 30px;}
	footer { text-align: center;}
	
	.navbar { margin-top: 25px;}
	.navbar-toggler { margin: 0; border: 0; font-size: 2rem; color: #fff;}
	header.internal .navbar-toggler { color: #575756;}
	.navbar-toggler:focus { box-shadow: none;}
	.navbar .nav-item, .navbar .nav-item:first-child { border-left: 0; padding: 4px 14px;}
	
	.carousel-control-prev, .carousel-control-next { height: 50px; top: 96%; font-size: 1.5rem;}
	.carousel-control-prev { margin-left: 15px;}
	.carousel-control-next { margin-right: 15px;}
}

/* #Mobile (Landscape)
================================================== */
/* Note: Design for a width of 480px */
@media only screen and (min-width: 480px) and (max-width: 767px) {

}
	
/*  #Mobile (Portrait)
================================================== */
/* Note: Design for a width of 320px */
@media only screen and (min-width: 320px) and (max-width: 479px) {
 
}

@-moz-document url-prefix() {
  fieldset { display: table-cell; }
}