﻿/* GENERAL
----------------------------------------------------------*/
*
{
    font-family: "Verdana","Arial","Helvetica";
}

body   
{
    background: #FFFFFF;
    margin: 0px;
}

/* LINK
----------------------------------------------------------*/

a:link, a:visited
{
     text-decoration:none;
}

a:hover
{
    color: #00ADEF;
    text-decoration:underline;
}

/* ALIGNMENT
----------------------------------------------------------*/
.table-alignment
{
  display:table;
}


.center-vertical-alignment
{
  display:table-cell;
  vertical-align:middle;
}

.center-side-alignment
{
  vertical-align:middle;
}

.bottom-vertical-alignment
{
  display:table-cell;
  vertical-align:bottom;
}

.center-horizontal-alignment
{
    text-align:center;
}

.left-horizontal-alignment
{
    text-align:left;
}

.right-horizontal-alignment
{
    text-align:right;
}


/* MARGIN
----------------------------------------------------------*/

.small-margin-top
{
   margin-top:6px;
}

.small-margin-bottom
{
   margin-bottom:6px;
}

.small-margin-left
{
   margin-left:6px;
}

.small-margin-right
{
   margin-right:6px;
}

.medium-margin-top
{
   margin-top:12px;
}

.medium-margin-bottom
{
   margin-bottom:12px;
}

.medium-margin-left
{
   margin-left:12px;
}

.medium-margin-right
{
   margin-right:12px;
}

.big-margin-top
{
   margin-top:20px;
}

.big-margin-bottom
{
   margin-bottom:20px;
}

.big-margin-left
{
   margin-left:20px;
}

.big-margin-right
{
   margin-right:20px;
}



/* PADDING
----------------------------------------------------------*/
.small-padding-top
{
   padding-top:6px;
}

.small-padding-bottom
{
   padding-bottom:6px;
}

.small-padding-left
{
   padding-left:6px;
}

.small-padding-right
{
   padding-right:6px;
}

.medium-padding-top
{
   padding-top:12px;
}

.medium-padding-bottom
{
   padding-bottom:12px;
}

.medium-padding-left
{
   padding-left:12px;
}

.medium-padding-right
{
   padding-right:12px;
}

.big-padding-top
{
   padding-top:20px;
}

.big-padding-bottom
{
   padding-bottom:20px;
}

.big-padding-left
{
   padding-left:20px;
}

.big-padding-right
{
   padding-right:20px;
}

/* TEXT
----------------------------------------------------------*/
.big-header-text
{
    font-size:12px;
    color:#FFFFFF;
    font-weight:bold;
}

.normal-header-text
{
    font-size:12px;
    color:#FFFFFF;
    font-weight:normal;
}

.small-header-text
{
    font-size:10px;
    color:#FFFFFF;
    font-weight:bold;
}

.big-main-text
{
    font-size:12px;
    color:#818284;
    font-weight:Bold;
}

.normal-main-text
{
    font-size:12px;
    color:#818284;
    font-weight:normal;
}


.big-warning-text
{
    font-size:12px;
    color:#00ADEF;
    font-weight:Bold;
}

.normal-warning-text
{
    font-size:12px;
    color:#00ADEF;
    font-weight:normal;
}

.small-warning-text
{
    font-size:11px;
    color:#00ADEF;
    font-weight:normal;
}


.normal-footer-text
{
    font-size:11px;
    color:#A99CAD;
    font-weight:normal;
}


/* IMAGES
----------------------------------------------------------*/

.company-image
{
    width:93px ;
    Height:65px;
}

.product-image
{
    width:257px ;
    Height:45px;
}

.loading-image
{
    width:45px ;
    Height:45px;
}

.small-image-icon
{
    width:20px ;
    Height:20px;
}

.medium-image-icon
{
    width:25px ;
    Height:25px;
}

.large-image-icon
{
    width:30px ;
    Height:30px;
}

.extra-large-image-icon
{
    width:35px ;
    Height:35px;
}

.super-extra-large-image-icon
{
    width:40px ;
    Height:40px;
}



/* LINK BUTTON
----------------------------------------------------------*/
a.arrow-button
{
    background:url("../Graphics/NavArrowDark.png") no-repeat 0 0;
    display:block;
    width:13px;  
    height: 13px;
}

a.arrow-button:hover
{
   background:url("../Graphics/NavArrowBlue.png") no-repeat 0 0; 
   display:block;
   width:13px;  
   height: 13px; 
}


.arrow-button-label
{
    margin-left:20px;
}

.ok-button
{
    background:url("../Graphics/OKButtonDark.png");
    display:inline-block;
    width:59px;  
    height: 25px;
}

.ok-button:hover
{
    background:url("../Graphics/OKButtonLight.png");
    display:inline-block;
    width:59px;  
    height: 25px;
}

.yes-button
{
    background:url("../Graphics/YesButtonDark.png");
    display:inline-block;
    width:61px;  
    height: 25px;
}

.yes-button:hover
{
    background:url("../Graphics/YesButtonLight.png");
    display:inline-block;
    width:61px;  
    height: 25px;
}

.no-button
{
    background:url("../Graphics/NoButtonDark.png");
    display:inline-block;
    width:59px;  
    height: 25px;
}

.no-button:hover
{
    background:url("../Graphics/NoButtonLight.png");
    display:inline-block;
    width:59px;  
    height: 25px;
}

.change-button
{
    background:url("../Graphics/ChangeButtonDark.png");
    display:block;
    width:88px;  
    height: 25px;
}

.change-button:hover
{
    background:url("../Graphics/ChangeButtonLight.png");
    display:block;
    width:88px;  
    height: 25px;
}


/* TEXT BOX
----------------------------------------------------------*/
.main-textbox
{
    width:80%;
    height:17px;
}

.multiline-textbox
{
    width:100%;
    height:50px;
    resize: none;
}


/* GRID VIEW
----------------------------------------------------------*/

.main-gridview
{
    width:100%;
}

.main-gridview-header, .main-gridview-pager
{
  background-color:#818284;
}

.main-gridview-alternatingrow
{
  background-color:#D1D2D4;
}

.main-gridview-row
{
  background-color:#E7E7E8;
}



/* GRID VIEW COLUMNS
----------------------------------------------------------*/
.big-gridviewcols-item
{
    width:auto;
    height:30px;
}

.small-gridviewcols-item
{
    width:auto;
    height:20px;
}


/* DIV - GENERAL
----------------------------------------------------------*/
div.wordwrap
{
    overflow-y:auto;
    overflow-x:auto; 
    word-break:hyphenate;
    word-wrap: break-word;
}

div.clear-all-floats
{
    clear:both;
}

div.floats-equal-height
{
    padding-bottom:100%;
    margin-bottom:-100%;
}

div.hide-overflow
{
     overflow:hidden;
}


/* DIV - LAYOUT
----------------------------------------------------------*/

div.content-div-layout
{
    width:1000px;
    height:auto;
}


div.logo-div-layout
{
    width:auto;
    height:90px; 
}

div.logo-primary-div-layout
{
    width:15%;
    height:100%; 
    float:left;
}

div.logo-secondary-div-layout
{
    width:85%;
    height:100%; 
    float:right;
}

div.menu-div-layout
{
    width:auto; 
    height:40px; 
}

div.menu-primary-div-layout
{
    width:auto;
    height:100%; 
    float:left;
}

div.menu-border-div-layout
{
    width:1px; 
    height:100%; 
    float:Right;   
}

div.menu-secondary-div-layout
{
    width:auto;
    height:100%; 
    float:right;
}

div.menu-item-div-layout
{
    width:auto;
    height:auto; 
    float:left;
}

div.main-div-layout, div.footer-div-layout, div.extension-div-layout
{
    width:auto; 
    height:auto;
}



/* DIV - COLOUR
----------------------------------------------------------*/
div.logo-div-colour
{
 background-color: #00ADEF;
}

div.menu-div-colour
{
 background-color:#404041;
}    

div.main-div-colour
{
  background-color:#FFFFFF;
}


div.dark-div-colour
{
  background-color:#818284;
}


div.light-div-colour
{
  background-color:#F2F2F2;
}


/* DIV - BORDER
----------------------------------------------------------*/
div.all-light-div-border
{
    border-width: 1px;
    border-color:#EDEEF1;
    border-style:solid;
}

div.vertical-dark-div-border
{
    border-left-width: 1px;
    border-left-color:#322F31;
    border-left-style:dashed;
}

div.vertical-light-div-border
{
    border-left-width: 1px;
    border-left-style:dashed;
    border-left-color:#D1D2D4;
}

div.horizontal-light-div-border
{
    border-bottom-width: 1px;
    border-bottom-style:dashed;
    border-bottom-color:#D1D2D4;
}

div.horizontal-footer-div-border
{
    border-top-width: 1px;
    border-top-style:solid;
    border-top-color:#949599;
}



/* MODAL POPUP
----------------------------------------------------------*/
.main-popup-background
{
    background-color  : #666699;
    filter: alpha(opacity=50);
    opacity: 0.7;
    z-index:999999!important;
} 

div.main-popup-margin
{
    margin:auto;
}

div.main-popup-header
{
    width:100%; 
    height:30px; 
}

div.main-left-popup-header
{
    width:auto;
    height:100%;
    float:left;
}

div.main-right-popup-header
{
    width:auto;
    height:100%;
    float:right;
}



/* MODAL POPUP - WAITING
----------------------------------------------------------*/
div.waiting-popup-outer
{
    width:330px; 
    height:auto; 
}

div.waiting-popup-inner 
{
    width:310px; 
    height:auto; 
}

div.waiting-popup-main
{
    width:100%; 
    height:auto; 
}


/* MODAL POPUP - CONTACT
----------------------------------------------------------*/
div.contact-popup-outer
{
    width:470px; 
    height:auto; 
}

div.contact-popup-inner 
{
    width:450px; 
    height:auto; 
}

div.contact-popup-main
{
    width:100%; 
    height:auto; 
}


div.contact-label-popup-main
{
    width:30%; 
    height:auto;
    float:left;
}

div.contact-value-popup-main
{
    width:70%; 
    height:auto;
    float:right;
}
