body 
{
	font-size: 62.5%;
}

.boundry
{
	border: 2px solid red;
}

footer
{
	font-family:"Lobster";
}
	
/*mobile height more*/
@media only screen and (max-width : 767px) and (orientation:portrait) { 
	.odx_ctn
	{
		display: none;
	}

	header
	{
		display: block;
		width: 100%;
	}

	.logo_ctn
	{
		display: block;
		float: left;
		width: 40%;
		height: 5VH;
		margin-left: 5%;
		margin-top: 5%;
		margin-bottom: 5%;
	}

	.side_btn
	{
		display: block;
		float: right;
		margin-top: 6%;
		margin-bottom: 5%;
		margin-right: 5%;
	}

	.side_btn i
	{
		font-size: 4VH;
	}

	.navbar
	{
		display: none;
		float: left;
		width: 100%;
		background: #111;
		margin-bottom: 0px;
	}
	.navbar ul li
	{
		display: inline-block;
		float: left;
		width: 100VW;
	}

	.navbar ul li a{
		font-size: 3VH;
		padding: 1VH;
		text-align: center;
		color: white;
	}

	.navbar ul li a:active, .navbar ul li a:visited{
		background:#00796B;
		color: white;
	}

	#web
	{
		display: block;
		float: left;
		height: 70VH;
		width: 100%;
		background: red; /* For browsers that do not support gradients */
    	background: -webkit-linear-gradient(141deg, #0fb8ad 0%, #1fc8db 51%, #2cb5e8 75%); /* For Safari 5.1 to 6.0 */
    	background: -o-linear-gradient(141deg, #0fb8ad 0%, #1fc8db 51%, #2cb5e8 75%); /* For Opera 11.1 to 12.0 */
    	background: -moz-linear-gradient(141deg, #0fb8ad 0%, #1fc8db 51%, #2cb5e8 75%); /* For Firefox 3.6 to 15 */
    	background: linear-gradient(141deg, #0fb8ad 0%, #1fc8db 51%, #2cb5e8 75%); /* Standard syntax */
	}
	#cctv
	{
		display: block;
		float: left;
		height: 70VH;
		width: 100%;
		background-image: url('../img/new/web_bk.jpg');
		background-size: 100% 100%;
	}	

	#inet
	{
		display: block;
		float: left;
		height: 70VH;
		width: 100%;
		background-image: url('../img/new/inet.jpg');
		background-size: 100% 100%;
	}

	.web_detail_ctn
	{
		display: inline-block;
		position: relative;
		top:5VH;
	}

	.web_de_title
	{
		display: inline-block;
		background:#fff;
		color: #111;
		font-size: 3VH;
		padding: 1VH;
	}

	.web_de_btn
	{
		display: inline-block;
		background: #111;
		color: #fff;
		font-size: 3VH;
		padding: 1VH;
	}

	.web_image_ctn
	{
		display: inline-block;
		position: relative;
		top: 5VH;
		padding: 5VW;
		width: 95VW;
		height: 50VH;
	}

	.in_image
	{
		width: 100%;
		height: 100%;
	}

	.cctv_detail_ctn
	{
		display: block;
		float: left;
		width: 35%;
		margin-top: 3%;
	}

	.cctv_de_title
	{
		display: inline-block;
		background:#fff;
		color: #111;
		font-size: 4VH;
		padding: 1VH;
		text-align: center;
	}

	.cctv_de_btn
	{
		display: inline-block;
		text-align: center;
		background: #111;
		color: #fff;
		font-size: 4VH;
		padding: 1VH;
	}

	.cctv_image_ctn
	{
		display: inline-block;
		float: right;
		width: 50%;
	}

	.shield_out_ctn
	{
		display: block;
		float: left;
		margin-top: 8VH;
		width: 100%;
		height: 18VH;

	}

	.shield_img
	{
		display: inline-block;
		width: 24%;
		height: 100%;
	}

	.inet_detail_ctn
	{
		display: inline-block;
		float: left;
		margin-top:10VH;
	}

	.inet_de_title
	{
		display: inline-block;
		background:#fff;
		color: #111;
		font-size: 4VH;
		padding: 1VH;
	}

	.inet_de_btn
	{

		display: inline-block;
		background: #111;
		color: #fff;
		font-size: 4VH;
		padding: 1VH;
	}

	footer
	{
		display: block;
		float: left;
		width: 100%;
		text-align: center;
		margin-top:1VH; 
		margin-bottom:1VH; 
		/*		background-image: url('../img/new/paisley.png');
		background-repeat: repeat;*/
		background: rgba(0,0,0,1);
	}

	footer div
	{
		width: 85%;
		padding: 1VH;
		margin: auto;
		background: white;
		color: #111;
		transform:skewX(160deg);
	}

	footer div div
	{
		font-size: 2.5VH;
		width: 100%;
		transform:skewX(-160deg);		
	}
	#contact_ctn
	{
		display: block;
		float: left;
		width: 100%;
		height: 170VW;
		background-image: url('../img/new/cbk2.jpg');
		background-size: 100% 100%;
		border-top: 1VW solid rgba(0,0,0,1);
	}

	.cont_title
	{
		display: block;
		width: 100%;
	}

	.phem_ctn
	{
		display: block;
		float: left;
		width: 90VW;
		height: 55VW;
		margin: 5VW;

	}

	.phone_ctn
	{
		display: block;
		float: left;
		width: 100%;
		height: 25VW;
		background: rgba(0,0,0,0.5);
		border-radius: 1VW;
		padding: 1VW;
		color: white;
	}

	.Email_ctn
	{
		display: block;
		float: left;
		width: 100%;
		height: 25VW;
		margin-top: 5VW;
		background: rgba(0,0,0,0.5);
		border-radius: 1VW;
		padding: 1VW;
		color: white;	
	}


	.ph_title
	{
		background: white;
		color: black;
		margin: 1VW;
		font-family: "Lobster", tahoma;
		font-size: 5VW;
		margin-bottom: 1VH;
		text-align: center;
	}

	.ph_detail_ctn
	{
		margin-top: 2VW;
	}
	.ph_detail
	{
		font-family: 'Montserrat', sans-serif;
		font-size: 4VW;
		text-align: center;
	}

	.Meet_ctn
	{
		display: block;
		float: left;
		width: 90%;
		height: 90VW;
		margin-left: 5VW;
		background: rgba(0,0,0,0.5);
		border-radius: 1VW;
		padding: 1VW;
		color: white;
	}

	#map_canvas
	{
		margin-top: 3VW;
		width: 90%;
		margin-left: 5%;
		height: 50VW;
	}

	.address_ctn
	{
		font-family: 'Montserrat', sans-serif;
		display: block;
		float: left;
		width: 90%;
		margin: 5%;
		margin-top: 5VW;
		font-size: 4VW;
		text-align: left;
	}

	.path 
	{
	  stroke-dasharray: 1000;
	  stroke-dashoffset: 1000;
	  animation: dash 5s linear alternate infinite;
	}

	@keyframes dash {
	  from {
	    stroke-dashoffset: 1000;
	  }
	  to {
	    stroke-dashoffset: 0;
	  }
	}

	@keyframes glow_on_off {
	  from {
		text-shadow: 0 0 0.5VW rgba(255,255,255,1) , 0 0 1VW rgba(255,255,255,1) , 0 0 1.5VW rgba(255,255,255,1) , 0 0 2VW #0484e5 , 0 0 3.5VW #195f6d , 0 0 4VW #0061ff , 0 0 5VW #081766 ;
	  	-webkit-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  	-moz-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  	-o-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  	transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  }
	  to {
		  text-decoration: normal;
		  text-shadow: 0 0 0.5VW rgba(255,255,255,1) , 0 0 1VW rgba(255,255,255,1) , 0 0 1.5VW rgba(255,255,255,1) , 0 0 2VW #00ffff , 0 0 3.5VW #00ffff , 0 0 4VW #00ffff , 0 0 5VW #00ffff ;
		  -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
		  -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
		  -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
		  transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
	  }
	}

	.glow_ctn {
	  display: inline-block;
	  margin-left: 30%;
	  -webkit-box-sizing: border-box;
	  -moz-box-sizing: border-box;
	  box-sizing: border-box;
	  background: black;
	  padding: 2VW;
	  padding-left: 5VW;
	  padding-right: 5VW;
	  border: none;
	  font: normal 5VW "Warnes", Helvetica, sans-serif;
	  color: rgba(255,255,255,1);
	  text-align: center;
	  -o-text-overflow: clip;
	  text-overflow: clip;
	  white-space: pre;
	  cursor: default;
		text-shadow: 0 0 0.5VW rgba(255,255,255,1) , 0 0 1VW rgba(255,255,255,1) , 0 0 1.5VW rgba(255,255,255,1) , 0 0 2VW #0484e5 , 0 0 3.5VW #195f6d , 0 0 4VW #0061ff , 0 0 5VW #081766 ;
	  	-webkit-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  	-moz-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  	-o-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  	transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  animation: glow_on_off 1s linear alternate infinite;
	}
	.web_de_btn svg
	{
		display: none;
	}
	#social_ctn
		{
			display: block;
			float: left;
			width: 100%;
			height: 23VW;
			padding-bottom: 0.5VW;
		}

		.sc_title
		{
			display: inline-block;
			width: 80%;
			margin-left: 10%;
			height: 100%;
			padding: 2VW;
			background: black;
		}

		.sc_title div
		{
			font-size: 4VW;
			font-family: "Indie Flower";
			text-align: center;
			color: white;
		}

		.sc_content
		{
			display: inline-block;
			width: 100%;
			height: 100%;
			padding-left:24VW;
		}
		.sc_content div
		{
			display: block;
			float: left;
			height: 10VW;
			padding: 4VW;
			border: 0.5VW solid black;
			margin-top: 1.5VW;
			transition:all 0.3s;
			cursor: pointer;
		}
		.sc_content div i
		{
			display: inline-block;
			font-size: 5VW;
			line-height: 2VW;
		}

		.sc_1:hover
		{
			background: #3b5998;
			color: white;
			border: 0.5VW solid white;
		}

		.sc_3:hover
		{
			background: #00aced;
			color: white;
			border: 0.5VW solid white;
		}

		.sc_2:hover
		{
			background: #dd4b39;
			color: white;
			border: 0.5VW solid white;
		}

		.sc_4:hover
		{
			background: #007bb6;
			color: white;
			border: 0.5VW solid white;
		}
}

/*mobile width more*/
@media only screen and (max-width : 767px) and (orientation:landscape) {
	.odx_ctn
	{
		display: none;
	}

	header
	{
		display: block;
		width: 100%;
	}

	.logo_ctn
	{
		display: block;
		float: left;
		width: 36%;
		height: 13VH;
		margin-left: 32%;
		margin-top: 3%;
		margin-bottom: 3%;
	}
	.side_btn
	{
		display: none;
	}

	.navbar
	{
		display: block;
		float: left;
		width: 100%;
		background: #111;
		margin-bottom: 0px;
	}
	.navbar ul li
	{
		display: inline-block;
		float: left;
		width: 22%;
	}
	.navbar ul li:nth-child(3)
	{
		width: 34%;
	}
	.navbar ul li a{
		font-size: 2VW;
		text-align: center;
		color: white;
	}

	.navbar ul li a:active, .navbar ul li a:visited{
		background:#00796B;
		color: white;
	}

	#web
	{
		display: block;
		float: left;
		height: 100VH;
		width: 100%;
		background: red; /* For browsers that do not support gradients */
    	background: -webkit-linear-gradient(141deg, #0fb8ad 0%, #1fc8db 51%, #2cb5e8 75%); /* For Safari 5.1 to 6.0 */
    	background: -o-linear-gradient(141deg, #0fb8ad 0%, #1fc8db 51%, #2cb5e8 75%); /* For Opera 11.1 to 12.0 */
    	background: -moz-linear-gradient(141deg, #0fb8ad 0%, #1fc8db 51%, #2cb5e8 75%); /* For Firefox 3.6 to 15 */
    	background: linear-gradient(141deg, #0fb8ad 0%, #1fc8db 51%, #2cb5e8 75%); /* Standard syntax */
	}
	#cctv
	{
		display: block;
		float: left;
		height: 100VH;
		width: 100%;
		background-image: url('../img/new/web_bk.jpg');
		background-size: 100% 100%;
	}	

	#inet
	{
		display: block;
		float: left;
		height: 100VH;
		width: 100%;
		background-image: url('../img/new/inet.jpg');
		background-size: 100% 100%;
	}

	.web_detail_ctn
	{
		display: inline-block;
		position: relative;
		top:10VH;
	}

	.web_de_title
	{
		display: inline-block;

		background:#fff;
		color: #111;
		font-size: 4VW;
		padding: 1VW;
	}

	.web_de_btn
	{
		display: inline-block;

		background: #111;
		color: #fff;
		font-size: 4VW;
		padding: 1VW;
	}

	.web_image_ctn
	{
		display: inline-block;
		position: relative;

		padding: 5VW;
		width: 95VW;
		height: 80VH;
	}

	.in_image
	{
		width: 100%;
		height: 100%;
	}

	.cctv_detail_ctn
	{
		display: block;
		float: left;
		width: 60%;
		margin-top: 3%;
	}

	.cctv_de_title
	{
		display: inline-block;
		background:#fff;
		color: #111;
		font-size: 4VW;
		padding: 2VW;
	}

	.cctv_de_btn
	{
		display: inline-block;

		background: #111;
		color: #fff;
		font-size: 4VW;
		padding: 2VW;
	}

	.cctv_image_ctn
	{
		display: inline-block;
		float: right;
		width: 30%;

	}

	.shield_out_ctn
	{
		display: block;
		float: left;
		width: 100%;
		height: 20VW;

	}

	.shield_img
	{
		display: inline-block;
		margin-top: 3VW;
		width: 24%;
		height: 100%;
	}

	.inet_detail_ctn
	{
		display: inline-block;
		float: left;
		margin-top:35VH;
	}

	.inet_de_title
	{
		display: inline-block;
		background:#fff;
		color: #111;
		font-size: 5VW;
		padding: 2VW;
	}

	.inet_de_btn
	{

		display: inline-block;
		background: #111;
		color: #fff;
		font-size: 5VW;
		padding: 2VW;
	}

	footer
	{
		display: block;
		float: left;
		width: 100%;
		text-align: center;
		margin-top:1VW; 
		margin-bottom:1VW; 
		/*		background-image: url('../img/new/paisley.png');
		background-repeat: repeat;*/
		background: rgba(0,0,0,1);
	}

	footer div
	{
		width: 60%;
		padding: 3VW;
		padding-top: 1VW;
		padding-bottom: 1VW;
		margin: auto;
		background: white;
		color: #111;
		transform:skewX(160deg);
	}

	footer div div
	{
		font-size: 3VW;
		width: 100%;
		transform:skewX(-160deg);		
	}
	
	#contact_ctn
	{
		display: block;
		float: left;
		width: 100%;
		height: 130VW;
		background-image: url('../img/new/cbk2.jpg');
		background-size: 100% 100%;
		border-top: 1VW solid rgba(0,0,0,1);
	}

	.cont_title
	{
		display: block;
		width: 100%;
	}

	.phem_ctn
	{
		display: block;
		float: left;
		width: 90VW;
		height: 55VW;
		margin: 5VW;

	}

	.phone_ctn
	{
		display: block;
		float: left;
		width: 100%;
		height: 25VW;
		background: rgba(0,0,0,0.5);
		border-radius: 1VW;
		padding: 1VW;
		color: white;
	}

	.Email_ctn
	{
		display: block;
		float: left;
		width: 100%;
		height: 25VW;
		margin-top: 5VW;
		background: rgba(0,0,0,0.5);
		border-radius: 1VW;
		padding: 1VW;
		color: white;	
	}


	.ph_title
	{
		background: white;
		color: black;
		margin: 1VW;
		font-family: "Lobster", tahoma;
		font-size: 5VW;
		margin-bottom: 1VH;
		text-align: center;
	}

	.ph_detail_ctn
	{
		margin-top: 2VW;
	}
	.ph_detail
	{
		font-family: 'Montserrat', sans-serif;
		font-size: 4VW;
		text-align: center;
	}

	.Meet_ctn
	{
		display: block;
		float: left;
		width: 90%;
		height: 50VW;
		margin-left: 5VW;
		background: rgba(0,0,0,0.5);
		border-radius: 1VW;
		padding: 1VW;
		color: white;
	}

	#map_canvas
	{
		width: 90%;
		margin-left: 5%;
		height: 25VW;
	}

	.address_ctn
	{
		font-family: 'Montserrat', sans-serif;
		display: block;
		float: left;
		width: 90%;
		margin: 5%;
		margin-top: 1VW;
		font-size: 3VW;
		text-align: left;
	}

	.path 
	{
	  stroke-dasharray: 1000;
	  stroke-dashoffset: 1000;
	  animation: dash 5s linear alternate infinite;
	}

	@keyframes dash {
	  from {
	    stroke-dashoffset: 1000;
	  }
	  to {
	    stroke-dashoffset: 0;
	  }
	}

	@keyframes glow_on_off {
	  from {
		text-shadow: 0 0 0.5VW rgba(255,255,255,1) , 0 0 1VW rgba(255,255,255,1) , 0 0 1.5VW rgba(255,255,255,1) , 0 0 2VW #0484e5 , 0 0 3.5VW #195f6d , 0 0 4VW #0061ff , 0 0 5VW #081766 ;
	  	-webkit-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  	-moz-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  	-o-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  	transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  }
	  to {
		  text-decoration: normal;
		  text-shadow: 0 0 0.5VW rgba(255,255,255,1) , 0 0 1VW rgba(255,255,255,1) , 0 0 1.5VW rgba(255,255,255,1) , 0 0 2VW #00ffff , 0 0 3.5VW #00ffff , 0 0 4VW #00ffff , 0 0 5VW #00ffff ;
		  -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
		  -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
		  -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
		  transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
	  }
	}

	.glow_ctn {
	  display: inline-block;
	  margin-left: 30%;
	  -webkit-box-sizing: border-box;
	  -moz-box-sizing: border-box;
	  box-sizing: border-box;
	  background: black;
	  padding: 2VW;
	  padding-left: 5VW;
	  padding-right: 5VW;
	  border: none;
	  font: normal 5VW "Warnes", Helvetica, sans-serif;
	  color: rgba(255,255,255,1);
	  text-align: center;
	  -o-text-overflow: clip;
	  text-overflow: clip;
	  white-space: pre;
	  cursor: default;
		text-shadow: 0 0 0.5VW rgba(255,255,255,1) , 0 0 1VW rgba(255,255,255,1) , 0 0 1.5VW rgba(255,255,255,1) , 0 0 2VW #0484e5 , 0 0 3.5VW #195f6d , 0 0 4VW #0061ff , 0 0 5VW #081766 ;
	  	-webkit-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  	-moz-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  	-o-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  	transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  animation: glow_on_off 1s linear alternate infinite;
	}
	.web_de_btn svg
	{
		display: none;
	}
		#social_ctn
		{
			display: block;
			float: left;
			width: 100%;
			height: 20VW;
			padding-bottom: 0.5VW;
		}

		.sc_title
		{
			display: inline-block;
			width: 80%;
			margin-left: 10%;
			height: 100%;
			padding: 1VW;
			background: black;
		}

		.sc_title div
		{
			font-size: 4VW;
			font-family: "Indie Flower";
			text-align: center;
			color: white;
		}

		.sc_content
		{
			display: inline-block;
			width: 100%;
			height: 100%;
			padding-left:24VW;
		}
		.sc_content div
		{
			display: block;
			float: left;
			height: 10VW;
			padding: 4VW;
			border: 0.5VW solid black;
			margin-top: 1.5VW;
			transition:all 0.3s;
			cursor: pointer;
		}
		.sc_content div i
		{
			display: inline-block;
			font-size: 5VW;
			line-height: 2VW;
		}

		.sc_1:hover
		{
			background: #3b5998;
			color: white;
			border: 0.5VW solid white;
		}

		.sc_3:hover
		{
			background: #00aced;
			color: white;
			border: 0.5VW solid white;
		}

		.sc_2:hover
		{
			background: #dd4b39;
			color: white;
			border: 0.5VW solid white;
		}

		.sc_4:hover
		{
			background: #007bb6;
			color: white;
			border: 0.5VW solid white;
		}
}

/*tablet height more*/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation:portrait) { 

	footer
	{
		display: block;
		float: left;
		width: 100%;
		text-align: center;
		margin-top:1VH; 
		margin-bottom:1VH; 
		/*		background-image: url('../img/new/paisley.png');
		background-repeat: repeat;*/
		background: rgba(0,0,0,1);
	}

	footer div
	{
		width: 60%;
		padding: 0.5VH;
		margin: auto;
		background: white;
		color: #111;
		transform:skewX(160deg);
	}

	footer div div
	{
		font-size: 2VH;
		width: 100%;
		transform:skewX(-160deg);		
	}

	header
	{
		display: block;
		width: 100%;
	}

	.logo_ctn
	{
		display: block;
		float: left;
		width: 40%;
		height: 8VH;
		margin-left: 30%;
		margin-top: 3%;
		margin-bottom: 3%;
	}
	.side_btn
	{
		display: none;
	}
	.navbar
	{
		display: block;
		float: left;
		width: 100%;
		background: #111;
		margin-bottom: 0px;
	}
	.navbar ul li
	{
		display: inline-block;
		float: left;
		width: 22VW;
	}
	.navbar ul li:nth-child(3)
	{
		width: 32VW;
	}
	.navbar ul li a{
		font-size: 2VW;
		text-align: center;
		color: white;
	}

	.navbar ul li a:active, .navbar ul li a:visited{
		background:#00796B;
		color: white;
	}

	.odx_ctn
	{
		display: none;
	}

	#web
	{
		display: block;
		float: left;
		height: 50VH;
		width: 100%;
		background: red; /* For browsers that do not support gradients */
    	background: -webkit-linear-gradient(141deg, #0fb8ad 0%, #1fc8db 51%, #2cb5e8 75%); /* For Safari 5.1 to 6.0 */
    	background: -o-linear-gradient(141deg, #0fb8ad 0%, #1fc8db 51%, #2cb5e8 75%); /* For Opera 11.1 to 12.0 */
    	background: -moz-linear-gradient(141deg, #0fb8ad 0%, #1fc8db 51%, #2cb5e8 75%); /* For Firefox 3.6 to 15 */
    	background: linear-gradient(141deg, #0fb8ad 0%, #1fc8db 51%, #2cb5e8 75%); /* Standard syntax */
	}
	#cctv
	{
		display: block;
		float: left;
		height: 50VH;
		width: 100%;
		background-image: url('../img/new/web_bk.jpg');
		background-size: 100% 100%;
	}	

	#inet
	{
		display: block;
		float: left;
		height: 50VH;
		width: 100%;
		background-image: url('../img/new/inet.jpg');
		background-size: 100% 100%;
	}

	.web_detail_ctn
	{
		display: inline-block;
		position: relative;
		top:5VH;
	}

	.web_de_title
	{
		display: inline-block;
		background:#fff;
		color: #111;
		font-size: 2rem;
		padding: 1rem;
	}

	.web_de_btn
	{
		display: inline-block;
		background: #111;
		color: #fff;
		font-size: 2rem;
		padding: 1rem;
	}

	.web_image_ctn
	{
		display: inline-block;
		position: relative;

		padding: 5VW;
		width: 95VW;
		height: 40VH;
	}

	.in_image
	{
		width: 100%;
		height: 100%;
	}

	.cctv_detail_ctn
	{
		display: block;
		float: left;
		width: 50%;
		margin-top: 3%;
	}

	.cctv_de_title
	{
		display: inline-block;
		background:#fff;
		color: #111;
		font-size: 3rem;
		padding: 1rem;
	}

	.cctv_de_btn
	{
		display: inline-block;

		background: #111;
		color: #fff;
		font-size: 3rem;
		padding: 1rem;
	}

	.cctv_image_ctn
	{
		display: inline-block;
		float: right;
		width: 30%;

	}

	.shield_out_ctn
	{
		display: block;
		float: left;
		margin-top: 5VH;
		width: 100%;
		height: 20VH;

	}

	.shield_img
	{
		display: inline-block;
		width: 20%;
		height: 100%;
	}

	.inet_detail_ctn
	{
		display: inline-block;
		float: left;
		width: 50VW;
		margin-top:10VH;
	}

	.inet_de_title
	{
		display: inline-block;
		background:#fff;
		color: #111;
		font-size: 5rem;
		padding: 1rem;
	}

	.inet_de_btn
	{

		display: inline-block;
		background: #111;
		color: #fff;
		font-size: 5rem;
		padding: 1rem;
	}

	#contact_ctn
	{
		display: block;
		float: left;
		width: 100%;
		height: 130VW;
		background-image: url('../img/new/cbk2.jpg');
		background-size: 100% 100%;
		border-top: 1VW solid rgba(0,0,0,1);
	}

	.cont_title
	{
		display: block;
		width: 100%;
	}

	.phem_ctn
	{
		display: block;
		float: left;
		width: 90VW;
		height: 55VW;
		margin: 5VW;

	}

	.phone_ctn
	{
		display: block;
		float: left;
		width: 100%;
		height: 25VW;
		background: rgba(0,0,0,0.5);
		border-radius: 1VW;
		padding: 1VW;
		color: white;
	}

	.Email_ctn
	{
		display: block;
		float: left;
		width: 100%;
		height: 25VW;
		margin-top: 5VW;
		background: rgba(0,0,0,0.5);
		border-radius: 1VW;
		padding: 1VW;
		color: white;	
	}


	.ph_title
	{
		background: white;
		color: black;
		margin: 1VW;
		font-family: "Lobster", tahoma;
		font-size: 5VW;
		margin-bottom: 1VH;
		text-align: center;
	}

	.ph_detail_ctn
	{
		margin-top: 2VW;
	}
	.ph_detail
	{
		font-family: 'Montserrat', sans-serif;
		font-size: 4VW;
		text-align: center;
	}

	.Meet_ctn
	{
		display: block;
		float: left;
		width: 90%;
		height: 50VW;
		margin-left: 5VW;
		background: rgba(0,0,0,0.5);
		border-radius: 1VW;
		padding: 1VW;
		color: white;
	}

	#map_canvas
	{
		width: 90%;
		margin-left: 5%;
		height: 25VW;
	}

	.address_ctn
	{
		font-family: 'Montserrat', sans-serif;
		display: block;
		float: left;
		width: 90%;
		margin: 5%;
		margin-top: 1VW;
		font-size: 3VW;
		text-align: left;
	}

	.path 
	{
	  stroke-dasharray: 1000;
	  stroke-dashoffset: 1000;
	  animation: dash 5s linear alternate infinite;
	}

	@keyframes dash {
	  from {
	    stroke-dashoffset: 1000;
	  }
	  to {
	    stroke-dashoffset: 0;
	  }
	}

	@keyframes glow_on_off {
	  from {
		text-shadow: 0 0 0.5VW rgba(255,255,255,1) , 0 0 1VW rgba(255,255,255,1) , 0 0 1.5VW rgba(255,255,255,1) , 0 0 2VW #0484e5 , 0 0 3.5VW #195f6d , 0 0 4VW #0061ff , 0 0 5VW #081766 ;
	  	-webkit-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  	-moz-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  	-o-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  	transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  }
	  to {
		  text-decoration: normal;
		  text-shadow: 0 0 0.5VW rgba(255,255,255,1) , 0 0 1VW rgba(255,255,255,1) , 0 0 1.5VW rgba(255,255,255,1) , 0 0 2VW #00ffff , 0 0 3.5VW #00ffff , 0 0 4VW #00ffff , 0 0 5VW #00ffff ;
		  -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
		  -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
		  -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
		  transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
	  }
	}

	.glow_ctn {
	  display: inline-block;
	  margin-left: 30%;
	  -webkit-box-sizing: border-box;
	  -moz-box-sizing: border-box;
	  box-sizing: border-box;
	  background: black;
	  padding: 2VW;
	  padding-left: 5VW;
	  padding-right: 5VW;
	  border: none;
	  font: normal 5VW "Warnes", Helvetica, sans-serif;
	  color: rgba(255,255,255,1);
	  text-align: center;
	  -o-text-overflow: clip;
	  text-overflow: clip;
	  white-space: pre;
	  cursor: default;
		text-shadow: 0 0 0.5VW rgba(255,255,255,1) , 0 0 1VW rgba(255,255,255,1) , 0 0 1.5VW rgba(255,255,255,1) , 0 0 2VW #0484e5 , 0 0 3.5VW #195f6d , 0 0 4VW #0061ff , 0 0 5VW #081766 ;
	  	-webkit-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  	-moz-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  	-o-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  	transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  animation: glow_on_off 1s linear alternate infinite;
	}
		.web_de_btn svg
	{
		display: none;
	}
		#social_ctn
		{
			display: block;
			float: left;
			width: 100%;
			height: 8VW;
			padding-bottom: 0.5VW;
		}

		.sc_title
		{
			display: inline-block;
			width: 40%;
			margin-left: 12%;
			height: 100%;
			padding: 1VW;
			background: black;
		}

		.sc_title div
		{
			font-size: 2.2VW;
			text-align: center;
			color: white;
			font-family: "Indie Flower";
		}

		.sc_content
		{
			display: inline-block;
			width: 40%;
			height: 100%;
		}
		.sc_content div
		{
			display: inline-block;
			float: left;
			position: relative;
			top:2VW;
			padding: 1VW;
			padding-left: 2VW;
			padding-right: 2VW;
			margin-left: 1VW;
			border: 0.5VW solid black;
			transition:all 0.3s;
			cursor: pointer;
		}
		.sc_content div i
		{
			display: inline-block;
			font-size: 2.5VW;
			line-height: 2VW;
		}

		.sc_1:hover
		{
			background: #3b5998;
			color: white;
			border: 0.5VW solid white;
		}

		.sc_3:hover
		{
			background: #00aced;
			color: white;
			border: 0.5VW solid white;
		}

		.sc_2:hover
		{
			background: #dd4b39;
			color: white;
			border: 0.5VW solid white;
		}

		.sc_4:hover
		{
			background: #007bb6;
			color: white;
			border: 0.5VW solid white;
		}
}

/*tablet width more*/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation:landscape) {

	.odx_ctn
	{
		display: none;
	}

	header
	{
		display: block;
		width: 100%;
	}

	.logo_ctn
	{
		display: block;
		float: left;
		width: 40%;
		height: 13VH;
		margin-left: 30%;
		margin-top: 3%;
		margin-bottom: 3%;
	}
	.side_btn
	{
		display: none;
	}
	.navbar
	{
		display: block;
		float: left;
		width: 100%;
		background: #111;
		margin-bottom: 0px;
	}
	.navbar ul li
	{
		display: inline-block;
		float: left;
		width: 22VW;
	}
	.navbar ul li:nth-child(3)
	{
		width: 32VW;
	}
	.navbar ul li a{
		font-size: 2VW;
		text-align: center;
		color: white;
	}

	.navbar ul li a:active, .navbar ul li a:visited{
		background:#00796B;
		color: white;
	}

	#web
	{
		display: block;
		float: left;
		height: 100VH;
		width: 100%;
		background: red; /* For browsers that do not support gradients */
    	background: -webkit-linear-gradient(141deg, #0fb8ad 0%, #1fc8db 51%, #2cb5e8 75%); /* For Safari 5.1 to 6.0 */
    	background: -o-linear-gradient(141deg, #0fb8ad 0%, #1fc8db 51%, #2cb5e8 75%); /* For Opera 11.1 to 12.0 */
    	background: -moz-linear-gradient(141deg, #0fb8ad 0%, #1fc8db 51%, #2cb5e8 75%); /* For Firefox 3.6 to 15 */
    	background: linear-gradient(141deg, #0fb8ad 0%, #1fc8db 51%, #2cb5e8 75%); /* Standard syntax */
	}
	#cctv
	{
		display: block;
		float: left;
		height: 100VH;
		width: 100%;
		background-image: url('../img/new/web_bk.jpg');
		background-size: 100% 100%;
	}	

	#inet
	{
		display: block;
		float: left;
		height: 100VH;
		width: 100%;
		background-image: url('../img/new/inet.jpg');
		background-size: 100% 100%;
	}

	.web_detail_ctn
	{
		display: inline-block;
		position: relative;
		top:10VH;
	}

	.web_de_title
	{
		display: inline-block;

		background:#fff;
		color: #111;
		font-size: 2rem;
		padding: 1rem;
	}

	.web_de_btn
	{
		display: inline-block;

		background: #111;
		color: #fff;
		font-size: 2rem;
		padding: 1rem;
	}

	.web_image_ctn
	{
		display: inline-block;
		position: relative;

		padding: 5VW;
		width: 95VW;
		height: 80VH;
	}

	.in_image
	{
		width: 100%;
		height: 100%;
	}

	.cctv_detail_ctn
	{
		display: block;
		float: left;
		width: 50%;
		margin-top: 3%;
	}

	.cctv_de_title
	{
		display: inline-block;
		background:#fff;
		color: #111;
		font-size: 3rem;
		padding: 1rem;
	}

	.cctv_de_btn
	{
		display: inline-block;

		background: #111;
		color: #fff;
		font-size: 3rem;
		padding: 1rem;
	}

	.cctv_image_ctn
	{
		display: inline-block;
		float: right;
		width: 30%;

	}

	.shield_out_ctn
	{
		display: block;
		float: left;
		width: 100%;
		height: 40VH;

	}

	.shield_img
	{
		display: inline-block;
		width: 20%;
		height: 100%;
	}

	.inet_detail_ctn
	{
		display: inline-block;
		float: left;
		width: 50VW;
		margin-top:35VH;

	}

	.inet_de_title
	{
		display: inline-block;
		background:#fff;
		color: #111;
		font-size: 5rem;
		padding: 1rem;
	}

	.inet_de_btn
	{

		display: inline-block;
		background: #111;
		color: #fff;
		font-size: 5rem;
		padding: 1rem;
	}

	footer
	{
		display: block;
		float: left;
		width: 100%;
		text-align: center;
		margin-top:1VW; 
		margin-bottom:1VW; 
		/*		background-image: url('../img/new/paisley.png');
		background-repeat: repeat;*/
		background: rgba(0,0,0,1);
	}

	footer div
	{
		width: 60%;
		padding: 0.5VW;
		margin: auto;
		background: white;
		color: #111;
		transform:skewX(160deg);
	}

	footer div div
	{
		font-size: 2VW;
		width: 100%;
		transform:skewX(-160deg);		
	}
		#contact_ctn
	{
		display: block;
		float: left;
		width: 100%;
		height: 50VW;
		background-image: url('../img/new/cbk2.jpg');
		background-size: 100% 100%;
		border-top: 1VW solid rgba(0,0,0,1);
	}

	.cont_title
	{
		display: block;
		width: 100%;
	}

	.phem_ctn
	{
		display: block;
		float: left;
		width: 45%;
		height: 100%;
		margin-top: 5VW;
	}

	.phone_ctn
	{
		display: block;
		float: left;
		width: 100%;
		height: 15VW;
		background: rgba(0,0,0,0.5);
		border-radius: 1VW;
		padding: 1VW;
		color: white;
	}

	.Email_ctn
	{
		display: block;
		float: left;
		width: 100%;
		height: 15VW;
		margin-top: 2VW;
		background: rgba(0,0,0,0.5);
		border-radius: 1VW;
		padding: 1VW;
		color: white;		
	}


	.ph_title
	{
		background: white;
		color: black;
		margin: 1VW;
		font-family: "Lobster", tahoma;
		font-size: 2.5VW;
		margin-bottom: 1VH;
		text-align: center;
	}

	.ph_detail_ctn
	{
		margin-top: 2VW;
	}
	.ph_detail
	{
		font-family: 'Montserrat', sans-serif;
		font-size: 1.5VW;
		text-align: center;
	}

	.Meet_ctn
	{
		display: block;
		float: left;
		width: 45%;
		height: 27VW;
		margin-left: 3VW;
		margin-top: 2VW;
		background: rgba(0,0,0,0.5);
		border-radius: 1VW;
		padding: 1VW;
		color: white;
	}

	#map_canvas
	{
		width: 90%;
		margin-left: 5%;
		height: 13VW;
	}

	.address_ctn
	{
		font-family: 'Montserrat', sans-serif;

		display: block;
		float: left;
		width: 90%;
		margin: 5%;
		margin-top: 0.5VW;
		font-size: 1.4VW;
		text-align: center;
	}

	.path 
	{
	  stroke-dasharray: 1000;
	  stroke-dashoffset: 1000;
	  animation: dash 5s linear alternate infinite;
	}

	@keyframes dash {
	  from {
	    stroke-dashoffset: 1000;
	  }
	  to {
	    stroke-dashoffset: 0;
	  }
	}

	@keyframes glow_on_off {
	  from {
		text-shadow: 0 0 10px rgba(255,255,255,1) , 0 0 20px rgba(255,255,255,1) , 0 0 30px rgba(255,255,255,1) , 0 0 40px #0484e5 , 0 0 70px #195f6d , 0 0 80px #0061ff , 0 0 100px #081766 ;
	  	-webkit-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  	-moz-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  	-o-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  	transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  }
	  to {
		  text-decoration: normal;
		  text-shadow: 0 0 10px rgba(255,255,255,1) , 0 0 20px rgba(255,255,255,1) , 0 0 30px rgba(255,255,255,1) , 0 0 40px #00ffff , 0 0 70px #00ffff , 0 0 80px #00ffff , 0 0 100px #00ffff ;
		  -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
		  -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
		  -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
		  transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
	  }
	}

	.glow_ctn {
	  display: inline-block;
	  float: right;
	  -webkit-box-sizing: border-box;
	  -moz-box-sizing: border-box;
	  box-sizing: border-box;
	  background: black;
	  padding: 2VW;
	  border: none;
	  font: normal 3VW "Warnes", Helvetica, sans-serif;
	  color: rgba(255,255,255,1);
	  text-align: center;
	  -o-text-overflow: clip;
	  text-overflow: clip;
	  white-space: pre;
	  cursor: default;
	  text-shadow: 0 0 10px rgba(255,255,255,1) , 0 0 20px rgba(255,255,255,1) , 0 0 30px rgba(255,255,255,1) , 0 0 40px #0484e5 , 0 0 70px #195f6d , 0 0 80px #0061ff , 0 0 100px #081766 ;
	  -webkit-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  -moz-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  -o-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  animation: glow_on_off 1s linear alternate infinite;
	}
		.web_de_btn svg
	{
		display: none;
	}

		#social_ctn
		{
			display: block;
			float: left;
			width: 100%;
			height: 8VW;
			padding-bottom: 0.5VW;
		}

		.sc_title
		{
			display: inline-block;
			width: 40%;
			margin-left: 12%;
			height: 100%;
			padding: 1VW;
			background: black;
		}

		.sc_title div
		{
			font-size: 2.2VW;
			text-align: center;
			color: white;
			font-family: "Indie Flower";
		}

		.sc_content
		{
			display: inline-block;
			width: 40%;
			height: 100%;
		}
		.sc_content div
		{
			display: inline-block;
			float: left;
			position: relative;
			top:2VW;
			padding: 1VW;
			padding-left: 2VW;
			padding-right: 2VW;
			margin-left: 1VW;
			border: 0.5VW solid black;
			transition:all 0.3s;
			cursor: pointer;
		}
		.sc_content div i
		{
			display: inline-block;
			font-size: 2.5VW;
			line-height: 2VW;
		}

		.sc_1:hover
		{
			background: #3b5998;
			color: white;
			border: 0.5VW solid white;
		}

		.sc_3:hover
		{
			background: #00aced;
			color: white;
			border: 0.5VW solid white;
		}

		.sc_2:hover
		{
			background: #dd4b39;
			color: white;
			border: 0.5VW solid white;
		}

		.sc_4:hover
		{
			background: #007bb6;
			color: white;
			border: 0.5VW solid white;
		}
}

/*laptop*/
@media only screen and (min-width : 1025px){
	.navbar
	{
		display: block;
		float: left;
		margin-bottom: 0px;
		float: right;
		padding: 1VW;
	}
	.navbar ul
	{
		width: 100%;
	}

	.navbar ul li
	{
		background:#0288D1;
	}

	.navbar ul li a:hover,	.navbar ul li a:visited ,	.navbar ul li a:active
	{
		background:rgba(0,0,0,0.8);
	}

	.navbar ul li a
	{
		font-size: 2VW;
		color: white;
		padding: 2VW;
	}

	.logo_ctn
	{
		display: inline-block;
		width: 22VW;
		height: 8.2VW;
		padding: 2VW;
	}

	#web
	{
		display: block;
		float: left;
		width: 100%;
		background-image: url('../img/new/web_bk.jpg');
		background-size: 100% 100%;
	}


	.side_btn
	{
		display: none;
	}

	.web_detail_ctn
	{
		position: absolute;
		left:0%;
		width: 100%;
		height: 100VH;
		padding: 5rem;
		z-index: 1;
	}

	.web_detail_inctn
	{
		margin: auto;
	}

	.web_de_title
	{
		display: inline-block;
		height: 8VW;
		margin-right: 3VW;
		margin-top: 1VW;
		transform:skewX(160deg);
	}

	.web_de_title div
	{
		background: #fff;
		color: #111;
		padding: 2VW;
		font-size: 3VW;
		line-height: 4VW;
	}

	.web_de_btn
	{
		display: inline-block;
		height: 8VW;
		margin-right: 3VW;
		margin-top: 1VW;
		transform:skewX(-170deg);
	}

	.web_de_btn div
	{
		background: #111;
		color: #fff;
		padding: 2VW;
		font-size: 3VW;
		line-height: 4VW;
	}

	.odx_item
	{
		display: inline-block;
		float: right;
		position: relative;
		top: -18VW;
		width: 14VW;
		height: 14VW;
		font-size: 1.5VW;
		color: white;
		background: #607D8B;
		padding: 3VW;
		padding-top: 4VW;
		border-radius: 10VW;
		margin: 1VW;
		text-align: center;
	}
	.oz1
	{
		background:#9C27B0;
	}
	.oz2
	{
		background:#000000;
	}
	.oz3
	{
		background:#C2185B;
	}
	.web_image_ctn
	{
		position: relative;
		margin-top:20VW;
		left: 0%;
		width: 100%;
	}

	.in_image
	{
		width: 100%;
		height: 100%;
	}

	#cctv
	{
		display: block;
		float: left;
		width: 100%;
		min-height: 90VH;
		background-image: url('../img/new/web7.jpg');	
		background-size: 100% 100%;

	}

	.cctv_image_ctn
	{
		display: inline-block;
		position: relative;
		float: right;
		top: -15VW;
		right: 3VW;
		width: 15VW;

	}

	.cctv_detail_ctn
	{
		position: relative;
		margin-top: 10%;
		left:0%;
		width: 100%;
		padding: 5rem;
		z-index: 1;
	}

	.cctv_detail_inctn
	{
		margin: auto;
	}

	.cctv_de_title
	{
		display: inline-block;
		height: 8VW;
		margin-right: 3VW;
		margin-top: 1VW;
		transform:skewX(160deg);
	}

	.cctv_de_title div
	{
		background: #fff;
		color: #111;
		padding: 2VW;
		font-size: 3VW;
		line-height: 4VW;
	}

	.cctv_de_btn
	{
		display: inline-block;
		height: 8VW;
		margin-right: 3VW;
		margin-top: 1VW;
		transform:skewX(-170deg);
	}

	.cctv_de_btn div
	{
		background: #111;
		color: #fff;
		padding: 2VW;
		font-size: 3VW;
		line-height: 4VW;
	}

	.shield_out_ctn
	{
		display: block;
		float: left;
		position: relative;
		width: 100%;
		top:-10VH;
	}
	.shield_img
	{
		display: inline-block;
		float: left;
		width: 15VW;
		margin: 1.5rem;
		margin-bottom: 3rem;
	}

	#inet
	{
		display: block;
		float: left;
		width: 100%;	
		height: 100VH;
		background-image: url('../img/new/inet2.jpg');	
		background-size: 100% 100%;	
	}

	.inet_detail_ctn
	{
		position: absolute;
		margin-top: 15%;
		left:5%;
		padding: 5rem;
		z-index: 1;
	}

	.inet_detail_inctn
	{
		margin: auto;
	}

	.inet_de_title
	{
		display: inline-block;
		height: 8VW;
		margin-top: 1VW;
		transform:skewX(160deg);
	}

	.inet_de_title div
	{
		background: #fff;
		color: #111;
		padding: 2VW;
		font-size: 3VW;
		line-height: 4VW;
	}

	.inet_de_btn
	{
		display: inline-block;
		height: 8VW;
		margin-top: 0.5VW;
		margin-left: 6.5VW;
		transform:skewX(-170deg);
	}

	.inet_de_btn div
	{
		background: #111;
		color: #fff;
		padding: 2VW;
		font-size: 3VW;
		line-height: 4VW;
	}

	footer
	{
		display: block;
		float: left;
		width: 100%;
		text-align: center;
		margin-top:1VW; 
		margin-bottom:1VW; 
		/*		background-image: url('../img/new/paisley.png');
		background-repeat: repeat;*/
		background: rgba(0,0,0,1);
	}

	footer div
	{
		width: 60%;
		padding: 1VW;
		margin: auto;
		background: white;
		color: #111;
		transform:skewX(160deg);
	}

	footer div div
	{
		font-size: 3VW;
		width: 100%;
		transform:skewX(-160deg);		
	}

	#contact_ctn
	{
		display: block;
		float: left;
		width: 100%;
		height: 50VW;
		background-image: url('../img/new/cbk2.jpg');
		background-size: 100% 100%;
		border-top: 1VW solid rgba(0,0,0,1);
	}

	.cont_title
	{
		display: block;
		width: 100%;
	}

	.phem_ctn
	{
		display: block;
		float: left;
		width: 45%;
		height: 100%;
		margin-top: 5VW;
	}

	.phone_ctn
	{
		display: block;
		float: left;
		width: 100%;
		height: 15VW;
		background: rgba(0,0,0,0.5);
		border-radius: 1VW;
		padding: 1VW;
		color: white;
	}

	.Email_ctn
	{
		display: block;
		float: left;
		width: 100%;
		height: 15VW;
		margin-top: 2VW;
		background: rgba(0,0,0,0.5);
		border-radius: 1VW;
		padding: 1VW;
		color: white;		
	}


	.ph_title
	{
		background: white;
		color: black;
		margin: 1VW;
		font-family: "Lobster", tahoma;
		font-size: 2.5VW;
		margin-bottom: 1VH;
		text-align: center;
	}

	.ph_detail_ctn
	{
		margin-top: 2VW;
	}
	.ph_detail
	{
		font-family: 'Montserrat', sans-serif;
		font-size: 1.5VW;
		text-align: center;
	}

	.Meet_ctn
	{
		display: block;
		float: left;
		width: 45%;
		height: 27VW;
		margin-left: 3VW;
		margin-top: 2VW;
		background: rgba(0,0,0,0.5);
		border-radius: 1VW;
		padding: 1VW;
		color: white;
	}

	#map_canvas
	{
		width: 90%;
		margin-left: 5%;
		height: 13VW;
	}

	.address_ctn
	{
		font-family: 'Montserrat', sans-serif;

		display: block;
		float: left;
		width: 90%;
		margin: 5%;
		margin-top: 0.5VW;
		font-size: 1.4VW;
		text-align: center;
	}

	.path 
	{
	  stroke-dasharray: 1000;
	  stroke-dashoffset: 1000;
	  animation: dash 5s linear alternate infinite;
	}

	@keyframes dash {
	  from {
	    stroke-dashoffset: 1000;
	  }
	  to {
	    stroke-dashoffset: 0;
	  }
	}

	@keyframes glow_on_off {
	  from {
		text-shadow: 0 0 10px rgba(255,255,255,1) , 0 0 20px rgba(255,255,255,1) , 0 0 30px rgba(255,255,255,1) , 0 0 40px #0484e5 , 0 0 70px #195f6d , 0 0 80px #0061ff , 0 0 100px #081766 ;
	  	-webkit-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  	-moz-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  	-o-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  	transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  }
	  to {
		  text-decoration: normal;
		  text-shadow: 0 0 10px rgba(255,255,255,1) , 0 0 20px rgba(255,255,255,1) , 0 0 30px rgba(255,255,255,1) , 0 0 40px #00ffff , 0 0 70px #00ffff , 0 0 80px #00ffff , 0 0 100px #00ffff ;
		  -webkit-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
		  -moz-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
		  -o-transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
		  transition: all 200ms cubic-bezier(0.42, 0, 0.58, 1);
	  }
	}

	.glow_ctn {
	  display: inline-block;
	  float: right;
	  -webkit-box-sizing: border-box;
	  -moz-box-sizing: border-box;
	  box-sizing: border-box;
	  background: black;
	  padding: 2VW;
	  border: none;
	  font: normal 3VW "Warnes", Helvetica, sans-serif;
	  color: rgba(255,255,255,1);
	  text-align: center;
	  -o-text-overflow: clip;
	  text-overflow: clip;
	  white-space: pre;
	  cursor: default;
	  text-shadow: 0 0 10px rgba(255,255,255,1) , 0 0 20px rgba(255,255,255,1) , 0 0 30px rgba(255,255,255,1) , 0 0 40px #0484e5 , 0 0 70px #195f6d , 0 0 80px #0061ff , 0 0 100px #081766 ;
	  -webkit-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  -moz-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  -o-transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  transition: all 200ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
	  animation: glow_on_off 1s linear alternate infinite;
	}

		.web_de_btn svg
		{
			display: inline-block;
			position: absolute;
			width: 18VW;
			height: 8VW;
			top:0VW;
			cursor: pointer;
		}

		.shape {
			position: relative;
			width: 100%;
			height: 100%;
		  	stroke-dasharray: 50 800;
		  	stroke-dashoffset: -0;
		  	stroke-width: 2VW;
		  	fill: transparent;
		  	stroke: #C62828;
		  	border-bottom: 1px solid black;
		  	transition: stroke-width 1s, stroke-dashoffset 1s, stroke-dasharray 1s;
		}

		.web_de_btn:hover .shape {
		  stroke-width: 1VW;
		  stroke-dashoffset: 0;
		  stroke-dasharray: 760;
		}
		{
			display: inline-block;
			position: absolute;
			width: 18VW;
			height: 8VW;
			top:0VW;
			cursor: pointer;
		}

		.shape {
			position: relative;
			width: 100%;
			height: 100%;
		  	stroke-dasharray: 50 800;
		  	stroke-dashoffset: -0;
		  	stroke-width: 2VW;
		  	fill: transparent;
		  	stroke: #C62828;
		  	border-bottom: 1px solid black;
		  	transition: stroke-width 1s, stroke-dashoffset 1s, stroke-dasharray 1s;
		}

		.web_de_btn:hover .shape {
		  stroke-width: 1VW;
		  stroke-dashoffset: 0;
		  stroke-dasharray: 760;
		}

		#social_ctn
		{
			display: block;
			float: left;
			width: 100%;
			height: 8VW;
			padding-bottom: 0.5VW;
		}

		.sc_title
		{
			display: inline-block;
			width: 40%;
			margin-left: 12%;
			height: 100%;
			padding: 1VW;
			background: black;
		}

		.sc_title div
		{
			font-size: 2.2VW;
			text-align: center;
			color: white;
			font-family: "Indie Flower";
		}

		.sc_content
		{
			display: inline-block;
			width: 40%;
			height: 100%;
		}
		.sc_content div
		{
			display: inline-block;
			float: left;
			position: relative;
			top:2VW;
			padding: 1VW;
			padding-left: 2VW;
			padding-right: 2VW;
			margin-left: 1VW;
			border: 0.5VW solid black;
			transition:all 0.3s;
			cursor: pointer;
		}
		.sc_content div i
		{
			display: inline-block;
			font-size: 2.5VW;
			line-height: 2VW;
		}

		.sc_1:hover
		{
			background: #3b5998;
			color: white;
			border: 0.5VW solid white;
		}

		.sc_3:hover
		{
			background: #00aced;
			color: white;
			border: 0.5VW solid white;
		}

		.sc_2:hover
		{
			background: #dd4b39;
			color: white;
			border: 0.5VW solid white;
		}

		.sc_4:hover
		{
			background: #007bb6;
			color: white;
			border: 0.5VW solid white;
		}
}