﻿
  @import 'https://fonts.googleapis.com/css?family=Open+Sans:600,400,300|Roboto+Condensed:300" rel="stylesheet';


/*Format all the captions of the aspx*/
/*.dxflFormLayout_Moderno {

  font-family:"Open Sans", "Roboto Condensed", Arial, "Sans Serif", Verdana; 
   font-size:13px;
}*/

 .GridViewAdaptiveHeaderPanel { display: none; }
 
.FormLayoutTwoColumns 
{
     max-width: 900px;
   
  
}

.FormLayoutOneColumn 
{
     max-width: 600px;
    
  
}

.FormLayoutPopup
{
     max-width: 700px;
    
  
}
 .FormLayoutMsgScrn 
{
     max-width: 700px;
}
 
 
 .buttonsContainer
        {
            max-width: 100%;
            margin: 0 0 0 auto;
            text-align: right;
            padding-top: 12px;
        }
        .submitButton,
        .cancelButton,
        .ResendButton
        {
            margin-bottom: 12px;
        }
        .cancelButton,
        .submitButton
        {
            margin-left: 8px;
        }
        
        .groupCaption
        {
            margin-bottom: 4px;
        }
        .clearPaddings
        {
            padding-top: 0;
            padding-bottom: 0;
        }
  

@media screen and (max-width: 800px) {
    
  .captionWrap {
            width: 120px;
            max-width: 120px;
            white-space:pre-wrap;
            word-wrap: break-word;
        }

  .captionWrapTwoColumns {
            width: 240px;
            max-width: 240px;
            white-space:pre-wrap;
            word-wrap: break-word;
        }
}

@media screen and (max-width: 600px) {
   .OneColumnCellStyleConfirmation 
   {
       padding-left:0px;
       padding-right:0px;
   }

.OneColumnParentContainerConfirmation
{
    padding-left:5px;
    padding-right:5px;

}
  }      
        
@media screen and (max-width: 400px) {
   .OneColumnCellStyle 
   {
       padding-left:0px;
       padding-right:0px;
   }

.OneColumnParentContainer
{
    padding-left:5px;
    padding-right:5px;

}
  }      
        
 /*Stella - Handle the Layout group paddings */
 .dxflGroupBox_Moderno > div.dxflGroup_Moderno:first-child, .dxflGroupBox_Moderno > table.dxflGroup_Moderno:first-child {  
    padding-top: 0px !important;
     padding-bottom: 10px !important;
}
.Mobile_gridtable 
{
width:100%;
}
.smallButton {}

/*Stella - Handle the Layout group paddings */
.dxflGroupBox_Moderno {
    padding: 0px !important;
    margin: 10px 0 !important;        
}

/*Stella Internal Border of Textbox */
.dxeEditArea.dxeEditAreaSys.dxh0
/*.dxeTextBoxSys.dxeTextBox.input-2.dxeTextBoxDefaultWidthSys.dxeNullText.dxh0*/
{
    border: 1px solid red !important;
    
}
/*Stella*/
/*All Input boxes*/
input.dxeEditArea_Moderno[type="text"], .dxeMemoSys textarea  {
       color: #333333 ; /*!important;*/
       font-size:13px;
}

  /*Important note: For some reason, when ASPxCheckBoxList is required is displays 2 *s. One next to the caption and 
    the second one at the end of the caption line. Thats why even if the ASPxCheckBoxList is required the asterisk 
    is always disabled because the one next to the caption is visible by default. The color of the asterisk shown 
    by default has green color. To change its color the following style must be copied in customStyles.css.*/
 .dxeRequiredMark_Moderno()
{
    color:Red;
}

/*Colour for disabled boxes*/
.dxeEditArea_Moderno.dxeDisabled_Moderno {
    color: #9f9f9f !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;
}

.ReadOnlyErrorField
{
    padding-bottom:150px !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-top:20px;
     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, .warning2, .error, .validation {

border: 1px solid;
margin:  10px 0px;
padding:15px 10px 15px 50px;
background-repeat: no-repeat;
background-position: 10px center;
 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;
}

.errormsg2 
{
color: Red;
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');
}

/*

.info A:link, .success A:link, .warning A:link, .warning2 A:link, .error A:link, .validation A:link	 {
	color:#0066cc;	
	text-decoration:none;
}
	
.info A:visited, A:active , .success A:visited, A:active , .warning A:visited, A:active , .warning2 A:visited, A:active , .error A:visited, A:active , .validation A:visited, A:active  
{
	color:#0066cc;	
    text-decoration:none;
}
	
.info A:hover, .success A:hover, .warning A:hover, .warning2 A:hover, .error A:hover, .validation  A:hover  {
	color:#0066cc;	
	text-decoration:underline;
}

*/
.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;
}
.infoPage {
border: 0px solid;
padding:20px 10px 20px 0px;
background-repeat: no-repeat;
background-position: 10px center;
 box-sizing: border-box;
 border-radius: 4px;
 color: #498af2;
background-image:url('Images/info_icon.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');
}

.warning2 {
color: #555555;
background-color: #F8F8F8;
background-image:url('Images/warning-32.png');
}

.warningmsg 
{
font: normal 14px/normal "Segoe UI", "Helvetica Neue", "Droid Sans", Arial, Tahoma, Geneva, 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;
    }


/*This is how to remove the page scrollbars from browser and use only the scrollbars from Devexpress */
/*
body {
    overflow:hidden;
}
*/
        
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 18px/normal  Arial, Helvetica, sans-serif;
      color:Black;*/
    }


.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;
    
}
*/

.displayfield
{
 font-weight:bold;
}

.inputfield
{
   
   /* width: 457px; 350px;   */
    padding: 0px ;
    /*max-width:100% !important; Stella*/
    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; Stella*/
    /*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;
  
}

  
eHprlkCss 
{
    }
.b  height
    g:0px !important;
    
    }
.btn
.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.displaySameRow 
{
    display: block;
    
}

div.displaySameRowColumnLeft
{
display:inline-block;
    float: left;
}
div.displaySameRowColumnRight
{
display:inline-block;
    float: right;
}

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;
}



/*The following section is for the calendar*/
/*****************START*********************/

 .cell .buttonMonth
        {
            /*border-width: 1px;*/
            width: 50px;
            text-align: center;
            text-decoration:none;
            color:inherit;
        }
        
           .cell .buttonYear
        {
            /*border-width: 1px;*/
            width: 50px;
            text-align: center;
            text-decoration:none;
            color:inherit;
        }
        .tab
        {
            width: 100%;
            /*border-color: #600;
            border-width: 0 0 1px 1px;
            border-style: solid;*/
        }
        .cell
        {
            /*border-color: #600;
            border-width: 1px 1px 0 0;
            border-style: solid;*/
            margin: 0;
            padding: 4px;
            /*background-color: #eee6a3;*/
        }
        
/******************END**********************/


.noIndent
        {
            background-image: none;
        }
        

/********Responsive Menu**************/
.dxm-side-menu-mode .dxm-side-menu-button 
{
    display:inline-block;
      
    
    }
    
