﻿

 /*********************    COMMON STYLES   *********************/
 html, body 
{
    width: 100%;
    height: 100%;
    margin: 0px;
    font-family:Arial;
    font-size:10px; /* base measure -> everyting in the mobile page is relative to this  font-size (10px) */
    background-color:#e7eff5;
}

        .background-fix
        {
            background-repeat: no-repeat;
            background-size:contain;
            background-position:center;
        }               
     
     .padding-bottom
     {
         height:35%;
     }                   
    
      header, footer
    {
        background-color: #191919;          
        display:block;                   
        width:100%;
    }  
    
    header
    {                
        width:100%;
        height:7%;
    }
    
    header > div    
    {
        display:inline-block;        
        margin:0;
        height:100%;
    }    
    
    header > div a
    {
        display:inline-block;        
            
        background-repeat:no-repeat;
        background-size: contain;        
        background-position:center;
        vertical-align:middle;
    }       
    
    footer
    {           
        height:7%;
        bottom: 0;
        left: 0;
        position:fixed;
        font-size:1.3em;
        
        margin-top:50%;
    }       
    
    footer a
    {
        display:block;
        color:#FFFFFF;
        text-align:center;        
    }      
    
    a
    {
        text-decoration:none;        
    }     
               
    /*********************    COMMON STYLES   *********************/         
     
    .clear-both
    {
        clear:both;
    }
            
    #btnMenu 
    {
        width:25%;
    }    
    
    #btnMenu #btnMobileMenu    
    {
        width:100%;
        height:100%;           
        background-image:url(/Content/Images/Mobile/Icons/Menu_icon.png);           
        background-position:left;
    }
    
    #headerLogo
    {    
        width:48%;        
    }
    
    #headerLogo a
    {               
        width:100%;
        height:100%;                
        
        background-image:url(/Content/Images/Mobile/Icons/Logo_MI.png);                     
    }       
    
    #langs
    {
        width:25%;
        height:10%;
        text-align:right;        
    }
    
    #langs a
    {
        font-size: 1.7em;
        color:#FFFFFF;                       
    }
     
    #content
    {               
        width:100%;
        height:80%;
    }
    
    /**************************           HOME PAGE     *******************************/   
    
    #contentHomePage
    {
        height:85%;
    }
    
    .homePageButton
    {
        width:100%;
        /* height: 14.26%; */ /* this is for 7 buttons */
        height: 16.66%; /* this is for 6 buttons */
        background-color: #FFFFFF;        
        margin-bottom:2px;
        text-transform:uppercase;
        font-size:1.1em; /* CSS3 measure */       
    }
    
    .homePageButton:hover
    {
        background-color:#169ef8;
    }
    
    .homePageButton:hover a div
    {
        color:#FFFFFF;
    }
    
    .footerFeedbackButton
    {   
        width:100%;
        height: 14.50%;     
        background-color:#0b5d91;
        position:fixed;
        bottom:6.5%;
    }        
    
    div.homePageButtonText
    {
        padding-top:1%;
    }
    
    .footerFeedbackButton div.homePageButtonText
    {
        color: #FFFFFF;
    }      
    
    .homePageButton a
    {
        width:100%; 
        height:100%;
    }       
    
    .homePageButton a div
    {                
        color:#000000;
        font-weight:bold;     
        margin:auto;   
    }
    
    .homePageButton #btnAcctSoft
    {
        background-image: url(/Content/Images/Mobile/Icons/AccountingSoftware.png);
    }
    
    .homePageButton:hover #btnAcctSoft
    {
        background-image: url(/Content/Images/Mobile/Icons/AccountingSoftware_mo.png);
    }
                    
    .homePageButton #btnRetailSoft
    {
        background-image: url(/Content/Images/Mobile/Icons/RetailSoftware.png);
    }
    
    .homePageButton:hover #btnRetailSoft
    {
        background-image: url(/Content/Images/Mobile/Icons/RetailSoftware_mo.png);
    }
    
    .homePageButton #btnRestSoft
    {
        background-image: url(/Content/Images/Mobile/Icons/RestaurantSoftware.png);
    }
    
    .homePageButton:hover #btnRestSoft
    {
        background-image: url(/Content/Images/Mobile/Icons/RestaurantSoftware_mo.png);
    }
    
    .homePageButton #btnPromo
    {
        background-image: url(/Content/Images/Mobile/Icons/Poromotions.png);
    }   
    
    .homePageButton:hover #btnPromo
    {
        background-image: url(/Content/Images/Mobile/Icons/Poromotions_mo.png);
    }
	
	.homePageButton #btnPromoFriday
    {
        background-image: url(/Content/Images/Mobile/Icons/Poromotions1.png);
    }   
    
    .homePageButton:hover #btnPromoFriday
    {
        background-image: url(/Content/Images/Mobile/Icons/Poromotions1_mo.png);
    }  
	
	.homePageButton #btnN18
    {
        background-image: url(/Content/Images/Mobile/Icons/N18.png);
    }   
    
    .homePageButton:hover #btnN18
    {
        background-image: url(/Content/Images/Mobile/Icons/N18_mo.png);
    }  
    
    .homePageButton #btnContactUs
    {
        background-image: url(/Content/Images/Mobile/Icons/Contacts.png);
    }
    
    .homePageButton:hover #btnContactUs
    {
        background-image: url(/Content/Images/Mobile/Icons/Contacts_mo.png);
    }
    
    .homePageButton #btnAboutUs 
    {
        background-image: url(/Content/Images/Mobile/Icons/AboutUs.png);
    }        
    
    .homePageButton:hover #btnAboutUs
    {
        background-image: url(/Content/Images/Mobile/Icons/AboutUs_mo.png);
    }   
    
    .homePageButton #btnNewsArchive
    {
        background-image: url(/Content/Images/Mobile/Icons/ArchiveNews.png);
    }
    
    .homePageButton:hover #btnNewsArchive
    {
        background-image: url(/Content/Images/Mobile/Icons/ArchiveNews_mo.png);
    }
       
    #btnFeedback
    {
        background-image: url(/Content/Images/Mobile/Icons/Mail.png);        
    }
    
    .homePageButton:hover #btnFeedback
    {
        background-image: url(/Content/Images/Mobile/Icons/Mail_mo.png);        
    }
    
    .homePageButtonIcon
    {                    
        width: 55%;
        height: 55%;
        
        background-repeat: no-repeat;
        background-size:contain;
        background-position:center;
    }   
    
    div#lnkToFullVersion
    {                
        width:100%;
        height:100%;              
    }           
    
    .table
    {
        display:table;      
        border-collapse: collapse; /* Without this you cant set border to a row !!! */ 
    }
    
    .table-row
    {
        display:table-row;
    }
    
    .table-row > div 
    {
        display:table-cell;
    }
    
    .table-cell
    {
        display:table-cell;
    }
    
    .centered
    {
        vertical-align:middle;
        text-align:center;
    }
    
    #langs a.languageButton
    {
        display:none;
        margin-right:6%;
    }            
    
    #langs a:not([selected=true]):hover
    {
        color:#179efa;
    }
    
/****************  MENU MOBILE (TOP LEGT)      *********************/
#menuMobile
{
    display:none;
    width:100%;
    height:100%;
    
    position: absolute;
    
    left:0;
    background-color:#065384;     
    padding-top:15%;
    padding-left:15%;
    z-index:2;
}

.menuMobileItem
{
    height:7%; 
}

#menuMobile a 
{
    display:block;
    width:100%;
    height:100%;
    font-size:1.2em;
    color:#FFFFFF;
}

#menuMobile #btnSearch
{    
    width:65%;
    height:65%;
    background-image:url('/Content/Images/Mobile/Icons/search.png');
    background-position:left;
    background-repeat:no-repeat;
    background-size:contain;
    text-indent:6%;
}

.end-menu-line
{
    background-color:#FFFFFF;
    width:70%;
    height:0.2%;
}

#btnSearchContainer
{
    height:4%;
}

#tbSearch
{
    border:1px solid;
    background-color:#065381;
    color:#FFFFFF;    
}

#formSearch
{
    display:none;
}

/****************  MAIN NAV MENU (INNER PAGES)  ********************/
#main-nav-menu
{
    background-color: #065384;
    width:100%;
    height:17%;
    vertical-align:middle;
}

div#main-nav-menu-buttons
{    
    width:100%;
    height:100%;    
}

div#main-nav-menu-buttons a
{
    display:inline-block;    
    width:24%;
    height:100%;        
    text-align:center;
    vertical-align:top;    
    color:#FFFFFF;
    font-size:1em;        
}

div#main-nav-menu-buttons > a:hover
{
     background-color: #0e79be;
}

div#main-nav-menu-buttons a div
{   
    width:100%;
    height:50%;
     
    background-size:contain;
    background-repeat:no-repeat;
    background-position:center;        
    margin-top:10%;
}


  #main-nav-menu div#btnAcctSoft
  {
    background-image: url(/Content/Images/Mobile/Icons/AccountingSoftware_mo.png);
  }        
                    
    #main-nav-menu div#btnRetailSoft
    {
        background-image: url(/Content/Images/Mobile/Icons/RetailSoftware_mo.png);
    }
      
    #main-nav-menu div#btnPromo
    {
        background-image: url(/Content/Images/Mobile/Icons/Poromotions_mo.png);
    }       

    #main-nav-menu div#btnPromoFriday
    {
        background-image: url(/Content/Images/Mobile/Icons/Poromotions1_mo.png);
    }

    #main-nav-menu div#btnN18
    {
        background-image: url(/Content/Images/Mobile/Icons/N18_mo.png);
    } 	
    
    #main-nav-menu div#btnContactUs
    {
        background-image: url(/Content/Images/Mobile/Icons/Contacts_mo.png);
    }
    
    #main-nav-menu div#btnRestSoft
    {
        background-image: url(/Content/Images/Mobile/Icons/RestaurantSoftware_mo.png);
    }
    
    #main-nav-menu .selected
    {
        background-color:#0a66a1;
    }
    
/******************* PRODUCTS LIST  ******************/    
    .products-list-container
    {                      
        width:100%;
        height:100%;                           
    }    
    
    .products-list-container .product-item
    {        
        background-color:#FFFFFF;
        /*border-bottom: 2px solid #e7eff5;                      */
        width:100%;
        height:30%;
                        
        /* margin-bottom:0.7%; */
        font-size:1.1em;
    }
    
    .line-separator
    {
        margin:0;
        padding:0;
        max-height:0.4%;
        height:0.4%;
        background-color:#e7eff5;
    }
    
    .products-list-container .product-item > div
    {   
        /*border:1px solid red;*/
        margin:0;
        padding:0;
             
        height:100%;
        display:inline-block;       
        vertical-align:top;                 
        padding-top:2%;
    }        
    
    .products-list-container .product-item > div:nth-child(1)
    {
        width:20%;    
        text-align:center;
        padding-left:2%;
    }
    
    .products-list-container .product-item > div:nth-child(2)
    {
        width:60%;             
    }
    
    .products-list-container .product-item > div:nth-child(3)
    {        
        width:15%;
        text-align:center;                      
    }
    
    .products-list-container .product-item > div:nth-child(3)
    {
        
    }
    
    a.product-image
    {
        display:block;                    
        width:80%;
        height:80%;
        
    }
    
   
       .lblVersion
       {           
           float:left;
       }
       
        .lblReleaseDate        
        {
            float:right;
        }
        
       .lblReleaseDate:after
        {            
            clear:both;
        }
       
       .lblVersion, .lblReleaseDate, .lblProductName a
       {
           color:#191919;
        }
       
       .lblProductName a
       {                     
           font-size:1.2em;
        }
       
       .lblShortDescription
       {                  
           padding-top:3%;
           color: #4a4a4a;

           width:100%;
           height:100%;
           overflow:auto;
        }                
        
        .lblPrice
        {
            color: #009bfe;  
        }
        
        .no-price
        {
             font-size:0.8em;
        }
        
        .lblCurrency
        {
            color: #191919;
        }
       
       .bold
       {
           font-weight:bold;
        }
        
        .italic
        {
            font-style:italic;
        }
        
        /*********************   FEEDBACK FORM   ********************/        
        #FeedbackForm
        {         
            font-size:1.4vh;
            margin-top:3%;
        }
        
        #FeedbackForm div
        {            
            padding-top:3%;
            padding-left:3%;
            padding-right:3%;
        }
        
        #FeedbackForm input[type=text], #FeedbackForm textarea
        {
            width:99%;
            height: 3vh;                   
        }
        
        #FeedbackForm textarea
        {
            height: 10vh;      
        }
        
        #FeedbackForm #submitButtonContainer
        {   
            width:98%;
            height:5%;                     
            text-align:center;
            background-color:#065384;
            padding:1%;
        }
        
        #FeedbackForm #submitButtonContainer input
        {
            width:10%;
            height:10%;                                    
        }
        
        .notificationMessage
        {
            font-size:3vh;
        }

        /*********************   PROMO / ACCENTS  ********************/        
        #accentsContainer
        {
            width:100%;
            height:100%;
        }
        
        .accentItem 
        {
            width:47.5%;
            height:15%;
            background-color:#FFFFFF;             
            display:inline-block; 
            
            padding:1%;
            margin-bottom:3px;   
            /*
            font-size:1.2em;
            */
        }
        
        .accentItem a
        {
             width:100%;
             height:100%;
             color: #4a4a4a;
        }
               
        
        .accentItemImageContainer, .accentItemTextContainer
        {
            display:inline-block;            
            overflow:hidden;
            height:100%;
        }        
        
        .accentItemImageContainer
        {
            width:35%;   
            margin-right:4%;
        }
        .accentItemTextContainer
        {
            width:58%;   
        }              
        
        
        /***********************  PRODUCT PAGE TOOLBAR  ******************/
        
        #product-page-toolbar
        {
            width: 100%;
            height: 20%;
            margin-bottom:0.5%;
            background-color:#FFFFFF;
            font-size: 1em;
            padding-left:2%;
            padding-top:2%;
        }
        
        #product-page-toolbar > div
        {
            height:100%;
            display:inline-block;
            vertical-align:top;            
        }
        
        #product-page-toolbar > div:nth-child(1)
        {
            width:28%;            
        }
        
        #product-page-toolbar > div:nth-child(2)
        {
            width:70%;
        }
        
        #product-page-download-doc
        {            
            width:50%;
            height:80%;  
            
            
             text-align:center;
            /*color:#0095C9;*/
            color:#000000;
            display:inline-block;
             vertical-align:top;
             font-size:0.9em;
             float:right;
            
        }
        
        #product-page-download-doc > div
        {
            width:50%;
            height:50%;
            margin:auto;
            background-image: url(/Content/Images/Mobile/Icons/wizard.png);
        }
            
        #product-page-image-toolbar
        {
            width:90%;
            height:90%;
            padding:2%;
        }
        
        #product-page-product-toolbar-name
        {
            font-size:1.2em;
            margin-bottom:4%;
        }
                        
        #product-page-image-toolbar tr
        {
            margin-bottom:2%;
        }
       
        #product-toolbar-product-info
        {            
            width:47%;
            display:inline-block;
            font-size:1em;
        }
               
        
        /***********************  STATIC PAGES  ******************/
        .page
        {
             background-color:#FFFFFF;
             padding: 3%;
             font-size:1.2em !important;
             
        }
        
        /***********************  SEARCH RESULTS PAGE  ******************/
        
        .searchResultsPage
        {
            height:100%;
        }
                             
        .foundItem
        {
            
            height:5%;
            background-color:#FFFFFF;
            padding:2%;
            vertical-align:middle;
            border-bottom:1px solid #e7eff5;
            overflow: scroll;
        }
        
        .foundItem a
        {            
            font-size:1.2em;
            
            color:#191919;
        }                
        
        #searchResultsContainer
        {
             width:100%;
             height:100%;
             background-color:#FFFFFF;
             padding:2%;
        }
        
        #searchResultsContainer h4
        {
            font-size:1.3em;
        }
        
        
        
/*************    ROTATOR   *************************/
        #rotator_container
        {
            position:relative; 
            width:100%;
            height:28%; 
            overflow:hidden;
        }
        
        #current_slide{overflow:hidden;}
        #current_slide img, .slide img { border:none }

        #slider_navigation_container
        {
            position:absolute; 
            bottom:5px; 
            right:10px
        }

        #current_slide a, #current_slide a img, .slide a, .slide a img { width:100%; height:100%; }
        a.slider_button, a.slider_button_current{ background-image:url(Images/AddPoint.png); width:17px;height:17px; background-position:top center;float:left; display:block}
        a.slider_button_current{background-position:bottom center;}

        .promopanel_top{ background-image:url(Images/promopanel_top.jpg); height:14px}