@font-face {
	font-family: "Futura Maxi W00 Light";
	src: url("https://eclecticksa.com/assets/fonts/1cacd7f4-8e24-4c43-89f0-25cf4c9e0544.eot?#iefix");
	src: url("https://eclecticksa.com/assets/fonts/1cacd7f4-8e24-4c43-89f0-25cf4c9e0544.eot?#iefix") format("eot"), url("https://eclecticksa.com/assets/fonts/ad77883c-e72a-4810-bdab-6731d5a6f523.woff2") format("woff2"), url("https://eclecticksa.com/assets/fonts/3e437bdc-cabc-49c6-b629-f9bb87d4bae0.woff") format("woff"), url("https://eclecticksa.com/assets/fonts/30c4a5ca-18b1-4a38-adcc-0b7f2615b559.ttf") format("truetype"), url("https://eclecticksa.com/assets/fonts/fee4435d-5252-454f-bc5d-6c0213a9698d.svg#fee4435d-5252-454f-bc5d-6c0213a9698d") format("svg");
}

@font-face {
	font-family: "Futura Maxi W00 Book";
	src: url("https://eclecticksa.com/assets/fonts/e2b1d569-594e-414d-be65-0ce98772e63f.eot?#iefix");
	src: url("https://eclecticksa.com/assets/fonts/e2b1d569-594e-414d-be65-0ce98772e63f.eot?#iefix") format("eot"), url("https://eclecticksa.com/assets/fonts/a275540a-3072-4147-a70e-c195f05602d7.woff2") format("woff2"), url("https://eclecticksa.com/assets/fonts/0112c0f0-c914-43ec-bc48-7b3802485fa0.woff") format("woff"), url("https://eclecticksa.com/assets/fonts/e6a63a67-a3bc-4bf3-b070-c1edabfe6b66.ttf") format("truetype"), url("https://eclecticksa.com/assets/fonts/1946b94e-43fe-44d2-90ea-4d433d176c5e.svg#1946b94e-43fe-44d2-90ea-4d433d176c5e") format("svg");
}

@font-face {
	font-family: "Futura Maxi W00 Demi";
	src: url("https://eclecticksa.com/assets/fonts/3d8e3e4d-3384-45eb-888f-6f65b229c2d8.eot?#iefix");
	src: url("https://eclecticksa.com/assets/fonts/3d8e3e4d-3384-45eb-888f-6f65b229c2d8.eot?#iefix") format("eot"), url("https://eclecticksa.com/assets/fonts/14ca2fec-d0bb-413c-99d5-79a50b4c953d.woff2") format("woff2"), url("https://eclecticksa.com/assets/fonts/7eda4e81-52ae-46b6-88e3-179590dc2b8d.woff") format("woff"), url("https://eclecticksa.com/assets/fonts/760ea043-7e43-4189-84c0-b7cd11c3e698.ttf") format("truetype"), url("https://eclecticksa.com/assets/fonts/b50248e5-ebe5-4b39-85b8-0e960b68af5f.svg#b50248e5-ebe5-4b39-85b8-0e960b68af5f") format("svg");
}

@font-face {
	font-family: "Futura Maxi W00 Bold";
	src: url("https://eclecticksa.com/assets/fonts/63efc5e5-ad97-4ee5-a499-cbd5d4231d12.eot?#iefix");
	src: url("https://eclecticksa.com/assets/fonts/63efc5e5-ad97-4ee5-a499-cbd5d4231d12.eot?#iefix") format("eot"), url("https://eclecticksa.com/assets/fonts/e335f94d-3594-40f6-aff3-a32ca5a63615.woff2") format("woff2"), url("https://eclecticksa.com/assets/fonts/20e1080e-6b08-4188-9162-8425b9f87a75.woff") format("woff"), url("https://eclecticksa.com/assets/fonts/d934455f-9970-4c46-be02-401ce076b336.ttf") format("truetype"), url("https://eclecticksa.com/assets/fonts/853d4d04-8ae0-4681-b802-194b1879b13a.svg#853d4d04-8ae0-4681-b802-194b1879b13a") format("svg");
}

@font-face {
	font-family: "Jalal LT W20 Light";
	src: url("https://eclecticksa.com/assets/fonts/ff6ba6be-c1a8-4444-b323-45261b94302c.eot?#iefix");
	src: url("https://eclecticksa.com/assets/fonts/ff6ba6be-c1a8-4444-b323-45261b94302c.eot?#iefix") format("eot"), url("https://eclecticksa.com/assets/fonts/e3434995-09df-4fc3-990c-896e346afa7e.woff2") format("woff2"), url("https://eclecticksa.com/assets/fonts/e4e8fe89-26ce-41a8-bbe5-c62bb90a4310.woff") format("woff"), url("https://eclecticksa.com/assets/fonts/4321f007-8ab3-4da1-8827-b4d0aff9fecc.ttf") format("truetype"), url("https://eclecticksa.com/assets/fonts/b0357bb5-1ab9-4889-94b4-85baee7aa715.svg#b0357bb5-1ab9-4889-94b4-85baee7aa715") format("svg");
}

@font-face {
	font-family: "Jalal LT W20 Bold";
	src: url("https://eclecticksa.com/assets/fonts/1885f6b0-957e-4ff5-a6f2-04cc2ba3c954.eot?#iefix");
	src: url("https://eclecticksa.com/assets/fonts/1885f6b0-957e-4ff5-a6f2-04cc2ba3c954.eot?#iefix") format("eot"), url("https://eclecticksa.com/assets/fonts/1e3edc88-d611-4132-8a6a-c9a282b49482.woff2") format("woff2"), url("https://eclecticksa.com/assets/fonts/296d3de6-0426-4221-88a5-a0d041f25d06.woff") format("woff"), url("https://eclecticksa.com/assets/fonts/56575a64-e5ce-4080-b07d-6d95ba817490.ttf") format("truetype"), url("https://eclecticksa.com/assets/fonts/a798b1a1-9fe1-413b-bb8b-b112b265bec3.svg#a798b1a1-9fe1-413b-bb8b-b112b265bec3") format("svg");
}

@font-face {
	font-family: "Janna LT W20 Regular";
	src: url("https://eclecticksa.com/assets/fonts/a9c47d30-0eca-434f-8082-ac141c4c97b3.eot?#iefix");
	src: url("https://eclecticksa.com/assets/fonts/a9c47d30-0eca-434f-8082-ac141c4c97b3.eot?#iefix") format("eot"), url("https://eclecticksa.com/assets/fonts/b5606736-5656-4140-a171-fee29f8a2c21.woff2") format("woff2"), url("https://eclecticksa.com/assets/fonts/26c24286-5aab-4747-81b9-54330e77fb14.woff") format("woff"), url("https://eclecticksa.com/assets/fonts/9c4c7fff-85b6-442f-9726-af5f49d49e53.ttf") format("truetype"), url("https://eclecticksa.com/assets/fonts/a24f53ee-e15e-4931-89a3-b6f17fbfcd72.svg#a24f53ee-e15e-4931-89a3-b6f17fbfcd72") format("svg");
}

@font-face {
	font-family: "Janna LT W20 Bold";
	src: url("https://eclecticksa.com/assets/fonts/40e91b18-f7fd-44d2-935d-8f2f5a46d380.eot?#iefix");
	src: url("https://eclecticksa.com/assets/fonts/40e91b18-f7fd-44d2-935d-8f2f5a46d380.eot?#iefix") format("eot"), url("https://eclecticksa.com/assets/fonts/183c81cc-2eaf-469b-848d-7b8ae60dc6c3.woff2") format("woff2"), url("https://eclecticksa.com/assets/fonts/132c0c0f-7a5e-429e-a7dc-a6b0a843a6fc.woff") format("woff"), url("https://eclecticksa.com/assets/fonts/a419a57e-c14d-47b1-b6f6-01fda5c3b099.ttf") format("truetype"), url("https://eclecticksa.com/assets/fonts/1088eb5b-cc92-428f-ac4c-0639886ce087.svg#1088eb5b-cc92-428f-ac4c-0639886ce087") format("svg");
}

@font-face {
	font-family: "Trajan W01 Regular";
	src: url("https://eclecticksa.com/assets/fonts/5cbd8dde-fb39-4dd1-aa25-5bb5842eb03d.eot?#iefix");
	src: url("https://eclecticksa.com/assets/fonts/5cbd8dde-fb39-4dd1-aa25-5bb5842eb03d.eot?#iefix") format("eot"), url("https://eclecticksa.com/assets/fonts/610145ac-dd31-4024-b833-3ab0ce6b7847.woff2") format("woff2"), url("https://eclecticksa.com/assets/fonts/b4312891-e355-4bdc-80c9-ef3dbf7bd916.woff") format("woff"), url("https://eclecticksa.com/assets/fonts/124dc47b-32a0-4543-a60e-d8aad32782b4.ttf") format("truetype"), url("https://eclecticksa.com/assets/fonts/001e534b-3742-45b3-b20b-d4c53c41a519.svg#001e534b-3742-45b3-b20b-d4c53c41a519") format("svg");
}

@font-face {
	font-family: "Trajan W01 Bd";
	src: url("https://eclecticksa.com/assets/fonts/a602588d-0fb5-40a8-a1b9-112c323b8a73.eot?#iefix");
	src: url("https://eclecticksa.com/assets/fonts/a602588d-0fb5-40a8-a1b9-112c323b8a73.eot?#iefix") format("eot"), url("https://eclecticksa.com/assets/fonts/7255bae8-e86a-4f7e-bb5d-8e99aebbea20.woff2") format("woff2"), url("https://eclecticksa.com/assets/fonts/42eddbd0-3b0e-4c24-ba3b-57b9859b2602.woff") format("woff"), url("https://eclecticksa.com/assets/fonts/a901f152-b0d8-4686-bbaa-8a5aff10781b.ttf") format("truetype"), url("https://eclecticksa.com/assets/fonts/5fac8357-5dba-4c53-80c1-607abd0eae0e.svg#5fac8357-5dba-4c53-80c1-607abd0eae0e") format("svg");
}

h1, h2, h3, h4, h5, h6 {
    font-family: "Trajan W01 Regular";
    padding: 0;
    margin: 0;
}

.brown {
    color: #c29f61;
}

.grey {
    color: #a2a2a2;
}

.italic {
    font-style: italic;
}

.orbit-previous, .orbit-next {
	background: rgba(0,0,0,0.25);
	color: #fff;
}

.orbit-previous:hover, .orbit-next:hover, .orbit-previous:active, .orbit-next:active, .orbit-previous:focus, .orbit-next:focus {
    background: #c29f61;
}

.orbit-container {
	height: auto !important;
}

body {
    background: #fafafa;
    font-family: "Futura Maxi W00 Light";
    font-size: 1.125rem;
    color: #696969;
}

div.countiner {
    background: #fff;
    min-height: 100vh;
    box-shadow: 0 0 10px #f5f5f5;
}

div.header {
    position: relative;
}

div.header img {
    height: 120px;
    padding: 5px 0;
}

a.menu {
    position: absolute;
    top: 0;
    left: 0;
    min-height: 90px;
    color: #a2a2a2;
    font-size: 1.500rem;
}

div#menu.reveal {
    background: #c29f61;
    padding: 0;
}

div#menu.reveal span {
    color: #fff;
    font-size: 3rem;
}

div#menu.reveal ul {
    height: 80%;
    margin-top: 20%;
}

div#menu.reveal li a {
    color: #fff;
    text-align: center;
    display: block;
    font-family: "Trajan W01 Regular", "Janna LT W20 Regular";
    font-size: 1.500rem;
    border-top: 1px solid rgba(0,0,0,0);
    border-bottom: 1px solid rgba(0,0,0,0);
}

div#menu.reveal li:hover a, div#menu.reveal li:focus a, div#menu.reveal li.active a {
    background: #a2a2a2;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
}

div.content {
    min-height: 100vh;
    padding: 0;
    position: relative;
    overflow: hidden;
}

div.orbit.cover {
    position: absolute;
    top: 0;
    z-index: 990;
    width: 100%;
    min-height: 100vh;
    padding: 0 1px 0 1px;
}

div.shadow {
    position: absolute;
    top: 0;
    z-index: 991;
    width: calc(100% - 2px);
    min-height: 100vh;
    height: calc(100vh + 25px);
    margin-left: 1px;
    -webkit-box-shadow: inset 0px 125px 125px 0px rgba(0,0,0,0.66);
    -moz-box-shadow: inset 0px 125px 125px 0px rgba(0,0,0,0.66);
    box-shadow: inset 0px 125px 125px 0px rgba(0,0,0,0.66);
}

div.content-countiner-1 {
    position: relative;
    z-index: 992;
    width: 100%;
    min-height: 100vh;
    background-image: url("https://eclecticksa.com/assets/images/triangles-cover-1-ltr.svg");
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: top;
}

div.content-countiner-2 {
    position: relative;
    z-index: 992;
    width: 100%;
    min-height: 100vh;
    background-image: url("https://eclecticksa.com/assets/images/triangles-cover-2-ltr.svg");
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: top;
}

div.content-countiner-3 {
    position: relative;
    z-index: 992;
    width: 100%;
    min-height: 100vh;
    background-image: url("https://eclecticksa.com/assets/images/triangles-cover-3-ltr.svg");
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: top;
}

ul.cover-navigation {
    position: absolute;
    top: 35px;
    color: #fff;
    text-transform: uppercase;
    font-family: "Trajan W01 Regular", "Janna LT W20 Regular";
}

ul.cover-navigation a {
    color: #fff;
    font-size: 0.813rem;
    padding: 8px 15px;
}

ul.cover-navigation li {
    border: 1px solid rgba(255,255,255,0);
}

ul.cover-navigation li:hover, ul.cover-navigation li:focus, ul.cover-navigation li.active {
    border: 1px solid rgba(255,255,255,1);
}

ul.cover-navigation li.active a {
    background: transparent;
}

div.row.sections {
    margin: 0;
    padding-top: 35px;
    color: #fff;
    margin-bottom: -20%;
}

div.row.sections a {
    color: #fff;
}

div.sections .column.title {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

div.sections .column.title h4 {
    position: absolute;
    color: #c29f61;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

div.row.content-text {
    margin: 0;
}

hr {
    border-color: #a2a2a2;
    margin: 100px 0;
}

hr.small {
    border-color: #a2a2a2;
    margin: 25px 0;
}

div.three-squares {
    position: relative;
}

div.three-squares h5 {
    position: absolute;
    color: #fff;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

img.square-white-out {
    width: 40%;
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center center;
}

img.integrated-solutions {
    width: 40%;
    float: left;
    margin-left: -10%;
    margin-right: -10%;
}

img.integrated-solutions-1 {
    background-image: url("https://eclecticksa.com/assets/images/integrated-solutions-1.jpg");
}

img.integrated-solutions-2 {
    background-image: url("https://eclecticksa.com/assets/images/integrated-solutions-2.jpg");
}

div.showcase {
	position: relative;
}

div.showcase a {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	min-height: 100%;
	min-width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
	color: #fff;
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: top;
}

div.showcase.graphic a {
    background-image: url("https://eclecticksa.com/assets/images/square-grey-border.svg");
}

div.showcase.interior a {
    background-image: url("https://eclecticksa.com/assets/images/square-white-out.svg");
}

div.showcase a:hover, div.showcase a:focus {
    background-image: url("https://eclecticksa.com/assets/images/square-white-out-grey-hover.svg");
}

div.showcase.blank a, div.showcase.blank a:hover, div.showcase.blank a:focus {
    background-image: url("https://eclecticksa.com/assets/images/square-grey-blank.svg");
}

div.showcase a span {
	visibility: hidden;
}

div.showcase a:hover span, div.showcase a:focus span {
	visibility: visible;
	margin-top: 15px;
}

div.projects-title {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

div.projects-title h5 {
    position: absolute;
    color: #c29f61;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

div.row.content-image {
    margin: 0;
	overflow: hidden;
}

div.row.content-image img {
    width: 100%;
}

div.gallery-header {
    width: 100%;
	padding: 35px 0;
    -webkit-box-shadow: inset 0px 75px 75px 0px rgba(0,0,0,0.5);
    -moz-box-shadow: inset 0px 75px 75px 0px rgba(0,0,0,0.5);
    box-shadow: inset 0px 75px 75px 0px rgba(0,0,0,0.5);
	color: #fff;
}

div.gallery-header a {
	color: #fff;
	display: block;
}

ul.gallery-navigation {
    color: #fff;
    text-transform: uppercase;
    font-family: "Trajan W01 Regular", "Janna LT W20 Regular";
	border-bottom: 1px solid #fff;
	margin-bottom: 35px;
	padding-bottom: 35px;
}

ul.gallery-navigation a {
    color: #fff;
    font-size: 0.813rem;
    padding: 8px 15px;
}

ul.gallery-navigation li {
    border: 1px solid rgba(255,255,255,0);
}

ul.gallery-navigation li:hover, ul.gallery-navigation li:focus, ul.gallery-navigation li.active {
    border: 1px solid rgba(255,255,255,1);
}

ul.gallery-navigation li.active a {
    background: transparent;
}

div.gallery-footer {
    width: 100%;
	padding: 35px 0;
}

div.gallery-footer a {
	display: block;
}

div.gallery-footer a.button {
	display: inline-block;
	width: 150px;
	margin: 5px 15px;
	color: #c29f61;
	border: 2px solid #c29f61;
	background: transparent;
    font-family: "Trajan W01 Bd";
}

div.gallery-footer a.button:hover, div.gallery-footer a.button:focus {
	color: #fff;
	background: #c29f61;
}

img.gallery-logo {
	padding: 10%;
	margin: -10% 0;
}

img.gallery-scale {
	transform: scale(1.5);
}

div.footer {
    background: #bb9556;
    color: #fff;
    padding: 15px 0;
    margin-top: 10vh;
}

div.footer a {
    color: #fff;
    padding: 0 10px;
}

div.footer p {
    margin: 10px 0;
    padding: 0;
}

div.copyright {
    background: #2e1d16;
    color: #bb9556;
    padding: 15px 0;
}

div.copyright p {
    margin: 0;
    padding: 0;
    font-size: 0.750rem;
}

/* Small only */
@media screen and (max-width: 39.9375em) {
    body {
        font-size: 1rem;
    }

    div.header img {
        height: 90px;
        padding: 10px 0;
    }
	
	div.orbit.cover {
		padding: 0 0 0 0;
	}

	div.shadow {
		width: 100%;
		margin-left: 0;
        -webkit-box-shadow: inset 0px 50px 50px 0px rgba(0,0,0,0.66);
        -moz-box-shadow: inset 0px 50px 50px 0px rgba(0,0,0,0.66);
        box-shadow: inset 0px 50px 50px 0px rgba(0,0,0,0.66);
    }
	
	div.content-countiner-1, div.content-countiner-2, div.content-countiner-3 {
		background-size: calc(100% + 1px);
	}

    div.row.sections {
        min-height: 100vw;
        padding-top: 0;
        margin-bottom: 0;
    }

    div.row.sections h4 {
        font-size: 0.750rem;
    }
	
    div.row.sections h6 {
        font-size: 0.625rem;
    }

    hr {
        margin: 50px 0;
    }
	
	div.row.content-text {
		background: #fff;
	}

    div.three-squares h5 {
        font-size: 0.750rem;
    }
	
	div.projects-title h5 {
		font-size: 0.875rem;
	}
	
	div.gallery-header {
		padding: 15px 0;
		font-size: 0.813rem;
		-webkit-box-shadow: inset 0px 30px 30px 0px rgba(0,0,0,0.5);
		-moz-box-shadow: inset 0px 30px 30px 0px rgba(0,0,0,0.5);
		box-shadow: inset 0px 30px 30px 0px rgba(0,0,0,0.5);
	}
	
	div.gallery-header h4 {
		font-size: 1rem;
	}
	
	div.gallery-footer {
		padding: 15px 0;
		font-size: 0.813rem;
	}
	
	div.showcase.interior img {
		padding: 1px;
	}
}

/* Medium and up */
@media screen and (min-width: 40em) {
    div.row.sections {
        min-height: calc(100vw - 35px);
    }
}

/* Medium only */
@media screen and (min-width: 40em) and (max-width: 63.9375em) {}

/* Large and up */
@media screen and (min-width: 64em) {
    div.row.sections {
        min-height: calc(62.500rem - 35px);
    }
}

/* Large only */
@media screen and (min-width: 64em) and (max-width: 74.9375em) {}