#main {
    background-image: url(../images/home_images_v2/homeScreenBackground.jpg);
    background-repeat: no-repeat;
    background-size: contain;
}

#navContainer{
    height: 640px;
    font-family: "Verdana", sans-serif;
    font-size: 12px;
    font-style: normal;
    font-weight: bold;
    margin: 0 auto;
    position: relative;
    width: 700px;
}

#navContainer .itemLeft {
/*    position:absolute;*/
}

#navContainer .itemRight {
/*    position:absolute;*/
}

#navContainer a.icon{
    width:160px;
    height:160px;
    position: absolute;
    top:0px;
    left:0px;
    cursor:pointer;
} 

/* CENTER IMAGE
// --------------------------------------*/
#navCenterImage{
    z-index: 3;
    position:absolute;
    top:200px;
    left:240px; 
    width:240px;
    height:240px;    
    background-size: 240px 240px;
    background-image: url("../images/home_images_v2/myClient-home.png");
}

/*
#navCenterBridge{
    //z-index: 3;
    position:absolute;
    top:135px;
    left:265px; 
    width:449px;
    height:429px;
    background-size: 449px 429px;
    background-image: url("../images/home_images_v2/myClient-home-bridges.png");    
}
*/

/* COLLECTIONS 
* Previously PRODUCTS
// --------------------------------------*/
#navCollections{
    position: absolute;
    top: 0px;
    right: 180px;
}
#navCollectionsAlt{
    position:relative;
    top:35px;
    left:640px;
}
#navCollectionsBridge
{
    position:absolute;
    top:100px;
    left:-165px; 
    width:231px;
    height:221px;
    background-size: 231px 221px;
    background-image: url("../images/home_images_v2/myClient-collections_bridge.png");
}
#navCollections a.icon{
    width:160px;
    height:160px;
    background-image: url("../images/home_images_v2/myClient-collections.png");    
    background-size: 160px 160px;
}  
/*
#navCollectionsAlt a.icon{
    //Greyscale
    width:160px;
    height:160px;
    background-image: url("../images/home_images_v2/myClient-collections.png");    
    background-size: 160px 160px;
}
*/

/* VALUE ADDS
* Previously FUTURE FEATURE
// --------------------------------------*/
#navValueAdds{
    position: absolute;
    top: 256px;
    right: 160px;
}
#navValueAddsAlt{
    position: relative;
    top:276px;
    left:680px;
}
#navValueAddsBridge
{
    position: absolute;
    top:13px;
    left:-129px; 
    width:162px;
    height:132px;
    background-size: 162px 132px;
    background-image: url("../images/home_images_v2/myClient-valueadds_bridge.png");
}
#navValueAdds a.icon{
    //Colour
    width:160px;
    height:160px;
    background-image: url("../images/home_images_v2/myClient-valueadds.png");    
    background-size: 160px 160px;
}
/*
#navValueAddsAlt a.icon{
    //Greyscale
    width:160px;
    height:160px;
    background-image: url("../images/home_images_v2/myClient-valueadds.png");    
    background-size: 160px 160px;
}
*/

/* BUSINESS INTELLIGENCE
// --------------------------------------*/
#navBusinessIntelligence{
    position: absolute;
    top: 438px;
    right: 275px;
}
#navBusinessIntelligenceAlt{
    position:relative;
    top:464px;
    left:554px;
}
#navBusinessIntelligenceBridge
{
    position:absolute;
    top:-93px;
    left:-90px; 
    width:145px;
    height:132px;
    background-size: 145px 132px;
    background-image: url("../images/home_images_v2/myClient-intelligence_bridge.png");
}
#navBusinessIntelligence a.icon{
    //Colour
    width:160px;
    height:160px;
    background-image: url("../images/home_images_v2/myClient-intelligence.png");    
    background-size: 160px 160px;
}
/*
#navBusinessIntelligenceAlt a.icon{        
    //Greyscale
    width:160px;
    height:160px;
    background-image: url("../images/home_images_v2/myClient-intelligence-grey.png");    
    background-size: 160px 160px;
}  
*/

/* PAYEMNTS
* Previously CASH DISPENSING
// --------------------------------------*/
#navPayments{
    position: absolute;
    bottom: 160px;
    left: 50px;
}
#navPaymentsAlt{
    position:relative;
    top:508px;
    left:180px;
}
#navPaymentsBridge
{
    position:absolute;
    top:-150px;
    left:98px; 
    width:211px;
    height:205px;
    background-size: 211px 205px;
    background-image: url("../images/home_images_v2/myClient-payments_bridge.png");
}
#navPayments a.icon{  
    //Colour
    width:160px;
    height:160px;
    background-image: url("../images/home_images_v2/myClient-payments.png");    
    background-size: 160px 160px;
}
/*
#navPaymentsAlt a.icon{  
    //Greyscale
    width:160px;
    height:160px;
    background-image: url("../images/home_images_v2/myClient-payments-grey.png");    
    background-size: 160px 160px;
} 
*/

/* MANAGEMENT REPORTS
// --------------------------------------*/
#navManagementReport{
    position: absolute;
    top: 60px;
    left: 150px;
}
#navManagementReportAlt{
    position:relative;
    top:100px;
    left:275px;
}
#navManagementReportBridge
{
    position:absolute;
    top:100px;
    left:94px; 
    width:126px;
    height:120px;
    background-size: 126px 120px;
    background-image: url("../images/home_images_v2/myClient-reports_bridge.png");
}
#navManagementReport a.icon{
    //Colour
    width:160px;
    height:160px;
    background-image: url("../images/home_images_v2/myClient-reports.png");    
    background-size: 160px 160px;
}   

/*
#navManagementReportAlt a.icon{
    //Greyscale 
    width:160px;
    height:160px;
    background-image: url("../images/home_images_v2/myClient-reports-grey.png");    
    background-size: 160px 160px;
}
*/

/* CONSUMER MANAGEMENT
// --------------------------------------*/
#navConsumerManagemnet{
    position: absolute;
    top: 235px;
    left: 30px;
}
#navConsumerManagemnetAlt{
    position:relative;
    top:275px;
    left:145px;
}
#navConsumerManagemnetBridge
{
    position:absolute;
    top:15px;
    left:119px; 
    width:156px;
    height:128px;
    background-size: 156px 128px;
    background-image: url("../images/home_images_v2/myClient-consumers_bridge.png");
}
#navConsumerManagemnet a.icon{
    //Colour
    width:160px;
    height:160px;
    background-image: url("../images/home_images_v2/myClient-consumers.png");    
    background-size: 160px 160px;
}    
/*
#navConsumerManagemnetAlt a.icon{
    //Greyscale        
    width:160px;
    height:160px;
    background-image: url("../images/home_images_v2/myClient-consumers-grey.png");    
    background-size: 160px 160px;
} 
*/


/* ALL THE OTHER STUFF
// --------------------------------------*/
.itemLeft img.menuBubble, .itemRight img.menuBubble{
    position:absolute;
    top:0px;
    left:0px;
    width:52px;
    height:52px;
    opacity:0;
}

.itemLeft h2, .itemRight h2{
    position:absolute;
    width:250px;
    height:52px;
    color:#222;
    top:0px;
    left:40px;
    text-indent:10px;
    line-height:52px;
    text-shadow:1px 1px 1px #fff;
    text-transform:uppercase;
}

.itemLeft h2.active, .itemRight h2.active{
    color:#fff;
    text-shadow:1px 0px 1px #555;
}

.itemLeft ul, .itemRight ul
{
    list-style:none;
    position:absolute;        
    display:none;
    width: 180px;
    padding-bottom:20px;
    padding-top: 20px;
    //z-index: 1;
}
.itemLeft ul {
    top:-35px;
    right:-20px;
    margin-right: 0px;
    width:220px;
}

.itemRight ul {
    top:-35px;
    left:140px;
    right:6px;
}

.itemLeft ul li, .itemRight ul li {
}

.itemLeft ul li + li, .itemRight ul li + li{
    margin-top: 5px;
}

.rightList{
}

/*
.itemLeft  ul li a{
    font-size:15px;
    text-decoration:none;
    letter-spacing:1.5px;
    text-transform:uppercase;
    color:#222;
    padding:3px;
    float:left;
    clear:both;
    width:100%;
}

.itemRight ul li a{
    font-size:15px;
    text-decoration:none;
    letter-spacing:1.5px;
    text-transform:uppercase;
    color:#222;
    padding:3px;
    float:left;
    clear:both;
    width:100%;
}
*/

/*

slide effect

.itemLeft ul li a:after{
    content:'';
    z-index: -1;
    position:absolute;
    right:0;
    top:0; 
    height:100%;
    width:0%;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    -moz-box-shadow:1px 1px 4px #3B3C3E;
    -webkit-box-shadow:1px 1px 4px #3B3C3E;
    box-shadow:1px 1px 4px #3B3C3E; 
    -webkit-transition:width .3s ease-out; 
    -ms-transition:width .3s ease-out; 
    -moz-transition:width .3s ease-out; 
    -o-transition:width .3s ease-out; 
}

.itemRight ul li a:after{
    content:'';
    z-index: -1;
    position:absolute;
    left:0;
    top:0; 
    height:100%;
    width:0%;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    -moz-box-shadow:1px 1px 4px #3B3C3E;
    -webkit-box-shadow:1px 1px 4px #3B3C3E;
    box-shadow:1px 1px 4px #3B3C3E; 
    -webkit-transition:width .3s ease-out; 
    -ms-transition:width .3s ease-out; 
    -moz-transition:width .3s ease-out; 
    -o-transition:width .3s ease-out; 
}

.itemLeft ul li a:hover:after{
    width:100%;
}

.itemRight ul li a:hover:after{
    width:100%;
}

.itemLeft ul li a:hover{
    color: #FFF !important;
    text-decoration-color: #FFF !important;
}
.itemRight ul li a:hover{
    color: #FFF !important;
    text-decoration-color: #FFF !important;
}
*/

.itemLeft ul li a, .itemRight ul li a {
    background-color: #EEE;
    background-image: url(../images/home_images_v2/link_angle.gif);
    background-position: bottom left;
    background-repeat: no-repeat;
    display: block;
    text-decoration: none;
    text-transform: uppercase;
    color: #222;
    padding: 2px 5px 2px 25px;
    clear: both;
    width: 170px;
}

.managementReport ul li a:hover { 
    color: #FFF;
    background-color: #6D9E3B; 
}
.products ul li a:hover { 
    color: #FFF;
    background-color: #36719C;
}
.consumerManagemnet ul li a:hover { 
    color: #FFF;
    background-color: #708494;
}
.futureFeature ul li a:hover {    
    color: #FFF;
    background-color: #E64D3C;  
}
.cashDispenser ul li a:hover { 
    color: #FFF;
    background-color: #DD0000; 
}
.businessIntelligence ul li a:hover { 
    color: #FFF;
    background-color: #51CFE3;
}

.disableLink:hover{
    //color:#000 !important;
    background-color:grey !important;
}