﻿
.top_wrappper
{
    width:100%;
    height:56px;
    background-color:#fff;
    border-top: 3px solid #A7190C;
    box-shadow: 1px 1px 4px #060707;

}

.img-logo
{
	vertical-align:middle;
    margin-top:0px;
    padding-top:0px;  
    border:0;
    float:left;
    background: url("images/logo.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
    background-size: 160px auto;
    height: 54px;
    position: relative;
    top: 1px;
    left:5px;
    width: 165px; 
}

.img-logo a {
	width: 100%; height: 100%; display: block;text-decoration:none;
}


.img-call
{  
	background: url(images/Call.png) no-repeat 96% center;   
	width:124px;
	vertical-align:top;
    float:right;  
    margin-bottom:1px;
    margin-top:2px;
    padding-top:0px;  
    height:54px;
    margin-right:5px;
    border:0;
    z-index:9999;
} 



div.float
{
	z-index:9999;
}

.button 
{
   
	font-family: Arial, Verdana, "Trebuchet MS" , Tahoma;
	font-size: 14px;
	background:transparent;
	border:1px solid;
	color:white;
	font-weight:bold;
	padding:5px;
	Border-radius:4px;
	cursor:pointer;
	margin-top:10px;
	
}




.toolbarInner  a span
{
   /* background: url(../../images/nav/homeback.png) no-repeat 100%; 
     width: 10px; height:18px;
     display:inline-block;
     margin-right:5px;*/
}




.contentMainInner
{
    width:100%;margin:0px auto 0px auto;text-align:left;
}

.contentMainInnerPadded
{
    width:85%;margin:5px auto 10px auto;text-align:left;
    padding-right:10px;
    
}

.contentMainInnerPaddedMyunits
{
    width:100%;
    border:1px solid #ADAEB0;
    Border-radius:4px;
    
}

.contentMainInnerPaddedMyActions
{
    width:97%;
    margin-left:auto;
    margin-right:auto;
}


.footer
{
	 border-top: 1px solid #B3B3B3; 
	 text-align:center;
	 color:White;
	 background-color: #5f6d78;
	 bottom: 0;
	 font-family: Arial, Verdana, Helvetica, sans-serif;
     font-size: 13px;  
     padding:10px;
}



.clearfixloginbott
{
    background-color:silver;
    padding:10px;
    padding-top:2px;
     padding-bottom:2px;
     color:#000;
}



.Login
{
	font-size: 14px;
	color:Black;
	cursor:pointer;
	padding-left:10px;
	padding-right:10px;
	text-decoration:none;

}







.headerText
{
	font-weight:bold;
     text-align:center;
     padding-top:5px;
	
}



.SuccessPopup
{
position:absolute;
padding:10px;
width:120px;
background-color:#0075AA;
border:5px solid #cecece;

color:White;
	-moz-border-radius: 20px; /* Firefox */
	-webkit-border-radius: 20px; /* Safari and chrome */
	-khtml-border-radius: 20px; /* Linux browsers */


}

div.ModalPopup {
	position: absolute;
	left: 50%;
    top: 50%; 
    visibility: visible;
    vertical-align: middle; 
	background-color: #ffffff;
	position:absolute;
	/* set z-index higher than possible */
	z-index:10000;
    height :auto;
}

div.MaskedDiv 
{
	visibility: hidden;
	position:absolute;
	left:0px;
	top:0px;
	font-family:verdana;
	font-weight:bold;
	padding:40px;
    z-index:100;
	background-image:url(images/spinner.gif);
	/* ieWin only stuff */
	_background-image:none;
	
}


.processing
{
position:absolute;
padding:10px;
width:120px;
background-color:#0075AA;
border:5px solid #cecece;
text-align:center;

color:White;
	-moz-border-radius: 20px; /* Firefox */
	-webkit-border-radius: 20px; /* Safari and chrome */
	-khtml-border-radius: 20px; /* Linux browsers */
}


.maintop {}
.page {position:relative;}

#ContainerBlock
{
	margin: 5px 20px 20px 20px;
	border:1px solid silver;
	border-radius:4px; 
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	-moz-box-shadow:5px;
	-webkit-box-shadow:4px; 
	text-align:left;
	position:relative;
	top:8px;
	background-color:#fff;
	height:auto;
	
}


#ContainerBlock .header
{
    min-height:35px; 
    line-height:35px;
    text-align:center;
    color:#fffbd6;
    font-size:22px;
    font-weight:bold;
    color: white !important;
    background-repeat: repeat-x;
    border-color: #FF0101;
    background-color:rgb(255,1,1); 
     font-family:Calibri light, Arial, Verdana, "Trebuchet MS" , Tahoma;
   
  
}


#ContainerBlock .headerInner
{
    min-height:35px; 
    line-height:35px;
    text-align:center;
    color:#fffbd6;
    font-weight:bold;
    font-size:18px;
    color: white !important;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .25);
    background-color:#FF0101; 
    background-repeat: repeat-x;
    background-image: linear-gradient(#FF0101,#FF0101);
}


.mandatory{color:Red;}
.msgValidator { font-size:13px; color:Red;}
.msgItalicInfo { font-size:12px;font-style:italic;}


 .myr_topcontent
 {
     font-weight: normal;color: #000;font-size:13px;
     background-color: rgb(239, 239, 239);
     border:1px solid silver;margin:5px;
     padding:5px;
 }
 
 .myr_topcontentmyunits
 {
     border:0px solid silver;margin:5px;
     padding:10px;text-align:center;padding-top:0px;
 }
 


/* Text Box Style */




.btn {
    position: relative;
    display: inline-block;
    overflow: visible;
    padding: 8px 10px;
    font-size: 18px;
    font-weight: bold;
    line-height: 18px;
    color: #333;
    text-shadow: 0 1px 0 rgba(255, 255, 255, .5);
    background-color: #CCC;
    background-repeat: no-repeat;
    border: 1px solid #CCC;
    cursor: pointer;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, .5);
    -moz-box-shadow: 0 1px 0 rgba(255,255,255,.5);
    box-shadow: 0 1px 0 rgba(255, 255, 255, .5);
    text-decoration: none !important;
    margin-top:15px;
    margin-left:5px;
    white-space:pre-wrap;

}

.tgtwit-btn {
    color: white !important;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, .25);
    background-color: #c60000;
    background-repeat: repeat-x;
    border-color: #83361c;
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1);
    background-image: linear-gradient(#33BCEF,#019AD2);
}

.tgtwit-btn:hover {
    color: white !important;
    background-color: #0271BF;
    background-repeat: repeat-x;
    border-color: #096EB3;
    background-image: linear-gradient(#2DADDC,#0271BF);
}






a.lnkpaybuttNew,a.lnkpaybuttNew:active,a.lnkpaybuttNew:visited
{
    font-family:Calibri, Trebuchet MS, Arial, Helvetica, sans-serif;
    vertical-align:text-bottom;
    text-align:center;
    text-decoration:none;
    color: #ecaba9; 
    border-style:none;
    border:2px solid ecaba9;
    font-weight:bold;
    transition:0.15s ease-in-out; 
    background-color: rgb(199, 57, 44);
    -webkit-transition: .15s ease-in-out;
    margin:0px;
    font-size: 18px;
    width:100px;
    height:100px;
    float:left;
    border-radius:10px ;
    
 }
 
 a.lnkpaybuttNew:hover
{
    color: #fff; 
    text-decoration:none;
    background-color: rgb(167, 25, 12); 
    
}


/* Button Style End */

/* Registration Page */

.po_titlesub_bg
{
    padding:10px;
    padding-left:0px;
    color:Black;
}


/* My Units */

ContainerBlockMyUnit
{
	margin: 5px;
	border:1px solid #c60000;
	border:2px solid #7a321a;
	border-radius:4px; 
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	-moz-box-shadow:5px;
	-webkit-box-shadow:4px; 
	text-align:left;
	background-color:#fff;
	padding-bottom:8px;
	background-color:#f8f9fd;
	background-color:#fff;
	
	
}


.ContainerBlockMyUnitAcc,.ContainerBlockPayMyBill
{
    margin: 5px;
    text-align:left;
    padding:10px;
    color:#939390;
    font-weight:normal;
    background:  rgb(239, 239, 239);
  
}


.ContainerBlockMyUnitAcc span
{
     background:  rgb(239, 239, 239)  url("/images/Arrow_Mark_Down.png")  no-repeat   0 -143px ;
     float:right;
     margin-right:10px;
     margin-top:15px;
     width: 30px; height: 20px;
  
}
.ContainerBlockMyUnitAccSelected,.ContainerBlockPayMyBillSelected
{
    margin: 5px;
    text-align:left;
    padding:10px;
    color:#000;
    font-weight:normal;
   background:rgb(199, 199, 199) 
   
}

.ContainerBlockMyUnitAccSelected span
{
     background:  rgb(199, 199, 199)  url("/images/Arrow_Mark_Up.png")  no-repeat   0 -164px;
     float:right;
     margin-right:10px;
     margin-top:15px;
     width: 30px; height: 20px;
  
}


.ContainerBlockPayMyBill span
{
     background:  rgb(239, 239, 239)  url("images/ezstorage_sprites.png")  no-repeat   0 -143px;
     float:right;
     margin-right:6px;
     margin-top:5px;
     width: 30px; height:20px;
     display:inline-block;
  
}



.ContainerBlockPayMyBillSelected span
{
     background:  rgb(199, 199, 199)  url("images/ezstorage_sprites.png")  no-repeat   0 -164px;
     float:right;
     margin-right:6px;
     margin-top:5px;
     width: 30px; height:20px;
     display:inline-block;
  
}


    
.rowMyPayUnit
{
    padding:10px;
    padding-top:0px;
    
}

.rowLocation
{
    padding:5px;
    font-weight:bold; 
    padding-bottom:0px;
}

.rowActions
{
    padding-left:5px;
    white-space:nowrap;
    text-align:left;
}


.txtUnit,.lblUnit {font-size:28px;}

.payhead{font-size:28px;font-weight:normal;padding:5px;}
.unitdetailsHead
{
    background-color: rgb(156,26,70) !important;
    height: 25px;
    text-align: center; 
    color: #fff;
    vertical-align: middle; 
    font-size: 14px;
}

.txtUnitFacilityName { width:85%;font-size:15px;}

.txtSmall
{
    font-size:13px;
}

/* End  My Units */


.tdright  {text-align:right;}

.TblBorder
{
    border:1px solid #d9d9d9 ;
    font-size:13px;
    letter-spacing:0.2;
    border-collapse:collapse;
    font-size:14px;
}
      
.TblBorder  td
{
   border:1px solid #d9d9d9 ;
   background-color:#efefef;
}  
          
.TblBorder  th
{
     border:1px solid #d9d9d9 ;
}  

.TblBorderfooter td,.TblBorderfooter th
{
     border:1px solid #d9d9d9 ;
     background-color:#727f89;
     color:#fff;
     font-size:13px;
     font-weight:bold;
     
}


.TblNoBorder {font-size:13px; font-weight:bold;}
.TblBorderSilver
{
    border:1px solid Silver;
}
    
    
.Title_BackColor_TxtCAlign {
    text-align: center;
    background-color:#6233c2;
    color:#fff;
    font-weight:bold;
}
.Title_BackColor_TxtLAlign {
    text-align: left;
    background-color: #a7190c;
    color:#fff;
    font-weight:bold;
}

.txtBold {font-weight:bold;}      


.modpnl
{
    background-color:#0072a8;
}

    
a img{border: none;}

#UpdateProgressMain
 {
      position:fixed;
      top:0px;
      bottom:0px;
      left:0px;
      right:0px;
      background-color:gray;
      filter:alpha(opacity=40);
      opacity:0.4;
      vertical-align:middle;
      width:100%;
      z-index:99999;
 }

#divProgress 
{
      position:fixed;
      top:185px;
      text-align:center;
      vertical-align:middle;
      width:100%;
     
}


TxtLAlign,.Olabel
{
    text-align: left;
    background-color:#fffbd6;
        
}
      
.TxtRAlign
{
    text-align: right;
}

.lnkpaybuttFirst {margin-right:5px;margin-bottom:5px;}
.lnkpaybutt {margin-right:5px;margin-bottom:5px;}
.ajax__calendar_container { z-index : 10003 !important;}

.SmallText {font-size:12px; color:Red;padding:6px;}
 
#divPayUnitDetails {display:block;}
#divPayUnit{display:block;}


@media only screen and (max-width: 290px )
{

    .PayOnlinlogin_WrapperRightForResp
    {
        margin-left:auto !important;
    }


    .maintopTitleRight {
        font-size: 17px !important;
    }

    .maintopTitle {
        display: none;
    }

    #MenuForDesk {
        display: none;
    }

    #navMenuMob {
        display: block !important;
        margin: -44px -85px 59px -153px !important;
    }

    .StorageWestMainLogo {
        margin-bottom: 67px;
    }
    .HeaderBack {height:70px !important;}
    .HeaderContentWrapper {padding-top:10px !important;}
    .phoneWrapper{display:none;}
    .PayOnline_Wrapper {padding:1px!important;}
    .msgValidator {font-size:11px;}
    .divCardImage {display:none;}
    .footer{width: 100% !important;}
    #wrapper_header{width: 100% !important;}
    #wrapper_title{width:100%!important;display:flex;justify-content: center !important;align-items: center !important;padding:0px !important;}
    #main {min-height: 290px!important;width: 100%!important;}
    
    a.portalButtons,a.portalButtons:active,a.portalButtons:visited
    {
        float:none !important;
        /*width:90% !important;*/
        margin-bottom:10px !important;
    }
    .PayOnlinlogin_WrapperRight{display:none;}
    .PayOnlinelogin_Wrapperleft {float:left !important;width:90% !important;}
    .page{width:90% !important;}
    .commoncontenttop {font-size:12px !important;}
    .commoncontenttop b {font-size:12px !important;}
    #divWelcome h2 { font-size:15px; }
    #divPrePayDetails{display:none;}
    input.textboxstyle {width:90% !important; padding: 8px!important;}
    #divLastPaymentDetails{display:none !important;}
     #txtSchMoveOutdate{width:80% !important;}
     .divProfile,.divProfileRight {width:100% !important; float: none; }
    .ProfilefieldsLeft , .ProfilefieldsRight {width:95% !important;float:none;}
}
        

@media (max-width: 580px) 
{
    .payolineSubmitNote{
        width:100%!important;
    }



    .PayOnlinlogin_WrapperRightForResp
    {
        margin-left:auto !important;
    }
    .maintopTitle {
        display: block;
        font-size: 17px !important;
    }

    .maintopTitleRight {
        font-size: 15px !important;
    }

    #MenuForDesk {
        display: none;
    }

    #navMenuMob {
        display: block !important;
        margin: -44px -85px 59px -153px !important;
    }

    .StorageWestMainLogo {
        margin-bottom: 67px;
    }
    .HeaderBack {height:90px !important;}
    .HeaderContentWrapper {padding-top:15px !important;}
    .commoncontenttop {font-size:18px !important;}
    .commoncontenttop b {font-size:12px !important;}
    .phoneWrapper{display:none !important;}
    .footer{width: 100% !important;}
    #wrapper_header{width: 100% !important;}
    #wrapper_title{width:100%!important;display:flex;justify-content: center !important;align-items: center !important;padding:0px !important;}
    #main {min-height: 290px!important;width: 100%!important;}

   .PayOnline_Wrapper {padding:1px!important;}
   .PayOnlinlogin_WrapperRight{display:none;}
   .PayOnlinelogin_Wrapperleft {float:left !important;width:90% !important;}
   .page{width:90% !important;}
   #navMenuMob {display:block !important;}
   #navMenu {display:none !important;}
   .footer_left_phone,.footerContentwrapper {width:90% !important;}
   
    #Linklogout {display:inline-block !important;}
    #divPrePayDetails {display:none !important;}
    .DropDownHeightFixed {}
    .DropDownHeight {min-width:98%;padding: 8px!important;}
    #divCardImage {display:none !important;}
    .divPayMyBilldetails {width:100% !important;}
    .divUnitDetails {width:100% !important; }
    .ContainerBlockPayMyBill{}
     input.textboxstyle {width:90% !important; padding: 8px!important;}
     #divLastPaymentDetails{display:none !important;}
    #txtSchMoveOutdate{width:80% !important;}

   .divProfile,.divProfileRight {width:100% !important; float: none; }
    .ProfilefieldsLeft , .ProfilefieldsRight {width:95% !important;float:none;}
}






      
@media (max-width: 960px) 
{
   .PayOnlinlogin_WrapperRightForResp
    {
        margin-left:auto !important;
    }
    #wrapper_headerInner{
        width:auto !important;
    }
    .PayOnlinlogin_WrapperRight{display:none;}
    .PayOnlinelogin_Wrapperleft {float:left !important;width:90% !important;}
    .page{width:90% !important;}
    .footerwrapperRight{display:none;}
    .HeaderContentWrapper {width:100%;}
    .BottomHeader {width:100% !important;height:20px !important;}
    .InnerWrapper{width:100%; margin: 0 auto 0 auto;}
    .internalcouponright{width:100%;  margin: 0 auto 0 auto;}
    .couponunitswrapper { width:100%;}
    .phoneWrapper{display:block;
                  margin-top:18px !important;
                  font-size:14px !important;
                  background-position:6px 12px !important;
                  padding-right:12px !important;
    }
    .phoneWrapperno{
        font-size:21px!important;

    }
    .TopHeader
    {
        padding-left:12px !important;
        padding-right:0px !important;
        border:0px solid #fff !important;
        margin: 0 auto !important;
    }

    .footer{width: 100% !important;}
    #wrapper_header{width: 100% !important;}
    #wrapper_title{width:100%!important;display:flex;justify-content: center !important;align-items: center !important;padding:0px !important;}
    #main {min-height: 290px!important;width: 100%!important;}
    .commoncontentwrapper {width:100% !important;}
    .commoncontentwrapperInner  {padding:10px;}
                
    .commoncontenttop
    {
        font-weight: bold;
        padding-left:0px;
        padding-right:0px;
        text-transform: uppercase; 
        text-align:center;
        margin-left:0px;
        margin-right:0px;
    }   
                
    .commoncontenttop b
    {
        padding-left:0px;
        margin-left:0px;
        top:-10px;
    }
                
        
    .commoncontentswrapper
    {
        padding-left:0px;
        padding-right:0px;
        width:100%;  
        height:auto;
    }
               
    .commoncontentswrapperInner  { padding:10px; height:auto;}
            
    .commoncontentbottom
    {
        width:100%;  padding-left:0px;
        padding-right: 0px; 
        margin-left:0px;
    }
        
    
    input.textboxstyle {width:95% !important; padding: 8px!important;}
    textarea.textboxstyle {width:95% !important; padding: 8px!important;}
    #imglogo{max-width:90%;}
    input.twitterStyleTextbox {width:95%;}
    .InnerModal {width:98%;}
    .DropDownHeight {width:98% !important;padding: 8px!important;}
    .tdMoveOutDate {width:94%;text-align:left;}
    
    .divPayMyBilldetails {width:100% !important;}
    .divUnitDetails {width:100% !important;clear:left;}
    #divPrePayDetails{display:none;}
    .cardPayfieldsLeft {width:100%;float:left;padding-bottom:10px;}
    .cardPayfieldsRight {float:left;width:100%;}

     .divProfile,.divProfileRight {width:100% !important; float: none; }
    .ProfilefieldsLeft , .ProfilefieldsRight {width:95% !important;float:none;}
 
}
            
            