.alignnone { float: none !important; margin-bottom: 15px; } .textcenter { text-align: center; } .textright { text-align: right; } .alignright { float:right; margin: 1em 0 1em 1.5em; } .alignleft { float:left; margin: 1em 1.5em 1em 0; } .aligncenter { display: block; margin: 1em auto; } a img.alignright { float:right; margin: 0 0 20px 25px; } a img.alignnone { margin: 0px; } a img.alignleft { float:left; margin: 0 25px 20px 0; } a img.aligncenter { display: block; margin-left: auto; margin-right: auto } img.alignleft { margin: 0 25px 20px 0; } img.alignright { margin: 0 0 20px 25px; } img.aligncenter { display: block; margin: 0 auto; } img.alignnone { margin: 5px 0; } .wp-caption { max-width: 100%; a { border: var( --vamtam-no-border-link ); } } .wp-caption .wp-caption-text, .entry-caption, .gallery-caption { margin-top: 10px; text-align: center; .vamtam-font(em-); color: var( --vamtam-em-color ); } .wp-smiley, .wp-smiley * { border: 0px !important; } .sticky, .gallery-caption, .bypostauthor { outline: none;} table { border-collapse: collapse; border-spacing: 0; line-height: 2; width: 100%; } caption, th, td { font-weight: normal; text-align: left; } caption { font-size: 16px; margin: 20px 0; } table { border-collapse: collapse; margin: 0 0 1.5em; width: 100%; } thead th { border-bottom: 2px solid #bbb; padding-bottom: 0.5em; } th { padding: 0.4em; text-align: left; font-weight: 500; } td { padding: 0.4em; border: none; padding: 8px 0px 8px 0; } tr { border-bottom: 1px solid #eee; } th:first-child, td:first-child { padding-left: 0; } th:last-child, td:last-child { padding-right: 0; } dl { margin: 0 20px; } dt { font-weight: bold; } dd { margin: 0 0 10px; } address { font-style: italic; margin: 0 0 24px; } var, cite { font-style: italic; } [class*="gallery-columns-"] { margin: 0 -5px !important; &.gallery-columns-1 .gallery-item { width: percentage((1 / 1)); } &.gallery-columns-2 .gallery-item { width: percentage((1 / 2)); } &.gallery-columns-3 .gallery-item { width: percentage((1 / 3)); } &.gallery-columns-4 .gallery-item { width: percentage((1 / 4)); } &.gallery-columns-5 .gallery-item { width: percentage((1 / 5)); } &.gallery-columns-6 .gallery-item { width: percentage((1 / 6)); } &.gallery-columns-7 .gallery-item { width: percentage((1 / 7)); } &.gallery-columns-8 .gallery-item { width: percentage((1 / 8)); } &.gallery-columns-9 .gallery-item { width: percentage((1 / 9)); } figure.gallery-item { padding: 0 5px; display: inline-block; box-sizing: border-box; position: relative; &:hover { .gallery-caption { display: block; position: absolute; top: 100%; left: -40px; right: -40px; padding: 10px; border-radius: var( --vamtam-border-radius ); background: var( --vamtam-default-bg-color ); z-index: 10; margin: 0; box-shadow: 0 0 2px rgba( 0, 0, 0, 0.1 ); &:before, &:after { content: ""; position: absolute; top: -10px; left: 50%; border: 10px solid transparent; } &:before { border-top: 0; border-bottom-color: rgba( 0, 0, 0, 0.1 ); top: -11px; } &:after { border-top: 0; border-bottom-color: var( --vamtam-default-bg-color ); } } } img { display: inline-block; padding-bottom: 10px; } .gallery-caption { display: none; } } } @media ( max-width: 60px + 160px * 5 ) { [class*="gallery-columns-"] { figure.gallery-item { a, img { display: block !important; margin: auto; } &:hover { .gallery-caption { left: -50%; right: -50%; &:before, &:after { display: none; } } } } } } @media ( min-width: 60px + 160px * 4 + 1 ) and ( max-width: 60px + 160px * 5 ) { [class*="gallery-columns-"] { figure.gallery-item { width: percentage(( 1 / 4 )) !important; &:hover { .gallery-caption { left: -50%; right: -50%; &:before, &:after { display: none; } } } &:nth-child( 4n + 1 ):hover .gallery-caption { left: 0; right: -100%; } &:nth-child( 4n ):hover .gallery-caption { left: -100%; right: 0; } } } } @media ( min-width: 60px + 160px * 3 + 1 ) and ( max-width: 60px + 160px * 4 ) { [class*="gallery-columns-"] { figure.gallery-item { width: percentage(( 1 / 3 )) !important; &:nth-child( 3n + 1 ):hover .gallery-caption { left: 0; right: -100%; } &:nth-child( 3n ):hover .gallery-caption { left: -100%; right: 0; } } } } @media ( min-width: 60px + 160px * 2 + 1 ) and ( max-width: 60px + 160px * 3 ) { [class*="gallery-columns-"] { figure.gallery-item { width: percentage(( 1 / 2 )) !important; &:nth-child( 2n + 1 ):hover .gallery-caption { left: 0; right: -100%; } &:nth-child( 2n ):hover .gallery-caption { left: -100%; right: 0; } } } } @media ( max-width: 60px + 160px * 2 ) { [class*="gallery-columns-"] { figure.gallery-item { width: 100% !important; &:hover .gallery-caption { left: 0; right: 0; } } } }