
	/*******************************************************************************************
	load fonts
	*******************************************************************************************/

	@import url('https://fonts.googleapis.com/css?family=Ubuntu');




	/*******************************************************************************************
	transitions and animations
	*******************************************************************************************/

	@keyframes fadein {
		from { opacity: 0; }
		to   { opacity: 1; }
	}

	@-webkit-keyframes slide {
		100% { left: 0; }
	}

	@keyframes slide {
		100% { left: 0; }
	}

	/*******************************************************************************************
	********************************************************************************************
	PC BROWSER DEVICES
	********************************************************************************************
	*******************************************************************************************/


	/*******************************************************************************************
	PC browser swaps
	*******************************************************************************************/

	.pc	{
			display: block;
		}

	.pci	{
			display: inline-block;
		}

	.pconly	{
			display: block;
			}

	.hand	{
			display: none;
		}

	.handi	{
			display: none;
		}

	.tablet	{
			display: none;
		}
		
		

	/*******************************************************************************************
	PC browser page setup
	*******************************************************************************************/


	body {
		background-color: #edeef0;
		margin: 0;
		padding: 0;
		}

	header {
		border: 0px solid red;
		position: fixed;
		background-color:  #fff;
		width: 100%;
		height: 54px;
		padding: 0px 0px 0px 0px;
		margin: auto;
		z-index: 100;
		}

	#site-header-pc {
		box-shadow: 0px 3px 6px #272727;
		-webkit-box-shadow: 0px 3px 6px #27272780;
		-moz-box-shadow: 0px 3px 6px #27272780;
		position: fixed;
		z-index: 999999;
		}	

	section	{
		background-color: #edeef0;
		border: 0px solid green;
		width: 1260px;
		padding-left: 0px;
		padding-right: 0px;
		padding-top: 10px;
		padding-bottom: 10px;
		margin: auto;

		text-align: left;
		}

	.center {
		border: 0px solid red;
		vertical-align: top;
		display: block;
		width: 1185px;
		margin: 52px auto 0px auto;
		padding: 2px 0px;

		}

	footer {
		border: 1px solid #000;
		background-color:  #fff;
		width: 100%;
		padding: 0px 0px 12px 0px;
		margin: 0px;
		}

	.dycent-h {
		position: relative;
		border: 0px solid red;
		padding: 7px 0px 12px 0px;
		top: 0px;
		margin: auto;
		width: 1260px;
		z-index: 100;
		height: 30px;
		background-color:  #fff;
		box-shadow: 0px 0px 0px #ccc;

	}

	.friends {
		font-family: Arial; 
		font-size: 16px; 
	 
	}





	/*******************************************************************************************
	PC & TABLET header setup
	*******************************************************************************************/

	/****************the Big L*************************/




	.logo-container {
		display: inline-block;
		border: 0px solid green;
		margin: 0px 0px 0px 15px;
		border: 0px solid green;	
	}


	.titlelogo {
		position: relative;
		top: 2px;
		height: 38px;
		vertical-align: -30%;	
		margin: 0px 0px 0px 5px;
		border: 0px solid red;	
	}

	.titletext	{
		position: relative;
		top: 0px;
		display: inline-block;
		color: #000;
		font-family: Ubuntu, Arial;
		font-size: 22px;
		font-weight: normal;
		border: 0px solid red;	
		}




	/******the dropdown menus in the header****************/
	.rightmenus-container {
		display: inline-block;
		position: absolute;
		top: 20px;
		right: 10px;
		border: 0px solid green;
		margin: 0px 20px 0px 0px;
	}

	button:focus {
		outline:0;
		}


	.dropbtn {
		display: inline-block;
		border: 0px solid red;
		background-color:  rgb(0,0,0,0);
		color: #555;
		font-family: Calibri, Helvetica, Arial;
		font-size: 18px;
		font-weight: normal;
		cursor: pointer;
		margin: 0px 0px 0px 5px;
		padding: 0px 5px 20px 5px;
	}

	.dropbtn:hover {
		color: #000;
	}

	.dropdown-lang {
		position: relative;
		top: 2px;
	}


	.dropdown {
		display: inline-block;
		margin: 0px 0px 0px 0px;
	}

	.dropdown-content {
		font-family: Calibri, Helvetica, Arial;
		font-size: 17px;
		font-weight: normal;
		display: none;
		position: absolute;
		top: 36px;
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;
		border: 0px solid #000;
		border-radius: 0px;
		background-color: #fff;
		width: 165px;
		box-shadow: 2px 3px 3px #27272780;
		-webkit-box-shadow: 2px 3px 3px #27272780;
		-moz-box-shadow: 2px 3px 3px #27272780;	
		z-index: 1;
	}

	.ddflags {
		width: 135px;
	}

	.dropdown-content a {
		color: black;
		padding: 5px 12px 5px 12px;
		margin: 2px 0px 2px 0px;	
		text-decoration: none;
		display: block;
	}

	.dropbtn:hover {color: #000;}

	.dropdown-content a:hover {
		background-color: #cdcdcd;
		color: #000;
		cursor: pointer;
		}

	.dropdown:hover .dropdown-content {display: block;}

	.dropdown:hover .dropbtn {color: #000;}

	.headerLanguageFlag {
		width: 25px;
		border-radius: 100%;
	}

	.menuLanguageFlag {
		width: 24px;
		vertical-align: center;
	}


	.directionsFlagsBox {
		float: right;
		display: inline-block;
		padding: 10px 0 0 0;
	}

	.directionsLanguageFlag {
		width: 26px;
		vertical-align: center;
	}

	.directTitle {
		font-size: 19px;
	}

	.directExplain {
		font-size: 16px;
		padding: 3px 0px 3px 0px;
	}

	.tips {
		padding: 0 0 5px 0;
	}

	.ktips {
		line-height: 24px;
		font-size: 16px;	
		padding: 0 0 5px 0;
	}

	.headerSelector {
		padding: 6px 0px 6px 10px;
		cursor:pointer;
	}

	.headerSelector:hover {
		background-color: #ccc;
	}

	.eng {
		display: inline-block;	
	}

	.kor {
		display: none;
		font-family: 'Nanum Gothic Coding', monospace;
	}

	.spn {
		display: none;
	}

	.por {
		display: none;
	}

	.black {
		color: #000;
	}





	/********************article***********************/

	.articles {
		padding: 0px 200px;
	}


	.artPara {
		margin: 25px 0px 15px 0px;
		font-size: 21px;
		font-family: Calibri, Arial;
		line-height: 1.3;
	}

	.listenPara {
		margin: 10px 0px 25px 0px;
		font-size: 19px;
		font-family: Calibri, Arial;
		border-left: 10px #dddddd solid; 
		padding: 0px 15px;
		line-height: 1.3;	
	}

	.artImage {
		margin: 10px 0px;
		width: 100%;
	}

	.artLogo {
		height: 23px; 
		vertical-align: bottom;
	}









	/*********** PC Drop Down Catalogue****************/


	.dropPosition {
		margin: 0;
	}

	.c-wrapper {
			display: inline-block;
			color: #000;
			position: absolute;
			top: 16px;
			left: 230px;

	}

	.c-wrapper ul {
			margin: 0px;
			padding: 0px;
			list-style: none; 
			white-space: nowrap;
	}

	.c-wrapper .s0-Menu>li {
		display: inline-block;
	}

	.c-wrapper .s0-Menu a {
			position: relative;
			margin: 0px;
			text-align: left;
			font-family: Calibri;
			font-size: 17px;	
			color: #555;
			text-decoration: none;
			padding: 6px 6px 20px 6px;
			border: 0px solid red;
	}

	.c-wrapper .s1-Menu a {
			display: block;
			padding: 4px 2px 4px 2px;
			width: 165px;	
			color: #000;
			border: 0px solid green;
	}

	.c-wrapper .s2-Menu a {
			display: block;
			padding: 4px 2px 4px 2px;
			width: 200px;
			border: 0px solid green;
	}

	.c-wrapper .s3-Menu a {
			display: block;
			padding: 4px 2px 4px 2px;
			width: 195px;
			border: 0px solid green;
	}

	.c-wrapper .s3-Compact a {
			display: block;
			padding: 3px 2px 3px 2px;
			width: 255px;
			border: 0px solid green;
	}

	.c-wrapper .s1-Menu {
			position: absolute;
			top: 40px;
			left: -14px;
			display: none;
			background: rgb(255,255,255,0.97);
			width: 160px;
			min-height: 144px;	
			padding: 5px 0px 5px 15px;	/* around box */
			border: 0px solid #000;
			box-shadow: 2px 3px 3px #27272780;
			-webkit-box-shadow: 2px 3px 3px #27272780;
			-moz-box-shadow: 2px 3px 3px #27272780;	
	}

	.c-wrapper .s2-Menu {
			position: absolute;
			top: 0px;
			left: 177px;
			display: none;
			background: rgb(255,255,255,0.97);
			width: 195px;
			min-height: 145px;	
			padding: 5px 0px 5px 15px;	/* around box */ 	
			border: 0px solid #000;
			box-shadow: 2px 3px 3px #27272780;
			-webkit-box-shadow: 2px 3px 3px #27272780;
			-moz-box-shadow: 2px 3px 3px #27272780;
	}

	.c-wrapper .s3-Menu  {
			position: absolute;
			top: 0px;
			left: 212px;
			display: none;
			background: rgb(255,255,255,0.97);
			width: 253px;
			min-height: 182px;	
			padding: 5px 15px;	/* around box */
			border: 0px solid #000;
			box-shadow: 2px 3px 3px #27272780;
			-webkit-box-shadow: 2px 3px 3px #27272780;
			-moz-box-shadow: 2px 3px 3px #27272780;	
		overflow-y: auto;
	}

	.c-wrapper .s3-Easy {
		min-height: 406px;	 
	}

	.c-wrapper .s3-TV {
		min-height: 435px;	
	}

	.c-wrapper .s3-Movies {
		min-height: 406px;	 
	}

	.c-wrapper .s3-Compact {
		min-height: 412px;	 
	}

	.c-wrapper .s1-Menu li {
		padding: 0px 15px;
		margin-top: 0px;
		margin-bottom: 0px;
	}

	.c-wrapper .s2-Menu li {
		padding: 0px 15px;
		margin-top: 0px;
		margin-bottom: 0px;
	}

	.c-wrapper .s3-Menu li {
		padding: 0px 15px;
		margin-top: 0px;
		margin-bottom: 0px;
	}

	.c-wrapper .s0-Menu a:hover {
		color: #000;

	}

	.c-wrapper .s1-Menu li:hover {
		background-color: #cdcdcd;
		cursor: pointer;	
	}

	.c-wrapper .s0-Menu>li:hover .s1-Menu {
		display: block;
	}

	.c-wrapper .s1-Menu>li:hover .s2-Menu {
		display: block;
	}
	 
	.c-wrapper .s2-Menu>li:hover .s3-Menu {
		display: block;
	}

	.c-wrapper .arrowOne {
		display: inline-block;
		border: 2px solid #000;
		width: 4px;
		height: 4px;
		border-left: none;
		border-bottom: none;
		position: absolute;
		top: 13px;
		right: 22px;
		margin: 0px 0px;
		transition: all 0.5s
	}

	.c-wrapper .arrowTwo {
		display: inline-block;
		border: 2px solid #000;
		width: 4px;
		height: 4px;
		border-left: none;
		border-bottom: none;
		position: absolute;
		top: 13px;
		right: 22px;
		margin: 0px 0px;
		transition: all 0.5s
	}

	.c-wrapper .arrowOne {
			transform: rotateZ(45deg);
	}

	.c-wrapper .arrowTwo {
			transform: rotateZ(45deg);
	}

	.c-wrapper .s1-Menu>li:hover .arrowOne {
			transform: rotateZ(45deg) translate(5px, -5px);
	}

	.c-wrapper .s2-Menu>li:hover .arrowTwo {
			transform: rotateZ(45deg) translate(5px, -5px);
	}









	/*******************************************************************************************
	PC & Tablet footer setup
	*******************************************************************************************/

	.sharefoot {
		width: 150px;
		border: 0px solid red;
		margin: 5px auto 5px auto;
		padding: 30px 0px 0px 0px;
	}

	.ftext {
		margin: 1px 0px 1px 0px;
		color: #333;
		text-align: center;
		font-family: Calibri, Helvetica;
		font-size: 15px;
		font-weight: normal;
		text-shadow: 0px 0px 0px #ccc;
	}


	.socialIcon { 
		height: 32px;  
		margin: 0px 5px 5px 5px;
	}











	/*******************************************************************************************
	Google Adsense
	*******************************************************************************************/

	.gadvert {
		margin: auto;
		padding: 8px 0 0 0;
	}




	/*******************************************************************************************
	Headers
	*******************************************************************************************/

	h1	{
		color: #212121;
		font-family: Calibri, Helvetica;
		font-size: 13px;
		font-weight: normal;
		text-shadow: 0px 0px 0px #999;
		margin: 3px 0px 3px 0px;
		}

	h2	{
		color: #212121;
		font-family: Calibri, Helvetica;
		font-size: 24px;
		font-weight: normal;
		text-shadow: 0px 0px 0px #999;
		margin: 0px 0px 2px 0px;
		}

	h3	{
		color: #000;
		font-family: Calibri, Helvetica;
		font-size: 24px;
		font-weight: normal;
		text-shadow: 0px 0px 0px #999;
		margin: 0px;
		}

	h5 	{
		color: #212121;
		font-family: Calibri, Helvetica;
		font-size: 24px;
		font-weight: normal;
		text-shadow: 0px 0px 0px #999;
		margin: 0px 0px 2px 0px;
		}
		
		
	/** old H4 **/
	.sActTitles	{	
		color: #212121;
		font-family: Calibri, Helvetica;
		font-size: 19px;
		font-weight: normal;
		text-shadow: 0px 0px 0px #999;
		margin: 0px 0px 2px 0px;
		}


	.aDescriptors {
		color: #555;
		font-family: Calibri, Helvetica;
		font-size: 15px;
		font-weight: normal;
		text-shadow: 0px 0px 0px white;
		line-height: 1.2;
		margin: 0px;
		padding: 0px 0px 0px 15px;
		}
		

	.sumSentence	{
		color: #212121;
		font-family: Calibri, Helvetica;
		font-size: 20px;
		font-weight: bold;
		text-shadow: 0px 0px 0px #999;
		margin: 0px 0px 2px 0px;
		}


	/*******************************************************************************************
	PC fonts
	*******************************************************************************************/


	p	{
		color: black;
		font-family: Calibri, Helvetica;
		font-size: 18px;
		font-weight: normal;
		margin-top: 2px;
		margin-bottom: 2px;
		margin-left: 2px;
		margin-right: 0px;
		}

	li	{
		color: black;
		font-family: Calibri, Helvetica;
		font-size: 17px;
		font-weight: normal;
		margin-top: 3px;
		margin-bottom: 3px;
		margin-left: -15px;
		margin-right: 0px;
		}

	 

	.white 	{
			color: #fff;
		}



	.activityNumber {
		font-size: smaller;
		font-weight: 800;
		}

	.updated {
		font-size: smaller;
		font-weight: 800;
		color: green;
		}

	.pdftag {
		font-size: smaller;	
		color: red;
	}










					/*******************************************************************************************
					********************************************************************************************
					TABLET DEVICES
					********************************************************************************************
					*******************************************************************************************/


					@media only screen and (max-width: 1000px) {


						.pc	{
								display: block;
							}

						.pci	{
								display: inline-block;
							}

						.pconly	{
								display: none;
						}


						.hand	{
								display: none;
							}

						.handi	{
								display: none;
							}

						.tablet	{
								display: block;
						}
		


						/*******************************************************************************************
						TABLET browser page setup
						*******************************************************************************************/


						body {
							background-color: #edeef0;
							margin: 0;
							padding: 0;
							}
							
						header {
							border: 0px solid red;
							position: fixed;
							background-color:  #fff;
							width: 100%;
							height: 54px;
							padding: 0px 0px 0px 0px;
							margin: auto;
							z-index: 100;
							}	
						
						section	{
							background-color: #edeef0;
							border: 0px solid green;
							max-width: 800px;
							min-width: 800px;
							padding-left: 0px;
							padding-right: 0px;
							padding-top: 10px;
							padding-bottom: 10px;
							margin: auto;
							text-align: left;
							}

						.center {
							border: 0px solid red;
							vertical-align: top;
							display: block;
							width: 780px;
							margin: 52px auto 0px auto;
							padding: 2px 0px;
							}

						.dycent-h {
							border: 0px solid red;
							padding: 7px 0px 12px 0px;
							top: 0px;
							margin: auto;
							width: 800px;
							z-index: 100;
							height: 30px;
							background-color:  #fff;
							box-shadow: 0px 0px 0px #ccc;
						}



						/*********** PC Drop Down Catalogue****************/

						.dropPosition {
							margin: 0;
						}

						.c-wrapper {
								display: inline-block;
								color: #000;
								position: absolute;
								top: 16px;
								left: 230px;

						}

						.c-wrapper ul {
								margin: 0px;
								padding: 0px;
								list-style: none; 
								white-space: nowrap;
								line-height: 1.0;
						}

						.c-wrapper .s0-Menu>li {
							display: inline-block;
						}

						.c-wrapper .s0-Menu a {
								position: relative;
								margin: 0px;
								text-align: left;
								font-family: Calibri;
								font-size: 14px;	
								color: #555;
								text-decoration: none;
								padding: 6px 6px 20px 6px;
								border: 0px solid red;
						}

						.c-wrapper .s1-Menu a {
								display: block;
								padding: 5px 2px 5px 2px;
								width: 145px;	
								color: #000;
								border: 0px solid green;
						}

						.c-wrapper .s2-Menu a {
								display: block;
								padding: 5px 2px 5px 2px;
								width: 185px;
								border: 0px solid green;
						}

						.c-wrapper .s3-Menu a {
								display: block;
								padding: 5px 2px 5px 2px;
								width: 195px;
								border: 0px solid green;
						}

						.c-wrapper .s3-Compact a {
								display: block;
								padding: 3px 2px 3px 2px;
								width: 225px;
								border: 0px solid green;
						}

						.c-wrapper .s1-Menu {
								position: absolute;
								top: 40px;
								left: -14px;
								display: none;
								background: rgb(255,255,255,0.97);
								width: 140px;
								min-height: 120px;	
								padding: 5px 0px 5px 15px;	/* around box */
								border: 0px solid #000;
								box-shadow: 2px 3px 3px #27272780;
								-webkit-box-shadow: 2px 3px 3px #27272780;
								-moz-box-shadow: 2px 3px 3px #27272780;	
						}

						.c-wrapper .s2-Menu {
								position: absolute;
								top: 0px;
								left: 157px;
								display: none;
								background: rgb(255,255,255,0.97);
								width: 180px;
								min-height: 120px;	
								padding: 3px 0px 5px 15px;	/* around box */ 	
								border: 0px solid #000;
								box-shadow: 2px 3px 3px #27272780;
								-webkit-box-shadow: 2px 3px 3px #27272780;
								-moz-box-shadow: 2px 3px 3px #27272780;
						}

						.c-wrapper .s3-Menu  {
								position: absolute;
								top: 0px;
								left: 197px;
								display: none;
								background: rgb(255,255,255,0.97);
								width: 220px;
								min-height: 122px;	
								padding: 5px 15px;	/* around box */
								border: 0px solid #000;
								box-shadow: 2px 3px 3px #27272780;
								-webkit-box-shadow: 2px 3px 3px #27272780;
								-moz-box-shadow: 2px 3px 3px #27272780;	
							overflow-y: auto;
						}

						.c-wrapper .s3-Easy {
							min-height: 310px;	 
						}

						.c-wrapper .s3-TV {
							min-height: 310px;	
						}

						.c-wrapper .s3-Movies {
							min-height: 286px;	 
						}

						.c-wrapper .s1-Menu li {
							padding: 0px 15px;
							margin-top: 0px;
							margin-bottom: 0px;
						}

						.c-wrapper .s2-Menu li {
							padding: 0px 15px;
							margin-top: 0px;
							margin-bottom: 0px;
						}

						.c-wrapper .s3-Menu li {
							padding: 0px 15px;
							margin-top: 0px;
							margin-bottom: 0px;
						}

						.c-wrapper .s0-Menu a:hover {
							color: #000;

						}

						.c-wrapper .s1-Menu li:hover {
							background-color: #cdcdcd;
							cursor: pointer;	
						}

						.c-wrapper .s0-Menu>li:hover .s1-Menu {
							display: block;
						}

						.c-wrapper .s1-Menu>li:hover .s2-Menu {
							display: block;
						}
						 
						.c-wrapper .s2-Menu>li:hover .s3-Menu {
							display: block;
						}

						.c-wrapper .arrowOne {
							display: inline-block;
							border: 2px solid #000;
							width: 4px;
							height: 4px;
							border-left: none;
							border-bottom: none;
							position: absolute;
							top: 10px;
							right: 22px;
							margin: 0px 0px;
							transition: all 0.5s
						}

						.c-wrapper .arrowTwo {
							display: inline-block;
							border: 2px solid #000;
							width: 4px;
							height: 4px;
							border-left: none;
							border-bottom: none;
							position: absolute;
							top: 10px;
							right: 22px;
							margin: 0px 0px;
							transition: all 0.5s
						}

						.c-wrapper .arrowOne {
								transform: rotateZ(45deg);
						}

						.c-wrapper .arrowTwo {
								transform: rotateZ(45deg);
						}

						.c-wrapper .s1-Menu>li:hover .arrowOne {
								transform: rotateZ(45deg) translate(5px, -5px);
						}

						.c-wrapper .s2-Menu>li:hover .arrowTwo {
								transform: rotateZ(45deg) translate(5px, -5px);
						}

					



						/******the dropdown menus in the header****************/
						.rightmenus-container {
							display: inline-block;
							position: absolute;
							top: 20px;
							right: 10px;
							border: 0px solid green;
							margin: 0px 20px 0px 0px;
						}

						button:focus {
							outline:0;
							}


						.dropbtn {
							display: inline-block;
							border: 0px solid red;
							background-color:  rgb(0,0,0,0);
							color: #555;
							font-family: Calibri, Helvetica, Arial;
							font-size: 16px;
							font-weight: normal;
							cursor: pointer;
							margin: 0px 0px 0px 5px;
							padding: 0px 5px 20px 5px;
						}

						.dropbtn:hover {
							color: #000;
						}

						.dropdown-lang {
							position: relative;
							top: 2px;
						}


						.dropdown {
							display: inline-block;
							margin: 0px 0px 0px 0px;
						}

						.dropdown-content {
							font-family: Calibri, Helvetica, Arial;
							font-size: 14px;
							font-weight: normal;
							display: none;
							position: absolute;
							top: 36px;
							margin: 0px 0px 0px 0px;
							padding: 0px 0px 0px 0px;
							border: 0px solid #000;
							border-radius: 0px;
							background-color: #fff;
							width: 150px;
							box-shadow: 2px 3px 3px #27272780;
							-webkit-box-shadow: 2px 3px 3px #27272780;
							-moz-box-shadow: 2px 3px 3px #27272780;	
							z-index: 1;
						}

						.ddflags {
							width: 120px;
						}

						.dropdown-content a {
							color: black;
							padding: 5px 12px 5px 12px;
							margin: 2px 0px 2px 0px;	
							text-decoration: none;
							display: block;
						}

						.dropbtn:hover {color: #000;}

						.dropdown-content a:hover {
							background-color: #cdcdcd;
							color: #000;
							cursor: pointer;
							}

						.dropdown:hover .dropdown-content {display: block;}

						.dropdown:hover .dropbtn {color: #000;}

						.headerLanguageFlag {
							width: 21px;
							border-radius: 100%;
						}

						.menuLanguageFlag {
							width: 20px;
							vertical-align: center;
						}

				


						/*******************************************************************************************
						TABLET fonts
						*******************************************************************************************/

						h1	{
							color: #212121;
							font-family: Calibri, Helvetica;
							font-size: 12px;
							font-weight: normal;
							text-shadow: 0px 0px 0px #999;
							margin: 0px 0px 2px 0px;
							}

						h2	{
							color: #212121;
							font-family: Calibri, Helvetica;
							font-size: 20px;
							font-weight: normal;
							text-shadow: 0px 0px 0px #999;
							margin: 0px 0px 2px 0px;
							}

						h3	{
							color: #000;
							font-family: Calibri, Helvetica;
							font-size: 19px;
							font-weight: normal;
							text-shadow: 0px 0px 0px #999;
							margin: 0px;
							}

						h5	{
							color: #212121;
							font-family: Calibri, Helvetica;
							font-size: 22px;
							font-weight: normal;
							text-shadow: 0px 0px 0px #999;
							margin: 0px 0px 2px 0px;
							}


						.sActTitles	{
							color: #212121;
							font-family: Calibri, Helvetica;
							font-size: 17px;
							font-weight: normal;
							text-shadow: 0px 0px 0px #999;
							margin: 0px;
							}


						.aDescriptors	{
							color: #777;
							font-family: Calibri, Helvetica;
							font-size: 13px;
							font-weight: normal;
							text-shadow: 0px 0px 0px white;
							line-height: 1.2;
							margin: 0px;
							padding: 0px 0px 0px 15px;
							}

						.sumSentence	{
							color: #212121;
							font-family: Calibri, Helvetica;
							font-size: 17px;
							font-weight: bold;
							text-shadow: 0px 0px 0px #999;
							margin: 0px 0px 2px 0px;
							}

						p	{
							color: black;
							font-family: Calibri, Helvetica;
							font-size: 14px;
							font-weight: normal;
							margin-top: 2px;
							margin-bottom: 2px;
							margin-left: 2px;
							margin-right: 0px;
							}

						li	{
							color: black;
							font-family: Calibri, Helvetica;
							font-size: 14px;
							font-weight: normal;
							margin-top: 3px;
							margin-bottom: 3px;
							margin-left: -15px;
							margin-right: 0px;
							}

						

						.directTitle {
								font-size: 16px;
							}

						/********************article***********************/

						.articles {
							padding: 0px 60px;
						}

						.artPara {
							margin: 23px 0px 13px 0px;
							font-size: 20px;
							font-family: Calibri, Arial;
							line-height: 1.5;
						}

						.listenPara {
							margin: 10px 0px 25px 0px;
							font-size: 18px;
							font-family: Calibri, Arial;
							border-left: 10px #dddddd solid; 
							padding: 0px 15px;
							line-height: 1.5;
						}

						.artImage {
							margin: 10px 0px;
							width: 100%;
						}

						.artLogo {
							height: 23px; 
							vertical-align: bottom;
						}




					




					}
















	/*******************************************************************************************
	********************************************************************************************
	HANDHELD DEVICES
	********************************************************************************************
	*******************************************************************************************/


	@media only screen and (max-width: 490px) {





		/*******************************************************************************************
		Hand browser swaps
		*******************************************************************************************/

		.pc	{
				display: none;
			}

		.pci	{
				display: none;
			}

		.pconly	{
				display: none;
				}

		.hand	{
				display: block;
			}

		.handi	{
				display: inline-block;
			}

		.tablet	{
				display: none;
		}


		/*******************************************************************************************
		Hand browser page setup
		*******************************************************************************************/

		header {
			background-color:  #fff;
			position: fixed;
			z-index: 1;
			max-width: 100%;
			min-width: 100%;
			padding: 0px 0px 0px 0px;
			}

		#site-header-hand {
			box-shadow: 0px 3px 6px #27272780;
			-webkit-box-shadow: 0px 3px 6px #27272780;
			-moz-box-shadow: 0px 3px 6px #27272780;
			position: fixed;
			z-index: 999999;
			}	
			
		body {
			background-color: #fff;
			margin: 0;
			padding: 0;
			}

		nav.hand {
			position: fixed;
			left: -2px;
			top: 0px;
			background-color:  #fff;
			max-width: 100%;
			min-width: 100%;
			height: 10.0vw;
			padding: 3px 0px 3px 0px;
			box-shadow: 0px 0px 0px #999;
			}

		section {
			background-color: #eee;
			max-width: 98%;
			min-width: 98%;
			padding: 48px 0px 10px 0px;
			margin: auto;
			text-align: left;
			}

		.center {
			border: 0px solid red;
			vertical-align: top;
			display: block;
			width: 100%;
			margin: auto;
			padding-left: 0px;
			padding-right: 0px;
			padding-top: 2px;
			padding-bottom: 2px;
			}

		footer {
			background-color:  #fff;
			border-top: 1px solid black;
			max-width: 100%;
			min-width: 100%;

			padding: 0px 0px 0px 0px;
			margin: 0px 0px 0px 0px;
			}

		.dycent-h {

			max-width: 95%;
			min-width: 95%;
			margin: auto;
			}


		.ftext {
			margin: 0px 0px 0px 0px;
			color: #000;
			font-family: Calibri, Helvetica;
			font-size: 14px;
			font-weight: normal;
			text-shadow: 0px 0px 0px #ccc;
		}

		.sharefoot {
			width: 160px;
			border: 0px solid yellow;
			margin: 5px auto 5px auto;
		}







		/*******************************************************************************************
		Hand dropdown menu
		*******************************************************************************************/

		.ham-container {
			display: inline-block;
			width: 20px;
			position: relative;
			top: 8px;
			left: 10px;
			border: 0px solid red;
		}

		.logo-container-hand {
			display: inline-block;
			position: absolute;
			top: 12px;
			left: 36px;
			margin: 0px 0px 0px 0px;
			border: 0px solid green;	
		}


		.bar1, .bar2, .bar3 {
			width: 18px;
			height: 1px;
			background-color: #000;
			margin: 4px 0;
			transition: 0.4s;
			}

		/* Rotate first bar */
		.change .bar1 {
			-webkit-transform: rotate(-45deg) translate(-4px, 4px) ;
					transform: rotate(-45deg) translate(-4px, 4px) ;
			}

		/* Fade out the second bar */
		.change .bar2 {
			opacity: 0;
			}

		/* Rotate last bar */
		.change .bar3 {
			-webkit-transform: rotate(45deg) translate(-3px, -3px) ;
					transform: rotate(45deg) translate(-3px, -3px) ;
			}

		#handham {
			position: absolute;
			left: -100%;
			-webkit-animation: slide 0.5s forwards;
			animation: slide 0.5s forwards;
		}


		.ham-page {
			display: none;
			position: absolute;
			top: 40px;
			left: 0px;
			background-color: #fff;
			color: #000;
			width: 100%;
			height: 99vh;
			transition: 0.4s;
			}

		.ham-content {
			background-color: #fff;
			color: #000;
			width: 280px;
			height: 99vh;
			}

		.ham-content a {
			color: #000;
			background-color: #fff;
			border-top: 1px solid #47484b;
			padding: 7px 12px;
			font-family: Arial;
			font-size: 18px;
			text-align: left;
			display: block;
			}

		.ham-content a:hover {
			color: #000;
			background-color: #fff;
			}

		.menuicon {
			vertical-align: middle;
			width: 22px;
			padding-right: 4px;
		}

		.hListSkills {
			display: none;
		}

		.hSkillsBtn:hover .hListSkills {display: block;}






		.titlelogo {
			height: 7.6vw;
			position: relative;
			top: 0px;
			left: 6px;
			margin: 0px 5px 0px 0px;
			border: 0px solid red;	
		}

		.titletext	{
			position: relative;
			top: -3px;
			display: inline-block;
			margin: 0px 0px 0px 0px;
			padding: 0px 0px 0px 10px;
			color: #000;
			font-family: Ubuntu, Arial;
			font-size: 5.6vw;
			font-weight: normal;
			border: 0px solid red;	
			}




		/******the dropdown menus in the header****************/

		.rightmenus-container-hand {
			position: relative;
			right: 15px;
			display: inline-block;
			float: right;
			border: 0px solid green;
			margin: 0px 20px 0px 0px;
		}


		.headerLanguageFlag {
			width: 7.0vw;
			border-radius: 100%;
		}

		.mobileHeaderLogin {
			position: fixed;
			right: 2.0vw;
			top: 2.4vw;	
		}

		.mobileHeaderHelp {
			position: fixed;
			right: 16vw;
			top: 2.4vw;	
			margin: 0px 0px 0px 0px;
			padding: 0px 0px 0px 0px;
		}

		.mobileHeaderLang {
			position: fixed;
			right: 4.0vw;
			top: 2.4vw;	
			margin: 0px 0px 0px 0px;
			padding: 0px 0px 0px 0px;
		}

		.help {
			line-height: 9px;
			display: inline-block;
			margin: 0px 0px 0px 0px;
		}

		.helpbtn {
			border: 0px solid yellow;
			background-color:  #fff;
			color: #000;
			font-family: Calibri, Helvetica, Arial;
			font-size: 6.0vw;
			font-weight: normal;
			cursor: pointer;
			margin: 0px 0px 0px 5px;
			padding: 0px 0px 0px 0px;
		}


		.help-content {
			display: none;
			position: fixed;
			right: 2.5vw;
			top: 10.5vw;
			margin: 2.0vw 0vw 0vw 0vw;
			border: 0px solid #000;
			border-radius: 3px;
			background-color: #fff;
			width: 42vw;
			box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);	
			font-family: Calibri, Helvetica, Arial;
			font-size: 4.4vw;
			font-weight: normal;
			text-align: left;
			z-index: 1;
		}

		.help-content-lang {
			width: 36vw;	
		}

		.help-content a {
			color: black;
			padding: 3.5vw 2vw 3.5vw 2vw;
			text-decoration: none;
			display: block;
		}

		.helpbtn:hover {color: #ccc;}
		.help-content a:hover {color: #000; background-color: #ccc; }
		.help:hover .help-content {display: block;}
		.help:hover .helpbtn {color: #ccc;}



		/*******************************************Directions*****************************************/


		.directionsLanguageFlag {
			width: 7.1vw;
			vertical-align: center;
			margin: 0px 4px 0px 0px;
		}



		.directTitle {
			font-size: 4.0vw;
		}

		.directExplain {
			font-size: 3.6vw;
			padding: 4px 0px 4px 0px;
		}

		.headerSelector {
			padding: 3vw 0vw 3vw 2.6vw;
			cursor:pointer;
		}

		.headerSelector:hover {
			background-color: #ccc;
		}





		#mobileNav {
		  padding: 12px 0px 0px 14px;
		}
		
		#top-nav {
		  display: block;
		  width: 40px;
		  height: 32px;
		  position: absolute;
		  top: 0px;
		  left: 0px;
		  cursor: pointer;
		  opacity: 0;
		  z-index: 2;
		}

		.hamburgerspan {
		  cursor: pointer;
		  display: block;
		  width: 6.3vw;
		  height: 2px;
		  margin-bottom: 1.5vw;
		  position: relative;
		  background: #222;
		  z-index: 1;
		  transform-origin: 4px 0px;
		  transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1),
			background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1), opacity 0.55s ease;
		}

		.hamburgerspan:first-child {
		  transform-origin: 0% 0%;
		}
		.hamburgerspan:nth-last-child(2) {
		  transform-origin: 0% 100%;
		}
		#top-nav:checked ~ .hamburgerspan {
		  opacity: 1;
		  transform: rotate(45deg) translate(-0px, -0px);
		  background: #232323;
		}
		#top-nav:checked ~ .hamburgerspan:nth-last-child(3) {
		  opacity: 0;
		  transform: rotate(0deg) scale(0.2, 0.2);
		}
		#top-nav:checked ~ .hamburgerspan:nth-last-child(2) {
		  opacity: 1;
		  transform: rotate(-45deg) translate(1px, -1px);
		}

		input[id^="menu-"] {
		  position: absolute;
		  left: 0;
		  top: 0;
		  width: 100%;
		  height: 100%;
		  margin: 0;
		  cursor: pointer;
		  opacity:0;
		}

		div[id^="menu-cont-"] {
		  border-right: 1px solid #ccc;
		  width: 90vw;

		  background: rgb(255,255,255,0.97);
		  padding: 4px;
		  box-sizing: border-box;
		  margin: 0;
		  height: 80vh;
		  overflow: scroll;   
		  position: fixed;
		  margin: 0;
		  top: 0;
		  left: 0;
		  transform: translate(-100%, 0);
		  transition: transform 0.40s;
		  padding-right:0;
		}
		
		#top-nav:checked ~ div[id^="menu-cont-"],
		input[id^="menu-"]:checked ~ div[id^="menu-cont-"] {
		  transform: translate(0, 0);
		}


		input[id^="0menu-"] {
		  position: absolute;
		  left: 0;
		  top: 0;
		  width: 100%;
		  height: 100%;
		  margin: 0;
		  cursor: pointer;
		  opacity:0;
		}

		div[id^="0menu-cont-"] {
		  border-right: 1px solid #ccc;
		  width: 90vw;
		  background: rgb(255,255,255,0.97);
		  padding: 4px;
		  box-sizing: border-box;
		  margin: 0;
		  height: 80vh;
		  overflow: hidden;   
		  position: fixed;
		  margin: 0;
		  top: 0;
		  left: 0;
		  transform: translate(-100%, 0);
		  transition: transform 0.40s;
		  padding-right:0;
		}
		
		#top-nav:checked ~ div[id^="0menu-cont-"],
		input[id^="0menu-"]:checked ~ div[id^="0menu-cont-"] {
		  transform: translate3d(0, 0, 0);
		}

		input[id^="00menu-"] {
		  position: absolute;
		  left: 0;
		  top: 0;
		  width: 100%;
		  height: 100%;
		  margin: 0;
		  cursor: pointer;
		  opacity:0;
		}

		div[id^="00menu-cont-"] {
		  border-right: 1px solid #ccc;
		  width: 90vw;		  
		  background: rgb(255,255,255,0.97);
		  padding: 4px;
		  box-sizing: border-box;
		  margin: 0;
		  height: 80vh;
		  overflow: scroll;   
		  position: fixed;
		  margin: 0;
		  top: 45px;
		  left: 2px;
		  transform: translate(-100%, 0);
		  transition: transform 0.40s;
		  padding-right:0;
		}
		
		#top-nav:checked ~ div[id^="00menu-cont-"],
		input[id^="00menu-"]:checked ~ div[id^="00menu-cont-"] {
		  transform: translate3d(0, 0, 0);
		}

		li.nav-item {
		  width: 100%;
		  font-size: 4.9vw;
		  list-style: none;
		  font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
		  padding: 4px 10px 4px 30px;
		  border-bottom: 1px solid #ccc;
		  box-sizing: border-box;
		  position:relative;
		}


		.menu-ul {
		  padding: 0;
		  margin: 3px 0 0 0;
		}
		
		.nav-item.sub-menu:after, label.menu-label:before {
		  content: "";
		  border: 2px solid transparent;
		  border-top-color: transparent;
		  border-top-style: solid;
		  border-top-width: 2px;
		  border-right-color: transparent;
		  border-bottom-color: transparent;
		  border-left-color: transparent;
		  border-left-style: solid;
		  border-left-width: 2px;
		  display: block;
		  background-color: #fff;
		  width: 7px;
		  height: 7px;
		  margin-bottom: -5px;
		  float: right;
		  -webkit-transform: rotate(-45deg);
		  -moz-transform: rotate(-45deg);
		  -ms-transform: rotate(-45deg);
		  -o-transform: rotate(-45deg);
		  transform: rotate(-45deg);
		  border-color: rgba(0, 0, 0, 0.3);
		  border-top: none;
		  border-top-color: currentcolor;
		  border-left: none;
		  border-left-color: currentcolor;
		  margin-top: 5px;
		}

		label.menu-label {
		  width: 100%;
		  display: block;
		  padding: 10px 10px 10px 20px;
		  border-bottom: 1px solid #ccc;
		  color: #222;
		  font-weight: bold;
		  box-sizing: border-box;
		  background-color:#dedede;
		}

		label.menu-label:before {
		  float:left;
		  margin:5px;
		  margin-left:0px;
		  background-color: #dedede;
		  -webkit-transform: rotate(135deg);
		  -moz-transform: rotate(135deg);
		  -ms-transform: rotate(135deg);
		  -o-transform: rotate(135deg);
		  transform: rotate(135deg);
		}
		#menu-cont-1{z-index:1001; margin: 46px 0px 0px 2px;}
		.zIndex1 {z-index:1001;}
		.zIndex2 {z-index:1002;}
		.zIndex3 {z-index:1003;}
		.hamburgerspan{z-index:9998;}
		#top-nav{z-index:9999;}




		/*******************************************************************************************
		Articles
		*******************************************************************************************/



		.articles {
			padding: 4.0vw 4.0vw;
		}

		.artPara {
			margin: 6.0vw 0 4.0vw 0;
			font-size: 4.5vw;
			line-height: 1.5;
			font-family: Calibri, Arial;
		}

		.listenPara {
			margin: 2.0vw 0.0vw 2.0vw 0.0vw;
			font-size: 4.2vw;
			line-height: 1.3;
			font-family: Calibri, Arial;
			border-left: 10px #dddddd solid; 
			padding: 2.0vw 2.0vw;
		}

		.artImage {
			margin: 2.0vw 2.0vw;
			width: 97%;
		}

		.artLogo {
			height: 5.0vw; 
			vertical-align: bottom;
		}








		/*******************************************************************************************
		HAND fonts
		*******************************************************************************************/

		h1	{
			color: #212121;
			font-family: Calibri, Helvetica;
			font-size: 3.2vw;
			font-weight: normal;
			text-shadow: 1px 1px 2px #ccc;
			margin: -6px 0px 6px 0px;
			padding: 0px 0px 0px 0px;
			}
			
		h2	{
			color: #212121;
			font-family: Calibri, Helvetica;
			font-size: 6.0vw;
			font-weight: normal;
			text-shadow: 2px 2px 3px #ccc;
			margin: 6px 0px 5px 0px;
			padding: 0px 0px 0px 0px;
			}

		h3	{
			color: #212121;
			font-family: Calibri, Helvetica;
			font-size: 5.8vw;
			font-weight: normal;
			text-shadow: 0px 0px 0px #ccc;
			margin: 0px 0px 4px 0px;
			padding: 2px 0px 0px 0px;
			}

		.sActTitles		{
			color: #212121;
			font-family: Calibri, Helvetica;
			font-size: 4.5vw;
			font-weight: normal;
			text-shadow: 0px 0px 0px #ccc;
			margin: 0px 0px 4px 0px;
			padding: 0px 0px 0px 0px;
			}

		.aDescriptors {
			color: #555;
			font-family: Calibri, Helvetica;
			font-size: 3.6vw;
			font-weight: normal;
			line-height: 1.15;
			text-shadow: 0px 0px 0px white;
			margin: 1px;
		}	

		.sumSentence	{
			color: #212121;
			font-family: Calibri, Helvetica;
			font-size: 4.4vw;
			font-weight: bold;
			text-shadow: 2px 2px 3px #ccc;
			margin: 1px 0px 5px 0px;
			padding: 0px 0px 0px 0px;
			}	

		p	{
			color: black;
			font-family: Calibri, Helvetica;
			font-size: 15px;
			font-weight: normal;
			margin: 0px;
			padding-top: 3px;
			line-height: 18px;
		}

		li	{
			color: black;
			font-family: Calibri, Helvetica;
			font-size: 16px;
			font-weight: normal;
			margin-top: 3px;
			margin-bottom: 3px;
			margin-left: -15px;
			margin-right: 0px;
			}





	}
