﻿/*
*       Upload.css
*       2015/10/08
*********************************************/
@viewport{
    width: 320px;
    zoom: 1.0;
}
@-ms-viewport{
    width: 320px;
    zoom: 1.0;
}
@-o-viewport {
    width:320px;
    zoom:1.0;
}
/*
@media (orientation: landscape) { 
   body { 
     -webkit-transform: rotate(-90deg); 
     -moz-transform: rotate(-90deg); 
     -o-transform: rotate(-90deg); 
     -ms-transform: rotate(-90deg); 
     transform: rotate(-90deg); 
   } 
} 
*/
html{margin:0;padding:0;}
body{position:relative;margin:0;padding:0;    font-family:Arial, Verdana, Georgia, "Helvetica Neue", "Lucida Grande",
    "Segoe UI", Helvetica, sans-serif,Tahoma,Consolas;
    background-image:url(/Styles/Graphics/Mobile/Common/BackGround/Patterns/TexturedPaper.png);}
div.Main{}
div.TopMargin{}
div.BottomMargin{}
div.Container{}
div.Wrapper{}
div.ContentContainer{text-align:center;}
div.ContentWrapper{}

div.UploadFilesTitle1{width:300px;margin:5px auto 0 auto;
    font-size:30px;color:rgb(0,103,56);text-align:center;}
/*div.UploadFilesTitle1::before{content:"Send Files to Westside Instaprint";}*/
div.UploadFilesTitle1Error1{width:300px;margin:0 auto 0 auto;
    font-size:20px;color:red;text-align:center;}
div.UploadFilesTitle1Error1::before{content:
    "Opera Mini does not support File Sending.  " 
    "Pllinear use a different browser.";}
div.UploadFilesTitle1Error2{width:300px;margin:0 auto 0 auto;
    font-size:20px;color:red;text-align:center;}
div.UploadFilesTitle1Error2::before{content:
    "File Sending not supported in this browser.  " 
    "Please upgrade this browser or use the latest version of a different browser.";}
div.UploadContainer{width: 300px;min-height:720px;display:inline-block;margin:0 0 10px 0;
    border:1px solid rgb(0,103,56);text-align:left;}

/*          Inputs                      Start
*********************************************/
div.InputsContainer{margin:5px 0px 0px 0px;}
div.InputsWrapper{}
div.InputContainer{margin:5px 0px 0px 0px;}
div.InputContainer2{margin:0 0 0 0;}
div.InputWrapper{white-space:nowrap;}
div.InputWrapper2{width:256px;margin:0 18px 0 18px;
    border:3px solid rgba(147,188,169,1);padding:1px;white-space:nowrap;}
div.InputLabel{padding:0 0 0 30px;}
input.InputText{width:246px;height:32px;margin:0;
    border:0px;padding:0 0 0 10px;
    font-size:16px;}
div.InputContainer.RequiredText1{margin:5px 0 0 0;}
div.InputLabel.RequiredText1{padding:0 10px 0 0;font-size:14px;text-align:right;color:red;}
/*div.InputLabel.RequiredText1::before{content:"(Required Fields)";}*/
div.InputLabel.Name,div.InputLabel.EmailInvalid,div.InputLabel.Phone,div.InputLabel.Phone1 {color:red;}
/*div.InputLabel.Name::before{content:"Name";}*/
/*div.InputLabel.Company::before{content:"Company";}*/
span.InputsErrorNameNeeded{font-size:14px;color:rgba(0, 0, 0, 1);}
span.InputsErrorNameNeeded::before{content:"Name needed.";}
span.InputsErrorPhoneNeeded{font-size:14px;color:rgba(0, 0, 0, 1);}
span.InputsErrorPhoneNeeded::before{content:"Phone number needed.";}
div.InputLabel.Email::before{content:"Email";}
div.InputLabel.EmailInvalid::before{content:"Email - invalid format";}
div.InputLabel.AndOr{padding:0 0 0 20px;text-align:left;color:red;}
/*div.InputLabel.AndOr::before{content:"And / Or";}*/
div.InputLabel.Phone::before{content:"Phone";}
textarea.Instructions{width:256px;height:100px;margin:0;
    border:0;padding:0;
    line-height:32px;font-size:16px;white-space:pre;}
div.InputLabel.Instructions{vertical-align:top;}
/*div.InputLabel.Instructions::before{content:"Instructions";}*/
div.InputContainer.InputsClearText{margin:10px 0 0 0;}
button.InputsClearText{height:32px;margin:0 0 0 18px;
    border:3px solid rgba(147,188,169,1);border-radius:5px;
    font-size:16px;cursor:pointer;}
/*button.InputsClearText::before{content:"Clear text input boxes";}
div.InputLabel.FileGroup::before{content:"Select Files";}*/
div.QueueControlsContainer{}
div.QueueControlsWrapper{}
div.FileGroupContainer{display:inline-block;}
div.FileGroupWrapper{}
div.InputFileContainer{display:inline-block;}
div.InputFileWrapper{
    /*
    width:256px;margin:0 18px 0 18px;
    border:3px solid rgba(147,188,169,1);padding:2px;
    */
}
div.InputLabel.FileGroupLabel{width:110px;text-align:center;
    margin:0 0 0 12px;padding:0px;}
input.InputFile1{width:256px;height:32px;display:none;
    margin:0;padding:0;line-height:28px;
    font-size:16px;vertical-align:middle;cursor:pointer;}
button.BrowseForFiles{width:110px;height:32px;margin:0 0 0 18px;
    border:3px solid rgba(0,103,56,0.4);border-radius:5px;
    padding:0px;font-size:16px;cursor:pointer;}
div.ClearButtonContainer{display:inline-block;}
div.ClearButtonWrapper{}
button.ClearFiles{width:110px;height:32px;margin:0 0 0 2px;padding:0;
    border:3px solid rgba(0,103,56,0.4);border-radius:5px;
    font-size:16px;cursor:pointer;white-space:nowrap;}
button.ClearFiles.Clear::before{content:"Clear Queue";}
div.FileQueueGroupHeaderContainer{}
div.FileQueueGroupHeaderWrapper{}
div.FileQueueGroupHeaderLabelContainer{}
div.FileQueueGroupHeaderLabelWrapper{height:20px;position:relative;}
div.FileQueueLabel{position:absolute;left:30px;top:0px;font-size:16px;line-height:16px;}
/*div.FileQueueLabel::before{content:"File Queue";}*/
div.FileQueueLabelStrut{height:16px;display:inline-block;}
div.FileQueueLabelFileCount{position:absolute;right:20px;top:0px;
    font-size:12px;line-height:12px;}
div.FileQueueLabelFileCount.Single::after{content:"\0000a0file in queue";}
div.FileQueueLabelFileCount.Multi::after{content:"\0000a0files in queue";}
div.FileQueueLabelFileCountStrut{height:16px;display:inline-block;}
div.FileQueueGroupHeaderUploadDetailsContainer{}
div.FileQueueGroupHeaderUploadDetailsWrapper{}
div.FileQueueGroupHeaderUploadDetailsWrapper.Closed{height:0px;overflow:hidden;}
div.FileQueueGroupHeaderUploadDetailsWrapper.Open{height:42px;}
div.FileQueueGroupHeaderUploadDetailsFilesUploadedContainer{}
/*overflow hidden needed for ie message box fixed layer issue. 
hidden seems to solve issue*/
div.FileQueueGroupHeaderUploadDetailsFilesUploadedWrapper{height:14px;position:relative;overflow:hidden;}
div.FileQueueGroupHeaderUploadDetailsFilesUploaded{position:absolute;right:20px;top:0px;
    font-size:12px;line-height:12px;}
div.FileQueueGroupHeaderUploadDetailsFilesUploaded.Single::after{content:"\0000a0file\0000a0uploaded";}
div.FileQueueGroupHeaderUploadDetailsFilesUploaded.Multi::after{content:"\0000a0files\0000a0uploaded";}
div.FileQueueGroupHeaderUploadDetailsFilesUploadedStrut{height:12px;display:inline-block;}
div.FileQueueGroupHeaderUploadDetailsBytesUploadedContainer{}
div.FileQueueGroupHeaderUploadDetailsBytesUploadedWrapper {height:14px;position:relative;
    overflow:hidden;}
div.FileQueueGroupHeaderUploadDetailsBytesUploaded{position:absolute;right:20px;top:0px;
    font-size:12px;line-height:12px;}
div.FileQueueGroupHeaderUploadDetailsBytesUploadedStrut{height:12px;display:inline-block;}
div.FileQueueGroupHeaderUploadDetailsTimeUploadedContainer{}
div.FileQueueGroupHeaderUploadDetailsTimeUploadedWrapper{height:14px;position:relative;
    overflow:hidden;}
div.FileQueueGroupHeaderUploadDetailsTimeUploaded{position:absolute;right:20px;top:0px;
    font-size:12px;line-height:12px;}
div.FileQueueGroupHeaderUploadDetailsTimeUploaded::after{content:" remaining";}
div.FileQueueGroupHeaderUploadDetailsTimeUploadedStrut{height:12px;display:inline-block;}
div.FileQueueContainer{width:258px;margin:0 18px 10px 18px;
    border:3px solid rgba(147,188,169,1);overflow:hidden;}
div.FileQueueWrapper{}
div.FileQueueEmpty{padding:10px 0 10px 0 ;text-align:center;color:red;}
div.FileQueueEmptyLoad{padding:10px 0 10px 0 ;text-align:center;color:red;}
div.FileQueueEmpty::before{content:"File Queue Empty";}
div.FileQueueLineItemContainer.Start{height:0px;opacity:0;}
div.FileQueueLineItemContainer {position: relative;opacity:1;overflow:hidden;}
div.FileQueueLineItemContainer.Remove{ height:0px;opacity:0;}
div.FileQueueLineItemContainer.BGColor0{background-color:#cccccc;}
div.FileQueueLineItemContainer.BGColor1{background-color:#bbbbbb;}
div.FileQueueLineItemWrapper{position:relative;padding:4px 4px 4px 4px;}
div.FileQueueLineItemName{margin:0 30px 0 0;white-space:pre-wrap;word-break:break-all;}
div.FileQueueLineItemDetails{margin:0 30px 0 0;font-size:14px;line-height:14px;
    white-space:pre-wrap;word-break:break-all;}
div.FileQueueLineItemProgressContainer{height:0px;overflow:hidden;}
div.FileQueueLineItemProgressContainer.Show{height:auto;}
div.FileQueueLineItemProgressWrapper{white-space:pre;}
div.FileQueueLineItemProgressTextErrorWrapper{height:0px;font-size:14px;
    text-align:left;color:red;}
div.FileQueueLineItemProgressTextErrorWrapper.SendError{height:auto;}
div.SendError::before{content:"Error Sending File ";}
div.FileQueueLineItemProgressTextErrorWrapper.SendStop{height:auto;}
div.SendStop::before{content:"Error Sending File, Uploading Stopped.";}
span.FileQueueLineItemProgressTextWrapper{display:inline-block;padding:0px 0px 2px 0px;
    font-size:20px;text-align:left;}
span.Sending::before{content:"Sending ";}
span.Stopped::before{content:"Stopped ";}
span.Sent::before{content:"File Sent ";}
div.FileQueueLineItemProgressTextWrapper{height:22px;
    font-size:20px;line-height:20px;text-align:left;}
div.Sending::before{content:"Sending ";}
div.Stopped::before{content:"Stopped ";}
div.Sent::before{content:"File Sent ";}
div.FileQueueLineItemProgressTimeContainer{height:18px;
    font-size:14px;line-height:14px;text-align:left;}
div.FileQueueLineItemProgressElapsedWrapper{width:120px;display:inline-block;
    vertical-align:top;}
div.FileQueueLineItemProgressElapsedWrapper::before{content:"\0000a0";}
div.FileQueueLineItemProgressETAWrapper{width:100px;display:inline-block;
    vertical-align:top;}
div.FileQueueLineItemProgressETAWrapper::before{content:"remaining:\0000a0";}
div.FileQueueLineItemProgressBarContainer{}
div.FileQueueLineItemProgressBarWrapper{line-height:2px;white-space:nowrap;
    background-color:red;}
div.FileQueueLineItemProgressBar{height:2px;width:0px;display:inline-block;
    background-color:rgba(0,103,56,1);vertical-align:top;}
div.FileQueueLineItemProgressBarRemaining{height:2px;display:inline-block;
    background-color:red;vertical-align:top;}
div.FileQueueLineItemCancelWrapper{width:50px;position:absolute;
    top:0;bottom:0px;right:0px;}
img.FileQueueLineItemCancel{width:20px;height:20px;position:absolute;
    top:25%;right:10px;margin:auto 0 auto 0;}
/*          Inputs                        End
*********************************************/

/*          Send Files                  Start
*********************************************/
div.UploadFilesContainer{margin:10px 0 0px 0;text-align:left;}
div.UploadFilesWrapper{}
div.SendButtonContainer{display:inline-block;}
div.SendButtonWrapper{}
div.StopButtonContainer{display:inline-block;}
div.StopButtonWrapper{}
div.FileQueueMessageContainer{margin:5px 18px 0 18px;overflow:hidden;}
div.FileQueueMessageWrapper{font-size:12px;color:red;}
div.FileQueueMessageWrapper.WarningStopping::before{content:
    "Limitations in this internet browser only allow the file queue to stop "
    "after a file upload has finished.";}
button.SendFiles{width:110px;height:32px;margin:0 0 0 18px;
    border:3px solid rgba(0,103,56,0.4);border-radius:5px;padding:0px;
    font-size:16px;cursor:pointer;}
button.SendFiles::before{content:"Send Files";}
button.SendFiles.Sending{color:rgb(0,255,0);}
button.SendFiles.Sending::before{content:"Sending Files";}
button.StopFiles{width:70px;height:32px;margin:0 0 0 2px;padding:0px;
    border:3px solid rgba(0,103,56,0.4);border-radius:5px;
    padding:0px;font-size:16px;cursor:pointer;}
button.StopFiles.Stop::before{content:"Stop";}
button.StopFiles.Stopping{color:red;}
button.StopFiles.Stopping::before{content:"Stopping";}
button.StopFiles.Stopped{color:red;}
button.StopFiles.Stopped::before{content:"Stopped";}
/*          Send Files                    End
*********************************************/

/*      Message                       Start
*******************************************/
div.MessageParent.Fixed {position:fixed;left:0px;right:0px;top:0px;bottom:0px;}
div.MessageParent.Absolute {position:absolute;left:0px;right:0px;top:0px;bottom:0px;}
div.MessageContainer {width:280px;height:0px;
    position:absolute;border:1px solid rgba(0,0,0,1);
    border-radius:15px;text-align:center;
    background-color:#cccccc;overflow:hidden;}
div.MessageContainer.Absolute {
    left:0px;right:0px;margin:0 auto 0 auto;
}
div.MessageContainer.Fixed {
    left:0px;right:0px;top:0px;bottom:0px;margin:auto;
}
div.MessageContainer.OverflowShow {overflow:visible;}
div.MessageContainer.Status {border:1px solid rgb(0,103,56);}
div.MessageContainer.Error {border:1px solid rgb(255,0,0);}
div.MessageLabel {position: absolute; top: -11px; left: 15px; border-radius:5px;
    padding: 1px 8px 3px 8px;background-color: rgba(177,177,177,1.0);line-height: 18px;
    font-size: 12px; text-align: center; }
div.MessageLabel.Status {color:rgba(0, 0, 0, 1);}
div.MessageLabel.Status::before { content:"Status"; }
div.MessageLabel.Error {color:rgba(255, 0, 0, 1);}
div.MessageLabel.Error::before { content:"Error"; }
div.MessageWrapper {padding:20px 20px 10px 20px;white-space:pre;}
span.UploadComplete{font-size:14px;color:rgba(0, 0, 0, 1);}
/*span.UploadComplete::before{content:"File Upload Complete";}*/
span.UploadComplete::before{content:"File and User Info Transfer\00000aCompleted Successfully";}
span.InputsErrorPhoneInvalid{font-size:14px;color:rgba(0, 0, 0, 1);}
span.InputsErrorPhoneInvalid::before{content:"Phone number invalid.";}
span.InputsErrorEmailInvalid{font-size:14px;color:rgba(0, 0, 0, 1);}
span.InputsErrorEmailInvalid::before{content:"Email invalid.";}
span.InputsErrorEmaiPhonelInvalid{font-size:14px;color:rgba(0, 0, 0, 1);}
span.InputsErrorEmaiPhonelInvalid::before{content:"Valid Phone and/or Email needed.";}
span.InputsErrorInitSessionError{font-size:14px;color:rgba(0, 0, 0, 1);}
span.InputsErrorInitSessionError::before{content:"Upload Error";}
div.MessageOkButton{margin:5px 0 0 0;border-radius:5px;
    border:3px solid rgba(147,188,169,1);padding: 1px 8px 5px 8px;
    background-color: rgba(240,240,240,1.0);
    line-height: 18px;
    font-size: 16px;text-align: center;cursor:pointer;}
div.MessageOkButton::before{content:"Ok";}
div.MessageParent:active div.MessageOkButton{background-color:#bbbbbb;}
div.MessageWrapper:active div.MessageOkButton{background-color:#bbbbbb;}
div.MessageOkButton:hover{background-color:#dddddd;}
div.MessageOkButton:active{background-color:#bbbbbb;}
/*      Message                         End
*******************************************/

/*                  Misc                Start
*********************************************/
button:hover{background-color:#dddddd;}
button:active{background-color:#bbbbbb;}
div.DisplayNone{display:none;}
input.DisplayNone{display:none;}

*:focus, *:active {
    outline: none !important;
    border: none;
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
    -webkit-tap-highlight-color: transparent;
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0) !important;
    -webkit-focus-ring-color: rgba(255, 255, 255, 0) !important;
    -o-transform: rotate(0);
}
*::-moz-focus-inner {
    border: none;
}
/*                  Misc                  End
*********************************************/

/*    Page Block                            Start
*************************************************/
div.PageBlock{left:0px;top:0px;width:100%;height:100%;position:fixed;
    background-color:rgba(0,0,0,0.0);}
/*    Page Block                              End
*************************************************/