/*

    template: Artificial Intelligence
    author: luka cvrk (www.solucija.com)
    
*/

body { 
    margin: 0; 
    padding: 0; 
    background: #fff url(../images/bg.gif) repeat-x;
    font: normal .7em Tahoma, Verdana, Arial, Helvetica, Sans-Serif; 
    line-height: 1.6em; 
    color: #333; 
}

.bluebg {
   background: #D3D3FF url(../images/bluebg.gif) repeat-x;
}
.graybg {
   background: #ccc url(../images/graybg.gif) repeat-x;
}
/* LINKS AND HEADINGS STYLING */

a { color: #546F92; background: inherit; }
a:hover { color: #808080; background: inherit; }
h1  { font: bold 2em "Trebuchet MS", Helvetica, Sans-Serif; margin: 0; color: #fff; background-color:transparent; }
h2  { font: bold 1.4em "Trebuchet MS", Helvetica, Sans-Serif; }
h3 { clear: both; font-size: 1.1em; color: #000; background: transparent url(../images/h3bg.gif) no-repeat center left; padding: 0 14px; margin: 0;}
.blue { color: #546F92; background: inherit; }
.image { float: left; border: 2px solid #e2e2e2; padding: 3px; margin: 0 15px 10px 0; }

/* CONTENT WRAPPER */

#main { 
    width: 900px; 
    margin: 25px auto 0 auto;
}

/* TOP LEFT LOGO */

#logo { 
    float:left;
    height: 54px;
    background: transparent url(../images/logo.gif) no-repeat top left;
    padding-bottom:10px;
}
#logo h2 {
    padding:12px 0 0 60px;
    color:#fdd70d;
    font-size:26px;
    margin:0px;
}

/* TOP RIGHT HORIZONTAL MENU */
    
#menu {
    float: right; 
    /*background: transparent url(../images/barul.gif) no-repeat bottom right;*/
    color: #808080; 
    padding: 25px 0px 11px 0;
    margin: 0;
}
    #menu li { 
        padding: 14px 14px 14px 14px;
        color: #444; 
        background: transparent url(../images/bar.gif) no-repeat bottom left;
        display: inline;
        margin: 1px;
    }
    html>body #menu li{
         margin: 0px;
    }
    #menu li.active { 
        background: #DDC000 url(../images/baractive.gif) no-repeat bottom left;
        color: #8D9CAF; 
        font-weight: bold; 
        padding: 14px 14px 14px 14px;
        margin: 1px;
    }
    html>body #menu li.active {
         margin: 0px;
    }
    #menu li a { 
        background: #f8f8f8; 
        color: #808080; 
        text-decoration: none;
        font-weight:bold; 
    }   
    #menu li a:hover {
        color: #000; 
        background: #DDC000;
        font-weight:bold;
    }
    .key { text-decoration: underline; } /* ACCESKEY UNDERLINED LETTER */

/* LEFT INTRO SIDE */   

.intro_left {
    clear: left;
    float: left;
    width: 250px;
    height:202px;
    color: #E5EAF2;
    margin: -6px 0 1px 0;
}
#home_left {
    background: #242bff url(../images/byran.old.jpg);
}
    .intro_left a { color: #fff; background: inherit; }
    .intro_left p { padding: 14px 15px; margin: 0; }

    /* LEFT VERTICAL MENU */
    
    .menu_left { 
        float: left;  
        margin: 0 0 6px 0; 
        padding: 0 0 1px 0; 
        border-bottom: 2px solid #e2e2e2; 
    }
        .menu_left li { list-style: none; }
        .menu_left li a { 
            display: block; 
            color: #3F5B7F; 
            background: #a2a6ff url(../images/arrow.gif) no-repeat center left;
            width: 204px; 
            padding: 7px 23px 7px 23px; 
            margin: 0 0 1px 0; 
            font-weight: bold; 
            text-decoration: none; 
        }   
        .menu_left li a:hover { background: #9EB1C9 url(../images/arrow.gif) no-repeat center left; color: #fff;  }
/* RIGHT INTRO SIDE */
    
.intro_right {
    float: right;
    width: 340px;
    padding: 25px 170px 0 20px;
    color: #000000;
    margin: -6px 0 6px 0;
    height: 174px;
    border: 2px solid #e2e2e2;
}
html>body .intro_right {
    padding: 25px 280px 0 20px;
}
#home_right {
    background: #BCCEDA url(../images/intro.jpg) no-repeat;
}
    .intro_right h1 { margin: 27px 0 20px 0; }
    .intro_right p.white { width:450px; margin: 0;color: #FFF; background-color:transparent;font-size:12px; }
    .intro_right p { margin-top: -15px; }   
/* LEFT SIDE */
    
#left {
   padding-top:6px;
    float: left;
    width: 250px;
}
    .box {
        padding: 4px 15px;
        border: 1px solid #ccc;
        margin: 0 0 10px 0;
    }
    .note {
        padding: 15px 15px 20px 100px;
        border: 1px solid #CFCB66;
        margin: 0 0 5px 0;
        background: #FFFFAD url(../images/package.gif) no-repeat;
        color: #585616;
    }

/* RIGHT SIDE */

#right {
    float: right;
    width: 641px;
    border:#ccc 1px solid;
    margin-bottom:15px;

}
    .leftcol { 
        float: left; 
        padding: 10px 15px;
        width: 285px; 
        /*border:#ccc 1px solid;*/
        margin: 0 0 10px 0;
    }
    .rightcol { 
        float: right; 
        padding: 10px 15px;
        width: 285px; 
        /*border:#ccc 1px solid;*/
        margin: 0 0 10px 0;
        }
    .special {
        clear: both;
        margin:0px 0 0px 0;
        padding: 5px 20px;
        border-top: 1px solid #ccc;
        background: #eee;
        color: #444;
    }

/* FOOTER */

#footer { clear: both; padding: 5px; border-top: 1px solid #ccc; }