/* ---------- OUTSIDE ---------- */
	* {
		margin: 0;
		padding: 0;
		text-decoration: none;
		list-style-type: none;
	}
/* ---------- END OUTSIDE ---------- */
/* ---------- MAIN SETTINGS ---------- */
	#hdau{
		background: black;
	}
	#hdau ul,
	#hdau li{
		margin: 0;
	}
	#hdau,
	#hdau .hdau_sec01,
	#hdau .hdau_sec02,
	#hdau .hdau_sec03,
	#hdau .hdau_sec04{
		margin: 0;
		padding: 0;
		border: 0;
		font: inherit;
		vertical-align: baseline;
	}
	#hdau h1,
	#hdau h2,
	#hdau h3,
	#hdau h4,
	#hdau h5,
	#hdau p,
	#hdau a,
	#hdau li {
		font-family: "Segoe UI", "Hind Siliguri", "Microsoft JhengHei", "Arial";
		margin: 0;
		line-height: normal;
		text-align: center;
		color: white;
	}
	#hdau h1 {
		font-family: "Myriad Pro", "Myriad", "Liberation Sans", "Nimbus Sans L", "Helvetica Neue", Helvetica, Arial, sans-serif;
		margin-top: 55px;
		font-weight: 600;
		font-size: 3.60rem;
		letter-spacing: 1px;
	}
	#hdau h2 {
		font-weight: 300;
		font-size: 38px;
		color: #C7CFDD;
		text-transform: capitalize;
		letter-spacing: 0.5px;
		padding:0 20px;
	}
	#hdau h4 {
		font-size: 1.1rem;
		font-weight: 500;
		color:white;
		text-align: center;
	}
	#hdau p {
		font-size: 1em;
		font-weight: 400;
		line-height: 1.5em;
		margin: 0;
	}
/* ---------- END MAIN SETTINGS ---------- */
/* ---------- SEC01 ---------- */
	#hdau .hdau_sec01{
		background: black center top no-repeat;
	}
	#hdau .hdau_sec01 .hdau_container{
		padding: 60px 0 100px;
	}
	#hdau .hdau_sec01 .hdau_img{
		display: block;
		width: 280px;
		height: 280px;
		margin:0px auto;
		position: relative;
	}
	#hdau .hdau_sec01 .hdau_img > img{
		width: 0;
		height: 0;
		position: absolute;
		margin:auto;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
	}
	#hdau .hdau_sec01 span{
		display: block;
		width: 615px;
		height: 2px;
		margin:20px auto 25px;
		background: red; /* For browsers that do not support gradients */
		background: -webkit-linear-gradient(left,red,yellow,#00CB07,#07A9FF,#1044FF,#1B2F7F,#D92F7F);/* For Safari 5.1 to 6.0 */
		background: -o-linear-gradient(left,red,yellow,#00CB07,#07A9FF,#1044FF,#1B2F7F,#D92F7F);/* For Opera 11.1 to 12.0 */
		background: -moz-linear-gradient(left,red,yellow,#00CB07,#07A9FF,#1044FF,#1B2F7F,#D92F7F);/* For Fx 3.6 to 15 */
		background: linear-gradient(to right, red,yellow,#00CB07,#07A9FF,#1044FF,#1B2F7F,#D92F7F); /* Standard syntax */
	}
	#hdau .hdau_sec01 p{
		width: 590px;
		margin:0 auto;
		text-align: center;
		font-weight: 400;
	}
	#hdau .hdau_sec01 p.hdau_note{				
		font-family: "Segoe UI", "Hind Siliguri", "Microsoft JhengHei", "Arial";
		font-size: .85em;
		font-weight: 200;
		line-height: 1.3em;
	}
	#hdau .hdau_sec01 p.hdau_note a{
		text-decoration: underline;
	}
	#hdau .hdau_sec01 p.hdau_note a:hover{
		font-weight: 400;
	}
/* ---------- END SEC01 ---------- */
/* ---------- SEC02 ---------- */
	#hdau .hdau_sec02{
		background:#232323;
		color:white;
		padding:60px 0 70px;
	}
	#hdau .hdau_sec02 .hdau_container{
		width: 900px;
		margin: 0 auto;
	}
	#hdau .hdau_sec02 .hdau_left{
		display: inline-block;
		width: 36%;
		vertical-align: top;
	}
	#hdau .hdau_sec02 .hdau_left li{
		height: 54px;
		background:rgba(199,207,211,.2);
		color: #C7CFDD;
		font-size: 1.25rem;
		text-align: left;
		padding:12px 30px;
		box-sizing: border-box;
		border-top: 1px solid rgba(199,207,211,.1);
		-webkit-transition: all .4s ease;
		   -moz-transition: all .4s ease;
		    -ms-transition: all .4s ease;
		     -o-transition: all .4s ease;
		        transition: all .4s ease;
		cursor: pointer;
	}
	#hdau .hdau_sec02 .hdau_left li:hover{
		background:rgba(199,207,211,.3);
		color:white;
	}
	#hdau .hdau_sec02 .hdau_left li.hdau_active{
		background:rgba(199,207,211,.5);
		font-weight: 500;
		color:white;
	}
	#hdau .hdau_sec02 .hdau_left .hdau_right{
		display: none;
	}

	#hdau .hdau_sec02 .hdau_right{
		display: inline-block;
		width: 63.5%;
		height: 216px;
		margin-left:-4px;
		background:rgba(199,207,211,.1);
		padding:10px 10px 10px 30px;
		box-sizing: border-box;
		vertical-align: top;
	}
	#hdau .hdau_sec02 .hdau_right li{
		display: none;
		font-size: 1.05rem;
		text-align: left;
		line-height: 32px;
		font-weight: 300;
		text-decoration: underline;
		-webkit-animation: showup .5s forwards;
		-o-animation: showup .5s forwards;
		animation: showup .5s forwards;
	}
	@keyframes showup{
		from{opacity: 0;transform: translateY(3px);}
		to  {opacity: 1;transform: translateY(0px);}
	}
	@-webkit-keyframes showup{
		from{
			opacity: 0;
			-webkit-transform: translateY(3px);
			   -moz-transform: translateY(3px);
			    -ms-transform: translateY(3px);
			     -o-transform: translateY(3px);
		}
		to  {
			opacity: 1;
			-webkit-transform: translateY(0px);
			   -moz-transform: translateY(0px);
			    -ms-transform: translateY(0px);
			     -o-transform: translateY(0px);
		}
	}
	#hdau .hdau_sec02 .hdau_right li.hdau_active{
		display: block;
	}
	#hdau .hdau_sec02 .hdau_right li a{
		-webkit-transition: all .2s ease;
		   -moz-transition: all .2s ease;
		    -ms-transition: all .2s ease;
		     -o-transition: all .2s ease;
		        transition: all .2s ease;
	}
	#hdau .hdau_sec02 .hdau_container .hdau_right li a:hover{
		font-weight: 500;
	}
	.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
		width: 8px;
		border-radius: 0;
		background: #C7CFDD;
	}
/* ---------- END SEC02 ---------- */
/* ---------- SEC03 ---------- */
	#hdau .hdau_sec03{
		height: 810px;
		max-width: 1920px;
		margin:-1px auto 0;
		position: relative;
		background: #545454;
		z-index: -2;
		overflow: hidden; /*for > 1920*/
	}
	#hdau .hdau_sec03 .hdau_color,
	/*#hdau .hdau_sec03 .hdau_filter,*/
	#hdau .hdau_sec03 .hdau_bg{
		position: absolute;
		top: 0;
		right: 0;
	}
	#hdau .hdau_sec03 .hdau_color{
		width: 100%;
		height: 0;
		padding-bottom: 100%;
	}
	#hdau .hdau_sec03 .hdau_bg{
		width: 100%;
		max-width: 1920px;
		height: 100%;
		background: center center no-repeat;
		background-image:url(../img/tab2/Aura-lighting.png);
		background-size: cover;
	}
	#hdau .hdau_sec03 .hdau_container{
		width: 1250px;
		padding:110px 0;
		margin:0 auto;
	}
	#hdau .hdau_sec03 .hdau_controls{
		position: relative;
		width: 530px;
		margin-left: auto;
	}
	
	#hdau .hdau_sec03 h2{
		text-align: left;
		padding-left: 20px;
		text-transform: none;
	}
	#hdau .hdau_sec03 ul{
		width: 100%;
		margin:25px 0;
	}
	#hdau .hdau_sec03 li{
		display: inline-block;
		vertical-align: top;
		width: 19.9%;
		margin-left: -4px;
		padding:10px 0;
		cursor:pointer;
		opacity: .6;
		-webkit-transition: .4s ease;
		   -moz-transition: .4s ease;
		    -ms-transition: .4s ease;
		     -o-transition: .4s ease;
		        transition: .4s ease;
	}
	#hdau .hdau_sec03 li:hover{
		opacity: 1;
		/*background:rgba(0,0,0,.5);*/
		/*box-shadow: 0 0 50px rgba(0,0,0,.9) inset;*/
	}
	#hdau .hdau_sec03 li.hdau_active{
		opacity: 1;
	}
	#hdau .hdau_sec03 li.hdau_active h4,
	#hdau .hdau_sec03 li.hdau_active p{
		text-shadow: 0 0 3px white;
	}
	#hdau .hdau_sec03 li img{
		width: 54px;
		height: 54px;
	}
	#hdau .hdau_sec03 h4{
		font-size: 1.05rem;
		font-weight: 400;
		line-height: 15px;
		letter-spacing: .5px;
		padding:10px 0;
	}
	#hdau .hdau_sec03 h4.closer{
		letter-spacing: 0px;
	}
	#hdau .hdau_sec03 p{
		font-family: "Segoe UI", "Hind Siliguri", "Hind Siliguri", "Microsoft JhengHei", "Arial";
		font-size: .8em;
		font-weight: 300;				
		line-height: 15px;
	}
	#hdau #colorpicker{
		width: 130px;
		margin:0 auto;
	}
/* ---------- END SEC03 ---------- */
/* ---------- SEC04 ---------- */
	#hdau .hdau_sec04{
		max-width: 1920px;
		margin:0 auto;
		position: relative;
	}
	#hdau .hdau_sec04 p{
		padding: 70px 0;
		width: 48%;
		margin:0 auto;
		text-align: center;
		font-weight: 400;
	}
	#hdau .hdau_sec04 .hdau_partitle{				
		background: center top no-repeat;
		background-size: cover;
		min-height: 200px;
	}
	#hdau .hdau_sec04 h4{
		height: 65px;
		line-height: 65px;
		color: #C1C9D7;
		background: rgba(193,201,215,0.2);
		font-size: 36px;
		font-weight: 300;
	}
	#hdau .hdau_sec04 li{
		display: inline-block;
		width: calc(25% - 4px);
		position: relative;
	}
	#hdau .hdau_sec04 li a{
		display: inline-block;
	}
	#hdau .hdau_sec04 li a img{
		width: 100%;
		vertical-align: middle;
		-webkit-transition: all .5s ease;
		   -moz-transition: all .5s ease;
		    -ms-transition: all .5s ease;
		     -o-transition: all .5s ease;
		        transition: all .5s ease;
	}
	#hdau .hdau_sec04 li a span{
		display: block;
		opacity: 0;
		width: 100%;
		height: 50px;
		font-size: 36px;
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		margin:auto;
		-webkit-transition: all .5s ease;
		   -moz-transition: all .5s ease;
		    -ms-transition: all .5s ease;
		     -o-transition: all .5s ease;
		        transition: all .5s ease;
	}
	#hdau .hdau_sec04 .two_line{
		height: 110px;
	}
	#hdau .hdau_sec04 li a:hover span{
		opacity: 1;
	}
	#hdau .hdau_sec04 li a:hover img{
		opacity: .2;
		background: black;
	}
/* ---------- END SEC04 ---------- */
/* ---------- color effect ---------- */
	.hdau_rainbow{
		background: -webkit-linear-gradient(left,red,yellow,#00CB07,#07A9FF,#1044FF,#1B2F7F,#D92F7F,red);
		background: -o-linear-gradient(left,red,yellow,#00CB07,#07A9FF,#1044FF,#1B2F7F,#D92F7F,red);
		background: -moz-linear-gradient(left,red,yellow,#00CB07,#07A9FF,#1044FF,#1B2F7F,#D92F7F,red);
		background: linear-gradient(to right, red,yellow,#00CB07,#07A9FF,#1044FF,#1B2F7F,#D92F7F,red);
	}
	.hdau_comet{
		background: -moz-linear-gradient(-45deg, rgba(84,84,84,1) 0%, rgba(84,84,84,1) 39%, rgba(255,0,0,1) 54%, rgba(255,0,0,1) 60%, rgba(84,84,84,1) 73%, rgba(84,84,84,1) 100%);
		background: -webkit-linear-gradient(-45deg, rgba(84,84,84,1) 0%, rgba(84,84,84,1) 39%, rgba(255,0,0,1) 54%, rgba(255,0,0,1) 60%, rgba(84,84,84,1) 73%, rgba(84,84,84,1) 100%);
		background: -o-linear-gradient(-45deg, rgba(84,84,84,1) 0%, rgba(84,84,84,1) 39%, rgba(255,0,0,1) 54%, rgba(255,0,0,1) 60%, rgba(84,84,84,1) 73%, rgba(84,84,84,1) 100%);
		background: -ms-linear-gradient(-45deg, rgba(84,84,84,1) 0%, rgba(84,84,84,1) 39%, rgba(255,0,0,1) 54%, rgba(255,0,0,1) 60%, rgba(84,84,84,1) 73%, rgba(84,84,84,1) 100%);
		background: linear-gradient(135deg, rgba(84,84,84,1) 0%, rgba(84,84,84,1) 39%, rgba(255,0,0,1) 54%, rgba(255,0,0,1) 60%, rgba(84,84,84,1) 73%, rgba(84,84,84,1) 100%);
	}
	.hdau_flash{
		background: -moz-linear-gradient(-45deg, rgba(84,84,84,1) 0%, rgba(255,0,0,1) 15%, rgba(84,84,84,1) 27%, rgba(255,0,0,1) 40%, rgba(84,84,84,1) 53%, rgba(255,0,0,1) 63%, rgba(84,84,84,1) 78%, rgba(255,0,0,1) 90%, rgba(84,84,84,1) 100%);
		background: -webkit-linear-gradient(-45deg, rgba(84,84,84,1) 0%, rgba(255,0,0,1) 15%, rgba(84,84,84,1) 27%, rgba(255,0,0,1) 40%, rgba(84,84,84,1) 53%, rgba(255,0,0,1) 63%, rgba(84,84,84,1) 78%, rgba(255,0,0,1) 90%, rgba(84,84,84,1) 100%);
		background: -o-linear-gradient(-45deg, rgba(84,84,84,1) 0%, rgba(255,0,0,1) 15%, rgba(84,84,84,1) 27%, rgba(255,0,0,1) 40%, rgba(84,84,84,1) 53%, rgba(255,0,0,1) 63%, rgba(84,84,84,1) 78%, rgba(255,0,0,1) 90%, rgba(84,84,84,1) 100%);
		background: -ms-linear-gradient(-45deg, rgba(84,84,84,1) 0%, rgba(255,0,0,1) 15%, rgba(84,84,84,1) 27%, rgba(255,0,0,1) 40%, rgba(84,84,84,1) 53%, rgba(255,0,0,1) 63%, rgba(84,84,84,1) 78%, rgba(255,0,0,1) 90%, rgba(84,84,84,1) 100%);
		background: linear-gradient(135deg, rgba(84,84,84,1) 0%, rgba(255,0,0,1) 15%, rgba(84,84,84,1) 27%, rgba(255,0,0,1) 40%, rgba(84,84,84,1) 53%, rgba(255,0,0,1) 63%, rgba(84,84,84,1) 78%, rgba(255,0,0,1) 90%, rgba(84,84,84,1) 100%);
	}
	@keyframes static{
		0% {opacity: 1}
		50%{opacity: 1}
	}
	@-webkit-keyframes static{
		0% {opacity: 1}
		50%{opacity: 1}
	}
	@keyframes breathing{
		0% {opacity: 1}
		50%{opacity: .3}
	}
	@-webkit-keyframes breathing{
		0% {opacity: 1}
		50%{opacity: .3}
	}
	@keyframes strobing{
		0% {opacity: 1}
		50%{opacity: .3}
	}
	@-webkit-keyframes strobing{
		0% {opacity: 1}
		50%{opacity: .3}
	}
	@keyframes music{
		0%  {opacity: 1}
		10% {opacity: .3}
		40% {opacity: 1}
		60% {opacity: .3}
		70% {opacity: 1}
		100%{opacity: .3}
	}
	@-webkit-keyframes music{
		0%  {opacity: 1}
		10% {opacity: .3}
		40% {opacity: 1}
		60% {opacity: .3}
		70% {opacity: 1}
		100%{opacity: .3}
	}
	@keyframes cycle{
		0%		{background-color: red}
		15%		{background-color: orange}
		30%		{background-color: yellow}
		45%		{background-color: #00CB07}
		60%		{background-color: #07A9FF}
		75%		{background-color: #1044FF}
		90%		{background-color: #a12fd9}
		100%	{background-color: red}
	}
	@-webkit-keyframes cycle{
		0%		{background-color: red}
		15%		{background-color: orange}
		30%		{background-color: yellow}
		45%		{background-color: #00CB07}
		60%		{background-color: #07A9FF}
		75%		{background-color: #1044FF}
		90%		{background-color: #a12fd9}
		100%	{background-color: red}
	}
	@keyframes rainbow{
		0%  {-webkit-filter:hue-rotate(359deg);filter:hue-rotate(359deg)}
		100%{-webkit-filter:hue-rotate(0deg);filter:hue-rotate(0deg)}
	}
	@-webkit-keyframes rainbow{
		0%  {-webkit-filter:hue-rotate(359deg)}
		100%{-webkit-filter:hue-rotate(0deg)}
	}
	@keyframes cpu{
		0%		{background-color: red}
		30%		{background-color: yellow}
		60%		{background-color: green}
		90%		{background-color: yellow;}
	}
	@-webkit-keyframes cpu{
		0%		{background-color: red}
		30%		{background-color: yellow}
		60%		{background-color: green}
		90%		{background-color: yellow;}
	}
	@keyframes comet{
		0%	{
			z-index: -1;
			width: 150%;
		    transform: translateX(-50%);
		}
		100%{
			z-index: -1;
			width: 150%;
		    transform: translateX(50%);
		}
	}
	@-webkit-keyframes comet{
		0%	{
			z-index: -1;
			width: 150%;
		    transform: translateX(-50%);
		}
		100%{
			z-index: -1;
			width: 150%;
		    transform: translateX(50%);
		}
	}
	@keyframes flash{
		0%	{
			z-index: -1;
			width: 150%;
		    transform: translateX(-20%);
		}
		100%{
			z-index: -1;
			width: 150%;
		    transform: translateX(30%);
		}
	}
	@-webkit-keyframes flash{
		0%	{
			z-index: -1;
			width: 150%;
		    transform: translateX(-20%);
		}
		100%{
			z-index: -1;
			width: 150%;
		    transform: translateX(30%);
		}
	}
/* ---------- END color effect ---------- */
/* ---------- RWD ---------- */
	@media screen and (max-width: 1366px) {
		#hdau .hdau_sec01{
			background: black center 50% no-repeat;
			background-size: 130%;
		}
		#hdau .hdau_sec03 .hdau_container{
			width: 90%;
		}
	}
	@media screen and (max-width: 1200px) {
		#hdau .hdau_sec03 {
			height: 750px;
			background-position:40% center;
		}
		#hdau .hdau_sec03 .hdau_container{
			width: 98%;
			padding:80px 0 110px;
		}
		#hdau .hdau_sec03 h2{
			font-size: 30px;
		}
		#hdau .hdau_sec03 .hdau_controls{
			width: 370px;
		}
		#hdau .hdau_sec03 ul {
			margin: 35px 0 0;
		}
		#hdau .hdau_sec03 li{
			width: 33.3%;
		}
		#hdau .hdau_sec03 li img{
			width: 40px;
			height: 40px;
		}
		#hdau .hdau_sec03 h4,
		#hdau .hdau_sec03 p{
			text-shadow: 0 0 8px black;
		}
		#hdau .hdau_sec04 li a span{
			font-size: 30px;
		}
	}
	@media screen and (max-width: 1000px) {
		#hdau .hdau_sec02 .hdau_container{
			width: 90%;
		}
		#hdau .hdau_sec02 .hdau_container .hdau_left{
			width: 25%;
			min-width: 200px;
		}
		#hdau .hdau_sec02 .hdau_container .hdau_right{
			width: 75%;
			max-width: calc(100% - 200px);
		}
	}
	@media screen and (max-width: 768px) {
		#hdau .hdau_sec01{
			background: center top no-repeat;					
			background-size: 130%;
		}
		#hdau .hdau_sec01 span{
			width: 90%;
		}
		#hdau .hdau_sec01 p,
		#hdau .hdau_sec04 p{
			width: 90%;
		}

		#hdau .hdau_sec03{
			height: auto;
			padding-top: 80%;
			
		}
		#hdau .hdau_sec03 .hdau_bg{
			height: 100%;
			background: url('../img/tab2/Aura-lighting-768px.png') center top no-repeat;
			background-size: contain;
		}
		#hdau .hdau_sec03 .hdau_container{
			width: 100%;
			padding:80px 10px;
			box-sizing: border-box;
			background: black;
			position: relative;
			z-index: 2;
		}
		#hdau .hdau_sec03 .hdau_controls{
			width: 90%;
			margin:0 auto;
		}
		#hdau .hdau_sec03 ul{
			margin:25px 0;
		}
		#hdau .hdau_sec03 li{
			width: 20%;
		}
		#hdau .hdau_sec03 h4{
			font-size: .95rem;
		}
		#hdau #colorpicker{
			position: absolute;
			top: -40%;
			right: 0;
		}
		#hdau .hdau_sec04 li{
			width: calc(50% - 4px);
		}
	}
	@media screen and (max-width: 650px) {
		#hdau .hdau_sec02 .hdau_container .hdau_left{
			display: block;
			width: 100%;
		}
		#hdau .hdau_sec02 .hdau_left > li{
			cursor: auto;
		}
		#hdau .hdau_sec02 .hdau_left li,
		#hdau .hdau_sec02 .hdau_left li:hover{
			background: rgba(199,207,211,.5);
			font-weight: 500;
			color: white;
		}
		#hdau .hdau_sec02 .hdau_left .hdau_right{
			display: block;
			width: 100%;
			max-width: none;
			margin:20px 0;
			background: #232323;
		}
		#hdau .hdau_sec02 .hdau_right li{
			display: block;
			background: #232323;
			border:none;
			font-size: 1.05rem;
			font-weight: 300;
			line-height: 32px;
			padding:0;
			height: auto;
		}
		#hdau .hdau_sec02 .hdau_left .hdau_right li.hdau_active{
			background: #232323;
			font-weight: 300;
		}
		#hdau .hdau_sec02 .hdau_right li:hover{
			background: #232323;
		}
		#hdau .hdau_sec02 .hdau_container>.hdau_right,
		#hdau .hdau_sec02 .hdau_left > li:nth-child(5),
		#hdau .hdau_sec02 .hdau_left > li:nth-child(6){
			display: none;
		}
	}
	@media screen and (max-width: 480px) {
		#hdau h2 {
			font-size: 30px;
		}
		#hdau .hdau_sec03 li{
			width: 33.3%;
		}
		#hdau #colorpicker{
			top: -30%;
			right: 0;
		}

		#hdau .hdau_sec04 .hdau_partitle{				
			background-position: 25% top;
		}
		#hdau .hdau_sec04 li{
			width: 100%;
		}
	}
/* ---------- END RWD ---------- */