/* Application */ body.accreditation .accreditation-form .two-equal-cols > div{ width: 50%; padding: 10px; } body.accreditation .accreditation-form .row { padding: 10px; } body.accreditation .accreditation-form .two-cols > div { vertical-align: top; } @media all and (max-width: 740px) { body.accreditation .accreditation-form .two-equal-cols > div { display: block; width: 100%; } } body.accreditation .accreditation-form .accept-terms { margin: 0; } body.accreditation .accreditation-form .accept-terms p { margin-top: 8px; margin-bottom: 0; } body.accreditation .accreditation-form .accept-terms div.input-checkbox { height: 40px !important; line-height: 40px !important; border: 0; } body.amigos .content > .column { max-width: 100%; } /* Login */ body.amigos .login-form .form > .tbl > .row { padding: 20px; display: table-cell; width: 33.33%; vertical-align: top; } body.amigos .login-form .form .button { border-color: #00aeef; color: #00aeef; } body.amigos .login-form .form .button:hover, body.amigos .login-form .form .button:focus, body.amigos .login-form .form .button:active { color: #fff; } @media all and (max-width: 700px) { body.amigos .login-form .form > .tbl > .row { display: block; width: 100%; padding: 10px 0 0; } } /* Account */ body.amigos-account div.content { padding: 0 0 80px 0; } body.amigos-account .pagetitle p.status { margin: 0 !important; background-color: #00aeef; } body.amigos-account > form > .pagetitle > .column { display: none; } body.amigos-account .pagetitle > .column h1 { padding-top: 0; } body.amigos-account .account-header { background-color: #000; padding: 20px 0; margin-bottom: 60px; } body.amigos-account .account-header .tbl > div.lft { width: 60%; } body.amigos-account .account-header .tbl > div.rgt { width: 40%; } body.amigos-account .account-header h3 { color: #fff; margin: 0; font-family: 'Oswald', sans-serif; font-weight: 400; text-transform: uppercase; font-size: .95em; line-height: 1; text-align: right; } body.amigos-account .account-header .account-details { background: url(/Web/Images/user.png) no-repeat right center; background-size: 60px; min-height: 70px; padding-right: 75px; padding-top: 15px; } body.amigos-account .account-header a.logout { display: block; width: 100%; text-decoration: none; color: #fff; width: 100%; font-family: 'Oswald', sans-serif; font-weight: 300; text-align: right; } body.amigos-account .account-header a.logout:hover, body.amigos-account .account-header a.logout:active, body.amigos-account .account-header a.logout:focus { color: #00aeef; } body.amigos-account .press-navigation { padding: 20px 0; } body.amigos-account .amigos-navigation > a { color: #fff; text-decoration: none; font-family: 'Oswald', sans-serif; } /* Landing Page */ body.amigos .package-overview > h3 { color: #a5a5a5; text-transform: uppercase; font-family: 'Oswald', sans-serif; font-size: 1.8em; line-height: 1; } body.amigos .package-overview a.outline-button-reverse{ border-color: #00aeef; color: #00aeef; width: 100%; max-width: 200px; text-align: center; margin-top: 40px; } body.amigos .package-overview a.outline-button-reverse:hover, body.amigos .package-overview a.outline-button-reverse:active, body.amigos .package-overview a.outline-button-reverse:focus{ color: #fff !important; background-color: #00aeef !important; } /* Package Tabs */ body.amigos .package-overview .package-menu ul { padding-left: 0; list-style: none; } body.amigos .package-overview .package-menu ul{ margin-top: 30px; width: 100%; display: table; margin-bottom: 0; } body.amigos .package-overview .package-menu ul > li { display: table-cell; width: 16.66%; height: 100%; cursor: pointer; color: #000000; font-weight: 700; font-size: 14px; } body.amigos .package-overview .package-menu a, body.amigos .package-overview div.tabcontent .mobile-header{ display: block; width: 100%; height: 100%; padding: 10px; font-weight: normal; color: #a1a1a1; } body.amigos .package-overview .package-menu a > span, body.amigos .package-overview div.tabcontent .mobile-header > span { white-space: nowrap; } body.amigos .package-overview .package-menu a > span.age-group, body.amigos .package-overview div.tabcontent .mobile-header > span.age-group{ color: #00aeef; font-weight: bold; } body.amigos .package-overview div.tabcontent .mobile-header { display: none; } body.amigos .package-overview .package-menu a.active { background-color: #ebebeb; } body.amigos .package-overview div.tabcontent { background-color: #ebebeb; padding: 30px 15px; display: none; } body.amigos .package-overview div.first-tab { display: block; } body.about .package-overview div.tabcontent p { color: #ffffff; font-size: 16px; font-weight: normal; } @media all and (max-width: 770px){ body.amigos .package-overview div.tabcontent { display: block !important; margin-bottom: 15px; padding: 10px; } .package-menu{ display: none; } body.amigos .package-overview div.tabcontent .mobile-header{ display: block; border-bottom: 1px dotted #ccc; } } /* Application */ body.amigos .amigos-application input[type="submit"].paynow-btn{ background: url(/Web/Images/paynow@2x.png) no-repeat center; background-size: 95px 18px; padding: 14px 0 14px 110px; text-align: left; color: transparent; text-transform: uppercase; cursor: pointer; font-size: .9em; font-weight: bold; } body.amigos .amigos-application .two-equal-cols > div{ width: 50%; padding: 10px; } body.amigos .amigos-application .row { padding: 10px; } body.amigos .amigos-application .two-cols > div { vertical-align: top; } body.amigos .amigos-application .two-cols > div:first-child { width: 60%; } body.amigos .amigos-application .two-cols > div:last-child { width: 40%; } body.amigos .amigos-application .two-cols p{ font-style: italic; font-size: .9em; font-weight: bold; } body.amigos .amigos-application .two-cols p > a { color: #00aeef; text-decoration: none; } body.amigos .select-list{ background-color: #00aeef; } @media all and (max-width: 740px) { body .amigos .amigos-application .two-cols > div:first-child, body.amigos .amigos-application .two-cols > div:last-child, body.amigos .amigos-application .two-equal-cols > div { display: block; width: 100%; } body.amigos .amigos-application .two-cols p { text-align: center; } } .news .content { width: 100%; overflow: hidden; } .news .left { float:left; width: 80%; padding-right: 30px; padding-top: 20px; padding-bottom: 50px; } .news .right { float: left; width: 20%; padding-bottom: 50px; } .news .left .list > div { float: left; width: 50%; padding-right: 20px; } .news .list > div > div { background: #eee; padding: 20px; margin-bottom: 20px; } .news .right .list > div > div { background: #fff; padding: 0; font-size: .8em; } .news .list a.photo { display: block; height: 300px; background-position: center center; background-repeat: no-repeat; background-size: cover; } .news .right .list a.photo { height: 150px; } .news .list a.title { display: block; padding-top: 5px; text-decoration: none; } .news .list span, .news .right .list small { display: none; } .news .list > div:nth-child(2n+1) { clear: left; } .news .right { float: left; width: 20%; padding-bottom: 50px; } .news .right h2 { margin: 1em 0; text-transform: uppercase; letter-spacing: 5px; font-size: 1em; } .news .left .hero { width: 100%; } @media all and (max-width: 800px) { .news .list a.photo { height: 200px; } } @media all and (max-width: 680px) { .news .left { width: 65%; } .news .right { width: 35%; } .news .left .list > div { width: 100%; padding-right: 0; } } @media all and (max-width: 540px) { .news .left { width: 100%; padding-right: 0; padding-bottom: 0; } .news .right { width: 100%; padding-bottom: 0; } .news .right .list a.photo { display: none; } } .artists .content h2 { margin: 1em 0; text-transform: uppercase; letter-spacing: 5px; font-size: 1em; } .artists .filter { margin: 1em 0 2em 0; padding: 0; list-style-type: none; width: 100%; overflow: hidden; border-bottom: solid 2px #01354f; } .artists .filter li { float: left; width: 3.57%; text-align: center; } @media all and (max-width: 640px) { .artists .filter li { width: 7%; } } .artists .filter li a { color: #01354f; font-family: "Oswald", sans-serif; text-decoration: none; display: block; padding: 5px 0; } .artists .filter li a.selected { background-color: #01354f; color: #fff; } .artists .list { width: 100%; overflow: hidden; } .artists .list > div { float: left; width: 33.33%; padding: 5px; } .artists .list > div > div { display: table; width: 100%; background-position: center center; background-repeat: no-repeat; background-size: cover; } .artists .list > div a { background: url(/Web/Images/gradient.png) repeat-x bottom left; vertical-align: bottom; padding: 20px; height: 250px; display: table-cell; color: #fff; text-decoration: none; line-height: 1.2; } .artists .list > div a strong { display: block; } .artists .list > div a:hover { color: #00aeef; } @media all and (max-width: 760px) { .artists .list > div { width: 50%; } } @media all and (max-width: 560px) { .artists .list > div { width: 100%; padding: 5px 0; } } /* details */ .artist-detail .content { padding-bottom: 0; } .artists .details { margin: 1em 0 80px 0; } .artists .details .lft { vertical-align: top; padding-right: 30px; } .artists .details .lft .desc { margin-bottom: 50px; } .artists .details .rgt { width: 30%; vertical-align: top; } .artists .details .rgt img.profile { width: 100%; display: block; margin: 1em 0 50px 0; } @media all and (max-width: 480px) { .artists .details { display: block; } .artists .details .lft, .artists .details .rgt { display: block; width: 100%; padding: 0; } .artists .details .rgt { padding-top: 30px; } } .artists .gallery { background: #eee; padding: 30px 0; } .artists .gallery .paging { margin: 0 auto; max-width: 960px; padding: 20px 25px; } .artists .gallery ul { padding: 0 20px; margin: 0 auto; max-width: 960px; list-style-type: none; overflow: hidden; } .artists .gallery ul li { float:left; width: 20%; padding: 5px; } .artists .gallery ul li a, .artists .gallery ul li img { display: block; width: 100%; } @media all and (max-width: 640px) { .artists .gallery ul li { width: 25%; } } @media all and (max-width: 480px) { .artists .gallery ul li { width: 33.33%; } } @media all and (max-width: 380px) { .artists .gallery ul li { width: 50%; } } * { font-smooth: always; font-smoothing: antialiased; -moz-font-smoothing: antialiased; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; outline: none; } @font-face { font-family: 'icomoon'; src:url('/web/common/fonts/icomoon.eot?xgapu6'); src:url('/web/common/fonts/icomoon.eot?#iefixxgapu6') format('embedded-opentype'), url('/web/common/fonts/icomoon.woff?xgapu6') format('woff'), url('/web/common/fonts/icomoon.ttf?xgapu6') format('truetype'), url('/web/common/fonts/icomoon.svg?xgapu6#icomoon') format('svg'); font-weight: normal; font-style: normal; } input[type=submit] { -webkit-appearance: none; } img { border: 0; } html, body, form { margin: 0; height: 100%; } body, select, textarea, input, td { font-size: 1em; font-family: 'Quattrocento Sans', sans-serif; color: #000; } a { color: #000; } a:hover { color: #aaa; text-decoration: none; } div.column { width: 100%; max-width: 960px; margin: 0 auto; position: relative; padding: 0 20px; } div.tbl { width: 100%; display: table; } div.tbl > div { display: table-cell; vertical-align: middle; } p.status, p.error { position: relative; margin: 1em 0 2em 0 !important; padding: 10px 0!important; text-align: center; width: 100%; background: #333; cursor: pointer; display: none; font-size: 1em !important; line-height: 1 !important; color: #fff !important; } p.status, p.error, p.status a, p.error a { color: #fff; } pre { width: 100%; overflow: auto; } .buzz .content, .gallery .content { padding-bottom: 0; padding-top: 60px; } .list-container { position: relative; width: 100%; background: #eee; padding-top: 30px; } #list big { font-size: 1em; } /* list */ #list { width: 100%; overflow: hidden; padding: 0; list-style-type: none; z-index: 1; position: relative; margin: 0; } #list li { position: absolute; width: 300px; background: #fff; border-radius: 2px; box-shadow: 0 1px 1px rgba(0,0,0,.25); overflow: hidden; color: #333; } #list li a { color: #000; } #list li.wide { width: 620px; } #list li.loader { width: 100%; background: url(/web/images/loader.gif) no-repeat center center; height: 60px; box-shadow: none; } #list li.more { width: 100%; float: none; padding: 20px 0; text-align: center; border: solid 1px #ccc; font-weight: bold; color: #CCC; text-transform: uppercase; cursor: pointer; background: none; box-shadow: none; } #list li > div { position: relative; margin: 10px; overflow: hidden; } #list li > div > a { width: 280px; height: 280px; display: table-cell; background: #eee; vertical-align: middle; } #list li.wide > div > a { width: 580px; height: 580px; } #list li > div > a > img { max-width: 280px; max-height: 280px; display: block; margin: auto; } #list li.wide > div > a > img { max-width: 580px; max-height: 580px; } #list li > div > span { display: block; margin: 10px 0; font-size: .8em; } #list li > div > strong { margin: 10px 0; display: block; } #list li > div > div { margin-top: 10px; border-top: solid 1px #eee; padding-top: 10px; font-size: .7em; line-height: 1.1em; background: url(/web/images/icons.png) no-repeat; overflow: hidden; height: 35px; } #list li > div > div img { width: 25px; height: 25px; float: left; margin-right: 5px; background: #eee; } #list li > div > div strong { display: block; color: #000; } #list li > div > div em { display: block; color: #999; } /* twitter */ div.twitter big, div.facebook big { display: block; padding: 10px; text-align: center; } .wide div.twitter big { font-size: 1.4em !important; } #list li > div.twitter > div { background-position: right 0; } /* instagram */ #list li > div.instagram > div { background-position: right -40px; } /* facebook */ #list li > div.facebook > div { background-position: right -240px; } /* flickr */ #list li > div.flickr > div { background-position: right -80px; } /* youtube */ #list li > div.youtube > a, #list li > div.youtube > a > img { width: 280px; height: 210px; } #list li.wide > div.youtube > a, #list li.wide > div.youtube > a > img { width: 580px; max-width: 580px; height: 435px; max-height: 435px; } #list li > div.youtube > div { background-position: right -120px; } #list li > div.youtube iframe { display: block; } #list li > div.youtube a { position: relative; } #list li > div.youtube a span { position: absolute; z-index: 99; top: 0; left: 0; display: block; width: 100%; height: 100%; background: rgba(0, 0, 0, .2) url(/web/images/play_vid.png) no-repeat center center; } /* photo */ #list li > div.photo > div { background-position: right -160px; } /* review */ #list li > div.review { margin: 0; } #list li > div.review > big { background: #0D3050; padding: 20px; color: #fff; display: block; line-height: 1em; } #list li > div.review > big small { display: block; font-size: .6em; font-style: italic; color: #dbd7ce; } #list li > div.review > big span { font-weight: bold; background: url(/web/images/stars.png) no-repeat top right; padding-right: 65px; } #list li > div.review > big.stars-1 span { background-position: right -80px; } #list li > div.review > big.stars-2 span { background-position: right -60px; } #list li > div.review > big.stars-3 span { background-position: right -40px; } #list li > div.review > big.stars-4 span { background-position: right -20px; } #list li > div.review > big.stars-5 span { background-position: right -00px; } #list li > div.review > span { padding: 10px 20px; } #list li > div.review > div { margin: 10px; background-position: right -200px; } /* adz */ #list li > div.adz { background: #fff; margin-bottom: 20px; } #list li > div.adz strong { text-transform: uppercase; text-align: center; color: #aaa; font-size: .7em; } #list li > div.adz a, #list li > div.adz span { width: 280px; height: 150px; display: table-cell; background: #fff; vertical-align: middle; text-align: center; } #list li > div.adz span div { margin: auto; } #list li > div.adz a img { width: 280px; min-width: 280px; max-width: 280px; height: 150px; min-height: 150px; max-height: 150px; display: inline; } #list li.wide > div.adz { margin-bottom: 40px; } #list li.wide > div.adz a, #list li.wide > div.adz span { width: 390px; height: 250px; } #list li.wide > div.adz a img { width: 300px; min-width: 300px; max-width: 300px; height: 250px; min-height: 250px; max-height: 250px; display: inline; } #list div.photo > a { display: block; width: 100% !important; height: 0 !important; } #list div.photo > a > img { display: block; width: 100% !important; height: auto !important; position: absolute; top: 0; left: 0; max-height: none !important; max-width: none !important; } #overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 9999999; background: rgba(0,0,0,.9); display: none; } #overlay > table { width: 100%; height: 100%; vertical-align: middle; text-align: center; } #overlay > table td { background: url(/web/images/loader-white.gif) no-repeat center center; } #overlay > a { position: absolute; top: 20px; right: 20px; background: url(/web/images/close.png) no-repeat center center; width: 40px; height: 40px; cursor: pointer; } body.contact div.content .form { margin: 1em 0; } body.contact div.content div.tbl > div { vertical-align: top; width: 50%; } body.contact div.content div.tbl > div.lft { padding-right: 50px; } div.content { padding: 20px 0 80px 0; line-height: 1.5; position: relative; z-index: 1; } body.two-columns div.content div.left { float: left; width: 70%; } body.two-columns div.content div.right { float: right; width: 25%; } div.content a.back { font-size: .7em; color: #999; text-transform: uppercase; } @media all and (max-width: 800px) { div.content { padding: 10px 0 20px 0; } body.two-columns div.content div.left { float: none; width: 100%; } body.two-columns div.content div.right { margin-top: 2em; padding-top: 1em; float: none; width: 100%; border-top: solid 2px #ccc; } } body.editor h2, div.content h2 { color: #263894; font-weight: normal; font-size: 2em; font-family: "Oswald", sans-serif; font-weight: 300; } body.editor big, div.content big { font-size: 1.4em; } body.editor small, div.content small { color: #999; } body.editor div.caption, div.content div.caption { margin: 1em 0; background: #eee; padding: 20px; text-align: center; font-style: italic; border-radius: 5px; color: #666; } body.editor div.caption img, div.content div.caption img { display: block; width: 100% !important; max-width: 600px; margin: 0 auto; margin-bottom: 10px; } a.outline-button { display: inline-block; border: solid 2px #000; text-decoration: none; padding: 10px 20px; text-transform: uppercase; font-size: .8em; transition: all .4s ease; color: #000; } a.outline-button:hover { background: #000; color: #fff !important; } a.outline-button-reverse { display: inline-block; border: solid 2px #fff; text-decoration: none; padding: 10px 20px !important; text-transform: uppercase; font-size: .8em; transition: all .4s ease; color: #fff; background: none !important; } a.outline-button-reverse:hover { background: #fff; color: #FE2C10 !important; } p.empty { font-size: 2em; padding: 30px 0; } /* Gallery List */ .content .gallery-list { margin: 3em auto; padding: 0; list-style-type: none; width: 100%; overflow: hidden; border: dotted 1px #ccc; border-width: 1px 0; padding: 30px 0; } .content .gallery-list li { list-style: none; float: left; width: 20%; } .two-columns .content .gallery-list li { float: left; width: 25%; } @media all and (max-width: 590px) { .content .gallery-list li { width: 33.33%; } } @media all and (max-width: 440px) { .content .gallery-list li { width: 50%; } } .content .gallery-list li > a { display: block; margin: 5px; } .content .gallery-list li a img { width: 100%; height: 100%; display: block; } .content .gallery-list li a div { width: 100%; min-height: 200px; display: block; background-position: center; background-repeat: no-repeat; background-size: contain; } /* CK editor stylesheet */ body.editor { margin: .5em; height: auto; width: auto; background: #fff; overflow: auto !important; } body.cke_panel_frame { background: #fff; height: auto; overflow: auto; } .events .list { width: 100%; overflow: hidden; border-bottom: dotted 1px #ccc; margin-top: 20px; } .events .list > div { padding: 20px 0; border-top: dotted 1px #ccc; } .events .list .lft { width: 70px; } .events .list .cal { display: block; background: #eee; text-align: center; width: 100%; } .events .list .cal small { display: block; background: #00aeef; color: #fff; font-size: .8em; text-transform: uppercase; padding: 5px; } .events .list .cal big { display: block; padding: 5px; } .events .list .rgt { padding-left: 20px; } .events .list .rgt a { font-weight: bold; display: block; font-size: 1.2em; } .events .list .rgt span { display: inline-block; padding-right: 10px; color: #999; } .events .list .rgt span.date::before { content: "\e61f"; font-family: "icomoon"; padding-right: 5px; } .events .list .rgt span.loc::before { content: "\e620"; font-family: "icomoon"; padding-right: 5px; } .event-details .content { padding-bottom: 0; } .events .large_map { width: 100%; height: 500px; margin-top: 80px; } @media all and (max-width: 640px) { .events .large_map { width: 100%; height: 300px; } } /* newsletter sign up */ div.newsletter { /*background: #00aeef url(/Web/Images/newletter_bg_2018b.jpg) no-repeat center center;*/ background-color: #00aeef; background-size: cover; text-align: center; padding: 60px 20px 80px 20px; position: relative; color: #fff; } div.newsletter h3 { margin: 0; padding: 0; font-size: 2em; font-weight: 400; } div.newsletter p { margin: 1em auto 2em auto; max-width: 400px; } div.newsletter p strong { display: block; font-size: 2.4em; text-transform: uppercase; font-family: 'Oswald', sans-serif; } div.newsletter input { display: inline-block; width: 100%; max-width: 200px; border: 0; padding: 10px; } div.newsletter input:nth-child(1), div.newsletter input:nth-child(2) { max-width: 150px; } div.newsletter input:nth-child(3) { max-width: 250px; } div.newsletter input[type=submit] { max-width: 100px; background: none; border: solid 3px #fff; color: #FFF; text-transform: uppercase; padding: 7px 5px; cursor: pointer; transition: all .4s ease; } div.newsletter input[type=submit]:hover { color: #ac2935; background: #fff; } @media all and (max-width: 750px) { div.newsletter input { display: block; max-width: 100% !important; width: 100%; margin: 10px 0; } } /* copyright, etc */ div.footer { background: #000; padding: 50px 20px; color: #fff; font-size: .8em; line-height: 1.5; } div.footer strong { color: #00aeef; text-transform: uppercase; letter-spacing: 5px; } div.footer .tbl > div { width: 33.33%; vertical-align: top; } @media all and (max-width: 800px) { div.footer .tbl { display: block; } div.footer .tbl > div { display: block; width: 100%; text-align: center !important; padding-bottom: 30px; } div.footer .tbl > div:last-child { padding-bottom: 0; } } div.footer .tbl > div.copyright { vertical-align: bottom; text-align: right; } div.footer, div.footer a { color: #fff; } div.footer small { font-size: .7em; font-family: Arial, sans-serif; } div.footer small, div.footer small a { color: #999; text-transform: uppercase; } div.footer ul { margin: 0; padding: 0; list-style-type: none; } div.footer li { display: inline; } div.footer li a { display: inline-block; color: #fff; text-decoration: none; margin: 0 5px; } div.footer li a::before { font-size: 3em; color: #fff; font-family: "icomoon"; display: block; text-align: center; } div.footer li a:hover::before { color: #FE2C10; } div.footer li a.facebook::before { content: "\e639"; } div.footer li a.twitter::before { content: "\e638"; } div.footer li a.instagram::before { content: "\e637"; } div.footer li a.youtube::before { content: "\e636"; } div.form p { margin-bottom: 2em; } div.form div.row { margin: 0 0 1.5em 0; width: 100%; overflow: hidden; position: relative; } div.form div.row em.help { display: block; padding-top: 5px; font-size: .8em; color: #999; } div.form div.row label { display: block; color: #999; font-size: .8em; font-weight: bold; padding-bottom: 5px; } div.form div.row input, div.form div.row textarea, div.form div.row div.input-select, div.form div.row div.input-checkbox { background: #fff; padding: 10px; border: solid 2px #eee; width: 100%; display: block; margin: 0; } div.form div.row textarea { padding: 10px; resize: vertical; line-height: normal; } div.form div.row input:focus, div.form div.row textarea:focus, div.form div.row div.input-select:active { background: #eee; } div.form div.row div.input-select { cursor: pointer; display: table; } div.form div.row div.input-select > div { display: table-cell; vertical-align: middle; white-space: nowrap; width: 100%; } div.form div.row div.input-select::after { content: "\e60f"; font-family: "icomoon"; display: table-cell; vertical-align: middle; white-space: nowrap; } div.form div.row div.input-select-active::after { content: "\e60e"; } div.form div.row span.validate { position: absolute; right: 9px; top: 32px; font-size: 1.4em; transition: all 0.4s ease; color: #FFF !important; background: red; width: 30px; height: 30px; border-radius: 15px; line-height: 30px; text-align: center; } div.form input.button { width: 100%; border: solid 2px #000; color: #263894; text-align: center; padding: 10px; text-transform: uppercase; background: #fff; font-size: .8em; transition: all .4s ease; cursor: pointer; } div.form input.button:hover { border: solid 2px #00aeef; background: #00aeef; color: #fff; } div.form div.row div.captcha { display: table; width: 100%; } div.form div.row div.captcha > div { display: table-cell; vertical-align: middle; position: relative; } div.form div.row div.captcha > div.inp input { border-radius: 5px 0 0 5px; } div.form div.row div.captcha > div.img { width: 160px; padding: 0 5px; background: #eee; border-radius: 0 5px 5px 0; } div.form div.row div.captcha div.img input { padding: 0; width: 160px; height: 30px; margin: 0; } ul.select-list { position: absolute; top: -999px; left: -999px; background: #263894; margin: 0; padding: 5px; list-style-type: none; z-index: 999999; max-height: 250px; overflow: auto; } ul.select-list > li { color: #fff; padding: 5px; cursor: pointer; } ul.select-list > li:hover { background: rgba(0, 0, 0, .2); border-radius: 2px; } div.form div.title { font-size: 1.2em; font-weight: bold; margin: 1em 0 .5em 0; padding-bottom: 5px; border-bottom: solid 1px #ddd; } div.form div.info { color: #666; margin: 1em 0; } div.form div.checkbox-row { width: 100%; overflow: hidden; } div.form div.checkbox-row div.input-checkbox { float: left; width: 20px; margin-right: 10px; background: url(/web/images/checkbox.png) no-repeat 0 0; cursor: pointer; } div.form div.checkbox-row div.input-checkbox-checked { background: url(/web/images/checkbox.png) no-repeat -20px 0; } div.form div.checkbox-row label { float: left; height: 40px; line-height: 40px; } div.form div.required { display: none; } /* Options: Custom checkbox */ div.form div.options > table{ width: 100%; } div.form div.options > table > tbody { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } div.form div.options > table > tbody > tr { -ms-flex-preferred-size: 33.33%; flex-basis: 33.33%; -ms-flex-negative: 1; flex-shrink: 1; min-height: 0px; min-width: 0px; } @media (max-width: 768px) { div.form div.options > table > tbody > tr { -ms-flex-preferred-size: 50%; flex-basis: 50%; } } @media (max-width: 480px) { div.form div.options > table > tbody > tr { -ms-flex-preferred-size: 100%; flex-basis: 100%; } } div.form div.options > table > tbody > tr > td { width: 100%; } div.form div.options > table > tbody > tr > td > div, div.form div.options > table > tbody > tr > td > label { display: inline-block !important; } div.form div.options > table > tbody > tr > td > label { padding-bottom: 0 !important; } div.form div.input-checkbox { background: #eee; border: 0; height: 10px !important; width: 10px !important; border-radius: 50%; display: inline-block; margin: 0; height: 40px; vertical-align: middle; border: 4px solid #ccc; cursor: pointer; } .checkbox-row .checkbox > .input-checkbox { border-radius: 3px !important; } table td div.input-checkbox-checked { background-color: #00aeef !important; } div.form div.checkbox-row label { float: left; height: 40px; line-height: 40px; } div.form label { display: inline-block; color: #999; font-size: .9em; vertical-align: middle; padding-left: 10px; } div.form table tr { display: inline; } div.header { position: relative; z-index: 98; background-color: #00aeef; /*background: #00aeef url(/Web/Images/header_background_2018b.jpg) no-repeat -300px center; background-size: auto 100%; padding: 40px 0;*/ } @media all and (max-width:610px){ div.header { background: #00aeef url(/Web/Images/hifa_logo_2018b.png) no-repeat center 10px; background-size: 200px; padding: 180px 0 0; } } div.header div.column { width: 100%; overflow: hidden; } div.header div.column { padding: 0 20px; } div.header div.logo { /*padding: 20px 0;*/ padding: 0 !important; } div.header div.logo img { max-width: 100%; max-width: 160px !important; display: block; } div.header div.dates img { width: 100%; max-width: 175px; display: block; } div.header div.donate { text-align: right; text-transform: uppercase; } div.header div.links { text-align: right; padding-left: 20px; } div.header div.links ul { margin: 0; padding: 0; list-style-type: none; white-space: nowrap; } div.header div.links li { display: inline; } div.header div.links li a { display: inline-block; color: #00aeef; text-decoration: none; margin: 0 3px; } div.header div.links li a.search { border-right: dotted 1px rgba(0, 0, 0, .2); padding-right:10px; margin-right: 10px; } div.header div.links li a::before { font-size: 2em; color: #00aeef; font-family: "icomoon"; display: block; text-align: center; } div.header div.links li a:hover::before { color: #000; } div.header div.links li a.search::before { content: "\e601"; font-size: 2.2em; vertical-align: baseline; } div.header div.links li a.facebook::before { content: "\e639"; } div.header div.links li a.twitter::before { content: "\e638"; } div.header div.links li a.instagram::before { content: "\e637"; } div.header div.links li a.youtube::before { content: "\e636"; } @media all and (max-width: 480px) { div.header div.column { padding: 0 10px; } div.header div.links li a { margin: 0 1px; } div.header div.links li a::before { font-size: 1.4em; } div.header div.links li a.search::before { font-size: 1.6em; } } .header .hifa-17 { padding: 10px 0; text-align: left; background: url(/Web/Images/header_background_2018b.jpg) no-repeat -300px center; background-size: auto 100%; padding: 40px 0 40px 300px; } .header .hifa-17 > div { display: inline-block; margin-right: 52px; } .header .hifa-17 > div span { padding: 10px; display: block; } .header .hifa-17 strong { color: #000000; display: block; padding: 0px; text-align: center; font-size: 1.4em; font-weight: 900; text-transform: uppercase; text-align: right; font-family: oswald, sans-serif; margin-top: -6px; } .header .hifa-17 a { display: inline-block; border: solid 2px #fff; color: #fff; padding: 10px; width: 200px; text-decoration: none; margin: 2px 0; font-size: .8em; text-align: center; transition: all .4s ease; } @media all and (max-width: 780px) { .header .hifa-17 a { padding: 5px; width: 150px; margin: 1px 0; font-size: .6em; } } @media all and (max-width: 610px) { .header .hifa-17 { text-align: center; } .header .column, .header .column > div, .header .hifa-17 > div { display: block; width: 100%; } .header .hifa-17 > div > img { margin: 0 auto; } .header .hifa-17 > div > strong { text-align: center; } div.header div.logo img { margin: 0 auto; } .header .hifa-17 a { width: 49%; } .header .hifa-17 { text-align: center; background: none; padding: 40px 0; } } .header .hifa-19 { padding: 10px 0; } .header .hifa-19 > div { display: flex; align-items: center; } .header .hifa-19 > div > span { padding: 20px; color: white; font-size: 2em; } body.homepage div.pagetitle { display: none; } body.homepage div.content { padding: 0; } body.homepage div.newsletter { margin-top: 0; } body.homepage h3 { font-family: "Oswald", sans-serif; text-transform: uppercase; font-weight: 700; } body.homepage .program-banner{ text-align: left; background-color: #000; color: #fff; height: 100%; padding-top: 30px; padding-bottom: 30px; } .program-banner > .column{ display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .program-banner > .column > div:first-child{ flex: 1; } .program-banner > .column > div:last-child{ padding-left: 15px; margin: auto; flex: 3; } .program-banner > .column > div > img{ text-align: center; max-height: 200px; margin: 0 auto; } .program-banner > .column > div > h3{ color: #fff; font-size: 19px; line-height: 23px; margin: 0 0 15px; padding: 0; } .program-banner > .column > div > a{ display: inline-block; padding: 10px 10px; border: solid 2px #fff; text-decoration: none; text-transform: uppercase; font-size: .8em; color: #fff; width: 180px !important; } .program-banner > .column > div > a:hover, .program-banner > .column > div > a:focus, .program-banner > .column > div > a:active{ background-color: #fff; color: #000; } /* slideshow */ body.homepage .slide_wrapper { position: relative; } body.homepage .slide_wrapper > a { position: absolute; top: 0; width: 50px; background: rgba(0, 0, 0, .3) url(/Web/Images/slideshow_nav.png) no-repeat center center; height: 100%; cursor: pointer; z-index: 99; display: block; opacity: 0; transition: all .4s ease; } body.homepage .slide_wrapper:hover > a { opacity: 1; } body.homepage .slide_wrapper > a.prev { left: 0; background-position: center left; } body.homepage .slide_wrapper > a.next { right: 0; background-position: center right; } body.homepage ul.slideshow { margin: 0; padding: 0; list-style-type: none; position: relative; width: 100%; height: 500px; overflow: hidden; background: #eee; } body.homepage ul.slideshow li { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #fff; background-position: center center; background-repeat: no-repeat; background-size: cover; display: block; } body.homepage ul.slideshow li > div { display: block; height: 100%; max-width: 960px; position: relative; margin: 0 auto; } body.homepage ul.slideshow li > div > div { width: 300px; height: 100%; padding: 30px; background: #000000; color: #f9e8be; text-align: center; position: absolute; top: 0; right: 20px; opacity: 0; display: table; } @media all and (max-width: 660px) { body.homepage ul.slideshow li > div > div { width: 100%; right: 0; background: rgba(237, 28, 36, .6); } } body.homepage ul.slideshow li > div > div > div { display: table-cell; vertical-align: middle; } body.homepage ul.slideshow li strong { font-family: 'Oswald', sans-serif; text-transform: uppercase; display: block; font-size: 2em; position: relative; color: #00aeef; } body.homepage ul.slideshow li em { display: block; width: 50px; height: 3px; background: #00aeef; margin: 10px auto; position: relative; } body.homepage ul.slideshow li span { position: relative; display: block; color: #00aeef; } body.homepage ul.slideshow li a { font-family: 'Oswald', sans-serif; text-transform: uppercase; border: solid 3px #00aeef; display: inline-block; padding: 10px 20px; text-transform: uppercase; display: block; color: #00aeef; font-size: .8em; text-decoration: none; margin: 30px auto 0 auto; width: 150px; transition: all .4s ease; position: relative; } body.homepage ul.slideshow li a:hover { background-color: #00aeef; color: #ffffff; } /* Touts */ .touts-inner { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .touts-inner > div { background-color: #000000; -ms-flex-preferred-size: 20%; flex-basis: 20%; -ms-flex-negative: 1; flex-shrink: 1; min-height: 0px; min-width: 0px; border: 2px solid #fff; padding: 40px 0; } @media (max-width: 830px) { .touts-inner > div { -ms-flex-preferred-size: 25%; flex-basis: 25%; } .touts-inner > div:nth-child(5) { -ms-flex-preferred-size: 100%; flex-basis: 100%; } } @media (max-width: 630px) { .touts-inner > div { -ms-flex-preferred-size: 33.33%; flex-basis: 33.33%; } .touts-inner > div:nth-child(4), .touts-inner > div:nth-child(5) { -ms-flex-preferred-size: 50%; flex-basis: 50%; } } @media (max-width: 480px) { .touts-inner > div { -ms-flex-preferred-size: 50%; flex-basis: 50%; } } .touts-inner > div:last-child, .touts-inner > div:nth-child(6) { -ms-flex-preferred-size: 50%; flex-basis: 50%; } .touts-inner > div:hover { background-color: #00aeef; } .touts-inner > div > a { width: 100%; display: block; background-repeat: no-repeat; background-position: top center; background-size: auto 58px; padding-top: 65px; color: #ffd503; font-family: "Oswald", sans-serif; font-weight: 400; font-size: 1.2em; text-decoration: none; text-transform: uppercase; text-align: center; line-height: 1; } /* about */ body.homepage div.about { padding: 80px 0; background: #eee url(/Web/Images/crowd.jpg) no-repeat center center; background-size: cover; width: 100%; overflow: hidden; } body.homepage div.about, body.homepage div.about a { color: #fff; } body.homepage div.about h3 { color: #f9e8be; } body.homepage div.about p { max-width: 400px; } @media all and (max-width: 680px) { body.homepage div.about { padding: 40px 0; background-position: top left; background-size: inherit; } body.homepage div.about p { max-width: 100%; } } /* artists */ body.homepage div.artists { width: 100%; overflow: hidden; background: #263894; border-bottom: solid 5px #ac2935; } body.homepage div.artists h3 { font-size: 2em; margin: 0; } body.homepage div.artists h3 span { font-weight: 300; } body.homepage div.artists .intro { width: 50%; padding: 50px 20px 50px 0; } body.homepage div.artists .intro, body.homepage div.artists .intro a { color: #fff; } body.homepage div.artists .artist { width: 25%; position: relative; /*border-left: solid 1px #10bbb3;*/ } body.homepage div.artists .artist a { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; background-position: center center; background-size: cover; background-repeat: no-repeat; color: #fff; } body.homepage div.artists .artist strong { position: relative; display: block; vertical-align: bottom; background: url(/Web/Images/gradient.png) repeat-x bottom left; width: 100%; height: 100%; } body.homepage div.artists .artist span { display: block; width: 100%; padding: 20px; position: absolute; bottom: 0; left: 0; } body.homepage div.artists .artist em { display: block; font-size: .8em; font-style: normal; color: #999; } body.homepage div.artists .artist a:hover, body.homepage div.artists .artist a:hover em { color: #00aeef; } @media all and (max-width: 740px) { body.homepage div.artists .tbl { display: block; padding: 0; } body.homepage div.artists .tbl > div { display: block; float: left; } body.homepage div.artists .tbl > div.intro { width: 100%; padding: 20px; } body.homepage div.artists .tbl > div.artist { width: 50%; height: 250px; font-size: .8em; } } /* media */ body.homepage div.media { border-bottom: solid 5px #000000; } body.homepage div.media .tbl > div { vertical-align: top; } body.homepage div.media div.news { width: 65%; padding: 50px 0 50px 40px; } body.homepage div.media div.buzz { width: 35%; background: #ddd; padding: 50px 20px; color: #f9e8be; } body.homepage div.media div.buzz h3 { color: #00aeef; } body.homepage div.media div.news > div { margin: 20px 0; } body.homepage div.media div.news small, body.homepage div.media div.news a { font-size: 1.2em; font-family: "Oswald", sans-serif; color: #000000; font-weight: 400; text-decoration: none; } body.homepage div.media div.news small { color: #a5a5a5; } body.homepage div.media div.news span { display: block; font-size: .8em; color: #000000; } @media all and (max-width: 740px) { body.homepage div.media div.news, body.homepage div.media div.buzz { width: 50%; } body.homepage div.media div.news { padding-left: 20px; } } @media all and (max-width: 540px) { body.homepage div.media .tbl { display: block; padding: 0; } body.homepage div.media div.news, body.homepage div.media div.buzz { display: block; width: 100%; padding: 20px; } } /* tweets */ .homepage .buzz ul { height: 300px; margin: 1em 0; padding: 0; list-style-type: none; position: relative; } .homepage .buzz ul li { display: none; position: absolute; top: 0; left: 0; width: 100%; background: #263894; padding: 20px; } .homepage .buzz ul li.loading { background: url(/Web/Images/tweets_loading3.gif) no-repeat center center; height: 200px; } .homepage .buzz ul li, .homepage .buzz ul li a { color: #fff; } .homepage .buzz ul li:first-child { display: block; } .homepage .buzz h3 { display: table; width: 100%; color: #00aeef; } .homepage .buzz h3 span { display: table-cell; vertical-align: middle; color: #000000; } .homepage .buzz h3 a { display: table-cell; vertical-align: middle; font-family: inherit; color: #fff; text-align: right; text-transform: none; font-weight: 400; color: #999; } .homepage .buzz ul li .user { display: table; margin-top: 1em; font-weight: bold; color: rgba(255, 255, 255, .6); } .homepage .buzz ul li .user > div { display: table-cell; vertical-align: middle; } .homepage .buzz ul li .user .avatar img { width: 30px; height: 30px; border-radius: 30px; display: block; margin-right: 10px; } /* apps */ body.homepage div.apps { background: url(/Web/Images/blurred.jpg) no-repeat center center; background-size: cover; padding: 0; position: relative; border-bottom: solid 5px #000000; } body.homepage div.apps p { padding-right: 380px; } body.homepage div.apps div.screenshot { padding: 50px 0; background: url(/Web/Images/app.png) no-repeat right bottom; } body.homepage div.apps a { display: inline-block; width: 154px; height: 50px; margin-right: 10px; } body.homepage div.apps a.apple { background-image: url(/Web/Images/app_store_btn.png); } body.homepage div.apps a.android { background-image: url(/Web/Images/play_store_btn.png); } @media all and (max-width: 770px) { body.homepage div.apps h3, body.homepage div.apps p { padding-right: 0; text-align: center; } body.homepage div.apps div.screenshot { background-position: center bottom; padding-bottom: 350px; } } body.homepage .video-container { background: #333; } body.homepage .video-container .column { padding: 0 !important; } body.homepage div.responsive.video { position: relative; width: 100%; height: 0; padding-top: 56.25%; overflow: hidden; } body.homepage div.responsive.video > iframe { position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important; } body.homepage .donate { background: #ffffff; padding: 40px; text-align: center; color: #000; } body.homepage .donate .tbl { margin: 0 auto; width: auto; } body.homepage .donate .tbl > div { line-height: normal; padding: 0 20px 20px !important; vertical-align: top; } body.homepage .donate .tbl small { color: #fff; } body.homepage .donate a { display: inline-block; padding: 10px 10px; border: solid 2px #000; text-decoration: none; text-transform: uppercase; font-size: .8em; color: #000; width: 180px !important; } /* jQuery lightbox by Brad */ #lightbox-overlay { position: fixed; height: 100%; width: 100%; top: 0; left: 0; z-index: 9000; background: #000; } #lightbox-frame { top: 0; left: 0; width: 100%; height: 100%; position: fixed; z-index: 9001; margin: 0; padding: 0; } #lightbox-frame table { background: #fff; font-size: .8em; } #lightbox-picture { padding: 10px 10px 0 10px; background: url(/web/images/lightbox-loader.gif) no-repeat center center; } #lightbox-picture div { min-height: 200px; min-width: 200px; } #lightbox-description { padding: 10px; } #lightbox-description, #lightbox-frame a { color: #000; } #lightbox-frame ul { margin: 0; padding: 10px; list-style-type: none; float: right; } #lightbox-frame ul li { display: block; float: left; } #lightbox-frame ul li a { float: left; margin-left: 3px; font-size: .8em; text-transform: uppercase; } #lightbox-frame ul li.disabled a { color: #ccc; } #lightbox-frame ul a { display: block; width: 21px; height: 0; padding-top: 21px; overflow: hidden; background-image: url(/web/images/lightbox-nav.png); } #lightbox-previous a { background-position: 0 0; } #lightbox-previous a:hover { background-position: 0 -21px; } #lightbox-previous a.disabled { background-position: 0 -42px; } #lightbox-next a { background-position: -21px 0; } #lightbox-next a:hover { background-position: -21px -21px; } #lightbox-next a.disabled { background-position: -21px -42px; } #lightbox-close a { background-position: -42px 0; } #lightbox-close a:hover { background-position: -42px -21px; } .spinner { margin: 0 auto; width: 40px; height: 40px; position: relative; text-align: center; top: 45%; -webkit-animation: rotate 2.0s infinite linear; animation: rotate 2.0s infinite linear; } .dot1, .dot2 { width: 60%; height: 60%; display: inline-block; position: absolute; top: 0; background-color: #fff; border-radius: 100%; -webkit-animation: bounce 2.0s infinite ease-in-out; animation: bounce 2.0s infinite ease-in-out; } .dot2 { top: auto; bottom: 0px; -webkit-animation-delay: -1.0s; animation-delay: -1.0s; } @-webkit-keyframes rotate { 100% { -webkit-transform: rotate(360deg) }} @keyframes rotate { 100% { transform: rotate(360deg); -webkit-transform: rotate(360deg) }} @-webkit-keyframes bounce { 0%, 100% { -webkit-transform: scale(0.0) } 50% { -webkit-transform: scale(1.0) } } @keyframes bounce { 0%, 100% { transform: scale(0.0); -webkit-transform: scale(0.0); } 50% { transform: scale(1.0); -webkit-transform: scale(1.0); } } .working { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0,.8); } .working .feedback { color: #fff; display: table; width: 100%; height: 100%; } .working .feedback p { display: table-cell; vertical-align: middle; text-align: center; } .working .loader { position: absolute; top: 0; left: 0; } div.nav { background: #000000; z-index: 99; position: relative; border-bottom: solid 10px #00aeef; } div.nav div.column { overflow: visible; position: relative; z-index: 99; } div.nav ul.navigation { margin: 0; padding: 0; list-style-type: none; display: table; width: 100%; /*border-left: solid 1px rgba(255, 255, 255, .2);*/ height: auto; position: relative; z-index: 999; } div.nav ul.navigation > li { display: table-cell; text-align: center; height: 60px; line-height: 60px; position: relative; } div.nav ul.navigation > li > a { display: block; color: #fff; font-size: .8em; text-decoration: none; /*border-right: solid 1px rgba(255, 255, 255, .2);*/ white-space: nowrap; text-overflow: ellipsis; transition: all .4s ease; text-transform: uppercase; font-family: 'Oswald', sans-serif; } div.nav ul.navigation > li:last-child a { background: url(/Web/Images/search_icon.png) no-repeat center center; color: transparent !important; background-size: 60px 60px; } div.nav ul.navigation > li > a.selected, div.nav ul.navigation > li > a.highlighted, div.nav ul.navigation > li > a:hover, div.nav ul.navigation > li.active > a { background-color: #00aeef; color: #fff; } div.nav span { display: none; padding: 20px 0; color: #a99d81; cursor: pointer; position: relative; font-family: 'Oswald', sans-serif; text-transform: uppercase; font-size: .8em; } div.nav span::after { content: "\e60b"; font-family: "icomoon"; position: absolute; top: 0; right: 0; width: 50px; height: 100%; text-align: right; padding: 18px 0; font-size: 1.6em; } div.nav span.expanded::after { content: "\e60a"; } div.nav ul.navigation ul { display: none; position: absolute; top: 60px; left: 0; background: #00aeef; margin: 0; padding: 10px; list-style-type: none; z-index: 99; width: 200px; box-shadow: rgba(0, 0, 0, .2) 0 3px 3px; font-size: .8em; } div.nav ul.navigation ul > li { line-height: 1; } div.nav ul.navigation ul > li a { display: block; text-align: left; color: #fff; padding: 10px; text-decoration: none; } div.nav ul.navigation ul > li a:hover { color: #fff; background: rgba(0, 0, 0, .2); } div.nav ul.navigation > ul ul { display: none !important; } /* v.custom menu widths */ /*div.nav ul.navigation > li { width: 12.67% !important; }*/ div.nav ul.navigation > li:last-child { width: 5% !important; } /*div.nav ul.navigation > li.menu5 { width: 20% !important; }*/ @media all and (max-width: 780px) { div.nav span { display: block; } div.nav ul.navigation { display: none; padding-bottom: 10px; border: 0; } div.nav ul.navigation > li, div.nav ul.navigation > li.menu4, div.nav ul.navigation > li.menu5, div.nav ul.navigation > li.menu7 { display: block; text-align: left; padding: 0; width: 100% !important; overflow: hidden; height: auto; line-height: 1em; } div.nav ul.navigation li.menu7 a { background: none; color: inherit !important; width: 100% !important; } div.nav ul.navigation > li a { border: 0; padding: 5px; } div.nav ul.navigation ul { display: block !important; position: relative; top: 0; width: 100%; background: none; padding: 0; font-size: .8em; } div.nav ul.navigation ul li { padding-left: 20px; } div.nav ul.navigation ul li a:hover { transition: all .4s ease; } div.nav ul.navigation a { padding: 10px !important; } div.nav ul.navigation ul > li a { color: #a99d81; } } div.pagetitle { padding: 0; position: relative; z-index: 1; overflow: hidden; } div.banner { height: 200px; overflow: hidden; position: relative; width: 100%; } div.pagetitle img { position: absolute; z-index: 1; } div.pagetitle h1 { font-weight: normal; margin: 0; font-size: 3em; color: #00aeef; font-family: 'Oswald', sans-serif; font-weight: 700; text-transform: uppercase; padding-top: 50px; } div.pagetitle span { display: block; width: 50px; height: 3px; background: #000000; margin: 5px 0; } div.pagetitle p { margin: 0; padding-top: 5px; font-size: 1.6em; color: #a6a6a6; line-height: 1.5; } @media all and (max-width: 680px) { div.pagetitle h1 { padding-top: 30px; font-size: 2.4em; } div.pagetitle div.banner { height: 150px; } div.pagetitle p { font-size: 1.2em; } } div.paging { width: 100%; overflow: hidden; display: table; border-top: solid 2px #eee; padding-top: 20px; font-size: .8em; margin-top: 20px; } div.paging > a { display: table-cell; vertical-align: middle; text-align: center; width: 120px; text-transform: uppercase; padding: 10px 0; font-size: 1em; text-decoration: none; transition: all 0.4s ease; color: #333; border: solid 2px #333; } div.paging > a:hover { background: #333; color: #fff; } div.paging > a.disabled { border-color: #eee; color: #eee; } div.paging > div { display: table-cell; vertical-align: middle; text-align: center; padding: 0 20px; } div.paging > div a { display: inline-block; padding: 5px; } div.paging > div a.selected { border: solid 2px #333; border-radius: 100px; padding: 5px 10px; color: #333; text-decoration: none; } @media all and (max-width: 580px) { div.paging > div a { display: none; padding: 0 2px; } } .partners .list { width: 100%; overflow: hidden; } .partners .list > div { float: left; width: 20%; padding-right: 5px; text-align: center; padding-bottom: 30px; } .partners .list > div:nth-child(5n + 1) { clear: left; } .partners .list div.logo { width: 100%; display: table; border: solid 1px #eee; margin-bottom: 10px; } .partners .list div.logo > a { display: table-cell; vertical-align: middle; text-align: center; padding: 10px; height: 200px; } .partners .list div.logo > a img { max-width: 100%; max-height: 100%; display: block; margin: 0 auto; } .partners .list div > a { display: block; text-align: center; font-size: .8em; text-decoration: none; } .partners .list div > small { display: block; text-align: center; font-size: .8em; text-decoration: none; } @media all and (max-width: 880px) { .partners .list > div { width: 25%; } .partners .list > div:nth-child(5n + 1) { clear: none; } .partners .list > div:nth-child(4n + 1) { clear: left; } } @media all and (max-width: 680px) { .partners .list > div { width: 33.33%; } .partners .list > div:nth-child(4n + 1) { clear: none; } .partners .list > div:nth-child(3n + 1) { clear: left; } } @media all and (max-width: 480px) { .partners .list > div { width: 50%; } .partners .list > div:nth-child(3n + 1) { clear: none; } .partners .list > div:nth-child(2n + 1) { clear: left; } .partners .list div.logo > a { height: 150px; } } body.press div.newsletter { display: none; } body.press .content > .column { max-width: 100%; } /* Overview */ body.press .media-shortcuts { background-color: #00aeef; padding: 80px 0; margin-top: 60px; } body.press .media-shortcuts a.outline-button-reverse:hover, body.press .media-shortcuts a.outline-button-reverse:focus, body.press .media-shortcuts a.outline-button-reverse:active{ background-color: #000 !important; color: #fff !important; border-color: #000 !important; } /* Login */ body.press .login-form .form > .tbl > .row { padding: 20px; display: table-cell; width: 33.33%; vertical-align: top; } body.press .login-form .form .button { border-color: #00aeef; color: #00aeef; } body.press .login-form .form .button:hover, body.press .login-form .form .button:focus, body.press .login-form .form .button:active{ color: #fff; } @media all and (max-width: 700px) { body.press .login-form .form > .tbl > .row { display: block; width: 100%; padding: 10px 0 0; } } /* Account */ body.press-account div.content { padding: 0 0 80px 0; } body.press-account .pagetitle p.status { margin: 0 !important; background-color: #00aeef; } body.press-account > form > .pagetitle > .column{ display: none; } body.press-account .pagetitle > .column h1 { padding-top: 0; } body.press-account .account-header { background-color: #000; padding: 20px 0; margin-bottom: 60px; } body.press-account .account-header .tbl > div.lft { width: 60%; } body.press-account .account-header .tbl > div.rgt { width: 40%; } body.press-account .account-header h3 { color: #fff; margin: 0; font-family: 'Oswald', sans-serif; font-weight: 400; text-transform: uppercase; font-size:.95em; line-height: 1; text-align: right; } body.press-account .account-header .account-details { background: url(/Web/Images/user.png) no-repeat right center; background-size: 60px; min-height: 70px; padding-right: 75px; padding-top: 15px; } body.press-account .account-header a.logout { display: block; width: 100%; text-decoration: none; color: #fff; width: 100%; font-family: 'Oswald', sans-serif; font-weight: 300; text-align: right; } body.press-account .account-header a.logout:hover, body.press-account .account-header a.logout:active, body.press-account .account-header a.logout:focus{ color: #00aeef; } body.press-account .press-navigation { padding: 20px 0; } body.press-account .press-navigation > a { color: #fff; text-decoration: none; font-family: 'Oswald', sans-serif; } body.press-account .press-navigation > span { color: #fff; color: rgba(255, 255, 255, 0.5); font-size: 1.2em; } /* Show List */ body.press .showlist-header { padding-top: 30px; } @media all and (max-width: 800px) { body.press .showlist-header .tbl > div { width: 100%; display: block; } } body.press .showlist > .tbl { width: 100%; background-color: #f0f0f0; margin-bottom: 20px; } body.press .showlist > .tbl > div { display: table-cell; width: 50%; } @media all and (max-width: 800px){ body.press .showlist > .tbl > div { display: block; width: 100%; } } body.press .showlist > .tbl > div:first-child { height: 100%; padding: 0; } body.press .showlist > .tbl > div:first-child a { display: block; width: 100%; height: 100%; min-height: 300px; background-size: cover; background-position: center; background-repeat: no-repeat; } body.press .showlist > .tbl > div:last-child { padding: 20px; } body.press .showlist > .tbl > div h3 { margin-bottom: 0; } body.press .showlist > .tbl > div p { color: #575757; font-size: 16px; line-height: 1.5; margin-top: 0; } body.press .showlist > .tbl > div input[type="submit"].outline-button-reverse { border-color: #00aeef; color: #00aeef; font-weight: bold; background: none !important; padding: 10px 20px !important; border-style: solid !important; text-transform: uppercase; font-size: .8em; line-height: 1.5 !important; cursor: pointer !important; } body.press .showlist > .tbl > div input[type="submit"].outline-button-reverse:active, body.press .showlist > .tbl > div input[type="submit"].outline-button-reverse:focus, body.press .showlist > .tbl > div input[type="submit"].outline-button-reverse:hover { background-color: #00aeef !important; color: #fff !important; } body.press .showlist > .tbl > div .outline-button-reverse { border-color: #00aeef; color: #00aeef; font-weight: bold; } body.press .showlist > .tbl > div .outline-button-reverse:hover, body.press .showlist > .tbl > div .outline-button-reverse:active, body.press .showlist > .tbl > div .outline-button-reverse:focus{ background-color: #00aeef !important; color: #fff !important; } /* Media Mailing List */ body.press .mailinglist { padding: 80px 0 0; } body.press .mailinglist > .column > h3 { margin: 0; font-size: 3em; color: #00aeef; font-family: 'Oswald', sans-serif; font-weight: 700; text-transform: uppercase; padding-bottom: 20px; text-align: center; line-height: 1; } body.press .mailinglist > .column > h3 > small { font-weight: normal; color: #00aeef; font-family: 'Oswald', sans-serif; text-transform: uppercase; font-size: 30px; } body.press .mailinglist .form > .tbl > .row { padding: 20px; display: table-cell; width: 33.33%; vertical-align: bottom; } @media all and (max-width: 700px){ body.press .mailinglist .form > .tbl > .row { display: block; width: 100%; padding: 10px 0 0; } } body.press .mailinglist .form .button { border-color: #00aeef; } /* Browse Media */ body.press .media-downloads { background-color: #f0f0f0; } body.press .media-downloads ul { border: none; } body.press .media-downloads ul li { width: 33.33%; } @media all and (max-width: 800px){ body.press .media-downloads ul li { width: 50%; } } @media all and (max-width: 600px) { body.press .media-downloads ul li { width: 100%; } } body.press .media-downloads ul li > div.download > a { display: block; background-position: center; background-size: cover; width: 100%; height: 300px; } body.press .media-downloads ul li > div.download{ background-color: #fff; margin: 15px; } body.press .media-downloads ul li > div.download { background-color: #fff; margin: 15px; } body.press .media-downloads ul li > div.download { background-color: #fff; margin: 15px; } body.press .media-downloads ul li > div.download > div.download-details { padding: 0 10px 20px; height: 100%; } body.press .media-downloads ul li > div.download > div.download-details p { font-size: .8em; color: #8c8c8c; text-transform: uppercase; } body.press .media-downloads ul li a.outline-button { color: #00aeef; border-color: #00aeef; text-align: center; margin: 0; width: 100%; } body.press .media-downloads ul li a.outline-button:hover, body.press .media-downloads ul li a.outline-button:active, body.press .media-downloads ul li a.outline-button:focus{ border-color: #000; } body.press .show-details a.outline-button-reverse{ border-color: #00aeef; color: #00aeef; } body.press .show-details a.outline-button-reverse:hover, body.press .show-details a.outline-button-reverse:active, body.press .show-details a.outline-button-reverse:focus{ border-color: #000; color: #ffffff !important; background-color: #000 !important; } body.press .show-details input[type="submit"].outline-button-reverse { border-color: #00aeef; color: #00aeef; font-weight: bold; background: none !important; padding: 10px 20px !important; border-style: solid !important; text-transform: uppercase; font-size: .8em; line-height: 1.5 !important; cursor: pointer !important; } body.press .show-details input[type="submit"].outline-button-reverse:active, body.press .show-details input[type="submit"].outline-button-reverse:focus, body.press .show-details input[type="submit"].outline-button-reverse:hover { background-color: #00aeef !important; color: #fff !important; } /* daily programme grid */ .daily-program-grid { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; margin-bottom: 40px; } .daily-program-grid > div { background-color: #eee; -ms-flex-preferred-size: 33.33%; flex-basis: 33.33%; -ms-flex-negative: 1; flex-shrink: 1; min-height: 0px; min-width: 0px; border: 2px solid #fff; padding: 60px 20px; } @media (max-width: 830px) { .daily-program-grid > div { -ms-flex-preferred-size: 50%; flex-basis: 50%; } } @media (max-width: 560px) { .daily-program-grid > div { -ms-flex-preferred-size: 100%; flex-basis: 100%; } } .daily-program-grid > div > p { margin-top: 0; display: block; text-align: center; font-family: "Oswald", sans-serif; text-decoration: none; text-transform: uppercase; font-weight: 400; font-size: 1.6em; line-height: 1.5; } .daily-program-grid > div > .outline-button-reverse { display: block !important; margin: 0 auto !important; color: #00aeef !important; text-align: center !important; border-color: #00aeef !important; font-weight: 700 !important; background-color: transparent!important; text-transform: uppercase; width: 100%; border-style: solid !important; padding: 10px 15px; cursor: pointer; font-size: .9em; } .daily-program-grid > div > .outline-button-reverse:hover, .daily-program-grid > div > .outline-button-reverse:active, .daily-program-grid > div > .outline-button-reverse:focus { background-color: #00aeef !important; color: #fff !important; } .daily-program-grid > div > p > span { color: #00aeef; } /* apps */ .programme .apps { background: red; text-align: center; padding: 20px; margin: 0; font-size: 1.4em; } .programme .apps, .programme .apps a { color: #fff; } /* scroller */ .programme .scroller { width: 100%; height: 410px; overflow: auto; position: relative; } /* day filter */ .programme .days { display: table; width: 100%; background: #163750; border-bottom: solid 2px #e11933; margin-top: 30px; } .programme .days > div { display: table-cell; width: 16.66%; text-align: center; } .programme .days > div a { display: block; text-decoration: none; color: #fff; line-height: 1; padding: 10px 0; height: 100%; } .programme .days > div.active { background: #e11933; } .programme .days > div a.active, .programme .days > div a.active small { background: #e11933; color: #fff !important; } .programme .days > div small, .programme .days > div strong, .programme .days > div span { display: block; } .programme .days > div span { font-size: .8em; } @media all and (max-width: 480px) { .programme .days { font-size: .8em; } } /* times */ .programme .times { display: table; width: 3400px; margin: 0; font-size: .8em; position: relative; z-index: 3; background: #fff; } .programme .times > div { display: table-cell; width: 200px; padding: 10px; border-right: solid 2px #eee; } .programme .shows { display: table; width: 3400px; margin: 1px 0; border-bottom: solid 2px #eee; font-size: .8em; cursor: pointer; } /* shows */ .programme .shows > div { display: table-cell; } .programme .shows > div.title { width: 200px; padding: 20px 10px; background: #eee; } .programme .shows > div.list { width: 3200px; position: relative; background: #eee; } .programme .shows > div.list a { top: 5px; position: absolute; background: #fff; border-left: solid 3px #263894; padding: 5px; height: 50px; } /* download */ .programme .download { padding: 50px 20px 70px 20px; background: url(/Web/Images/festival.jpg) no-repeat center center; background-size: cover; text-align: center; } .programme .download a{ display: inline-block; } .programme .content { padding-bottom: 0; } /* filter */ .programme .filter { display: table; } .programme .filter p { display: table-cell; margin: 0; } .programme .filter p.note { text-align: right; } .programme .filter p div.input-select { width: 300px; border: solid 1px #ccc; padding:5px 10px; border-radius: 3px; display: table; } .programme .filter p div.input-select > div { display: table-cell; } .programme .filter p div.input-select::after { content: "\e60f"; font-family: "icomoon"; width: 30px; display: table-cell; color: red; text-align: right; } @media all and (max-width: 720px) { .programme .filter, .programme .filter p { display: block; } .programme .filter p div.input-select { width: 100%; } .programme .filter p.note { text-align: left; padding-top: 10px; } } /* Daily Programme Table*/ .table { background-color: transparent; color: #000; } .table p { margin: 0; } .table a { text-decoration: none; } .table th { text-align: left; } .table { width: 100%; max-width: 100%; margin-bottom: 20px; min-height: 0.01%; font-size: 0.9em; text-transform: capitalize; color: rgba(0, 0, 0, 0.7); } .table tr th { font-family: "Oswald", sans-serif; font-size: 1.2em; font-weight: 300; text-transform: uppercase; background-color: #00aeef; color: #ffffff; padding: 10px; } .table tr th, .table tr td { line-height: 1.6; vertical-align: top; } .table tr td { padding: 8px; background: #eeeeee; color: #444444; } .table tr:nth-child(2n+1) td { background: #f9f9f9; } .table thead tr th { vertical-align: bottom; } @media screen and (max-width: 767px) { .table { width: 100%; margin-bottom: 15px; overflow-y: hidden; -ms-overflow-style: -ms-autohiding-scrollbar; } .table-responsive > .table-bordered { border: 0; } } body.screen { background: #12bbb6; display: table; overflow: hidden; } body.screen div.cell { width: 100%; height: 100%; display: table-cell; vertical-align: middle; position: absolute; top: 0; left: 0; } /* USER */ body.screen div.user { position: relative; padding: 3% 15%; } body.screen div.user th, body.screen div.user td { padding: 10px; } body.screen div.user td { padding-right: 20px; } body.screen div.user img { width: 150px; height: 150px; float: left; } body.screen div.user th { background: url(/web/images/loading-avatar.png) no-repeat center center; } body.screen div.user strong { color: #fff; font-size: 2em; } body.screen div.user em { color: #fff; font-size: 1.5em; } /* TWEET */ body.screen div.tweet div.media { padding: 10%; background: url(/web/images/bubble.png) no-repeat 19% bottom; padding-bottom: 50px; } body.screen div.tweet div.media big { display: block; background: #fff; font-size: 3em; padding: 5%; } body.screen div.tweet div.media big, body.screen div.tweet div.media big a { color: #000; text-decoration: none; } /* PHOTO */ body.screen div.photo div.media { position: absolute; top: 0; left: 0; height: 100%; width: 100%; text-align: center; } body.screen div.photo div.media img { height: 100%; border: solid 10px #fff; box-shadow: 5px 5px 5px rgba(0,0,0,.25); position: relative; right: 100px; } body.screen div.photo div.user { position: absolute; bottom: 50px; right: 50px; padding: 0; background: #fff; padding: 10px; white-space: nowrap; min-width: 300px; } body.screen div.photo div.user strong { color: #000; } body.screen div.photo div.user em { color: #999; } /* ADZ */ body.screen div.adz, body.screen div.splash { display: table; } body.screen div.adz div.media, body.screen div.splash div.media { display: table-cell; width: 100%; height: 100%; text-align: center; vertical-align: middle; } div.header div.search { position: absolute; top: -999px; left: 0; width: 100%; height: 100%; background: rgba(255, 255, 255, .95); display: table; } div.header div.search a { display: table-cell; vertical-align: middle; font-size: 2em; padding-right: 30px; cursor: pointer; } div.header div.search a::after { content: "\e60a"; font-family: "icomoon"; color: red; } div.header div.search > div { display: table-cell; vertical-align: middle; padding-left: 30px; width: 100%; } div.header div.search > div input { padding: 10px; background: none; border: 0; border-bottom: solid 2px #ccc; font-size: 2em; width: 100%; color: #666; } @media all and (max-width: 480px){ div.header div.search a, div.header div.search > div input { font-size: 1.4em; } div.header div.search a { padding-right: 10px; } div.header div.search > div { padding-left: 10px; } } body.search-results .list { width: 100%; overflow: hidden; } body.search-results .list > div { margin: 1em 0 2em 0; display: table; width: 100%; } body.search-results .list > div > div { display: table-cell; } body.search-results .list > div > div.thumb { vertical-align: top; } body.search-results .list > div > div.thumb img { width: 150px; height: 150px; margin-right: 20px; } body.search-results .list > div > div.desc { width: 100%; vertical-align: middle; } body.search-results .list > div > div.desc a { display: inline-block; font-size: 1.4em; font-weight: bold; padding-right: 5px; color: #263894; } body.search-results .list > div > div.desc span { display: block; font-size: .9em; } body.search-results .list > div > div.desc em { display: inline-block; padding: 0 4px; background: #999; color: #fff; font-size: .8em; } .shows .filter { margin: 1em 0 2em 0; padding: 0; list-style-type: none; width: 100%; overflow: hidden; border-bottom: solid 2px #01354f; } .shows .filter li { float: left; width: 3.57%; text-align: center; } @media all and (max-width: 640px) { .shows .filter li { width: 7%; } } .shows .filter li a { color: #01354f; font-family: "Oswald", sans-serif; text-decoration: none; display: block; padding: 5px 0; } .shows .filter li a.selected { background-color: #01354f; color: #fff; } .shows .list { width: 100%; overflow: hidden; } .shows .list > div { float: left; width: 33.33%; padding: 5px; } .shows .list > div > div { display: table; width: 100%; background-position: center center; background-repeat: no-repeat; background-size: cover; } .shows .list > div a { background: url(/Web/Images/gradient.png) repeat-x bottom left; vertical-align: bottom; padding: 20px; height: 250px; display: table-cell; color: #fff; text-decoration: none; line-height: 1.2; } .shows .list > div a strong { display: block; } .shows .list > div a:hover { color: #00aeef; } @media all and (max-width: 760px) { .shows .list > div { width: 50%; } } @media all and (max-width: 560px) { .shows .list > div { width: 100%; padding: 5px 0; } } /* details */ .show-detail .content { padding-bottom: 0; } .shows .details { margin: 1em 0 80px 0; } .shows .details .text { vertical-align: top; padding-right: 30px; } .shows .details .shows { width: 30%; vertical-align: top; } @media all and (max-width: 480px) { .shows .details { display: block; } .shows .details .text, .shows .details .photo { display: block; width: 100%; padding: 0; } .shows .details .photo { padding-top: 30px; } } .shows .gallery { background: #eee; padding: 30px 0; } .shows .gallery .paging { margin: 0 auto; max-width: 960px; padding: 20px 25px; } .shows .gallery ul { padding: 0 20px; margin: 0 auto; max-width: 960px; list-style-type: none; overflow: hidden; } .shows .gallery ul li { float:left; width: 20%; padding: 5px; } .shows .gallery ul li a, .shows .gallery ul li img { display: block; width: 100%; } @media all and (max-width: 640px) { .shows .gallery ul li { width: 25%; } } @media all and (max-width: 480px) { .shows .gallery ul li { width: 33.33%; } } @media all and (max-width: 380px) { .shows .gallery ul li { width: 50%; } } .shows .detail .tbl { margin-bottom: 80px; } .shows .detail .tbl > div { vertical-align: top; } .shows .detail .lft .desc { margin-bottom: 50px; } .shows .detail .rgt { width: 40%; padding-left: 50px; } .shows .detail .rgt img.profile { width: 100%; display: block; margin: 1em 0 50px 0; } .shows .detail .rgt .sponsor a{ display: block; border: solid 1px #eee; margin: 1em 0 50px 0; padding: 30px; } .shows .detail .rgt .sponsor img { width: 100%; display: block; } .shows .content h2 { margin: 1em 0; text-transform: uppercase; letter-spacing: 5px; font-size: 1em; } /* times */ div.shows { margin-top: 50px; } .shows > h3 { font-size: 1em; margin: 0; color: #00aeef; } .shows .times { border-bottom: dotted 1px #ccc; margin: 1em 0; padding: 0; list-style-type: none; } .shows .times li { border-top: dotted 1px #ccc; padding: 10px 0; font-size: .8em; } .shows .times li span { display: inline-block; margin-right: 5px; } .shows .times li::before { content: "\e61f"; font-family: "icomoon"; color: #263894; padding-right: 5px; } /* sponsors */ .shows .sponsors { margin: 1em 0 50px 0; padding: 10px; text-align: center; list-style-type: none; border: solid 1px #eee; } .shows .sponsors a { display: block; } .shows .sponsors a img { display: block; margin: 10px auto; width: 100%; max-width: 200px; } /* artists */ .shows .artists { margin: 1em 0 50px 0; padding: 0; list-style-type: none; } .shows .artists li { display: table; width: 100%; margin: 10px 0; } .shows .artists li a { display: table-cell; vertical-align: middle; } .shows .artists li a.photo { width: 60px; } .shows .artists li a.photo img { display: block; width: 60px; height: 60px; border-radius: 60px; } .shows .artists li a.text { padding-left: 10px; } /* reviews */ .shows .reviews { margin-top: 50px; } .shows .reviews div.rating { background: #eee; border-radius: 3px; display: table; width: 100%; } .shows .reviews div.rating > div { display: table-cell; width: 20%; padding: 5px; text-align: center; cursor: pointer; } .shows .reviews div.rating > div::after { content: "\e616"; font-family: "icomoon"; color: #aaa; font-size: 1.4em; } .shows .reviews div.rated-1 div.rate-1-star::after, .shows .reviews div.rated-2 div.rate-1-star::after, .shows .reviews div.rated-2 div.rate-2-star::after, .shows .reviews div.rated-3 div.rate-1-star::after, .shows .reviews div.rated-3 div.rate-2-star::after, .shows .reviews div.rated-3 div.rate-3-star::after, .shows .reviews div.rated-4 div.rate-1-star::after, .shows .reviews div.rated-4 div.rate-2-star::after, .shows .reviews div.rated-4 div.rate-3-star::after, .shows .reviews div.rated-4 div.rate-4-star::after, .shows .reviews div.rated-5 div::after { content: "\e615"; color: #e8d012; } .shows .reviews .form { border-top: dotted 1px #ccc; margin-top: 30px; padding-top: 30px; } .shows .reviews h2.share { margin-top: 50px; } .shows .reviews .comments > div { background: #eee; margin: 1em 0; padding: 20px; } .shows .reviews .comments > div strong { display: block; } .shows .reviews .comments > div p { margin: .5em 0 0 0; } .shows .reviews .comments > div strong::after { font-family: "icomoon"; color: #aaa; font-size: 1em; float: right; color: #e8d012; font-weight: normal; } .shows strong.rated-1::after { content: "\e615 \e616 \e616 \e616 \e616"; } .shows strong.rated-2::after { content: "\e615 \e615 \e616 \e616 \e616"; } .shows strong.rated-3::after { content: "\e615 \e615 \e615 \e616 \e616"; } .shows strong.rated-4::after { content: "\e615 \e615 \e615 \e615 \e616"; } .shows strong.rated-5::after { content: "\e615 \e615 \e615 \e615 \e615"; } @media all and (max-width: 680px) { .shows .detail .tbl { display: block; } .shows .detail .tbl > div { display: block; width: 100%; } .shows .detail .rgt { width: 100%; padding-left: 0; padding-top: 30px; } } /* video */ .shows div.youtube { position: relative; margin: 1em 0; background: #ddd; } .shows div.youtube > div { position: relative; width: 100%; padding-bottom: 56.25%; height: 0; } .shows div.youtube > div > iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .shows .pagetitle h1 em { background: #00aeef; color: white; } .shows .pagetitle p em { background: #263894; color: white; } .shows .category { margin: 1em 0; } .shows .category div.input-select { width: 100%; border: solid 1px #ccc; padding: 5px 10px; border-radius: 3px; display: table; } .shows .category div.input-select > div { display: table-cell; } .shows .category div.input-select::after { content: "\e60f"; font-family: "icomoon"; width: 30px; display: table-cell; color: red; text-align: right; } /* tooltip */ #tooltip { position: absolute; z-index: 999999; width: 200px; font-size: .8em; border-radius: 3px; } #tooltip span { display: block; background: #000; padding: 5px 10px; text-align: center; color: #fff; } .venues .list { width: 100%; overflow: hidden; margin : 1em 0 80px 0; } .venues .list > div { float: left; width: 20%; padding-right: 5px; text-align: center; padding-bottom: 30px; } .venues .list > div:nth-child(5n + 1) { clear: left; } .venues .list div.logo { width: 100%; display: table; border: solid 1px #eee; margin-bottom: 10px; } .venues .list div.logo > a { display: table-cell; vertical-align: middle; text-align: center; padding: 10px; height: 200px; font-family: "Oswald" sans-serif; font-size: 3em; } .venues .list div.logo > a img { max-width: 100%; max-height: 100%; display: block; margin: 0 auto; } .venues .list div > a { display: block; text-align: center; font-size: .8em; text-decoration: none; } .venues .list div > small { display: block; text-align: center; font-size: .8em; text-decoration: none; } @media all and (max-width: 880px) { .venues .list > div { width: 25%; } .venues .list > div:nth-child(5n + 1) { clear: none; } .venues .list > div:nth-child(4n + 1) { clear: left; } } @media all and (max-width: 680px) { .venues .list > div { width: 33.33%; } .venues .list > div:nth-child(4n + 1) { clear: none; } .venues .list > div:nth-child(3n + 1) { clear: left; } } @media all and (max-width: 480px) { .venues .list > div { width: 50%; } .venues .list > div:nth-child(3n + 1) { clear: none; } .venues .list > div:nth-child(2n + 1) { clear: left; } .venues .list div.logo > a { height: 150px; } } .venues .content { padding-bottom: 0; } .venues .large_map { width: 100%; height: 500px; margin-top: 1em; } @media all and (max-width: 640px) { .venues .large_map { width: 100%; height: 300px; } }