﻿

/* The Modal (background) */
.modalx {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 5px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modalx-content {
    background-color: #fefefe;
    margin: auto;
    padding: 20px;
    border: 1px solid #888;
    width: 80%;
}

/* The Close Button */
.closex {
    color: #aaaaaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.closex:hover,
.closex:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
}

.newbutton{ background-color:#020519; color: White}
.newbutton:hover,.newbutton:focus {background-color:#FF00CC}

.xTextBoxx{ padding-top:5px; padding-bottom:5px; padding-left:10px; padding-right:10px; color:Gray; border-style:solid ; border-width: 1px; border-color:Silver;-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 .5s,-webkit-box-shadow ease-in-out .5s;-o-transition:border-color ease-in-out .5s,box-shadow ease-in-out .5s;transition:border-color ease-in-out .5s,box-shadow ease-in-out .5s; -moz-border-radius: 4px; -webkit-border-radius: 4px;-khtml-border-radius: 4px; border-radius: 4px; }
.xTextBoxx{ cursor: text }
.xTextBoxx: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)}

.sideInfo { width:50%}
.gridViewPager td
    {
         padding-left:4px;
         padding-right:4px;
         padding-top:1px;
         padding-bottom:2px;
        }

 body {margin:0;}
 
 .backimagiz
        {
	        background-image: url('images/background.jpg');
            background-repeat: no-repeat;
            background-position: center center  ;
            background-attachment:fixed; 
   	        } 

 .rotateObjectx{transition: .8s all;}
 .rotateObjectx:hover,.rotateObjectx:focus { -webkit-transform: rotate(5deg); -moz-transform: rotate(5deg); -o-transform: rotate(5deg); -ms-transform: rotate(5deg); transform: rotate(5deg); }

.animatex1 { color:White; background-color:#AF00F5;}
.animatex1:hover,.animatex1:focus { color:#AF00F5; background-color:White}

.animatex2 { color:White; background-color:#F5AF00}
.animatex2:hover,.animatex2:focus  { color:#F5AF00; background-color:White}

.animatex3 { color:White; background-color:#00F5AF}
.animatex3:hover,.animatex3:focus  { color:#00F5AF; background-color:White}

.animatex4 { color:White; background-color:#FF8F70}
.animatex4:hover,.animatex4:focus  { color:#FF8F70; background-color:White}

.myParternxyz{background-color:silver;
background-image: 
radial-gradient(circle at 100% 150%, silver 24%, white 25%, white 28%, silver 29%, silver 36%, white 36%, white 40%, transparent 40%, transparent),
radial-gradient(circle at 0    150%, silver 24%, white 25%, white 28%, silver 29%, silver 36%, white 36%, white 40%, transparent 40%, transparent),
radial-gradient(circle at 50%  100%, white 10%, silver 11%, silver 23%, white 24%, white 30%, silver 31%, silver 43%, white 44%, white 50%, silver 51%, silver 63%, white 64%, white 71%, transparent 71%, transparent),
radial-gradient(circle at 100% 50%, white 5%, silver 6%, silver 15%, white 16%, white 20%, silver 21%, silver 30%, white 31%, white 35%, silver 36%, silver 45%, white 46%, white 49%, transparent 50%, transparent),
radial-gradient(circle at 0    50%, white 5%, silver 6%, silver 15%, white 16%, white 20%, silver 21%, silver 30%, white 31%, white 35%, silver 36%, silver 45%, white 46%, white 49%, transparent 50%, transparent);
background-size:100px 50px;background-attachment:fixed;}

.myImg {
    opacity: 0.5;
    filter: alpha(opacity=50); /* For IE8 and earlier */
}

.myImg:hover {
    opacity: 1.0;
    filter: alpha(opacity=100); /* For IE8 and earlier */
    transition: all 0.5s ease-in-out
}
 
 .mycheckbox {
  position: relative;
  display: block;
  margin-top: 10px;
  margin-bottom: 10px;
}

.mycheckbox label {
  min-height: 20px;
  padding-left: 20px;
  margin-bottom: 0;
  font-weight: normal;
  cursor: pointer;}
 
  .dockRight
  {
  	 float: right ;
  	 width:350px;
  	}
  	
  .Image1 
  {
  	 padding: 5px 5px 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);
    
  	}
  	
  	 .showcasenew
  {
  	width:340px;
  	background: White;
  	box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.3);
  	}
  	
  	.faderx{opacity: 0.6; filter: alpha(opacity=60);}
  	
  	 .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 ;
	}
	
	.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%;
	}
	
	.TitleHeada
	{
		 margin-left:70px;
		 font-size:28pt;
		 height:70px;	
	}
	
	.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-diagBlue {
		  background: -webkit-linear-gradient(left top, #0066FF , #333399); /* For Safari 5.1 to 6.0 */
		  background: -o-linear-gradient(bottom right, #0066FF , #333399); /* For Opera 11.1 to 12.0 */
		  background: -moz-linear-gradient(bottom right, #0066FF , #333399); /* For Firefox 3.6 to 15 */
		  background: linear-gradient(to bottom right, #0066FF , #333399); /* Standard syntax */
	}
	
	.grad-diag {
		  background: -webkit-linear-gradient(left top, #828282 , #A1A1A1); /* For Safari 5.1 to 6.0 */
		  background: -o-linear-gradient(bottom right, #828282 , #A1A1A1); /* For Opera 11.1 to 12.0 */
		  background: -moz-linear-gradient(bottom right, #828282 , #A1A1A1); /* For Firefox 3.6 to 15 */
		  background: linear-gradient(to bottom right, #828282 , #A1A1A1); /* Standard syntax */
	}
	
	.grad-down {
		  background: -webkit-linear-gradient(top, #A1A1A1 , #828282); /* For Safari 5.1 to 6.0 */
		  background: -o-linear-gradient(bottom , #A1A1A1 , #828282); /* For Opera 11.1 to 12.0 */
		  background: -moz-linear-gradient(bottom , #A1A1A1 , #828282); /* For Firefox 3.6 to 15 */
		  background: linear-gradient(to bottom , #A1A1A1 , #828282); /* Standard syntax */
	}
	
	.mobileImage{ height:80px}
		
	.logolarge{ visibility:visible}
	.logosmall{ visibility:hidden}
	.heroshotm{background: url('images/lpgplant2.png') center center no-repeat}
	.mybutton {-moz-border-radius: 6px; 
            	-webkit-border-radius: 6px;
            	-khtml-border-radius: 6px; 
            	border-radius: 6px; padding-top:10px; padding-bottom:10px; padding-left: 15px; padding-right: 15px; cursor: pointer; transition: all 0.2s ease-in-out;}
	.mybutton:hover {box-shadow: 0 5px 15px rgba(145, 92, 182, .4);}	
	.mybutton1{background-color: #EE6E73; color: #FFFFFF;}
	.mybutton1:hover {background-color:White; color: #EE6E73 ;}
	.mybutton2{background-color: #80CC28; color: #FFFFFF;}
	.mybutton2:hover {background-color:White; color: #80CC28 ;}
	.mybutton3{background-color: #4285F4; color: #FFFFFF;}
	.mybutton3:hover {background-color:White; color: #4285F4 ;}
	.mybutton4{background-color: #55ACEE; color: #FFFFFF;}
	.mybutton4:hover {background-color:White; color: #55ACEE ;}
	.mybutton5{background-color: #3B5998; color: #FFFFFF;}
	.mybutton5:hover {background-color:White; color: #3B5998 ;}
	.mybutton6{background-color: #44c622; color: #FFFFFF;}
	.mybutton6:hover {background-color:White; color: #44c622 ;}
	.bodytextcontainer{ width: 950px}
	.progressimage{ width:35%}
.panelx {opacity: 0.9; filter: alpha(opacity=90);}	
.Space50
{ height:30px}
.Space100
{ height:100px}

#page-wrapper{ background-color:White}

/* The Modal (background) */
.modalx {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 5px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}


/* Modal Content */
.modalx-content {
    background-color: #fefefe;
    margin: auto;
    padding: 20px;
    border: 1px solid #888;
    width: 80%;
}

/* The Close Button */
.closex {
    color: #aaaaaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.closex:hover,
.closex:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
}

.fontBlack{ font-family: 'Comfortaa', cursive; }
.fontText{ font-family: 'Raleway', sans-serif; }
.fontMediumSize{ font-size: 30pt}
.fontLargeSize{ font-size: 40pt}
.fontRegularSize{ font-size: 11pt}
.fontSmallSize{ font-size: 9pt}
.fontTinySize{ font-size:7pt}
.form-control{font-family: 'Raleway', sans-serif;font-size: 11pt; }
label, p,LinkButton,a {font-family: 'Raleway', sans-serif;font-size: 11pt; font-weight:normal }
.btn{font-family: 'Raleway', sans-serif;font-size: 11pt; }
	.shadow
	{
		box-shadow: 3px 3px 5px #888888
	}
	
	
	.passport
	{
	 width:70px;
	}
   .validation{ font-size:8px; color:Red}
   
	@media Print
	{
		.DontPrint
		{
			display:none;
		}
	}
	
	
	
	@media only screen and (max-width: 1300px){
		.heroshotm{background: url('images/lpgplant3.png') center center no-repeat}
		}
	
	@media only screen and (max-width: 1200px){
		.col-lg-3 { float:right ; width:25%}
	}
	
	
	@media only screen and (max-width: 1000px)
	{
	    .Space100 { height:70px}
	    .Space50 { height:20pt}
        .fontMediumSize{ font-size: 15pt}
        .fontLargeSize{ font-size: 20pt}
        .fontRegularSize{ font-size: 10pt}
		.heroshotm{background: url('images/lpgplant3.png') center center no-repeat}
		.bodytextcontainer{ width:90%}
		.responsiveimagex{ width: 100%;}
		.form-control{font-size: 10pt}
		label, p,LinkButton,a {font-size: 10pt}
		.btn{font-size: 10pt}
	}
	@media only screen and (max-width: 800px){
		.BlockMove { width: 100%; clear:both}
		.TitleHeada{ margin-left:10px;font-size:14pt; height:40px;}
		.A4 { width:90%}
				
	}
	
	@media only screen and (max-width: 700px){
		.heroshotm{background: url('images/lpgplant4.png') center center no-repeat}
		.DivMove33 { width: 100%; clear:both}
		.sideInfo{ width:70%}	
		.showcasenew{ width: 90%}	
	}		
	
	@media only screen and (max-width: 650px){
		#logo {background: url('nav-icon.png') center center no-repeat;}
				
		}
	
	@media only screen and (max-width: 550px)
	{
	    .DivMove45 { width: 100%; clear:both}
	   .Space100 { height:40px}
	    }
	
	@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}
		.Space50 { height:10pt}    
		.fontMediumSize{ font-size: 12pt}
        .fontLargeSize{ font-size: 13pt}
        .fontRegularSize{ font-size: 9pt}
        .fontSmallSize{ font-size: 8pt}
        .fontTinySize{ font-size:6pt}
         .col-lg-3 { width: 100%; clear:both}
         .form-control{font-size: 9pt}
         .btn{font-size: 9pt}
         label,p,LinkButton{font-size: 9pt}
         .sideInfo{ width:90%}
         .xTextBoxx{ padding-top:2px; padding-bottom:2px; padding-left:5px; padding-right:5px}
         .progressimage{ width:65%}
	}
	
	@media only screen and (max-width: 400px)
	{
		.Space100 { height:25px}
		.heroshotm{ width:0px; visibility:hidden }
		.responseText400{ font-size:10pt}
		.responsiveTextSize{ font-size:8pt}
        .increasetd{ height:70px;}
		.passport{width:50px;}
		.passport2{width:50px;}		
	    .logolarge{ visibility: hidden; height:1px; width:1px }
	    .logosmall{ visibility: visible}
	    .fontMediumSize{ font-size: 9pt}
        .fontLargeSize{ font-size: 10pt}
        .fontRegularSize{ font-size: 8pt}
        .fontSmallSize{ font-size: 7pt}
        .fontTinySize{ font-size:6pt}
        .form-control{font-size: 8pt}
        .btn{font-size: 8pt}
        label,p, LinkButton, a {font-size: 8pt}
	}
	
	@media only screen and (max-width: 360px)
	{
		.showcase{ width:90%}
		.responseText360{ font-size:8pt}
	}
	

	.mygridviewx td 
  {
      padding:10px;
      }
  .mygridviewx tr 
  {
      border-bottom-style: solid; border-width: 1px; border-color: #CCCCCC
      }
  .mygridviewx tr:hover
  {
      background-color:Lime ;
      }
   @media only screen and (max-width: 650px)
   {
       .mygridviewx td 
        {
          padding:5px;
          }
       }

.spaceCheckBox label { margin-left:7px; font-weight:normal; color:Navy }

.gridViewPager td
    {
         padding-left:4px;
         padding-right:4px;
         padding-top:2px;
         padding-bottom:2px;
        }
.gridViewPager caption
    {
         text-align:center;
         font-weight:bold
        }
        
.color1{ color:White; background-color:#4CAF50; transition: all 1s ease-in-out;}
	.color1:hover { color:#4CAF50; background-color:White}
	.color2{ color:White; background-color:#00C0EF; transition: all 1s ease-in-out;}
	.color2:hover { color:#00C0EF; background-color:White}
	
	