﻿
  @import 'https://fonts.googleapis.com/css?family=Open+Sans:600,400,300|Roboto+Condensed:300" rel="stylesheet';


/*This is how to remove the page scrollbars from browser and use only the scrollbars from Devexpress */
body {
    overflow:hidden;
}

/*Format all the captions of the aspx*/
.dxflFormLayout_Moderno {

  font-family:"Open Sans", "Roboto Condensed", Arial, "Sans Serif", Verdana; 
   font-size:13px;
}
 
 /*Stella - Handle the Layout group paddings */
 .dxflGroupBox_Moderno > div.dxflGroup_Moderno:first-child, .dxflGroupBox_Moderno > table.dxflGroup_Moderno:first-child {  
    padding-top: 10px !important;
     padding-bottom: 10px !important;
}


/*Stella - Handle the Layout group paddings */
.dxflGroupBox_Moderno {
    padding: 0px !important;
    margin: 10px 0 !important;        
}


/*Stella*/
/*All Input boxes*/
input.dxeEditArea_Moderno[type="text"], .dxeMemoSys textarea  {
       color: #333333 ; /*!important;*/
       font-size:13px;
}



/*Colour for disabled boxes*/
.dxeEditArea_Moderno.dxeDisabled_Moderno {
    color: #9f9f9f !important; /* ;*/
}

.LayoutItemNoPadding
{
    padding:0px !important;
    
    
    }
.disabledItem 
{
color:Red !important; /*#9f9f9f !important;*/
}

/*For Layout Items that are read only and there in no error 
msg at the bottom. We add a padding to look like the other fields*/
.ReadOnlyField
{
    padding-bottom:25px !important;
}


/*Layout Group caption*/
.dxflGroupBoxCaption_Moderno {
    
    color: #045cad;
    font-weight:400;
    
}

/*Used in Javascript to change the caption of the textbox*/
.NomosOrCountryCaption 
{
}
/*.dxflCheckBoxListItemSys .dxflVATSys.dxflCaptionCell_Moderno {
    padding-top: 0px;
}*/

/*.dxflGroupBox_Moderno > .dxflGroup_Moderno tr:last-child > .dxflGroupCell_Moderno > .dxflItem_Moderno
 {
    padding-top: 5px;
}*/

/* Footer */
.footerPane 
{
    background-color: #EDEDED;
  /* height:10px;*/
   padding-top:10px !important;
  /* position:fixed;*/
}
.footerMenu {
    float: right;
    padding-top: 7px;
}


/*Helptext boxes styling*******************************************/
.dxeHelpText_Moderno, .dxeTBValueToolTip_Moderno 
{
    font-family:"Open Sans", "Roboto Condensed", Arial, "Sans Serif", Verdana; 
   
    line-height:16px;
    font-size: 11px ;
   /* background-color: #f0f0f0 !important;*/
   background-color: #f0f0f0 !important;
}

/*When using Helptext, use these funtions to avoid blank space at the end of the page*/
/*div.dxeHelpText_Moderno {               
    display: none;
}*/
.HelpText 
{
 color:Blue !important;
}


.twoLineCaption 
{
 vertical-align:top !important;
 padding-top:0px !important;
}

.captionStyle
{
    /*border:1px blue solid;*/
width:50px !important;
 white-space:normal;
  word-wrap:break-word;  

}

.copyright
{
    font-family:"Open Sans", "Roboto Condensed", Arial, "Sans Serif", Verdana !important;    
    line-height:14px !important;
    font-size: 9px !important;  
     padding-left: 10px;   
}



.dxeTextBox_DevEx .dxeEditArea_DevEx {
  font-size:12px !important;
  padding:5px 5px 5px 5px !important;
}

.LayoutGrpCellStyles
{
    padding:5px;
}


A:link	 {
	color:#0066cc;	
	text-decoration:none;
}
	
A:visited, A:active {
	color:#0066cc;	
    text-decoration:none;
}
	
A:hover  {
	color:#0066cc;	
	text-decoration:underline;
}

/*This is where I will customize my checkbox style*/
.myCheckBoxStyle 
{
   
}
/*************************************************/
.Moec_Logo
{
   /* width:50%;
    height:auto;*/
 }
 
 .moec_img
 {
     float:left;
     width:100%;
     height:auto;
     padding-left:0 !important;
 }
 .test 
 {
     width:0 !important;
     padding:0 !important;
 }
 
 .moec_title
 {
     font-size:14px;
      font-weight:400;
     color: #50381c; /*#777777;*/
     padding-bottom:10px;
     font-family:"Open Sans", "Roboto Condensed", Arial, "Sans Serif", Verdana; 
     line-height:20px;
    float:left; 
    clear: left;
} 

 .status_img
 {
     float:left;
 }
 
 .status_msg
 {
    float:left;
    margin-top:15px;
    margin-left:15px;
   display:inline-block;
} 

.enableWrapping 
{    
    word-break: break-all;
}

/* Change the white to any color ;) */

select:-webkit-autofill:default,
textarea:-webkit-autofill:default,
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:enabled,
input:-webkit-autofill:active {
    transition: background-color 5000s ease-in-out 0s;
    -webkit-box-shadow: 0 0 0px 1000px #fff inset;   
}



.dxeTextBox_DevEx:disabled .dxeEditArea_DevEx:disabled {
  background-color:#f8f8f8;
}
/*
.dxeErrorCell_Moderno
{
    color:Red !important;


    }
*/

.mytextArea
{
    width: 457px;
    height: 28px;
    padding-left: 10px ;
    padding-right: 10px ;
    box-sizing: border-box;
    border: 1px solid  #CCCCCC; /*  #ee6123;*/
    border-radius: 4px;
    background-color:  #f8f8f8;
    font: normal 14px/normal Arial, Helvetica, sans-serif;
    color:#777777; 
    resize: none;
}

.myError
{
    width: 457px;
    height: 28px;
    padding-left: 10px ;
    padding-right: 10px ;
    box-sizing: border-box;
    border: 0px solid  #FDBFBF; /*  #ee6123;*/
    border-radius: 4px;
    color: #D8000C;
    background-color: #fdd1d1;
    background-image:url('Images/error-32.png');
background-repeat: no-repeat;
background-position: 10px center;

    font: normal 14px/normal Arial, Helvetica, sans-serif;
    resize: none;
}

.info, .success, .warning, .error, .validation {

border: 1px solid;
margin: 10px 0px;
padding:15px 10px 15px 50px;
background-repeat: no-repeat;
background-position: 10px center;
width: 800px;
 margin-left:10px;

 box-sizing: border-box;
    border-radius: 4px;
   
}

.warningGrid 
   {
    margin: 10px 0px;
    padding:15px 10px 15px 50px;

}

.error 
{
    
background-color: #fdd1d1;
color: #D8000C;
background-image: url('Images/error-32.png');
}

.errormsg 
{
font: normal 14px/normal Arial, Helvetica, sans-serif;
 padding:15px 10px 15px 50px;
}

.success {
color: #4F8A10;
background-color: #f1fddd;
background-image:url('Images/success-32.png');
}

.successmsg 
{
font: normal 14px/normal  "Segoe UI", "Helvetica Neue", "Droid Sans", Arial, Tahoma, Geneva, Sans-serif;
 padding:15px 10px 15px 50px;
}

.successmsgConfirmation
{
font: normal 14px/normal  "Segoe UI", "Helvetica Neue", "Droid Sans", Arial, Tahoma, Geneva, Sans-serif; 
padding-left:40px !important;
 /*padding:15px 10px 15px 50px;*/
}
.successConfirmation {
border: 1px solid;
padding:20px 10px 20px 0px;
background-repeat: no-repeat;
background-position: 10px center;
 box-sizing: border-box;
 border-radius: 4px;
 color: #4F8A10;
background-color: #f1fddd;
background-image:url('Images/success-32.png');
width: 800px;
}

.ApplicationDetailRecordGrp
{
    padding-bottom:10px !important;
}

.HyperLink
{
font: normal 12px/normal Arial, Helvetica, sans-serif; 

color: #498AF2; 

    }

.textLink 
{
font: normal 14px/normal Arial, Helvetica, sans-serif; 
color: #498AF2; 
}

.warning {
color: #9F6000;
background-color: #FEEFB3;
background-image:url('Images/warning-32.png');
}

.warningmsg 
{
font: normal 14px/normal Arial, Helvetica, sans-serif;
 padding:15px 10px 15px 50px;
}


.info {
color: #CCCCCC; /* #00529B;   border: 1px solid  #CCCCCC; */
background-color: #F3EEF0;  /* #BDE5F8*/
background-image:url('Images/info-32.png');
}

.infomsg 
{
font: normal 14px/normal Arial, Helvetica, sans-serif;
 padding:15px 10px 15px 50px;
}
/*.mytextArea:hover
{      
    border: 1px solid #ee6123 !important;    
}

.mytextArea:focus
{      
    border: 1px solid #ee6123 !important;    
}
*/

.dxeListBoxItem_DevEx 
{
     color:#777777;
     font: normal 16px/normal Arial, Helvetica, sans-serif;
     padding:5px;
    }
    
.dxeListBoxItem_DevEx:hover 
{
      background-color: #EEEEEE;
      padding:5px;
     color:#777777;
     font: bold 16px/bold Arial, Helvetica, sans-serif;
    }
        
body input.dxeEditArea_DevEx {
  color:#777777; 
 
}

.dxeTextBox input
{
	text-transform:uppercase;
}

.LayoutGroup
{
    
    padding-left:30px;
    
    }

/*.ErrorFrameStyle{
   font-size:x-small;
   color: #394CDD;
    }
    */
    .dxeErrorCell_DevEx {
  color: #dd4b39;

    }

.FrameTitle
{
     font: normal 14px/normal Arial, Helvetica, sans-serif;
    }


.AlignRight 
{
    width:100%;
    text-align: left; 
    display:inline-block;
    float: left;	 
}
/*
This is the class that setups the height of each row. space between the columns
.dxeValidStEditorTable.dxeRoot_DevEx
{
     background-color:red;
     margin-bottom:0px !important;
     padding-bottom:0px !important;
     height:5px;
    
}
*/

.inputfield
{
   
   /* width: 457px; 350px;   */
    padding: 0px ;
    max-width:100% !important;
    box-sizing: border-box;
    border: 1px solid #CCCCCC;
    border-radius: 4px;
    background-color: #FFFFFF;
    font: normal 14px/normal Arial, Helvetica, sans-serif;
    /*color:Aqua !important; /*#777777;  */
    resize: none;
    /*Padding right must not be set to a big value because the clear button is moved 50px in from the right side*/
    /*padding-right:50px;*/ 
}
.inputfield:hover
{      
    border: 1px solid #CCCCCC !important;    
}

.inputfield:focus
{      
    border: 1px solid #CCCCCC !important;    
}



.outputfield:enabled 
{
    width: 600px;   
    padding-left: 10px;
    box-sizing: border-box;
    /*border-radius: 2px;*/
    background-color: #FFFFFF;
    font: normal 16px/normal Arial, Helvetica, sans-serif;
    color:#777777; 
    resize: none;
    border: 0px none ;
}


.outputfield:disabled 
{
    width: 600px;   
    padding-left: 10px;
    box-sizing: border-box;
    /*border-radius: 2px;*/
    background-color: #FFFFFF;
    font: normal 36px/normal Arial, Helvetica, sans-serif;
    color:#777777; 
    resize: none;
    border: 0px none ;
}

.invisible
{
    font-size:1px;
    color:Transparent;
    height:1px;
    border:1px none  transparent;
    background:transparent;
}


.mybuttons {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 4px;
  font-family: Arial;
  color: #ffffff;
  font-size: 14px;
  background: #498AF2;
  padding: 8px 8px 8px 8px;
  text-decoration: none;
  border:none;
  width:300px;
  font-weight:bold;
  
}

.btn_converter:hover {
  background: #e35112;
  text-decoration: none;
}

.btn_copy {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 4px;
  font-family: Arial;
  color: #ffffff;
  font-size: 20px;
  background: #ee6123;
  padding: 16px 16px 16px 16px;
  text-decoration: none;
  border:none;
  width:147px;
  height:58px;
}

.btn_copy:hover {
  background: #e35112;
  text-decoration: none;
}

.convertpck
{
     display:block;
}

.actualurl
{
    display:inline-block; 
    float:left; 
    /*border:1px solid blue;*/
    margin-right:10px;
}

 .converterbtn
 {
     display:inline-block;
     float:left; 
     /*border:1px solid green;*/
 }
 

.copypack
{
    display:block;
    margin-left:12px;
    
}

.codedurl
{
    display:inline-block; 
    float:left; 
    /*border:1px solid blue;*/
    margin-right:10px;
}  
 .Copybtn
 {
     display:inline-block;
     float:left; 
    /* border:1px solid green;*/
 }
 
 
 .btn_reverse {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 4px;
  font-family: Arial;
  color: #ffffff;
  font-size: 20px;
  background: #ee6123;
  padding: 8px 8px 8px 8px;
  text-decoration: none;
  border:none;
}

.btn_reverse:hover {
  background: #e35112;
  text-decoration: none;
}

.btn_copy2 {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 4px;
  font-family: Arial;
  color: #ffffff;
  font-size: 20px;
  background: #ee6123;
  padding: 10px 10px 10px 10px;
  text-decoration: none;
  border:none;
  width:170px;
  height:45px;
}

.btn_copy2:hover {
  background: #e35112;
  text-decoration: none;
}

/********************** PRINT AREA ************************/



.PrintCaption 
{
    padding-top:10px;
   
}
/*****************************************************************/
/* 			DIV STYLES		 		  	           */ 
/****************************************************************/

div.table
{
    display: block;
	width: 100%;
   
}
 
 
div.th
{    
  display:block;
  width:auto;
  clear:both;
  font-weight:bold;
 
}
  

div.tr
{
  display:block;
  width:auto;
  clear:both;
  vertical-align:middle;
/*  border:  1px dotted #CCCCCC;  */
}


div.tdColumn1, div.tdColumn2, div.tdColumn3, div.tdColumn2RightAlign 
{
   
    /*padding: 10px;*/
    text-align: left; 
    display:inline-block;
    float: left;	 
    
}

div.tdColumn1
{
  width: 800px; 
}

div.tdColumn2
{
    width: 780px;	   
   
}

div.tdColumn2RightAlign
{
    width: 780px;	     
     text-align:right;
    
}




div.tdColumn3
{
   width: 20px;
}


/*****************************************************************/
/* 			CUT INFO STYLES       	     		  	             */ 
/*Create the styles for the section to be cut by applicannt      */ 
/*****************************************************************/
.cuInfoHeader 
{
    color: #045cad;
    font-weight:400;
 }

.Scissorsbox
{
    background-image: url('Images/border-scissor1.jpg');
   /* padding:20px;
    padding-top:50px;*/
    background-repeat: no-repeat;
    margin-top:50px;
    height:350px;
    }
   

.paymentTitle
{
    color: #045cad;
    font-weight: 400;
}   
.simpleBox   
{
   border-color:DimGray;
   border-style:dashed;
   border-width:2px;
   background-color: #f4f4f4;
  padding-bottom:20px !important;
}  
 /*Do not delete -- This is the cssClass of the layoutGroup to be displayed 
in the next page and is also used in CommonFunctions.js function AssignPageBreak */   
.nestedElement
{
     
   
    }
    

    
/*Make a label look like a textbox*/ 
.LabelLikeTextBox   
{  
    background-color: #fafafa;
    border: 1px Solid #d1d1d1;
    font: 14px 'Segoe UI','Helvetica Neue','Droid Sans',Arial,Tahoma,Geneva,Sans-serif;
    box-shadow: inset 0px 2px 3px 0px rgba(0, 0, 0, 0.05);
    border-collapse: separate !important;
    color: #2B2B2B;
    padding: 6px 2px 6px 7px !important;
    white-space: normal !important;
}
/***Creates a page break before element with id  "nestedElement"******/    
.break {
     page-break-before: always;
     page-break-inside: avoid;
}

.PostingDetailsCss
{
   /* padding-bottom:10px !important;*/
    /*margin-bottom:50px;*/
}
/**************************************************************/
/*This is how all the page can be printed with File-Print option*/
 @media print {
           .dxsplLCC {
                overflow: visible !important;
                height: auto !important;
            }
        }
/***************XTRAREPORT STYLES**************************/

/***************Styles for the ListBox ********************/

 .lbRow
        {
            width: 200px;
        }
        
    /* like SelectedItem style */
    .ui-draggable-dragging
    {
        background-color: #A0A0A0;
        color: White;
    }
        
    /* small glowing effect */
    .hover
    {
        -webkit-box-shadow: 0 0 15px #ff0000;
        -moz-box-shadow: 0 0 15px #ff0000;
        box-shadow: 0 0 15px #ff0000;
    }
    
    .container {
    /*width: 300px;*/
}
.left 
{
    
      
    /*max-width: 100%;
    white-space:nowrap;
    overflow:hidden;    
    -ms-text-overflow:ellipsis;*/
    float: left;
}
.right 
{
    /*text-decoration:underline;*/
    /*white-space:nowrap;
    overflow:hidden;
    -ms-text-overflow:ellipsis;*/
    text-align: left;
}