﻿/** Process Diagrams     **/
/* This stylesheet should only be used on the Process Diagram templates */
/* 
* This is a global element which wraps all HTML text ares in Reddot. 
* It cannot be modified at present - might need to update when EA move to IE7.
* This will cause Firefox to render the process diagram block, left aligned
.plain_text{
    width:100%;
    padding-left: 0 !important;
    padding-right: 0 !important;
    display:block;
    }
*/
    /* These styles are overly specific so they dont interfere with other stylesheets */
    .plain_text #p-d ol li{list-style:none;}
        .plain_text #p-d ol li h2{
            background: none;
            padding: 0;
            margin: 0;            
            word-wrap:normal; /* override other EA stylesheets for Process Diagrams only */
            }
            .plain_text #p-d ol li h2 a{
                display: block;                
                background: none;                
                text-decoration: underline;    
                padding-right:0;        
                font-size:100%;
                word-wrap:normal; /* override other EA stylesheets for Process Diagrams only */
                }
            .plain_text #p-d ol li p{padding: 0;}

/* Wrapping element to prevent interfering with other styles - all styles are preceeded by it */
#p-d{
    width:100%;
    text-align: center;
    }
#p-d .inner{
    margin: 0 auto; /* centre content */
    text-align: left;
    width:590px;        
    min-height: 400px; 
    position:relative;
    }
* html #p-d .inner{height:400px;}/* ie6 companion to min-height set above for other browsers */
    #p-d #intro{
        position:absolute;
        top:50%;
        left:50%;
        width:9.6em;        
        margin-left: -4.8em;
        margin-top: -3.2em;
        }
        #p-d p#intro,
        #p-d #intro{text-align: center; font-weight: bold;}
    
    /* Process Background Arrows */
    #p-d #p-d-1{background: url(/default/arrows1.gif) 50% 78px no-repeat;}
    #p-d #p-d-2{background: url(/default/arrows2.gif) 50% 78px no-repeat;}
    #p-d #p-d-3{background: url(/default/arrows3.gif) 50% 78px no-repeat;}
    #p-d #p-d-4{background: url(/default/arrows4.gif) 50% 78px no-repeat;}
    #p-d #p-d-5{background: url(/default/arrows5.gif) 50% 78px no-repeat;}
    #p-d #p-d-6{background: url(/default/arrows6.gif) 50% 78px no-repeat;}
    #p-d #p-d-7{background: url(/default/arrows7.gif) 50% 78px no-repeat;}

    /* Process Individual Elements */
    #p-d .inner li{position:absolute;}    
        #p-d .inner p{font-size:90%;}        
        #p-d .inner a:hover,
        #p-d .inner a:focus{text-decoration: none;}        
    
    /* 7 point circular layout */    
    #p-d .inner #pos1{        
        top:15px; 
        left:278px;        
        width:300px;        
        padding: 0 0 45px 5px;
        background: url(/default/icon-m.gif) 0 100% no-repeat;        
        }
    #p-d .inner #pos2{
        top:101px; 
        left:367px;        
        width:170px;        
        padding:  4px 0 4px 50px;
        background: url(/default/icon-cal.gif) 0 0 no-repeat;        
    }
    #p-d .inner #pos3{
        top:200px; 
        left:386px;        
        width:150px;        
        padding: 4px 0 8px 50px;        
        background: url(/default/icon-how.gif) 0 0 no-repeat;        
    }
    #p-d .inner #pos4{
        top:296px; 
        left:326px;        
        width:250px;        
        padding:45px 0 5px 0;        
        background: url(/default/icon-flask.gif) 0 0 no-repeat;        
    }
        
    #p-d .inner #pos5{
        top:282px; 
        right:348px;        
        width:190px;        
        padding: 2px 50px 0 0;
        background: url(/default/icon-screen.gif) 100% 0 no-repeat;        
        
        text-align:right;
    }
    #p-d .inner #pos6{
        top:166px; 
        right:390px;        
        width:150px;        
        padding: 0 45px 0 0;        
        background: url(/default/icon-tick.gif) 100% 4px no-repeat;                
        text-align:right;
    }
    #p-d .inner #pos7{
        top:95px; 
        right:370px;
        width:215px;        
        text-align:right;
    }