html, body { height:100%; overflow:hidden; }

body { min-height:500px; }


/*-------------------------------------- blocks ------------------------------------*/
div.navigation {
    background:url(../images/skin/logo.png) no-repeat 10px 100%;
    padding:15px 0 7px 57px;
    overflow:hidden;
    font-size:14px;
}
div.navigation h2 {
    background:url(../images/skin/menu_folder_active.png) no-repeat 7px 50%;
    margin:0; padding:0 2px 0 77px;
    height:33px;
    display:block;
    float:left;
    vertical-align:middle;
    white-space:nowrap;
    font:normal 24px/30px Calibri, Arial, Helvetica, sans-serif;
}
div.navigation h2.project { background-image:url(../images/skin/menu_project_active.png); }
div.navigation h2.trash { background-image:url(../images/skin/menu_trash_active.png); padding-left:66px; }
div.navigation span {
    background:url(../images/skin/menu_project.png) no-repeat 5px 50%;
    padding:5px 2px 8px 46px;
    height:20px; line-height:20px;
    display:block;
    float:left;
    white-space:nowrap;
}
div.navigation span.home { background:none; padding-left:0; }


div.userbar a { color:#676767; }
div.userbar a:hover { color:#000; }


/*------------------------------------ toolbar -------------------------------------*/
div.toolbar { min-height:100%; position:relative; z-index:1; }
div.toolbar ul { padding:15px 0 150px 15px; font-size:12px; }
div.toolbar ul li { border:1px solid #acc2c3; background-color:#f4f4f4; margin-bottom:8px; width:100px; overflow:hidden; }
div.toolbar ul li a,
div.toolbar ul li div { padding:60px 0 4px; display:block; text-align:center; text-decoration:none; color:#000; }
div.toolbar ul li a:hover { /*text-decoration:underline;*/ color:#000; }
div.toolbar ul li span.title { display:none; }
div.toolbar ul li.upload a,
div.toolbar ul li.upload div { background:url(../images/skin/upload.gif) no-repeat 50% 0; }
div.toolbar ul li.upload object { cursor:pointer; }
div.toolbar ul li.folder-new a { background:url(../images/skin/new_folder.gif) no-repeat 50% 9px; }
div.toolbar ul li.project-new a { background:url(../images/skin/new_project.gif) no-repeat 50% 9px; }
div.toolbar ul li.trash {
    position:absolute; bottom:30px; z-index:1;
    border:none;
    background:none;
}
div.toolbar ul li.trash a { padding:65px 0 2px; text-decoration:underline; color:#676767; }
div.toolbar ul li.trash a:hover { color:#000; }
div.toolbar ul li.trash a { background:url(../images/skin/trash.png) no-repeat 50% 0; }
div.toolbar ul li.trash-wipe a { background:url(../images/skin/wipe.png) no-repeat 50% 9px; }


ul.tools { overflow:hidden; }
ul.tools li {
    border:1px solid #acc2c3;
    background:#f4f4f4;
    margin:0 3px 3px 0;
    display:block;
    height:22px; line-height:22px;
    float:left;
    font-size:11px;
}
ul.tools li a { text-decoration:none; color:#000; }
ul.tools li a:hover { text-decoration:underline; color:#000; }
ul.tools li.tool-edit a,
ul.tools li.tool-trash a,
ul.tools li.tool-wipe a,
ul.tools li.tool-restore a {
    display:block;
    width:22px; height:22;
    text-indent:-999px;
    overflow:hidden;
}
ul.tools li.tool-edit a { background:url(../images/skin/16x16_profile.gif) no-repeat 50% 50%; }
ul.tools li.tool-trash a { background:url(../images/skin/16x16_trash.gif) no-repeat 50% 50%; }
ul.tools li.tool-wipe a { background:url(../images/skin/16x16_wipe.gif) no-repeat 50% 50%; }
ul.tools li.tool-restore a { background:url(../images/skin/16x16_restore.gif) no-repeat 50% 50%; }
ul.tools li.tool-upload a,
ul.tools li.tool-upload span.swfupload { padding:0 7px 0 27px; display:block; height:22px; line-height:22px; }
ul.tools li.tool-upload a,
ul.tools li.tool-upload span.swfupload { background:url(../images/skin/22x22_upload.gif) no-repeat 0 50%; }


/*--------------------------------- folder & files ---------------------------------*/
ul.activity { height:43px; text-align:center; }
ul.activity li.new,
ul.activity li.comments {
    background:url(../images/skin/activity.png) no-repeat 999px 999px ;
    padding:5px 2px 0;
    width:28px; height:21px; line-height:21px;
    display:inline-block;
    text-align:center; text-shadow:1px 1px 1px rgba(0, 0, 0, 0.3);
    color:#fff;
    font-size:14px; font-weight:bold;
}
ul.activity li span { display:none; }
ul.activity li.new { background-position:2px -30px; }
ul.activity li.comments { background-position:2px 0; }
ul.activity li.quantity {
    text-align:center;
    color:#000;
    font-size:11px;
}
ul.activity li.quantity a { display:block; }
ul.activity li.quantity a,
ul.activity li.quantity a:hover { text-decoration:none; color:#000; }

div.file,
div.folder {
    position:relative; z-index:1;
    margin:0 5px 12px; padding-top:20px;
    width:239px; height:250px;
    display:inline-block;
    vertical-align:bottom;
}

div.file ul.activity,
div.folder ul.activity { position:absolute; z-index:2; margin-top:-31px; width:239px; }
div.file ul.activity li.quantity,
div.folder ul.activity li.quantity {
    position:absolute; top:-45px; z-index:2;
    width:239px;
}

div.file div.image img,
div.folder div.image img { border:1px solid #a6bdbf; }

div.file div.title,
div.folder div.title {
    width:239px;
    overflow:hidden;
    white-space:nowrap;
    color:#000;
    text-overflow:ellipsis; text-align:center;
    font-size:16px;
    letter-spacing:-1px;
}
div.file div.title small,
div.folder div.title small { color:#676767; font-size:9px; }
div.file div.title a,
div.folder div.title a,
div.file div.title a:hover,
div.folder div.title a:hover { text-decoration:none; color:#000; }
div.file div.title a:hover,
div.folder div.title a:hover { text-decoration:underline; }

div.file div.shares,
div.folder div.shares { padding-top:7px; text-align:center; line-height:15px; color:#676767; font-size:12px; }
div.file div.shares a.share,
div.folder div.shares a.share {
    background:url(../images/skin/share.gif) #0078a9 no-repeat 2px 50%;
    padding:0 2px 0 18px;
    display:inline-block;
    white-space:nowrap;
    text-decoration:none;
    color:#fff;
}
div.file div.shares a.share:hover,
div.folder div.shares a.share:hover {
    background-color:#4ca0c3;
    color:#fff;
}

div.file ul.tools,
div.folder ul.tools { position:absolute; top:10px; right:7px; z-index:10; visibility:hidden; }
div.file:hover ul.tools,
div.folder:hover ul.tools { visibility:visible; }


div.file div.image {
    width:239px; height:192px;
    text-align:center;
    display:table-cell;
    vertical-align:middle;
}


div.folder div.image {
    background:url(../images/skin/folder.png) no-repeat 0 66px;
    margin:0 auto;
    width:200px; height:192px;
}
div.folder div.image a {
    width:200px; height:190px;
    display:block;
    overflow:hidden;
    text-decoration:none;
    cursor:pointer; /* ie fix */
}
div.folder div.image b {
    position:absolute; z-index:1;
    background:url(../images/skin/folder.png) no-repeat -200px 66px;
    width:200px; height:190px;
    display:block;
}
div.folder div.image span {
    width:174px; height:175px;
    display:table-cell;
    vertical-align:middle;
    text-align:center;
}

div.project div.image {  background:url(../images/skin/project.png) no-repeat 0 53px; }
div.project div.image b { background:url(../images/skin/project.png) no-repeat -200px 53px; }
div.project div.image span { width:200px; }


/*------------------------------------ profile -------------------------------------*/
table.profile td.profile-user { padding:25px 20px 25px 30px; width:55%; }
table.profile td.profile-user table.form-h th { padding-top:13px; width:100px; text-align:right; }
table.profile td.profile-user input[type=text],
table.profile td.profile-user input[type=password] {
    width:243px;
    font-size:18px;
}
table.profile td.profile-user span.error { display:block; }
table.profile td.profile-user div.form { padding-top:20px; }
table.profile td.profile-info { padding:25px 30px 25px 20px; width:54%; }

div.profile-info { border:1px solid #e5e9eb; padding:7px 10px; font-size:14px; }
div.profile-info table.data th { padding-right:30px; }
div.profile-info div.buttons { margin:5px -10px -7px; }
div.profile-info div.notice,
div.profile-info div.warning { margin-top:7px; }

div.profile { margin:0 auto; max-width:1000px; }


div.plans { padding:0 30px 30px; }
div.plans table.price { border-bottom:1px solid #d9dad8; }
div.plans table.price th { padding-left:10px; }
div.plans table.price thead th { color:#b2b2b2; }
div.plans table.price thead th,
div.plans table.price thead td { padding:0; font-size:18px; }
div.plans table.price thead strong { display:block; line-height:1; font-size:60px; font-weight:normal; }
div.plans table.price thead var { display:block; }
div.plans table.price thead small {
    margin-top:-16px;
    height:16px; line-height:16px;
    display:block;
    white-space:nowrap;
    color:#80a3b2;
    font-size:12px;
}
div.plans table.price thead div {
    background:url(../images/skin/tariff_current.png) no-repeat -999px -999px;
    padding:50px 10px 20px;
    width:152px; height:104px;
}
div.plans table.price thead td div { margin:0 auto; }
div.plans table.price thead td.active div { background-position:50% 0; }


/*------------------------------------ layout --------------------------------------*/
header.layout {
    position:absolute; top:0; left:0; z-index:1;
    min-width:960px; width:100%; height:25px;
}
nav.layout {
    position:absolute; top:25px; left:0; z-index:1;
    background:url(../images/skin/header.gif) #e5e9eb repeat-x 0 100%;
    min-width:960px; width:100%; height:55px;
}
aside.layout {
    position:absolute; top:80px; left:0; bottom:0;
    background:url(../images/skin/aside.gif) repeat-y 0 0;
    width:135px;
}
section.layout {
    position:absolute; top:80px; right:0; bottom:0; left:0; z-index:1;
    overflow:auto; overflow-x:hidden;
    min-width:960px;
}
section.layout-aside { left:135px; min-width:825px; }