@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,100,200,600,700);

/* HTML Resets */
html,body,object,iframe,h1,h2,h3,h4,p,img,li,fieldset,form{border:0; font-family:Arial, Helvetica, sans-serif; font-size:100%; line-height:normal; margin:0; outline:0; padding:0} 
body{background:url(../images/noise.png) #eee; color:#3F3B31; font-family:Arial,Helvetica,sans-serif; font-size:14px; overflow-x:hidden; padding:37px 0 16px}
input, textarea{border:1px solid #DBDFE1; color:#393939; font-family:Arial, Helvetica, sans-serif; font-size:12px}
ul{list-style:none; margin:0; padding:0}
li{list-style:none}
*{border:0; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; margin:0; padding:0}
h1, h2, h3, h4{font-family:'Source Sans Pro'}
:focus{outline:none}

.clearfix:after, .navigation:after, .row:after{clear:both; content:"."; display:block; height:0; visibility:hidden}
.clearfix{*zoom:1 /* triggers hasLayout */}

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

/* Transitions get applied to these classes */
.mmLeft, .mmRight, .trans{-moz-transition:all 0.3s ease-out; -o-transition:all 0.3s ease-out; -webkit-transition:all 0.3s ease-out; transition:all 0.3s ease-out}

/* used in jQuery to change the Albums button to say "show" or "hide" */
.showHide, .drop-to-Delete{display:none}
	.showHide.showAlbum{display:inline}

/* Button Styles */
.basic-Btn{border-radius:3px; color:#fff; cursor:pointer; display:inline-block; font-weight:bold; padding:5px 10px; text-decoration:none}

.gen-Btn{background:#F9F7F0; border:1px solid #C7BFA1; box-shadow:0 1px 0 0 #fff inset; color:#3F3B31!important; text-shadow:1px 1px 0 #fff}
	.gen-Btn:hover{background:#FFFEFA; box-shadow:0 0 1px #888 inset}

.action-Btn{background:#045680; border:1px solid rgb(1,38,56); -moz-box-shadow:inset 1px 1px 0 0 rgb(99, 152, 179); -webkit-box-shadow:inset 1px 1px 0 0 rgb(99, 152, 179); box-shadow:inset 1px 1px 0 0 rgb(99, 152, 179); text-shadow:0 0 0 rgba(89,118,148,.9)}
	.action-Btn:hover{background:#045680; border:1px solid rgb(1,38,56); box-shadow:inset 2px 2px 0 0 rgb(15,56,77);}

.actionEmph-Btn, #new_album{background:#d05419; border:1px solid rgb(153, 72, 0); -moz-box-shadow:0 1px 2px 0 #FEC797 inset; -webkit-box-shadow:0 1px 2px 0 #FEC797 inset; box-shadow:0 1px 2px 0 #FEC797 inset; text-shadow:0 1px 1px #d86614}
	.actionEmph-Btn:hover, #new_album:hover{background:#FF6A00; box-shadow:inset 2px 2px 0 0 rgb(153, 72, 0)}

/* Top Bar Area */
.mmNav{background:#EFEEE7; border-bottom:1px solid #DBDFE1; -moz-box-shadow:0 0 5px rgba(0,0,0,.5); -webkit-box-shadow:0 0 5px rgba(0,0,0,.5); box-shadow:0 0 5px rgba(0,0,0,.5); height:38px; left:0; position:fixed; top:0; width:100%; z-index:40}
	.mmTools{padding:4px 0 4px 12px} 
		.mmTools > li{background:none; float:left; padding:0; margin-right:8px}
		.mmTools .exit{float:right}
	.albumSlideBtn{margin-right:5px}
		
/* Search styling */
.mmSearch{position:relative}
	.mmSearch .inputArea{height:28px; padding:0 25px; width:200px}

.mmDropStyle{border:1px solid #C7BFA1; border-top:0; display:none; left:0; position:absolute; top:100%; width:100%; z-index:30}
	.mmDropStyle li span{margin-right:4px}

/* Media Manager Container */
.mmContainer{/*overflow:hidden;*/ position:relative; z-index:20}

/* All Media View */
.mmMain{float:left; width:100%}
	.mmMain.show{width:65%}
    .albumHolder{margin:0 15px}
    .show .albumHolder{margin:0}

.mediaList{display:table-cell; padding:15px 0 0 15px; text-align:center}

.mediaItem, .albumItem{background-color:#fff; border:2px solid #839FAF; border-radius:3px; -moz-box-shadow:0 0 3px rgba(0,0,0,.1); -webkit-box-shadow:0 0 3px rgba(0,0,0,.1); box-shadow:0 0 3px rgba(0,0,0,.1); cursor:pointer; float:left; height:84px; margin:0 10px 10px 0; position:relative; width:84px}
	.mediaItem.selected-item, .mediaItem:hover,
	.albumItem.selected-item, .albumItem:hover{background:#5fc1ff; border-color:#2D3E46; -moz-box-shadow:0 0 6px rgba(255,255,255,.8); -webkit-box-shadow:0 0 6px rgba(255,255,255,.8); box-shadow:0 0 6px rgba(255,255,255,.8)}

.mediaItem.selected-item, .albumItem.selected-item{background:#5fc1ff; border-color:#FF6A00} 
	.media-Item-Img{height:80px; width:80px}
		.selected-item .media-Item-Img, .mediaItem:hover .media-Item-Img, .albumItem:hover .media-Item-Img{opacity:.6}
		
/* desc/title */
.media-handle{background:#B8D0DF; bottom:0; font-size:10px; height:16px; left:0; overflow:hidden; max-width:80px; padding:2px 5px; position:absolute; text-align:center; width:100%}

/* Album Area */
.emptyAlbum{font-family:'Source Sans Pro'; font-weight:100; font-size:2em; padding:20% 35px 20px 20px}
#STATUS_MMALBUMS{display:block; height:22px; overflow:hidden}
#memberAlbumsList{height:auto; max-height:300px}
	#memberAlbumsList li{overflow:hidden; padding-right:20px}
	#memberAlbumsList li:first-child{padding-right:0}
#memberAlbumsList a{border-left:0; padding:5px 10px}
.mmSideBar{float:left; margin-right:-35%; overlfow:hidden; width:35%}
	.mmSideBar.show{margin:0}

.albumBkg{background:url(../images/noise.png) #f0f9ff ;height:100%; position:fixed; right:0; top:0; z-index:10}

.albumHead{background:#577D96}
.mmAlbumActions{height:38px; padding:5px 10px 0 0; text-align:right}
.mmSelector{border-right:1px solid #7091a8; -moz-box-shadow:0 1px 1px #608AA4 inset; -webkit-box-shadow:0 1px 1px #608AA4 inset; box-shadow:0 1px 1px #608AA4 inset; color:#fff; display:block; font-family:'Source Sans Pro', Arial, Helvetica, sans-serif; font-size:1.5em; font-weight:200; height:38px; padding:10px 25px 10px 10px; text-decoration:none; text-shadow:0 1px 0 #293C48}
	.mmSelector:hover, .mmSelector.openList{background-color:#83A3B8}
	.mmSelector .arrowD{position:absolute; right:10px; top:15px}
.albumDrop{float:left; line-height:1; position:relative; width:70%}
#new_album{color:#fff; font-size:14px}
	#new_album span{font-size:20px; line-height:1; position:relative; top:2px}
#collection_content{position:relative; z-index:1}
	
	.album-name{float:left; width:100%}
	.album-delete{float:right; margin-right:-20px; text-indent:-4px; width:20px}

/* Footer Area */
.mmFooter{background:#E4E3DC; bottom:0; box-shadow:0 0 3px rgba(0, 0, 0, 0.2); font-size:.8em; height:18px; position:fixed; width:100%; z-index:40}
	.mmSummary{height:20px; padding:2px 15px 0}
.mmSummary li{display:inline-block}
	.mmDiskSpace{border-right:1px solid #C7BFA1; margin-right:15px; padding-right:15px}
	
/* Album Summary */
.albumCount{background:#577D96; text-align:right}
.mmData{margin-left:5px}

/* IF A MEDIA ITEM HAS BEEN SELECTED, APPLY THESE STYLES... */
/*.ifSelected .mediaList, .ifSelected-Album .mediaList{padding-bottom:110px}*/
.ifSelected .bigTrash, .ifSelected-Album .bigTrash{bottom:18px; padding:20px 0; position:fixed; width:100%; z-index:9999}
	
.ifSelected #media_trash{display:block}
.ifSelected-Album #album_trash{display:block}
	.ifSelected .mmLeft.show .bigTrash{left:0; width:65%}
	.ifSelected-Album .albumCount.show .bigTrash{right:0; width:35%}

.bigTrash{-moz-box-shadow:0 0 5px rgba(0,0,0,.2); -webkit-box-shadow:0 0 5px rgba(0,0,0,.2); box-shadow:0 0 5px rgba(0,0,0,.2); display:none; font-size:17px; text-align:center; text-decoration:none}
.bigTrash .tCan{background-position:-125px 0; display:block; height:27px; margin:0 auto; opacity:.8; width:27px}
.managerTrash{background:#F9F7F0; color:#3F3B31}
.albumTrash{background:#6089a4; color:#374c58; text-shadow:0 1px 1px #7490a3}

/* album trash can */
#media_trash, #album_trash{cursor:pointer}
#album_trash{bottom:-4px; height:110px; position:fixed; right:0; width:35%; z-index:99}

/* Sprites */
.mmSprite{background:url(../images/mmSprite.png) no-repeat; display:inline-block; height:18px; vertical-align:middle; width:20px}

.magGlass{background-position:-72px -3px; position:absolute; right:4px; top:6px}
.clk2See{background-position:-90px 2px}
.search{background-position:-111px -1px}
.mediaType{left:4px; position:absolute; top:4px}
	.allMedia{background-position:0 -32px}
	.audioMedia{background-position:-113px -32px}
	.docMedia{background-position:-23px -33px}
	.flashMedia{background-position:-46px -30px}
	.imageMedia{background-position:-69px -32px}
	.videoMedia{background-position:-90px -33px}
	
.mmSprite.edit{background-position:-100px top; height:27px; opacity:.8; width:27px}
.mmSprite.exOut{background-position:right top; height:27px; opacity:.8; width:27px}
	.mmSprite.edit:hover, .mmSprite.dCollection:hover{opacity:1}

.mediaItem a{background:url(../images/mmSprite.png) no-repeat #fff; border:2px solid #839FAF; -moz-border-radius:20px; -wekit-border-radius:20px; border-radius:20px; 
-moz-box-shadow:1px 1px 2px rgba(0,0,0,.3); -webkit-box-shadow:1px 1px 2px rgba(0,0,0,.3); box-shadow:1px 1px 2px rgba(0,0,0,.3); display:none; font-size:1px; height:24px; line-height:50px; overflow:hidden; position:absolute; right:-10px; text-decoration:none; top:-8px; width:24px; z-index:3}
.mediaItem:hover a{display:block}

/* Media Manager Modal Box */
.button-container{padding:0 0 10px!important}

.modal-image-Area{background:rgba(255,255,255,.5); border:1px solid #ddd; margin-bottom:10px; padding:10px 0}
	.modal-image-Area img{-moz-box-shadow:0 0 2px rgba(0,0,0,.5); -webkit-box-shadow:0 0 2px rgba(0,0,0,.5); box-shadow:0 0 2px rgba(0,0,0,.5); display:block; margin:0 auto 10px; max-width:100%}
	.modal-Action-Links{text-align:center}
.mmImageSize{}
.bold{font-weight:bold}
.modal-Form-Area{background:#fff; border:1px solid #DBDFE1}
.modal-Form-tabArea{padding:10px}
	.modal-Tab-Buttons{list-style:none; margin:0; overflow:hidden; padding:0; text-align:center}
	.modal-Tab-Buttons li{float:left; width:33.3333%}
	.details-tab{border-left:1px solid #fee; border-right:1px solid #fee}
	#WEBON_MODAL_CONTAINER .content .modal-tab{background:#F9F7F0; color:#353535; display:block; font-weight:bold; padding:10px; text-decoration:none; text-shadow:-1px 0 1px rgba(255, 255, 255, 0.6)}
		#WEBON_MODAL_CONTAINER .content .modal-tab:hover{background:#eee}
		#WEBON_MODAL_CONTAINER .content .ui-state-active .modal-tab{background:#fff; -moz-box-shadow:0 0 5px rgba(0,0,0,.2); -webkit-box-shadow:0 0 5px rgba(0,0,0,.2); box-shadow:0 0 5px rgba(0,0,0,.2); position:relative}
.modal-HR{background:#ddd; border:none; height:1px}

/* Modal Box - File Info Section */
.mm-Modal-Label{display:block; font-size:15px; margin-bottom:5px}
.mm-Modal-Input{margin-bottom:10px; padding:5px; width:100%}
	textarea.mm-Modal-Input{resize:vertical}
	#description{min-height:75px; resize:vertical}
.avail-Thumbs{border:1px solid #ccc; -moz-box-shadow:0 0 5px rgba(0,0,0,.2); -webkit-box-shadow:0 0 5px rgba(0,0,0,.2); box-shadow:0 0 5px rgba(0,0,0,.2)}

/* modal details */
#ta_url{border:none; font-family:Arial, Helvetica, sans-serif; font-size:12px; resize:none; width:100%}

.float-right{float:right; margin-left:10px}
.drop-here{-moz-box-shadow:inset 0 0 126px rgba(255,255,255,.25); -webkit-box-shadow:inset 0 0 126px rgba(255,255,255,.25); box-shadow:inset 0 0 126px rgba(255,255,255,.25)}
.show .albumDropHere{background:url(../images/dragHere.png) rgba(0,0,0,.8) center center no-repeat; height:100%; position:fixed; right:0; top:38px; width:35%; z-index:5}

/* IE Fixes */
.ie8 #search{line-height:22px}

/* VK */
.sortable-placeholder{background-color:#fff; border:2px solid #839FAF; border-radius:3px; box-shadow:0 0 3px rgba(0, 0, 0, 0.1); float:left; height:84px; margin:0 10px 10px 0; position:relative; width:84px}
#MM_LOADER{background:rgba(0, 0, 0, 0.7); height:100%; left:0; overflow-y:auto; position:fixed; top:0; width:100%; z-index:999999}
    #MM_LOADER img{bottom:0; left:0; margin:auto; position:absolute; right:0; text-align:center; top:0}
	
#collection_content, #media_list{overflow:auto}
#collection_content li.spacer, #media_list li.spacer{float:left; height:80px; width:100%}