/*
Theme Name: Radar Agency V4
*/

body {
	margin:0;
	padding:0;
	font-family: sans-serif;
	font-size: 85%;
	line-height: 130%;
	opacity:0.0;
	transition:opacity 0.3s ease;
	-webkit-transition:opacity 0.3s ease;
	-webkit-font-smoothing: subpixel-antialiased;

}

.scroll-height {
	position: absolute;
	width:5px;
	top:0px;
}
.scroll-wrap {
	width:100%;
}

/* 
rood	e2001a 
blauw	2e3192
aqua	85fbfc
bruin	786854
*/
.col1 {
	margin:10px;
}
.col1, .col2, .col3 {

}
.left {
	float:left;
}
.right {
	float:right;
}
/* Header */

header {
}

a img,
img {
	border:none;
/*    vertical-align: middle;
*/	vertical-align:text-bottom;    
}

ul, li {
	list-style: none;
	padding:0px;
}

@-webkit-keyframes bgscroll {
	from {background-position:0 0;}
	to {background-position:0 -350px;}
}

@keyframes bgscroll {
	from {background-position:0 0;}
	to {background-position:0 -350px;}
}

#logo {
	background-color:#2e3192;
  background-image: url(img/logo-background-open.png);
  -webkit-animation:bgscroll 6s infinite linear;
  margin:10px;
  float:left;
}

#logo:hover {
	background-color:#e2001a;

}

#logo img {
	width:100%;
	height:auto;
	margin-bottom:-10px !important;
}

.menu {
	float:right;
	margin:10px;

}

.menu ul {
	list-style: none;
	padding:0px;
  	display: -ms-flex;
  	display: -ms-flexbox;
  	display: -webkit-box;
  	display: flex;
    -ms-flex-pack: center;
	width:100%;
  -ms-flex-pack: justify;
  justify-content: space-around;
  -webkit-justify-content: space-between;

}

.menu li {
	text-transform: uppercase;
	text-align: center;
	float: left;
	font-size: 11px;
	letter-spacing: -1px;
	font-weight:bold;

	width:60px;
	height:38px;
	padding-top: 21px;

	margin-bottom:10px;
	margin-top:18px;

	
	border-radius:100%;
	color:#2e3192;
	border:3px solid #786854;
}

.menu li.selected, .menu li:hover {
	color:white;
	background:#e2001a;
	border:3px solid #e2001a;
}


h2, h3 {
	font-weight: normal;
	line-height: 135%;
	text-transform: uppercase;

}
.card h3 {
	margin:120px 10px 5px 10px;
}


p  {
	margin:0px 10px 10px 10px;
    word-wrap: normal;
}

a:link, a:link:visited {
	color:#e2001a;
	text-decoration:none;
	cursor:pointer;
}
a:hover, a:link:visited:hover {
	color:#2e3192;
}
	
.wide,
.small {
	margin:0px auto;
}

.small {
	margin-top:20px;
}

.wide {
		margin-top:10px;
		position: relative;
}

.scroll-count {
/*	-webkit-transform: translateZ(0px);	
	-webkit-transform: translateY(-1px);	
*/}

.artists {
/*	padding-right:200px;
*/	overflow: hidden;
}

.agenda {
	width:200px;
	position: absolute;
	height:100%;
	right:0px;
}
.dot {
	width:180px;
	padding:5px;
	padding-right:0px;
	background: #293791;
	margin-left:10px;
	margin-bottom:10px;
	position: relative;
	display: table;
	font-size: 75%;
}

.v-align {
	display:table-cell;
	vertical-align: middle;

}

.dot h3{
	margin:0px 10px 0px 10px;
	color:white;
}

.dot p {
	margin-top:0px;	
	margin-bottom:0px;	
	color:white;
}
.dot a:link, a:visited {
	color:#e2001a;
	text-decoration: none;
}
.dot a:hover, a:visited:hover {
	color:#786854;
}

.wide:after,
.small:after {
	content: "";
	display: table;
	clear: both;
}
.search .wide:after {
	display: none;
}
.aqua-rect {
	background:#71FBFD; 
	display: inline-block;
	margin:10px;
	position: relative;
	margin-bottom:0px;
}
.aqua-rect h3, 
.aqua-rect ul, 
.aqua-rect p {
	margin:10px;
}
.aqua-rect ul {
	padding-left:15px;
}
.aqua-rect li{
	list-style: disc;
}
.card {
	background:#71FBFD; 
	width:180px;
	height:245px;
	float:left;
	margin:10px;
	position: relative;
	overflow: hidden;
}

.card .icons {
	font-size: 18px;
	position: absolute;
	bottom:5px;
	left:10px;
	z-index: 280;
}

.corner {
	position: relative;
	z-index: -1;

}
.images a {
	position: relative;
	display:block;
	margin-bottom:10px;
}
.dot a {
	display:inline;
	margin-bottom:0px;	
}
.images a img {
	margin-bottom:-3px;
}
.images a img:before,
.corner:before,
.aqua-rect:before,
.dot:before,
.card:before {
    content: '';
    position: absolute;
    top: -1px;
    left: -1px;
    border-top: 14px solid white;
    border-right: 14px solid transparent;
    width: 0;
    height: 0;
    z-index: 100;
    pointer-events: none;
}
.images a img:after,
.corner:after,
.aqua-rect:after,
.dot:after,
.card:after {
    content: '';
    position: absolute;
    bottom: -2px;
    right: -1px;
    border-top: 14px solid transparent;
    border-right: 14px solid white;
    width: 0;
    height: 0;
    z-index: 100;
    pointer-events: none;
}
.card a {
	cursor: pointer;
}
.icons a:link, 
.icons a:visited {
	color:black;
	outline:none;
} 
.icons a:hover, 
.icons a:visited:hover {
	color:#e2001a;
} 

a .card {
	color:black;
}
a .overlay {
	position: absolute;
	display: block;
	width:100%;
	height:100%;
	z-index: 3;	
	cursor:pointer;
/*	mix-blend-mode:multiply;
*/}
.overlay {
	cursor:pointer;
}
#crew .card {
	height:280px;
}

/*
rood	e2001a 
blauw	2e3192
aqua	85fbfc
bruin	786854
*/
a:hover .overlay1 {
	background-image:url(img/stripes-wit.png);
	-webkit-animation:overlay1 5s infinite linear;
	        animation:overlay1 5s infinite linear;
}

@-webkit-keyframes overlay1 {
	from {background-position:0 0;}
	to {background-position:0 -400px;}
}

@keyframes overlay1 {
	from {background-position:0 0;}
	to {background-position:0 -400px;}
}


a:hover .overlay2 {
	background-image:url(img/bollen-wit.png);
	-webkit-animation:overlay2 3s infinite linear;
	        animation:overlay2 3s infinite linear;
}
@-webkit-keyframes overlay2 {
	from {background-position:0 0;}
	to {background-position:400px 0;}
}
@keyframes overlay2 {
	from {background-position:0 0;}
	to {background-position:400px 0;}
}

a:hover .overlay3 {
	background-position:center center;
	background-image:url(img/swirl-wit.png);
	-webkit-animation:overlay3 3s infinite linear;
	        animation:overlay3 3s infinite linear;
}

@-webkit-keyframes overlay3 {
	0% {background-size:200%;}
	50% {background-size:250%;}
	100% {background-size:200%;}
}

@keyframes overlay3 {
	0% {background-size:200%;}
	50% {background-size:250%;}
	100% {background-size:200%;}
}

a:hover .card {
	background: white;
}



.thumb {
	position: absolute;
	width:100%;
	height:110px;
	background: gray;
	background-size: cover;
	z-index: 1;
}

.icon {
	width:15px;
	height:15px;
}

.clear {
	clear:both;
}

.search {
	width:100%;
	margin:0px auto;
	background: rgba(255,255,255,0.95);
	top:0px;
	z-index: 99900;
	margin-bottom:10px;

}
.search .menu {
	margin-top:0px;
	margin-bottom: 0px;
	opacity: 0;
	pointer-events: none;
}
.search .menu.visible {
	opacity: 1;
	pointer-events: auto;
}
.search .menu li {
	margin-top:0px;
	margin-bottom: 0px;
}
.search .wide {
	margin: 0px auto;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
}
input[type="text"],
input[type="email"] {
	
	margin-bottom:10px;
	border:3px solid #736659;
	padding:5px;
	font-size:1.17em;
	text-transform: uppercase;
	width:calc(100% - 18px);
	float:left;
	margin-left:10px;
	z-index: 9999000;
}

.search input[type="text"] {
	width:calc(100% - 68px);
}


.search-btn {
	width:28px;
	height:28px;
	float:left;
	cursor: pointer;
	margin:4px;
	margin-left:0px;
	margin-top:-8px;
	line-height:0px;	
	font-size: 50px;
	color:#786854;
}
.search-btn:hover {
	color:#e2001a; 
}

ul.genres {
	list-style: none;
	margin:0px;
	margin-right:10px;
	padding:0px;
	float:right;

/*	display: -webkit-flex; 
  	display: flex;
   -webkit-flex-flow: row wrap;
   flex-flow: row wrap;
  -webkit-justify-content: space-between; 
  justify-content:space-between;  		
*/
}
ul.genres li {
	text-transform: uppercase;
	padding-right:5px;
	padding-bottom:5px;
	float:left;
}

/*rood	e2001a 
blauw	2e3192
aqua	85fbfc
bruin	786854
*/

ul.genres a:link,
ul.genres a:visited {
	color:#786854;
	text-decoration: none;
	padding:5px;
}
ul.genres a:hover,
ul.genres a:visited:hover,
ul.genres a.selected {
	color:#e2001a;
}
 
.nav {
	height:110px;
}

/*
FOOTER
*/
footer {
	padding-bottom:20px;
}
footer p{
	margin-left:0px;
}

.footer-left {
	margin-left:10px;
}
.footer-right {
	margin-right:10px;
}
/* HIGHLITES */

.video {
	position: relative;
	margin:0px auto;
	margin-bottom: 20px;
}

.highlights {
	position: absolute;
	width:100%;
	height:100%;
	background-size: cover;
	background-position: center center;
}

.highlights .text {
	position: absolute;
	width:100%;
	padding-top:5%;
	bottom:0px;
	padding-bottom: 10px;
	display: inline-block;

	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjElIiBzdG9wLWNvbG9yPSIjMDAwMDAwIiBzdG9wLW9wYWNpdHk9IjAuMDEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=); /* FF3.6+ */ /* Chrome,Safari4+ */ /* Chrome10+,Safari5.1+ */ /* Opera 11.10+ */ /* IE10+ */
	background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.01) 1%,rgba(0,0,0,1) 100%);
	background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.01) 1%,rgba(0,0,0,1) 100%); /* W3C */


}

.highlights h1, 
.highlights p, 
.highlights a {
	color:white;

}
.highlights h1 {
	font-weight: normal;
	margin-left:10px;
	margin-bottom:10px;
	font-size: 2.2em;
}

.cycle-slideshow {
	height:100%;
	width: 100%;
	position: absolute;
}

/* SUBSCRIBE */
.mc_embed_signup {
	margin-left:-10px;
}
.mc_lang {
	margin-bottom:13px;
}
.clear {
	margin-top:5px;
}



/* SINGLE ARTISTS */
.images {
}
.images img {
	width:100%;
	height:100%;
	margin-bottom:15px;
/* 	position: relative; */
	z-index: 1;
}
.scroll-count {
	margin-top:140px;
}
.circle_bg {
	background: white;
	position: absolute;
	width: 100%;
	height:140px;
	z-index: 300;
	
}
.circle {
	width:130px;
	height:90px;
	padding-top: 40px;
	background-color:#2e3192;
	border-radius:100%;
	margin:0px auto;
	margin-bottom:20px;
	color:white;
	text-align: center;
}
a .circle:hover{
	background: #e2001a;
	display: block;
}
#artist {
	min-height:460px;
}
#artist .intro {
	font-weight: bold;
}
#artist .agenda {
	right:-10px;

}

 .icons {
	font-size: 20px;
	margin: 10px;
	margin-top:20px;
}
.card .icons {
	margin: 0px;	
}
.prev:visited, .next:visited,
.prev, .next {
	width: 60px;
	height:50px;
	border-radius:100%;
	background: white;
	position:absolute;
	z-index: 1000;
	top:calc(50% - 30px);
	font-size:42px;
	text-align: center;
	padding-top:10px;
	color:#2e3192 !important;

}
.prev:hover, .next:hover {
	color:#e2001a !important;
}
.prev {
	left:-35px;
}
.next {
	right:-35px;
}


[data-img] {

	background-color: gray;
}

/*SHOWS*/
.show-container {
	display: -ms-flexbox;
	display: -webkit-box;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
}
.show {
    margin: 10px;
    display: -ms-flexbox;
    display: -webkit-box;
    display: flex;
}
.show .date {
	background: #293791;	
	color:white;
    width: 73px;
    height:73px;
    border-radius: 100%;
    margin-right:10px;
    display: table;
}
.show .date .text {
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	text-transform: uppercase;
}
.show .date .text * {
	margin:0px;
}
.show .info {
	z-index: 1000;
    background: #71FBFD;
    -ms-flex:3;
        -webkit-box-flex:3;
            flex:3;
}
.show-container h2 {
	width:100%;
	clear: both;
}
.show h3 a:link, 
.show h3 a:visited {
	color:black;
} 

.show h3 a:hover, 
.show h3 a:visited:hover {
	color:#e2001a;
} 


.show h3, p{
	margin:0px;
	margin-left:10px;
	margin-right:10px;
}
.show h3 {
	margin-top:10px;	
}
.show p:last-child {
	margin-bottom: 10px;
}

.show-container.this-week {
	-ms-flex-pack: distribute;
	    justify-content: space-around;
}
.show .thumb {
	position:relative;
	float:left;
	margin-right:20px;
	height:100%;
	background-size: cover;
	background-position: center center;
}

a.button {
	width:100px;
	padding:10px 40px 10px 40px;
	margin: 0px auto;
	display: block;
	text-align: center;
	color:white;
	background: #786854;

}
input[type="submit"] {
	border:none;
	font-size:1em;
}
input[type="submit"]:hover,
a.button:hover {
	background:#e2001a;
	color:white;
}

footer input[type="submit"] {
	padding:10px 20px 10px 20px;
	display: block;
	text-align: center;
	color:white;
	background: #786854;
	font-size:1em;

}
input[type="email"] {
}

/*input[type="submit"] {
	background-color:#786854;
	border:3px solid #786854;

	color:white;
	font-size:1.13em;
	font-family: sans-serif;
	text-transform: uppercase;
	
	padding:3px;
}
*/
/*input[type="submit"]:hover {
	background-color:#e2001a;
	cursor:pointer;
	border:3px solid #e2001a;

}*/
input[type="radio"] {
 	display:none;
}
input[type="radio"]:checked + label span{
	color:#e2001a;
}
input[type="radio"] + label span:hover {
	cursor:pointer;
}

input[type="email"] {	
	margin-bottom:10px;
	border:3px solid #786854;
	padding:5px;
	font-size:1.17em;
	text-transform: uppercase;
	width:calc(100% - 18px);
	float:left;
	margin:10px;
	margin-left:0px;
	z-index: 9999000;
}
.crew {
	width:180px;
	height:245px;
	float:left;
	margin:10px;
	position: relative;
	overflow: hidden;
}
.crew .circle-thumb {
	width:110px;
	height:110px;
	padding-top:0px;
	background-repeat: no-repeat;
	background-position: center center;
	background-color: gray;
	border-radius:100%;
	margin:0px auto;
	margin-bottom:20px;	
	margin-left:40px;
	background-size:cover;
}
.crew .card {
	margin-top:0px;
	height:116px;
}
.crew .card:after {
	right:10px;
}
.crew .card h3 {
	margin-top:10px;
}
