/* Dropcaps -------------------------------------------------------------------------- */ .dropcap { display: inline-block; float: left; width: 35px; height: 35px; line-height: 35px; font-size: 20px; margin: 0 10px 5px 0; text-align: center; -webkit-border-radius: 5px; border-radius: 5px; background-image: url(../images/stripes/css_sprites_10_10.png); background-position: -31px -0; } .dropcap_circle { -webkit-border-radius: 100%; border-radius: 100% } .dropcap.transparent { background: none !important } .dropcap.size-2 { width: 50px; height: 50px; line-height: 50px; font-size: 35px } .dropcap.size-3 { width: 60px; height: 60px; line-height: 60px; font-size: 40px } /* Highlight ------------------------------------------------------------------------- */ .highlight { padding: 1px 7px; -webkit-border-radius: 3px; border-radius: 3px; background-image: url(../images/stripes/css_sprites_10_10.png); background-position: -31px -0; background-size: 10px 10px; } .highlight.highlight_image { padding: 0 2px 7px } /* Tooltip --------------------------------------------------------------------------- */ .tooltip { display: inline; position: relative; cursor: help; border-bottom-width: 1px; border-style: dotted } .tooltip:hover:after, .tooltip.hover:after { content: attr(data-tooltip); font-size: 13px; line-height: 18px; text-align: center; -webkit-border-radius: 5px; border-radius: 5px; padding: 5px 15px; width: 140px; position: absolute; left: 50%; bottom: 110%; z-index: 98; margin-left: -85px; background-image: url(../images/stripes/css_sprites_10_10.png); background-size: 10px 10px; background-position: -31px -0; } .tooltip.tooltip-img:after { display: none } .tooltip.tooltip-img .tooltip-content { display: none; font-size: 13px; line-height: 18px; text-align: center; -webkit-border-radius: 5px; border-radius: 5px; padding: 5px 15px; width: 300px; position: absolute; left: 50%; bottom: 110%; z-index: 98; margin-left: -165px; background-image: url(../images/stripes/css_sprites_10_10.png); background-size: 10px 10px; background-position: -31px -0; } .tooltip.tooltip-img:hover .tooltip-content, .tooltip.tooltip-img.hover .tooltip-content { display: block } .wpml-languages .tooltip:hover:after, .wpml-languages .tooltip.hover:after { top: 40px; bottom: auto } .wpml-languages:not(.disabled) .tooltip { cursor: default } .wpml-languages:not(.disabled) .tooltip:hover:after, .wpml-languages:not(.disabled) .tooltip.hover:after { display: none !important } /* Blockquote ------------------------------------------------------------------------ */ blockquote { font-size: 17px; line-height: 31px; display: block; height: auto; margin: 0 0 35px 25px; top: 15px; position: relative; background: url(../images/stripes/css_sprites_10_10.png); background-size: 1px 31px; background-position: -0 -10px; } blockquote:before { content: "" } blockquote:after { content: ""; width: 55px; height: 40px; background: url(../images/blockquote.png); position: absolute; left: -25px; top: -15px } .blockquote { margin-bottom: 20px } .blockquote blockquote { margin-bottom: 25px } .blockquote p.author { margin-left: 25px } .blockquote p.author i { margin-right: 5px } /* Button Item ----------------------------------------------------------------------- */ .column_button .button { margin: 0 !important; vertical-align: middle } .button_align.align_center { text-align: center } .button_align.align_right { text-align: right } /* Image frames ---------------------------------------------------------------------- */ .column_image { line-height: 0 } .image_frame, .wp-caption { display: block; margin: 0; border-width: 8px; border-style: solid; max-width: 100%; line-height: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } /* .image_frame.inline-block{display:inline-block;max-width:100%} */ /* deprecated since 13.1 */ .image_frame .image_wrapper, .wp-caption img { -webkit-box-sizing: border-box; box-sizing: border-box } .image_frame a, .wp-caption a { display: block; text-align: center; } .wp-caption-text { display: block; text-align: center; margin: 0; padding: 10px 0 5px; line-height: normal } .wp-caption-text.hide { display: none } .if-caption-on .image_frame { position: relative } .if-caption-on .wp-caption-text { background: rgba(0, 0, 0, .5); border-radius: 3px; bottom: 17px; color: rgba(255, 255, 255, .7); left: 17px; padding: 5px 10px !important; position: absolute } .image_frame.no_border .wp-caption-text, .if-zoom .image_frame:not(.has_border) .wp-caption-text { padding: 10px 0; } .the_content_wrapper .image_frame, .the_content_wrapper .wp-caption { margin-bottom: 20px } .the_content_wrapper .wp-caption.alignnone, .the_content_wrapper .wp-caption.aligncenter { clear: both } .image_frame .image_wrapper { position: relative; overflow: hidden } .image_frame .image_wrapper .mask { position: absolute; left: 0; width: 100%; height: 100%; z-index: 2 } .image_frame .image_wrapper img:not(.ls-l) { position: relative; top: 0; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1) } .image_frame:not(.no_link) .image_wrapper img:not(.ls-l) { margin-bottom: -15px !important } .masonry-flat .image_frame:not(.no_link) .image_wrapper img:not(.ls-l) { margin-bottom: 0 !important } .image_frame:hover .image_wrapper img, .image_frame.hover .image_wrapper img { top: -15px } .image_frame:hover .image_wrapper .ls-container img, .image_frame.no_link:hover .image_wrapper img { top: 0 } .image_frame .image_wrapper .mask:after { content: ""; display: block; position: absolute; left: 0; width: 100%; height: 100%; z-index: 3; filter: alpha(opacity=0); opacity: 0 } .image_frame:hover .image_wrapper .mask:after, .image_frame.hover .image_wrapper .mask:after { filter: alpha(opacity=100); opacity: 1 } .image_frame.no_link:hover .image_wrapper .mask:after { filter: alpha(opacity=0); opacity: 0 } .image_frame .image_wrapper .image_links { width: 100%; height: 40%; max-height: 60px; position: absolute; left: 0; bottom: -60px; z-index: 4; overflow: hidden; } .image_frame:hover .image_wrapper .image_links, .image_frame.hover .image_wrapper .image_links { bottom: 0 } .image_frame .image_wrapper .image_links a { display: block; font-size: 25px; width: 100%; text-align: center } .image_frame .image_wrapper .image_links.double a { width: 50%; height: 100%; float: left; position: relative; } .image_frame .image_wrapper .image_links.double a>i { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .image_frame .image_wrapper .image_links.double a:first-child { -webkit-box-shadow: inset -1px 0 0 0 rgba(255, 255, 255, .2); box-shadow: inset -1px 0 0 0 rgba(255, 255, 255, .2) } .image_frame .image_wrapper .image_links.triple a { width: 33%; display: block; float: left; -webkit-box-shadow: inset -1px 0 0 0 rgba(255, 255, 255, .2); box-shadow: inset -1px 0 0 0 rgba(255, 255, 255, .2) } .image_frame .image_wrapper .image_links.triple a:last-child { -webkit-box-shadow: 0 0 0; box-shadow: 0 0 0; width: 34% } .image_frame .image_wrapper .image_links.hover-title a { font-size: 15px; text-decoration: none } .image_frame.no_border { border-width: 0 } /* Alignments ------------------------------------------------------------------------ */ .alignleft { float: left; margin: 15px 15px 15px 0 } .alignright { float: right; margin: 15px 0 15px 15px } .aligncenter { text-align: center; margin: 0 auto; display: block } .aligncenter img { display: inline } /* Animation */ .image_frame .image_wrapper img, .image_frame .image_wrapper .mask:after, .image_frame .image_wrapper .image_links { -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .image_frame .image_wrapper .image_links a { -webkit-transition: all .1s ease-in-out; -o-transition: all .1s ease-in-out; transition: all .1s ease-in-out } /* Greyscale */ .greyscale .image_wrapper img { top: 0 !important; margin-bottom: 0 !important } .greyscale .image_wrapper img.BWFilter { opacity: 1; z-index: 2 } .greyscale .image_wrapper img:not(.BWFilter) { opacity: 0 } .greyscale .image_wrapper:hover img.BWFilter { opacity: 0 !important } .greyscale .image_wrapper:hover img:not(.BWFilter) { opacity: 1 !important } .greyscale:not(.no_link) .image_wrapper img:not(.ls-l) { margin-bottom: 0 !important } .greyscale .image_wrapper .mask { display: none } .greyscale .image_frame .image_wrapper img { -webkit-transition: all 0s; -o-transition: all 0s; transition: all 0s } .greyscale.tiles .post-item .image_wrapper_tiles img.BWFilter { opacity: 1; z-index: 2 } .greyscale.tiles .post-item .image_wrapper_tiles img:not(.BWFilter) { opacity: 0 } .greyscale.tiles .post-item:hover .image_wrapper_tiles img.BWFilter { opacity: 0 !important } .greyscale.tiles .post-item:hover .image_wrapper_tiles img:not(.BWFilter) { opacity: 1 !important } /* Style | Overlay */ .if-overlay .image_frame .image_wrapper .image_links { opacity: 0; width: 60px; height: 60px; bottom: auto; top: 50%; left: 50%; z-index: 4; margin-top: -30px; margin-left: -30px; -moz-transform: scale(0); -webkit-transform: scale(0); -o-transform: scale(0) } .if-overlay .image_frame .image_wrapper .image_links.double { width: 120px; margin-left: -60px } .if-overlay .image_frame .image_wrapper .image_links.triple { width: 180px; margin-left: -90px } .if-overlay .image_frame .image_wrapper .image_links.hover-title { width: 100%; left: 0; margin-left: 0 } .if-overlay li.product .product-loading-icon, .if-overlay li.product .added-cart { border-radius: 0 !important; width: 60px !important; height: 60px !important; margin: -30px 0 0 -30px !important } .if-overlay li.product.adding-to-cart .added-cart, .if-overlay li.product.added-to-cart .added-cart { z-index: 5 !important } .if-overlay .image_frame:not(.no_link) .image_wrapper img:not(.ls-l) { margin-bottom: 0 } .if-overlay .image_frame:hover .image_wrapper .image_links, .if-overlay .image_frame.hover .image_wrapper .image_links { opacity: 1; -moz-transform: scale(1); -webkit-transform: scale(1); -o-transform: scale(1) } .if-overlay .image_frame:hover .image_wrapper img, .if-overlay .image_frame.hover .image_wrapper img { -moz-transform: scale(1.2); -webkit-transform: scale(1.2); -o-transform: scale(1.2); top: 0 } .if-overlay .image_item:hover .image_wrapper img, .if-overlay .image_item.hover .image_wrapper img { -moz-transform: scale(1); -webkit-transform: scale(1); -o-transform: scale(1) } /* Style | Zoom */ .if-zoom {} .if-zoom .image_frame .image_wrapper .image_links { display: none; } .if-zoom .image_frame:not(.no_link) .image_wrapper img:not(.ls-l) { margin-bottom: 0 !important } .if-zoom .image_frame:hover .image_wrapper img, .if-zoom .image_frame.hover .image_wrapper img { top: 0 } .if-zoom .image_frame .image_wrapper .mask { display: none; } .if-zoom .image_frame:hover .image_wrapper img, .if-zoom .image_frame.hover .image_wrapper img { -moz-transform: scale(1.1); -webkit-transform: scale(1.1); -o-transform: scale(1.1); } .if-zoom .image_frame.no_link:hover .image_wrapper img, .if-zoom image_frame.no_link.hover .image_wrapper img { -moz-transform: scale(1); -webkit-transform: scale(1); -o-transform: scale(1) } /* Hide border */ .if-border-hide .image_frame:not(.has_border) { border-width: 0; } /* Hover Disable */ .image_frame.hover-disable .image_wrapper .image_links { display: none } .image_frame.hover-disable .image_wrapper .mask { display: none !important } .image_frame.hover-disable .image_wrapper img { margin-bottom: 0 !important; top: 0 !important; -moz-transform: scale(1) !important; -webkit-transform: scale(1) !important; -o-transform: scale(1) !important } .image_frame.hover-disable:not(.no_link) .image_wrapper img:not(.ls-l) { margin-bottom: 0 !important } /* Video ----------------------------------------------------------------------------- */ /* In this case, the aspect ratio is 16:9, which means that the height will be 56.25% of the width. For a video with a 4:3 aspect ratio, we set padding-bottom to 75%. */ .content_video.iframe.auto-wh { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden } .content_video.iframe.auto-wh iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100% } .post-photo-wrapper.embed .image_wrapper, .single-photo-wrapper.embed .image_wrapper { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden } .post-photo-wrapper.embed .image_wrapper iframe, .single-photo-wrapper.embed .image_wrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100% } .post-photo-wrapper.html5 .jp-jplayer, .single-photo-wrapper.html5 .jp-jplayer { position: relative; padding-bottom: 56.25%; height: 0 !important; overflow: hidden } .post-photo-wrapper.html5 .jp-jplayer img, .single-photo-wrapper.html5 .jp-jplayer img { position: absolute; } .post-photo-wrapper.html5 .jp-jplayer video, .single-photo-wrapper.html5 .jp-jplayer video { position: absolute; top: 0; left: 0; width: 100%; height: 100% } /* Gallery --------------------------------------------------------------------------- */ .gallery .gallery-item { overflow: hidden; margin: 0 0 10px !important } .gallery .gallery-item .gallery-icon { border: 0; width: 95%; overflow: hidden; line-height: 0; margin-right: 2.5% !important; margin-left: 2.5% !important; padding: 0 !important; position: relative } .gallery .gallery-item img { border: 0 !important; line-height: 0; display: block } .gallery-columns-2 .gallery-item:nth-child(2n+1) { clear: both } .gallery-columns-3 .gallery-item:nth-child(3n+1) { clear: both } .gallery-columns-4 .gallery-item:nth-child(4n+1) { clear: both } .gallery-columns-5 .gallery-item:nth-child(5n+1) { clear: both } .gallery-columns-6 .gallery-item:nth-child(6n+1) { clear: both } .gallery-columns-7 .gallery-item:nth-child(7n+1) { clear: both } .gallery-columns-8 .gallery-item:nth-child(8n+1) { clear: both } .gallery-columns-9 .gallery-item:nth-child(9n+1) { clear: both } /* Gallery | Flat */ .gallery.flat .gallery-item { margin: 0 !important } .gallery.flat .gallery-item .gallery-icon { margin: 0 !important; width: 100% } .gallery.flat .gallery-item .gallery-icon .image_frame { border-width: 0; margin-bottom: 0 } /* Gallery | Fancy */ .gallery.fancy .gallery-item:nth-child(2n+1) { -webkit-transform: rotate(-2deg); -ms-transform: rotate(-2deg); transform: rotate(-2deg) } .gallery.fancy .gallery-item:nth-child(2n) { -webkit-transform: rotate(2deg); -ms-transform: rotate(2deg); transform: rotate(2deg) } .gallery.fancy .gallery-item .image_frame { margin: 7% } /* Gallery | Masonry */ .gallery.masonry .gallery-item { margin: 0 !important } .gallery.masonry .gallery-item .gallery-icon { margin: 0 !important; width: 100% } .gallery.masonry .gallery-item .image_frame { margin-bottom: 0 } /* Divider --------------------------------------------------------------------------- */ hr { display: block; border: none; outline: none; height: 1px; width: 100%; margin: 0 auto 15px; clear: both } hr, .hr_wide, .hr_zigzag, .hr_dots { margin: 0 auto 15px; clear: both } hr.hr_narrow { width: 7% } hr.no_line { background: none; color: transparent; } .hr_wide { position: relative; height: 1px } .hr_wide hr { position: absolute; left: -1000px; top: 0; width: 3000px } .aside_left .hr_wide hr { left: 0 } .aside_right .hr_wide hr { right: 0; left: auto } .hr_zigzag { text-align: center; margin-bottom: 10px } .hr_zigzag i { font-size: 25px; line-height: 25px; margin: 0 -11px; display: inline-block } .hr_dots { text-align: center; line-height: 0 } .hr_dots span { display: inline-block; width: 5px; height: 5px; overflow: hidden; margin: 0 5px; border-radius: 5px } .column_divider hr, .column_divider .hr_wide, .column_divider .hr_zigzag, .column_divider .hr_dots { margin-bottom: 0 } /* Divider | Fancy */ .fancy-divider svg { display: block } .fancy-divider svg:not(:root) { overflow: hidden } /* Decoration SVG */ .section .section-divider { display: block; width: 50px; height: 50px; position: absolute; left: 50%; margin-left: -25px; background-color: inherit; z-index: 1 } .section-divider.triangle.up, .section-divider.triangle.down { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg) } .section-divider.triangle.up { top: -25px } .section-divider.triangle.down { bottom: -25px } .section-divider.triple-triangle:after, .section-divider.triple-triangle:before { content: ""; display: block; width: 50px; height: 50px; position: absolute; background-color: inherit; z-index: 1 } .section-divider.triple-triangle.up:after { left: -36px; top: 50px } .section-divider.triple-triangle.up:before { right: -50px; top: -36px } .section-divider.triple-triangle.down:after { left: -51px; top: 35px } .section-divider.triple-triangle.down:before { right: -35px; top: -50px } .section-divider.triple-triangle.up, .section-divider.triple-triangle.down { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg) } .section-divider.triple-triangle.up { top: -25px } .section-divider.triple-triangle.down { bottom: -25px } .section-divider.square.up, .section-divider.square.down { width: 70px; height: 70px; margin-left: -35px } .section-divider.square.up { top: -25px } .section-divider.square.down { bottom: -25px } .section-divider.circle.up, .section-divider.circle.down { width: 70px; height: 70px; margin-left: -35px; border-radius: 100% } .section-divider.circle.up { top: -25px } .section-divider.circle.down { bottom: -25px } /* Decoration Image | height:100px - fallback */ .section .section-decoration { width: 100%; height: 100px; position: absolute; left: 0; background-repeat: repeat-x; z-index: 1; } .section .section-decoration.top { top: 0; background-position: center top; } .section .section-decoration.bottom { bottom: 0; background-position: center bottom; } /* Idea box -------------------------------------------------------------------------- */ .idea_box { padding: 25px 25px 25px 70px; position: relative; border-top-width: 1px; border-style: solid; background: rgba(0, 0, 0, .02); clear: both } .idea_box .icon { font-size: 30px; line-height: 30px; position: absolute; left: 15px; top: 50%; margin-top: -15px; color: rgba(0, 0, 0, .15) } /* Google font ----------------------------------------------------------------------- */ .google_font { margin-bottom: 15px; } /* Popup | .popup-content ------------------------------------------------------------ */ .popup-content { display: none; } /* Single icon ----------------------------------------------------------------------- */ .single_icon { display: block; margin: 0 auto 15px } .single_icon.icon_left { text-align: left } .single_icon.icon_right { text-align: right } .single_icon.icon_center { text-align: center } /* Forms ----------------------------------------------------------------------------- */ form, fieldset { margin-bottom: 0 } textarea { min-height: 60px } label, legend { display: block; margin-bottom: 5px; font-weight: 700 } input[type="checkbox"] { display: inline } input[type="date"], input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="url"], select, textarea { padding: 10px; outline: none; margin: 0; width: 230px; max-width: 100%; display: block; margin-bottom: 20px; font-size: 13px; border-width: 1px; border-style: solid; border-radius: 0; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-appearance: none } /* Lists ----------------------------------------------------------------------------- */ ul { list-style: none outside } ol { list-style: decimal } .column_column ul, .column_column ol, .column_helper ul, .column_helper ol, .column_visual ul, .column_visual ol, .mfn-acc ul, .mfn-acc ol, .ui-tabs-panel ul, .ui-tabs-panel ol { margin: 0 0 15px 30px } .column_column ul li, .column_helper ul li, .column_visual ul li, .mfn-acc ul li, .ui-tabs-panel ul li, .the_content_wrapper ul li { list-style: disc outside } .column_column ul li, .column_column ol li, .column_helper ul li, .column_helper ol li, .column_visual ul li, .column_visual ol li, .mfn-acc ul li, .mfn-acc ol li, .ui-tabs-panel ul li, .ui-tabs-panel ol li, .the_content_wrapper ul li, .the_content_wrapper ol li { margin-bottom: 10px } .column_column ul li ul, .column_column ol li ol, .column_helper ul li ul, .column_helper ol li ol, .column_visual ul li ul, .column_visual ol li ol, .mfn-acc ul li ul, .mfn-acc ol li ol, .ui-tabs-panel ul li ul, .ui-tabs-panel ol li ol, .the_content_wrapper ul li ul, .the_content_wrapper ol li ol { margin-top: 10px; margin-bottom: 0 } ul.list_mixed, ul.list_check, ul.list_star, ul.list_idea { margin-left: 0 } ul.list_mixed li, ul.list_check li, ul.list_star li, ul.list_idea li { margin-bottom: 20px; position: relative; list-style: none; padding-left: 50px; margin-left: 0 } ul.list_mixed li:after, ul.list_check li:after, ul.list_star li:after, ul.list_idea li:after { content: ""; width: 70px; height: 1px; overflow: hidden; background: rgba(0, 0, 0, .08); position: absolute; left: 0; bottom: -11px } ul.list_mixed li:last-child:after, ul.list_check li:last-child:after, ul.list_star li:last-child:after, ul.list_idea li:last-child:after { display: none } ul.list_check li, li.list_check { background: url(../images/icons/list_check.png) no-repeat 20px 5px } ul.list_star li, li.list_star { background: url(../images/icons/list_star.png) no-repeat 20px 5px } ul.list_idea li, li.list_idea { background: url(../images/icons/list_idea.png) no-repeat 20px 6px } dl { margin: 0 0 30px } dl>dt, dl>dd { border-width: 1px 0 0; border-style: solid; padding: 10px 0; margin: 0 } dl>dt { display: block; float: left; width: 100px; font-weight: 700 } dl>dd { margin-left: 110px } dl>dd:after { content: ""; clear: both; display: block } /* Alerts ---------------------------------------------------------------------------- */ .alert { margin-bottom: 30px; padding: 20px 55px 20px 90px; position: relative; border-radius: 5px } .alert .alert_icon { width: 60px; height: 60px; font-size: 30px; line-height: 60px; color: rgba(0, 0, 0, .4); position: absolute; left: 10px; top: 10px; text-align: center; border-radius: 5px } .alert a.close { position: absolute; right: 15px; top: 20px; font-size: 20px; line-height: 20px } .alert a.close i { margin: 0 !important; color: rgba(0, 0, 0, .6) } .alert a:hover.close i { color: rgba(0, 0, 0, .8) } .alert_warning { background: #ffe38b; color: #9b812e } .alert_warning .alert_icon { background: #fbda72 } .alert_warning a, .alert_warning a:hover { color: #645012 } .alert_error { background: #fb5455; color: #fff } .alert_error .alert_icon { background: #f24143 } .alert_error a, .alert_error a:hover { color: #9f2e2e } .alert_info { background: #3097db; color: #fff } .alert_info .alert_icon { background: #1c81c4 } .alert_info a, .alert_info a:hover { color: #b1e0ff } .alert_success { background: #a5de5c; color: #fff } .alert_success .alert_icon { background: #8fc944 } .alert_success a, .alert_success a:hover { color: #5d9514 } /* Theme link ----------------------------------------------------------------------- */ a.mfn-link { position: relative; display: inline-block; margin: 15px 25px; font-size: 15px; text-shadow: 0 0 1px rgba(255, 255, 255, 0.3); text-decoration: none; outline: none; white-space: nowrap } a:hover.mfn-link { text-decoration: none } /* Effect 1: Brackets */ a.mfn-link-1:before, a.mfn-link-1:after { display: inline-block; opacity: 0; -webkit-transition: -webkit-transform 0.3s, opacity .2s; -webkit-transition: opacity .2s, -webkit-transform 0.3s; transition: opacity .2s, -webkit-transform 0.3s; -o-transition: transform 0.3s, opacity .2s; transition: transform 0.3s, opacity .2s; transition: transform 0.3s, opacity .2s, -webkit-transform 0.3s } a.mfn-link-1:before { margin-right: 10px; content: '['; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px) } a.mfn-link-1:after { margin-left: 10px; content: ']'; -webkit-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px) } a:hover.mfn-link-1:before, a:hover.mfn-link-1:after, a.hover.mfn-link-1:before, a.hover.mfn-link-1:after { opacity: 1; -webkit-transform: translateX(0px); -ms-transform: translateX(0px); transform: translateX(0px) } /* Effect 2: 3D rolling links */ a.mfn-link-2 { line-height: 44px; -webkit-perspective: 1000px; perspective: 1000px } a.mfn-link-2 span { position: relative; display: inline-block; padding: 0 14px; -webkit-transition: -webkit-transform .3s; transition: -webkit-transform .3s; -o-transition: transform .3s; transition: transform .3s; transition: transform .3s, -webkit-transform .3s; -webkit-transform-origin: 50% 0; -ms-transform-origin: 50% 0; transform-origin: 50% 0; -webkit-transform-style: preserve-3d; transform-style: preserve-3d } a.mfn-link-2 span:before { position: absolute; top: 100%; left: 0; width: 100%; height: 100%; content: attr(data-hover); -webkit-transition: background .3s; -o-transition: background .3s; transition: background .3s; -webkit-transform: rotateX(-90deg); transform: rotateX(-90deg); -webkit-transform-origin: 50% 0; -ms-transform-origin: 50% 0; transform-origin: 50% 0; text-align: center } a:hover.mfn-link-2 span, a.hover.mfn-link-2 span { -webkit-transform: rotateX(90deg) translateY(-22px); transform: rotateX(90deg) translateY(-22px) } /* Effect 3: bottom line */ a.mfn-link-3 { padding: 8px 0 } a.mfn-link-3:after { position: absolute; top: 100%; left: 0; width: 100%; height: 3px; content: ''; opacity: 0; -webkit-transition: opacity 0.3s, -webkit-transform .3s; transition: opacity 0.3s, -webkit-transform .3s; -o-transition: opacity 0.3s, transform .3s; transition: opacity 0.3s, transform .3s; transition: opacity 0.3s, transform .3s, -webkit-transform .3s; -webkit-transform: translateY(10px); -ms-transform: translateY(10px); transform: translateY(10px) } a:hover.mfn-link-3:after, a.hover.mfn-link-3:after { opacity: 1; -webkit-transform: translateY(0px); -ms-transform: translateY(0px); transform: translateY(0px) } /* Effect 4: second border slides up */ a.mfn-link-4 { padding: 12px 10px 10px; text-shadow: none; font-weight: 700 } a.mfn-link-4:before, a.mfn-link-4::after { position: absolute; top: 100%; left: 0; width: 100%; height: 3px; content: ''; -webkit-transition: -webkit-transform .3s; transition: -webkit-transform .3s; -o-transition: transform .3s; transition: transform .3s; transition: transform .3s, -webkit-transform .3s; -webkit-transform: scale(0.85); -ms-transform: scale(0.85); transform: scale(0.85) } a.mfn-link-4:after { opacity: 0; -webkit-transition: top 0.3s, opacity 0.3s, -webkit-transform .3s; transition: top 0.3s, opacity 0.3s, -webkit-transform .3s; -o-transition: top 0.3s, opacity 0.3s, transform .3s; transition: top 0.3s, opacity 0.3s, transform .3s; transition: top 0.3s, opacity 0.3s, transform .3s, -webkit-transform .3s } a:hover.mfn-link-4:before, a:hover.mfn-link-4:after, a.hover.mfn-link-4:before, a.hover.mfn-link-4:after { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1) } a:hover.mfn-link-4:after, a.hover.mfn-link-4:after { top: 0; opacity: 1 } /* Effect 5: reveal, push out */ a.mfn-link-5 { overflow: hidden; margin: 0 15px; position: relative; z-index: 1 } a.mfn-link-5 span { display: block; padding: 10px 20px; -webkit-transition: -webkit-transform .3s; transition: -webkit-transform .3s; -o-transition: transform .3s; transition: transform .3s; transition: transform .3s, -webkit-transform .3s } a.mfn-link-5:before { position: absolute; top: 0; left: 0; text-align: left; z-index: -1; padding: 10px 20px; width: 100%; height: 100%; content: attr(data-hover); -webkit-transition: -webkit-transform .3s; transition: -webkit-transform .3s; -o-transition: transform .3s; transition: transform .3s; transition: transform .3s, -webkit-transform .3s; -webkit-transform: translateX(-25%); -ms-transform: translateX(-25%); transform: translateX(-25%) } a:hover.mfn-link-5 span, a.hover.mfn-link-5 span { -webkit-transform: translateX(100%); -ms-transform: translateX(100%); transform: translateX(100%) } a:hover.mfn-link-5:before, a.hover.mfn-link-5:before { -webkit-transform: translateX(0%); -ms-transform: translateX(0%); transform: translateX(0%) } /* Effect 6: text fill*/ a.mfn-link-6 { padding: 10px 0; text-shadow: none } a.mfn-link-6:before { position: absolute; top: 0; left: 0; overflow: hidden; padding: 10px 0; max-width: 0; border-bottom: 2px solid; content: attr(data-hover); -webkit-transition: max-width .5s; -o-transition: max-width .5s; transition: max-width .5s } a:hover.mfn-link-6:before, a.hover.mfn-link-6:before { max-width: 100% } /* Effect 7: border switch */ a.mfn-link-7 { padding: 0 20px; height: 45px; line-height: 45px } a.mfn-link-7:before, a.mfn-link-7:after { position: absolute; width: 45px; height: 2px; content: ''; opacity: .2; -webkit-transition: all .3s; -o-transition: all .3s; transition: all .3s; pointer-events: none } a.mfn-link-7:before { top: 0; left: 0; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); -webkit-transform-origin: 0 0; -ms-transform-origin: 0 0; transform-origin: 0 0 } a.mfn-link-7:after { right: 0; bottom: 0; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); -webkit-transform-origin: 100% 0; -ms-transform-origin: 100% 0; transform-origin: 100% 0 } a:hover.mfn-link-7:before, a:hover.mfn-link-7:after, a.hover.mfn-link-7:before, a.hover.mfn-link-7:after { opacity: 1 } a:hover.mfn-link-7:before, a.hover.mfn-link-7:before { left: 50%; -webkit-transform: rotate(0deg) translateX(-50%); -ms-transform: rotate(0deg) translateX(-50%); transform: rotate(0deg) translateX(-50%) } a:hover.mfn-link-7:after, a.hover.mfn-link-7:after { right: 50%; -webkit-transform: rotate(0deg) translateX(50%); -ms-transform: rotate(0deg) translateX(50%); transform: rotate(0deg) translateX(50%) } /* Effect 8: cross */ a.mfn-link-8 { padding: 0 5px; font-weight: 700; -webkit-transition: color .3s; -o-transition: color .3s; transition: color .3s; position: relative; z-index: 1 } a.mfn-link-8:before, a.mfn-link-8:after { position: absolute; width: 100%; left: 0; top: 50%; height: 2px; margin-top: -1px; content: ''; z-index: -1; -webkit-transition: -webkit-transform 0.3s, opacity .3s; -webkit-transition: opacity .3s, -webkit-transform 0.3s; transition: opacity .3s, -webkit-transform 0.3s; -o-transition: transform 0.3s, opacity .3s; transition: transform 0.3s, opacity .3s; transition: transform 0.3s, opacity .3s, -webkit-transform 0.3s; pointer-events: none } a.mfn-link-8:before { -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px) } a.mfn-link-8:after { -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px) } a:hover.mfn-link-8:before, a:hover.mfn-link-8:after, a.hover.mfn-link-8:before, a.hover.mfn-link-8:after { opacity: .7 } a:hover.mfn-link-8:before, a.hover.mfn-link-8:before { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg) } a:hover.mfn-link-8:after, a.hover.mfn-link-8:after { -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg) } /* variables */ a.mfn-link-4:before, a.mfn-link-4:after, a.mfn-link-3:after, a:hover.mfn-link-8:after, a:hover.mfn-link-8:before, a.hover.mfn-link-8:after, a.hover.mfn-link-8:before { background: rgba(0, 0, 0, 0.1) } a.mfn-link-6 { border-top: 2px solid rgba(0, 0, 0, .05) } a.mfn-link.mfn-link-6 { color: rgba(0, 0, 0, .25) } a.mfn-link-2 span, a:hover.mfn-link-2 span:before, a.hover.mfn-link-2 span:before, a.mfn-link-5 span, a.mfn-link-5:before { color: #fff } /* Accordion ------------------------------------------------------------------------- */ .accordion .question { margin-bottom: 5px; border-radius: 5px; overflow: hidden; border-width: 1px; border-style: solid } .accordion .question:last-child { margin-bottom: 0 } .accordion .question .title { padding: 14px 14px 14px 60px; font-size: 13px; font-weight: 700; position: relative; border-width: 0; border-style: solid; cursor: pointer; background-image: url(../images/bg_panel.png); background-repeat: repeat-x; background-position: left top } .accordion .question .title:before { content: ""; width: 49px; height: 100%; border-width: 0 1px 0 0; border-style: solid; position: absolute; left: 0; top: 0; z-index: 1 } .accordion .question .title>.acc-icon-plus, .accordion .question .title>.acc-icon-minus { font-size: 17px; line-height: 17px; display: block; position: absolute; left: 15px; top: 16px; width: 20px; height: 20px; text-align: center; color: rgba(0, 0, 0, .25) } .accordion .question .title>.acc-icon-plus:before, .accordion .question .title>.acc-icon-minus:before { margin: 0 !important } .accordion .question .title>.acc-icon-plus { display: block } .accordion .question .title>.acc-icon-minus { display: none } .accordion .question .answer { padding: 15px 20px 20px; overflow: hidden; display: none; background-image: url(../images/box_shadow.png); background-repeat: repeat-x; background-position: left top } .accordion .question .answer .yve_content_element:last-child { margin-bottom: 0 } .accordion .question.active .title { border-width: 0 0 1px } .accordion .question.active .title>.acc-icon-plus { display: none } .accordion .question.active .title>.acc-icon-minus { display: block } .accordion .question.active p:last-child { margin-bottom: 0 } /* FAQ ------------------------------------------------------------------------------- */ .faq .question { margin-bottom: 5px; overflow: hidden; position: relative; background: rgba(0, 0, 0, .02) } .faq .question:before { content: ""; width: 60px; height: 100%; border-width: 0 1px 0 0; border-style: solid; border-color: rgba(0, 0, 0, .1); position: absolute; left: 0; top: 0; z-index: 1 } .faq .question:after { content: ""; width: 60px; height: 100%; background: rgba(0, 0, 0, .03); position: absolute; left: 0; top: 0; z-index: 1 } .faq .question:last-child { margin-bottom: 0 } .faq .question .title { padding: 20px 40px 20px 80px; font-size: 15px; position: relative; cursor: pointer; z-index: 2 } .faq .question .title>.acc-icon-plus, .faq .question .title>.acc-icon-minus { font-size: 17px; line-height: 17px; display: block; position: absolute; right: 15px; top: 21px; width: 20px; height: 20px; text-align: center; color: rgba(0, 0, 0, .25) } .faq .question .title>.acc-icon-plus:before, .faq .question .title>.acc-icon-minus:before { margin: 0 !important } .faq .question .title>.acc-icon-plus { display: block } .faq .question .title>.acc-icon-minus { display: none } .faq .question .title .num { font-weight: 700; position: absolute; left: 27px; top: 20px; font-weight: bold } .faq .question .answer { padding: 0 20px 20px 80px; overflow: hidden; display: none } .faq .question.active .title>.acc-icon-plus { display: none } .faq .question.active .title>.acc-icon-minus { display: block } .faq .question.active p:last-child { margin-bottom: 0 } .yve_wrapper .faq { margin-bottom: 5px } .yve_wrapper .faq .question .title.yve_toggle { background-position: 23px } .yve_wrapper .faq .question .answer.yve_toggle_content { margin: 0 } .yve_wrapper .faq .question .last_toggle_el_margin { margin-bottom: 0 } .yve_wrapper .faq .question .title>.acc-icon-plus, .yve_wrapper .faq .question .title>.acc-icon-minus { left: 20px; right: auto; color: rgba(0, 0, 0, .5) } /* Table ----------------------------------------------------------------------------- */ #Content table { width: 100%; margin-bottom: 15px; border-collapse: collapse; border-spacing: 0; border-radius: 5px; display: block; overflow-x: auto; } #Content table th, #Content table td { padding: 10px; text-align: center; border-width: 1px; border-style: solid; vertical-align: middle; word-break: keep-all; } #Content table th { font-weight: 700; background: url(../images/bg_panel.png) repeat-x left top } #Content table th.clear { border: 0; background: none } #Content table tr:first-child td { background: url(../images/box_shadow.png) repeat-x left top } #Content table tr:nth-child(2n) td { background: rgba(0, 0, 0, 0.01) } /* table.simple */ #Content table.simple th { background: none } #Content table.simple th, table.simple td { border-width: 0 0 1px } #Content table.simple tr:first-child td { background: none } #Content table.simple tr:last-child td { border: none } /* Rows Hover */ body.table-hover:not(.ecommerce-page) table tr:hover td { -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } /* Feature list ---------------------------------------------------------------------- */ .feature_list ul { margin: 0; overflow: hidden } .feature_list ul li { margin: 0; list-style: none; width: 25%; float: left; display: block; padding: 10px; -webkit-box-sizing: border-box; box-sizing: border-box } .feature_list ul li a { display: block } .feature_list ul li a:hover { text-decoration: none } .feature_list ul li .icon { width: 60px; height: 60px; line-height: 0; margin-right: 10px; display: table-cell; vertical-align: middle; text-align: center } .feature_list ul li .icon i { font-size: 43px; line-height: 60px } .feature_list ul li .icon i:before { margin: 0 } .feature_list ul li p { display: table-cell; vertical-align: middle; padding: 0 0 0 10px } .feature_list hr { margin: 0 } /* Animation */ .feature_list ul li a { -webkit-transition: all .1s ease-in-out; -o-transition: all .1s ease-in-out; transition: all .1s ease-in-out } /* Columns */ .feature_list[data-col="2"] ul li { width: 50% } .feature_list[data-col="3"] ul li { width: 33.33% } .feature_list[data-col="4"] ul li { width: 25% } .feature_list[data-col="5"] ul li { width: 20% } .feature_list[data-col="6"] ul li { width: 16.66% } /* List ------------------------------------------------------------------------------ */ .list_item { display: block } .list_item a { display: block } .list_item a:hover { text-decoration: none } .list_item .list_left { width: 80px; height: 80px; line-height: 80px; font-size: 50px; overflow: hidden; text-align: center; float: left } .list_item .list_image { font-size: 0; overflow: auto; } .list_item .list_left img { max-width: 100%; max-height: 100%; vertical-align: middle } .list_item .list_left i:before { margin: 0 } .list_item .circle { width: 78px; height: 78px; line-height: 78px; border-width: 1px; border-style: solid; font-size: 20px; font-weight: 700; overflow: hidden; text-align: center; float: left; border-radius: 100%; background-image: url(../images/stripes/css_sprites_10_10.png); background-size: 10px 10px; background-position: -1px -0; -webkit-box-shadow: inset 0 0 5px 0 rgba(0, 0, 0, .08); box-shadow: inset 0 0 5px 0 rgba(0, 0, 0, .08) } .list_item .list_right { padding: 5px 0 0; margin-left: 100px; word-wrap: break-word } .list_item .list_right h4 { margin-bottom: 7px } .list_item.lists_1 .list_left { border-radius: 5px; background-image: url(../images/stripes/css_sprites_10_10.png); background-size: 10px 10px; background-position: -1px -0; -webkit-box-shadow: inset 0 0 5px 0 rgba(0, 0, 0, .1); box-shadow: inset 0 0 5px 0 rgba(0, 0, 0, .1) } .list_item.lists_1 .list_image { width: 60px; height: 60px; line-height: 60px; padding: 10px; font-size: 0 } .list_item.lists_1 .list_left img { max-width: 60px !important; max-height: 60px !important } .list_item.lists_3 .list_left { float: none; margin-bottom: 10px } .list_item.lists_3 .list_icon { width: auto; text-align: left } .list_item.lists_3 .list_right { margin-left: 0; padding-top: 0 } .list_item.lists_3 .list_right h4 { margin-bottom: 10px } .list_item.lists_4 .list_right { padding-top: 21px } .align_right .list_item .list_left { float: right; } .align_right .list_item .list_right { margin-left: 0; margin-right: 100px; } /* Pricing boxes --------------------------------------------------------------------- */ .pricing-box { border-width: 1px; border-style: solid; background: #fff } .pricing-box .plan-header { text-align: center; padding: 20px 15px 0 } .pricing-box .plan-header .image { text-align: center; margin-bottom: 15px } .pricing-box .plan-header h2 { margin: 0 0 20px; font-size: 30px; line-height: 30px } .pricing-box .plan-header .price { margin: 0 0 20px } .pricing-box .plan-header .price>span { font-size: 45px; line-height: 45px; margin: 0 5px } .pricing-box .plan-header .price sup.currency { font-size: 20px; line-height: 20px; top: -10px; position: relative } .pricing-box.cp-right .plan-header .price sup.currency { margin-right: 5px } .pricing-box .plan-header .price sup.period { font-size: 15px; line-height: 15px; top: -15px; position: relative } .pricing-box .plan-header hr { margin-bottom: 0; width: 60% } .pricing-box .plan-header p.subtitle { padding: 20px 0 0; margin-bottom: 0 } .pricing-box .plan-inside { padding: 10px 30px; text-align: center } .pricing-box .plan-inside ul { margin: 0; font-size: 100%; line-height: normal } .pricing-box .plan-inside ul li { text-align: center; padding: 11px 10px; display: block; margin: 0; border-bottom: 1px solid rgba(0, 0, 0, 0.1) } .pricing-box .plan-inside ul li .yes, .pricing-box .plan-inside ul li .no { display: inline-block; overflow: hidden; width: 10px; height: 10px; border-radius: 5px; background: rgba(0, 0, 0, .1) } .pricing-box .plan-inside ul li:last-child { border-bottom: 0 } .pricing-box .plan-footer { text-align: center } .pricing-box .plan-footer a { margin-right: 0 } .pricing-box-box.pricing-box-featured { border-color: transparent } /* Pricing table */ .pricing-box.pricing-box-label .plan-header *, .pricing-box.pricing-box-label .plan-footer { visibility: hidden } .pricing-box-label ul li { font-weight: 700; text-align: right !important } .pricing-box-label, .pricing-box-table { border: 0; background: none } .pricing-box-label .plan-inside, .pricing-box-table .plan-inside { padding-left: 0; padding-right: 0 } .pricing-box-table.pricing-box-featured { background: rgba(0, 0, 0, .02); padding-left: 10px; padding-right: 10px } /* Content slider ----------------------------------------------------------------------------- */ .content_slider { padding: 0 140px 42px; position: relative } .content_slider .caroufredsel_wrapper { border-width: 8px; border-style: solid; -webkit-box-sizing: border-box; box-sizing: border-box } .content_slider ul { line-height: 0; margin: 0 } .content_slider ul li { display: block; float: left } .content_slider a.slider_prev, .content_slider a.slider_next { position: absolute; top: 50%; margin: -43px 0 0 } .content_slider a.slider_prev { left: 50px } .content_slider a.slider_next { right: 50px } .content_slider .slider_pagination { position: absolute; left: 0; bottom: 0; width: 100% } /* Flat */ .content_slider.flat { padding: 0 140px } .content_slider.flat .caroufredsel_wrapper { border-width: 0 } .content_slider.flat a.button { background: none !important; -webkit-box-shadow: none; box-shadow: none; border: none } .content_slider.flat a.button:after { display: none } .content_slider.flat a.button:hover { background: none !important } .content_slider.flat a.button .button_icon { background: none; padding: 0; font-size: 50px; opacity: .3 } .content_slider.flat a:hover.button .button_icon { opacity: 1 } .content_slider.flat a.slider_prev { left: 50px } .content_slider.flat a.slider_next { right: 50px } .content_slider.flat .slider_pagination { display: none !important } /* Flat description */ .content_slider.flat.description { padding: 0 140px 50px } .content_slider.flat.description ul li { text-align: center } .content_slider.flat.description ul li a { display: block; text-decoration: none } .content_slider.flat.description ul li img { margin-bottom: 30px } .content_slider.flat.description ul li .desc { line-height: initial; padding: 0 20% } .content_slider.flat.description .slider_pagination { display: block !important } /* Carousel */ .content_slider.carousel { padding: 0 70px 40px } .content_slider.carousel .caroufredsel_wrapper { border-width: 0 } .content_slider.carousel ul li { text-align: center; padding: 0 20px; padding-top: 5px } .content_slider.carousel ul li img { margin-bottom: 20px; opacity: .8; position: relative; top: 0 } .content_slider.carousel ul li .title { opacity: .3; font-size: 115% } .content_slider.carousel a.button { background-color: transparent; background-image: none; -webkit-box-shadow: none; box-shadow: none; top: 33%; margin-top: -11px; border: none } .content_slider.carousel a.button:after { display: none !important } .content_slider.carousel a.button .button_icon { background: none; padding: 0; font-size: 30px; opacity: .5 } .content_slider.carousel a.button:hover { background: none !important } .content_slider.carousel a.button:hover .button_icon { opacity: 1 } .content_slider.carousel a.slider_prev { left: 20px } .content_slider.carousel a.slider_next { right: 20px } .content_slider.carousel ul li a:hover { text-decoration: none } .content_slider.carousel ul li a:hover img, .content_slider.carousel ul li:hover img { opacity: 1; top: -5px } .content_slider.carousel ul li a:hover .title, .content_slider.carousel ul li:hover .title { opacity: 1 } /* Animation */ .content_slider.carousel ul li img, .content_slider.carousel ul li .title, .content_slider.flat a.button .button_icon { -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } /* Offer slider ---------------------------------------------------------------------- */ .offer .offer_ul { margin: 0 !important } .offer .offer_li { display: block; float: left } .offer .offer_li .image_wrapper { float: left; width: 50%; line-height: 0 } .offer .offer_li .image_wrapper img { float: right } .offer .offer_li .desc_wrapper { float: left; width: 570px; width: calc(50% - 42px); margin: 30px 12px 30px 30px } .offer .offer_li .desc_wrapper .title { margin-bottom: 30px; position: relative; min-height: 43px; padding-right: 160px } .offer .offer_li .desc_wrapper.no-link .title { padding: 0 } .offer .offer_li .desc_wrapper .title h3 { margin: 0; font-size: 35px; line-height: 35px; padding-top: 3px } .offer .offer_li .desc_wrapper .title h3 em { color: rgba(0, 0, 0, .1); font-style: normal } .offer .offer_li .desc_wrapper .title a.button { margin: 0; position: absolute; right: 0; top: 0 } .offer .offer_li .desc_wrapper.align_left { text-align: left } .offer .offer_li .desc_wrapper.align_right { text-align: right } .offer .offer_li .desc_wrapper.align_center { text-align: center } .offer .offer_li .desc_wrapper.align_justify { text-align: justify } .offer .offer_li .desc_wrapper.align_right.has-link .title { padding-left: 160px; padding-right: 0 } .offer .offer_li .desc_wrapper.align_right .title a.button { left: 0; right: auto; } .offer .offer_li .desc_wrapper.align_center.has-link .title { text-align: left } .offer_li ul { list-style: disc inside none; margin-bottom: 10px } .offer_li ol { list-style: decimal inside none; margin-bottom: 10px } .offer_li li { margin-bottom: 5px } .offer a.slider_prev, .offer a.slider_next { background: #262626; margin: 0; position: absolute } .offer a.slider_prev:after, .offer a.slider_next:after { background: rgba(0, 0, 0, .2) } .offer a.slider_prev .button_icon, .offer a.slider_next .button_icon { padding: 0; width: 46px; height: 46px; line-height: 46px; text-align: center } .offer a.slider_prev .button_icon i, .offer a.slider_next .button_icon i { color: #fff } .offer a.slider_prev { left: 50px; top: 50%; z-index: 2; margin-top: -69px; border-radius: 5px 5px 0 0; -moz-border-radius: 5px 5px 0 0; -webkit-border-radius: 5px 5px 0 0 } .offer a.slider_next { left: 50px; top: 50%; z-index: 2; margin-top: 23px; border-radius: 0 0 5px 5px; -moz-border-radius: 0 0 5px 5px; -webkit-border-radius: 0 0 5px 5px } .offer .slider_pagination { display: block; left: 50px; top: 50%; color: #6C6C6C; margin-top: -23px; position: absolute; z-index: 1; width: 46px; height: 46px; line-height: 46px; text-align: center; font-size: 13px; background: #1c1c1c } .offer .slider_pagination .current, .offer .slider_pagination .count { color: #fff } .button-stroke .offer a.slider_prev .button_icon, .button-stroke .offer a.slider_next .button_icon { padding: 0; width: 42px; height: 42px; line-height: 42px; text-align: center } .button-stroke .offer a.slider_prev { margin-top: -75px } .button-stroke .offer a.slider_next { margin-top: 28px } .button-stroke .offer .slider_pagination { border-radius: 3px; background: rgba(0, 0, 0, 0.6) } /* Offer thumb */ .offer_thumb { position: relative; padding-left: 120px; -webkit-box-sizing: border-box; box-sizing: border-box } .offer_thumb_ul li.offer_thumb_li { float: left; display: block; padding-left: 30px; -webkit-box-sizing: border-box; box-sizing: border-box } .offer_thumb_ul li.offer_thumb_li .image_wrapper { float: right; width: 57% } .offer_thumb_ul li.offer_thumb_li .desc_wrapper { float: left; width: 39%; margin-right: 4%; padding-top: 20px } .offer_thumb_ul li.offer_thumb_li .desc_wrapper .title { margin-bottom: 15px; position: relative; min-height: 43px; padding-right: 160px } .offer_thumb_ul li.offer_thumb_li .desc_wrapper.no-link .title { padding: 0 } .offer_thumb_ul li.offer_thumb_li .desc_wrapper .title h3 { margin: 0; font-size: 35px; line-height: 35px; padding-top: 3px } .offer_thumb_ul li.offer_thumb_li .desc_wrapper .title a.button { margin: 0; position: absolute; right: 0; top: 0 } .offer_thumb_ul li.offer_thumb_li .desc_wrapper.align_left { text-align: left } .offer_thumb_ul li.offer_thumb_li .desc_wrapper.align_right { text-align: right } .offer_thumb_ul li.offer_thumb_li .desc_wrapper.align_center { text-align: center } .offer_thumb_ul li.offer_thumb_li .desc_wrapper.align_justify { text-align: justify } .offer_thumb_ul li.offer_thumb_li .desc_wrapper.align_right.has-link .title { padding-left: 160px; padding-right: 0 } .offer_thumb_ul li.offer_thumb_li .desc_wrapper.align_right .title a.button { left: 0; right: auto; } .offer_thumb_ul li.offer_thumb_li .desc_wrapper.align_center.has-link .title { text-align: left } /* Animation */ .offer_thumb .slider_pagination a img { -webkit-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out } .offer_thumb .slider_pagination a:before, .offer_thumb .slider_pagination a:after { -webkit-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out } @media only screen and (min-width: 768px) { .offer_thumb .slider_pagination { position: absolute; left: 0; top: 0; border-width: 1px; border-style: solid } .offer_thumb .slider_pagination a { display: block; margin: 0; width: 85px; height: 85px; line-height: 85px; text-align: center; padding: 8px; text-indent: 0; border-bottom-width: 1px; border-style: solid; border-radius: 0; -moz-border-radius: 0; -webkit-border-radius: 0 } .offer_thumb .slider_pagination a:not(.selected):hover img { filter: alpha(opacity=60); opacity: .6 } .offer_thumb .slider_pagination a.selected { top: 0 } body:not(.style-simple) .offer_thumb:not(.bottom) .slider_pagination a:last-child { border: 0 } .offer_thumb .slider_pagination a:before { content: ""; display: block; width: 5px; height: 100%; right: -5px; top: 0; position: absolute; filter: alpha(opacity=0); opacity: 0 } .offer_thumb .slider_pagination a.selected:before { filter: alpha(opacity=100); opacity: 1 } .offer_thumb .slider_pagination a:after { content: ""; left: auto; right: -9px; top: 50%; margin-top: -4px; width: 8px; height: 8px; filter: alpha(opacity=0); opacity: 0; border-radius: 0; -moz-border-radius: 0; -webkit-border-radius: 0 } .offer_thumb .slider_pagination a.selected:after { filter: alpha(opacity=100); opacity: 1 } .offer_thumb .slider_pagination a { background-color: #fff } .offer_thumb .slider_pagination a.selected { background-color: #fff; background-image: url(../images/stripes/css_sprites_10_10.png); background-size: 10px 10px; background-position: -1px -0; } .offer_thumb .slider_pagination a img { vertical-align: middle } } /* Offer thumb bottom */ .offer_thumb.bottom { padding-left: 0 } .offer_thumb.bottom .offer_thumb_ul li.offer_thumb_li .image_wrapper { width: 48%; text-align: center } .offer_thumb.bottom .offer_thumb_ul li.offer_thumb_li .desc_wrapper { margin-right: 4%; width: 48% } .offer_thumb.bottom .slider_pagination { position: static; border: 0; text-align: center; margin-top: 50px } .offer_thumb.bottom .slider_pagination a { display: inline-block; border-width: 1px 0 1px 1px; border-style: solid } .offer_thumb.bottom .slider_pagination a:last-child { border-right-width: 1px; border-style: solid } .offer_thumb.bottom .slider_pagination a:before { width: 100%; height: 5px; left: 0; right: auto; top: -5px } .offer_thumb.bottom .slider_pagination a:after { left: 50%; right: auto; top: -5px; margin-left: -4px } /* Latest news ----------------------------------------------------------------------- */ .Latest_news { overflow: hidden; } .Latest_news ul { float: left; width: 100%; margin: 0 } .Latest_news ul li { margin: 0 0 20px; list-style: none; position: relative; overflow: hidden } .Latest_news ul li .photo { width: 30%; border-right-width: 3px; border-style: solid; float: left; line-height: 0 } .Latest_news ul li .desc { width: 100%; padding: 3px 12px 3px 0; -webkit-box-sizing: border-box; box-sizing: border-box } .Latest_news ul li.has-post-thumbnail .desc { margin-left: 30%; width: 70%; padding-left: 12px; } .Latest_news ul li .desc h5 { margin: 0 0 7px } .Latest_news ul li .desc .post-excerpt { margin: 10px 0 5px } .Latest_news ul li .desc_footer { overflow: hidden; border-top-width: 1px; border-style: solid; padding-top: 5px; color: #a8a8a8 } .Latest_news ul li .desc_footer .date { float: left; margin-right: 5px } .Latest_news ul li .desc_footer .button-love { float: left; margin-right: 5px } .Latest_news ul li .desc_footer .button-love a.mfn-love { display: inline-block; position: relative; padding-left: 24px; margin-left: 5px } .Latest_news ul li .desc_footer .button-love a.mfn-love i { position: absolute; left: 0; top: 0; font-size: 16px } .Latest_news ul li .desc_footer .button-love a.mfn-love:hover { text-decoration: none } .Latest_news ul li .desc_footer .button-love a.mfn-love i:last-child { opacity: 0; filter: alpha(opacity=0); -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .Latest_news ul li .desc_footer .button-love a:hover.mfn-love i:last-child, .Latest_news ul li .desc_footer .button-love a.loved.mfn-love i:last-child { opacity: 1; filter: alpha(opacity=100) } .Latest_news .button { float: left; clear: both; } .Latest_news.featured ul { float: left; width: 49%; } .Latest_news.featured ul.ul-first { margin-right: 1%; } .Latest_news.featured ul.ul-second { margin-left: 1%; } .Latest_news.featured ul.ul-first li .photo { width: 100%; float: left; margin-bottom: 10px; border-right-width: 0; border-bottom-width: 3px; border-bottom-style: solid; } .Latest_news.featured ul.ul-first li .desc { width: 100%; margin: 0; padding: 0; float: left; } .Latest_news.featured ul.ul-first li .desc h4 { margin: 0 0 7px; } .column.two-fifth .Latest_news.featured ul, .column.one-third .Latest_news.featured ul, .column.one-fourth .Latest_news.featured ul { width: 100% } .wrap.three-fifth .column.one-second .Latest_news.featured ul, .wrap.one-second .column.one-second .Latest_news.featured ul, .wrap.one-second .column.three-fifth .Latest_news.featured ul, .wrap.two-fifth .column.three-fourth .Latest_news.featured ul, .wrap.two-fifth .column.one-second .Latest_news.featured ul, .wrap.two-fifth .column.three-fifth .Latest_news.featured ul, .wrap.one-fourth .Latest_news.featured ul, .wrap.one-fifth .Latest_news.featured ul, .wrap.one-sixth .Latest_news.featured ul { width: 100% } /* Helper ---------------------------------------------------------------------------- */ .helper { overflow: hidden } .helper .helper_header { padding: 15px 150px 15px 20px; position: relative; min-height: 35px } .helper .helper_header .title { margin: 0; line-height: 35px } .helper .helper_header .links { position: absolute; right: 15px; top: 15px } .helper .helper_header .links a.link { display: inline-block; height: 35px; line-height: 35px; margin: 0 5px; padding: 0 10px; text-decoration: none; border-radius: 5px; -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .helper .helper_content .item { padding: 0 20px 20px; overflow: hidden; display: none } .helper { background: #f5f5f5 } .helper .helper_header .links a.link { color: #999; background: #fff } .helper .helper_header .links a.link.active, .helper .helper_header .links a:hover.link { color: #999; background: rgba(0, 0, 0, .06) } /* Icon box -------------------------------------------------------------------------- */ .icon_box { position: relative; padding: 10px 0 } .icon_box.has_border:after { content: ""; display: block; width: 0; height: 100%; border-width: 0 1px 0 0; border-style: solid; position: absolute; right: -2.4%; top: 0 } .icon_box a { display: block } .icon_box a:hover { text-decoration: none } .icon_box .icon_wrapper { width: 110px; height: 110px; text-align: center; line-height: 110px; font-size: 50px; position: relative; overflow: hidden; margin: 0 auto 15px; border-width: 8px; border-style: solid; display: block; border-radius: 100%; background-image: url(../images/stripes/css_sprites_10_10.png); background-size: 10px 10px; background-position: -1px -0; } .icon_box .icon_wrapper i { z-index: 2; position: relative } .icon_box .icon_wrapper:before { content: ""; display: block; width: 100%; height: 100%; border-width: 1px; border-style: solid; position: absolute; left: 0; top: 0; border-radius: 100%; -webkit-box-sizing: border-box; box-sizing: border-box } .icon_box .icon_wrapper { background-color: #fff; -webkit-box-shadow: inset 0 0 7px 0 rgba(0, 0, 0, .08); box-shadow: inset 0 0 7px 0 rgba(0, 0, 0, .08) } .icon_box .image_wrapper { text-align: center; margin-bottom: 15px } .icon_box .desc_wrapper { text-align: center } /* Icon postion left */ .icon_box.icon_position_left { min-height: 126px; padding-left: 145px } .icon_box.icon_position_left .icon_wrapper { position: absolute; left: 0; top: 10px; margin-bottom: 0 } .icon_box.icon_position_left .desc_wrapper { text-align: left; padding-top: 10px } .icon_box.icon_position_left .image_wrapper { position: absolute; left: 0; top: 10px; margin-bottom: 0; width: 126px; height: 126px; overflow: hidden } /* Animation */ .icon_box .icon_wrapper, .icon_box .icon_wrapper:before { -webkit-transition: background-color .3s ease-in-out; -o-transition: background-color .3s ease-in-out; transition: background-color .3s ease-in-out } .icon_box .icon_wrapper { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1) } .icon_box:hover .icon_wrapper { -webkit-transform: scale(0.93); -ms-transform: scale(0.93); transform: scale(0.94) } /* Icon box button & mfn-link */ .icon_box a.mfn-link, .icon_box a.button { display: inline-block } /* Article box ----------------------------------------------------------------------- */ .article_box { overflow: hidden } .article_box a { display: block } .article_box a:hover { text-decoration: none } .article_box .photo_wrapper { width: 50%; float: left; line-height: 0 } .article_box .desc_wrapper { width: 50%; min-height: 139px; float: left; padding: 10px 15px; background-color: #f8f8f8; background-image: url(../images/stripes/css_sprites_10_10.png); background-size: 10px 10px; background-position: -1px -0; -webkit-box-sizing: border-box; box-sizing: border-box } .article_box .desc_wrapper p { margin-bottom: 10px; border-bottom-width: 1px; border-style: solid; padding-bottom: 7px } .article_box .desc_wrapper h4 { margin-bottom: 5px } .article_box .desc_wrapper i.icon-right-open { display: block; position: relative; left: -5px } /* Sliding box ----------------------------------------------------------------------- */ .sliding_box { position: relative } .sliding_box a { display: block } .sliding_box a:hover { text-decoration: none } .sliding_box .photo_wrapper { line-height: 0; position: relative; bottom: -15px; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1) } .sliding_box .desc_wrapper { padding: 15px 20px; width: 100%; text-align: center; z-index: 2; position: relative; -webkit-box-sizing: border-box; box-sizing: border-box } .sliding_box .desc_wrapper:after { content: ""; display: block; position: absolute; left: 50%; top: 0; margin-left: -8px; width: 0; height: 0; border-style: solid; border-width: 0 8px 8px; border-color: transparent } .sliding_box .desc_wrapper h4 { margin-bottom: 0 } /* Animation */ .sliding_box .photo_wrapper { -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .sliding_box:hover .photo_wrapper { bottom: -1px } .sliding_box .desc_wrapper:after { -webkit-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out } .sliding_box:hover .desc_wrapper:after { top: -8px } /* Story box ------------------------------------------------------------------------- */ .story_box { padding: 0 11% } .story_box a, .story_box a:hover { display: block; text-decoration: none } .story_box .photo_wrapper { line-height: 0; overflow: hidden } .story_box .photo_wrapper img { display: block; opacity: .7 } .story_box .desc_wrapper { margin-right: 20%; position: relative; z-index: 2 } .story_box .desc_wrapper h3 { margin-left: -30px; margin-top: -26px } .story_box .desc_wrapper hr { margin-left: 0; width: 20% } .story_box:hover .desc_wrapper hr { width: 40% } .story_box:hover .photo_wrapper img { display: block; opacity: 1 } .story_box.vertical { padding: 0 17% } /* Animation */ .story_box .desc_wrapper hr, .story_box .photo_wrapper img { -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } /* Promo box ------------------------------------------------------------------------- */ .promo_box { position: relative } .promo_box.has_border:after { content: ""; display: block; width: 0; height: 100%; border-width: 0 1px 0 0; border-style: solid; position: absolute; right: -2.4%; top: 0 } .promo_box_wrapper { overflow: hidden } .promo_box_wrapper .photo_wrapper { width: 36%; float: left; text-align: left; line-height: 0 } .promo_box_wrapper .desc_wrapper { width: 56%; margin: 0 2% 0 6%; float: left; padding-top: 10px } .promo_box_wrapper .desc_wrapper .desc { margin-bottom: 15px } .promo_box_wrapper.promo_box_right .photo_wrapper { float: right; text-align: right } .promo_box_wrapper.promo_box_right .desc_wrapper { margin: 0 6% 0 2%; text-align: right } .promo_box_wrapper.promo_box_right .desc_wrapper a.button { margin-right: 0 } /* Zoom box -------------------------------------------------------------------------- */ .column_zoom_box { text-align: center; line-height: 0; } .zoom_box { position: relative; line-height: 0; overflow: hidden; display: inline-block; max-width: 100% } .zoom_box .photo img, .zoom_box .desc { -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .zoom_box .photo img { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1) } .zoom_box:hover .photo img { -webkit-transform: scale(1.15); -ms-transform: scale(1.15); transform: scale(1.15) } .zoom_box .desc { background: rgba(0, 0, 0, .8); width: 100%; height: 100%; position: absolute; left: 0; top: 0; text-align: center; opacity: 0; -webkit-transform: scale(1.15); -ms-transform: scale(1.15); transform: scale(1.15) } .zoom_box:hover .desc { opacity: 1; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1) } .zoom_box .desc .desc_img img { max-width: 30% !important; padding-bottom: 15px } .zoom_box .desc .desc_txt { padding: 0 40px; font-size: 26px; line-height: 30px; color: #fff } /* Counter --------------------------------------------------------------------------- */ .counter { padding: 20px; background-image: url(../images/stripes/css_sprites_10_10.png); background-size: 10px 10px; background-position: -21px -0; text-align: center; position: relative } .counter .icon_wrapper { margin-bottom: 15px; line-height: 0; width: 100% } .counter .icon_wrapper i:before { margin: 0 } .counter .icon_wrapper i { display: inline-block; width: 50px; height: 50px; line-height: 50px; font-size: 50px } .counter .desc_wrapper .number-wrapper { font-size: 50px; line-height: 50px; margin-bottom: 5px } .counter .desc_wrapper .number-wrapper .label { font-size: 70%; line-height: 100% } .counter .desc_wrapper .title { font-size: 15px; line-height: 20px; margin: 0 } .counter.counter_horizontal { text-align: left; min-height: 75px } .counter.counter_horizontal .icon_wrapper { width: 50px; height: 50px; position: absolute; left: 30px; top: 32px; margin: 0 } .counter.counter_horizontal .desc_wrapper { padding-left: 85px } /* Chart box ------------------------------------------------------------------------- */ .chart_box { position: relative; text-align: center } .chart_box:before { content: ""; display: block; z-index: 2; width: 138px; height: 138px; border-width: 1px; border-style: solid; position: absolute; left: 50%; margin-left: -69px; top: 1px; border-radius: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; background-color: #fff; background-image: url(../images/stripes/css_sprites_10_10.png); background-size: 10px 10px; background-position: -1px -0 } .chart_box .chart { width: 140px; margin: 0 auto 10px; position: relative } .chart_box .chart canvas { position: relative; z-index: 2 } .chart_box .chart .icon, .chart_box .chart .image { width: 70px; height: 70px; line-height: 70px; overflow: hidden; position: absolute; left: 35px; top: 35px; z-index: 3; text-align: center } .chart_box .chart .icon { font-size: 45px } .chart_box .chart .icon i:before { margin: 0 } .chart_box .chart .image img { vertical-align: middle } .chart_box .chart .num { position: absolute; left: 0; top: 45px; z-index: 3; width: 100%; font-size: 50px; line-height: 50px } .chart_box p { margin-bottom: 0 } /* Progress bars --------------------------------------------------------------------- */ .progress_bars .bars_list { margin: 0 } .progress_bars .bars_list li { margin-bottom: 20px; list-style: none; overflow: hidden } .progress_bars .bars_list li:last-child { margin-bottom: 0 } .progress_bars .bars_list li h6 { margin-bottom: 7px; position: relative; padding-right: 40px } .progress_bars .bars_list li h6 .label { display: block; font-size: 11px; line-height: 17px; padding: 0 5px; font-weight: 400; position: absolute; right: 0; top: 1px; border-radius: 3px; background: rgba(0, 0, 0, .05); color: rgba(0, 0, 0, .35) } .progress_bars .bars_list li h6 .label em { font-style: normal } .progress_bars .bars_list li .bar { position: relative; width: 100%; height: 20px; border-radius: 3px; overflow: hidden; -webkit-box-sizing: border-box; box-sizing: border-box; background: rgba(0, 0, 0, .02); -webkit-box-shadow: inset 0 0 2px 2px rgba(0, 0, 0, 0.04); box-shadow: inset 0 0 2px 2px rgba(0, 0, 0, 0.04) } .progress_bars .bars_list li .bar .progress { display: block; height: 100%; background-image: url(../images/progressbar.png); -webkit-box-shadow: inset 0 0 2px 2px rgba(0, 0, 0, 0.04); box-shadow: inset 0 0 2px 2px rgba(0, 0, 0, 0.04) } .progress_bars .bars_list:not(.hover) li .bar .progress { width: 0 !important } /* Animation */ .progress_bars .bars_list.hover li .bar .progress { -webkit-transition: all 1.3s ease-in-out; -o-transition: all 1.3s ease-in-out; transition: all 1.3s ease-in-out } /* Progress icons -------------------------------------------------------------------- */ .progress_icons { margin-bottom: 12px; overflow: hidden } .progress_icons .progress_icon { display: inline-block; margin: 0 7px 7px 0; width: 35px; height: 35px; line-height: 35px; font-size: 17px; color: #fff; text-align: center; border-radius: 100% } .progress_icons .progress_icon img { max-width: 25px !important; max-height: 25px; margin: 5px 0 -5px } .progress_icons .progress_icon:last-child { margin-right: 0 } .progress_icons .progress_icon:not(.themebg) { background: rgba(0, 0, 0, .06) } /* Animation */ .progress_icons .progress_icon { -webkit-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out } /* Trailer box ----------------------------------------------------------------------- */ .trailer_box { text-align: center; position: relative; line-height: 0 } .trailer_box a { display: block } .trailer_box a:after { content: ""; display: block; position: absolute; left: 0; bottom: 0; z-index: 1; width: 100%; height: 100%; filter: alpha(opacity=0); opacity: 0; background: rgba(0, 0, 0, .15) } .trailer_box:hover a:after { filter: alpha(opacity=100); opacity: 100 } .trailer_box .desc { position: absolute; left: 0; bottom: 0; z-index: 2; width: 100%; padding: 20px 15px 35px; -webkit-box-sizing: border-box; box-sizing: border-box; max-height: 100%; overflow: hidden; } .trailer_box .desc h2 { margin: 0; position: relative; bottom: 0; font-size: 30px; line-height: 30px } .trailer_box:hover .desc h2 { bottom: 20px } .trailer_box .desc .subtitle { display: inline-block; position: relative; bottom: 0; line-height: normal; letter-spacing: 1px; padding: 4px 8px; text-transform: uppercase; margin-bottom: 15px; border-radius: 3px; background-image: url(../images/stripes/css_sprites_10_10.png); background-size: 10px 10px; background-position: -31px -0; white-space: nowrap; overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; max-width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; } .trailer_box .desc .subtitle>* { overflow: hidden; -o-text-overflow: ellipsis; text-overflow: ellipsis; } .trailer_box:hover .desc .subtitle { bottom: 20px } .trailer_box .desc .line { height: 1px; width: 0; margin: 0 auto; background: #fff; overflow: hidden; display: block } .trailer_box:hover .desc .line { width: 60% } /* Animation */ .trailer_box a:after, .trailer_box .desc .subtitle, .trailer_box .desc .line, .trailer_box .desc h2 { -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } /* Quick facts ----------------------------------------------------------------------- */ .quick_fact { text-align: center } .quick_fact.align_left { text-align: left } .quick_fact.align_right { text-align: right } .quick_fact .number-wrapper { font-size: 90px; line-height: 90px } .quick_fact .number-wrapper .label { font-size: 70%; line-height: 100% } .quick_fact hr { width: 40% } /* Photo box ------------------------------------------------------------------------- */ .photo_box { text-align: center } .photo_box.pb_left { text-align: left } .photo_box.pb_right { text-align: right } .photo_box .image_frame { margin-bottom: 15px } .photo_box.without-desc .image_frame { margin-bottom: 0 } .photo_box .desc { margin-bottom: 15px } /* Flat box -------------------------------------------------------------------------- */ .flat_box a, .flat_box a:hover { display: block; text-decoration: none } .flat_box .photo_wrapper { margin-bottom: 15px; position: relative; line-height: 0; overflow: hidden } .flat_box .photo_wrapper .icon { position: absolute; left: 0; top: 0; height: 100%; width: 90px; text-align: center; color: #fff; z-index: 2 } .flat_box .photo_wrapper .icon i { display: block; width: 100%; height: 60px; line-height: 60px; font-size: 55px; vertical-align: middle; position: absolute; top: 50%; margin-top: -30px } .flat_box .photo_wrapper .icon img { position: absolute; left: 50%; top: 50%; max-width: calc(100% - 16px) !important; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .flat_box:hover .photo_wrapper .icon, .flat_box a:hover .photo_wrapper .icon { -webkit-transform: translateX(-90px); -ms-transform: translateX(-90px); transform: translateX(-90px) } .flat_box .photo_wrapper img.photo { position: relative; display: block; z-index: 1; -webkit-transform: translateX(15px); -ms-transform: translateX(15px); transform: translateX(15px) } .flat_box:hover .photo_wrapper img.photo, .flat_box a:hover .photo_wrapper img.photo { -webkit-transform: translateX(0px); -ms-transform: translateX(0px); transform: translateX(0px) } .flat_box .desc_wrapper { margin-left: 90px } @media only screen and (min-width: 960px) { .one-fourth .flat_box .photo_wrapper .icon { width: 60px } .one-fourth .flat_box .photo_wrapper .icon i { height: 40px; line-height: 40px; font-size: 35px; margin-top: -20px } .one-fourth .flat_box a:hover .photo_wrapper .icon { -webkit-transform: translateX(-60px); -ms-transform: translateX(-60px); transform: translateX(-60px) } .one-fourth .flat_box .desc_wrapper { margin-left: 60px } } /* Animation */ .flat_box .photo_wrapper .icon { -webkit-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out } .flat_box .photo_wrapper img { -webkit-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out } /* Feature box -------------------------------------------------------------------------- */ .feature_box .feature_box_wrapper { display: table; padding: 20px } .feature_box .feature_box_wrapper .photo_wrapper, .feature_box .feature_box_wrapper .desc_wrapper { display: table-cell; vertical-align: middle } .feature_box .feature_box_wrapper .photo_wrapper { width: 50%; } .feature_box .feature_box_wrapper .photo_wrapper a { display: block; line-height: 0 } .feature_box .feature_box_wrapper .desc_wrapper { width: 46%; padding-left: 4% } /* Hover box ------------------------------------------------------------------------- */ .hover_box { text-align: center; line-height: 0 } .hover_box a { display: block; line-height: 0 } .hover_box .hover_box_wrapper { display: inline-block; position: relative; overflow: hidden; line-height: 0; max-width: 100% } .hover_box .hover_box_wrapper img { display: block } .hover_box .hover_box_wrapper .visible_photo { opacity: 1; filter: alpha(opacity=100) } .hover_box .hover_box_wrapper .hidden_photo { position: absolute; left: 50%; top: 50%; opacity: 0; filter: alpha(opacity=0); -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%) } .hover_box:hover .hover_box_wrapper .visible_photo, .hover_box.hover .hover_box_wrapper .visible_photo { opacity: 0; filter: alpha(opacity=0) } .hover_box:hover .hover_box_wrapper .hidden_photo, .hover_box.hover .hover_box_wrapper .hidden_photo { opacity: 1; filter: alpha(opacity=100) } .hover_box .hover_box_wrapper .visible_photo, .hover_box .hover_box_wrapper .hidden_photo { -webkit-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out } /* Hover color ----------------------------------------------------------------------- */ .hover_color:hover .hover_color_bg, .hover_color.hover .hover_color_bg { background-color: inherit !important; border-color: inherit !important } .hover_color { border-color: transparent } .hover_color a { display: block } .hover_color a:hover { text-decoration: none } .hover_color .hover_color_bg { border: 2px solid transparent } .hover_color .hover_color_wrapper { text-decoration: none; padding: 40px 30px; text-align: center } .hover_color, .hover_color a, .hover_color a:hover, .hover_color h1 a, .hover_color h2 a, .hover_color h3 a, .hover_color h4 a, .hover_color h5 a, .hover_color h6 a { color: #fff } .hover_color .hover_color_bg { -webkit-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out } .hover_color, .hover_color_bg { height: 100% } @-moz-document url-prefix() { /* 莽聛芦莽鈥孤惷モ€β济ヂ */ .hover_color { height: auto; } } /* Content links --------------------------------------------------------------------- */ a.content_link { display: inline-block; position: relative; border-width: 1px; border-style: solid; width: 140px; padding: 25px 15px; text-align: center; margin-left: -1px; background-color: #fff } a.content_link .icon { display: block; font-size: 45px; line-height: 45px; margin-bottom: 15px } a.content_link .title { font-weight: 700 } a.content_link:after { content: ""; z-index: 2; filter: alpha(opacity=0); opacity: 0; height: 0; width: 100%; border-width: 0 0 5px; border-style: solid; position: absolute; left: 0; bottom: -6px } a.content_link:before { content: ""; z-index: 2; filter: alpha(opacity=0); opacity: 0; position: absolute; left: 50%; bottom: -1px; margin-left: -6px; width: 0; height: 0; border-style: solid; border-width: 0 6px 6px; border-color: transparent } a:hover.content_link:after { filter: alpha(opacity=100); opacity: 100 } a:hover.content_link:before { filter: alpha(opacity=100); opacity: 100 } a:hover.content_link { text-decoration: none; background-image: url(../images/stripes/css_sprites_10_10.png); background-size: 10px 10px; background-position: -1px -0 } a.content_link:after, a.content_link:before { -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } /* Icon bar -------------------------------------------------------------------------- */ a.icon_bar { display: inline-block; overflow: hidden; text-align: center; margin: 0 2px 2px 0; border-width: 1px; border-style: solid; position: relative; background-color: #fff; background-image: url(../images/stripes/css_sprites_10_10.png); background-size: 10px 10px; background-position: -1px -0; -webkit-box-shadow: inset 0 0 5px 0 rgba(0, 0, 0, .08); box-shadow: inset 0 0 5px 0 rgba(0, 0, 0, .08) } a.icon_bar span { display: block } a.icon_bar, a.icon_bar span { width: 58px; height: 58px; line-height: 58px; font-size: 20px } a.icon_bar_small, a.icon_bar_small span { width: 43px; height: 43px; line-height: 43px; font-size: 15px } a.icon_bar span.t { position: relative } a.icon_bar span.b { position: absolute; top: 100% } a.icon_bar span { -webkit-transition: -webkit-transform .3s; transition: -webkit-transform .3s; -o-transition: transform .3s; transition: transform .3s; transition: transform .3s, -webkit-transform .3s } a.icon_bar span.b { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) } a:hover.icon_bar span { -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%) } /* Social */ a.icon_bar_facebook span.b { background: #3a589b; color: #fff } a.icon_bar_google span.b { background: #d6492f; color: #fff } a.icon_bar_twitter span.b { background: #32ccfe; color: #fff } a.icon_bar_vimeo span.b { background: #1ca7cc; color: #fff } a.icon_bar_youtube span.b { background: #ff3334; color: #fff } a.icon_bar_flickr span.b { background: #ff0084; color: #fff } a.icon_bar_linkedin span.b { background: #007bb6; color: #fff } a.icon_bar_pinterest span.b { background: #cb2027; color: #fff } a.icon_bar_dribbble span.b { background: #ec4a89; color: #fff } /* Get in touch ---------------------------------------------------------------------- */ .get_in_touch { padding: 25px 20px 25px 30px; background-repeat: no-repeat; background-position: right bottom } .get_in_touch ul { margin: 0; font-size: 100%; line-height: normal } .get_in_touch ul li { margin: 0; list-style: none; position: relative; padding: 13px 0 13px 50px; word-wrap: break-word } .get_in_touch ul li:after { content: ""; display: block; width: 70px; border-width: 0 0 1px; border-style: solid; border-color: rgba(255, 255, 255, .2); position: absolute; left: -30px; bottom: 0 } .get_in_touch ul li p { margin: 0 } .get_in_touch ul li .icon { position: absolute; left: 0; top: 5px; display: block; color: rgba(0, 0, 0, .7); width: 30px; height: 30px; line-height: 30px; font-size: 23px; text-align: center } .get_in_touch ul li:last-child:after { display: none } /* Infobox --------------------------------------------------------------------------- */ .infobox { padding: 25px 20px 25px 30px; background-repeat: no-repeat; background-position: right bottom } .infobox ul { margin: 0; font-size: 100%; line-height: normal } .infobox ul li { margin: 0; list-style: none; position: relative; padding: 13px 0 13px 50px; word-wrap: break-word } .infobox ul li p { margin: 0 } .infobox ul li:before { content: ""; display: block; background: url(../images/icons/list_check.png) no-repeat; width: 16px; height: 16px; position: absolute; left: 0; top: 15px } .infobox ul li:after { content: ""; display: block; width: 70px; border-width: 0 0 1px; border-style: solid; border-color: rgba(255, 255, 255, .2); position: absolute; left: -30px; bottom: 0 } .infobox ul li:last-child:after { display: none } /* Opening hours --------------------------------------------------------------------- */ .opening_hours { padding: 25px; border-width: 1px; border-style: solid; background-color: #fff; background-repeat: no-repeat; background-position: right bottom } .opening_hours .opening_hours_wrapper .desc { margin-bottom: 15px } .opening_hours .opening_hours_wrapper li { position: relative; padding-bottom: 15px; margin-bottom: 15px; text-align: center; border-bottom-width: 1px; border-style: dashed; list-style: none } .opening_hours .opening_hours_wrapper li:last-child { border: 0; padding-bottom: 0; margin-bottom: 0 } .opening_hours .opening_hours_wrapper li label { margin-bottom: 8px; font-size: 12px; line-height: 18px; display: inline-block; font-weight: 400; padding: 5px 11px; border-radius: 4px; background-image: url(../images/stripes/css_sprites_10_10.png); background-size: 10px 10px; background-position: -1px -0; background-color: #f8f8f8 } .opening_hours .opening_hours_wrapper li span { font-size: 22px; line-height: 22px; margin: 0; padding: 0 14px; display: block } .opening_hours .opening_hours_wrapper li span sup { font-size: 13px; line-height: 13px; position: relative; top: 4px; margin-left: 2px } /* Timeline -------------------------------------------------------------------------- */ .timeline_items { margin: 0 !important; position: relative; background: url(../images/timeline_top.png) no-repeat top center; padding-top: 9px } .timeline_items:after { content: ""; width: 0; height: 0; border-width: 3px; border-style: solid; border-radius: 100%; position: absolute; left: 50%; bottom: -10px; margin-left: -3px; display: block; z-index: 1 } .timeline_items li { margin: 0 !important; list-style: none !important; width: 45%; padding: 0 0 25px 55%; position: relative; background: url(../images/timeline_right.png) no-repeat top center } .timeline_items li:nth-child(even) { padding: 0 55% 25px 0; background: url(../images/timeline_left.png) no-repeat top center } .timeline_items li h3 { font-size: 30px; line-height: 35px } .timeline_items li h3 span { position: absolute; right: 55%; top: 8px } .timeline_items li h3:before { content: ""; width: 7px; height: 7px; border-width: 4px; border-style: solid; border-radius: 100%; position: absolute; left: 50%; top: 11px; margin-left: -8px; display: block; z-index: 1 } .timeline_items li:nth-child(even) h3 { text-align: right } .timeline_items li:nth-child(even) h3 span { left: 55%; right: auto } .timeline_items li .desc { position: relative; font-size: 15px; line-height: 31px; background: url(../images/stripes/css_sprites_10_10.png); background-size: 1px 31px; background-position: -0 -10px; } .timeline_items li .desc:before { content: ""; width: 100%; height: 100%; position: absolute; left: -122%; top: 0; background-image: url(../images/stripes/css_sprites_10_10.png); background-size: 10px 10px; background-position: -21px -0; } .timeline_items li:nth-child(even) .desc:before { left: auto; right: -122% } .timeline_items li:nth-child(even) .desc { text-align: right } /* How it works ---------------------------------------------------------------------- */ .how_it_works { text-align: center; position: relative } .how_it_works.has_border:after { content: ""; display: block; width: 12%; height: 4px; background: rgba(0, 0, 0, .03); border-radius: 2px; position: absolute; right: -10.5%; top: 100px } .how_it_works .image { width: 200px; height: 200px; line-height: 200px; text-align: center; position: relative; margin: 0 auto 15px; background: #fff; border-width: 2px; border-style: solid; border-radius: 100%; -webkit-box-sizing: border-box; box-sizing: border-box } .how_it_works .image img { max-width: 116px !important; max-height: 116px !important; vertical-align: middle } .how_it_works .image .number { position: absolute; right: 10px; bottom: 10px; width: 35px; height: 35px; line-height: 35px; font-size: 15px; text-align: center; border-radius: 100%; -webkit-box-shadow: inset 0 0 0 2px rgba(0, 0, 0, .1); box-shadow: inset 0 0 0 2px rgba(0, 0, 0, .1) } .with_aside .how_it_works .image { width: 150px; height: 150px; line-height: 150px } .with_aside .how_it_works .image .number { bottom: 4px; right: 4px } .with_aside .how_it_works.has_border:after { top: 75px } /* Google maps ----------------------------------------------------------------------- */ .google-map { border-width: 8px; border-style: solid; -webkit-box-sizing: border-box; box-sizing: border-box } .google-map-wrapper.no_border .google-map, .section.full-width .one .google-map { border-width: 0 } .column_map .google-map-wrapper { position: relative } .column_map .google-map-contact-wrapper { width: 1176px; height: 1px; margin-left: -588px; z-index: 10; position: absolute; left: 50%; top: 60px } .column_map .google-map-contact-wrapper .get_in_touch { width: 210px; padding: 25px; float: right; position: relative } .column_map .google-map-contact-wrapper .get_in_touch:after { content: ""; display: block; position: absolute; left: 0; bottom: -30px; width: 0; height: 0; border-style: solid; border-width: 30px 30px 0 0; border-color: transparent } /* Team ------------------------------------------------------------------------------ */ .team .image_frame { margin-bottom: 15px } .team .desc_wrapper h4 { margin-bottom: 3px } .team .desc_wrapper hr { width: 40%; margin-left: 0 } .team .desc_wrapper .desc { margin-bottom: 15px } .team .desc_wrapper .links { line-height: 0 } .team.team_horizontal { overflow: hidden } .team.team_horizontal .image_frame { width: 48%; float: left; margin-right: 4%; margin-bottom: 0 } .team.team_horizontal .desc_wrapper { width: 48%; float: left } .team .desc_wrapper blockquote { margin-top: 20px } .team.team_circle { text-align: center } .team.team_circle .desc_wrapper hr { margin-left: auto } .team.team_circle .image_frame { width: 120px; height: 120px; margin: 0 auto 15px; border-radius: 100%; overflow: hidden; position: relative; z-index: 1 } /* Team list ------------------------------------------------------------------------- */ .team_list .column { margin-bottom: 0 } .team_list .bq_wrapper { background: rgba(0, 0, 0, .02); border-left-width: 1px; border-style: solid; padding: 20px } /* Fancy headings -------------------------------------------------------------------- */ .fancy_heading { text-align: center } .fancy_heading .title { font-size: 42px; line-height: 42px } .fancy_heading_icon .icon_top { font-size: 50px; line-height: 50px; margin-bottom: 15px; overflow: hidden; display: block } .fancy_heading_icon .icon_top i:before { margin: 0 } .fancy_heading_line { background-image: url(../images/fancy_heading_hr.png); background-position: bottom center; background-repeat: no-repeat; padding-bottom: 15px } .fancy_heading_line .slogan { display: block; margin-bottom: 7px; text-transform: uppercase; letter-spacing: 1px; font-size: 14px } .fancy_heading_line .inside { margin-bottom: 15px } /* Call to action -------------------------------------------------------------------- */ .column_call_to_action { margin-bottom: 0 } .call_to_action { overflow: hidden; display: table; padding: 40px 0; width: 100% } .call_to_action .call_to_action_wrapper { display: table; width: 100% } .call_to_action .call_left, .call_to_action .call_center, .call_to_action .call_right { display: table-cell; vertical-align: middle; -webkit-box-sizing: border-box; box-sizing: border-box } .call_to_action .call_left { width: 40%; padding: 0 20px; text-align: center } .call_to_action .call_left h3 { margin-bottom: 0 } .call_to_action .call_center { width: 20%; text-align: center } .call_to_action .call_center a { display: inline-block } .call_to_action .call_center .icon_wrapper { display: inline-block; border-width: 3px; border-style: solid; width: 65px; height: 65px; line-height: 65px; font-size: 30px; border-radius: 100% } .call_to_action .call_center .button { margin: 0 } .call_to_action .call_right { width: 40%; padding: 0 20px } /* Clients --------------------------------------------------------------------------- */ ul.clients { margin: 0 } ul.clients li { float: left; width: 16.666%; margin: 0 !important; list-style: none } ul.clients .client_wrapper { padding: 10px 15px; margin: 10px; background: rgba(0, 0, 0, .01); text-align: center; line-height: 0; height: 75px; line-height: 75px; position: relative } ul.clients .client_wrapper:hover { background: rgba(0, 0, 0, .05) } ul.clients .client_wrapper a { display: block; width: 100%; height: 100% } ul.clients .client_wrapper .gs-wrapper { width: 100%; height: 100%; position: relative } ul.clients .client_wrapper img { position: absolute; top: 50% !important; left: 50% !important; -ms-transform: translate(-50%, -50%) !important; -webkit-transform: translate(-50%, -50%) !important; transform: translate(-50%, -50%) !important } ul.clients.greyscale .client_wrapper img.BWFilter { opacity: 1; z-index: 2 } ul.clients.greyscale .client_wrapper img:not(.BWFilter) { opacity: 0 } ul.clients.greyscale .client_wrapper:hover img.BWFilter { opacity: 0 !important } ul.clients.greyscale .client_wrapper:hover img:not(.BWFilter) { opacity: 1 !important } ul.clients.clients_tiles li .client_wrapper { background: none } ul.clients.clients_tiles li .client_wrapper:before { content: ""; display: block; width: 100%; height: 1px; background: rgba(0, 0, 0, .08); position: absolute; left: 0; bottom: 0 } ul.clients.clients_tiles li .client_wrapper:after { content: ""; display: none; position: absolute; left: 50%; margin-left: -4px; bottom: 0; width: 0; height: 0; border-style: solid; border-width: 0 4px 5px; border-color: transparent } ul.clients.clients_tiles li .client_wrapper:hover:before { height: 2px } ul.clients.clients_tiles li .client_wrapper:hover:after { display: block; bottom: 2px } ul.clients li .client_wrapper, ul.clients li .client_wrapper img { -webkit-transition: all .4s ease-in-out; -o-transition: all .4s ease-in-out; transition: all .4s ease-in-out } /* Clients slider -------------------------------------------------------------------- */ .clients_slider .clients_slider_header { position: relative; height: 43px; margin-bottom: 15px; overflow: hidden; padding-right: 110px } .clients_slider .clients_slider_header .title { margin: 9px 0 0 } .clients_slider .clients_slider_header a.slider_prev { position: absolute; top: 0; right: 50px; margin: 0 } .clients_slider .clients_slider_header a.slider_next { position: absolute; top: 0; right: 0; margin: 0 } /* Shop slider ----------------------------------------------------------------------- */ .shop_slider .blog_slider_header { position: relative; height: 43px; margin-bottom: 15px; overflow: hidden; padding-right: 110px } .shop_slider .blog_slider_header .title { margin: 9px 0 0 } .shop_slider .blog_slider_header a.slider_prev { position: absolute; top: 0; right: 50px; margin: 0 } .shop_slider .blog_slider_header a.slider_next { position: absolute; top: 0; right: 0; margin: 0 } .shop_slider .slider_pagination { margin-top: 15px } .shop_slider .shop_slider_ul { margin: 0 } .shop_slider .shop_slider_ul li { float: left; width: 25%; list-style: none } .shop_slider .shop_slider_ul li .item_wrapper { margin: 0 10px; position: relative } .shop_slider .shop_slider_ul li .item_wrapper .desc { background: #fff; padding: 15px 20px } .shop_slider .shop_slider_ul li .item_wrapper .desc h4 { margin-bottom: 5px } .shop_slider .shop_slider_ul li .item_wrapper span.onsale { height: 0; min-height: 0; width: 0; min-width: 0; font-size: 18px; line-height: 18px; text-align: center; position: absolute; left: 0 !important; right: auto; top: 0 !important; margin: 0 !important; border-style: solid; border-width: 70px 70px 0 0; border-color: transparent; padding: 0; text-shadow: none; -webkit-box-shadow: none; box-shadow: none; border-radius: 0; z-index: 2; background: none } .shop_slider .shop_slider_ul li .item_wrapper span.onsale i { position: absolute; left: 8px; top: -60px; color: rgba(0, 0, 0, .5) } .shop_slider .shop_slider_ul li .item_wrapper .price { font-size: 18px; margin-bottom: 0 } .shop_slider .shop_slider_ul li .item_wrapper .price del { font-size: .67em } /* Portfolio grid -------------------------------------------------------------------- */ ul.portfolio_grid { overflow: hidden; margin: 0 } ul.portfolio_grid li { float: left; margin: 0; width: 100%; } ul.portfolio_grid li .image_frame { border: 0; margin: 0 } .two-third.column_portfolio_grid li, .one-second.column_portfolio_grid li, .three-fifth.column_portfolio_grid li, .vc_col-sm-6 .portfolio_grid li, .vc_col-sm-8 .portfolio_grid li { width: 50% } .one.column_portfolio_grid li, .three-fourth.column_portfolio_grid li, .four-fifth.column_portfolio_grid li, .five-sixth.column_portfolio_grid li, .vc_col-sm-9 .portfolio_grid li, .vc_col-sm-10 .portfolio_grid li, .vc_col-sm-12 .portfolio_grid li { width: 25% } /* Portfolio photo ------------------------------------------------------------------- */ .portfolio-photo .portfolio-item { overflow: hidden; position: relative } .portfolio-photo .portfolio-item a.portfolio-item-bg { display: block; position: relative; text-align: center; line-height: 0 } .portfolio-photo .portfolio-item a.portfolio-item-bg .mask { position: absolute; z-index: 1; left: 0; top: 0; background: #000; opacity: .3; width: 100%; height: 100% } .portfolio-photo .portfolio-item:hover a.portfolio-item-bg .mask { opacity: 0 } .portfolio-photo .portfolio-item .portfolio-details { display: block } .portfolio-photo .portfolio-item .portfolio-details .details { position: absolute; z-index: 2; left: 50%; top: 50%; margin: -105px 0 0 -150px; width: 240px; padding: 55px 30px; text-align: center } .portfolio-photo .portfolio-item .portfolio-details .details .title { font-size: 23px; line-height: 27px; border-bottom: 1px solid rgba(0, 0, 0, .1); padding-bottom: 15px; margin-bottom: 10px } .portfolio-photo .portfolio-item .portfolio-details:hover .details { opacity: 0 } .portfolio-photo .portfolio-item .portfolio-details .more { display: block; opacity: 0; text-transform: uppercase; width: 70px; height: 40px; padding: 20px 5px; letter-spacing: 1px; text-align: center; position: absolute; left: 50%; top: 50%; z-index: 2; margin: -40px 0 0 -40px; border-radius: 100% } .portfolio-photo .portfolio-item .portfolio-details .more h4 { font-size: 15px; line-height: 18px } .portfolio-photo .portfolio-item .portfolio-details:hover .more { opacity: 1 } .portfolio-photo .portfolio-item .portfolio-details .details, .portfolio-photo .portfolio-item .portfolio-details .more { background: #fff } .portfolio-photo .portfolio-item .portfolio-details .details .categories { color: #a8a8a8 } .portfolio-photo .portfolio-item .portfolio-details .more { color: rgba(0, 0, 0, .6) } .portfolio-photo .portfolio-item a .mask, .portfolio-photo .portfolio-item .portfolio-details .details, .portfolio-photo .portfolio-item .portfolio-details .more { -webkit-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out } .portfolio-photo .portfolio-item .portfolio-details .image_links a { -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .portfolio-photo.margin .portfolio-item { margin-bottom: 25px } /* Portfolio Items | Filters --------------------------------------------------------- */ .column_portfolio #Filters .filters_wrapper, .column_portfolio #Filters .filters_wrapper ul { display: block } .yve_wrapper #Filters .filters_wrapper, .yve_wrapper #Filters .filters_wrapper ul { display: block } .the_content_wrapper .filters4portfolio .filters_wrapper, .the_content_wrapper .filters4portfolio .filters_wrapper ul { display: block } /* Testimonials slider --------------------------------------------------------------- */ .testimonials_slider { position: relative } .testimonials_slider a.slider_prev, .testimonials_slider a.slider_next { position: absolute; top: 140px; z-index: 2; margin: 0 } .testimonials_slider a.slider_prev { left: 0 } .testimonials_slider a.slider_next { right: 0 } .testimonials_slider .slider_images { width: 100%; height: auto; line-height: 0; text-align: center; margin: 0 0 30px; position: relative; z-index: 2 } .testimonials_slider .slider_images:before { content: ""; display: block; height: 100%; width: 3000px; position: absolute; left: -1000px; top: 0; z-index: 1 } .with_aside .testimonials_slider .slider_images:before { display: none } .testimonials_slider .slider_images a { display: inline-block; height: 85px; width: 85px; line-height: 0; filter: alpha(opacity=50); opacity: .5; position: relative; z-index: 10 } .testimonials_slider .slider_images a:after { content: ""; display: none; height: 6px; width: 100%; position: absolute; left: 0; bottom: -6px } .testimonials_slider .slider_images a.selected, .testimonials_slider .slider_images a:hover { filter: alpha(opacity=100); opacity: 1 } .testimonials_slider .slider_images a.selected:after { display: block } .testimonials_slider .caroufredsel_wrapper { margin: 0 !important } .testimonials_slider .testimonials_slider_ul li { float: left; width: 100%; padding: 0 80px; list-style: none; -webkit-box-sizing: border-box; box-sizing: border-box } .testimonials_slider .testimonials_slider_ul li .bq_wrapper { background: rgba(0, 0, 0, 0.02); padding: 30px 40px 10px; overflow: hidden; margin-bottom: 20px } .testimonials_slider .testimonials_slider_ul li .hr_dots { margin-bottom: 15px } .testimonials_slider .testimonials_slider_ul li .author { text-align: center } .testimonials_slider .testimonials_slider_ul li .author h5 { margin-bottom: 2px } .column:not(.one) .testimonials_slider:not(.single-photo) a.slider_prev, .column:not(.one) .testimonials_slider:not(.single-photo) a.slider_next { display: none !important } .column:not(.one) .testimonials_slider:not(.single-photo) .testimonials_slider_ul li { padding: 0 20px } .one-third .testimonials_slider .slider_images:before, .one-fourth .testimonials_slider .slider_images:before, .one-second .testimonials_slider .slider_images:before { display: none } .yve_wrapper .testimonials_slider .slider_images:before { display: none } .testimonials_slider .slider_images a { -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } /* Testimonials slider - Single photo */ .testimonials_slider.single-photo a.slider_prev, .testimonials_slider.single-photo a.slider_next { display: none !important } .testimonials_slider.single-photo .testimonials_slider_ul li { padding: 0 } .testimonials_slider.single-photo .testimonials_slider_ul li .bq_wrapper { margin: 0 6% 20px } .testimonials_slider.single-photo .testimonials_slider_ul li { text-align: center } .testimonials_slider.single-photo .testimonials_slider_ul li .single-photo-img { margin: 0 auto 20px; height: 85px; width: 85px; line-height: 0; overflow: hidden; border-radius: 50% } .testimonials_slider.single-photo .slider_pager { margin-top: 30px } /* Testimonials list ----------------------------------------------------------------- */ .testimonials_list .item { overflow: hidden; clear: both } .testimonials_list .item .photo { width: 23%; float: left; margin: 0 1% 40px } .testimonials_list .item .desc { width: 73%; float: left; margin: 0 1% 40px } .testimonials_list .item .desc h4 { margin-bottom: 3px; margin-top: 10px } .testimonials_list .item .desc p.subtitle { opacity: .6 } .testimonials_list .item .desc hr.hr_color { width: 20%; margin-left: 0 } .testimonials_list .item.no-img .desc { width: 98% } /* Before After | TwentyTwenty plugin ------------------------------------------------ */ .twentytwenty-horizontal .twentytwenty-handle:before, .twentytwenty-horizontal .twentytwenty-handle:after, .twentytwenty-vertical .twentytwenty-handle:before, .twentytwenty-vertical .twentytwenty-handle:after { content: " "; display: block; background: #fff; position: absolute; z-index: 30; -webkit-box-shadow: 0 0 12px rgba(51, 51, 51, 0.5); box-shadow: 0 0 12px rgba(51, 51, 51, 0.5) } .twentytwenty-horizontal .twentytwenty-handle:before, .twentytwenty-horizontal .twentytwenty-handle:after { width: 3px; height: 9999px; left: 50%; margin-left: -1.5px } .twentytwenty-vertical .twentytwenty-handle:before, .twentytwenty-vertical .twentytwenty-handle:after { width: 9999px; height: 3px; top: 50%; margin-top: -1.5px } .twentytwenty-before-label, .twentytwenty-after-label, .twentytwenty-overlay { position: absolute; top: 0; width: 100%; height: 100%; -webkit-transition-duration: .5s; -o-transition-duration: .5s; transition-duration: .5s } .twentytwenty-before-label, .twentytwenty-after-label { -webkit-transition-property: opacity; -o-transition-property: opacity; transition-property: opacity } .twentytwenty-before-label:before, .twentytwenty-after-label:before { color: #fff; font-size: 13px; letter-spacing: .1em; position: absolute; background: rgba(0, 0, 0, 0.25); line-height: 38px; padding: 0 20px; border-radius: 2px } .twentytwenty-horizontal .twentytwenty-before-label:before, .twentytwenty-horizontal .twentytwenty-after-label:before { top: 50%; margin-top: -19px } .twentytwenty-vertical .twentytwenty-before-label:before, .twentytwenty-vertical .twentytwenty-after-label:before { left: 50%; margin-left: -45px; text-align: center; width: 90px } .twentytwenty-left-arrow, .twentytwenty-right-arrow, .twentytwenty-up-arrow, .twentytwenty-down-arrow { width: 0; height: 0; border: 6px inset transparent; position: absolute } .twentytwenty-left-arrow, .twentytwenty-right-arrow { top: 50%; margin-top: -6px } .twentytwenty-up-arrow, .twentytwenty-down-arrow { left: 50%; margin-left: -6px } .twentytwenty-container { -webkit-box-sizing: content-box; box-sizing: content-box; z-index: 0; overflow: hidden; position: relative; -webkit-user-select: none; -moz-user-select: none } .twentytwenty-container img { max-width: 100%; position: absolute; top: 0; display: block } .twentytwenty-container.active .twentytwenty-overlay, .twentytwenty-container.active :hover.twentytwenty-overlay { background: rgba(0, 0, 0, 0) } .twentytwenty-container.active .twentytwenty-overlay .twentytwenty-before-label, .twentytwenty-container.active .twentytwenty-overlay .twentytwenty-after-label, .twentytwenty-container.active :hover.twentytwenty-overlay .twentytwenty-before-label, .twentytwenty-container.active :hover.twentytwenty-overlay .twentytwenty-after-label { opacity: 0 } .twentytwenty-container * { -webkit-box-sizing: content-box; box-sizing: content-box } .twentytwenty-before-label { opacity: 0 } .twentytwenty-before-label:before { content: "Before" } .twentytwenty-after-label { opacity: 0 } .twentytwenty-after-label:before { content: "After" } .twentytwenty-horizontal .twentytwenty-before-label:before { left: 10px } .twentytwenty-horizontal .twentytwenty-after-label:before { right: 10px } .twentytwenty-vertical .twentytwenty-before-label:before { top: 10px } .twentytwenty-vertical .twentytwenty-after-label:before { bottom: 10px } .twentytwenty-overlay { -webkit-transition-property: background; -o-transition-property: background; transition-property: background; background: rgba(0, 0, 0, 0); z-index: 25 } .twentytwenty-overlay:hover .twentytwenty-after-label { opacity: 1 } .twentytwenty-overlay:hover .twentytwenty-before-label { opacity: 1 } .twentytwenty-before { z-index: 20 } .twentytwenty-after { z-index: 10 } .twentytwenty-handle { height: 38px; width: 38px; position: absolute; left: 50%; top: 50%; margin-left: -22px; margin-top: -22px; border: 3px solid #fff; border-radius: 1000px; -webkit-box-shadow: 0 0 12px rgba(51, 51, 51, 0.5); box-shadow: 0 0 12px rgba(51, 51, 51, 0.5); z-index: 40; cursor: pointer } .twentytwenty-horizontal .twentytwenty-handle:before { bottom: 50%; margin-bottom: 22px; -webkit-box-shadow: 0 3px 0 white, 0 0 12px rgba(51, 51, 51, 0.5); box-shadow: 0 3px 0 white, 0 0 12px rgba(51, 51, 51, 0.5) } .twentytwenty-horizontal .twentytwenty-handle:after { top: 50%; margin-top: 22px; -webkit-box-shadow: 0 -3px 0 white, 0 0 12px rgba(51, 51, 51, 0.5); box-shadow: 0 -3px 0 white, 0 0 12px rgba(51, 51, 51, 0.5) } .twentytwenty-vertical .twentytwenty-handle:before { left: 50%; margin-left: 22px; -webkit-box-shadow: 3px 0 0 white, 0 0 12px rgba(51, 51, 51, 0.5); box-shadow: 3px 0 0 white, 0 0 12px rgba(51, 51, 51, 0.5) } .twentytwenty-vertical .twentytwenty-handle:after { right: 50%; margin-right: 22px; -webkit-box-shadow: -3px 0 0 white, 0 0 12px rgba(51, 51, 51, 0.5); box-shadow: -3px 0 0 white, 0 0 12px rgba(51, 51, 51, 0.5) } .twentytwenty-left-arrow { border-right: 6px solid #fff; left: 50%; margin-left: -17px } .twentytwenty-right-arrow { border-left: 6px solid #fff; right: 50%; margin-right: -17px } .twentytwenty-up-arrow { border-bottom: 6px solid #fff; top: 50%; margin-top: -17px } .twentytwenty-down-arrow { border-top: 6px solid #fff; bottom: 50%; margin-bottom: -17px } /* Ultrawide ------------------------------------------------------------------------- */ .image_frame.stretch .image_wrapper img { width: 100% } .mcb-section.bg-cover, .mcb-wrap.bg-cover, .column_attr.bg-cover { background-size: cover } .mcb-section.bg-contain, .mcb-wrap.bg-contain, .column_attr.bg-contain { background-size: contain } @media only screen and (min-width: 1921px) { .image_frame.stretch-ultrawide .image_wrapper img { width: 100% } .mcb-section.bg-cover-ultrawide, .mcb-wrap.bg-cover-ultrawide, .column_attr.bg-cover-ultrawide { background-size: cover } } /* Others ---------------------------------------------------------------------------- */ /* Date */ .date_label, .timeline_items li h3 span { font-size: 12px; line-height: 18px; display: inline-block; padding: 2px 5px; border-radius: 4px; background-image: url(../images/stripes/css_sprites_10_10.png); background-position: -1px -0; background-size: 10px 10px; } .date_label:after, .timeline_items li h3 span:after { content: ""; display: block; position: absolute; right: -5px; top: 6px; width: 0; height: 0; border-style: solid; border-width: 5.5px 0 5.5px 5px; border-color: transparent } .date_label, .timeline_items li h3 span { background-color: #f8f8f8; color: #a8a8a8 } .date_label:after, .timeline_items li h3 span:after { border-left-color: #f8f8f8 } @media only screen and (min-width: 768px) { .timeline_items li:nth-child(2n) h3 span::after { border-right-color: #f8f8f8; border-width: 5.5px 5.5px 5.5px 0; left: -5px; right: auto } } /* Item | Sidebar Widget */ .column_sidebar_widget .widget:after { display: none } .column_sidebar_widget .widget { margin-bottom: 20px; padding-bottom: 20px } /* Isotope Filtering */ .isotope-item { z-index: 2 } .isotope-hidden.isotope-item { pointer-events: none; z-index: 1 } /* Variables ------------------------------------------------------------------------- */ /* #2991d6 - theme color, link, #2275ac - link hover, strong */ /* Selections */ ::-moz-selection { color: #fff } ::selection { color: #fff } /* Borders */ .idea_box, .ui-tabs, .accordion .question, .accordion .question.active .title, .accordion .question .title:before, .ui-tabs .ui-tabs-nav, .ui-tabs .ui-tabs-nav li, .tabs_vertical.ui-tabs .ui-tabs-panel, table th, table td, .list_item .circle, input[type="date"], input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="url"], select, textarea, .promo_box.has_border:after, dl>dt, dl>dd, .article_box .desc_wrapper p, a.icon_bar, a.content_link, .how_it_works .image, .opening_hours, .opening_hours .opening_hours_wrapper li, .icon_box.has_border:after, .chart_box:before, .pricing-box, .team_list .bq_wrapper, .post-footer .post-links, .format-link .post-title .icon-link, .share_wrapper, .post-header .title_wrapper, .section-post-related .section-related-adjustment, #comments> :first-child, .widget-area, .widget:after, .fixed-nav .desc h6, .portfolio_group.list .portfolio-item, .portfolio_group .portfolio-item .desc .details-wrapper, .Recent_posts ul li .desc h6, .widget_recent_entries ul li a, .ecommerce .widget_best_sellers li, .ecommerce .widget_featured_products li, .ecommerce .widget_recent_reviews li, .ecommerce .widget_recent_products li, .ecommerce .widget_recently_viewed_products li, .ecommerce .widget_random_products li, .ecommerce .widget_top_rated_products li, .ecommerce .widget_onsale li, .ecommerce .widget_layered_nav li, .ecommerce .widget_shopping_cart ul.product_list_widget li, .ecommerce .widget_products li, .ecommerce .product .related.products, .ecommerce .product .upsells.products, .ecommerce .product div.entry-summary h1.product_title:after, .ecommerce .quantity input.qty, .header-stack #Top_bar .logo, .offer_thumb .slider_pagination, .offer_thumb .slider_pagination a, .Latest_news ul li .desc_footer, .Latest_news ul li .photo, .offer_thumb.bottom .slider_pagination a, .style-simple .faq .question, .style-simple #Filters .filters_wrapper ul, #edd_checkout_cart th, #edd_checkout_cart td { border-color: rgba(0, 0, 0, .08) } /* Tooltip */ .tooltip-img .tooltip-content, .tooltip:after { background: #444; color: #fff } /* Highlight */ .dropcap, .highlight:not(.highlight_image) { color: #fff } /* Inputs */ input[type="date"], input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="url"], select, textarea, .ecommerce .quantity input.qty { background-color: #fff; color: #626262; -webkit-box-shadow: inset 0 0 2px 2px rgba(0, 0, 0, 0.02); box-shadow: inset 0 0 2px 2px rgba(0, 0, 0, 0.02) } input[type="date"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="text"]:focus, input[type="url"]:focus, select:focus, textarea:focus { background-color: #E9F5FC !important; border-color: #d5e5ee; color: #1982C2 } /* Dividers */ hr { background-color: rgba(0, 0, 0, .08); color: rgba(0, 0, 0, .08) } /* Header */ #Top_bar .menu>li>a span { border-color: rgba(0, 0, 0, .05) } #Top_bar .search_wrapper input[type="text"] { border-color: #fff; color: #fff } /* Footer */ #Footer .Recent_posts ul li .desc h6, #Footer .widget_recent_entries ul li a, #Footer .widget_best_sellers li, #Footer .widget_featured_products li, #Footer .widget_recent_reviews li, #Footer .widget_recent_products li, #Footer .widget_recently_viewed_products li, #Footer .widget_random_products li, #Footer .widget_top_rated_products li, #Footer .widget_onsale li, #Footer .widget_layered_nav li, #Footer .widget_shopping_cart ul.product_list_widget li, #Footer .widget_products li, #Footer .widget_archive ul li:after, #Footer .widget_nav_menu ul li:after, #Footer table th, #Footer table td { border-color: rgba(255, 255, 255, .08) } /* Borders */ #Sliding-top .Recent_posts ul li .desc h6, #Sliding-top .widget_recent_entries ul li a, #Sliding-top .widget_best_sellers li, #Sliding-top .widget_featured_products li, #Sliding-top .widget_recent_reviews li, #Sliding-top .widget_recent_products li, #Sliding-top .widget_recently_viewed_products li, #Sliding-top .widget_random_products li, #Sliding-top .widget_top_rated_products li, #Sliding-top .widget_onsale li, #Sliding-top .widget_layered_nav li, #Sliding-top .widget_shopping_cart ul.product_list_widget li, #Sliding-top .widget_products li, #Sliding-top .widget_archive ul li:after, #Sliding-top .widget_nav_menu ul li:after, #Sliding-top table th, #Sliding-top table td { border-color: rgba(255, 255, 255, .08) } /* Image frames & Google maps & Icon bar */ .image_frame, .wp-caption, .google-map, .icon_box .icon_wrapper, .content_slider .caroufredsel_wrapper, .author-box .avatar-wrapper, #comments .commentlist>li .photo, .edd_download_image { border-color: #f8f8f8 } .wp-caption-text { background: #f8f8f8; color: #A6A6A6 } .image_frame .image_wrapper, .wp-caption img, .icon_box .icon_wrapper:before { border-color: #e2e2e2 } .image_frame .image_wrapper .mask, .edd_download_image:after { -webkit-box-shadow: inset 0 0 5px 2px rgba(0, 0, 0, .07); box-shadow: inset 0 0 5px 2px rgba(0, 0, 0, .07) } .image_frame .image_wrapper .mask:after { background: rgba(255, 255, 255, .4) } /* Image frame overlay */ .if-overlay .image_frame .image_wrapper .mask { -webkit-box-shadow: inset 0 0 0 0 rgba(0, 0, 0, .0); box-shadow: inset 0 0 0 0 rgba(0, 0, 0, .0) } .if-overlay .image_frame .image_wrapper .mask:after { background: rgba(0, 0, 0, .15) } /* Sliding box */ .sliding_box .desc_wrapper h4 { color: #fff } /* Counter & Chart */ .counter .desc_wrapper .number-wrapper, .chart_box .chart .num, .chart_box .chart .icon, .style-simple .quick_fact .number-wrapper, #edd_checkout_cart .edd_cart_header_row th { color: #444 } /* Icon bar */ a.icon_bar { color: #444 !important } /* Get in touch & Infobox */ .get_in_touch, .get_in_touch a, .get_in_touch h3, .get_in_touch ul, .infobox, .infobox a, .infobox h3, .infobox ul { color: #fff !important } /* How it works */ .how_it_works .image .number { color: #fff } /* Trailer box */ .trailer_box .desc h2 { color: #fff } .trailer_box .desc .subtitle { color: #fff } /* Icon box */ .icon_box:hover .icon_wrapper, .icon_box a:hover .icon_wrapper { color: #fff } /* List */ .list_item.lists_1 .list_left { color: #fff } /* Features list */ .feature_list ul li:hover, .feature_list ul li:hover a { color: #fff } .feature_list ul li:hover .icon i, .feature_list ul li:hover a .icon i { color: #fff } /* Tabs, Accordion, Toggle, Table, Faq */ .ui-tabs .ui-tabs-nav li a, .accordion .question .title, .faq .question .title, table th { color: #444 } .ui-tabs .ui-tabs-nav li.ui-state-active a:after, body.table-hover:not(.ecommerce-page) table tr:hover td, body.table-hover:not(.ecommerce-page) table tr:hover td a { color: #fff } .accordion .question .answer, .ui-tabs .ui-tabs-panel, .ui-tabs .ui-tabs-nav li.ui-state-active a, .ui-tabs .ui-tabs-nav li.ui-tabs-selected:after, .ui-tabs .ui-tabs-nav li.ui-state-active:after, .tabs_vertical.ui-tabs .ui-tabs-nav li.ui-state-active a { background-color: #fff } /* Pricing */ .pricing-box-box.pricing-box-featured, .pricing-box-box.pricing-box-featured .plan-header h2, .pricing-box-box.pricing-box-featured .plan-header .price sup.currency, .pricing-box-box.pricing-box-featured .plan-header .price>span, .pricing-box-box.pricing-box-featured .plan-header .price sup.period, .pricing-box-box.pricing-box-featured .plan-header p.subtitle, .pricing-box-box.pricing-box-featured .plan-inside ul { color: #fff } .pricing-box-box.pricing-box-featured .plan-header hr { border-color: rgba(0, 0, 0, .2); background: rgba(0, 0, 0, .2) } .pricing-box-box.pricing-box-featured a.button { background-color: #fff; color: #444 } /* Mobile menu */ @media only screen and (max-width: 959px) { #Header #menu>ul>li.current-menu-item>a, #Header #menu>ul>li.current_page_item>a, #Header #menu>ul>li.current-menu-parent>a, #Header #menu>ul>li.current-page-parent>a, #Header #menu>ul>li.current-menu-ancestor>a, #Header #menu>ul>li.current_page_ancestor>a { background: rgba(0, 0, 0, .02) } } /* Style Simple ---------------------------------------------------------------------- */ /* Tabs */ .style-simple .ui-tabs { border: 0 } .style-simple .ui-tabs .ui-tabs-panel { background: none } .style-simple .ui-tabs .ui-tabs-nav { background: none } .style-simple .ui-tabs .ui-tabs-nav li { border: 0; display: inline-block; float: none } .style-simple .ui-tabs .ui-tabs-nav li.ui-state-active a, .style-simple .ui-tabs .ui-tabs-nav li.ui-tabs-selected:after, .style-simple .ui-tabs .ui-tabs-nav li.ui-state-active:after { background-color: transparent } .style-simple .ui-tabs .ui-tabs-nav li.ui-tabs-selected a:after, .style-simple .ui-tabs .ui-tabs-nav li.ui-state-disabled a:after, .style-simple .ui-tabs .ui-tabs-nav li.ui-state-processing a:after, .style-simple .ui-tabs .ui-tabs-nav li.ui-state-active a:after { bottom: -1px; height: 2px; margin-left: -50%; width: 100% } .style-simple .tabs_vertical.ui-tabs .ui-tabs-panel { border-width: 0 0 0 1px !important } .style-simple .tabs_vertical.ui-tabs .ui-tabs-nav { border: 0 } .style-simple .tabs_vertical.ui-tabs .ui-tabs-nav li.ui-tabs-selected a:after, .style-simple .tabs_vertical.ui-tabs .ui-tabs-nav li.ui-state-disabled a:after, .style-simple .tabs_vertical.ui-tabs .ui-tabs-nav li.ui-state-processing a:after, .style-simple .tabs_vertical.ui-tabs .ui-tabs-nav li.ui-state-active a:after { display: block; width: 2px; height: 100%; right: -1px; top: 0; bottom: auto; left: auto; margin: 0 } .style-simple .tabs_vertical.ui-tabs .ui-tabs-nav li a { background: none; text-align: right; padding-right: 20px !important; padding-left: 10px !important } /* Accordion & Toggle */ .style-simple .accordion .question { border-width: 0 0 0 1px; border-radius: 0; position: relative; margin-bottom: 0 } .style-simple .accordion .question:after { content: ""; display: none; width: 2px; height: 100%; position: absolute; left: 0; top: 0; background-color: #ccc } .style-simple .accordion .question.active:after { display: block } .style-simple .accordion .question .title { background: none; padding-left: 50px; border: 0 } .style-simple .accordion .question .title:before { display: none } .style-simple .accordion .question .answer { background: none; padding: 0 20px 10px 50px } /* FAQ */ .style-simple .faq .question { border-width: 0 0 0 1px; border-style: solid; margin-bottom: 0; position: relative; background: none } .style-simple .faq .question:before { display: none } .style-simple .faq .question:after { content: ""; display: none; width: 2px; height: 100%; position: absolute; top: 0; background-color: #ccc } .style-simple .faq .question .title, .style-simple .faq .question .answer { padding-left: 70px } .style-simple .faq .question.active:after { display: block } /* Table */ .style-simple table:not(.recaptchatable) th { background: none } .style-simple table:not(.recaptchatable) tr:first-child td { background: none } .style-simple table:not(.recaptchatable) th, .style-simple table td { border-width: 0 1px 1px 0 } .style-simple table:not(.recaptchatable) tr td:last-child, .style-simple table tr th:last-child { border-right: 0 } .style-simple table:not(.recaptchatable) tr:last-child td { border-bottom: 0 } .style-simple table:not(.recaptchatable) tr:nth-child(2n) td { background: none } /* Opening hours */ .style-simple .opening_hours { padding: 0; border: 0; background-color: transparent } .style-simple .opening_hours .opening_hours_wrapper li { padding-bottom: 0; border: 0; margin-bottom: 0; text-align: left } .style-simple .opening_hours .opening_hours_wrapper li label { background-color: transparent; background-image: none; font-size: 15px; border-bottom: 1px solid #ccc; padding: 10px 0; border-radius: 0 } .style-simple .opening_hours .opening_hours_wrapper li span { font-size: 32px; line-height: 32px; padding: 10px 0 } .style-simple .opening_hours .opening_hours_wrapper li span sup { top: -1px; font-size: 16px; line-height: 16px; margin-left: 4px } /* Icon box */ .style-simple .icon_box .image_wrapper, .style-simple .icon_box .icon_wrapper { padding-top: 5px; margin-bottom: 25px } .style-simple .icon_box .icon_wrapper { font-size: 80px; background-color: transparent; -webkit-box-shadow: 0 0 0 0 rgba(0, 0, 0, .0); box-shadow: 0 0 0 0 rgba(0, 0, 0, .0); border-width: 0; background-image: none; -webkit-transform: scale(1) !important; -ms-transform: scale(1) !important; transform: scale(1) !important } .style-simple .icon_box .icon_wrapper:before { display: none } .style-simple .icon_box .icon_wrapper i { position: relative; top: 0 } .style-simple .icon_box .image_wrapper img { position: relative; top: 0 } .style-simple .icon_box .desc_wrapper h4 { margin-bottom: 20px } .style-simple .icon_box .desc_wrapper h4:before { content: ""; display: block; width: 0; margin: 0 auto; height: 2px; top: -15px; position: relative; background-color: #ccc } .style-simple .icon_box:hover .icon_wrapper i { top: -5px } .style-simple .icon_box:hover .image_wrapper img { top: -5px } .style-simple .icon_box:hover .desc_wrapper h4:before { width: 100px } .style-simple .icon_box .icon_wrapper i, .style-simple .icon_box .image_wrapper img, .style-simple .icon_box .desc_wrapper h4:before { -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } /* Filters */ .style-simple #Filters { text-align: center } .style-simple #Filters .filters_buttons { background: none; padding: 15px 0 } .style-simple #Filters .filters_wrapper { margin-top: 0 } .style-simple #Filters .filters_wrapper ul { overflow: visible; display: inline-block; border-bottom-width: 1px; border-style: solid } .style-simple #Filters .filters_wrapper ul li { width: auto; margin: 0 } .style-simple #Filters .filters_wrapper ul li a { background: none; border: 0; padding: 14px 25px; position: relative } .style-simple #Filters .filters_wrapper ul li a:after { content: ""; display: none; position: absolute; left: 0; bottom: -1px; width: 100%; height: 2px; background: #ccc } .style-simple #Filters .filters_wrapper ul li.close a { color: inherit; padding: 14px 15px; width: auto; border: 0 !important } .style-simple #Filters .filters_wrapper ul li a:hover, .style-simple #Filters .filters_wrapper ul li.current-cat a { background: none; color: inherit } .style-simple #Filters .filters_wrapper ul li.current-cat a:after { display: block } /* Clients */ .style-simple ul.clients.clients_tiles li .client_wrapper::after { display: none } /* Progress bars */ .style-simple .progress_bars .bars_list li .bar { height: 5px } .style-simple .progress_bars .bars_list li .bar { -webkit-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0) inset; box-shadow: 0 0 0 0 rgba(0, 0, 0, 0) inset; background: rgba(0, 0, 0, 0.03); border-radius: 0 } .style-simple .progress_bars .bars_list li .bar .progress { background-image: none } /* Counters */ .style-simple .counter { background-image: none; } /* Lists */ .style-simple .list_item.lists_1 .list_left { background-image: none; border-radius: 2px; -webkit-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0) inset; box-shadow: 0 0 0 0 rgba(0, 0, 0, 0) inset } .style-simple .list_item .circle { background-image: none; -webkit-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0) inset; box-shadow: 0 0 0 0 rgba(0, 0, 0, 0) inset } /* Blockquote */ .style-simple blockquote { background: none; line-height: 25px; font-style: italic } .style-simple blockquote:after { display: none } /* Testimonials slider */ .style-simple .testimonials_slider .testimonials_slider_ul li .bq_wrapper { padding-top: 0; padding-bottom: 0; background: none; text-align: center } .style-simple .testimonials_slider .slider_images { background-color: transparent } .style-simple .testimonials_slider .slider_images:before { display: none } /* Article box */ .style-simple .article_box .desc_wrapper { background-image: none } .style-simple .article_box .desc_wrapper p { border-bottom-width: 0; margin-bottom: 0; padding-bottom: 10px } .style-simple .article_box .desc_wrapper p:after { background-color: rgba(0, 0, 0, .1); content: ""; display: block; height: 2px; margin-top: 10px; width: 20px } .style-simple .article_box:hover .desc_wrapper p:after { width: 40% } .style-simple .article_box .desc_wrapper i.icon-right-open { display: none } .style-simple .article_box .desc_wrapper p:after { -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } /* Idea box */ .style-simple .idea_box { border: 1px solid rgba(0, 0, 0, 0.08); padding: 15px 15px 15px 0; background: none } .style-simple .idea_box .icon { display: block; position: static; float: left; left: 0; top: 0; margin-top: 0; width: 60px; text-align: center; margin-top: 5px } .style-simple .idea_box .desc { border-left: 1px solid rgba(0, 0, 0, 0.08); padding: 10px 15px 10px 20px; margin-left: 60px } /* Sliding box */ .style-simple .sliding_box .photo_wrapper { top: 0 } .style-simple .sliding_box .desc_wrapper { background: none; padding-left: 0; padding-right: 0 } .style-simple .sliding_box .desc_wrapper h4 { color: inherit; margin-bottom: 5px } .style-simple .sliding_box .desc_wrapper:after { display: inline-block; content: ""; width: 20%; height: 2px; border: 0; background-color: rgba(0, 0, 0, .1); position: static; top: 0; margin: 0 } .style-simple .sliding_box:hover .desc_wrapper:after { width: 60% } /* Trailer box */ .style-simple .trailer_box .desc { padding: 27px 15px 30px } .style-simple .trailer_box .desc .line { display: none } .style-simple .trailer_box .desc .subtitle { background-image: none; background-color: transparent; color: rgba(255, 255, 255, .7); margin-bottom: 10px; padding: 0 } .style-simple .trailer_box:hover .desc h2 { bottom: 0 } .style-simple .trailer_box:hover .desc .subtitle { bottom: 0 } .style-simple .trailer_box .desc { -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } /* Timeline */ .style-simple .timeline_items { background: none } .style-simple .timeline_items:after { display: none } .style-simple .timeline_items li { width: 50%; padding: 0 0 0 50%; background: none; margin-bottom: 15px !important } .style-simple .timeline_items li:nth-child(even) { padding: 0 50% 0 0; background: none } .style-simple .timeline_items li h3 span { background: none !important; border-radius: 4px; font-size: 14px; font-style: italic; top: 22px } .style-simple .timeline_items li h3:before { display: none } .style-simple .timeline_items li .desc:before { display: none } .style-simple .timeline_items li h3 { border-left: 2px solid rgba(0, 0, 0, 0.08); margin: 0; padding: 15px 0 0 25px; width: 100%; box-sizing: padding-box; -webkit-box-sizing: border-box } .style-simple .timeline_items li h3 span { position: absolute; right: 52% } .style-simple .timeline_items li:nth-child(even) h3 { padding: 15px 25px 0 0; text-align: right; border-left: 0; border-right: 2px solid rgba(0, 0, 0, 0.04) } .style-simple .timeline_items li:nth-child(even) h3 span { left: 52%; right: auto } .style-simple .timeline_items li .desc { border-left: 2px solid rgba(0, 0, 0, 0.08); padding: 15px 0 15px 25px; background: none; width: 100%; box-sizing: padding-box; -webkit-box-sizing: border-box } .style-simple .timeline_items li:nth-child(even) .desc { padding: 15px 25px 15px 0; border-left: 0; border-right: 2px solid rgba(0, 0, 0, 0.04) } .style-simple .timeline_items li:hover h3, .style-simple .timeline_items li:nth-child(even):hover h3, .style-simple .timeline_items li:hover .desc, .style-simple .timeline_items li:nth-child(even):hover { -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } /* Quick fact */ .style-simple .quick_fact .number-wrapper { font-family: inherit; font-size: 60px; line-height: 60px } .style-simple .quick_fact .title { font-family: inherit; font-size: 18px; font-weight: 400 } .style-simple .quick_fact hr { display: none } /* Chart box */ .style-simple .chart_box:before { background-color: transparent; background-image: none; border-width: 0 } .style-simple .chart_box .chart .num { font-family: inherit; font-size: 30px } /* Content link */ .style-simple a.content_link { border-width: 0 0 2px; margin: 0 10px; background-color: transparent; background-image: none } .style-simple a.content_link:after { border-width: 0 0 2px; bottom: -2px } .style-simple a.content_link:before { border-width: 0 5px 6px } /* How it works */ .style-simple .how_it_works .image { border-width: 0 0 2px; background: transparent; border-radius: 0; margin-bottom: 30px } .style-simple .how_it_works .image .number { border-radius: 0; bottom: -17px; left: 50%; margin-left: -17px; -webkit-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0) inset; box-shadow: 0 0 0 0 rgba(0, 0, 0, 0) inset } /* Offer thumb */ .style-simple .offer_thumb_ul li.offer_thumb_li { padding-left: 0 } .style-simple .offer_thumb .slider_pagination a img { filter: alpha(opacity=70); opacity: .7 } .style-simple .offer_thumb .slider_pagination a.selected img, .style-simple .offer_thumb .slider_pagination a:not(.selected):hover img { filter: alpha(opacity=1); opacity: 1 } @media only screen and (min-width: 768px) { .style-simple .offer_thumb .slider_pagination { border: 0 } .style-simple .offer_thumb .slider_pagination a { margin-bottom: 6px; border-width: 1px; background: none } .style-simple .offer_thumb.bottom .slider_pagination a { margin: 3px } .style-simple .offer_thumb .slider_pagination a:before, .style-simple .offer_thumb .slider_pagination a:after { display: none } } /* Alerts */ .style-simple .alert { border-radius: 0 } .style-simple .alert .alert_icon { position: absolute; left: 0; top: 0; background: none; border-right: 1px solid rgba(255, 255, 255, .3); border-radius: 0 } /* Zoom box */ /* .style-simple .zoom_box{position:relative;line-height:0;overflow:hidden} .style-simple .zoom_box .photo img,.style-simple .zoom_box .desc{-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition:all .3s ease-in-out;transition:all .3s ease-in-out} .style-simple .zoom_box .photo img{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)} .style-simple .zoom_box:hover .photo img{-webkit-transform:scale(1.15);-moz-transform:scale(1.15);-ms-transform:scale(1.15);-o-transform:scale(1.15);transform:scale(1.15)} .style-simple .zoom_box .desc{background:rgba(0,0,0,.8);width:100%;height:100%;position:absolute;left:0;top:0;text-align:center;opacity:0;-webkit-transform:scale(1.15);-moz-transform:scale(1.15);-ms-transform:scale(1.15);-o-transform:scale(1.15);transform:scale(1.15)} .style-simple .zoom_box:hover .desc{opacity:1;-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)} .style-simple .zoom_box .desc .desc_img{position:absolute;left:0;top:50%;width:100%;text-align:center;transform:translateY(-80%);-webkit-transform:translateY(-80%)} .style-simple .zoom_box .desc .desc_img img{padding:0} .style-simple .zoom_box .desc .desc_txt{width:100%;padding:15px 20px;font-size:17px;line-height:22px;color:#fff;position:absolute;left:0;bottom:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box} */ /* Features list */ .style-simple .feature_list hr { background-color: rgba(0, 0, 0, 0); color: rgba(0, 0, 0, 0) } /* Progress icons */ .style-simple .progress_icons .progress_icon { color: rgba(0, 0, 0, .3); border-width: 1px; border-style: solid } .style-simple .progress_icons .progress_icon.themebg { border-color: transparent; color: #fff } .style-simple .progress_icons .progress_icon:not(.themebg) { background: none; border-color: rgba(0, 0, 0, .3) } /* Pricing box */ .style-simple .pricing-box { border: 0 } .style-simple .pricing-box:not(.pricing-box-featured) { background: none } /* Tooltip */ .style-simple .tooltip:hover:after, .style-simple .tooltip.hover:after { background-image: none } /* Highlight */ .style-simple .highlight { background-image: none; } /* Get in touch */ .style-simple .get_in_touch { padding: 25px 30px } .style-simple .get_in_touch ul li { border-bottom: 1px solid rgba(255, 255, 255, .1) } .style-simple .get_in_touch ul li:last-child { border: 0 } .style-simple .get_in_touch ul li:after { display: none } .style-simple .get_in_touch ul li .icon { left: 5px } /* Infobox */ .style-simple .infobox { padding: 25px 30px } .style-simple .infobox ul li { border-bottom: 1px solid rgba(255, 255, 255, .1); padding-left: 40px } .style-simple .infobox ul li:last-child { border: 0 } .style-simple .infobox ul li:after { display: none } .style-simple .infobox ul li:before { left: 5px } /* Icon bar */ .style-simple a.icon_bar { border-width: 0; background-color: #f0f0f0; background-image: none; -webkit-box-shadow: inset 0 0 0 0 rgba(0, 0, 0, .0); box-shadow: inset 0 0 0 0 rgba(0, 0, 0, .0) } .style-simple a.icon_bar span.t { opacity: 1; filter: alpha(opacity=100) } .style-simple a:hover.icon_bar span.t { opacity: 0; filter: alpha(opacity=0) } .style-simple a.icon_bar span.b { position: absolute; top: 0; opacity: 0; filter: alpha(opacity=0) } .style-simple a:hover.icon_bar span.b { opacity: 1; filter: alpha(opacity=100) } .style-simple a.icon_bar span { -webkit-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .style-simple a.icon_bar span.b { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) } .style-simple a:hover.icon_bar span { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } /* Featured list */ .Latest_news.featured_time .left_wrapper, .posts_group.timeline2 .left_wrapper { float: left; margin-right: 20px; } .Latest_news.featured_time .ul-first .desc { width: calc(100% - 80px); padding-left: 12px; margin-left: 80px; } .Latest_news.featured_time .image_frame, .posts_group.timeline2 .image_frame, .posts_group.timeline2 .post-footer, .posts_group.timeline2 .post-excerpt { display: none; } .posts_group.timeline2 .post-title .entry-title { font-size: 18px; } .Latest_news.featured_time .time, .posts_group.timeline2 .time { line-height: 1.5; text-align: center; max-width: 80px; float: right; width: 100%; } .Latest_news.featured_time .time>div, .posts_group.timeline2 .time>div { background: rgb(241, 241, 241); border-radius: 3px; } .Latest_news.featured_time a:hover { text-decoration: none; } .Latest_news.featured_time .time .day, .posts_group.timeline2 .time .day { font-size: 22px; color: #3C3C3C; line-height: 3; padding: 0 20px; } .Latest_news.featured_time .time .year, .posts_group.timeline2 .time .year { color: #7D8B99; margin-top: 2px; } .Latest_news.featured_time .photo { border: none; } .Latest_news.featured_simple .ul-first .desc { width: 100%; margin-left: 0; padding-left: 0; } .Latest_news.featured_simple .ul-first>li>div:not(.desc) { display: none; } .Latest_news.featured_simple .desc>*:not(.post-excerpt) { display: inline; } .Latest_news.featured_simple ul li .desc_footer .date { float: none; } .Latest_news.featured_simple ul li .desc_footer { float: right; } .Latest_news.featured_simple .desc_footer { border: none; padding: 0; } .Latest_news.featured_simple ul li { margin-bottom: 10px; } .Latest_news.featured_simple>ul>li .desc h5 i, .Latest_news.featured_simple>ul>li .desc h4 i { font-style: normal; margin-right: 0.5em; } .Latest_news.col-2>.ul-first>li { width: 47.99%; float: left; } .Latest_news.col-3>.ul-first>li { width: 31.33%; float: left; } .Latest_news.col-4>.ul-first>li { width: 22.99%; float: left; } .Latest_news.col-5>.ul-first>li { width: 18.99%; margin: 0 0.5% 20px; float: left; } .Latest_news.col-6>.ul-first>li { width: 15.66%; margin: 0 0.5% 20px; float: left; } /* vc_posts */ .posts_group.simple { position: static !important; height: auto !important; } .posts_group.simple>div { position: static !important; margin-bottom: 10px; } .posts_group.simple .image_frame, .posts_group.simple .post-excerpt, .posts_group.simple .category, .posts_group.simple .post-author, .posts_group.simple .date .label, .posts_group.simple .post-footer, .posts_group.simple .image_wrapper_tiles { display: none; } .posts_group.simple .entry-title, .posts_group.simple .post-meta, .posts_group.simple .post-excerpt { margin: 0; } .posts_group.simple .post-desc { padding: 0; } .posts_group.simple .post-head { float: right; width: 130px; white-space: normal; } .posts_group.simple .post-title { float: left; width: calc(100% - 130px); } .posts_group.simple .entry-title { font-weight: normal; font-size: 14px; line-height: 1.5; } .posts_group.simple .post-desc-wrapper { width: 100%; } .posts_group.simple .entry-title i { font-style: normal; margin-right: 0.5em; } .portfolio_slider_ul>li { list-style: none !important; visibility: visible; } /* yve_gallery */ .yve_gallery .flexslider .slides { width: 100%; overflow: hidden; } .yve_gallery .flexslider .slides>li { float: left; display: block; visibility: hidden; } .yve_gallery .flexslider .slides img { width: 100%; } .per_view_2.yve_gallery .slides>li { width: 50%; } .end .flexslider .slides>li { visibility: initial; } /* 忙鈥奥┟ヂ扁€⒚甭幻ヂ惵 */ .desc-hide .post-excerpt { display: none; } /* pad-x */ @media screen and (max-width: 1024px) and (min-width: 769px) { .desc-hide-pad-x .post-excerpt { display: none; } } /* pad */ @media screen and (max-width: 768px) and (min-width: 669px) { .desc-hide-pad .post-excerpt { display: none; } } /* phone-x */ @media screen and (max-width: 668px) and (min-width: 376px) { .desc-hide-phone-x .post-excerpt { display: none; } } /* phone */ @media screen and (max-width: 375px) { .desc-hide-phone .post-excerpt { display: none; } }