﻿/* Styles.css -- These are generally page specific styles, correlating with various pages */
.prod_tab { display: inline; float: left; padding-top: 14px; margin-left: 11px; }
.prod_smallbuttons { display: none; float: right; margin-right: 35px;}
.landing_breadcrumbs {border-bottom: 1px solid #dcdcdc; padding-bottom: 3px; margin-top: -7px; margin-left: -10px; padding-left: 20px; margin-bottom: 7px; }
    .landing_breadcrumbs a {text-transform: uppercase; font-weight: normal; font-size: 1em; color: #777; }
    .landing_breadcrumbs a:hover { color: #000; }



    

/* Homepage Styles */
    #mid.home { background: #fff; width: 724px; padding: 0px; border: 0px;}
    #mid.home .block { height: 230px; float: left; width: 234px; margin-top: 4px; position: relative; padding: 0px; margin-right: 5px}
       
        #mid.home .block h1 { margin: -2px -2px 0px -2px; position: relative; }
        #mid.home .block p { padding: 10px; position: relative; margin: 0px;}
            #mid.home .block p img { float: left; display: inline; margin-right: 10px; margin-bottom: 5px; }
        
        #mid.home .block img.btm { position: absolute; left: -2px; bottom: -4px; }
        
        #mid.home .fcontrol_b { width: 476px; border: 2px solid #841615; border-top: 0px; border-bottom: 0px;  }
            #mid.home .fcontrol_b h1 { margin-bottom: 4px; }
            #mid.home .fcontrol_b p { float: left; width: 145px;}
            #mid.home .fcontrol_b p.l { margin-left: 4px}
            #mid.home .fcontrol_b p.m { width: 120px; }
            #mid.home .fcontrol_b p a.ico { height: 82px; display: block; text-align: center}
            #mid.home .fcontrol_b p a.ico img { float: none;}
            
        #mid.home .productivity_b { border: 2px solid #223c4f; border-top: 0px; border-bottom: 0px; margin-right: 0px}
            #mid.home .productivity_b h1 { margin-bottom: 14px; }
            #mid.home .productivity_b p { margin-top: 7px }

        #mid.home .epic1_b { height: 148px; clear: both; margin-top: 10px; border: 2px solid #a7a7a7; width: 477px; border-top: 0px; border-bottom: 0px; }
            #mid.home .epic1_b h1 { margin-bottom: 4px; }
            #mid.home .epic1_b p { padding-bottom: 0px; }

        #mid.home .epic2_b { height: 148px; margin-top: 10px; border: 2px solid #a7a7a7; width: 234px; border-top: 0px; border-bottom: 0px; margin-right: 0px}
            #mid.home .epic2_b h1 { margin-bottom: 4px; }



/* Base Page Styles (Includes Company and Contact */
    #mid.base h1 { margin: 0px; font-size: 1.2em; color: #000;}

/* Contact Page Styles */   
    #mid.base .contact .sep { float: left;width: 1px; height: 300px; background: #D7D7D7; display: inline; margin: 5px 0px 5px 10px}
    #mid.base .contact .left { float: left; width: 300px; padding: 0px 10px; }
        #mid.base .contact .left .formtable th { white-space: nowrap; text-align: left; padding-right: 5px; }
        #mid.base .contact .left .formtable th, #mid.base .contact .left .formtable td { padding: 3px 2px; }
        #mid.base .contact .left .formtable input { width: 200px; }
    
    #mid.base .contact .middle { float: left; width: 180px; padding: 0px 10px; } 
        #mid.base .middle ul { list-style: none; padding: 0px; margin: 0px; margin-left: 10px;}
        #mid.base .middle li { padding: 2px 10px; background: url("/images/ico_bullet.gif") left no-repeat; margin: 2px 0px 0px 2px; }
   
    #mid.base .contact .right { float: right; padding-right: 0px; width: 160px; padding-right: 10px;}
        #mid.base .right ul { list-style: none; padding: 0px; margin: 0px;}
        #mid.base .right li { margin: 2px 0px 0px 2px; }

/* Company Page Styles */   
    #mid.base .company .sep { float: left;width: 1px; height: 300px; background: #D7D7D7; margin: 5px 10px}
    #mid.base .company .left { float: left; width: 500px; padding: 0px 10px 0px 10px; }
    #mid.base .company .right { float: right; padding-right: 0px; width: 160px; padding-right: 10px;}
        #mid.base .company .right ul { list-style: none; padding: 0px; margin: 0px;}
        #mid.base .company .right li { margin: 2px 0px 0px 2px; }

/* Products Main */
    #mid.base .products { width: 720px;  }
         #mid.base .products .block { float: left; width: 222px;  }
         #mid.base .products .fcontrol_b { width: 454px; }
             #mid.base .products .fcontrol_b p { margin-top: 0px; }
         #mid.base .products .mule_b img { margin-top: 20px; margin-bottom: 16px }
         
         #mid.base .products .sep { float: left;width: 1px; height: 240px; background: #D7D7D7; margin: 20px 10px}

/* Product Landing Page Styles */

    #mid.landing .left { float: left; width: 518px; padding: 0px 20px 0px 10px; }
        #mid.landing .left h1 {margin: 0px; font-size: 1.2em; color: #000;}
        #mid.landing .left ol { padding: 0px 30px; margin: 0px; margin-top: 10px}
            #mid.landing .left li { margin-bottom: 3px; }
            #mid.landing .left li strong { display: block;}
            
            #mid.landing .container { float: left; }
            #mid.landing .container p { margin: 0px 0px 10px 0px; padding-top: 15px}
            #mid.landing .container .L { float: left; padding: 0px 25px; text-align: center; }
                #mid.mule .container .L {text-align:left; padding: 0px 25px 0px 0px}
                #mid.inspire .container .L { padding: 0px 25px 0px 5px; }
                #mid.landing .container .L img { margin-bottom: 5px; }
            #mid.landing .container .R { float: left; }
                #mid.fcontrol .container .R { width: 350px; }
                #mid.inspire .container .R { width: 280px; }
                #mid.mule .container .R { width: 270px; }
                #mid.landing .container .R a { font-size: 1.0em; }
            
            
            /* Products Main */
            #mid.landing .products { width: 720px;  }
                #mid.landing .products .block { float: left; width: 222px; }
                #mid.landing .products .sep { float: left;width: 1px; height: 300px; background: #D7D7D7; margin: 20px 10px; }
                    
            
            /* Testimonial List */
            #mid.landing .testimonial ul { margin: 10px 5px; padding: 0px; list-style: none}
            #mid.landing .testimonial .sep { margin: 0px 20px; height: 1px; width: 450px; background: #ccc; }
            #mid.landing .testimonial li.date { font-size: 1.1em; }
                #mid.landing .testimonial li.date strong { display: inline;}
            #mid.landing .testimonial li.comment { padding-left: 15px; }
                
           /* Many Uses List */
            #mid.landing .uses ul { margin: 10px 5px; padding: 0px; padding-left: 10px}
            #mid.landing .uses li.name { font-size: 1.1em; }
                #mid.landing .uses li.name strong { display: inline;}
            
            /* FAQ List */
            #mid.landing .faq div { margin: 0px 10px; }
            #mid.landing .faq .question { margin-top: 5px; }
                #mid.landing .faq .question img { padding-right: 5px; }
            #mid.landing .faq .answer { margin: 10px 0px; padding-left: 14px; display:none;}
            
            
            /* Buying Steps */
            .step_count {  position: absolute; margin: -73px 0px 0px 580px; }
            #mid.store h1 { margin-top: -2px; clear: left; padding-bottom: 5px;}
            #mid.store h2 {font-size: 1.1em; color: #000; font-weight: bold; text-transform: uppercase }
            #mid.store p { margin-top: 0px; }
            #mid.store p.intro { float: left; width: 340px; margin-bottom: 20px }
            
            #mid.store .prod_cont dl { clear: both; float: left;}
            #mid.store .prod_cont dt { float: left; width: 216px; }
            #mid.store .prod_cont dd { float: right; width: 270px; padding: 5px 0px 10px 10px;margin: 0px; }
            
            #mid.store h1 { margin-top: 0px; }
            /* Step 1 */
               
                
                #mid.store .step1 .submit { float: right; margin-right: 10px}
                
                #mid.store .step1 .block { float: left; width: 216px; margin-right: 80px;}
                    #mid.store .step1 .nom{margin-right:0px;}
                #mid.store .step1 dl { float: left;}
                #mid.store .step1 dt { width: 216px; height: 120px}
                    
                    #mid.store .step1 .noheight{height: auto;}
                #mid.store .step1 dd { width: 190px; border: 1px solid #ccc; background: #fff; padding: 10px;margin: 0px; margin-bottom: 20px}
                    
                
                #mid.store .step1 .L { float: left; }
                    #mid.store .step1 .L h2 { margin: 0px; } 
                #mid.store .step1 .R { float: right; }
                    #mid.store .step1 .R h2 { margin: 0px; font-size: 1.7em; font-weight: bold } 
                    #mid.store .step1 .mule h2 { color: #447090; }
                    #mid.store .step1 .flashnet h2 { color: #851817; }
                    
                #mid.store .step1 .CLR { clear: both; padding-top: 15px; text-align: right;}
                    #mid.store .step1 .CLR span { padding: 3px 0px; }
                      
            /* Step 2 */
            
                #mid.store .step2 dd h2 { margin: 0px; } 
                #mid.store .step2 .formtable th { white-space: nowrap; text-align: left; padding: 3px 0px 3px 10px; width: 85px }
                #mid.store .step2 .formtable td { padding: 3px 2px; }
                #mid.store .step2 dt.st { width: 435px; text-align: right; border-top: 1px solid #ccc}
                #mid.store .step2 dd.del { text-align: right; }
                    #mid.store .step2 dd.del a { font-size: 1em; font-weight: normal; }
                #mid.store .step2 dd.st { width: 55px; border-top: 1px solid #ccc}
                
                
            /* Step 3 */
                #mid.store .shipping_error { background: #ffffcb; border: 1px solid #930; color: #930; padding: 5px; margin-bottom: 10px; }
                    #mid.store .shipping_error a { font-size: 1em; font-weight: normal; color: #f00; }
                #mid.store .confirm_cont h2 { clear: both; }
                #mid.store .confirm_cont h3 { clear: left; margin: 0px; text-transform: uppercase; color: #000 ; float: left; border: 1px solid #a6a6a6; border-bottom: 1px solid #aaa; background: #ccc; padding: 5px; font-size: 1.1em; width: 150px}
                #mid.store .confirm_cont dl {clear: left; border: 1px solid #ccc; float: left; margin: 0px; margin-bottom: 20px; width: 513px}
                #mid.store .confirm_cont dt, #mid.store .confirm_cont dd { padding: 5px; float: left; margin: 0px; font-size: 1.1em; }
                #mid.store .confirm_cont dt {clear: left; background: #eaeaea; font-weight: bold; width: 150px; border-style: solid; border-color: #ccc; border-width: 0px 1px 1px 0px;}
                #mid.store .confirm_cont dd { background: #fff; width: 340px; height: 14px; border-style: solid; border-color: #eaeaea; border-width: 0px 1px 1px 1px}
                #mid.store .confirm_cont dt.st { width: 435px; text-align: right; border-top: 1px solid #ccc}
                #mid.store .confirm_cont dd.del { text-align: right; }
                    #mid.store .confirm_cont dd.del a { font-size: 1em; font-weight: normal; }
                #mid.store .confirm_cont dd.st { width: 55px; border-top: 1px solid #ccc}
                #mid.store .confirm_cont dd.e, #mid.store .confirm_cont dt.e { background: #ffffcb; color: #930; }

            /* Try */
            #mid.landing .try h1 { margin-top: -2px;}
            #mid.landing .try h2 {font-size: 1.1em; color: #000; font-weight: bold; text-transform: uppercase }
            #mid.landing .try p { margin-top: 0px; }
            #mid.landing .try dl { clear: both; float: left; margin: 0px}
            #mid.landing .try dt { float: left; width: 216px; }
            #mid.landing .try dd { float: right; width: 270px; padding: 20px 0px 10px 10px;margin: 0px;}
            
                #mid.landing .try dd h2 { margin: 0px; } 
                
                #mid.landing .try .formtable th { white-space: nowrap; text-align: left; padding: 3px 2px 3px 10px;  }
                #mid.landing .try .formtable td { padding: 3px 2px; }
                #mid.landing .try .formtable input { width: 200px; }
                
            /* User Profiles */
            #mid.landing .userprofile_index h1 { margin-top: 10px; }
            #mid.landing .userprofile_index h2 {font-size: 1.1em; color: #000; font-weight: bold; text-transform: uppercase }
            #mid.landing .userprofile_index p { margin-top: 0px; }
            #mid.landing .userprofile_index .form {display: none; }
                #mid.landing .userprofile_index .formtable th { white-space: nowrap; text-align: left; padding: 3px 2px 3px 10px;  }
                #mid.landing .userprofile_index .formtable td { padding: 3px 2px; }
                #mid.landing .userprofile_index .formtable input { width: 200px; }
           
            #mid.landing .userprofile .left { float: left; width: 147px; padding: 0px;}
                #mid.landing .userprofile .left ul { list-style: none; padding: 0px; margin: 0px 0px 5px 0px; width: 147px; }
                #mid.landing .userprofile .left ul li { padding: 5px 10px;  }
                    #mid.landing .userprofile .left ul .title {color: #fff; border: 0px; letter-spacing: .1em; font-weight: bold; font-size: 1.1em; }
                                    #mid.landing .userprofile .left ul .desc {border-style: solid; border-width: 0px 2px;}
                        #mid.landing .userprofile .left ul .desc a { font-weight: normal; font-size: 1em; color: #777; }
                        #mid.landing .userprofile .left ul .desc a:hover { color: #000; }
                    #mid.landing .userprofile .left ul .link { border-bottom-width: 0px; text-align: right; }
                    
                    #mid.mule .userprofile .left ul .title { background: url("/images/rect_list_mule_top.jpg") no-repeat top;}
                    #mid.mule .userprofile .left ul .desc {border-color: #333;  }
                    #mid.mule .userprofile .left ul { background: url("/images/rect_list_mule_btm.jpg") no-repeat bottom}
                
                #mid.landing .userprofile .left img { margin: 0px 0px 5px 0px; }            
            
            #mid.landing .userprofile .right { float: right; width: 350px; }
                #mid.landing .userprofile .right ul { background-image: none; list-style-type: disc; padding-left: 15px}
            
            /* Tour */
            #mid.landing .tour h1 { margin-bottom: 10px; }
            #mid.landing .tour h2 {font-size: 1.1em; color: #000; font-weight: bold; text-transform: uppercase }
            #mid.landing .tour .container { margin-bottom: 5px; }
            #mid.landing .tour .btm { margin-bottom: 30px; }
            #mid.landing .tour .L { width: 90px; }
            #mid.landing .tour .R { width: 350px; }
            
            /* Upgrade */
            #mid.landing .upgrade h1 { margin-bottom: 10px; }
            #mid.landing .upgrade h2 {font-size: 1.1em; color: #000; font-weight: bold; text-transform: uppercase }
            #mid.landing .upgrade .container { margin-bottom: 5px; }
            #mid.landing .upgrade .btm { margin-bottom: 30px; }
            #mid.landing .upgrade .L { width: 220px; margin-left: 0px; padding-left: 0px}
            #mid.landing .upgrade .R { width: 200px; }
                #mid.landing .upgrade .R h2 { margin-bottom: 0px; }
                #mid.landing .upgrade .R ul { margin-top: 5px; }
            
            
            
    #mid.landing .right { float: left; width: 150px; padding-top: 0px;}
        #mid.landing .right ul { list-style: none; padding: 0px; margin: 0px 0px 5px 6px; width: 147px; }
            #mid.landing .right ul li { padding: 5px 10px;  }
                #mid.landing .right ul .title {color: #fff; border: 0px; letter-spacing: .1em; font-weight: bold; font-size: 1.1em; }
                                #mid.landing .right ul .desc {border-style: solid; border-width: 0px 2px;}
                    #mid.landing .right ul .desc a { font-weight: normal; font-size: 1em; color: #777; }
                    #mid.landing .right ul .desc a:hover { color: #000; }
                #mid.landing .right ul .link { border-bottom-width: 0px; text-align: right; }
                
                #mid.mule .right ul .title { background: url("/images/rect_list_mule_top.jpg") no-repeat top;}
                #mid.mule .right ul .desc {border-color: #333;  }
                #mid.mule .right ul { background: url("/images/rect_list_mule_btm.jpg") no-repeat bottom}
                
                #mid.inspire .right ul .title { background: url("/images/rect_list_inspire_top.jpg") no-repeat top;}
                #mid.inspire .right ul .desc {border-color: #A17C02; }
                #mid.inspire .right ul { background: url("/images/rect_list_inspire_btm.jpg") no-repeat bottom;}
                
                #mid.fcontrol .right ul .title { background: url("/images/rect_list_flashnet_top.jpg") no-repeat top;}
                #mid.fcontrol .right ul .desc {border-color: #333; }
                #mid.fcontrol .right ul { background: url("/images/rect_list_flashnet_btm.jpg") no-repeat bottom;}
        
                #mid.store .right ul .title { background: url("/images/rect_list_base_top.jpg") no-repeat top;}
                #mid.store .right ul .desc {border-color: #5C5C5C; }
                #mid.store .right ul { background: url("/images/rect_list_base_btm.jpg") no-repeat bottom;}
        #mid.landing .right img { margin: 0px 0px 5px 6px; }
                
/* Product Specific Page Styles */

    a.bigbtn { display: block; width: 147px; height: 37px; }
    a.bigbtn span { margin-left: -999px; }    
        /* INSPIRE buttons */
        a.i_getinspired { background: url("/images/inspire/bigbtn_inspire.jpg") no-repeat; background-position: 100% 0px }
        a.i_getinspired:hover { background-position: 0% -37px; }

    .inspire .breadcrumbs span { color: #C69A05; }
    .fcontrol .breadcrumbs span { color: #851817; }
    .mule .breadcrumbs span { color: #447090; }
    
    #mid.product { padding: 0px; padding-bottom: 0px; width: 722px; }
    #mid.product .top { float: left; width: 722px; background: #f5f5f5; }
        #mid.product .top .product_name { float: left; display: inline; width: 160px; font-size: 1.2em; padding: 6px 0px; text-align: center; color: #000; font-weight: bold; margin-left: 10px; background: #CFCFCF; }
        #mid.product .top .breadcrumbs { text-transform: uppercase; display: inline; position: absolute; padding: 6px 0px 6px 9px; }
            #mid.product .top .breadcrumbs a { text-transform: uppercase; font-weight: normal; font-size: 1em; color: #777; }
            #mid.product .top .breadcrumbs a:hover { color: #000; }
        #mid.product .top .page_tools { float: right; display: inline; text-align: right; width: 145px; padding: 6px; margin-right: 5px}
            #mid.product .top .page_tools img { padding: 0px 2px; }
            
            .page_tools .sendfriend_tab {cursor: pointer; visibility: hidden; display: inline; position: absolute; border: 1px solid #999; background: #ccc; border-bottom: 1px solid #ccc; width: 20px; height: 20px; margin: -5px 0px 0px -24px;z-index: 110; padding-top: 4px;}
            .page_tools .sendfriend_cont {visibility: hidden; display: inline; position: absolute; margin: 20px 0px 0px -177px; border: 1px solid #999; background: #ccc; width: auto; height: auto; padding: 5px 10px; z-index: 100}
            .page_tools .formtable th { white-space: nowrap; text-align: left; padding-right: 5px; }
            .page_tools .formtable th,  .page_tools .formtable td { padding: 3px 2px; }
            .page_tools .formtable input { width: 150px; }

    #mid.product .left { clear: left; float: left; width: 553px; background: #fff url(/images/bg_product_left.gif) repeat-y; border-width: 1px 1px 0px 0px; border-style: solid; border-color: #D8D8D8; min-height: 550px}
        #mid.product .left .subnav { float: left; width: 155px; padding: 5px 5px 5px 10px; }
        
            #mid.product .left .subnav ul { margin: 0px; margin-bottom: 10px; padding-left: 5px; list-style: none}
                #mid.product .left .subnav ul ul { margin-bottom: 0px; }
                #mid.product .left .subnav a { font-size: 1em; font-weight: normal; color: #777; }
                    #mid.product .left .subnav a:hover { color: #000; }
                #mid.product .left .subnav li { padding: 2px 0px 0px 10px; }
                #mid.product .left .subnav li.current a { color: #000; text-decoration: none; font-size: 1.1em; font-weight: bold; }
                #mid.product .left .subnav .sub li { background: url("/images/ico_bullet.gif") left no-repeat; }
                
                
                /* Product Specific arrow */
                #mid.inspire .left .subnav li.current { background: url("/images/inspire/ico_arrow.gif") left no-repeat; }
                #mid.fcontrol .left .subnav li.current { background: url("/images/flashnet/ico_arrow.gif") left no-repeat; }
                #mid.mule .left .subnav li.current { background: url("/images/mule/ico_arrow.gif") left no-repeat; }
           
            #mid.product .left .subnav img { margin: 0px 0px 5px 6px; }
            #mid.product .left .subnav strong.reseller { color: #000; margin: 10px 0px 0px 15px; }
        
        #mid.product .left .content { float: left; width: 353px; padding: 10px;}
            #mid.product .left .content h1 {margin: 0px; font-size: 1.2em; color: #000;}
            #mid.product .left .content ol { padding: 0px 30px; margin: 0px; margin-top: 10px}
            #mid.product .left .content li { margin-bottom: 3px; }
            #mid.product .left .content li strong { display: block;}
            
            
        #mid.product .right { float: left; width: 140px; display: inline; padding-left: 6px;margin-left: 4px;}
            #mid.product .right img { margin-bottom: 5px;  }
            #mid.product .right ul { list-style: none; padding: 0px; margin: 0px 0px 5px 0px; text-align: left; width: 147px}
                #mid.product .right ul li { padding: 5px 7px; border-style: solid; border-width: 0px 2px; }
                    #mid.product .right ul .title {color: #fff; border: 0px; letter-spacing: .1em; font-weight: bold; font-size: 1.1em; }
                    #mid.product .right ul .desc {}
                        #mid.product .right ul .desc a { font-weight: normal; font-size: 1em; color: #777; }
                        #mid.product .right ul .desc a:hover { color: #000; }
                    #mid.product .right ul .link { border: 0px; text-align: right; }
     