@font-face {
    font-family: 'CalibreWeb-Thin';
    src: url('/fonts/CalibreWeb-Thin.eot');
    src: url('/fonts/CalibreWeb-Thin.eot?#iefix') format('embedded-opentype'),
         url('/fonts/CalibreWeb-Thin.woff2') format('woff2'),
         url('/fonts/CalibreWeb-Thin.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'CalibreWeb-Medium';
    src: url('/fonts/CalibreWeb-Medium.eot');
    src: url('/fonts/CalibreWeb-Medium.eot?#iefix') format('embedded-opentype'),
         url('/fonts/CalibreWeb-Medium.woff2') format('woff2'),
         url('/fonts/CalibreWeb-Medium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
*, *:after, *:before {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
* {-moz-font-feature-settings: "liga" 0; font-feature-settings: "liga" 0; -webkit-font-feature-settings: "liga" 0;}

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit;}

article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {display: block;}
html {font-family: sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; height: 100%;}
body.overflow-hidden {overflow: hidden;}
ol, ul {list-style: none;}
blockquote, q {}

*, div, p {
	font-feature-settings: "liga" 0;
	-webkit-font-feature-settings: "liga" 0;
	-moz-font-feature-settings: "liga" 0;
	font-variant:normal;
}

blockquote:before,blockquote:after,q:before,q:after {font-size: 3em; position: absolute;}
blockquote:before {margin-left: -15px; margin-top: 6px; content:"\201C";}
blockquote:after {margin-left: 6px; margin-top: 6px; content:"\201D";}
*{margin:0; padding: 0;}
.clear:before,.clear:after { content: ""; display: table;}
.clear:after, .clear-both { clear: both;}
    
body {height: 100%; margin: 0; font-family: 'CalibreWeb-Thin'; font-size: 14px; color: #0c233f; overflow-x:hidden; line-height: 14px; position: relative;}

h1, h2 {font-family: 'CalibreWeb-Thin'; line-height: 1em; font-size: 2.2em; letter-spacing: 0.06em; padding: 0; margin: 0;}
h2 {font-family: 'CalibreWeb-Medium'; font-size: 1.7em; font-weight: normal;}

a {text-decoration:none; outline: none; color: inherit;}
a:hover {text-decoration:none;}

img {border: 0; width:100%; display: block;}
svg:not(:root) {overflow: hidden;}

button {overflow: visible;}
button, select {text-transform: none;}
button, html input[type="button"], input[type="reset"], input[type="submit"] {-webkit-appearance: button; cursor: pointer;}
button[disabled], html input[disabled] {cursor: default;}
button::-moz-focus-inner, input::-moz-focus-inner {border: 0; padding: 0;}
input {line-height: normal;}
    
header {height: 120px; position:fixed; z-index:5000; background-color:#FFF; top:0; width: 92%; left: 0; right: 0;}
aside {display: block;}
/* Clear Fix */
.group:after {visibility: hidden; display: block; content: ""; clear: both; height: 0;}
* html .group             {zoom: 1;} /* IE6 */
*:first-child+html .group {zoom: 1;} /* IE7 */

.float-left {float:left;}
.float-right {float:right;}

.page-wrap {padding-left: 4%; padding-right: 4%; width: 100%; max-width: 1420px; margin: 0 auto;}
    
.logo {float: left; width: 181px; margin-top: 34px; margin-left: 20px; display: block;}
    
.nav-cover {text-align: right; top: 50px; position: relative;}
.nav-cover ul li {display: inline-block; margin-left: 30px;}
.nav-cover ul li:first-child {margin-left:0 !important;}
.nav-cover ul li a {color: inherit; font-size: 1.2em; text-transform: uppercase;}
.nav-cover ul li a:hover {text-decoration:underline;}    
.nav-cover ul li a.selected {/*pointer-events: none; */font-family: 'CalibreWeb-Medium';}
    
.mobile-menu {width:29px !important; position:absolute; right:35px; top:53px; z-index:600; cursor:pointer !important;}
#show-mobile {display:none;}
    
/*========== Full Width Mobile menu ==========*/
.hamburger {padding: 0; display: inline-block; cursor: pointer; transition-property: opacity, -webkit-filter; transition-property: opacity, filter; transition-property: opacity, filter, -webkit-filter; transition-duration: 0.15s; transition-timing-function: linear;  font: inherit; color: inherit; text-transform: none; background-color: transparent; border: 0; margin: 0; overflow: visible;}
.hamburger:hover {opacity: 0.7;}
.hamburger-box {width: 32px; height: 24px; display: inline-block; position: relative;}
.hamburger-inner {display: block; top: 50%; margin-top: -2px;}
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {width: 32px; height: 2px; background-color: #0c233f; border-radius: 2px; position: absolute; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; transition-duration: 0.15s; transition-timing-function: ease;}
.hamburger-inner::before, .hamburger-inner::after {content: ""; display: block;}
.hamburger-inner::before {top: -10px;}
.hamburger-inner::after {bottom: -10px;}
.hamburger--3dx .hamburger-box {-webkit-perspective: 80px; perspective: 80px;}
.hamburger--3dx .hamburger-inner {transition: background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1); transition: transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);  transition: transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1), background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);}
.hamburger--3dx .hamburger-inner::before, .hamburger--3dx .hamburger-inner::after {transition: -webkit-transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1); transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1); transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);}
.hamburger--3dx.is-active .hamburger-inner {background-color: transparent; -webkit-transform: rotateY(180deg); transform: rotateY(180deg);}
.hamburger--3dx.is-active .hamburger-inner::before {-webkit-transform: translate3d(0, 10px, 0) rotate(45deg); transform: translate3d(0, 10px, 0) rotate(45deg);}
.hamburger--3dx.is-active .hamburger-inner::after {-webkit-transform: translate3d(0, -10px, 0) rotate(-45deg); transform: translate3d(0, -10px, 0) rotate(-45deg);}
/*========== End. Full Width Mobile menu ==========*/    
    
.main-content {margin-top: 120px;}
p {letter-spacing: 0.045em; padding-bottom: 14px; line-height: 1.35em !important; font-size: 1.26em;}
.highlight-text {font-family: 'CalibreWeb-Medium'; color: inherit; text-decoration: none;}
.page a:hover {text-decoration:underline;}    

/* ============================= HOME ================================ */

img {display: block; width: 100%}
.home .main-content {display: flex; margin-bottom: 10px;}
.content-text {flex: 0 0 43.5%; background: #fff;}
.content-text p {font-size: 1.37em;}
.content-wrap {padding-left: 20px; padding-right: 50px; padding-bottom: 30px;}
.content-image {flex: 0 0 56.5%; background-image: url(/images/featured/sonja-feature.jpg); background-size: cover; background-repeat: no-repeat; background-position: top 50% center 0; min-height: 400px !important; position: relative;}

.image-text {position: absolute; padding-top: 15px;}
.image-heading {padding: 0; margin: 0; background: #fff; padding-top: 4px; padding-bottom: 4px; text-indent: 15px; padding-right: 15px; float: left; clear: both; letter-spacing: 0.06em;}
.image-text p {font-size: 1.3em; margin-bottom: 4px;}
.image-text h1 {font-size: 1.8em; margin-bottom: 11px; text-transform: uppercase;}
.image-text a {font-size: 1.08em; line-height: 1.1em; padding-top: 6px; padding-bottom: 6px; background: #0c233f; color: #fff; margin-bottom: 7px; text-transform: uppercase; display: block; border: 2px solid #0c233f}
.image-text a:hover {background: #fff; color: #0c233f;}

.home .item-row {display: inline-flex; width: 100%; margin-bottom: 10px;}
.home .second-row {justify-content: space-between; margin-bottom: 0;}
.home h1 {padding-bottom: 28px; padding-top: 15px;}  
.home .image-text h1 {padding-bottom: 10px; padding-top: 11px;}  

.item-cell {flex: 1; min-width: 200px; border-right: 10px solid #fff; height: 160px; position: relative;}
.item-cell a {width: 100%; height: 100%; display: block; position: relative;}
.item-text {padding-top: 15px; padding-left: 16px; font-size: 1.82em; letter-spacing: 0.05em; text-transform: uppercase; line-height: 1em;}
.ph-span {font-size: 0.73em !important;}
.follow-span {font-size: 0.6em !important; text-transform: none;}
.quote-text {font-size: 1.3em; letter-spacing: 0.02em; line-height: 1.36em; margin: 0 auto; width: 61%; position: relative; top: 50%; transform: translateY(-50%);}
.text-bot-space {padding-bottom: 5px;}
.cell-fixed {width: 200px; flex: none;}

#item-4, #item-7 {border-right: none;}    
#item-1 {background: url(/images/home/panel-bg-1.jpg); background-position: top center; background-repeat: no-repeat; background-size: cover;}
#item-2 {background: #e5f0f8;}
#item-3 {background: url(/images/home/panel-bg-3.jpg); background-position: top center; background-repeat: no-repeat; background-size: cover;}
#item-4 {background: #f1f1f2;}
#item-5 {background: #f1f1f2; text-align: center;}
#item-6 {background: url(/images/home/panel-bg-6.jpg); background-position: top center; background-repeat: no-repeat; background-size: cover;}
#item-7 {background: url(/images/home/panel-bg-7.jpg); background-position: top center; background-repeat: no-repeat; background-size: cover;}
    
@media only screen and (max-width: 900px) {
    .home .main-content {display: block}
    .content-text {flex: none; width: 100%; display: block;}
    .content-wrap {padding: 0; padding-bottom: 22px;}
    .content-image {flex: none !important; width: 100%; display: block;}
}
@media only screen and (max-width: 880px) {
    .home .item-row {display: block;}
    .item-cell {flex: none; min-width: 100px; width: 50%; border: none; display: inline-block; float: left;}
    #item-1, #item-3 {border-right: 10px solid #fff;}
    #item-1, #item-2, #item-5, #item-6 {margin-bottom: 10px;}
    .home .second-row .item-cell {flex: none; width: 100% !important; float: none;}
}
@media only screen and (max-width: 420px) {
    .item-cell {width: 100%; border-right: none !important; margin-bottom: 10px;}
    #item-7 {margin-bottom: 0;}
}
/* ============================= END HOME ================================ */


 /* ============================= PAGES ================================ */
.page {position: relative; min-height: 100%; display: flex; flex-direction: column;}
.page .main-content {padding-top: 25px; flex: 1}
.content-side {float: left; width: 32.5%; min-height: 300px; padding-bottom: 20px;}
.content-main {float: right !important; width: 64.5%; padding-bottom: 20px;}
.side-wrap {padding: 20px; padding-left: 22px; padding-right: 37px;}
.side-wrap a {text-decoration: underline;}
.side-wrap h1 {margin-bottom: 25px; text-transform: uppercase; font-size: 2em;}
.content-section {padding-top: 18px; padding-bottom: 12px; margin-bottom: 10px; border-bottom: 1px solid #0c233f;}
.article-page .content-section {border-bottom: none !important;}
.content-section h2 {padding-bottom: 18px; font-size: 1.5em; text-transform: lowercase;}
.content-section p {line-height: normal;}
.section-link a {text-decoration: none !important;}
.section-link a:hover h2 {text-decoration: underline;}
.last-section {border-bottom: none;}

.sub-menu li a {line-height: 1.3em; font-size: 1.3em; letter-spacing: 0.04em; text-decoration: none;} 
.sub-menu li .selected {font-family: 'CalibreWeb-Medium';}

.content-featured .swiper-wrapper {padding-bottom: 10px;}
.content-featured .swiper-slide {position: relative}
.image-desc {padding-top: 15px; padding-left: 5px; padding-right: 5px; min-height: 100px; padding-bottom: 10px;}
.content-featured .swiper-button-next {top:45%;}
.content-featured .swiper-button-grey {top:45%;}
.content-featured .swiper-pagination {top:80%;}

.footer-menu {float:left; margin:0; padding:0; list-style:none; margin-left: 20px; margin-top: 15px; margin-right: 5.5%; padding-top: 10px; border-top: 1px solid #0c233f; padding-bottom: 12px;}
.footer-menu li {line-height: 1.3em; font-size: 1.3em; letter-spacing: 0.04em;}
.main-link {font-family: 'CalibreWeb-Medium';}
@media only screen and (max-width: 840px) {
    .content-side, .content-main {float: none; width: 100%;}
    .content-side {margin-bottom: 15px; min-height: auto !important;}
    .content-section {margin-left: 20px; margin-right: 20px;}
}

/*================   CONTACT US   =================*/
.form-wrap {width:66%;}
.form {width:88%;}
.form h2 {font-size:1.5em}
.form p {margin-bottom:15px;}
.feedback-input {
	color:#0c233f;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 16px;
	border-radius: 0;
	line-height: 1.2em;
	background-color: #f3f3f4;
	padding: 10px 10px 9px 45px;
	margin-bottom: 10px;
	width:100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	border: 1px solid #f3f3f4;
}
.feedback-input:focus{background: #f3f3f4; box-shadow: 0; border: 1px solid #f3f3f4; outline: none;}

.focused {color:#0c233f;border:1px solid #0c233f;}

/* Icons ---------------------------------- */
#formname {background-image: url(/images/form/name.svg) !important;	background-size: 22px 22px;	background-position: 11px 7px;	background-repeat: no-repeat;}
#formname:focus{background-image: url(/images/form/name.svg);background-size: 22px 22px;	background-position: 8px 5px;background-position: 11px 7px;	background-repeat: no-repeat;}
#formph {background-image: url(/images/form/phone.svg);	background-size: 22px 22px;	background-position: 11px 7px;	background-repeat: no-repeat;}
#formph:focus{background-image: url(/images/form/phone.svg);background-size: 22px 22px;background-position: 8px 5px;background-position: 11px 7px;	background-repeat: no-repeat;}
#formemail {background-image: url(/images/form/email.svg); background-size: 22px 22px; background-position: 11px 7px; background-repeat: no-repeat;}
#formemail:focus{background-image: url(/images/form/email.svg);	background-size: 22px 22px;	background-position: 11px 7px;background-repeat: no-repeat;}
#formcomment{background-image: url(/images/form/comment.svg);background-size: 22px 22px;	background-position: 11px 7px;background-repeat: no-repeat;}

textarea {width: 100%; height: 150px; line-height: 1em; resize:vertical;}

::-webkit-input-placeholder {color:#ccc;}
:-moz-placeholder {color:#ccc;}
::-moz-placeholder {color:#ccc;}
:-ms-input-placeholder {color:#ccc;}
    
.input-text:hover, textarea:hover {border:1px solid #0c233f;}
.input-text:focus, textarea:focus {background-color:white; border:1px solid #0c233f;}
.submit {margin-top: 0;}
/*.submit-button {padding-left:4%; padding-right:4%; padding-top:1.8%; padding-bottom:1.8%;}*/

.submit-button {padding-left:4%; padding-right:4%; padding-top:1.8%; padding-bottom:1.8%; font-size:1.1em; display:block; color: #FFFFFF; text-decoration:none; background-color:#0c233f; border:2px solid #0c233f; cursor:pointer;}
.submit-button:hover {color: #0c233f; text-decoration:none; background-color:#FFFFFF;}

.fa-2x {font-size: 1.5em;}

#map_canvas {margin-top:10px; margin-bottom:22px; width: 100%; height: 400px;}
    
.box-wrapper {display:none;}
.box-detail ul {padding:0; margin:0}
.box-inner {background:url(/images/generic/map-arrow.png) left no-repeat;}
.box-detail {color:#FFF; font-size:1.25em; padding:6px; margin-left:10px; background-color:#0c233f; height:150px; width:245px;}
.infoclose {width: 15px !important;}

.contact-social {float:right;}
.contact-social a {float:left; margin-right:6px; text-decoration:none !important; cursor:pointer !important;}
.contact-social a .icon {width:26px; height:26px; background-color:#0c233f; text-align:center; line-height:26px; display:table; border:2px solid #0c233f}
.contact-social a:hover > .icon {background-color:#FFF; border:2px solid #0c233f}
.contact-social a .icon i {color:#fff; font-size:1.2em; display:table-cell; vertical-align:middle;}
.contact-social a:hover > .icon i {color:#0c233f;}
#form-messages {padding-top:2%; padding-bottom:1%; font-size:1.2em; color:#646462;}
.error {color:#0c233f;}
    
.contact-details {list-style:none;}
.contact-details-item {display:block;clear:both; padding-bottom:12px !important; min-height:15px; margin-bottom: 7px;}
.contact-detail-icon {float:left;margin-right:5px;width:35px;margin-left:10px; padding-top: 3px;}
.contact-detail-text {float:left;padding-top:2px;}
.contact-detail-text a {color:#FFF;	border-bottom:1px solid #666;}
.contact-detail-text a:hover {border-bottom:1px dotted #fff;}
.contact-detail-icon .fa-2x {font-size: 1.4em !important;}

.social-share {padding-top:5px;}

.footer {background: #f1f2f2; padding-top: 15px; padding-bottom: 15px;}

/* --------------  ARTISTS  -----------------------*/

.artist-list {padding: 0; border-bottom: none;}
.artist-list ul {list-style: none !important;}
.artist-list .item {position:relative; min-width: 30%; display: inline-block; list-style: none !important;}
.artist-list .item a {display: block; border: 2px solid #f1f1f2; width: 100%; height: 100%;}
.artist-list .item a .item-text {
    background: #f1f1f2; text-transform: none; line-height: normal;
    line-height: normal; padding: 0; margin: 0; text-align: center;
    padding-top: 8px; padding-bottom: 8px; font-size: 1.15em;
} 
.artist-list .item a,.artist-list .item a .item-text  {
    -o-transition:all .5s ease-in-out;
 -ms-transition:all .5s ease-in-out;
 -moz-transition:all .5s ease-in-out;
 -webkit-transition:all .5s ease-in-out;
 transition:all .5s ease-in-out;
}       
.artist-list .item a:hover {border: 2px solid #0c233f; text-decoration: none !important;}
.artist-list .item a:hover > .item-text {background: #0c233f; color: #ffffff;}
.artist-list .item a img {opacity: 0.6;}
.artist-list .item a:hover > img {opacity: 1;}

.artist-search {font-size:0.95em; padding-left:5px; padding-right:5px; padding-top:4px; padding-bottom:4px; width:97%; color:#0c233f; outline: none;}

.artist-detail .artist-list .item a img {opacity: 1;}
.artist-detail .artist-list .item a .item-text {padding-left: 10px; padding-right: 10px;}
.artist-detail .side-wrap h1 {text-transform: lowercase}
.artist-detail .side-wrap p {font-size: 1.2em; padding-bottom: 10px;}
.detail-profile {padding-bottom: 5px; margin-top: 8px;}
.detail-profile p {font-size: 1.1em !important; color:#717171;}
.artist-detail .read-more {display: block; margin-top: 15px; text-align:right; width: 100%; margin-bottom: 5px; font-size: 1.15em; text-decoration: none;}
.artist-detail .read-more:hover {text-decoration: underline;}
.search-wrap {clear: both; padding-top: 15px; border-top: 1px solid #0c233f; margin-top: 20px;}
.artist-detail .contact-social {float: right;}

/*--------------  QUESTIONS  -----------------*/
#accordion {padding-top: 10px; padding-bottom: 40px;}
.q-question {padding-bottom:6px; padding-top:5px;}
.q-link {width:100%; display:block; text-decoration:none; padding-top: 5px; position: relative;}
.q-link:hover {text-decoration:none !important;}
.q-link h2 {font-size:1.3em; padding:0; margin:0; line-height:1.3em;}
.q-link h2:hover {text-decoration:none;}
.q-text {clear:both; font-size: 1.1em; display:none; padding-bottom: 15px;}
.q-text p {padding:0; margin:0; font-size:1.02em; padding-top:6px; padding-bottom:6px;}
.q-line {border-bottom:1px solid #0c233f; padding-top:5px;}
    
.plus {position: absolute; right: 25px; width: 15px; height: 15px; margin-top: -15px; opacity: 1;}
.plus:before, 
.plus:after {position: absolute; left: 15px; content: ' '; height: 15px; width: 2px; background-color: #0c233f;}
.plus:before {transform: rotate(90deg);}
.plus:after {transform: rotate(0deg);} 

.close:after {display: none;} 
/*--------------  END QUESTIONS  -----------------*/

.page-button {padding-left:8px; padding-right:8px; padding-top:5px; padding-bottom:5px; font-size:1.15em; text-transform: uppercase; text-decoration: none !important; display:inline-block; color: #FFFFFF; background-color:#0c233f; border:2px solid #0c233f; cursor:pointer; line-height: normal; margin-top: 4px;}
.page-button:hover {color: #0c233f; text-decoration:none; background-color:#FFFFFF; border:2px solid #0c233f;}

#who-side {background: #eaf6f3;}
#what-side {background: #f4ebdf;}
#work-side {background: #d2d3d4;}
#artists-side {background: #fdf4ec;}
#artist-side {background: #fff;}
#contact-side {background: #f3f3f4;}
#questions-side {background: #e6f2fa;}

/* ============================= END PAGES ================================ */

@media only screen and (max-width: 980px) {	
	#show-mobile {display:block;}
	.nav-cover {display:none; height:100vh; background:#fff; text-align:center; position:absolute; width:100%; top:105px;		
	}
	.nav-cover ul {float:none !important; margin:0 auto;}
	.nav-cover ul li {padding:0 !important; line-height:65px; font-size:1.4em; text-align:left; display: block;}
    .nav-cover ul li:first-child {margin-left:30px !important;}
	.nav-cover ul li a {display:block; line-height:65px; border:none;}
	.nav-cover ul li a:hover {color:#666;}
}
@media only screen and (max-width: 900px) {
    .logo {width: 160px; margin-top: 28px; margin-left: 0;}
    .mobile-menu {right:25px;}
    header {height: 105px;}
    .main-content {display: block; margin-top: 105px;}
}
@media only screen and (max-width: 955px) {
    .box-detail {font-size:1.2em; padding:4px; margin-left:4px; height:130px; width:180px;}
    .contact-details {margin-top: 10px;}
    .contact-details-item {margin-bottom: 6px; margin-left: 8px;}
    .contact-detail-icon {display: none}
    .contact-detail-text {float:left;}
}