@charset "utf-8";

/* CSS Document */



html, body, div, h1, h2, h3, h4, h5, h6, ul, ol, dl, li, dt, dd, p, a, blockquote, pre, fieldset, table, th, td, textarea, input{

    margin: 0; padding: 0; }

/* td img {display: block;}*/

body {

    top: 0px;

    left: 0px;

    font-family: Verdana, Geneva, sans-serif;

    background: #bbb;

    margin: 0;

    padding: 0;

    font-size: 12px;

    /*    text-align: center;*/
}

body a {
    text-decoration: none;    
}

img {
    border: 0 none;
}

#pageWrapper {

    width: 960px;

    margin: 0 auto;

}

.clear {

    clear: both;

}

.transparent {

    filter:alpha(opacity=70);

    -moz-opacity:0.7;

    -khtml-opacity: 0.7;

    opacity: 0.7;

}

/*start header style*/

#header{

    height: 247px;

    position: relative;

    background: url(../img/top_background.jpg);

    background-repeat: no-repeat;

    width: 100%;

}

#headerWrapper {

    width: 800px;

    margin: 0 auto;



}

#topBar {

    background-color: black;

    height: 20px;

}

#logo {

    background: url(../img/logo.png);

    width: 264px;

    height: 118px;

    float: left;

}

#citylogo {

    background: url(../img/citylogo.jpg);

    width: 150px;

    height: 102px;

    float: left;
    position: relative;
    top: 18px;
    left:18px;

}

#searchBox {

    /*    position: relative;

    */    float: right;

    /*    right: 70px;*/

    background-color: black;

    /*    width: 180px;*/

    padding: 15px;

    padding-bottom: 5px;

    padding-top: 0px;



    -webkit-border-bottom-left-radius: 10px;

    -khtml-border-bottom-left-radius: 10px;

    -moz-border-bottom-left-radius: 10px;

    border-left-bottom-radius: 10px;



    -webkit-border-bottom-right-radius: 10px;

    -khtml-border-bottom-right-radius: 10px;

    -moz-border-bottom-right-radius: 10px;

    border-bottom-right-radius: 10px;

    border-radius: 0px 0px 10px 10px;

    /*       behavior: url(/css/PIE.htc);*/

    /*    border-radius: 0px 0px 10px 10px;*/



}

.searchButton {

    position: relative;

    /*    top: 8px;*/

}

.searchterm {

    padding: 0;

    margin-top: 0px;

    position: relative;

    top: -8px;

    -webkit-border-radius: 10px;

    -khtml-border-radius: 10px;

    -moz-border-radius: 10px;

    border-radius: 10px;



}

#footer{

    height: 141px;

    /*background: url(../img/footer.jpg);*/

    background-repeat: no-repeat;
    background-color:black;

}

#bottomBar {

    position: absolute;

    top: 210px;

    height:37px;

    width: 100%;

}

/* style the bottom bar of the header for every page */

#home #bottomBar {

    /*    position:relative;*/

    background-color: #33CC33;

    width:100%;

    /*    height:37px;*/

    /*    top: 190px;*/

}



#projects #bottomBar {

    /*    position:relative;*/

    background-color: #0999bc;

    /*    width:100%;*/

    /*    height:37px;*/

    /*    top: 190px;*/

}
#projects #bottomBar #user-authentication .loginButton {
    background-color: #022731;
    border-color:#0999bc;

}


#companies #bottomBar {

    /*    position:relative;*/

    background-color: #f76744;

    /*    width:100%;*/

    /*    height:37px;*/

    /*    top: 190px;*/

}
#companies #bottomBar #user-authentication .loginButton {
        background-color: #932206;
        border-color:#f76744;
}


#faq #bottomBar {

    /*    position:relative;*/

    background-color: #ffcc00;

    /*    width:100%;*/

    /*    height:37px;*/

    /*    top: 190px;*/

}
#faq #bottomBar #user-authentication .loginButton {
        background-color: #997A00;
        border-color: #ffcc00;
}



#aboutus #bottomBar {

    /*    position:relative;*/

    background-color: #ff0099;

    /*    width:100%;*/

    /*    height:37px;*/

    /*    top: 190px;*/

}

#aboutus #bottomBar #user-authentication .loginButton {
        background-color: #99005C;
         border-color:#ff0099;
}



#contact #bottomBar {

    /*    position:relative;*/

    background-color: #9900cc;

    /*    width:100%;*/

    /*    height:37px;*/

    /*    top: 190px;*/

}
#contact #bottomBar #user-authentication .loginButton {
        background-color: #4D0066;
           border-color:#9900cc;
}




#inside #bottomBar {

    /*    position:relative;*/

    background-color: #0999bc;

    /*    width:100%;

        height:37px;

        top: 190px;*/

}

#client #bottomBar {

    /*    position:relative;*/

    background-color: #f76744;

    /*    width:100%;

        height:37px;

        top: 190px;*/

}

/* header of each page */

#companies .page-heading {
    color: #f76744;
}

#companies .page-subheading{
    color: #f76744;
}

#aboutus .page-heading{
    color: #ff0099;
}
#aboutus .page-subheading{
    color: #ff0099;
}

#contact .page-heading{
    color: #9900cc;
}
#contact .page-subheading{
    color: #9900cc;
}
#contact .sidebar-content {
    background-color: #D966FF;
    padding-bottom: 5px;
}

#faq .page-heading{
    color: #E6B800;
}
#faq .sidebar-content {
    background-color: #FC0;
    padding-bottom: 5px;
}


#projects .page-heading{
    color: #0999bc;
}
#inside .page-heading{
    color: #0999bc;
}

#projects .page-subheading{
    color: #0999bc;
}

#home .page-heading{
    color: #33CC33;
}

#home .page-subheading{
    color: #33CC33;
}



/* style the footer's top bar for every page */



#home #fTopBar {

    /*    position:relative;*/

    background-color: #33CC33;

    width:100%;

    height: 3px;

}



#projects #fTopBar {

    /*    position:relative;*/

    background-color: #0999bc;

    width:100%;

    height: 3px;

}

#companies #fTopBar {

    /*    position:relative;*/

    background-color: #f76744;

    width:100%;

    height: 3px;

}



#faq #fTopBar {

    /*    position:relative;*/

    background-color: #ffcc00;

    width:100%;

    height: 3px;

}



#aboutus #fTopBar {

    /*    position:relative;*/

    background-color: #ff0099;

    width:100%;

    height: 3px;

}



#contact #fTopBar {

    /*    position:relative;*/

    background-color: #9900cc;

    width:100%;

    height: 3px;

}





#inside #fTopBar {

    background-color: #0999bc;

    width:100%;

    height: 3px;

}
#client #fTopBar {

    background-color: #f76744;

    width:100%;

    height: 3px;

}



#wrapper {

    margin:0 auto;

    width:800px;

}



#content {

    background-color: white;

}





#contentWrapper {

    padding-left: 5px;

    padding-right: 5px;

    margin: 0 auto;

    /*    border: 1px solid black;*/

    width: 900px;

    /*    min-height: 400px;*/

    background-color: white;

    padding-top: 8px;

    padding-bottom: 20px;

    display: inline-block;

    display: block;

    overflow: hidden;

}



#contentArea {

    /*    position: relative;*/

    float: left;

    /*    border: 1px solid #33CC33;*/

    width: 650px;

    min-height: 300px;

}



#sidebar {

    margin-left: 25px;

    float: left;

    /*    border: 1px solid #33CC33;*/

    width: 220px;

    /*    height: 300px;*/

    /*    background-color: #bbb;*/

}



.sidebar-content, .sidebar-usercontent {

    padding-top: 5px;
    padding-left: 5px;
    padding-right:5px;

    padding-bottom: 7px;

    background-color: #bfbebe;

    margin-top: 10px;

}


#home .sidebar-content {
    background-color: #5DD55D;
}
#projects .sidebar-content {
    background-color: #9EE8FA;
    padding-bottom: 5px;
}

#projects a .sidebar-content   {
    background-color: #3CD1F6;
    text-decoration: none;
    color:white;
    text-align:  center;
    font-weight: bold;

}
#projects  a:visited .sidebar-content  {
    /*    background-color: #3CD1F6;*/
    text-decoration: none;
}

#projects a:hover .sidebar-content  {
    background-color: #0999BC;
    text-decoration: none;
    /*    color:blue;*/
}

#projects  a:active .sidebar-content  {
    /*    background-color: #3CD1F6;*/
    text-decoration: none;
}


#companies .sidebar-content {
    background-color: #FA9C85;
}
#aboutus .sidebar-content {
    background-color: #FF80CC;
}

.sidebar-title {

    /*color: #706e6e;*/
    color: white;

    font-size: medium;

    padding: 5px;
    margin-bottom: 10px;

    text-align: center;

    background-color: #4D4D4D;

    border-top-left-radius: 10px 10px;
    border-top-right-radius: 10px 10px;
    border-bottom-right-radius: 10px 10px;
    border-bottom-left-radius: 10px 10px;
}

.user-space-menu {

    position: relative;

    font-size: 12px;

    margin: 0 auto;

    margin-left: 7%;




}

ul {
    list-style: square;
}

.user-space-menu ul {

    display: block;

    list-style: none;
    margin-left: 0px;
}
.user-space-menu li {

    margin-left: 0px;

}



.user-space-menu a {

    text-decoration: none;

    color: black;

}



#footer {

    clear: both;

}

#user-authentication {

    background-color: #333333;

    padding: 15px;

    margin: 0 auto;

}



#user-authentication .loginInput {

    background-color: black;

    border: 1px solid grey;

    color: white;

    padding: 2px;

    margin-top: 10px;

    width: 180px;


}

#user-authentication .loginButton {

    border: 1px solid grey;

    position: relative;

    padding: 2px;

    margin-top: 10px;

    -webkit-border-radius: 6px;

    -khtml-border-radius: 6px;

    -moz-border-radius: 6px;

    border-radius: 6px;

}

#bottomBar #user-authentication {

    background-color: inherit;
    padding: 0px;
    padding-left: 10px;


    margin: 0 auto;
position: relative;
float: right;
right: 35px;
top: 7px;
}

#bottomBar #user-authentication .loginInput {
    margin-top: 0px;
        width: 100px;
            font-size: 12px;
            height: 16px;
}

#bottomBar #user-authentication .loginButton {
    margin-top: 0px;


border-color: #33CC33;
background-color: #1F7A1F;
color: white;
cursor:pointer;
}





.page-heading {
    color: #999999;
    padding-top: 5px;
    padding-bottom: 3px;
    font-size: large;
    font-weight: bold;
}



.page-subheading {

    padding-top: 5px;
    color: #999999;
    padding-bottom: 2px;
    font-size: small;
    font-weight: bold;
}

.page-paragraph {

    padding-top: 3px;

    padding-bottom: 2px;

    color: #555454;

}



.testimonial-box {

    padding-top: 5px;

    padding-bottom: 2px;

    margin-left: 5%;

    margin-right: 5%;

    color: black;

    font-size: smaller;

    font-style: italic;

}



.testimonial-header {

    color: #0D732F;

    font-weight: bold;
    font-style: normal;

}

#aboutus .testimonial-header {

    color: #333333;
}

.testimonial-more {

    color: #555454;

    text-decoration: none;

    display: block;

    float: right;

}



.home-link {

    text-decoration: none;

    color: #33CC33;



}

.company {
    width: 100%;
    margin-bottom: 30px;
    margin-top: 20px;
    padding-bottom: 20px;
}



.company-left {
    width: 300px;
    float: left;
}


.project {

    width: 270px;
    height: 250px;

    float: left;

    /*    border: 1px solid #0398CA;*/

    margin: 25px;

    padding: 1px;

}


.project img{

    text-decoration: none;

    border: 0px;



}


.inside-button {
    border: 1px solid black;
    background-color: #0999bc;
    color: white;
    padding: 2px;
}

a {
    text-decoration: none;
}

.linkbutton {
    background-color: #3C3;
    color: white;
    font-size: large;
    padding: 15px;
    margin-bottom: 10px;
    text-align: center;
    border-top-left-radius: 10px 10px;
    border-top-right-radius: 10px 10px;
    border-bottom-right-radius: 10px 10px;
    border-bottom-left-radius: 10px 10px;
}

.linkbutton:visited{
    text-decoration: none;
    background-color: #3C3;
    color: white;
}


.linkbutton:hover{
    text-decoration: none;
    background-color: green;
    color: white;
}



a:hover {
    text-decoration: underline;
}

.container {
    position: relative;
    width: 100%;
    padding: 10px;
}



.input {
    position: relative;
    float: left;
    width: 500px;
    border: 0px solid #CCC;
    padding: 4px;
}

#projects .input {
    position: relative;
    float: left;

    border: 0px solid #CCC;


width: 260px;
padding: 4px;
}

#inside .input {
    border: 1px solid #CCC;
}

.input li, #optional_text li, #accordion li {
    margin-left: 15px;
}

.edit-ico {
    position: absolute;
    right: 4px;
    padding: 2px;
    bottom: 1px;
}

.edit {
    position: relative;
    display: block;
    background-image: url('../img/edit.png');
    background-repeat: no-repeat;
    background-position: bottom right;
    height: 16px;
    border: 0px;
}
.area {
    background-image: url('../img/edit.png');
    background-repeat: no-repeat;
    background-position: bottom right;
    min-height: 32px;
}

.faq-content {

}
.faq-question {
    background-color: #FFD633;
    color: #333;
    font-size: medium;
    padding: 10px;
    text-align: left;
    -moz-border-radius-topleft: 10px;
    -moz-border-radius-topright: 10px;
    border-top-left-radius: 10px 10px;
    border-top-right-radius: 10px 10px;
}
.faq-answer {
    background-color: #FFF0B3;
    color: black;
    font-size: small;
    padding: 10px;
    margin-bottom: 20px;
    text-align: left;
    -moz-border-radius-bottomright: 10px;
    -moz-border-radius-bottomleft: 10px;
    border-bottom-right-radius: 10px 10px;
    border-bottom-left-radius: 10px 10px;
}

.loginName {
    left: 100px;
    position: relative;
    top: 8px;
    background: transparent;
    color: white;
    border: 1px solid grey;
}

#group-page table {
    padding: 10px;
    vertical-align: top;
}

.leftcol {
    width:150px;
    vertical-align: top;
}

.devteam {
    height:110px;
}



#footer a {
    color:white;
    /*    padding-left: 10px;
        padding-right: 10px;
        padding-top: 20px;*/
}

#footerNavigation{
    float:right;
    position: relative;
    top: 10px;
    right: 10px;
}

#footerNavigation ul {
    list-style-type: none;
}

#footerNavigation li {
    float: left;
    padding-left: 15px;
    margin: 0px;
}

#footertext {
    position:relative;
    float:right;
    right: 10px;
    top:30px;
    color: grey;
    text-align: right;
    font-size: smaller;
}
#footertext p {
    padding-top: 5px;
}
#footertext a, #footertext a:hover, #footertext a:visited {
    color:grey;
    text-decoration: none;
}

.label {
    position: relative;
    float: left;
    width: 100px;
    padding:4px;


    color:grey;
    text-align: right;
}
#projects .labeltext {
    /*    color: #3CD1F6;*/

}

#yearmenu {
    text-align: center;
    color: #0999BC;
    font-weight: bold;
}

a.readmore {
    position: relative;
    float: left;
    background: url(../img/readMore0.png);

    background-repeat:no-repeat;

    width: 264px;

    height: 54px;
    left: 40px;

}
a.readmore:hover {

    background: url(../img/readMore_rol.png);

    background-repeat:no-repeat;


}
a.becomeclient {
    position: relative;
    float: right;
    background: url(../img/becomeClient.png);

    background-repeat:no-repeat;

    width: 264px;

    height: 54px;
    right: 40px;
}
a.becomeclient:hover {

    background: url(../img/becomeClient_rol.png);

    background-repeat:no-repeat;


}

#screenshot {
    float: left;
    border: 1px;
    border-color: black;
    width:240px;
    padding: 10px;
    padding-left:0px;

}

#projectInfo {
    float:right;
    border: 1px;
    border-color: black;
    width : 380px;
    padding: 10px;
    padding-top: 0px;

}

#clientArea {
    float: left;
    width:240px;
    padding: 10px;
    padding-left:0px;
}

#group-logp {
    width: 240px;

}


#devteam{
    float: right;
    width : 380px;
    padding: 10px;

}
#clientreps {
}

#clientreps .photo {
    float: left;
    padding:  10px;
}

#clientreps .name {
    padding:  10px;
}

div.clientrep {
   width: 240px;
height: 120px;
float: left; 
}


.studentphoto {
    float: left;
    padding-right:  15px;
}
.studentinfo {
    float: left;
    padding-right:  14px;
}

.miniuserprofile {
    display:none;
    z-index: 25;
    display:block;
    position:absolute;
    top:0px; left:0px; /*width:20em;*/
    border:0px solid #0cf;
    /*                   background-color:#3CD1F6;*/
    color:#000;
    /* text-align: center */	width:300px;
    height: 250px;
    background: url('../img/frame.png') no-repeat;
}

/* display tooltips */
a.info{
    position:relative; /*this is the key*/
    z-index:24;

    color:#000;
    text-decoration:none}

a.info:hover{
    z-index:25;

}

a.info span{display: none}

a.info:hover span{ /*the span will display just on :hover state*/
                   display:block;
                   position:absolute;
                   top:-50px; left:20px; /*width:20em;*/
                   border:0px solid #0cf;
                   /*                   background-color:#3CD1F6;*/
                   color:#000;
                   /* text-align: center */	width:300px;
                   height: 250px;
                   background: url('../img/frame.png') no-repeat;
}

.hiddendiv {
    color: white;
    background:#E7F9FE;
    display:none; /*--Hides by default--*/
    padding:15px;
    position:absolute;
    z-index:1000;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    min-width: 300px;
}

.shadow {

    -moz-box-shadow: 3px 3px 4px #ddd;

    -webkit-box-shadow: 3px 3px 4px #ddd;

    box-shadow: 3px 3px 4px #ddd;

    /* For IE 8 */

    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#dddddd')";

    /* For IE 5.5 - 7 */

    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#dddddd');

}

#result {
    background-color: blue;
color: white;
padding: 5px;
}

.error {
    border: 1px solid red;
color: red;
padding: 5px;
margin-top:5px;
}