/**
 ** Constantinos Kalisperas
 ** Architectural Studio
 ** Designed by sfika.com
 ** 2016
 **
 ** Theme Color: #1ee3e3
 **
*/

@charset "utf-8";
@font-face {
  font-family: 'AvenirLTStd-Light';
  src: url('fonts/AvenirLTStd-Light.eot?#iefix') format('embedded-opentype'),  url('fonts/AvenirLTStd-Light.otf')  format('opentype'),
	     url('fonts/AvenirLTStd-Light.woff') format('woff'), url('fonts/AvenirLTStd-Light.ttf')  format('truetype'), url('fonts/AvenirLTStd-Light.svg#AvenirLTStd-Light') format('svg');
  font-weight: normal;
  font-style: normal;
}

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; vertical-align: baseline; }
ul, ol, li {list-style: none;}

body {line-height: 1; font-family: 'AvenirLTStd-Light' !important; background: #fff;}
a,
a:visited {text-decoration: none; color: #1ee3e3;}
h3 {font-weight: bold; font-size: 18px;}
.onlymob {display: none;}
.onlydes {display: block;}
.mb15 {margin-bottom: 15px;}
.mt10 {margin-top: 10px;} .mt15 {margin-top: 15px;} .mt30 {margin-top: 30px;}
.hide {display: none;}

#wrapper {position: relative; z-index: 0; background: #fff;}
.mm-menu.mm-offcanvas {z-index: 10;}

header {margin-top: 20px; height: 85px; margin-left: -220px; z-index: 9999;}
header .logo,
header .header-links,
header .header-links .top,
header .header-links .bottom {float: left;}
header .logo {width: 80px; height: 80px; background:url(constantinos-kalisperas-logo.svg) no-repeat center center; background-size: contain;}
header .header-links {margin-left: 20px; margin-top: 15px; width: 615px;}
header .header-links .top {border-bottom: 1px solid #ccc; padding-bottom: 7px; width: 100%;}
header .header-links .top h1 {float: left; color: #222; font-size: 17px; line-height: 17px; font-weight: bold;}
header .header-links .top p {float: right; color: #ccc; font-size: 10px; line-height: 10px; margin-top: 6px;}

header .header-links .bottom {margin-top: 8px;}
header .header-links .bottom li {float: left;}
header .header-links .bottom li a {
	display: block; font-size: 12px; color: #000; -moz-transition: all .2s ease-in; -o-transition: all .2s ease-in; -webkit-transition: all .2s ease-in; transition: all .2s ease-in;
}
header .header-links .bottom li a.link {padding: 3px 14px; border-right: 1px solid #222;}
header .header-links .bottom li a.social {padding: 2px 3px 2px 13px;}
header .header-links .bottom li:first-child a {padding-left: 0;}
header .header-links .bottom li:last-child a {padding-right: 0; border-right: 0;}
header .header-links .bottom li a.selected,
header .header-links .bottom li a:hover {color: #1ee3e3;}
.icon {
	display: inline-block; height: 14px; width: 14px; background-size: contain; text-indent: -9999px;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter: alpha(opacity=50); -moz-opacity: 0.5; -khtml-opacity: 0.5; opacity: 0.5;
}
.icon.facebook {background: url(icons/facebook-icon.svg) no-repeat top left;}
.icon.twitter {background: url(icons/twitter-icon.svg) no-repeat top left;}
.icon.instagram {background: url(icons/instagram-icon.svg) no-repeat top left;}
.icon:hover {-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; filter: alpha(opacity=30); -moz-opacity: 0.3; -khtml-opacity: 0.3; opacity: 0.3;}

.bg {
	position: absolute; top: 0; right: 0; width: 100%; height: 100%; background-attachment: fixed; background-position: bottom right; background-repeat: no-repeat;
	-webkit-background-size: contain; -moz-background-size: contain; -o-background-size: contain; background-size: contain; z-index: 0;
}

.row {position: relative; width: 100%; float: left; overflow: hidden; z-index: 999;}
.row.content {min-height: 605px; margin-bottom: 60px;}
.container {position: relative; width: 720px; margin: 0 auto;}

.col-offset,
.col-txt {position: absolute; height: 515px; top: 90px;}
.col-offset {left: 404px; width: 916px;}
.col-txt {left: 90px; width: 280px; font-size: 12px; line-height: 20px; color: #888;}
.col-img {position: absolute; width: 675px; height: 675px; top: 0; left: 402px;}

.car {text-align: right;}
.car a {display: block; float: left; margin: 0 20px 40px 0; -moz-transition: all .2s ease-in; -o-transition: all .2s ease-in; -webkit-transition: all .2s ease-in; transition: all .2s ease-in;}
.car a:hover {-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; filter: alpha(opacity=70); -moz-opacity: 0.7; -khtml-opacity: 0.7; opacity: 0.7;}

.pull-down {position: absolute; bottom: 0; left: 0;}
.item-title {color: #111; font-size: 17px; padding-bottom: 7px;}
.item-title small {display: block; font-size: 80%;}
.simple-list a {display: block; padding: 3px 0; margin: 5px 0; color: #000;}
.simple-list a:hover {color: #1ee3e3;}
.exhibition h3 {padding-bottom: 15px;}
.exhibition p {font-size: 11px;}
.hidepg {color: #333;}
.hidepg:hover {color: #1ee3e3;}


/* Slider Styling */
.unslider {margin: 0; padding: 0;}
.unslider-wrap {position: relative;}
.unslider-wrap.unslider-carousel>li {float: left;}
.unslider-vertical>ul {height: 100%;}
.unslider-vertical li {float: none; width: 100%;}
.unslider-fade {position: relative;}
.unslider-fade .unslider-wrap li {position: absolute; left: 0; top: 0; right: 0; z-index:8;}
.unslider-fade .unslider-wrap li.unslider-active {z-index: 10;}
.unslider li, .unslider ol, .unslider ul {margin: 0; padding: 0; border:none;}

.unslider-nav {position:absolute; bottom: -90px; right: -515px;}
.unslider-nav ol {text-align: right; font-size: 0;}
.img-nav {margin-top: 10px;}
.unslider-nav ol li,
.img-nav a {display: inline-block; margin: 0 5px; background: transparent; border-radius: 5px; overflow: hidden; text-indent: -999em; cursor: pointer;}
.unslider-nav ol li {width: 5px; height: 5px; border: 1px solid #bbb;}
.img-nav a {width: 8px; height: 8px; border: 1px solid #000;}

.img-nav a:first-child {margin-left: 0;}
.unslider-nav ol li.unslider-active,
.img-nav a.active {background: #111; cursor: default;}

.row.content.slideshow {min-height: 635px;}
.slideshow .unslider-nav {bottom: -120px; left: 0; right: -15px;}

.row.content.collection {min-height: 675px;}

/* pop */
.messagepop {
	display: none; position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 2147483647; text-align: center; white-space: nowrap;
	cursor: default; background: #fff; background: rgba(255,255,255,.9);
}
.messagepop form {margin: 140px auto; width: 320px;}
.messagepop input,
.messagepop select,
.messagepop .fl {width: 100%;}
.messagepop select,
.messagepop input[type=text] {padding: 8px 10px; border: 1px solid #999; box-sizing: border-box;}
.messagepop .close {position: absolute; top: 30px; right: 30px; width: 36px; height: 36px;}
.messagepop .inl {display: inline-block;}
.messagepop #commit {border: 0; background-color: #1ee3e3; color: #fff; cursor: pointer; padding: 10px 17px; text-transform: uppercase; font-size: 18px; width: auto;}


@media all{
	.featherlight{display:none;position:fixed;top:0;right:0;bottom:0;left:0;z-index:2147483647;text-align:center;white-space:nowrap;cursor:pointer;background:#333;background:rgba(0,0,0,0)}
	.featherlight:last-of-type{/*background:rgba(0,0,0,.8)*/ background: #fff; background: rgba(255,255,255,.9);}
	.featherlight:before{content:'';display:inline-block;height:100%;vertical-align:middle;margin-right:-.25em}
	.featherlight .featherlight-content{position:relative;text-align:left;vertical-align:middle;display:inline-block;overflow:auto;padding:25px 25px 0;border-bottom:25px solid transparent;margin-left:5%;margin-right:5%;max-height:95%;background:#fff;cursor:auto;white-space:normal}
	.featherlight .featherlight-inner{display:block}
	.featherlight .featherlight-close-icon{position:absolute;z-index:9999;top:0;right:0;line-height:25px;width:25px;cursor:pointer;text-align:center;font-family:Arial,sans-serif;background:#fff;background:rgba(255,255,255,.3);color:#000}
	.featherlight .featherlight-image{width:100%}
	.featherlight-iframe .featherlight-content{border-bottom:0;padding:0}
	.featherlight iframe{border:0}
}


@media (max-width: 1760px){ .car {left: 300px;} .unslider-nav {right: -410px;} }

@media (max-width: 1590px){ .car {left: 200px;} .unslider-nav {right: -310px;} }

@media (max-width: 1400px){ .car {left: 100px;} .unslider-nav {right: -210px;} }

@media (max-width: 1200px){
	header {margin-left: -120px;}
	.col-offset {left: 304px;}
	.col-txt {left: 0;}
	.car {left: 0;}
	.unslider-nav {right: -110px;}
}

@media only screen and (max-width:1024px){
	header {margin-left: -80px;}
	.featherlight .featherlight-content {margin-left: 10px; margin-right: 10px; max-height: 98%; padding: 10px 10px 0; border-bottom: 10px solid transparent;}
	.car {left: -50px;}
	.unslider-nav {right: -60px;}
}

@media (max-width: 920px){
	header {margin-left: 0;}
	.col-offset {left: 300px; width: 420px}
	.car {left: 0; width: 720px; height: 500px; text-align: center;}
	.car a {margin: 0 0 30px 10px;}
	.car a img {width: 170px; height: 160px;}
	.unslider-nav {right: 40%;}
}

@media (max-width: 768px){
	.onlymob {display: block;}
	.onlydes {display: none;}
	
	header .logo {position: relative; left: 50%; margin-left: -42px;}
	header .header-links {margin-left: 0; width: 100%;}
	header .header-links .top {padding-bottom: 9px;}
	header .header-links .top h1 {text-align: center; width: 100%;}
	header .header-links .top p {display: none;}
	
	header .header-links .bottom {width: 100%; text-align: center;}
	header .header-links .bottom li {float: none;}
	header .header-links .bottom li a.link {padding: 4px 5px; border-right: 0;}
	
	.row.content {margin-bottom: 20px; height: auto;}
	.col-txt,
	.container {width: 100%; padding: 0 10px; box-sizing: border-box;}
	.col-txt,
	.col-offset,
	.col-img,
	.pull-down {position: relative; margin-left: 0; margin-top: 30px; width: 100%; text-align: center; left: 0; top: 0;}
	
	.row.content,
	.row.content.collection {min-height: auto;}
		
	.col-img, .col-txt {height: auto;}
	.responsive {max-width: 100%; height: auto; display: block;}
	
	.car {height: 500px;}
	.car a {display: inline; float: none;}
	.unslider-nav {position: relative; margin-top: 46px; bottom: 0; right: 0; left: 0; width: 100%;}
	.unslider-nav ol {text-align: center;}
	
	.mob-copyright {text-align: center; color: #ccc; font-size: 12px; padding: 30px 5px;}
}

@media (max-width: 580px){ .car {height: 650px;} }

@media (max-width: 403px){ .car {height: 1310px;} }