﻿body {margin:0;}
  .dockRight
  {
  	 float: right ;
  	 width:350px;
  	}
  	
  .Image1 
  {
  	 padding: 15px 15px 0;
  background-color: white;
  box-shadow: 0 1px 3px rgba(34, 25, 25, 0.4);
  -moz-box-shadow: 0 1px 2px rgba(34,25,25,0.4);
  -webkit-box-shadow: 0 1px 3px rgba(34, 25, 25, 0.4);
  	}
     
  .showcase
  {
  	width:340px;
  	background: White;
  	box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
    
  	}
  	
  	 .A4
  {
  	width:650px;
  	background: White;
  	box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
    
  	}
  	
  	  	  	
  	.mytextbox
  	{width:90%; padding-top:5px; padding-bottom: 5px; padding-left:12px; padding-right:12px;line-height:1.42857143;color:#555;background-color:#fff;background-image:none;border:1px solid #ccc;border-radius:4px;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075);box-shadow:inset 0 1px 1px rgba(0,0,0,.075);-webkit-transition:border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;-o-transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s;transition:border-color ease-in-out .15s,box-shadow ease-in-out .15s}
  	
  	.mytextbox:focus{border-color:#66afe9;outline:0;-webkit-box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6);box-shadow:inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(102,175,233,.6)}
  	  	    
        .wrap {
		position:relative;
		margin:0 auto;
               /*replace 900px with your width*/
		width:100%;
	}

	
	.lockimage
	{
		background-position:100% 100%;
		background-repeat:no-repeat ;
	}
	
	@media Print
	{
		.DontPrint
		{
			display:none;
		}
	}
	
	
	.DivMove33 
	{
	width:33%;
	float:left;
	}
	
	.DivMove45 
	{
	width:45%;
	float:left;
	}
	
	.fixedHeaderAR
{
	width:100%;
	float:left;
	position:fixed;
	z-index:99998;
	top: 0px;
	left:0;
    height:50px;
	}
	
.fixedFooterAR
{
	width:100%;
	float:left;
	position:fixed;
	bottom:0;
	z-index:999999;
	left:0;
	height:50px;
	}

.fixedContentAR
{
	margin-top:50px;
		margin-bottom:50px;
		float:left;
        width:100%;
	}
			
	@media only screen and (max-width: 650px){
		#logo {background: url('nav-icon.png') center center no-repeat;}
		}
	
	.TitleHeada
	{
		 margin-left:70px;
		 font-size:28pt;
		 height:70px;	
	}

	/* If in mobile screen with maximum width 479px. The iPhone screen resolution is 320x480 px (except iPhone4, 640x960) */    
	@media only screen and (max-width: 800px){
		.BlockMove { width: 100%; clear:both}
		.TitleHeada{ margin-left:10px;font-size:14pt; height:40px;}
		.A4 { width:90%}
	}
	
	.curve4
	{
		-moz-border-radius: 4px; 
            	-webkit-border-radius: 4px;
            	-khtml-border-radius: 4px; 
            	border-radius: 4px;
	}
	
	.curve9
	{
		-moz-border-radius: 9px; 
            	-webkit-border-radius: 9px;
            	-khtml-border-radius: 9px; 
            	border-radius: 9px;
	}
	
	.grad {
		  background: -webkit-linear-gradient(left top, #99CCFF , white); /* For Safari 5.1 to 6.0 */
		  background: -o-linear-gradient(bottom right, #99CCFF, white); /* For Opera 11.1 to 12.0 */
		  background: -moz-linear-gradient(bottom right, #99CCFF, white); /* For Firefox 3.6 to 15 */
		  background: linear-gradient(to bottom right, #99CCFF , white); /* Standard syntax */
	}
	
	

	
	.mobileImage{ height:80px}
		
	.logolarge{ visibility:visible}
	.logosmall{ visibility:hidden}
	.caption1{ font-size:40pt}
	.caption2{ font-size:28pt; }
	.caption3{ font-size:12pt; }
	.captionSmall{ font-size:14pt; }
	.captionSmallar{ font-size:9pt; }
	.caption4{ font-size:15pt }
	.heroshotm{background: url('images/lpgplant2.png') center center no-repeat}
	.mybutton {-moz-border-radius: 9px; 
            	-webkit-border-radius: 9px;
            	-khtml-border-radius: 9px; 
            	border-radius: 9px; padding-top:15px; padding-bottom:15px; padding-left: 20px; padding-right: 20px; background-color: #D62B4F; cursor: pointer; color: #FFFFFF;transition: all 0.2s ease-in-out;}
	.mybutton:hover {background-color:White; color: #D62B4F;box-shadow: 0 5px 15px rgba(145, 92, 182, .4);}	
	.bodytextcontainer{ width: 950px}
	
	@media only screen and (max-width: 550px){.DivMove45 { width: 100%; clear:both}}
	
	@media only screen and (max-width: 1300px){
		.caption1{ font-size:30pt}
		.caption2{ font-size:20pt}
		.caption3{ font-size:12pt}
		
		.heroshotm{background: url('images/lpgplant3.png') center center no-repeat}
	}
	
	@media only screen and (max-width: 1000px){
		.caption1{ font-size:25pt}
		.caption2{ font-size:17pt}
		.caption3{ font-size:12pt}
		.caption4{ font-size:12pt}
		.heroshotm{background: url('images/lpgplant3.png') center center no-repeat}
		.bodytextcontainer{ width:90%}
	}
	
	@media only screen and (max-width: 700px){
		.caption1{ font-size:15pt}
		.caption2{ font-size:12pt}
		.caption3{ font-size:10pt}
		.heroshotm{background: url('images/lpgplant4.png') center center no-repeat}
		.DivMove33 { width: 100%; clear:both}
	}
	
	@media only screen and (max-width: 500px){
		.dockRight{ width:100%}
		.mobileImage{ height:50px}
		.fixedHeaderAR{ height:30px}
		.fixedFooterAR{ height:30px}
		.fixedContentAR{margin-top:30px;margin-bottom:30px}
	}
	
	@media only screen and (max-width: 400px)
	{
		.caption1{ font-size:13pt}
		.caption2{ font-size:12pt}
		.caption3{ font-size:10pt}
		.captionsmall{ font-size:8pt}
		.heroshotm{ width:0px; visibility:hidden }
		.responseText400{ font-size:10pt}
		.responsiveTextSize{ font-size:8pt}
		
	.logolarge{ visibility: hidden; height:1px; width:1px }
	.logosmall{ visibility: visible}
	}
	
	@media only screen and (max-width: 360px)
	{
		.showcase{ width:90%}
		.responseText360{ font-size:8pt}
	}
	
	.shadow
	{
		box-shadow: 3px 3px 5px #888888
	}
	
	@media only screen and (max-width: 1000px){
		.responsiveimagex{ width: 100%;}
	}
	
	.passport
	{
	 width:70px;
	}
	
	@media only screen and (max-width: 400px){
		.increasetd{ height:70px;}
		.passport{width:50px;}
		.passport2{width:50px;}
		}
		
		

	
	