/*
Theme Name: swap
Author: Dicky
Author URI: http://swwwap.hk
Description: This is a  bootstrap theme for wordpress. 
Version: 1.0
License: swwwap
*/

html,body{background: #FFF;width: 100%;overflow-x: hidden}


	

.popup-events,.popup-event-inner,.popup-bg,.filter-btn,.scroll-header,.programme-left,.programme-right,.left-bg,.right-bg,.popup-pro,.disclaimer-wrap,.calendar-block{
  -webkit-transition: all 1200ms cubic-bezier(0.23, 1, 0.32, 1);
  -moz-transition: all 1200ms cubic-bezier(0.23, 1, 0.32, 1);
  -o-transition: all 1200ms cubic-bezier(0.23, 1, 0.32, 1);
  transition: all 1200ms cubic-bezier(0.23, 1, 0.32, 1);
}	
.event-btn,.event-btn i,.back-to-top,.menu-wrap{
  -webkit-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  transition: all 200ms linear;
}	

.more-info{
  -webkit-transition: all 600ms linear;
  -moz-transition: all 600ms linear;
  -o-transition: all 600ms linear;
  transition: all 600ms linear;
}	

	



a,a:hover,a:visited,a:focus{color: #20232a;text-decoration: none;outline: none}

.desktopv{display: block !important}
.ipadv{display: none !important}
.mobilev{display: none !important}

.color-red{ color: #D93534}
.color-blue{ color: #3C434E}

.mobile-version{display: none;background: #FFF;position: fixed;width: 100%;height: 100%;top:0;left: 0;z-index: 9999;text-align: center;padding: 40% 0}

section{padding: 60px 0}
.btn-more{background: #D93534;display: inline-block;padding: 6px 28px 6px 30px;-webkit-border-radius: 20px;
-moz-border-radius: 20px;border-radius: 20px;}
.btn-more h6{color: #FFF}
.view-more{background: url(img/arrow.png) right center no-repeat;background-size: 14px;padding-right: 20px}
a.color-white{color: #FFF !important}
.header-bar{width: 100%;height: 6px;position: absolute;left: 0;top:0;background:#D93534 }
.filter-btn{-webkit-border-radius: 20px;-moz-border-radius: 20px;border-radius: 20px;background: #FFF;display: inline-block;float: right;padding: 4px 20px;margin-left: 20px;cursor: pointer}

.filter-btn.active,.filter-btn:hover{background: #3C434E;color: #FFF}

.cat-dot{width:24px;height: 24px;background: url(img/dot.svg) center center no-repeat;background-size: 14px;}
.design-talk-workshop .cat-dot{background: url(img/dot4.png) center center no-repeat !important;background-size: 100% !important;}
.design-challenge .cat-dot{background: url(img/dot2.png) center center no-repeat !important;background-size: 100% !important;}
.open-studio .cat-dot{background: url(img/dot6.png) center center no-repeat !important;background-size: 100% !important;}
.design-exhibtion .cat-dot{background: url(img/dot3.png) center center no-repeat !important;background-size: 100% !important;}
.networking-events .cat-dot{background: url(img/dot5.png) center center no-repeat !important;background-size: 100% !important;}
.design-pop-up-creative-market .cat-dot{background: url(img/dot1.png) center center no-repeat !important;background-size: 100% !important;}


.left-bar{position: fixed;top:0;left: 0;width: 12px;height: 100%;background: url(img/left-bar.png) top center no-repeat;background-size: cover ;z-index: 9999}
.header-wrap{margin-bottom: 10px}


/* menu */
header{width: 100%;padding:20px 0}
.event-btn{position: fixed;width: 60px;height: 60px;background: #3C434E url(img/calendar.svg) center center no-repeat;background-size: 40px;right: 0;top:0;z-index: 12;text-align: center;cursor: pointer}
.event-btn:hover{opacity: .9}
.event-btn.active{background:#3C434E}
.event-btn i{color: #FFF;font-size: 48px;line-height: 68px;opacity: 0}
.event-btn.active i{opacity: 1}
.menu-wrap{position: relative;margin-top: 8px}
.lang,.ss-icon{float: right;display: inline-block}
.ss-icon span{width: 22px;height: 22px;;position: relative;float: left;margin-right: 10px;margin-top: -4px}
.ss-icon{margin-right: 10px}
.ig-icon{background: url(img/icon-ig.svg) center center no-repeat;background-size: 22px}
.fb-icon{background: url(img/icon-fb.svg) center center no-repeat;background-size: 22px}
.you-icon{background: url(img/icon-you.svg) center center no-repeat;background-size: 22px}

.menu-list{position: relative;float: right;display: inline-block;}
.menu-list li{float: left;margin-left: 30px;margin-top: 30px}
.menu-list li h6 	{ font-size:17px;line-height: 18px;letter-spacing: .4px}

.scroll-header{position: fixed;top:-120px;width: 100%;background: #FFF;z-index: 10;border-bottom: 1px solid #EEE}
.scroll-header.active{top:0}
.scroll-header ul li{margin: 22px 0 20px 30px}
ul .lang-item-first{border-right: 1px solid #4a4a4a;padding-right: 10px !important}
.lang-list li{padding: 0 0 0 10px ;float: left}

/* footer */
footer {background: #3C434E;padding: 20px 0 10px 0}
footer .support-logo{position: relative;float: right;margin-left: 10px;width:148px}
footer .support-logo h6{float: right;display: block;width: 100%;text-align: right}
.back-to-top{cursor: pointer}
.back-to-top:hover{color: #FFF}
.disclaimer{position: absolute;bottom:-50px}

/* home */
.home-video-block{width: calc(100% - 80px);background: #EEE;margin-left: 80px;overflow: hidden}
#video{
 position: relative;
 background: transparent;
}

.ytplayer-container{
 position: relative;
 margin-top: -20px
}
section.landing-slider{padding-top: 0;padding-bottom: 0}
.flexslider{margin-bottom: 0;margin-left: 80px;position: relative;}
.slider-nav{width: 100%;height: 4px;position: absolute;bottom: 0;left: 0;z-index: 9}
/*.slider-nav li{width: 25%;height: 6px;background: #999;float: left;border-right: 2px solid #ECF4F4}
.slider-nav li.active{height:120px;background: #3C434E;margin-top: -84px}*/
.flex-direction-nav a{display: none}
.slider-info{position: absolute;right: 20px;bottom:-70px;width: 420px;height: auto;background: rgba(216,52,52,.9);z-index: 9;padding:20px}
section.landing-slider .flex-control-nav li{float: none;display: block;margin-bottom: 10px}
section.landing-slider .flex-control-nav{left: -40px;bottom:-10px}
.flex-control-paging li a{width: 8px;height: 8px}
.home-img{width: 100%;height: 620px;}
.home-loader{position: absolute;width: 100%;height: 6px;background: #FFF;bottom:-6px;left: 0;z-index: 9}
.home-load-inner{position: absolute;width: 60%;height: 6px;background:#3C434E }

.tagline .flex-control-nav{display: none}
.core-list {width: 100%}
.core-list li{width: 20%;position: relative;float: left;height: 320px;background: #3C434E;border-left: 2px solid #FFF;border-right: 1px solid #FFF;padding: 120px 0}
.core-list li:nth-child(1){background: rgba(255,50,35,1)}
.core-list li:nth-child(2){background: rgba(255,91,71,1)}
.core-list li:nth-child(3){background: rgba(255,132,123,1)}
.core-list li:nth-child(4){background: rgba(255,173,167,1)}
.core-list li:nth-child(5){background: rgba(255,214,211,1)}




.core-list li:nth-child(1) .top-bg{background: url(img/core/1t.png) center top no-repeat;}
.core-list li:nth-child(1) .bottom-bg{background: url(img/core/1b.png) center bottom no-repeat;}
.core-list li:nth-child(2) .top-bg{background: url(img/core/2t.png) center top no-repeat;}
.core-list li:nth-child(2) .bottom-bg{background: url(img/core/2b.png) center bottom no-repeat;}
.core-list li:nth-child(3) .top-bg{background: url(img/core/3t.png) center top no-repeat;}
.core-list li:nth-child(3) .bottom-bg{background: url(img/core/3b.png) center bottom no-repeat;}
.core-list li:nth-child(4) .top-bg{background: url(img/core/4t.png) center top no-repeat;}
.core-list li:nth-child(4) .bottom-bg{background: url(img/core/4b.png) center bottom no-repeat;}
.core-list li:nth-child(5) .top-bg{background: url(img/core/5t.png) center top no-repeat;}
.core-list li:nth-child(5) .bottom-bg{background: url(img/core/5b.png) center bottom no-repeat;}

.core-list li .top-bg{position: absolute;width: 100%;height: 100%;top:0;left: 0;background-size: 100% auto !important;pointer-events: none}
.core-list li .bottom-bg{position: absolute;width: 100%;height: 100%;bottom:0;left: 0;background-size: 100% auto !important;pointer-events: none}

section.tagline{padding:220px 0 0 0;margin-top:-120px}
.tagline{background: #ECF4F4}
.text-slider ul{overflow: hidden;margin-bottom: 20px}
.text-slider .flex-control-nav{float: none;position: relative;text-align: center ;bottom:0}


section.coreprogramme{}
.featureprogramme{background: #ECF4F4}
.featureimg{width: 100%;height: 280px;background: #FFF}
.featureimgL,.featureinfoL{height: 420px}
.featureinfo{padding: 20px; background: #FFF;position: relative;min-height: 220px}
.featureinfo h5{padding-right: 40%}
.info-border{position: absolute;width: 100%;height: 6px;background: #CCC;bottom:0;left: 0}
.info-date{position: absolute;right: 20px;bottom:18px}
.view-more{position: absolute;left:20px;bottom:20px}

.home-news-block{padding: 40px;overflow: hidden;position: relative}
.home-news-block h5{padding:0 60px}
.news-ball{width: 200px;height:200px;background: #ccc;;-webkit-border-radius: 200px;
-moz-border-radius: 200px;border-radius: 200px;margin: 20px auto}
.active-s .news-ball{}
.owl-carousel{width: 240%;margin-left: -70%;margin-bottom: 20px}
.owl-nav{display: none}
.owl-prev{position: absolute;left: 20px;bottom: 60px;display: inline-block;cursor: pointer}
.owl-next{position: absolute;right: 20px;bottom: 60px;display:inline-block;cursor: pointer}

.home-loader{display: none}

/* about */
.about-landing{padding: 0;background: #D93534}
.about-detour{background: #D93534;padding: 120px 0}
.contact{background: #ECF4F4}
.past-detour{background: #ECF4F4}
.past-detour-block .view-more{position: relative;bottom:auto;left: auto;display: inline-block}
.past-img-block{width: 100%;height: 160px;background: #EEE;margin-bottom: 20px}
.past-detour-block{border-bottom: 2px solid #FFF;padding-bottom: 20px;margin-bottom: 40px}
#map2{width: 100%;height: 480px;background: #20232a}
.about-ss{margin-top: -130px;padding-bottom: 0}
.about-wrap{background: #FFF;padding: 40px;padding-right: 10%;padding-left: 10%}
.about-logo-block{width: 220px;height: 120px;background: #EEE;margin-bottom: 20px;background-size: contain !important}
.sponsor-p{margin-bottom: 40px}
.about-satelliteevent{background:#D93534;}
/* programmes */

section.programmess{position: relative;height: 608px;overflow: hidden;padding: 0}
.programme-wrap{overflow: scroll;height: 608px;padding: 60px 0}
.left-bg{position: absolute;width: 65%;left: 0;top:0;height: 100%;background: rgba(220,227,227,.6)}
.right-bg{position: absolute;width: 35%;right: 0;top:0;height: 100%;background: rgba(240,244,244,.8)}
.programme-list{overflow: hidden;margin-bottom: 120px}
.programme-list li{width: 45%;float: left;margin-right: 2.5%;margin-bottom: 20px;cursor: pointer}
.programme-list .featureimg{height: 220px}
.programme-cat li{margin-bottom: 20px;background: url(img/dot.svg) left center no-repeat;;padding-left: 40px;cursor: pointer;background-size: 14px}
.programme-cat li.active a{color: #91ccd1}
.programme-cat{display: none}
.programme-cat.active{display: block}
.popup-pro-inner .container{width: 100% !important;padding: 0 30px !important}
.flexslidersingle .flex-control-nav{position: relative;text-align: left;bottom: 0}
.flexslidersingle .flex-control-nav li{margin-left: 0;margin-right: 12px ;}
.flexslidersingle .flex-control-paging li a.flex-active{background: rgba(255,255,255,1)}
.flexslidersingle .flex-control-paging li a{background: rgba(255,255,255,.6)}
.single-img-slider{width: 100%;height:360px}

.programme-right{padding-left: 40px}
.programme-left{padding-right: 0}
.programme-left.active{width: 50%}
.programme-right.active{opacity: 0}
section.programmess.active .left-bg,section.programmess.active .right-bg{width: 50%}
section.programmess.active .right-bg{background: #20232a}

.popup-pro{width: 50%;top:0;right: -50%;height: 768px;position: absolute;z-index: 9;overflow: scroll;opacity: 0}
.popup-pro.active{right:0;opacity: 1}
.popup-pro-inner{position: relative;padding-top: 60px;opacity: 1;padding-bottom: 120px}
.popup-pro.active .popup-pro-inner{opacity: 1}
.popup-pro i{position: absolute;top:14px;right: 20px;color: #FFF;font-size: 48px;z-index: 9;cursor: pointer}
.popup-pro h5,.popup-pro h3 ,.popup-pro h6,.popup-pro p,.popup-pro a{color: #FFF}
.multipleartist li h3{background: url(img/arrow-w.png) right center no-repeat;background-size: auto auto;    background-size: 18px;  padding-right: 24px;display: block}
.multipleartist li {width: 100%;padding-bottom: 4px ;border-bottom: 3px solid #FFF;margin-bottom: 10px;cursor: pointer}
.more-info{overflow: hidden;max-height: 0}
.multipleartist li.active .more-info{max-height: 3000px}

.installations .info-border,
.exhibitions .info-border,
.workshops .info-border{background: rgba(255,91,71,1)}

.installations .pro-cat,
.exhibitions .pro-cat,
.workshops .pro-cat{color:rgba(255,91,71,1)}

.single-date{position: relative;overflow: hidden;padding-left: 160px}
.single-day{position: absolute;left: 0;top:2px;overflow: hidden}
.single-space{position: absolute;left: 118px;top:8px;overflow: hidden}

/* news*/
section.news{background: #ECF4F4}
.new-thum{width: 100%;height: 320px;background: #20232a}
.news-block{margin-bottom: 40px;}
.news-block-border{width: 100%;height: 1px; background:#CCC;;margin-top: 40px}

/* EVENTS */
section.eventwrap{position: relative;overflow: hidden;padding: 0}
section.eventwrap .cat-dot{position: absolute;top:24px;left: 0;}
section.eventwrap .view-more{bottom: 22px;right: 20px;left: auto}
.eventinner{overflow: scroll;;width: calc(100% + 80px);;position: absolute;}
.eventcontent{overflow: hidden;padding-left: -100px;padding-right: 80px}
.eventcontent li{padding-left: 40px !important}
#list.single-date{padding-left: 0 !important;margin-bottom: 120px;width: 100%;margin-top: 60px}
#list.single-date li{cursor: pointer;padding-right: 20%}
#list.single-date li.bodw{background: url(img/dse.png)  right 20px no-repeat;background-size: 70px auto}
	
#right{ width:70%; height:100%; float:left; position: relative; }
#map{ width: calc(100% + 80px); height:768px;right: 0;position: absolute !important }

#filter{ width:70%; border:1px solid #eee; float: right;z-index:2; position: absolute;float: left;}
#filter .fields{ width:100%; padding:10px 20px; margin-top:0; background:#fff; cursor: pointer; }
#filter .fields img{ float: right; }
#filter #option_result{ width:100%; margin:0px; }
#filter #option_wrap{ display: none; }
#filter.active  #option_wrap{ overflow: hidden; display: block; }

.popup-events{width: 42%;top:0;left: -42%;height: 768px;position: absolute;z-index: 9;color: #FFF;overflow-y: scroll;background: #20232a}
.popup-events.active{left:0}
.popup-events.active .popup-bg{width: 100%}
.popup-event-inner{position: relative;height: 708px;opacity: 0}
.popup-events.active .popup-event-inner{opacity: 1}
.popup-event-inner .support-info{position: absolute;bottom:0;padding-right: 20%;width: 100%}
.eventwrap i{position: absolute;top:14px;right: 20px;color: #FFF;font-size: 48px;z-index: 9;cursor: pointer}
.popup-events h5,.popup-events h3 ,.popup-events h6,.popup-events p,.popup-events a{color: #FFF}
.popup-event-inner .container{width: 100%}
.pop-content{padding-top: 60px;}

/* calendar-block */
.calendar-block{position: fixed;width: 50%;height: 100%;background: rgba(237,244,244,.95);z-index: 10;top:0;right:-50%;overflow: scroll;opacity: 0}
.calendar-block.active{right: 0;opacity: 1}
.calendar-block .cat-dot{position: absolute;top:24px;left: -26px}
.calendar-inner{overflow: hidden}
.calendar-block .container{padding-left: 60px;padding-right: 60px}
.c-date-list li{float: left;margin-right:10px;cursor: pointer}
.c-date-list li h4{opacity: .4;color: #3C434E;-webkit-border-radius: 20px;
-moz-border-radius: 20px;border-radius: 20px;width: 40px;height: 40px;text-align: center;}
.c-date-list li.active h4{opacity: 1;background:none;padding-bottom: 2px;color: #3C434E}
.c-date-list li.today h4{background: #D93534 !important;opacity: 1 !important;color: #FFF}

.date-menu{position: relative;width: 100%;float: left;margin-bottom: 40px}
.date-menu li{cursor: pointer}
.date-inner .single-date-title{border-bottom: 3px solid #CACACA;padding-bottom: 10px}
.single-date li {padding:20px 0;border-bottom: 1px solid #CACACA;position: relative}
.time-zone{position: absolute;right: 0;top:20px}
.calendar-img{width: 100%;height: 580px}
.flexsliderc{margin-bottom: 20px}
.calendar-block .flex-control-nav{padding-right: 0;padding-left: -4px !important;text-align: left;bottom:-40px}
.calendar-block .flex-control-nav li{margin: 0 12px 0 0}
.flexsliderc-info{position: relative}
.calendar-block .view-more{right: 0;;bottom: 4px;left: auto;}
.single-date .view-more{bottom: 24px}
.date-wrap{display: none;}
.date-wrap.active{display: block}
.inner li{border-bottom: 0 solid  !important; padding: 0 50% 20px 0;cursor: pointer;overflow: hidden}

/* Credits */
.logo-list li{float: left;margin-right: 40px}
.logo-list li img{max-width: 240px}


/* popup */
.disclaimer-wrap{position: fixed;width: 100%;height:auto;background: rgba(255,255,255,.9);bottom:-50%;left: 0;z-index: 11}
.disclaimer-wrap.active{bottom: 0}
.disclaimer-inner{padding: 40px 0}
.disclaimer-inner i {font-size: 24px;cursor: pointer}