@charset "UTF-8";
/* CSS Document */

html { width:100%; min-height: -webkit-fill-available; height:100vh; overflow:scroll}

body {
	font-family: 'Lato', sans-serif!important;
	background:url(../images/bg.jpg) no-repeat center center fixed;
	background-color:#d9d0c5!important;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: 100% 100% cover;
	-moz-text-size-adjust: none;
	-webkit-text-size-adjust: none;
	-ms-text-size-adjust: none;
	
	color:#000;
	font-size:14px!important;
	line-height:18px!important;
	font-weight:500!important;
	margin:0px 0px 0px 0px;
	overflow:auto;
}

.clearfix { clear:both;}
img { border:0; border-style: none; outline:0;}
*:focus { outline:0!important;}

a {
	text-decoration:none!important;
}

.hover:hover {
	opacity:60%;
}

.shadow {
	-webkit-box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, .1);
	-moz-box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, .1);
	box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, .1);
}

.container-fluid {
	background:url(../images/bg-ecard.jpg) no-repeat top center scroll;
	background-color: rgba(255, 255, 255, 0.8);
	-moz-box-shadow: 0px 0px 15px rgba(0,0,0,0.2);
	-webkit-box-shadow: 0px 0px 15px rgba(0,0,0,0.2);
	box-shadow: 0px 0px 15px rgba(0,0,0,0.2);
	margin:30px auto 0px;
	position:relative;
}

.logo-nmuk {
	position:absolute;
	z-index:10;
}

.logo-nmuk-mob {
	width:90px;
	margin:auto;
}

.ecard-desktop {
	width:920px;
	height:510px;
	margin:auto;
	position:relative;
	display:block;
}

.ecard-mob {
	widht:100%;
	display:none;
}

.desktop-left {
	width:450px;
	float:left;
}

.desktop-right {
	width:470px;
	float:left;
	text-align:center;
}

.header {
	color:#000000;
	margin:30px 0px 20px 110px;
}

.nontitle {
	font-size:38px;
	font-weight:700;
	line-height:40px
}

.month {
	font-size:25px;
	line-height:27px;
	text-transform:uppercase;
}

.iframe-container {
	width:450px;
	position:relative;
	margin-bottom:20px;
}

.non-cover {
	width:200px;
	margin:auto;
}

.home-text {
	text-align:center;
	font-size:13px;
}

.home-text a {
	color:#000000;
	font-weight:700;
}

.sm-buttons {
	width:150px;
	margin:-5px auto;
}

.sm-icon {
	width:30px;
	float:left;
	margin:10px;
}

.container-highlights {
	widht:470px;
	height:225px;
	background-color: rgba(133, 105, 76, .05);
	margin:30px 0px 20px;
	text-align:center;
}

.container-audiovisual {
	width:225px;
	height:250px;
	background-color: rgba(133, 105, 76, .05);
	text-align:center;
	float:left;
	margin-right:20px;
}

.container-box {
	width:225px;
	height:250px;
	background-color: rgba(133, 105, 76, .05);
	text-align:center;
	float:left;
}

.container-title {
	padding:5px;
	background-color:#85694c;
	color:#FFFFFF;
	font-size:18px;
	font-weight:700;
}

.hl-indiv {
	width:100px;
	float:left;
	margin:20px 28px
}

.other-indiv {
	margin:20px auto 0px;
}

.dvd-img {
	width:80px;
	margin:auto;
}

.box-img {
	width:125px;
	margin:auto;
}

.jazz-img {
	width:125px;
	margin:auto;
}

.catno {
	font-size:13px;
	margin:5px auto;
	text-align:center;
}

.buybtn {
	width:60px;
	padding:5px;
	color:#ffffff;
	background-color:#000000;
	letter-spacing:2px;
	border-radius:10px;
	text-align:center;
	margin:auto;
}


.buybtn:hover {
	background-color:#85694c;
	cursor:pointer;
}

.popup_highlight1, .popup_highlight2, .popup_highlight3, .popup_av1, .popup_box {
	overflow:auto;
	background:#FFFFFF;
	padding:20px;
	width:500px;
	max-width:100%;
	border-radius:6px
}

.popup-left {
	width:200px;
	float:left;
	margin-right:20px;
}

.popup-right {
	width:240px;
	float:left;
}

.popup_buybtn {
	width:60px;
	padding:5px;
	color:#ffffff;
	background-color:#000000;
	letter-spacing:2px;
	border-radius:10px;
	text-align:center;
	margin:10px 0px 0px 0px;
}

.popup_buybtn:hover {
	background-color:#85694c;
	cursor:pointer;
}

/* FOOTER */

#footer {
	width:100%;
	font-size:12px;
	text-align:center;
	color:#000000;
	font-weight:400;
	line-height:15px;
	margin-top:20px;
	margin-bottom:30px;
}

.banner {
	width:600px;
	margin:0px auto 20px;
}

.newsflash {
	font-size:15px;
	line-height:20px;
	margin:5px auto 5px;
	color:#6b6151;
}

#footer a:link, #footer a:visited {
	color:#eb7604;
	text-decoration:none;
}

/* FOOTER end */

@media screen and (min-width: 980px) {
    .container-fluid {
        width:980px!important;
        height:570px!important;
    }
}

@media screen and (max-width: 979px) {
	.container-fluid {
		width:100%!important;
		overflow-y:scroll;
        background: rgba(244, 246, 249, 0.6);
		margin:0px;
		border:5px solid #85694c;
		-moz-box-shadow: 0px 0px 15px rgba(0,0,0,0.2);
        -webkit-box-shadow: 0px 0px 15px rgba(0,0,0,0.2);
        box-shadow: 0px 0px 15px rgba(0,0,0,0.2);
        padding-bottom:30px;
        position:relative;
	}
	.ecard-desktop {display:none;}
	.ecard-mob {display:block;}
	.header {
		width:100%;
		text-align:center;
		margin:40px 0px;
		padding:0px;
	}
	.nontitle {font-size:50px; line-height:55px;}
	.month {font-size:40px; line-height:45px;}
	.mob-noncover {
		width:50%;
		margin:0px auto 30px;
	}
	.home-text {
		font-size:18px;
	}
	.welcome-text {font-size:25px;}
	.sm-buttons {margin:30px auto;}
	
	.mobile-bottom {text-align:center;}
	
	.container-highlights {width:100%; height:100%;}
	.hl-indiv {width:27%; margin:20px 3% 35px;}
	.container-audiovisual {width:48%; height:100%; margin-bottom:50px}
	.container-box {width:48%; height:100%; float:right; margin-bottom:50px}
	.dvd-img {width:50%;}
	.box-img {width:80%;}
	.jazz-img {width:80%;}
	.buybtn {margin:20px auto;}
	.banner {width:100%;}
}

@media screen and (max-width: 540px) {
	.header {margin:30px 0px 30px;}
    .nontitle {font-size:35px; line-height:40px;}
	.month {font-size:25px; line-height:28px;}
	.home-text {font-size:15px;}
	.welcome-text {line-height: 30px;}
	.hl-indiv {width:100%; margin:20px auto;}
	.hl-img {width:80%; margin:20px auto 0px;}
	.popup-left {
		width:100%;
		margin-bottom:20px;
	}
	.popup-right {width:100%;}
	.popup_buybtn {margin:20px auto;}
	.container-audiovisual {width:100%; margin-bottom:20px;}
	.container-box {width:100%; float:left; margin-bottom:50px}
	.dvd-img {width:50%;}
	.box-img {width:80%;}
	.jazz-img {width:80%;}
	
    
}