/* initial markup */
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,q,fieldset,dl,dt,dd,iframe,table,tbody,thead,td,th,address,legend {
	margin:0;
	padding:0;
}

.break { clear: both; }
.align-right { float:right;}
.align-left { float:left;}
.center {margin: 0 auto;}
a img,:link img,:visited img {border:none;}
a { outline: none; }
.hide, .skip {display: none;}
.center {text-align: center;}
* focus, object, player {outline: none;}

body { line-height: 1.5em; font-family: Frutiger, Univers, "Helvetica Neue", arial, helvetica, sans-serif; font-size: 12px;}

p { 
	font-size: 1.10em;
	line-height: 1.32em;
	margin-top: 1.1em;
}
p.intro {
	font-size: 1.20em;
	line-height: 1.32em;
	font-weight: 800;
	margin: 0;
}
p.next {
	margin-top: 0em;
	text-align:right;	
}
ul.bullet {
	font-size: 0.98em;
	line-height: 1.32em;
	margin-left: 12px;
	margin-top: 1.1em;
}

h1 { 
	font-size: 1.45em;
	text-transform: uppercase;
	line-height: 1.1em;
	font-weight: 300;
	margin-top: 1em;
	margin-bottom: 0.5em;
}

h2 {
	font-size: 1.20em;
	line-height: 1.2em;
	font-weight:800;
	margin-top: 1.1em;
	margin-bottom: -0.5em;
}

/* modal styles */
.modal {
	z-index: 1000;
	display: block;
	padding-top: 20px;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow: auto;
	background-color: rgb(0,0,0);
	background-color: rgba(0,0,0,0.6)
}
.modal-content {
	margin: auto;
	background-color: #fff;
	position: relative;
	padding: 0;
	outline: 0;
	max-width: 450px;
	color: #19457d;
}
ul.modal-list {
	padding-left: 30px;
}
.modal-inner { padding: 20px 30px; }
.modal-close {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	cursor: pointer;
	position: absolute;
	right: 0;
	top: 0;
	background: #21bbef;
	color: #ffffff;
	font-size: 2em;
	padding: 5px 10px 10px 10px;
}
.animate-opacity { animation: opac 0.8s }@keyframes opac{from{opacity:0} to{opacity:1}}


/* design styles */
#container {
	position: relative;
	margin: 22px auto;
	width: 900px;
	height: 600px;
}
#bg {
	position: absolute;
	top: 0;
	left: 0;
}
#fg {
	position: relative;
	z-index: 10;
	width: 900px;
	height: 600px;
	display: block;
	background-color: transparent;
}
#logo {
	margin: 0 0 0 22px;
	padding: 0;
	border: 0;
	text-decoration: none;
}
#main {
	position: absolute;
	top: 79px; /* gelijk aan logo*/
	right: 79px; /* gelijk aan top */
}
#contents {
	min-height: 120; /* 122px; */
	max-height: 260px;
	width: 340px; /* Optelsom en aftreksom van breedte/hoogte en margins */
	padding: 0px 20px 20px 20px;
 	background: url(../../images/antonia/backgrounds/dragon.png) top left repeat;
	color: #ffffff;
	overflow-y: auto;
	overflow-x: hidden;
}
#contents-large {
	min-height: 120; /* 122px; */
	max-height: 440px;
	width: 340px; /* Optelsom en aftreksom van breedte/hoogte en margins */
	padding: 0px 20px 20px 20px;
 	background: url(../../images/antonia/backgrounds/dragon.png) top left repeat;
	color: #ffffff;
	overflow-y: auto;
	overflow-x: hidden;
}
#contents a, #contents-large a {
	color: #ffffff;
}
#contents a:hover, #contents-large a:hover {
	color: #19457d;
}

#viewer {
	display: block;
	position: relative; 
	width: 380px;
	height: 173px;
	margin-top: 10px;
}
#wrapper {
	position: relative;
	width: 370px;
	height: 157px;
	margin-top: 10px;
	border: 5px #ffffff solid;	
}
#mediaplayer {
	position: relative;
	width: 370px;
	height: 157px;
	border: none;
}
#menu {
	height: 100%;
	margin: -104px 0px 0px 0px;
	padding: 0;
	background: -webkit-linear-gradient(left,rgba(25,69,125,0.3) 0%,rgba(25,69,125,0) 21%) !important; /*Safari 5.1-6*/
	background: -o-linear-gradient(right,rgba(25,69,125,0.3) 0%,rgba(25,69,125,0) 21%) !important; /*Opera 11.1-12*/
	background: -moz-linear-gradient(right,rgba(25,69,125,0.3) 0%,rgba(25,69,125,0) 21%) !important; /*Fx 3.6-15*/
	background: linear-gradient(to right,rgba(25,69,125,0.3) 0%, rgba(25,69,125,0) 21%) !important; /*Standard*/
	animation: fadein 0.3s ease-in;
    -moz-animation: fadein 0.3s ease-in;
    -webkit-animation: fadein 0.3s ease-in;
    -o-animation: fadein 0.3s ease-in;
}
img.selectorr {
	vertical-align: 1px;	
}
img.selectord {
	vertical-align: 1px;	
}

/* nav styles */
#nav {
	padding: 104px 0px 0px 0px;
	margin: 23px 0 0 34px;
	width: 160px;
	line-height: 2.0em;
}
#nav li {
	list-style: none;
	margin: 0; 
	padding: 0;
}
/* set top and bottom padding for active submenu */
#nav li.selected a.single {
	border-bottom: #ffffff solid 1px;
}
#nav li.selected a.single:hover {
	text-decoration: none;
}
#nav li.selected a.current { }
#nav li.selected a.current:hover {
	text-decoration: none;
	border: none;
}
#nav li a {
	font-size: 1.10em;
	color: #ffffff;
	text-transform: uppercase;
	text-decoration: none;
	vertical-align: bottom;
}
#nav li a:hover {
	border-bottom: #ffffff solid 1px;
}
#nav li a.current { }
/* show first submenu when parent list item is selected */
#nav li.selected ul {
	display: block;
	line-height: 1.4em;
	padding-left: 10px;
	border-left: #ffffff dotted 1px;
}
#nav li.selected ul li a {
	text-transform: none;
	text-decoration: none;	
}
#nav li.selected ul li a:hover {
	text-decoration: underline;
	border: none;
}
#nav li.selected ul li.selected a.current {
	border: none;	
}
#nav li.selected ul li.selected a.current:hover {
	border: none;	
}
/* set selector image to left margin if needed */ 
#nav li.selected ul li.selected ul li a.current img.selectorr {
	margin-left: -9px;	
}
#nav li.selected ul li.selected a.current img.selectord {
	margin-left: -9px;	
}
#nav li.selected ul li.selected a.current img.selectorr {
	margin-left: -9px;	
}
/* hide child ul's when no parent li is not selected */
#nav li ul, #nav li.selected ul li ul {
	display: none;
}
/* show second submenu when parent list items is selected */
#nav li.selected ul li.selected ul {
	display: block;
	line-height: 1.4em;
	padding-left: 10px;
	border-left: 1px dotted #ffffff;
}
/* nav styles end */

#like {
	position: absolute;
	height: 20px;
	bottom: 12px;
	left: 124px;	
}

/* bottom links styles */
.icon {
	background:url(../../images/antonia/icons/icons.png) no-repeat center;
}
#bot-links {
	position: absolute;
	width: 82px;
	height: 20px;
	background-color: transparant;
	list-style: none;
	bottom: 12px;
	left: 34px;
	padding: 0;
	}
#bot-links a { }
#bot-links li a:hover { }
#bot-links .anbos {
	display:inline-block;
	width:82px;
	height:20px;
	margin:0;
	padding:0;
	text-indent:-9999px;
}
#bot-links .anbos {
	background-position: 0px 0px;
}
#bot-links .anbos:hover {
	background-position: 0px -22px;
}

/* bottom links styles end */
#bc {
	position: absolute;
	top: 15px;
	right: 20px;
}
#bc p {
	background-color: none;
	height: 23px;
}
#wd {
	position: absolute;
	bottom: 8px;
	right: 452px;	
}
#ci {
	position: absolute;
	bottom: 0px;
	right: 32px;
	color: #19457d;
	font-size: 0.85em;
}
* html #contents{
	background: #4abde6;
}
#bg-cover {
	position: absolute;
	top: 0;
	left: 0;
	margin: 0;
	width: 0;
}
#bg-cover img {
	animation: fadein 0.3s ease-in;
    -moz-animation: fadein 0.3s ease-in;
    -webkit-animation: fadein 0.3s ease-in;
    -o-animation: fadein 0.3s ease-in;
}
@keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-moz-keyframes fadein { /* Firefox */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-webkit-keyframes fadein { /* Safari and Chrome */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-o-keyframes fadein { /* Opera */
    from {
        opacity:0;
    }
    to {
        opacity: 1;
    }
}