/* >> The Magnificent CLEARFIX: Updated to prevent margin-collapsing on child elements << j.mp/bestclearfix */ .clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; visibility: hidden; } .clearboth, .clearfix:after { clear: both; } /* fix clearfix: blueprintcss.lighthouseapp.com/projects/15318/tickets/5-extra-margin-padding-bottom-of-page */ .clearfix { zoom: 1; } .invisible { visibility: hidden; } .vamtam-config-page .disabled .button, .vamtam-config-page .disabled .button-primary { opacity: .3; } /* * tabs/ tab sections */ #vamtam-config-tabs { ul { margin: 0; padding: 0; } li { display: inline-block; margin: 0; } a { color: #555; border-color: #ccc; background: #e4e4e4; } a:hover, .ui-tabs-active a { color: #000; background: none; border-color: #ccc; border-bottom-color: #f1f1f1; } .ui-tabs-active a { border-width: 1px; color: #464646; } } h2.vamtam-config-no-tabs { padding-left: 1px; font-size: 30px; } /* * admin header */ #vamtam-config-title { display: none; width: 827px; margin-top: 30px; padding-top: 10px; } /* * helper links under header */ #vamtam-first-run, #vamtam-config-title-links { background-color: #f0f0f0; padding: 5px 10px; border-top: 1px solid #fff; } #vamtam-first-run { border-botom: 1px solid #dfdfdf; border-width: 1px 0; background-color: #ccf; } #vamtam-config-title-links * { -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } #vamtam-config-title-links .button-primary { float: right; position: relative; top: 3px; margin-top: -3px; padding: 0 6px; margin-right: 10px; } #vamtam-config-title-links a { color: #666; text-decoration: none; margin: 0 5px; text-transform: uppercase; font-size: 10px; font-weight: bold; position: relative; top: 4px; float: left; } #vamtam-config-title-links a:hover { color: #21759b; } #vamtam-config-title-links a:first-child { margin-left: 0; } #vamtam-config-title-links a:last-child { margin-right: 0; } /* * title in admin header */ #vamtam-config-title h2 { color: #666; padding: 10px; font-style: normal; border-bottom: 1px solid #dfdfdf; } #vamtam-config-title p { margin: 0; padding: 10px 0; } #vamtam-config-title .message { margin: 0; -moz-border-radius: 0; border-radius: 0; border: 0; background: #999BB9; color: #f0f0f0; text-align: center; } /* * config groups */ .vamtam-config-group { .config-info { padding: 15px 60px 15px 0; .info-wrapper { padding: 20px 18px; position: relative; background-color: #fff; border-left: 4px solid #0074a2; box-shadow: 0px 1px 1px 0px rgba(0,0,0,0.1); .title { color: #B07320; font-weight: bold; } .desc { display: none; padding-top: 15px; color: #707070; &.visible { display: block; } } > a { position: absolute; right: 18px; top: 20px; } } } .config-separator { font-weight: bold; padding: 30px 0 16px 7px; line-height: 1; border-bottom: 1px solid #ccc; font-size: 1.17em; } } .vamtam-config-group.metabox { background: none; border: 0; &, input, select, textarea { font-family: sans-serif; font-family: 12px; } .ui-tabs-nav { background: none; padding: 0; border-bottom: 1px solid #ccc; } .vamtam-meta-tab { display: inline-block; border: 0; margin-bottom: -2px; padding-bottom: 1px; background: transparent; a { display: inline-block; text-decoration: none; padding: 14px 18px 10px 18px; line-height: 1; font-size: 14px; font-family: sans-serif; color: #21759b; &:hover { color: #d54e21; } } &.ui-tabs-active { margin-bottom: -2px; a { border: 1px solid #ccc; border-bottom-color: #fff; background: #fff; border-radius: 3px 3px 0 0; color: #464646; } } } .vamtam-meta-part { background: #fff; &.ui-tabs-panel { border-top-width: 1px; padding: 0 6px; } } } #vamtam-portfolio-formats-select { .vamtam-config-group.metabox .vamtam-meta-part { background: transparent; border: 0; padding: 0; } .rtitle { display: none; } .rcontent { margin-left: 0; padding-top: 0; .toggle-radio { display: block; padding: 4px 0; } } .vamtam-config-row { padding-bottom: 0; border: 0; } } .vamtam-config-group h4 { font-size: 15px; font-weight: normal; color: #464646; margin: 10px 0; padding: 7px 0; font-family: Georgia,"Times New Roman","Bitstream Charter",Times,serif; } .vamtam-config-row.autofill { &.no-box { .rcontent > div { background: transparent; border: 0; } } .rcontent > div { max-width: 648px; background: #fff; border: 1px solid #eee; .autofill-description { margin: 0; text-shadow: 0 1px 0 #fff; color: #555; background: #fff; border-bottom: 1px solid #eee; font: 400 14px/19px 'Open Sans', sans-serif; padding: 7px 12px; } .autofill-thumbs { padding: 8px; a { display: inline-block; margin: 11px; border: 1px solid #ddd; box-shadow: 0 1px 0 #fff; position: relative; z-index: 1; img { cursor: pointer; vertical-align: bottom; } &.selected, &:hover { box-shadow: 0 0 0 1px white, 0 0 0 5px #85CA47; &:before { content: ""; display: block; position: absolute; background-image: url(../images/mark.png); background-repeat: no-repeat; height: 30px; width: 30px; top: -15px; right: -15px; z-index: 11; } } } } } } .vamtam-config-row { padding: 6px 20px; clear: both; } .vamtam-config-row { padding: 0 0 20px 0; border-bottom: 1px solid #e9e9e9; &.slim { border-bottom: 0; padding-bottom: 0; } &.short-border { border-bottom: 0; padding-bottom: 0; .rcontent { padding-bottom: 20px; border-bottom: 1px solid #e9e9e9; } } &.no-border { border-bottom: 0; } select { max-width: 100%; } .rtitle { float: left; width: 160px; padding: 27px 12px 0 12px; h4 { margin: 0; padding: 0; font-family: sans-serif; font-size: 12px; } .row-desc { margin: 0; padding: 0; position: relative; float: left; > a { text-decoration: none; margin-top: 10px; display: block; font-size: 14px; color: #ccc; &:hover, &:focus { color: #20759A; } } > div { display: none; position: absolute; top: 0; left: 36px; width: 380px; border: 1px solid #ccc; background: #fff; box-shadow: 2px 3px 6px rgba(0, 0, 0, 0.4); .content { padding: 14px; } footer { padding: 9px 14px; border-top: 1px solid #ccc; background: #f1f1f1; } &:after, &:before { top: 25px; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; } &:after { border-right-color: #fff; border-width: 10px; left: 0; z-index: 100; margin-left: -20px; margin-top: 1px; } &:before { border-right-color: #989898; border-width: 11px; left: 0; z-index: 99; margin-left: -22px; } } &:hover, &:focus { padding: 20px 0; margin: -20px 0; float: none; z-index: 100; > div { display: block; } > a { color: #20759A; } } } } .rcontent { padding-top: 25px; margin-left: 184px; } } /* * footer */ .save-vamtam-config { width: 827px; margin: 0; padding: 20px 14px 25px 14px; } /* * portfolio gallery */ .imageItemWrap .hndle { vertical-align: middle; width: 10px; } .imageItemWrap .hndle div { width: 10px; height: 10px; background: #55f; -moz-border-radius: 50px; border-radius: 50px; -moz-box-shadow: 0 0 10px rgba(0,0,0,0.4); -webkit-box-shadow: 0 0 10px rgba(0,0,0,0.4); -o-box-shadow: 0 0 10px rgba(0,0,0,0.4); box-shadow: 0 0 10px rgba(0,0,0,0.4); } #imagesSortable .sortItem-placeholder { background: #f0f0f0; border: 1px solid #ccc; } #credits_tbl { border: 1px solid #dfdfdf; } .vamtam_page_vamtam_help #vamtam-config, .vamtam-help { padding: 10px 20px; -moz-box-sizing: border-box; box-sizing: border-box; } .result { color: #FF4B33; display: block; } /* toggle */ .vamtam-config-row.toggle { .rcontent { img { margin-right: 10px; border: 1px solid #bbb; } .toggle-radio { display: inline-block; margin-right: 15px; } } } /* toggle */ /* radio */ .vamtam-config-row.radio { .toggle-radio { display: inline-block; margin-right: 15px; } } /* radio */ /* social */ .vamtam-config-row.social { tbody th { text-align: right; font-size: 12px; font-weight: bold; } td { text-align: center; } } /* social */ /* ajax save */ #vamtam-ajax-overlay { position: fixed; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0,0,0,0.3); z-index: 9999; } #vamtam-ajax-content { border-radius: 10px; background-color:rgba(0, 0, 0, 0.6); color: #fff; font-size: 40px; height: 80px; left: 45%; padding-top: 50px; position: fixed; text-align: center; top: 20%; width: 200px; z-index: 10000; } /* ajax save */ /* grid */ /* simple grid */ .one_half, .one_third, .two_thirds, .three_fourths, .one_fourth, .one_fifth, .two_fifths, .three_fifths, .four_fifths, .one_sixth, .five_sixths, .full, .grid-1-1, .grid-1-2, .grid-1-3, .grid-1-4, .grid-1-5, .grid-1-6, .grid-2-3, .grid-2-5, .grid-3-4, .grid-3-5, .grid-4-5, .grid-5-6, .cell-1-1, .cell-1-2, .cell-1-3, .cell-1-4, .cell-1-5, .cell-1-6, .cell-2-3, .cell-2-5, .cell-3-4, .cell-3-5, .cell-4-5, .cell-5-6 { position: relative; margin-right: 4%; float: left; } .one_half, .grid-1-2, .cell-1-2 { width: 48%; } .one_third, .grid-1-3, .cell-1-3 { width: 30.6666%; } .one_fourth, .grid-1-4, .cell-1-4 { width: 22%; } .one_fifth, .grid-1-5, .cell-1-5 { width: 16.8%; } .one_sixth, .grid-1-6, .cell-1-6 { width: 13.3333%; } .two_thirds, .grid-2-3, .cell-2-3 { width: 65.3332%; } .two_fifths, .grid-2-5, .cell-2-5 { width: 37.6%; } .three_fourths, .grid-3-4, .cell-3-4 { width: 74%; } .three_fifths, .grid-3-5, .cell-3-5 { width: 58.4%; } .four_fifths, .grid-4-5, .cell-4-5 { width: 79.2%; } .five_sixths, .grid-5-6, .cell-5-6 { width: 82.6665%; } .full, .cell-1-1 { width: 100%; } .last, .full { margin-right: 0 !important; clear: right; } /* grid */ .vamtam-config-row .slide-type { margin-bottom: 5px; } .vamtam-config-row[data-slide-type="html"] .slide-types .image { display: none; } .vamtam-config-row .slide-types .html textarea { width: 100%; } .hidden_el { border-top: 1px solid #ccc; padding-top: 10px } .hidden_el:first-child { border-top: 0; padding: 0 } .vamtam-config-row { select[multiple] { height: 6em; } label.checkbox-row { line-height: 1.8; } } /*** image upload ***/ .upload-basic-wrapper { .image-upload-controls { display: inline-block; vertical-align: bottom; width: 160px; height: 25px; padding-right: 10px; &.vamtam-video-upload-controls { width: auto; } } .image-upload-preview { display: none; vertical-align: bottom; } &.active { .image-upload-preview:not(.hidden) { display: inline-block; } } .button { display: inline-block; margin-right: 5px; } img { border: 1px solid #dfdfdf; max-width: 80px; max-height: 25px; min-width: 30px; vertical-align: bottom; } } .vamtam-upload-undo, .vamtam-upload-clear { display: inline-block; margin-left: 1px; } .vamtam-upload-undo.hidden, .vamtam-upload-clear.hidden { display: none; } /** backgrounds **/ .vamtam-config-row.background { .bg-block { margin-right: 15px; display: inline-block; &.bg-color, &.bg-image { width: 300px; } .ui-range-slider { width: 150px; } } .bg-position { width: 82px; } .hidden { display: none; } .toggle-radio { padding-right: 15px; } .bg-inner-row { padding-bottom: 25px; &:last-child { padding-bottom: 0; } } } /** text fields **/ .vamtam-config-row { &.text input, &.textarea textarea { width: 600px; max-width: 100% } } /** color rows **/ .color-row .single-color { float: left; padding-right: 5px; } .vamtam-config-row .single-desc { font-size: 9px; padding-bottom: 8px; color: #777; } .color-row .single-color input { font-size: 11px; } .vamtam-config-row .vamtam-colorpicker { width: 130px; border: 1px solid #dfdfdf; border-radius: 3px; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASwAAAAZCAYAAACLvRPfAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyNpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChNYWNpbnRvc2gpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjJEMDQwNDAzMkM1RjExRTM4RDM4Q0M4NkZBRUE4Nzk0IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjJEMDQwNDA0MkM1RjExRTM4RDM4Q0M4NkZBRUE4Nzk0Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MkQwNDA0MDEyQzVGMTFFMzhEMzhDQzg2RkFFQTg3OTQiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MkQwNDA0MDIyQzVGMTFFMzhEMzhDQzg2RkFFQTg3OTQiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz5nbDNSAAABO0lEQVR42uzdPS4FUQAF4DtBIXRCtBQ24CesACFhC4SCHShEFDZAITbgtyRhd+NM5tnDvfF9yenf5CQnkzfz7uv6vi8V65K75KoA/15X+WD9uUzukymVgcFqwXHynMyqDQxWC3aSz2RBdWCwWrCW/CQr6gOD1YLl5CtZVyEYrBbMJx/JnhrBYLVgJnlKTlQJBquJa0huk2t1gsFqxXnyWLyrBQarEYfJazKnWjBYLdgq4xPERfWCwWrBbhnf1QIMVtU2J3dYS+oFg1Wzg+St+A4LDFblzsr4lHBarWCwqr2G5GYSwGBVa7ibGt50P1UlGKyaDb8lfE/21QgGq2bDaQ3DuVgbKgSDVbPhPKzvZFV9YLBqtl3Gd6ycOAoGq2pHyUtxpjsYrMpdJA/FSQxgsGr+fMX/EgITvwIMAJBNY7YggCv5AAAAAElFTkSuQmCC'); background-position: left center; padding-left: 50px; color: #444 !important; font-size: 12px; background-size: cover; &.vamtam-state-transparent { background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAASwAAAAZCAAAAACu1kwDAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyNpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChNYWNpbnRvc2gpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjJEMDQwNDA3MkM1RjExRTM4RDM4Q0M4NkZBRUE4Nzk0IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjJEMDQwNDA4MkM1RjExRTM4RDM4Q0M4NkZBRUE4Nzk0Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MkQwNDA0MDUyQzVGMTFFMzhEMzhDQzg2RkFFQTg3OTQiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MkQwNDA0MDYyQzVGMTFFMzhEMzhDQzg2RkFFQTg3OTQiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz6IWNVXAAAAwklEQVRYw+3YrwvCYBDG8f3fN4PJaBSbiPHwR7M4DGJSbKLJ4sBkmuDU7QzDKDxmv0+7+oH37r1LrIk3+V4dgiQqlu8qsGQsHz3AkrGsfwNLxrLuFSwZyzr5f2NpSp9qegFLxvLxCSzXX2MG1g+ta1KBpff5YQmWPhR7BVgylg34Z8lmiztYKtbqyQ9exdrWrDsiVrpnN1SxWhsWaRWrfeTqIF8dzlwd1DE4LwIsESsrAywRa/0KsESsWR1gaVjpMsgbTfhCyWAv+vsAAAAASUVORK5CYII=') } } #vamtam-colorpicker { background: #fafafa; border: 1px solid #ccc; border-radius: 3px; z-index: 1000000; .transparent { display: block; text-align: center; border-top: 1px solid #ccc; margin-top: 10px; cursor: pointer; color: inherit; padding: 5px 0; } } /** select rows **/ .select-row, .range-row { .single-option { display: inline-block; padding-right: 5px; } } #front-static-pages label[for="page_for_posts"] { display: none; } body.toplevel_page_layerslider { #wpbody-content .screen-meta-toggle a { background: none; } } #vamtam-post-format-options, #vamtam-portfolio-format-options { border: 0; &:not(.vamtam-repositioned) { display: none; } > .hndle, > .handlediv { display: none; } > .inside { margin: 0; padding: 0; } } .rAds { display: none !important; } .vamtam-import-button.button { vertical-align: baseline; margin-right: 10px; + .import-success { color: #46b450; } + .import-fail { color: #dc3232; } } .form-table.vamtam-table th { width: 280px; } .vamtam-system-status { .dashicons-yes { color: #46b450; } .dashicons-warning { color: #ffb900; } } .vamtam-box-button { width: 200px; background: #FFFFFF; border: 1px solid #DDDDDD; display: inline-block; margin-right: 15px; margin-bottom: 15px; text-align: center; text-decoration: none; transition: all .3s ease; color: #000; font-weight: 600; font-size: 12px; &:hover { box-shadow: 0px 2px 6px 0px rgba(0,0,0,0.07); .dashicons { color: #00a0d2; } } .dashicons { display: block; width: 100%; padding: 10px 0px; color: #0073AA; font-size: 30px; font-weight: normal; height: 60px; line-height: 60px; } span.label { width: 100%; display: block; background: #FAFAFA; padding: 10px 0px; border-top: 1px solid #E6E6E6; } }