/**
 * Wialus Website
 * http://www.wialus.co.nz/
 *
 * Copyright (c) 2010 Wialus Solutions Limited
 * All rights reserved. Sole property of Wialus Solutions Limited
 * http://www.wialus.co.nz
 *
 * $Date$
 * $Revision$
 * $LastChangedBy$
 * $HeadURL$
*/

@media all
{
    html{
        height:100%;
    }
    body{
        height:100%;
        background: #EEEEEE url(/img/bg-body-top.png) repeat-x ;
    }
    .cursor{
        cursor:pointer;
    }
    .clear{
        clear:both;
    }
    sup{
        font-size:60%;
        margin:0;
        padding:0;
        line-height:inherit;
        line-height: 60%;
        font-style:normal !important;

    }
    ul.list, ol.list{
        margin-left:20px;
    }
        ul.list li{
            margin-bottom:4px;
            padding-left:5px;
        }
        ol.list li{
            margin-bottom:10px;
            padding-left:5px;
        }

    .movie-container{
        padding:20px 0 15px 0;
    }

    .login-button{
        background: url(/img/btn-login.png) 0 0 no-repeat;
        height:35px;
        width:105px;
    }
        .login-button:hover{
            background-position: 0 -36px ;
            cursor:pointer;
        }

    .submit-button{
        background: url(/img/btn-submit.png) 0 0 no-repeat;
        height:35px;
        width:105px;
    }
        .submit-button:hover{
            background-position: 0 -36px ;
            cursor:pointer;
        }
    #player{
        width:600px;
        height:480px;
        display:block;
    }

    .banner{
        background-repeat:no-repeat !important;
        width:893px;
        height:222px;
        position:relative;
    }
    .table-heading{
        margin-bottom:8px;
        margin-left:9px;
    }

        /*Banners*/
        #banner-about{
            background: url(/img/banner-about-us.jpg);
        }
        #banner-contact{
            background: url(/img/banner-contact-us.jpg);
        }
        #banner-login, #banner-nda, #banner-error{
            background: url(/img/banner-log-in.jpg);
        }
        #banner-my-wialus{
            background: url(/img/banner-about-us.jpg);
        }
        #banner-privacy{
            background: url(/img/banner-about-us.jpg);
        }
        #banner-sitemap{
            background: url(/img/banner-about-us.jpg);
        }
        #banner-support{
            background: url(/img/banner-support.jpg);
        }
        #banner-terms-of-use{
            background: url(/img/banner-about-us.jpg);
        }
        #banner-tools-and-widgets{
            background: url(/img/banner-tools-widgets.jpg);
        }
        #banner-what-we-do{
            background: url(/img/banner-what-we-do.jpg);
        }
        #banner-wivolo{
            background: url(/img/banner-wivolo-home.jpg);
        }
        #banner-wivolo-tiler{
            background: url(/img/banner-wivolo-tiler.jpg);
        }

    .table-data{
        vertical-align:top;
        width:90%;
        margin-left:10px;
    }
    .table-data td{
        padding-bottom:10px;
    }
        .modules-td-product{
            width:130px;
        }
        #main{
            position:relative;
            width:100%;
            margin:0 auto;
            background-position:39px 0px;
        }
        #top{
            width:950px;
            height:130px;
            margin:0 auto;
         }
            #logo{
                margin-top:15px;
            }
            #heading-text{
                margin-left:15px;
            }

            #menu-wivolo{
                background:url('/img/nav-wivolo.png') 0 0;
                width:79px;
            }
            #menu-wivolo-tiler{
                background:url('/img/nav-wivolo-tiler.png') 0 0;
                width:106px;
            }
            #menu-about{
                background:url('/img/nav-about-us.png') 0 0;
                width:92px;
            }

            #menu-whatwedo{
                background:url('/img/nav-what-we-do.png') 0 0;
                width:111px;
            }
            #menu-tools{
                background:url('/img/nav-tools-widgets.png') 0 0;
                width:136px;
            }
            #menu-news{
                background:url('/img/nav-news.png') 0 0;
                width:69px;
            }
            #menu-support{
                background:url('/img/nav-support.png') 0 0;
                width:86px;
            }
            #menu-contact{
                background:url('/img/nav-contact-us.png') 0 0;
                width:104px;
            }
            #menu-login{
                background:url('/img/nav-login.png') 0 0;
                width:69px;
                float:right;
            }
            #menu-my-wialus{
                background:url('/img/nav-my-wialus.png') 0 0;
                width:97px;
            }
            #menu-logout{
                background:url('/img/nav-logout.png') 0 0;
                width:69px;
                float:right;
            }
            #menu{
                position:relative;
                bottom:0px;
                height:36px;
                width:950px;
                background: url(/img/bg-nav.png) no-repeat;
                margin-top:10px;
            }
                #menu-list{
                    list-style:none;
                    margin-left:1px;
                }
                #menu-list a{
                    color:#FFF;
                }
                    .menu-list-item{
                        float:left;
                        height:35px;
                        line-height:35px;
                        background-repeat: no-repeat !important;
                    }
                    .menu-list-active{
                        background-position: 0 -72px !important;
                    }
                    .menu-list-hover{
                        background-position: 0 -36px !important;
                    }

                        #menu-list li a{
                            text-decoration:none;
                            font-size:14px;
                            font-weight:bold;
                            text-align:center;
                            display:block;
                            height:35px;
                        }
                #menu-search{
                    width:180px;
                    height:23px;
                    float:right;
                }
                    #menu-search-input{
                        position:relative;
                        top:6px;
                        background: url(/img/bg-search.png) no-repeat ;
                        border:none;
                        width:140px;
                        height:23px;
                        float:left;
                        padding-left:8px;
                    }
                    #menu-search-button{
                        position:relative;
                        top:6px;
                        height:23px;
                        border:none;
                    }
        #bg-corners-top{
            width:950px;
            height:5px;
            background:url(/img/bg-corners-top.png) no-repeat;
            margin:0 auto;
        }
        #bg-corners-bottom{
            width:950px;
            height:6px;
            background:url(/img/bg-corners-bottom.png) no-repeat;
            margin:0 auto;
        }
        #banner{
            width:890px;
            margin:0 auto;
            background:#FFF;
            padding:20px 30px;
            position:relative;
        }
            .banner-submenu{
                background:url(/img/bg-trans-black-65.png);
                color:#FFF;
                position:absolute;
                bottom:10px;
                padding:16px;

            }
                .banner-submenu-title{
                    font-size:25px;
                    color:#fff;
                }
                    .banner-submenu-title a{
                        text-decoration:none !important;
                    }
                    .banner-submenu-title a:hover{
                        color:#2A90C4 !important;
                    }
                .banner-submenu a{
                    color:#FFF !important;
                    text-decoration:underline;
                }
                .banner-submenu a:hover{
                    text-decoration:none !important;
                }
                .banner-submenu-wivolo-link{
                    color:#fff !important;
                    font-size:14px;
                    margin-left:3px;
                    margin-right:3px;
                    padding-bottom:6px;
                    text-decoration:underline;
                }
                .banner-submenu-active{
                    background:url(/img/banner-link-active.png) bottom center no-repeat;
                    text-decoration:none !important;
                }

        #content{
            width:890px;
            padding:30px;
            padding-top:0px;
            padding-bottom:5px;
            margin:0 auto;
            overflow:auto;
            background:#fff;
        }

        .left-column{
            width:600px;
            padding-bottom:10px;
            float:left;
        }
        .right-column{
            float:right;
            width:250px;
            padding:0 10px;

        }
        .heading-dotted-bottom{
            font-size:14px;
            color:#888;
            font-weight:bold;
            border-bottom:1px dotted #999;
            padding-bottom:5px;
            margin-bottom:3px;
        }
        .heading-dotted-bottom a{
            text-decoration:none;
            color:#888;
        }
        #bread-crumb{
            padding-top:10px;
            font-size:11px;
            color:#999 !important;
            clear:both;
            width:600px;
            border-top:1px dotted #999;

        }
        #bread-crumb a{
            color:#999 !important;
        }
        #footer{
            background: url(/img/bg-footer.png) repeat-x bottom;
            margin:20px auto 0 auto;
            position:relative;
            height:200px;
        }

            #footer-content{
                position:relative;
                margin:0 auto;
                height:125px;
                width:900px;
                background:#FFF;
                padding:20px 25px 25px 25px;
                padding-bottom:0px;
            }
                #footer-top{
                    position:absolute;
                    right:30px;
                    top:0px;
                    width:48px;
                    height:15px;
                    background: url(/img/bg-back-top.png) no-repeat;

                    background-position:0 0;
                    display:block;
                }
                #footer-wialus{
                    position:absolute;
                    right:30px;
                    top:60px;
                }
                .footer-links-heading{
                    float:left;
                    text-align:left;
                    padding:0;
                    margin:0;
                    color:#B1b1b1;
                    font-size:14px;
                    width:400px;
                    font-weight:bold;
                    padding-bottom:10px;
                }
                .footer-links-ul{
                    list-style:none;
                    float:left;
                }
                .footer-spacer{
                    margin-left:20px;
                }
                    .footer-links-ul li{
                        background:url('/img/tiles-small.png') 0 9px no-repeat;
                        border-top:1px dotted #999 ;
                        padding:3px;
                        padding-left:17px;
                        height:18px;
                        line-height:18px;
                        margin-right:20px;
                        width:150px;
                    }
                    .footer-links-li-bottom{
                        border-bottom:1px dotted #999;
                    }
                    #footer-table td a{
                        color:#2A90C5;
                        font-size:12px;
                        font-weight:bold;
                    }
                #footer-copyright{
                    padding-top:9px;
                    text-align:center;
                    font-size:10px;
                    color:#b1b1b1;
                    font-weight:bold;
                    margin-top:8px;
                    clear:both;
                }

            #footer-bottom-shadow{
                width:984px;
                margin:0 auto;
                height:26px;
                background:url(/img/bg-page-bottom.png) no-repeat;
            }

    #wivolo-home-banner-content{
        position:absolute;
        left:30px;
        top:25px;
        width:440px;
        height:180px;
    }
        #wivolo-home-banner-title{
            margin-top:10px;
            font-style:italic;
            font-size:18px;
            color:#EEE;
        }
        #wivolo-home-banner-text{
            color:#EEE;
            font-size:13px;
            width:300px;
            margin-top:20px;
            margin-bottom:20px;
        }
        #wivolo-learn-more-btn{
            background:url(/img/btn-wivolo-learn-more.png) no-repeat 0 0;
            width:200px;
            height:35px;
        }
            #wivolo-learn-more-btn:hover{
                background-position: 0 -36px;
            }
            #wivolo-learn-more-btn a{
                width:100%;
                display:block;
                height:100%;
            }

        /* wivolo banners */
        #wivolo-product-banner-how-can-wivolo-help{
            background-image:url(/img/wivolo-product-how-can-wivolo-help.jpg);
        }
        #wivolo-product-banner-how-does-wivolo-work{
            background-image:url(/img/wivolo-product-how-does-wivolo-work.jpg);
        }
        #wivolo-product-banner-learn-more{
            background-image:url(/img/wivolo-product-learn-more.jpg);
        }
        #wivolo-product-banner-modules{
            background-image:url(/img/wivolo-product-modules.jpg);
        }
        #wivolo-product-banner-overview{
            background-image:url(/img/wivolo-product-overview.jpg);
        }
        #wivolo-product-banner-features{
            background-image:url(/img/wivolo-product-features.jpg);
        }

    .wivolo-home-section{
        padding-right:10px;
        margin-top:20px;
        width:285px;
        float:left;
    }
        .wivolo-home-section-img{
            margin-right:10px;
            float:left;
        }
        .wivolo-home-section-link {
            font-size:14px;
        }
        .wivolo-home-section-text {
            margin-top:5px;
        }

    #wivolo-side-content{
        width:270px;
        float:right;
    }
        .wivolo-sidecontent-section{
            clear:both;
            border-top:1px dotted #999;
            padding-bottom:14px;
        }
            .wivolo-sidecontent-img{
                padding:8px 8px 5px 5px;
                float:left;
            }
            .wivolo-sidecontent-link{
                padding-top:6px;
                padding-bottom:2px;
            }
            .wivolo-sidecontent-text{
                font-size:12px;
                padding-left:73px;
            }


    .about-photo-main{
        float:right;
        padding-left:10px;
    }
    .list-heading{
        margin-bottom:3px;
    }
    .wialus-bullet-point{
        list-style-type: none;
        margin-bottom:9px;
    }
        .wialus-bullet-point li{
            list-style-image: url(/img/tiles-small.png);
            background-repeat: no-repeat;
            background-position: 0px 0px;
        }
    #site-map-list{
        margin-left:20px;
        margin-bottom:20px;
    }
    .site-map-heading{
        font-size:15px;
        margin:0 3px;
    }
        .site-map-sub{
            margin-left:30px;
            font-size:13px;
        }

    #demo{

    }
        .demo-loading{
            height:400px;
            background: url(/img/loading.gif) no-repeat center center #eee; 
        }
        #demo-content{
            margin-top:10px;
        }
        #demo-screenshot{
            float: right;
            margin-right: 15px;
        }
        #demo-os{
            margin-top: 25px;
        }
            .demo-os-span-active{
                color: #2A90C4;
/*                text-shadow: 1px 1px 1px #CCCCCC;*/
            }
            #demo-os span{
                font-weight:bold;
                font-size: 16px;
                float:left;
                
                margin: 0;
                padding: 0;
                width:86px;
                text-align:center;
                cursor:pointer;
            }
            .demo-os-icon{
                background: url("/img/operating-systems.jpg") no-repeat transparent;
                width:36px;
                height:37px;
                margin: 5px auto;
            }

            #demo-os-windows div{
                background-position:0 -37px;
            }
                .demo-os-windows-active{
                    background-position:0 0 !important;
                }
            
            #demo-os-mac div{
                background-position:-36px -37px;
            }
                .demo-os-mac-active{
                    background-position:-36px 0 !important;
                }
            #demo-os-linux div{
                background-position:-72px -37px;
            }
                .demo-os-linux-active{
                    background-position:-72px -0 !important;
                }
            #demo-os-mobile div{
                background-position:-108px -37px;
            }
                .demo-os-mobile-active{
                    background-position:-108px 0 !important;
                }

        .demo-os-content{
            float: left;
            margin-top: 20px;
            margin-left:35px;
            width:344px;
        }
            
        #demo-form{
            width:240px;
            border: 1px solid #EEEEEE;
            border-radius: 5px 5px 5px 5px;
            padding: 10px 12px 6px;
            text-align: center;
        }
            #demo-invalid{
                background-color: #FFEEEE;
                border: 1px solid #F70C3B;
                border-radius: 3px 3px 3px 3px;
                color: #FF0000;
                font-weight: bold;
                margin-bottom: 5px;
                padding: 2px;
            }
            #demo-code{
                font-size:18px;
            }
            #demo-input{
                font-size:18px;
                border:1px solid #999;
                border-radius:4px;
                -moz-border-radius:4px;
                -webkit-border-radius:4px;
                padding:3px;
                width:90px;
            }
                .demo-invalid{
                    border:1px solid #f00 !important;
                }
            
            #demo-download{
                cursor: pointer;
                display: block;
                margin: 3px auto;
            }
            #demo-contact{
                font-size: 12px;
                width: 240px;
                padding:0;
                margin:0;
            }
}