/**
 * limit for captions responsivity
 */
@media only screen and (max-width: 600px) {
  .cwattachments .overlay .cmask span.ctitle {
      font-size: 16px;
      font-weight: bold;
      max-width: calc(100% - 0px);
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
  } 
}


/**
 * General Styles
 */
  @keyframes cwa-image-fade {
      from {opacity: 0;}
      to {opacity: 1;}
  }
  .cwFiltersModule {
    margin-bottom: -5px !important;
  }
  .cwFiltersAlbum .cwfilter-title,
  .cwFiltersModule .cwfilter-title,
  .cwFilters .cwfilter-title {
    margin: 5px;
    font-size: 14px;
    font-weight: lighter;
    min-width: 50px;
    display: inline-block;
  }
  .cwattachments .cwFiltersAlbum .cwbutton.is-checked,
  .cwattachments .cwFilters .cwbutton.is-checked,
  .cwattachments_module .cwFiltersModule .cwbutton.is-checked {
    background: #999;
    border-color: #999;
    color: #fff;
  }
  .cwattachments .cwbutton:hover,
  .cwattachments_module .cwFiltersModule .cwbutton:hover,
  .cwattachments .cwFilters .cwbutton:hover {
    background: #999;
    border-color: #999;
    color: #fff;
  }

  .cwattachments .cwbutton,
  .cwattachments .cwFilters .cwbutton {
    padding: 10px 20px;
    background: #000;
    color: #fff;
    line-height: 20px;
    margin: 5px;
    border: 1px solid #000;
    border-radius: 0;
    cursor: pointer;
    display: inline-block;
    -webkit-transition: all 300ms ease-out;
    -moz-transition: all 300ms ease-out;
    -ms-transition: all 300ms ease-out;
    -o-transition: all 300ms ease-out;
    transition: all 300ms ease-out;
    
  }
  .cwattachments_module .cwFiltersModule .cwbutton {
    background: #fff;
    color: #000;
  }
  
  .cwattachments .cmask.style8 .cmaskWrapper {
    height: calc(100% - 30px);
    overflow: hidden;
    margin: 15px 0;
  }
  
  .cwattachments_loadmore { text-align: center; clear: both; }  
  .cwattachments .gallery a .cmask {
      /*padding: 5px;*/ 
  }
  
  .cwattachments .overlay .cmask span.ccaption > span {
    /*padding: 5px 0;*/
  }
  .cwattachments .ccaption .ctags {  
    padding: 0px;
    margin: 10px 0px 5px 0px;
    display: block;
  }
      
  .cwattachments .badge {
    display: inline-block;
    font-size: 10px;
    font-weight: 500;
    color: rgba(30,30,30,1) !important;
    line-height: 22px;
    padding: 0px 8px;
    border-radius: 10px;
    background-color: #e4e4e4;
    margin-bottom: 5px;
    margin-right: 5px;
    position: relative;
    right: auto;
    /*
    display: inline-block;
    height: 26px;
    font-size: 12px;
    font-weight: 500;
    color: rgba(30,30,30,1) !important;
    line-height: 26px;
    padding: 0px 12px;
    border-radius: 16px;
    background-color: #e4e4e4;
    margin-bottom: 5px;
    margin-right: 5px;
    position: relative;
    right: auto;
    */
  } 
.cwattachments .gallery a img { display: block; } 

.cwattachments .gallery a { overflow: hidden; background: transparent; }

.cwattachments { margin: 5px 0px; }
.cwattachments .calbum { padding: 5px 0px; }
.cwattachments .cphotobox { display: inline-block; padding: 5px; border: 1px solid #d5d5d5; margin: 3px; }
.cwattachments .cphotobox .wrap { overflow: hidden; height: auto; visibility: visible; }
/*.cwattachments .cwaitem { -webkit-animation: cwa-image-fade .8s linear both; animation: cwa-image-fade .8s linear both; }*/
.cwattachments .cphotobox .wrap a.cimage { margin: 0px !important; display: block; position: relative; }
.cwattachments .cphotobox .wrap img { height: auto; max-width: none;  }

/* COLOR light */
.cwattachments .overlay .cmask.light { background-color: rgba(255,255,255,0.7); }
.cwattachments .overlay .cmask.light .ccaption { color: #444; text-shadow: 0px 0px 0px #fff; } 
/* COLOR dark */
.cwattachments .overlay .cmask.dark { background-color: rgba(0,0,0,0.5); }
.cwattachments .overlay .cmask.dark .ccaption { color: #fff; text-shadow: 0px 0px 0px #000; }

/* caption overlay */
.cwattachments .overlay .cmask { text-align: center; position: absolute; top: 0; left: 0; width: calc(100% - 0px); height: calc(100% - 0px); white-space: initial; 
  opacity: 0;
  -webkit-transition: all 500ms ease-out;
  -moz-transition: all 500ms ease-out;
  -ms-transition: all 500ms ease-out;
  -o-transition: all 500ms ease-out;
  transition: all 500ms ease-out;
}
.cwattachments .overlay .cmask:hover { opacity: 1; }
 /* Adjusts for spacing */
.cwattachments .overlay .cmask:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-right: -0.25em;
}  
 /* Adjusts for spacing */
.cwattachments .overlay .cmask .cmaskWrapper:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-right: -0.1em;
} 
                                                                               
.cwattachments .overlay .cmask .ccaption { vertical-align: middle; display: inline-block; color: #000; text-shadow: 1px 1px 1px #fff; padding: 0px; }

/* caption static */
.cwattachments .static .cmask { text-align: center; }
.cwattachments .static .cmask .ccaption { vertical-align: middle; display: inline-block; color: #777; }
.cwattachments .static:hover img { opacity: 0.5; }

.cwattachments .overlay .cmask span { border: none; opacity: 0; }
.cwattachments .overlay .cmask span.ctitle {
    font-size: 16px;
    font-weight: bold;
}
.cwattachments .overlay .cmask span.cdesc { font-size: 12px; font-size: 12px; line-height: 1.4em; }
.cwattachments .overlay:hover .cmask span { opacity: 1; }
 
.cwattachments .overlay .cmask { bottom: 0px;}
.cwattachments .overlay:hover .cmask { opacity: 1; }

  /**
   * Caption Hover Styles
   */
  
  /* NOCAPTION */
  .cwattachments .nocaption:hover img { opacity: 0.7; }
  
  /* STYLE 1 */
  .cwattachments .overlay .cmask.style1 span.ctitle { font-size: 18px; line-height: 22px; font-weight: normal; padding: 0px; margin: 10px 20px 10px 20px }
  .cwattachments .overlay .cmask.style1 span.ccontent { padding: 0px; margin: 10px 20px 10px 20px }
  .cwattachments .overlay .cmask.style1.dark { background-color: rgba(0,0,0,0.0); }
  
  .cwattachments .style1 .overlay .cmask.style1 .ccaption span {
    opacity: 1;
  }
  .cwattachments .style1 .overlay .cmask.style1 .ccaption {
    padding: 10px 0;
    text-align: left;
    width: 100%;
    opacity: 1;
    vertical-align: bottom;
  }             
  .cwattachments .style1 .overlay .cmask.style1 {
    bottom: -20px;
    height: auto;
    opacity: 0;
    top: initial;
    background: -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0,0,0,0.7)))!important;
    background: -webkit-linear-gradient(top, transparent 0%, rgba(0,0,0,0.7) 100%)!important;
    background: -moz-linear-gradient(top, transparent 0%, rgba(0,0,0,0.7) 100%)!important;
    background: linear-gradient(to bottom, transparent 0%, rgba(0,0,0,0.7) 100%)!important;
    transition: all .4s 0s ease-in-out;
    -webkit-transition: all .4s 0s ease-in-out; 
  }
  .cwattachments .gallery a:hover .cmask.style1 {
    bottom: 0px;   
    max-height: 100%;
    overflow: hidden;  
    opacity: 1;
  }
  
  /* STYLE 2 */
  .cwattachments .style2 .overlay .cmask:before {
    height: auto;
  }
  .cwattachments .gallery a.overlay .cmask.style2 {
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    /*height: calc(100% - 10px);*/
  }
  .cwattachments .gallery a.overlay:hover .cmask.style2 {
    
    /*width: 100%;*/   
    max-height: 100%;
    overflow: hidden;   
  }
  .cwattachments .overlay .cmask.style2:before {
    height: 100%;
  }
  .cwattachments .overlay .cmask.style2 .cmaskWrapper {
    height: 100%;
    float: left;
    width: 100%;
  }  
  
  /* STYLE 3 */
  .cwattachments .style3 .overlay .cmask:before {
    height: auto;
  }
  .cwattachments .overlay .cmask.style3 {
    /*height: calc(100% - 10px);     */
    opacity: 0;
  
    -webkit-transform: scale(0.0);
    -moz-transform: scale(0.0);
    -ms-transform: scale(0.0);
    -o-transform: scale(0.0);
    transform: scale(0.0);
    -webkit-transition: all .5s ease-out;
    -moz-transition: all .5s ease-out;
    -ms-transition: all .5s ease-out;
    -o-transition: all .5s ease-out;
    transition: all .5s ease-out;
    /*width: calc(100% - 10px); */
  }  
  .cwattachments .gallery a.overlay:hover .cmask.style3 {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    overflow: hidden;   
  }
  .cwattachments .overlay .cmask.style3:before {
    height: 100%;
  }
  .cwattachments .overlay .cmask.style3 .cmaskWrapper {
    height: 100%;
    float: left;
    width: 100%;
  }  
  
  /* STYLE 4 */
  .cwattachments .style4 .overlay .cmask:before {
    height: auto;
  }
  .cwattachments .overlay .cmask.style4 {
    height: 100%;    
    width: 100%;
    /*max-height: calc(100% - 10px);*/
    opacity: 0;
    background: rgba(0,0,0,0.8);
    top: initial;
  }
  .cwattachments .gallery a:hover .cmask.style4 {
    overflow: hidden;  
    opacity: 1;
    transition: all .4s 0s ease-in-out;
    -webkit-transition: all .4s 0s ease-in-out; 
  }  
  .cwattachments .gallery .overlay .cmask.style4 span.ctitle {
    left: 100%;
    position: relative;  
  }
  .cwattachments .gallery .overlay .cmask.style4 span.ccontents {
    left: -100%;
    position: relative;  
  } 
  .cwattachments .gallery .overlay:hover .cmask.style4 span.ctitle,
  .cwattachments .gallery .overlay:hover .cmask.style4 span.ccontents
  {
    left: 0%;
  }  
  .cwattachments .gallery .overlay .cmask.style4 .cdesc {
    display: block;
  }
  .cwattachments .overlay .cmask.style4:before {
    height: 100%;
  }
  .cwattachments .overlay .cmask.style4 .cmaskWrapper {
    height: 100%;
    float: left;
    width: 100%;
  }
  
  /* STYLE 5 */
  .cwattachments .style5 .overlay .cmask:before {
    height: auto;
  }
  .cwattachments .overlay .cmask.style5 {
    height: 100%;    
    max-height: 100%;
    opacity: 0;
    background: rgba(30,30,30,0.7);
    top: initial;
  }
  .cwattachments .gallery a:hover .cmask.style5 {
    height: 100%;    
    max-height: 100%;
    overflow: hidden;  
    opacity: 1;
    transition: all .4s 0s ease-in-out;
    -webkit-transition: all .4s 0s ease-in-out; 
  }  
  .cwattachments .gallery .overlay .cmask.style5 span.ctitle {

    position: relative;  
  }
  .cwattachments .gallery .overlay .cmask.style5 span.ccontent {

    position: relative;  
  } 
  .cwattachments .gallery .overlay .cmask.style5 span.ctitle,
  .cwattachments .gallery .overlay .cmask.style5 span.ccontent
  {
    opacity: 0;
    transform: translateY(300%);
    -webkit-transform: translateY(300%);
    transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
  } 
  .cwattachments .gallery .overlay:hover  .cmask.style5 span.ctitle,
  .cwattachments .gallery .overlay:hover  .cmask.style5 span.ccontent
  {
    opacity: 1;
    transform: none;
    -webkit-transform: none;
  }  
  .cwattachments .gallery .overlay .cmask.style5 .ccontent {
    display: block;
  }
  .cwattachments .overlay .cmask.style5:before {
    height: 100%;
  }
  .cwattachments .overlay .cmask.style5 .cmaskWrapper {
    height: 100%;
    float: left;
    width: 100%;
  }  
  
  /* STYLE 6 */
  .cwattachments .style6 .overlay .cmask:before {
    height: auto;
  }
  .cwattachments .gallery a.overlay .cmask.style6 {
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    opacity: 1;
    background: rgba(30,30,30,1);
    left: -100%;
    position: absolute;
    width: 50%;
  }
  .cwattachments .gallery a.overlay:hover .cmask.style6 {
    height: 100%; 
    width: 50%; 
    left: 0%;  
    max-height: 100%;
    overflow: hidden;   
  }
  .cwattachments .overlay .cmask.style6:before {
    height: 100%;
  }
  .cwattachments .overlay .cmask.style6 .cmaskWrapper {
    height: 100%;
    float: left;
    width: 100%;
  }
  
  /* STYLE 7 */
  .cwattachments .style7 .overlay .cmask:before {
    height: auto;
  }
  .cwattachments .gallery a.overlay .cmask.style7 {
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    opacity: 1;
    background: rgba(30,30,30,1);
    bottom: -100%;
    position: absolute;
    width: 100%;
    height: 50%;
    top: initial;
  }
  .cwattachments .gallery a.overlay:hover .cmask.style7 {
    height: 50%; 
    /*width: calc(100% - 10px);*/
    width: 100%; 
    bottom: 0%;  
    max-height: 100%;
    overflow: hidden;   
    top: initial;
  }
  .cwattachments .gallery a.overlay:hover .cphoto {
    top: -10%;
  }
  .cwattachments .overlay .cmask.style7:before {
    height: 100%;
  }
  .cwattachments .overlay .cmask.style7 .cmaskWrapper {
    height: 100%;
    float: left;
    width: 100%;
  }
  
  /* STYLE 8 */
  .cwattachments .cwaitem.style8 {

      overflow: hidden;
      text-align: center;
      cursor: pointer;
  }


  .cwattachments .cwaitem.style8 .cmask {
    padding: 3em;
    position: absolute;
    /*height: calc(100% - 6em);*/
    top: 0;
    /*width: calc(100% - 6em);*/
    display: flex;
    flex-direction: column;    
  }
  .cwattachments .cwaitem.style8:hover .cmask {
      background: #365b6894;
  }
  
  .cwattachments .cwaitem.style8 .cmask::before,
  .cwattachments .cwaitem.style8 .cmask::after {
  	position: absolute;
  	content: '';
  	opacity: 0;
  }
  
  .cwattachments .cwaitem.style8 .cmask::before {
  	top: 50px;
  	right: 30px;
  	bottom: 50px;
  	left: 30px;
  	border-top: 1px solid #fff;
  	border-bottom: 1px solid #fff;
  	-webkit-transform: scale(0,1);
  	transform: scale(0,1);
  	-webkit-transform-origin: 0 0;
  	transform-origin: 0 0;
    height: calc(100% - 6em);
  }
  
  .cwattachments .cwaitem.style8 .cmask::after {
  	top: 30px;
  	right: 50px;
  	bottom: 30px;
  	left: 50px;
  	border-right: 1px solid #fff;
  	border-left: 1px solid #fff;
  	-webkit-transform: scale(1,0);
  	transform: scale(1,0);
  	-webkit-transform-origin: 100% 0;
  	transform-origin: 100% 0;
  }
  
  .cwattachments .cwaitem.style8 .ctitle {
  	-webkit-transition: -webkit-transform 0.35s;
  	transition: transform 0.35s;
    border: none;  

  }                                                     
  
  .cwattachments .cwaitem.style8 .ccontent {
  	
  	text-transform: none;
  	opacity: 0;
  	-webkit-transform: translate3d(0,-10px,0);
  	transform: translate3d(0,-10px,0);
  }

  /*.cwattachments .cwaitem.style8 img,*/
  .cwattachments .cwaitem.style8 .ctitle {
  	-webkit-transform: translate3d(0,-30px,0);
  	transform: translate3d(0,-30px,0);
    text-transform: uppercase;
  }
  
  .cwattachments .cwaitem.style8 img,
  .cwattachments .cwaitem.style8 .cmask::before,
  .cwattachments .cwaitem.style8 .cmask::after,
  .cwattachments .cwaitem.style8 .ccontent {
  	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  	transition: opacity 0.35s, transform 0.35s;
  }
  
  .cwattachments .cwaitem.style8:hover img {
  	opacity: 0.7;
  	//-webkit-transform: translate3d(0,0,0);
  	//transform: translate3d(0,0,0);
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -o-transform: scale(1.05);
    -ms-transform: scale(1.05);
    transform: scale(1.05);    
    z-index: 5;    
  }
  
  .cwattachments .cwaitem.style8:hover .cmask::before,
  .cwattachments .cwaitem.style8:hover .cmask::after {
  	opacity: 1;
  	-webkit-transform: scale(1);
  	transform: scale(1);
  }
  
  .cwattachments .cwaitem.style8:hover .ctitle,
  .cwattachments .cwaitem.style8:hover .ccontent {
  	opacity: 1;
  	-webkit-transform: translate3d(0,0,0);
  	transform: translate3d(0,0,0);
  }
  
  .cwattachments .cwaitem.style8:hover .cmask::after,
  .cwattachments .cwaitem.style8:hover .ctitle,
  .cwattachments .cwaitem.style8:hover .ccontent,
  .cwattachments .cwaitem.style8:hover img {
  	-webkit-transition-delay: 0.15s;
  	transition-delay: 0.15s;
  }
  .cwattachments .cwaitem.style8 .cmask > a {
      z-index: 1000;
      text-indent: 200%;
      white-space: nowrap;
      font-size: 0;
      opacity: 0;
  }

  .cwattachments .cwaitem.style8 .overlay .cmask .ccaption > span {
    width: 100%;
  }
  .cwattachments .cwaitem.style8 .overlay .cmask .ccaption:before {

  }
  .cwattachments .cwaitem.style8 .overlay .cmask .ccaption {
    margin: auto;
    /*height: calc(100% - 40px);*/
    width: calc(100% - 40px);
  }

  .cwattachments .justified .cwaitem.style8 .overlay .cmask .ccaption {
    padding: 0 20px;
    overflow: hidden;
    /*height: calc(100% - 80px);*/
    width: calc(100% - 7em);
  }  
  .cwattachments .gallery .overlay .cmask.style8 .cdesc {
    padding-top: 10px;
  }
  .ctags ~ .cdesc{
    padding-top: 0px !important;
  }


 /* STYLE 9 */
  .cwattachments .cwaitem.style9 {
  	
  }
  
  .cwattachments .cwaitem.style9 img {
  	opacity: 0.9;
  	-webkit-transition: opacity 0.35s;
  	transition: opacity 0.35s;
  }
  
  .cwattachments .cwaitem.style9 .cmask::before {
  	position: absolute;
  	top: 30px;
  	right: 30px;
  	bottom: 30px;
  	left: 30px;
  	border: 2px solid #fff;
  	box-shadow: 0 0 0 30px rgba(255,255,255,0.2);
  	content: '';
  	opacity: 0;
  	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  	transition: opacity 0.35s, transform 0.35s;
  	-webkit-transform: scale3d(1.4,1.4,1);
  	transform: scale3d(1.4,1.4,1);
    height: auto;
  }
  .cwattachments .cwaitem.style9 .cmask .ccaption .ctitle {
    padding: 0 5px;
  }
  .cwattachments .cwaitem.style9 .ctitle {
  	margin: 20% 10px 10px 10px;
  	-webkit-transition: -webkit-transform 0.35s;
  	transition: transform 0.35s;
  }
  
  .cwattachments .cwaitem.style9 .ccontents {
  	padding: 1em;
  	opacity: 0;
  	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  	transition: opacity 0.35s, transform 0.35s;
  	-webkit-transform: scale(1.5);
  	transform: scale(1.5);
  }
  
  .cwattachments .cwaitem.style9:hover .ctitle {
  	-webkit-transform: scale(0.9);
  	transform: scale(0.9);
  }
  
  .cwattachments .cwaitem.style9:hover .cmask::before,
  .cwattachments .cwaitem.style9:hover .ccontents {
  	opacity: 1;
  	-webkit-transform: scale3d(1,1,1);
  	transform: scale3d(1,1,1);
  }
  
  .cwattachments .cwaitem.style9:hover .ccaption {
    background-color: rgba(58,52,42,0);
/*
    width: calc(100% - 60px);
    height: calc(100% - 60px);
    overflow: hidden;
    left: 2px;
*/
  }
  .cwattachments .cwaitem.style9 .ccaption .ctags {
    margin-top: 0px; 
  }
   
  .cwattachments .cwaitem.style9 .cmask .cmaskWrapper {
      width: calc(100% - 60px);
      height: calc(100% - 60px);
      margin: auto;
      overflow: hidden;
  }
  .cwattachments .cwaitem.style9 .cmask {
    display: flex;    
  }
  .cwattachments .cwaitem.style9:hover img {
  	opacity: 0.4;
  }
 
 
/******************************************
 * LAYOUTS ********************************
 */

/**
 * Grid 3D box
 */
  .grid3d .cleaner { margin-bottom: 80px; }
  
  .grid3d .cwaitem .itemWrapper {
    width: 100%;
    margin: 30px 0px;
    perspective: 1000px;
    display: table;    
  }
  .grid3d .cwaitem .itemWrapper a {
    padding-top: calc(100% - 40px);
    display: table-row;
    width: calc(100% - 40px);

  	/*double layered BG for lighting effect*/
  	background: 
  		linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.4));  		
  	/*disabling the translucent black bg on the main image*/
  	background-size: 0, cover;
  	/*3d space for children*/
  	transform-style: preserve-3d;
  	transition: all 0.5s;
    
    overflow: visible;
    margin: 0 !important;
    border: 0 !important;
  }
  .grid3d .cwaitem .itemWrapper:hover a {transform: rotateX(80deg); transform-origin: bottom;}
  /*bottom surface */
  .grid3d .cwaitem .itemWrapper a:after {
  	/*36px high element positioned at the bottom of the image*/
  	content: ''; position: absolute; left: 0; bottom: 0; 
  	width: 100%; height: 36px;
  	/*inherit the main BG*/
  	background: inherit; background-size: cover, cover;
  	/*draw the BG bottom up*/
  	background-position: bottom;
  	/*rotate the surface 90deg on the bottom axis*/
  	transform: rotateX(90deg); transform-origin: bottom;
  }
  /*label style*/
  .grid3d .cwaitem .itemWrapper a span.ccaption {
  	color: white; text-transform: uppercase;
  	position: absolute; top: 100%; left: 0; 
  	font: bold 12px/36px Montserrat; text-align: center;
  	/*the rotation is a bit less than the bottom surface to avoid flickering*/
  	transform: rotateX(-89.99deg); transform-origin: top;
  	z-index: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    padding: 0 10px; 
    width: calc(100% - 20px);  
    background: rgba(0,0,0,0.2);    
    font-weight: 500;    
  }
  /*shadow*/
  .grid3d .cwaitem .itemWrapper a:before {
  	content: ''; position: absolute; top: 0; left: 0;
  	width: 100%; height: 95%;
  	background: rgba(0, 0, 0, 0.5); 
  	box-shadow: 0 0 100px 50px rgba(0, 0, 0, 0.5);
  	transition: all 0.5s; 
  	/*by default the shadow will be almost flat, very transparent, scaled down with a large blur*/
  	opacity: 0.15;
  	transform: rotateX(95deg) translateZ(-80px) scale(0.75);
  	transform-origin: bottom;
  }
  .grid3d .cwaitem .itemWrapper:hover a:before {
  	opacity: 1;
    height: 100%;
  	/*blurred effect using box shadow as filter: blur is not supported in all browsers*/
  	box-shadow: 0 0 25px 25px rgba(0, 0, 0, 0.5);
  	/*pushing the shadow down and scaling it down to size*/
  	transform: rotateX(0) translateZ(-60px) scale(0.85); 
  }
  .cwattachments .grid3d .gallery .cwaitem .itemWrapper a { overflow: visible; border: 0px !important; }
  
  .cwattachments .grid3d .cwaitem .itemWrapper a span.ccaption span.badge { display: inline-block !important; margin: 0 2px; }

/**
 * Grid 3D cube
 */
  .cwattachments .grid3dcube * { box-sizing: border-box; }
  
  .cwattachments .grid3dcube .cimage { width: 100%; height: 100%; display: block; }
  .cwattachments .grid3dcube .maskcimage { width: 100%; height: 100%; display: block; }
  .cwattachments .grid3dcube .cimage .cphoto { visibility: hidden; }
  
  /*
  .cwattachments .grid3dcube .cube__face--front  { background: hsla(  0, 100%, 50%, 0.7); }
  .cwattachments .grid3dcube .cube__face--right  { background: hsla( 60, 100%, 50%, 0.7); }
  .cwattachments .grid3dcube .cube__face--back   { background: hsla(120, 100%, 50%, 0.7); }
  .cwattachments .grid3dcube .cube__face--left   { background: hsla(180, 100%, 50%, 0.7); }
  .cwattachments .grid3dcube .cube__face--top    { background: hsla(240, 100%, 50%, 0.7); }
  */
  .cwattachments .grid3dcube .cube__face--bottom { background: rgba(30,30,30,1); }


  /* Caption Hover */
  .cwattachments .grid3dcube a.overlay:hover {
    background: rgba(30,30,30,1);
  }
  .cwattachments .grid3dcube a.overlay:hover .cmask {
    opacity: 1;
  }
  .cwattachments .grid3dcube a.overlay .cmask {
    -webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -ms-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;

    display: flex !important;

    opacity: 0.5;

    height: 100%; 
    width: 100%;   
    max-height: 100%;
    overflow: hidden;   
    padding: 20px;
  }
  .cwattachments .grid3dcube .overlay .cmask .cmaskWrapper {
    width: 100%;
  }
   /* Adjusts for spacing */  
  .cwattachments .grid3dcube .overlay .cmask .cmaskWrapper:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    margin-right: -0.1em;
  }  
  .cwattachments .grid3dcube .overlay .cmask span.ctitle {
    margin-bottom: 10px;
    font-weight: normal;
  }
  .cwattachments .grid3dcube .overlay .cmask .ccontent {
    margin: 10px;
  }
  .cwattachments .grid3dcube .overlay .cmask .ccaption {
    text-shadow: none;
    font-weight: normal;
    padding: 0px;
    margin: 0px;
    vertical-align: middle;
    display: inline-block;
    overflow: hidden;
    max-height: 100%;
  }  
  .cwattachments .grid3dcube .overlay .cmask span.ccaption > span 
  {
    line-height: 22px;
    padding: 0;
    overflow: hidden;

  }
  .cwattachments .grid3dcube .overlay .cmask:before { margin-right: 0px; }
  .cwattachments .grid3dcube .overlay .cmask span { opacity: 1; }

/**
 * Masonry
 */
/* border */
  .cwattachments .masonry .gallery a > span {display: block; border: 0px solid #fff;  }
  .cwattachments .masonry a img { display: block; }

  .cwattachments .masonry .overlay .cmask.dark span {
    opacity: 1;
    color: rgba(255,255,255,.9);
  }
  .cwattachments .masonry .overlay .cmask.light span {
    opacity: 1;
    color: rgba(0,0,0,.8);
    text-shadow: 0px 0px 0px #fff;
  }
  
  .cwattachments .masonry .overlay .cmask .ccaption {
    padding: 0px 15px;
  }
  .cwattachments .masonry .overlay .cmask .cdesc {
    opacity: 0;
  }
  .cwattachments .masonry a:hover .cmask .cdesc {
    display: block;
  }
  .cwattachments {
    position: relative;
  }

  .cwattachments .masonry .cwaitem > div {
    background: #f5f5f5;
    padding: 20px;
    overflow: hidden;
    background: #f9f9f9;
    padding: 20px;
    overflow: hidden;
    box-shadow: 0 0 5px #c5c5c5;
  }

  .cwattachments .masonry .cwaitem .fileheader > span {
    display: block !important;
    margin: auto;
    background-position-x: center;
    padding-bottom: 20px;
  }
  .cwattachments .masonry .cwaitem .fileheader {
    text-align: center;
    margin-bottom: 20px;
  }
  .cwattachments .masonry .cwaitem .fileheader a {
    -ms-word-break: break-all;
    word-break: break-all;
    text-decoration: none;
    font-size: 14px;
  }
  .cwattachments .masonry .cwaitem .cwa_info {
    -ms-word-break: break-all;
    word-break: break-all;
    display: table;
    border-top: 1px solid #e5e5e5;
    padding: 10px 0;
    width: 100%;
  }
  .cwattachments .masonry .cwaitem .cwa_info .ititle {
    display: table-cell;
    vertical-align: top;
    width: 70px;
    font-weight: bold;
  }
  .cwattachments .masonry .cwaitem .cwa_info .itext {
    display: inline-block;
  }

  .cwattachments .ccaption .ctags {
    text-align: center;
  }
  .cwattachments .cwaitem .fullsize {
    margin: auto;
    text-align: center;
  }
  .cwattachments .cwaitem .cwbutton.download {
    background: #555;
    color: #fff;
    text-align: center;
    margin: 20px auto 0;
    text-decoration: none;
  }
  .cwattachments .cwaitem .cwbutton.download:hover {
    background: #000;
  }

  
  /**
   * JUSTIFIED LAYOUT
   */
  .cwattachments.justified {
    width: 100%;
    margin: auto;
    overflow: hidden;
  }

  .cwattachments.justified .gallery a { background: none; max-height: 100%; }
  
  .calbumContainer .cwattachments .justified a.cimage { height: 100% !important; }
  .calbumContainer .cwattachments .justified a { height: 100%; }
  
  .cwattachments.justified .gallery a .cmask {
    /*
    padding: 5px !important;
    width: calc(100% - 10px) !important;
    height: calc(100% - 10px) !important;
    */
  }
  .cwattachments.justified .gallery a .cmaskWrapper{
    padding: 5px !important;
  }
    
  .cwattachments.justified .grid-item {
    opacity: 0;
    float: left;
    padding: 5px;
    box-sizing: border-box;
  }
  
  .cwattachments.justified .grid-item img {
    width: 100%;
    height: 100%;
  }
  
  .cwattachments.justified .grid-item.loaded {
    opacity: 1;
    transition: opacity .5s;
  }   
  .cwattachments.justified .gallery a.overlay .cmask.style6 {
    width: 50%!important;
  }
  .cwattachments.justified .gallery a.overlay .cmask.style7 {

    height: 50%!important;
  }
  .cwattachments .overlay .cmask.style7 .cmaskWrapper {
    padding: 5px;
  }  
  
  .cwattachments.justified .overlay .cmask.style2:before,
  .cwattachments.justified .overlay .cmask.style3:before,
  .cwattachments.justified .overlay .cmask.style4:before,
  .cwattachments.justified .overlay .cmask.style5:before,
  .cwattachments.justified .overlay .cmask.style6:before,
  .cwattachments.justified .overlay .cmask.style7:before
  { display: none !important; }
  
  .cwattachments.justified .cmask .cmaskWrapper {
    margin: auto;
    /*
    position: absolute;
    top: 0;
    left: 0;
    */
    width: calc(100% - 20px);
    height: calc(100% - 20px);
    overflow: hidden;
  }
  /* justified style1 overrides */
  .cwattachments.justified .gallery .style1 a .cmask {
    height: auto !important;
  }
  .cwattachments.justified .style1 .cmask .cmaskWrapper {
    position: relative !important;
  }


  /**
   * LOADER
   */
  .cwattachmentsmask > div > div {
    display: inline-block;
    width: 84px;
    height: 84px;
    margin: auto;
  }
  .cwattachmentsmask > div > div:after {
    content: " ";
    display: block;
    width: 66px;
    height: 66px;
    margin: 1px;
    border-radius: 50%;
    border: 15px solid #000;
    border-color: #000 transparent #d5d5d5 transparent;
    animation: lds-dual-ring 1.2s linear infinite, lds-dual-ring-color 4s linear infinite;
  }
  @keyframes lds-dual-ring-color {
    50% {
      border-color: #000 transparent #d5d5d5 transparent;  
    }
    25% {
      border-color: #f62fff transparent #0091ff transparent;
    }
    50% {
      border-color: #88fa76 transparent #ffcf59 transparent;
    }
    75% {
      border-color: #0091ff transparent #f62fff transparent;
    }    
    100% {
      border-color: #000 transparent #d5d5d5 transparent;
    }        
  }
  @keyframes lds-dual-ring {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }
   
  .cwattachments .cwattachmentsmask > div {
    display: flex;
    width: 100%;
    height: 100%;    
  }

  .cwattachments .cwattachmentsmask {
    background: rgba(255,255,255,0.8);
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: 999;
    display: none;    
  }


  .cwattachments { display: block; }
  .cwattachments a {
    display: inline-block;
    position: relative;
    vertical-align: top;
  }
  .cwattachments a span {display: block; }
  .cwattachments a span {
    height: auto;
    -webkit-transition: -webkit-transform .15s ease;
    -moz-transition: -moz-transform .15s ease;
    -o-transition: -o-transform .15s ease;
    -ms-transition: -ms-transform .15s ease;
    transition: transform .15s ease;
    position: relative;
  }
  .cwattachments .overlay .cmask span.ccaption > span {
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    -ms-transition: all 0.5s;
    transition: all 0.5s;
    word-break: break-word;
  }
  .cwattachments a img { width: 100%; max-width: initial; }
  .cwattachments a.big img {
    width: 40%;
  }
  .align-center {
    text-align: center;
  }
  .cwattachments .cleaner { clear: both; }
  
  .cwattachments a:hover .cmask {
    opacity: 1;
    z-index: 9;
  }

  /**
   * GRID3DCUBE
   */
  .cwattachments.grid3dcube .cwaitem.disabled { display: none; }
  
  .cwattachments.grid3dcube .cwaitem  {
    -webkit-transition: all 0.5s; /* Safari */
    transition: all 0.5s;    
  }
  @keyframes cwa-image-fade {
      0% {opacity: 0;}
      30% {opacity: 0.2; }
      100% {opacity: 1;}
  }
  
  .cwattachments.grid3dcube .cwaitem {

    animation: cwa-image-fade 1s ease-in-out;
    -moz-animation: cwa-image-fade 1s ease-in-out; /* Firefox */
    -webkit-animation: cwa-image-fade 1s ease-in-out; /* Safari and Chrome */
    -o-animation: cwa-image-fade 1s ease-in-out; /* Opera */  
  }

  .cwattachments .grid3dcube .cube__face--front {
    background: #f9f9f9;
  }
  .cwattachments .grid3dcube .fileheader {
    padding: 20px;
    word-break: break-all;
  }
  .cwattachments .grid3dcube .fileheader > * {
    display: block;
  }
  .cwattachments .grid3dcube .cwaitem .fileheader > span {
    display: block !important;
    margin: auto;
    background-position-x: center;
    padding-bottom: 20px;
  }
  .cwattachments .grid3dcube .cwaitem .fileheader {
    text-align: center;
  }
  .cwattachments .grid3dcube .cwaitem .fileheader a {
    -ms-word-break: break-all;
    word-break: break-all;
    text-decoration: none;
    font-size: 14px;
  }
  .cwattachments .grid3dcube .cwaitem .cwa_info {
    -ms-word-break: break-all;
    word-break: break-all;
    display: table;
    border-top: 1px solid #e5e5e5;
    padding: 10px 0;
    width: 100%;
    text-align: left;
    font-size: 14px;
  }
  .cwattachments .grid3dcube .cwaitem .cwa_info .ititle {
    display: table-cell;
    vertical-align: top;
    width: 90px;
    font-weight: bold;
  }
  .cwattachments .grid3dcube .cwaitem .cwa_info .itext {
    display: inline-block;
  }
  .cwattachments .grid3dcube .cube__face {
    color: #262626 !important;
    font-weight: normal !important;
    padding: 20px;
  }
  .cwattachments .grid3dcube .cube__face.cube__face--bottom {
    color: #fff !important;
  }
  .cwattachments .grid3dcube .cmaskWrapper {
    min-height: 90px;
    overflow: hidden;

    text-overflow: ellipsis;
    max-height: 170px;
  }
  .cwattachments .grid3dcube .cwaitem .cwbutton.download:hover {
    background: #fff;
    color: #000;
  }

  

  /**
   * GALLERY COMPONENT VIEW
   */
  .cwattachments .folderBack .galleryInfo
  {
    display: inline-block;
    vertical-align: top;
    margin: 5px;
  }
  .cwattachments .folderBack .galleryInfo .gtitle {
    font-size: 30px;
    margin-bottom: 10px;
  }
  .cwattachments .folderBack .cwicon {
    margin-right: 50px;
    line-height: 1;
    box-sizing: initial;
  }
  .cwattachments .folderBack .cwicon .fas {
    color: white;
  }
  .cwattachments .cwicon {
    margin: 5px;
    padding: 13px;
    font-size: 24px;
    background: #000;
    color: #fff;
    width: 24px;
    height: 24px;
    display: inline-block;
    text-align: center;
    border-radius: 50%;
    cursor: pointer;
    -webkit-transition: all 300ms ease-out;
    -moz-transition: all 300ms ease-out;
    -ms-transition: all 300ms ease-out;
    -o-transition: all 300ms ease-out;
    transition: all 300ms ease-out;
  }
  .cwattachments .cwicon:hover {
    background: #999;
  }
  /*
  .cwattachments {
    min-height: 500px;
  }
  */

  /**
   * LIST
   */
  .cwattachments.list .cwaitem.disabled { display: none; }
  .cwattachments { margin: 5px; }
  .cwattachments .gallery.list { padding: 0 5px; margin: 20px 0; }
  .cwattachments .gallery.list > div {
    background: url(../images/file.png) no-repeat left 5px; margin: 10px 0; clear: both;
    display: inline-block;
    padding: 5px 0px 5px 50px;
  }
  .cwattachments .gallery.list > div a.cattachment { float: left; padding: 0 0 0 5px; }
  .cwattachments .gallery.list > div .cwa_info { font-size: 12px; padding: 0px 5px; clear: both; font-style: italic; color: #999; line-height: 16px; }
  .cwattachments .gallery.list > div .cwa_desc { font-size: 12px; padding: 5px 5px; clear: both; }
  .cwattachments .gallery.list > div .cwa_image { margin-left: 20px; float: left; padding-top: 3px; }

  .cwattachments .masonry .ccontents {
    text-align: center;
  }
  .cwattachments .masonry .ccontents .ccontent {
    display: block;
  }
  .cwattachments .list .isAlbum .cwa_desc {
    display: none;
  }
  .cwattachments .list .cwaitem.isAlbum {
    padding: 10px;
  }
  .cwattachments .list .cwaitem.isAlbum .imagescount {
    margin-left: 20px;
    padding: 5px 10px;
    font-size: 80%;
    background: #e5e5e5;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
  }
  .cwattachments .gallery.list div.isAlbum a.cattachment {
    float: none;
    line-height: 36px;
    font-weight: bold;
  }
  .cwattachments .gallery.list div.isAlbum i {
    font-size: 36px;
    color: #d5d5d5;
    vertical-align: middle;
    margin-right: 10px;
  }
  .cwattachments .list .cwaitem.isAlbum .imagescount {
    margin: 5px 20px;
    padding: 5px 10px;
    font-size: 80%;
    background: #e5e5e5;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    line-height: 16px;
    display: inline-block;
    vertical-align: top;
  }
  .cwattachments .list .cwaitem.isAlbum:hover i {
    color: #0b172a;
  }
  .cwattachments .list .cwaitem.isAlbum:hover a {
    text-decoration: none;

  }
  .cwattachments .list .cwaitem.isAlbum.disabled {
    display: none;
  }
  .cwattachments .list .cwaitem.isAlbum {
    -webkit-transition: all 300ms; /* Safari */
    transition: all 300ms;
  }

  #adminForm .cwattachments > .cattachment li {
    display: block;
    padding: 5px 25px 5px 50px;
    background: url(../images/file.png) no-repeat left 5px;
    margin: 10px 0;
    clear: both;
    box-shadow: none;
  }
  #adminForm .cwattachments > .cattachment li .cwa_info {
    font-size: 12px;
    padding: 0px 5px;
    clear: both;
    font-style: italic;
    color: #999;
    line-height: 16px;
  }
  #adminForm .cwattachments > .cattachment li .cwa_info {
    font-size: 12px;
    padding: 0px 5px;
    clear: both;
    font-style: italic;
    color: #999;
    line-height: 16px;
  }
  #adminForm .cwattachments {
    min-height: 0px;
  }
  #adminForm .cwattachments .inactive {
    box-shadow: none !important;
  }
  #adminForm .cwattachments .inactive > *{
    color: #f03939 !important;
  }

  .cwFiltersModule.cwattachments {
    min-height: initial;
  }


.cwattachments a.locked {
  color: #999;
}