/* Theme Name: skankandbass theme Theme URI: http:// Description: skankandbass theme Author: David Kitson Author URI: http://kaleid.co Version: 1 */ *, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* Safari */ -khtml-user-select: none; /* Konqueror HTML */ -moz-user-select: none; /* Firefox */ -ms-user-select: none; /* Internet Explorer/Edge */ user-select: none; /* Non-prefixed version, currently supported by Chrome and Opera */ outline: none; -webkit-tap-highlight-color: rgba(0,0,0,0); } html { height:100%; background: #000; letter-spacing:3px} body { font-family: 'Oswald', sans-serif; } header { } a { text-decoration:none; } a:hover { } img { width:100%; height:auto; display:block; vertical-align: middle; white-space: none; -webkit-user-drag: none; -khtml-user-drag: none; -moz-user-drag: none; -o-user-drag: none; user-drag: none; } .loader { position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 9999; background: #000 url(images/loader.gif) 50% 50% no-repeat; background-size: 150px auto; } .mo.nothome .loader { display:none; } /*nav*/ #menubtn { display:none;} #menubtn, #menuclose { position:absolute; top:20px; right:20px; width:40px; height:auto; cursor:pointer; z-index:5000;} /*home*/ #home { position:absolute; top:0; left:0; width:100%; height:100%; text-align:center; } #logo, #logopreround { margin:0 auto; position:fixed; left:0; top:0; padding:40px 40px; width:40vh; } #logoround { display:none;} .fancybox-button--play, .fancybox-button--thumbs { display:none!important;} /*content*/ #patterns { position:absolute; right:40px; top:40px; bottom:40px; width:50%; background:url(images/patterns/1.png) repeat-y 50% 0; background-size:100% auto; max-width:700px; } .inner { background:#faed27; padding:20px; max-height:100%; overflow:scroll; display:none; } .inner h1 { text-align:left; font-weight:600; font-size:30px; margin-bottom:10px; text-transform:uppercase;} .inner p { text-align:justify; letter-spacing: 1px; line-height:1.5; font-size:15px; margin:20px auto 0;} .inner a { color:#000;} .inner p a:after { content:' >'; color:#000; padding-right:5px;} .inner p a:hover:after { content:' >'; color:#000; padding-left:8px;} /*videohome*/ #videoWrapper { position: relative; padding-bottom: 54.25%; /* 16:9 */ height: 0; } #videoWrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /*EVENTS*/ #dates_feed { border-top:5px solid #000; border-bottom:5px solid #000; text-align:left; } #dates_feed .dates_item { position:relative; height:auto; border-bottom:2px solid #000; } #dates_feed .dates_item p { margin:5px auto;} #dates_feed .dates_item:last-child { margin: 0 auto 0; border-bottom:none;} #dates_feed .dates_item .dm { display:inline-block; font-size:20px; text-transform: uppercase; letter-spacing:0px; } #dates_feed .dates_item .lu {display:inline-block; font-size:20px; margin-left:5px; letter-spacing:0px;} #dates_feed .dates_item .tix {display:inline-block; float:right; border:2px solid #000; padding:4px; text-align:center; width:95px; margin:6px 0px 5px 5px; font-size:16px; color:#faed27; background:#000;} #dates_feed .dates_item .tix:hover { border:2px solid #000; background:none; color:#000; } #dates_feed .dates_item .soldout { display:inline-block; float:right; border:2px solid #4f4b09; padding:4px; width:95px; text-align:center; font-size:16px; margin:6px 0px 5px 5px; color:#faed27; background:#4f4b09;} #dates_feed_feat { text-align:left; padding-top:10px; } #dates_feed_feat .dates_item { position:relative; height:auto; border-bottom:2px solid #000; } #dates_feed_feat .dates_item p { margin:5px auto;} #dates_feed_feat .dates_item:last-child { margin: 0 auto 0; border-bottom:none;} #dates_feed_feat .dates_item .dm { display:inline-block; font-size:20px; text-transform: uppercase; letter-spacing:0px; } #dates_feed_feat .dates_item .lu {display:inline-block; font-size:20px; margin-left:5px; letter-spacing:0px;} #dates_feed_feat .dates_item .tix {display:inline-block; float:right; border:2px solid #000; padding:4px; text-align:center; width:95px; margin:6px 0px 5px 5px; font-size:16px; color:#faed27; background:#000;} #dates_feed_feat .dates_item .tix:hover { border:2px solid #000; background:none; color:#000; } #dates_feed_feat .dates_item .soldout { display:inline-block; float:right; border:2px solid #4f4b09; padding:4px; width:95px; text-align:center; font-size:16px; margin:6px 0px 5px 5px; color:#faed27; background:#4f4b09;} .mobshow { display:none; margin:10px auto;} #videoMobile { display:none;} #coverall{ position:absolute; top:0; left:0; width:100%; height:100%; z-index:500;} .coverall{ position:absolute; top:0; left:0; display:block; width:100%; height:100%; z-index:100; background: #11f0e8; opacity:0.5;} #nextbutton, #prevbutton { position:relative;} #vidtitle-l,#vidtitle-r { position:absolute; left:-50px; top:0; width:40px; height:100%; background-size:100% 100%;} #vidtitle-r { left:auto; right:-50px; } a#fullscreenbtn { position:absolute; top:20px; right:20px; z-index:200; display:block; width:30px; cursor:pointer} #fullscreenclose { position:fixed!important; z-index:20000000000000000!important; top:15px; right:20px; cursor:pointer;width:30px; display:none;} #vidcontrols { position:relative; margin-top:10px; text-align:left; width:100%; } #vidcontrols.fs { position:fixed!important; bottom:9px!important; left:auto!important; margin-left:0; right:50px; z-index:20000000000!important;background:none!important; border:none!important; width:auto; } #vidcontrols li{ list-style: none; display:inline-block; padding:0; margin:0 4px 0 0; position:relative; cursor:pointer; opacity:1;} #vidcontrols a { padding:0; text-transform: uppercase; text-decoration: none; color:#000; letter-spacing: 2px; background:none; display:inline-block; font-size:20px; } #vidcontrols li:hover { opacity:0.6;} #vidcontrols a img { width:30px; height:auto; } #vidcontrols.fs a{ border:none; background:none; color:#faed26;} #vidcontrols.fs { position:absolute; top:10px; right:60px; color:#faed26; width: 100%; padding-left:70px;} #titlewrap { color:#000; font-size:20px; font-weight:400; letter-spacing:1px; font-size:25px; line-height:1.3;} #title { color:#000; text-transform:uppercase; letter-spacing:1px; font-size:20px; line-height:1.3; text-indent: 5px;} .fullscreen{ position:fixed!important; z-index:2000000!important; left:0%!important; top:0%!important; height:100%!important; width:100%!important; border:none!important; padding:0!important; border-radius:0!important;} /*footer*/ #footer{ position:fixed; bottom:0;left:0; width:auto; height:auto; padding:40px 40px; display:block; } #footer #socials { display:block; padding:0px 0px;} #socials li{ display:inline-block; width:25px;margin:0 10px; } #socials li:first-child{ margin-left:0px; } #footer_nav li { margin:0 auto 0; position:relative; padding-bottom:2px; display:block;} #footer_nav li.focus > a:after { content:' >'; color:#faed27!important; padding-right:10px;} #footer_nav li:hover > a:after { content:' >'; color:#5e5b18; padding-right:10px;} #footer_nav li a{ color:#faed27; font-weight:600; font-size:4vh; letter-spacing:2; line-height:1.1;} #footer_nav li:hover > a{ color:#faed27; font-size:4vh; letter-spacing:2; line-height:1.1; display:block;} #mailing_list { padding: 30px 0; display:block;} #mailing_list a{ color:#faed27; letter-spacing:5px; } #mailing_list a:after { content:'>'; color:#faed27; padding-right:2px;} #mailing_list:hover > a:after { content:'>'; color:#faed27; padding-left:8px;} /*menuover*/ #menu_over { position:fixed; top:0; left:0; width:100%; height:100%; z-index:999999; background:#faed27; display:none;} #menu_content { position:absolute; top:20px; left:20px; width:100%; height:100%; } #nav_over { position:absolute; top:0; left:0; width:100%; height:100%;} #nav_over ul { margin:0 auto; width:100%; text-align:left; padding:0;} #nav_over li { margin:5px auto; position:relative; } #nav_over li a{ color:#000; font-weight: 600; font-size:30px;} #nav_over li.focus > a:after { content:' >'; color:#000!important; padding-right:10px;} #nav_over li:hover > a:after { content:' >'; color:#000; padding-right:10px;} .mo #nav_over li:hover > a:after { content:' '} .mo #nav_over li:hover { opacity:0.5;} #menu_over #socials { position: absolute; bottom:30px; left:0; width:100%; text-align:center;} #menu_over #socials a {} #mailing_list_mob { padding: 0px 0; display:block; position:absolute; bottom:80px; left:0; width:100%; text-align:center;} #mailing_list_mob a{ color:#000; letter-spacing:5px; } #mailing_list_mob a:after { content:'>'; color:#000; padding-right:2px;} #mailing_list_mob:hover > a:after { content:'>'; color:#000; padding-left:8px;} #owlcnav { position:absolute!important; top:-50px !important; right:5px !important; z-index:2000;} #owlcnav span { font-size:20px;} #owlcnav span:hover { opacity:0.6;} .cover{ background-repeat:no-repeat; background-position: 50% 50%; background-attachment: fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;} .vertcent { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-align: center; -webkit-align-items: center; -webkit-box-align: center; align-items: center; } /*MOBILE*/ .mo #videoInside, .mo #vidcontrols, .mo #coverall, .mo .mobhide, .mo a#fullscreenbtn, .mo #titlewrap { display:none; } .mo #videoMobile { display:block;} /*CSS SNIPPETS*/ .transall, #mailing_list a:after, .inner a:after, li.focus { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden;} #menubtn:after, #menuclose:after { -webkit-transition: background 0.3s ease-out; -moz-transition: background 0.3s ease-out; -o-transition: background 0.3s ease-out; transition: background 0.3s ease-out; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden;} .transopac { -webkit-transition: opacity 0.3s ease-out; -moz-transition: opacity 0.3s ease-out; -o-transition: opacity 0.3s ease-out; transition: opacity 0.3s ease-out;} .opac:hover { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter: alpha(opacity=50);-moz-opacity: 0.5;-khtml-opacity: 0.5;opacity: 0.5; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden;} img.ri { position: absolute; max-width: 80%; top: 10%; left: 10%; border-radius: 3px; } img.ri:empty { top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .showmenarrow { display:none;} @media screen and (orientation: portrait) { #logopreround { display:none;} #logo { position:absolute; width:220px; padding:20px; display:block; margin:0 auto; left:0; top:0; } #logoround { position:absolute; width:160px; padding:20px; display:block; margin:0 auto; left:0; top:0; } #menubtn { display:block;} #footer { display:none;} #patterns { position:absolute; right:20px; left:20px; top:280px; bottom:20px; background:url(images/patterns/1.png) repeat-y 50% 0; background-size:100% auto; width:auto; padding-top:0px; max-width:4000px; margin-bottom:20px; } .nothome #patterns { top:180px!important; padding-top:100px; margin-bottom:20px; bottom:auto;} #dates_feed .dates_item { text-align:center;} #dates_feed .dates_item .dm { display:inline-block; text-align:center; font-size:25px; margin:10px auto 5px; line-height:1; } #dates_feed .dates_item .lu {display:inline-block; font-size:25px; margin-left:0px; margin:0 auto; margin-left:3px; text-align:center; line-height:1;} #dates_feed .dates_item .tix {display:inline-block; float:none; border:2px solid #000; padding:4px; text-align:center; width:47%; margin:0 auto 10px; font-size:20px; } #dates_feed .dates_item .tix:hover { border:2px solid #000; background:none; color:#000; } #dates_feed .dates_item .soldout { display:inline-block; float:none; border:2px solid #4f4b09; padding:4px; width:47%; text-align:center; font-size:20px;margin:0 auto 10px; color:#faed27; background:#4f4b09;} .showmenarrow { display:block;} } @media screen and (orientation: landscape) { img.ri { max-height: 90%; } } @media screen and (orientation: landscape) and (max-width : 1100px){ #dates_feed .dates_item { text-align:center;} #dates_feed .dates_item .dm { display:inline-block; text-align:center; font-size:25px; margin:10px auto 5px; line-height:1; } #dates_feed .dates_item .lu {display:inline-block; font-size:25px; margin-left:0px; margin:0 auto; margin-left:3px; text-align:center; line-height:1;} #dates_feed .dates_item .tix {display:inline-block; float:none; border:2px solid #000; padding:4px; text-align:center; width:47%; margin:0 auto 10px; font-size:20px; } #dates_feed .dates_item .tix:hover { border:2px solid #000; background:none; color:#000; } #dates_feed .dates_item .soldout { display:inline-block; float:none; border:2px solid #4f4b09; padding:4px; width:47%; text-align:center; font-size:20px;margin:0 auto 10px; color:#faed27; background:#4f4b09;} .showmenarrow { display:block;} } @media only screen and (max-width : 850px) { } @media only screen and (max-width : 650px) { }