@charset "utf-8";
/* CSS Document */
@font-face {
  font-family: 'MyWebFont';
  src: url('http://maliqndessentials.com/css/webfont.eot'); /* IE9 Compat Modes */
  src: url('http://maliqndessentials.com/css/webfont.eot#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('http://maliqndessentials.com/css/webfont.woff') format('woff'), /* Modern Browsers */
       url('http://maliqndessentials.com/css/webfont.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('http://maliqndessentials.com/css/webfont.svg#svgFontName') format('svg'); /* Legacy iOS */
}
html {

}

body, html {overflow:hidden;font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif; width:100%; margin:0; padding:0; overflow:hidden;	background:url(../images/BG_rev1.jpg) no-repeat center bottom fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;}html {height:100%;}
.middle { position:absolute; margin:auto; left:0; right:0; display:inline-block; width:60%; text-align:center; top:0px; bottom:0px; background:url(http://maliqndessentials.com/images/COVERTENGAH2.jpg) no-repeat center center; height:350px; background-size:contain;}
	.middle form { position:absolute; top:0; left:0; right:0; margin:0 auto; margin-top:-30px; margin-left:0px;}
	.middle input[type=email] { background:transparent;border:0; border:1px solid black; font-size:15px; padding:3px; outline:0; }
	middle input[type=email]:focus {border-bottom:1px solid red;}
	.middle button[type=submit] { background:black; color:#fff;  border:1px solid black;  padding:3px;font-size:15px;}
	.middle button[type=submit]:hover {border:1px solid red;}
	.middle span.msg { position:absolute; top:0; left:0; right:0; margin:0 auto; margin-top:-55px; margin-left:0px; font-size:15px; text-align:center;}
	.merah { color:#f00;}
	.hijau { color:#090;}
.ituneslogo {position:absolute; margin:auto; left:64px; right:0;  display:inline-block;  text-align:center; top:285px; bottom:0px; background:transparent ; height:65px; background-size:cover; width:96px;}
.ituneslogo:hover {background:#000; opacity:0.5;filter:alpha(opacity=50); background-size:cover;height:65px;width:110px;}
.blibli{position:absolute; margin:auto; left:250px; right:0;  display:inline-block;  text-align:center; top:285px; bottom:0px; background:transparent ; height:65px; background-size:cover; width:95px;}
.blibli:hover {background:#fff; opacity:0.5;filter:alpha(opacity=50); background-size:cover;height:65px;width:97px;}
.store-link { position:absolute; margin:auto; left:40%; right:0; display:inline-block; width:15%; text-align:center; z-index:1000;top:0px; bottom:0px; background:transparent; height:350px; background-size:contain;}
.store-link:hover {background:transparent;}

#newvideo {width:100%}
#slideshow {display:inline-table; position:relative; left:0px; padding:0; top:0px; right:0;width:auto; min-width:315px;min-height:236px; height:auto; float:right;}
#slideshow > div { position: absolute;
    top: 0px; 
    left: 0px; 
    right: 0px; 
    bottom: 0px; padding:0; margin:0 }

.navi {position:absolute; top:0px; bottom:0px; left:0px; right:0px; width:100%; margin:auto;height:250px;  background:transparent; padding:0; z-index:1000;}
	.navi ul.sec_left { width:180px; position:absolute; left:0;}
	.navi ul.sec_right { width:180px;  position:absolute; right:0; float:right; display:block;}
	.navi ul li { width:180px; display:block; clear:both; text-align:center; background:transparent; 
	margin-bottom:30px; padding:5px 0px 5px 0; max-height:22px; border:1px solid #333; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; }
	.navi ul.sec_left li span img { position:absolute;right:10px; vertical-align:middle;margin-top:0px;}
	.navi ul.sec_right li span img { position:absolute;left:10px; vertical-align:middle; margin-top:0px;}
	.navi ul li a { text-decoration:none; color:#000; background:transparent; font-weight:800; font-size:18px; }
	.navi ul li:hover {color:#000;}
	.navi ul li.selected a {color:#555fff;}
	.navi ul li.hassub ul { display:none; background:transparent; width:150px; height:10px; margin-left:0px;}
		.navi ul li.hassub:hover > ul { display:block;background:transparent;}
	.navi ul li.hassub > ul>li { position:relative; margin:0; display:block; padding:0; }
	.navi ul.sec_left li.hassub > ul>li {left:100px; top:-27px;}
	.navi ul.sec_right li.hassub > ul>li {right:100px; top:-27px;}
	.navi ul li.hassub ul li a {color:#fff; font-size:15px;}
	.navi ul li.hassub ul li a:hover {color:#666;}
	
.popup1 {position:absolute; left:0; top:0px; max-width:200px; min-width:200px; height:200px; background:#000;}
.popup2 {position:absolute; right:0; top:0px; max-width:200px; min-width:200px; height:200px; background:#000;}
.player {position:absolute; top:50%; left:50%; margin-left:-170px; margin-top:185px; z-index:2000;}
	.player p {margin:0; color:#fff; text-align:center; font-weight:600;}
.logo {position:relative;top:0;}
iframe.newvid {width:494px; height:380px;}

#showlist {position:absolute; top:0; bottom:0; left:0; right:0; width:500px; margin:auto; height:330px; display:inline-block; background:transparent; padding:0; z-index:1001; }
	#showlist ul { width:380px; margin:0 auto; padding:0; background:transparent; min-height:50px; max-height:445px; text-align:center;} 
	#showlist ul li { display:inline-block; width:380px; height:100px; background-color: transparent;  margin-bottom:10px;filter:alpha(opacity=90); opacity:0.9; z-index:1; color:#fff; border:0px; text-align:center; padding:0;}
	#showlist ul li .first {position:relative;top:0; left:0; width:380px; height:30px; background:transparent; color:#000; padding-right:0px; padding-left:0px;}
        #showlist ul li:hover { background:#eee;}
	#showlist ul li .first {  text-height:max-size; text-align:center;font-weight:bold;}
	#showlist .second {position:relative;top:5px; left:0px; width:380px; height:95px; background:transparent; color:#000; font-weight:800;}
	#showlist a  { text-decoration:none; color:#000;  text-align:center;}
	#showlist ul li .first a {color:#000; margin-left:0px; font-weight:500; font-size:34px; word-break:break-all }
	
	
	.circle_1 { position:absolute; top:0; bottom:0; left:0; right:0; margin:auto; background:url(../images/circle_1.png) no-repeat; background-size:650px 650px; width:650px; height:650px; background-position:center;z-index:1000; }
	.circle_2 { position:absolute; top:0; bottom:0; left:0; right:0; margin:auto; background:url(http://maliqndessentials.com/images/circle.png) no-repeat; background-size:650px 650px; width:650px; height:650px; background-position:center;z-index:1000;}

	#contentdetail {position:absolute; top:0; bottom:0; left:0; right:0; width:60%; margin:auto; min-height:450px; max-height:450px; display:inline-block; background : transparent; padding:0; border:1px solid #FF8040; border-radius:5px; z-index:1001;}
	#contentdetail ul { width:100%; margin:0 auto; background : rgba(255,255,255,.25); min-height:450px; max-height:10000px; padding:0; filter:alpha(opacity=90); opacity:0.9; display:inline-block;}
	#contentdetail ol>li { margin-left:10px;}
	#contentdetail ul a { font-weight:800; color:#333;}
	#contentdetail ul p { color:#000; margin-left:10px; margin-right:10px;font-size:16px;}
		#contentdetail ul p.judul { font-size:20px; font-weight:bold;}
	#contentdetail ul p img { text-align:center; margin:0 auto; padding-top:0px; display:inline-block; position:relative;}
	#contentdetail ul h2 {color:#000; margin-left:10px; font-size:35px;margin-right:10px; margin-bottom:5px;margin-top:0px; }
		#contentdetail ul .music1 {position:absolute; top:60px; left:0; width:280px; max-height:360px; overflow:hidden;}
			#contentdetail ul .music1 p {margin:0 0 0 20px; width:240px; text-align:center; color:#fff;}
		#contentdetail ul .music1 img {margin:20px; display:block; vertical-align:middle;}
		#contentdetail ul .music2 {position:absolute; top:80px; left:300px; max-width:500px; min-height:30px; max-height:350px;background : transparent;display:inline-block;overflow:hidden; }
		#contentdetail ul .music2 li {float:left; min-width:200px; max-width:200px;}
		#contentdetail ul .gambar { position:absolute; top:0; left:100%; width:100%; min-height:10px; background:#000;}


#splitdetail {position:absolute; top:0; bottom:0; left:0; right:0; width:60%; margin:auto; min-height:10px; max-height:450px; display:inline-block; background : transparent; padding:0; border:0px solid #FF8040; border-radius:5px; z-index:1001;}
	#splitdetail ul { width:100%; margin:0 auto; background :transparent; min-height:400px; max-height:450px; padding:0; position:absolute; top:0; left:0;  padding:10px;filter:alpha(opacity=90); opacity:0.9; z-index:10; list-style:none; text-align:center;  }
	#splitdetail ul li { width:48%; height:350px; margin-right:0; margin-top:30px; display:inline-block;}
        #splitdetail ul li.music_bg {background:url(http://maliqndessentials.com/images/music_bg.jpg) no-repeat ; background-size:cover;}
        #splitdetail ul li.music_bg:hover {filter:alpha(opacity=80); opacity:0.8;}
        #splitdetail ul li.videos_bg {background:url(http://maliqndessentials.com/images/video_bg.jpg) no-repeat ; background-size:cover;}
        #splitdetail ul li.videos_bg:hover {filter:alpha(opacity=80); opacity:0.8;}
        #splitdetail ul li.gigs {background:url(../images/gigs_bg1.jpg) no-repeat ; background-size:cover;}
        #splitdetail ul li.gigs:hover {filter:alpha(opacity=80); opacity:0.8;}
        #splitdetail ul li.or_lab {background:url(http://maliqndessentials.com/images/or_lab1.jpg) no-repeat ; background-size:cover;}
        #splitdetail ul li.or_lab:hover {filter:alpha(opacity=80); opacity:0.8;}
	#splitdetail ul li h2 { text-align:center; font-size:36px; margin-top:150px;}
	#splitdetail a { text-decoration:none; color:#fff;}
	

	.clickjoin { background:transparent; border-radius:5px;} 
	.clickjoin:hover { background:rgba(255,255,255,0.5);}
		
	
	.mv {position:absolute; top:0; bottom:0; left:0; right:0;  width:60%; margin:auto; min-height:10px; max-height:450px; background:transparent; padding:0;z-index:1001;border:0px solid #FF8040;}
	.mv ul {background:transparent; width:100%; margin:0 auto; display:inline-block;}
	.mv ul li { display:inline-block; margin:0px 15px 20px 15px; float:left; width:240px; min-height:350px;}
	.mv ul li p { margin-top:5px;}
	.mv ul li a {color:#000; text-decoration:none;}
	.mv ul li img { display:block; text-align:center;}
		.mv ul li img:hover { opacity:0.8;filter:alpha(opacity=90);}
	
	.table-css {display:table; position:absolute; top:0; bottom:0; left:0; right:0;  width:60%; margin:auto; min-height:10px; max-height:450px; background:transparent; padding:0;z-index:1001;border:0px solid #FF8040;}
		.table-css .col {display:table-cell; width:33%; padding:10px;}

	
	
	.vm {position:absolute; top:0; bottom:0; left:0; right:0;  width:60%; margin:auto; min-height:10px; max-height:450px; display:inline-block; background:transparent; padding:0;z-index:1001;border:1px solid #FF8040;}
	.vm ul {min-height:400px; max-height:10000px; background:transparent; width:100%; margin:0 auto; display:inline-block;}
	.vm ul li { display:inline-block; margin:0px 15px 20px 15px; float:left; width:100%; text-align:center;}
	.vm ul li iframe {margin:0 auto;}
	.vm ul li img { display:block; text-align:center;}
		.vm ul li img:hover { opacity:0.8;filter:alpha(opacity=90);}
		
	.mv ol {display:inline-block; list-style-position:inside; background:rgba(255,255,255,0.2);}	
	.mv li p {font-size:14px; padding-left:10px;padding-right:10px;}
		
#gallery {position:absolute; top:0; bottom:0; left:0; right:0;  width:60%; margin:auto; min-height:10px; max-height:450px; display:inline-block; background:transparent; padding:0;z-index:1001;border:1px solid #FF8040;}
	#gallery ul {min-height:400px; max-height:10000px; background:transparent; width:100%; margin:0 auto; display:inline-block; }
	#gallery ul li { display:inline-block; margin:0px 0px 0px 0px; float:left; padding:0px; }
	#gallery ul li img { vertical-align:middle; display:block; text-align:center; margin:0;}
	#gallery ul li:hover {border:1px solid transparent;}
	
	#blog {position:absolute; top:0; bottom:0; left:0; right:0;  width:60%; margin:auto; min-height:10px; max-height:450px; display:inline-block; background:transparent; padding:0;z-index:1001;border:0px solid #FF8040;}
	#blog ul {min-height:400px; max-height:10000px; background:transparent; width:100%; margin:0 auto; display:inline-block; }
	#blog ul li { display:inline-block; margin:0px 0px 20px 0px; float:left; padding:0px; width:98%; height:200px; border:1px solid #FF8040;}
	#blog ul li img { vertical-align:middle; display:block; text-align:center; margin:0;}
	#blog ul li:hover {border:1px solid black;}
	#blog ul li h2, #blog ul li p, #blog ul li a { text-align:center; font-weight:800; color:#fff; text-shadow: 0 0 4px #000; /* horizontal-offset vertical-offset 'blur' colour */
  -moz-text-shadow: 0 0 4px #000;
  -webkit-text-shadow: 0 0 4px #000;}
	#blog ul li h2 {margin-top:50px;}
	p.anak { margin-top:-20px;}

.blog { position:relative; left:15%; display:inline-block; width:100%; min-height:100px; background:transparent; margin:5px; border:1px solid #FF8040;}
	 
	.arrownext {position:absolute; top:0; right:10px; background:url(../images/next.png) no-repeat; background-size:contain; width:70px; height:50px; margin:auto 0; z-index:9999;}
	.arrowprev {position:absolute; top:0; right:90px; background:url(http://maliqndessentials.com/images/prev.png) no-repeat; background-size:contain; width:70px; height:50px; margin:auto 0;z-index:9999; }
	.arrowmid  {position:absolute; top:15px; right:65px; background:url(http://maliqndessentials.com/images/icon/tab.png) no-repeat; background-size:contain; width:40px; height:20px; margin:auto 0; z-index:9999;}
	.arrownext p, .arrowprev p { color:#7D1616; font-size:9px; margin-top:45px;}


      p { clear: both; }

      .audiojs { height: 22px; background: #404040;
        background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #444), color-stop(0.5, #555), color-stop(0.51, #444), color-stop(1, #444));
        background-image: -moz-linear-gradient(center top, #444 0%, #555 50%, #444 51%, #444 100%);
        -webkit-box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.3); -moz-box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.3);
        -o-box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.3); box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.3); width:350px; }
      .audiojs .play-pause { width: 25px; height: 20px; padding: 0px 8px 0px 0px; }
      .audiojs p { width: 25px; height: 20px; margin: -3px 0px 0px -1px; }
      .audiojs .scrubber { background: #5a5a5a; width: 200px; height: 10px; margin: 5px; }
      .audiojs .progress { height: 10px; width: 0px; background: #ccc;
        background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ccc), color-stop(0.5, #ddd), color-stop(0.51, #ccc), color-stop(1, #ccc));
        background-image: -moz-linear-gradient(center top, #ccc 0%, #ddd 50%, #ccc 51%, #ccc 100%); }
      .audiojs .loaded { height: 10px; background: #000;
        background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #222), color-stop(0.5, #333), color-stop(0.51, #222), color-stop(1, #222));
        background-image: -moz-linear-gradient(center top, #222 0%, #333 50%, #222 51%, #222 100%); }
      .audiojs .time { float: left; height: 25px; line-height: 25px; }
      .audiojs .error-message { height: 24px;line-height: 24px; }

      .track-details { clear: both; height: 20px; width: 200px; padding: 1px 6px; background: #eee; color: #222; font-size: 11px; line-height: 20px;font-family: "Century Gothic", CenturyGothic, AppleGothic; border:0;
       }
      .track-details:before { content: '♬'; background-color:#fff;}
      .track-details em { font-style: normal; color: #999; }
	  .music2 ol { padding: 0px; margin: 0px; list-style: decimal-leading-zero inside; color: #ccc; max-width: 460px; border-top: 0px solid #ccc; font-size: 0.9em; display:inline-block; background:transparent; }
      .music2 ol li { position: relative; margin: 0px; padding: 9px 15px 0px; border-bottom: 0px solid #ccc; cursor: pointer; }
      .music2 ol li a { display: inline-block; text-indent: -3.3ex; padding: 0px 0px 0px 20px; color:#fff; text-decoration:none; }
      .music2 li.playing { color: #aaa; text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.3); }
      .music2 li.playing a { color: #000; }
      .music2 li.playing:before { content: '♬'; width: 14px; height: 14px; padding: 3px; line-height: 14px; margin: 0px; position: absolute; left: -5px; top: 9px; color: #fff; font-size: 13px; text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.2); }


/* socmed: 
================================================== */
.socmed { list-style: none; padding: 0; margin:0 auto; overflow: hidden; position:absolute; top:50%; margin-top:230px; display:inline-block; width:800px; height:50px; background:transparent; left:0; right:0; z-index:1; }
.socmed ul {position:absolute; left:50%;margin-left:-149px; }
.socmed li { display:inline-block; margin-right: 3px; float:right; }
.socmed li:nth-child(1) { margin-right: 0;}
.socmed li a { width:44px; height: 44px; display: block; text-indent: -9999px; }
li.facebook a { background:url(http://maliqndessentials.com/images/icon/Facebook.png) no-repeat;}
li.facebook a:hover {background:url(http://maliqndessentials.com/images/icon/Facebook.png) no-repeat; opacity:0.8;}
li.twitter a {background:url(http://maliqndessentials.com/images/icon/Twitter.png) no-repeat;}
li.twitter a:hover { opacity:0.5;}
li.googleplus a { background:url(http://maliqndessentials.com/images/icon/Googleplus.png) no-repeat;}
li.googleplus a:hover {  opacity:0.5}
li.linkedin a { background:url(../images/icon/Instagram.png) no-repeat;}
li.linkedin a:hover {  opacity:0.5}
li.instagram a {  background:url(../images/icon/Instagram.png) no-repeat;}
li.instagram a:hover {  opacity:0.5}
li.pinterest a { background-position: -220px 0}
li.pinterest a:hover {  opacity:0.5}
li.vimeo a { background-position: -264px 0}
li.vimeo a:hover {  opacity:0.5}
li.youtube a { background:url(http://maliqndessentials.com/images/icon/YouTube.png) no-repeat;}
li.youtube a:hover {  opacity:0.5}
li.skype a { background-position: -352px 0}
li.skype a:hover { opacity:0.5}
li.rss a { background-position: -396px 0}
li.rss a:hover {  opacity:0.5}
li.soundcloud a { background:url(../images/icon/Soundcloud.png) no-repeat;}
li.soundcloud a:hover {opacity:0.5}

.green-box {
    border: #090 solid 1px;
    background: #A4F4A8;
}
.red-box {
    border: #F30 solid 1px;
    background: #F4CACD;
}

@media screen and (max-width: 767px) {
.store-link:hover {background:transparent;}
}
/* target small screens (mobile devices or small desktop windows) */
@media only screen and (max-width: 480px) {
.navi {position:absolute; top:0px; bottom:0px; left:0px; right:0px; width:100%; margin:auto;height:250px;  background:transparent; padding:0; z-index:-1;}
	.navi ul.sec_left { width:50px; position:absolute; left:0;}
	.navi ul.sec_right { width:50px;  position:absolute; right:0; float:right; display:block;}
	.navi ul li { width:50px; display:block; clear:both; text-align:center; background:transparent; 
	margin-bottom:30px; padding:5px 0px 5px 0; max-height:22px; border:1px solid #333; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; text-indent:-9999px}
	.navi ul.sec_left li span img { position:absolute;right:10px; vertical-align:middle;margin-top:0px;}
	.navi ul.sec_right li span img { position:absolute;left:10px; vertical-align:middle; margin-top:0px;}
	.navi ul li a { text-decoration:none; color:#000; background:transparent; font-weight:800; font-size:18px; }
	.navi ul li:hover {color:#000;}
	.navi ul li.selected a {color:#555fff;}
	.navi ul li.hassub ul { display:none; background:transparent; width:150px; height:10px; margin-left:0px;}
		.navi ul li.hassub:hover > ul { display:block;background:transparent;}
	.navi ul li.hassub > ul>li { position:relative; margin:0; display:block; padding:0; }
	.navi ul.sec_left li.hassub > ul>li {left:100px; top:-27px;}
	.navi ul.sec_right li.hassub > ul>li {right:100px; top:-27px;}
	.navi ul li.hassub ul li a {color:#fff; font-size:15px;}
	.navi ul li.hassub ul li a:hover {color:#666;}
     iframe.newvid {width:300px; height:200px;}
 }

/* high resolution screens */
@media (-webkit-min-device-pixel-ratio: 2),
             (min--moz-device-pixel-ratio: 2) {
								 
 .navi {position:absolute; top:0px; bottom:0px; left:0px; right:0px; width:100%; margin:auto;height:250px;  background:transparent; padding:0; z-index:-1;}
	.navi ul.sec_left { width:50px; position:absolute; left:0;}
	.navi ul.sec_right { width:50px;  position:absolute; right:0; float:right; display:block;}
	.navi ul li { width:50px; display:block; clear:both; text-align:center; background:transparent; 
	margin-bottom:30px; padding:5px 0px 5px 0; max-height:22px; border:1px solid #333; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; text-indent:-9999px}
	.navi ul.sec_left li span img { position:absolute;right:10px; vertical-align:middle;margin-top:0px;}
	.navi ul.sec_right li span img { position:absolute;left:10px; vertical-align:middle; margin-top:0px;}
	.navi ul li a { text-decoration:none; color:#000; background:transparent; font-weight:800; font-size:18px; }
	.navi ul li:hover {color:#000;}
	.navi ul li.selected a {color:#555fff;}
	.navi ul li.hassub ul { display:none; background:transparent; width:150px; height:10px; margin-left:0px;}
		.navi ul li.hassub:hover > ul { display:block;background:transparent;}
	.navi ul li.hassub > ul>li { position:relative; margin:0; display:block; padding:0; }
	.navi ul.sec_left li.hassub > ul>li {left:100px; top:-27px;}
	.navi ul.sec_right li.hassub > ul>li {right:100px; top:-27px;}
	.navi ul li.hassub ul li a {color:#fff; font-size:15px;}
	.navi ul li.hassub ul li a:hover {color:#666;}
	
}

/* low resolution screens */
@media (-webkit-min-device-pixel-ratio: 1.5),
             (max-device-pixel-ratio: 1.5),
              {
				 
 .navi {position:absolute; top:0px; bottom:0px; left:0px; right:0px; width:100%; margin:auto;height:250px;  background:transparent; padding:0; z-index:-1;}
	.navi ul.sec_left { width:50px; position:absolute; left:0;}
	.navi ul.sec_right { width:50px;  position:absolute; right:0; float:right; display:block;}
	.navi ul li { width:50px; display:block; clear:both; text-align:center; background:transparent; 
	margin-bottom:30px; padding:5px 0px 5px 0; max-height:22px; border:1px solid #333; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; text-indent:-9999px}
	.navi ul.sec_left li span img { position:absolute;right:10px; vertical-align:middle;margin-top:0px;}
	.navi ul.sec_right li span img { position:absolute;left:10px; vertical-align:middle; margin-top:0px;}
	.navi ul li a { text-decoration:none; color:#000; background:transparent; font-weight:800; font-size:18px; }
	.navi ul li:hover {color:#000;}
	.navi ul li.selected a {color:#555fff;}
	.navi ul li.hassub ul { display:none; background:transparent; width:150px; height:10px; margin-left:0px;}
		.navi ul li.hassub:hover > ul { display:block;background:transparent;}
	.navi ul li.hassub > ul>li { position:relative; margin:0; display:block; padding:0; }
	.navi ul.sec_left li.hassub > ul>li {left:100px; top:-27px;}
	.navi ul.sec_right li.hassub > ul>li {right:100px; top:-27px;}
	.navi ul li.hassub ul li a {color:#fff; font-size:15px;}
	.navi ul li.hassub ul li a:hover {color:#666;}
}

/* low resolution screens */
@media (-webkit-max-device-pixel-ratio: 0.75),
             (max-moz-device-pixel-ratio: 0.75),
              {
				 
 .navi {position:absolute; top:0px; bottom:0px; left:0px; right:0px; width:100%; margin:auto;height:250px;  background:transparent; padding:0; z-index:-1;}
	.navi ul.sec_left { width:50px; position:absolute; left:0;}
	.navi ul.sec_right { width:50px;  position:absolute; right:0; float:right; display:block;}
	.navi ul li { width:50px; display:block; clear:both; text-align:center; background:transparent; 
	margin-bottom:30px; padding:5px 0px 5px 0; max-height:22px; border:1px solid #333; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; text-indent:-9999px}
	.navi ul.sec_left li span img { position:absolute;right:10px; vertical-align:middle;margin-top:0px;}
	.navi ul.sec_right li span img { position:absolute;left:10px; vertical-align:middle; margin-top:0px;}
	.navi ul li a { text-decoration:none; color:#000; background:transparent; font-weight:800; font-size:18px; }
	.navi ul li:hover {color:#000;}
	.navi ul li.selected a {color:#555fff;}
	.navi ul li.hassub ul { display:none; background:transparent; width:150px; height:10px; margin-left:0px;}
		.navi ul li.hassub:hover > ul { display:block;background:transparent;}
	.navi ul li.hassub > ul>li { position:relative; margin:0; display:block; padding:0; }
	.navi ul.sec_left li.hassub > ul>li {left:100px; top:-27px;}
	.navi ul.sec_right li.hassub > ul>li {right:100px; top:-27px;}
	.navi ul li.hassub ul li a {color:#fff; font-size:15px;}
	.navi ul li.hassub ul li a:hover {color:#666;}
}

@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (-webkit-min-device-pixel-ratio: 1){
	.navi {position:absolute; top:0px; bottom:0px; left:0px; right:0px; width:100%; margin:auto;height:250px;  background:transparent; padding:0; z-index:-1;}
	.navi ul.sec_left { width:50px; position:absolute; left:0;}
	.navi ul.sec_right { width:50px;  position:absolute; right:0; float:right; display:block;}
	.navi ul li { width:50px; display:block; clear:both; text-align:center; background:transparent; 
	margin-bottom:30px; padding:5px 0px 5px 0; max-height:22px; border:1px solid #333; border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; text-indent:-9999px}
	.navi ul.sec_left li span img { position:absolute;right:10px; vertical-align:middle;margin-top:0px;}
	.navi ul.sec_right li span img { position:absolute;left:10px; vertical-align:middle; margin-top:0px;}
	.navi ul li a { text-decoration:none; color:#000; background:transparent; font-weight:800; font-size:18px; }
	.navi ul li:hover {color:#000;}
	.navi ul li.selected a {color:#555fff;}
	.navi ul li.hassub ul { display:none; background:transparent; width:150px; height:10px; margin-left:0px;}
		.navi ul li.hassub:hover > ul { display:block;background:transparent;}
	.navi ul li.hassub > ul>li { position:relative; margin:0; display:block; padding:0; }
	.navi ul.sec_left li.hassub > ul>li {left:100px; top:-27px;}
	.navi ul.sec_right li.hassub > ul>li {right:100px; top:-27px;}
	.navi ul li.hassub ul li a {color:#fff; font-size:15px;}
	.navi ul li.hassub ul li a:hover {color:#666;}
	}
@-ms-viewport {
	width: device-width;
}