.contact-container { margin-top:30px;}
	.contact-container .contact-col { width:40%; float:right; background-color: rgba(136, 6, 86, .9); height:488px; z-index:20;}
	.map { background-image:url(images/img-location-map.jpg); height:488px; width:100%; z-index:10;}
	.contact-container .contact-col .cc-pos { padding:5%; color:#fff}
	.contact-container .contact-col .cc-pos .hkco { font-size:30px; color:#fff; margin-bottom:10px; line-height:normal;}

	.contact-container table td { vertical-align:top; text-align:left; padding-bottom:10px}
	.contact-container table td.contact-field {width:80px}

	.contact-container i { font-size:18px}
	.contact-container a.email { color:#fff; cursor:pointer; text-decoration:underline!important;
					  			  -webkit-transition: 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
					  					  transition: 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
					     -webkit-transition-property: background-color, color;
					 			 transition-property: background-color, color;
					 					  box-shadow: none!important;}
	.contact-container a.email:hover { color:#000; cursor:pointer; text-decoration:underline!important;}

	.view-map-blk { position:absolute; right:0; z-index:50}
	.view-map-btn   { width:50px; height:90px; background-color:#e6e6e6; margin-bottom:1px; overflow:hidden;
											 text-shadow: none;
								    background-color: #e6e6e6; cursor:pointer;
					  			  -webkit-transition: 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
					  					  transition: 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
					     -webkit-transition-property: background-color, color;
					 			 transition-property: background-color, color;
					 					  box-shadow: none!important;}
	.view-map-btn:hover   { background-color:#000; color:#333;}
	.view-map-btn i       { font-size:26px; line-height:2; color:#999; padding-left:10px;
						  			  -webkit-transition: 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
						  					  transition: 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
						     -webkit-transition-property: background-color, color;
						 			 transition-property: background-color, color;
						 					  box-shadow: none!important;}
	.view-map-btn:hover i { color:#880656}
	.view-google { font-size:9px; line-height:normal; text-align:center; font-family:Verdana; margin-top:-5px}
	.view-map-btn:hover .view-google {color:#fff;}


/* =============================================================================
	= iPad Portrait & Landscape Styles
   ============================================================================= */

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (-webkit-min-device-pixel-ratio: 1){
	.view-map-blk { position:absolute; width:100%; bottom:0; z-index:50; overflow:hidden}
	.view-map-btn   { width:100%; height:auto; padding:5px 0 0 0; background-color:#e6e6e6; margin-bottom:1px; overflow:hidden;}
	.view-google     { font-size:12px; line-height:normal; text-align:center; font-family:Verdana; margin-top:5px; vertical-align:top; display:inline-block;}
	.view-map-btn i  { font-size:24px; line-height:normal; color:#999; padding-left:10px; display:inline-block;}
	.contact-container .contact-col .cc-pos { padding:5%}
}