/* =================== Shell Styles =================== */

/* ----- Tabs ----- */
#tabs ul .flipcharts a{height:105px;background:url(../images/tabs/flipcharts.png) no-repeat;}
#tabs ul .flipcharts a.on{background:url(../images/tabs/flipcharts-on.png) no-repeat;}

/* ----- Reversed Tabs ----- */
body.reverse #tabs ul .flipcharts a{background:url(../images/tabs/flipcharts-reversed.png) no-repeat right top;}
body.reverse #tabs ul .flipcharts a.on{background:url(../images/tabs/flipcharts-on-reversed.png) no-repeat;}

/* =================== Flipchart Styles  =================== */
#flipchart_folders{display:block;margin-top:36px;}

#flipchart_folders .folder-title{clear:both;}
#flipchart_folders .folder-title .delete{float:right!important;}
#flipchart_folders .folder-title .delete a{width:39px;height:28px;display:block;text-indent:-10000px;overflow:hidden;background:url(../images/extended/delete-folder.png) no-repeat;}

#flipchart_folders .flipcharts{display:block;padding:10px 10px 0;}

#flipchart_folders .flipcharts .flipchart{padding:0 0 10px;overflow:hidden;}
#flipchart_folders .flipcharts .flipchart .flipchart-icon{margin:0 10px 0 0;float:left;}
#flipchart_folders .flipcharts .flipchart .flipchart-icon a img{width:33px;height:41px;box-shadow:#000 1px 1px 3px;}
#flipchart_folders .flipcharts .flipchart .description{min-height:17px;}
#flipchart_folders .flipcharts .flipchart .actions{height:24px;overflow:hidden;}
#flipchart_folders .flipcharts .flipchart .actions a{height:24px;float:left;display:block;text-indent:-10000px;overflow:hidden;}
#flipchart_folders .flipcharts .flipchart .actions .delete{width:83px;margin:0 10px 0 0;background:url(../images/extended/delete-bookmark.png) no-repeat;}
#flipchart_folders .flipcharts .flipchart .actions .information{width:108px;margin:0 10px 0 0;background:url(../images/extended/information.png) no-repeat;}

#flipchart_pages{margin-top:8px;}
#flipchart_pages .flipchart-title{font-size:1.15em;}
#flipchart_pages .flipchart-page-ctrl{padding:4px; height:34px;background:url(../images/extended/folder-ctrl-bg.png) repeat-x;}
#flipchart_pages .flipchart-page-ctrl .new_page{line-height:14px;width:109px;height:30px;display:block;text-indent:-10000px;overflow:hidden;background:url(../images/flipcharts/buttons/new-page.png) no-repeat;border:none;cursor:default;}
#flipchart_pages .flipchart-page-list{height:318px;background:#fff;margin:6px;border-radius:6px;padding:4px;color:#000;overflow-y:auto;overflow-x:hidden;}
#flipchart_pages .flipchart-page-list li.alt-row{background:url(../images/flipcharts/page-item-background.png) no-repeat;}
ul.flipchart-page{overflow:hidden;padding:4px 6px 3px 6px; width:202px;}
ul.flipchart-page li{float:left;margin:0 6px 2px 0;}
ul.flipchart-page li.flipchart-page-title a{color:#000 !important}
ul.flipchart-page li.flipchart-page-delete{float:right !important;}
ul.flipchart-page li.flipchart-page-delete a{display:block;height:23px;width:23px;text-indent:-10000px;background:transparent url(../images/shared/close.png) no-repeat;margin-right:3px;}
#page_list .current-page{background:url(../images/flipcharts/page-item-on-background.png) no-repeat;}

div.flipchart-resource{cursor:move;}
div.flipchart-resource img{cursor:pointer;}
div#map div.delete{width:10px;height:10px;position:absolute;top:0;right:0;border-radius:4px;}
div#map div.delete a{width:10px;line-height:9px;display:block;background:#ff0000;color:#fff;font-weight:bold;text-align:center;border-radius:4px;cursor:pointer;}

div#dragHandles div.dragHandle {height:6px;width:6px;background:white;border:1px solid black;}


/* =================== Flipchart Resources =================== */
#flipchart-resources{margin:0 0 0 -475px;padding:35px 10px 0;position:absolute;bottom:0;left:50%;z-index:1002;background:url(../images/flipcharts/bgs/flipchart-resources.png) repeat;border:2px solid #e0e1e6;border-radius-topleft:10px;border-radius-topright:10px;border-bottom:none;}
#flipchart-resources h2{padding:0 0 35px;color:#fff;font-size:14px;}

/* ----- Handle ----- */
#flipchart-resources .handle{width:940px;position:absolute;top:0;left:0;cursor:default;}

/* ----- Minimise Button ----- */
#flipchart-resources .close{position:absolute;top:-10px;right:-11px;z-index:1000;}

/* ----- add-resource-link ----- */
#flipchart-resources .add-resource-link{position:absolute;top:33px;right:13px;}
#flipchart-resources .add-resource-link a{width:147px;height:29px;background:url(../images/flipcharts/buttons/import-new-resource.png) no-repeat;display:block;text-indent:-1000px;overflow:hidden;}

/* */
#flipchart-resources .resource-management{width:930px;background:url(../images/flipcharts/bgs/resource-management.png) repeat;border-radius-topleft:5px;border-radius-topright:5px;border-bottom:none;}

/* ----- Resource Tabs ----- */
#flipchart-resources .tabs{height:39px;position:relative;}
#flipchart-resources .tabs ul{height:29px;padding:10px 0 0 20px;overflow:hidden;}
#flipchart-resources .tabs ul li{margin:0 5px 0 0;float:left;}
#flipchart-resources .tabs ul li a{height:29px;display:block;overflow:hidden;text-indent:-10000px;}
#flipchart-resources .tabs ul li.pictures a{width:88px;background:url(../images/flipcharts/tabs/pictures.png) repeat;}
#flipchart-resources .tabs ul li.pictures a.on{background:url(../images/flipcharts/tabs/pictures-on.png) repeat;}
#flipchart-resources .tabs ul li.documents a{width:109px;background:url(../images/flipcharts/tabs/documents.png) repeat;}
#flipchart-resources .tabs ul li.documents a.on{background:url(../images/flipcharts/tabs/documents-on.png) repeat;}
#flipchart-resources .tabs ul li.audio a{width:71px;background:url(../images/flipcharts/tabs/audio.png) repeat;}
#flipchart-resources .tabs ul li.audio a.on{background:url(../images/flipcharts/tabs/audio-on.png) repeat;}
#flipchart-resources .tabs ul li.video a{width:71px;background:url(../images/flipcharts/tabs/video.png) repeat;}
#flipchart-resources .tabs ul li.video a.on{background:url(../images/flipcharts/tabs/video-on.png) repeat;}
#flipchart-resources .tabs ul li.my-resources a{width:193px;background:url(../images/flipcharts/tabs/my-resources.png) repeat;}
#flipchart-resources .tabs ul li.my-resources a.on{background:url(../images/flipcharts/tabs/my-resources-on.png) repeat;}

/* ----- Resource View ----- */
#flipchart-resources .viewport{width:891px;margin:0 auto;padding:10px;background:#fff;border-radius-topleft:5px;border-radius-topright:5px;}
#flipchart-resources .viewport div{height:251px;overflow-x:hidden;overflow-y:auto;}
#flipchart-resources .viewport div ul{margin:0 -20px 0 0;overflow:hidden;}
#flipchart-resources .viewport div ul li{width:80px;height:112px;margin:0 15px 15px 0;padding:5px 5px 5px 7px;position:relative;float:left;cursor:move;word-wrap:break-word;} /*overflow:hidden;white-space:nowrap;text-overflow:ellipsis;} TODO: This might be able to be added when XULRunner gets upgraded. */
#flipchart-resources .viewport div ul li.no-resources{width:auto;padding:39px 0 0;font-size:14px;cursor:default;}
#flipchart-resources .viewport div ul li span{width:77px;height:81px;margin:0 0 5px;display:block;box-shadow:#000 1px 1px 3px;}
#flipchart-resources .viewport div.audio ul li span{background:url(../images/flipcharts/icons/audio.png) repeat;}
#flipchart-resources .viewport div.documents ul li span{background:url(../images/flipcharts/icons/documents.png) repeat;}
#flipchart-resources .viewport div.video ul li span{background:url(../images/flipcharts/icons/video.png) repeat;}
#flipchart-resources .viewport div.pictures ul li span{overflow:hidden;}
#flipchart-resources .viewport div.pictures ul li span img{width:77px;height:81px;}
#flipchart-resources .viewport div.my-resources ul li span{overflow:hidden;}
#flipchart-resources .viewport div.my-resources ul li span img{width:77px;height:81px;}
#flipchart-resources .viewport div.my-resources ul li .delete{width:20px;height:18px;position:absolute;top:0;right:0;display:block;overflow:hidden;text-indent:-1000px;background:url(../images/flipcharts/delete.png);}

#flipchart-resources .viewport div ul li.latest{background:#99a8b6;}
.dragging{position:absolute!important;}

/* ----- Resource Uploader ----- */
#resource-uploader{width:460px;font-size:12px;color:#fff;}
#resource-uploader h2{margin:0 0 10px;padding:10px 15px;border-bottom:1px solid #AAB3BD;}
#resource-uploader p{margin:0;padding:0 0 15px;text-align:left;}

#resource-uploader #licence-text{padding:0 15px;}
#resource-uploader #licence-text p{}
#resource-uploader #licence-text .text{height:135px;margin:0 15px 15px;padding:15px 15px 0;overflow:auto;border:1px solid #fff;border-radius:3px;background:#fff;color:#000;box-shadow:inset 0 0 5px #888;}
#resource-uploader #licence-text .text p{padding:0 0 15px;font-weight:normal;}
#resource-uploader #licence-text p.actions{padding:0 12px 15px 15px;}

#resource-uploader #upload-form{padding:0 15px;}
#resource-uploader #upload-form p{font-weight:bold;}
#resource-uploader #upload-form p.licence{font-weight:normal;font-size:11px;}
#resource-uploader #upload-form .inputs{overflow:hidden;}
#resource-uploader #upload-form .inputs label{width:95px;padding:0 10px 0 0;display:inline-block;text-align:right;}
#resource-uploader #upload-form .inputs input{border:2px solid #fff;}
#resource-uploader #upload-form .inputs input.error{background:#ffd9d9;}

#resource-uploader p.actions{padding:0;overflow:hidden;}
#resource-uploader p.actions a{height:29px;float:right;display:block;text-indent:-1000px;overflow:hidden;}
#resource-uploader p.actions .accept{width:71px;margin:0 15px 0 0;background:url(../images/flipcharts/buttons/accept.png) no-repeat;}
#resource-uploader p.actions .decline{width:75px;background:url(../images/flipcharts/buttons/decline.png) no-repeat;}
#resource-uploader p.actions .import{width:72px;background:url(../images/flipcharts/buttons/import.png) no-repeat;}

/*  ----- Resource Message ----- */
#resource-message{width:405px;padding:10px 10px 10px 35px;position:absolute;top:30px;left:228px;z-index:1000;background:#eaf6ec url(../images/flipcharts/success.png) no-repeat 7px 7px;border:2px solid #56b25f;color:green;font-weight:bold;word-wrap:break-word;}

/* ----- Resource Errors ----- */
#resource-errors{margin:0 0 15px;padding:13px 10px 8px 43px;border:2px solid #f80202;background:#ffd9d9 url(../images/flipcharts/error.png) no-repeat 7px center;color:#f80202;font-weight:bold;}
#resource-errors ul li{padding:0 0 5px;}
