/* The toolbar for the content box */
.hide { display: none; }
hr { display: none; }
ul#toolbar {
    height: 52px;
    width: 500px;
    text-align: center;
    list-style: none;
    margin: 0 auto 0 auto;
    clear: both;
    position: relative;
    margin-bottom: -1px;
    }
    
#toolbar li {
    position: absolute;
    text-indent: -9999px;
    top: 0;
    }
    
#toolbar li a {
    height: 52px;
    display: block;
    }
    
#toolbar li.active {
    /*border-bottom: 1px solid #f2f2f2;*/
    background-position: bottom;
    height: 52px;
    z-index: 10;
    }

#toolbar li.inactive {
    background-position: top;
    border-bottom: 1px solid #ccc;
    }
    
#toolbar li:hover {
    background-position: bottom;
    }
        
#toolbar li#account-tab {
    left: 0;
    width: 100px;
    background-image: url(./images/pd/toolbar_tab-account.png);
    }
    
#toolbar li#gcash-tab {
    left: 100px;
    width: 100px;
    background-image: url(./images/pd/toolbar_tab-gcash.png);
    }

#toolbar li#voucher-tab {
    left: 200px;
    width: 110px;
    background-image: url(./images/pd/toolbar_tab-vouchers.png);
    }

#toolbar li#forum-tab {
    left: 310px;
    width: 114px;
    background-image: url(./images/pd/toolbar_tab-forum.png);
    }

#toolbar li#more-tab {
    left: 424px;
    width: 94px;
    background-image: url(./images/pd/toolbar_tab-help.png);
    }

/*for reseller panel */    
    
#toolbar li#reseller-tab {
    left: 0;
    width: 100px;
    background-image: url(./images/pd/toolbar_tab-reseller.png);
}    
#toolbar li#generate-tab {
    left: 100px;
    width: 110px;
    background-image: url(./images/pd/toolbar_tab-generate.png);
}    

#toolbar li#apply-tab {
    left: 210px;
    width: 110px;
    background-image: url(./images/pd/toolbar_tab-apply.png);
}  
#toolbar li#activevc-tab {
    left: 320px;
    width: 110px;
    background-image: url(./images/pd/toolbar_tab-activevc.png);
}
#toolbar li#expiredvc-tab {
    left: 430px;
    width: 115px;
    background-image: url(./images/pd/toolbar_tab-expiredvc.png);
}
#toolbar li#search-tab {
    left: 430px;
    width: 115px;
    background-image: url(./images/pd/toolbar_tab-search.png);
} 


#side_btn {
   background-position: top;
    width: 264px;
    height: 74px;
    background-image: url(./images/pd/side_btn.png);
    /*text-indent: -9999px;*/
} 

#side_btn:hover {
   background-position: bottom;
} 

#side_btn a {
    padding-top: 15px;
    text-shadow: #aaa 1px 1px 0px;
    text-align: center;
    font-size: 24px;
    height: 74px;
    width: 264px;
    display: block;
    color: #999;
}
#side_btn a:hover {
    text-decoration: none;
    color: #444;
}

/* The slide-y content box thingy */

#frame, #frame div.button, #scroller, .section { height: auto; }

#frame {
    overflow: hidden;
    margin: 0 auto;
    width: 710px;
    position: relative;
    }
    
#frame div.button {
    position: absolute;
    top: 40%;
    }
    
div.button#left { left: 0; }
div.button#right { right: 0; }

#scroller {
    width: 700px;
    margin: 0 auto;
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    background: #fff url(./images/pd/content_pane-gradient.gif) bottom repeat-x;
    overflow: hidden;
    }
    
#content {
    width: 5250px;
    }

.section {
    width: 650px;
    margin: 20px;
    float: left;
}
    
.section h2, .section h3 {
    color: #072453;
    font-weight: normal;
    font-family: "HelveticaNeue", Helvetica, Arial, sans-serif;
    font-size: 19px;
    line-height: 24px;
    margin-bottom: 5px;
    }
    
.section h3 {
    color: #000;
    }
    
.section p, .section li {
    margin: 0 0 20px 0;
    font-size: 14px;
    line-height: 22px;
    }

.section li strong {
    font-size: 19px;
    font-weight: normal;
    }

.section img {
    float: left;
    margin-right: 20px;
    margin-bottom: 20px;
    }
    
#new-pane p, #new-pane li {
    }

ul#new_features {
    list-style: none;
    margin: 10px 0;
    }
    
li.new_feature {
    display: block;
    list-style: none;
    padding-left: 40px;
    background-position: top left;
    background-repeat: no-repeat;
    min-height: 32px;
    }
    
div#frame_footer {
    width: 700px;
    margin: 0 auto 0px auto;
    color: #666;
    font-size: 14px;
    padding-top: 20px;
    background: #ddd url(/images/pd/content_pane-shadow.gif) no-repeat top;
    }
    
    
    
#hor-zebra
{
    font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;
    font-size: 12px;
    margin: 2px;
    text-align: left;
    border-collapse: collapse;
}
#hor-zebra th
{
    font-size: 14px;
    font-weight: normal;
    padding: 10px 8px;
    color: #039;
}
#hor-zebra td
{
    padding: 8px;
    color: #669;
}
#hor-zebra .odd
{
    background: #e8edff; 
}

#hor-zebra2
{
    font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;
    font-size: 12px;
    margin: 2px;
    text-align: left;
    border-collapse: collapse;
}
#hor-zebra2 th
{
    font-size: 14px;
    font-weight: normal;
    padding: 10px 8px;
    color: #039;
}
#hor-zebra2 td
{
    padding: 8px;
    color: #333;
}
#hor-zebra2 .odd
{
    background: #eee; 
}



div.bg_infos_etud {
    background: url("../images/pd/bg_infos_etud.jpg") no-repeat transparent;
}


/*******************************************************************/

/*    5.4. ICON MENU*/
ul#submenu{        
    height:90px;    
    float:left;    
    background:#fff;    
    border:1px solid #b4b4b4;    
    padding:0 0 10px 10px;    
    margin:0 0px 0 0;    
    position:relative;
    margin: auto;
}
    
ul#submenu li{     
    float:left;    
    list-style-type:none;
}

a.icon-menu{    
    width:78px;    
    height:78px;    
    float:left;    
    margin:10px 10px 0 0;    
    background:url(/images/pd/menu-icon-bg.png) 
    no-repeat;    
    border:1px solid #ccc;    
    position:relative;    
    text-decoration:none;
}

a.icon-menu:hover{    
    border:1px solid #888;    
    -moz-box-shadow:0px 0px 4px #ccc;    
    -webkit-box-shadow:0px 0px 4px #ccc;    
    box-shadow:0px 0px 4px #ccc;    
    /* IE CSS3 solution */    
    behavior: url(pie/PIE.htc);
}
a.icon-menu img{    
    float:left;    
    margin:8px 0 0 16px;
    border: 0;
}

a.icon-menu span{    
    width:100%;    
    position:absolute;    
    top:56px;    
    left:0;    
    text-align:center;    
    font-size:11px;    
    color:#666;    
    cursor:pointer;
}

.corners{    
    -moz-border-radius: 5px;    
    -webkit-border-radius: 5px;    
    border-radius:5px;
}
.shadow{    
    -moz-box-shadow:0px 0px 4px #ccc;    
    -webkit-box-shadow:0px 0px 4px #ccc;    
    box-shadow:0px 0px 4px #ccc;    
    /* IE CSS3 solution */    
    behavior: url(pie/PIE.htc);
}

/******************************************/
div#submenu{        
    height:auto;    
    float:left;    
    background:#fff;    
    border:1px solid #b4b4b4;    
    padding:0 0 10px 10px;  
    padding-left: 45px;
    margin:0 0px 0 0;
    position:relative;
    margin: auto;
}
div#submenu div{     
    float:left;
    height: 145px;
    width: 150px; 
    margin:10px 10px 0 0;
    border:1px solid #ccc;    
    position:relative;    
    text-decoration:none;
    padding-left: 8px;
    padding-right: 8px;
    vertical-align: middle;
}
div#submenu div:hover {
    cursor: pointer;
    border:1px solid #888;    
    -moz-box-shadow:0px 0px 4px #ccc;    
    -webkit-box-shadow:0px 0px 4px #ccc;    
    box-shadow:0px 0px 4px #ccc;   
    background-image:url(../images/facs/bg_div_fac.png);  
    /* IE CSS3 solution */    
    behavior: url(pie/PIE.htc);
}

div#submenu div table.block {
    background-position: center;
    background-repeat: no-repeat;
    height: 100%;
    text-align: center;
}  

div#submenu div table.block:hover {
    background-image: url(../images/facs/cle.png);  
}  


div#submenu div table.unblock {
    background-position: center;
    background-repeat: no-repeat;
    height: 100%;
    text-align: center;
}  

div#submenu div table.unblock:hover {
/*    background-image: url(../images/facs/cle.png);  */
}  



div#submenu div span {
    font-size: 14px;
    color: #669;
    font-weight: bold;
    line-height: 25px;
    vertical-align: middle;
    margin: auto;
    background: transparent;
    text-transform: uppercase;
}