PATH:
home
/
lab2454c
/
bullionmills.com
/
wp-content
/
plugins
/
ocean-elementor-widgets
/
assets
/
css
/
search-icon
/*------------------------------------------------------------------ Search Icon -------------------------------------------------------------------*/ .oew-search-icon-wrap { display: inline-block; position: relative; line-height: 1; } .oew-search-icon-wrap.oew-search-icon-header_replace { position: inherit; } .oew-search-icon-wrap .oew-search-toggle { display: inline-block; padding: 10px; } .oew-search-dropdown { display: none; position: absolute; right: 0; background-color: #fff; border-top: 3px solid #13aff0; top: 100%; padding: 15px; width: 260px; -webkit-box-shadow: 0 2px 7px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 2px 7px rgba(0, 0, 0, 0.1); box-shadow: 0 2px 7px rgba(0, 0, 0, 0.1); z-index: 10000; } .oew-search-dropdown form input { display: block; background-color: transparent; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; border-radius: 0; margin: 0; } .oew-search-overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.9); z-index: 9999; } .oew-search-overlay .container { position: relative; max-width: 550px; height: 100%; } .oew-search-overlay form { position: absolute; top: 50%; left: 0; margin-top: -33px; width: 100%; text-align: center; } .oew-search-overlay form input, .oew-search-overlay form label { font-size: 22px; line-height: 1.3; padding: 18px 0; margin: 0; min-height: 50px; color: #fff; letter-spacing: 1px; text-transform: uppercase; text-align: center; } .oew-search-overlay form input { position: relative; border: 0; background-color: transparent; border-bottom: 1px solid #444; z-index: 2; -webkit-transition: border-color 0.3s ease; -moz-transition: border-color 0.3s ease; -ms-transition: border-color 0.3s ease; -o-transition: border-color 0.3s ease; transition: border-color 0.3s ease; } .oew-search-overlay form input:hover { border-color: #777; } .oew-search-overlay form input:focus { border-color: #fff; } .oew-search-overlay form label { display: block; position: absolute; top: 0; bottom: 0; left: 0; right: 0; cursor: text; -moz-opacity: 0.5; -webkit-opacity: 0.5; opacity: 0.5; z-index: 1; } .oew-search-overlay form label i { display: inline-block; background-color: #fff; width: 3px; height: 3px; margin-left: 3px; -webkit-animation: blink 1s linear infinite; -moz-animation: blink 1s linear infinite; -ms-animation: blink 1s linear infinite; -o-animation: blink 1s linear infinite; animation: blink 1s linear infinite; } .oew-search-overlay form label i + i { -ms-animation-delay: 0.2s; -webkit-animation-delay: 0.2s; -o-animation-delay: 0.2s; -moz-animation-delay: 0.2s; animation-delay: 0.2s; } .oew-search-overlay form label i + i + i { -ms-animation-delay: 0.4s; -webkit-animation-delay: 0.4s; -o-animation-delay: 0.4s; -moz-animation-delay: 0.4s; animation-delay: 0.4s; } .oew-search-overlay form.search-filled label { -moz-opacity: 0; -webkit-opacity: 0; opacity: 0; -webkit-transition-duration: 150ms; -moz-transition-duration: 150ms; -ms-transition-duration: 150ms; -o-transition-duration: 150ms; transition-duration: 150ms; } .oew-search-overlay a.oew-search-overlay-close { position: absolute; top: -50px; left: 50%; margin-left: -20px; width: 40px; height: 40px; background-color: rgba(255, 255, 255, 0.2); text-align: center; -webkit-border-radius: 2px; -moz-border-radius: 2px; -ms-border-radius: 2px; border-radius: 2px; } .oew-search-overlay a.oew-search-overlay-close span { position: relative; display: inline-block; width: 24px; height: 24px; } .oew-search-overlay a.oew-search-overlay-close span:before, .oew-search-overlay a.oew-search-overlay-close span:after { content: ''; position: absolute; top: 50%; left: 0; height: 2px; width: 100%; margin-top: 6px; background-color: #fff; -webkit-border-radius: 5px; -moz-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; } .oew-search-overlay a.oew-search-overlay-close span:before { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .oew-search-overlay a.oew-search-overlay-close span:after { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } @-webkit-keyframes blink { 0% { -webkit-opacity: 1; } 50% { -webkit-opacity: 0; } 100% { -webkit-opacity: 1; } } @-moz-keyframes blink { 0% { -moz-opacity: 1; } 50% { -moz-opacity: 0; } 100% { -moz-opacity: 1; } } @-o-keyframes blink { 0% { -o-opacity: 1; } 50% { -o-opacity: 0; } 100% { -o-opacity: 1; } } @keyframes blink { 0% { opacity: 1; } 50% { opacity: 0; } 100% { opacity: 1; } } .oew-align-left { text-align: left; } .oew-align-center { text-align: center; } .oew-align-right { text-align: right; } @media (max-width: 1024px) { .oew-tablet-align-left { text-align: left; } .oew-tablet-align-center { text-align: center; } .oew-tablet-align-right { text-align: right; } } @media (max-width: 767px) { .oew-mobile-align-left { text-align: left; } .oew-mobile-align-center { text-align: center; } .oew-mobile-align-right { text-align: right; } } /* RTL */ body.rtl .oew-search-dropdown { left: 0; right: auto; } body.rtl .oew-search-overlay { right: 0; left: auto; } body.rtl .oew-search-overlay form { right: 0; left: auto; } body.rtl .oew-search-overlay form label i { margin-right: 3px; margin-left: 0; } body.rtl .oew-search-overlay a.oew-search-overlay-close { right: 50%; left: auto; margin-right: -20px; margin-left: 0; } body.rtl .oew-search-overlay a.oew-search-overlay-close span:before, body.rtl .oew-search-overlay a.oew-search-overlay-close span:after { right: 0; left: auto; }
[+]
..
[-] style.min.css
[edit]
[-] style.css
[edit]
[-] style.scss
[edit]