/** @import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,400i,600,700,800'); @import url('https://fonts.googleapis.com/css?family=Poppins:300,400,400i,500,600,700'); @font-face { font-family: 'trend_hm_sansone'; src: url('fonts/trendhmsans-one-webfont.woff2') format('woff2'), url('fonts/trendhmsans-one-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } @font-face { font-family: 'trend_hm_sansone_italic'; src: url('fonts/trendhmsans-one-italic-webfont.woff2') format('woff2'), url('fonts/trendhmsans-one-italic-webfont.woff') format('woff'); font-weight: normal; font-style: normal; } Table of Content ================================================== #Reset & Basics #Basic Styles #Site Styles #Typography #Links #Lists #Images #Buttons #Forms #Misc #Reset & Basics ==================================================  **/ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-family: 'Poppins', sans-serif; /* font-family: 'Open Sans';*/ line-height: 1.42857; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: 100%; } body { line-height: 1; } * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 0; margin: 0; outline: none; } *, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; outline: none; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } th { text-align: left; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } table { border-collapse: collapse; border-spacing: 0; } /* #Basic Styles ================================================== */ /* #Typography ================================================== */ h1, h2, h3, h4, h5, h6 { font-weight: normal; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { font-weight: inherit; } .subheader { color: #777; } /* Headings & paragraphs -- */ h1, h2, h3, h4, h5, h6 { text-transform: none; padding: 0 0 5px 0; color: #4c4c4c; margin: 0; line-height: normal; } h1, .h1 { font-size: 2.4em; padding: 0; } h2, .h2 { font-size: 1.8em; line-height: normal; } h3, .h3 { font-size: 1.7em; } h4, .h4 { font-size: 1.4em; } h5, .h5 { font-size: 1.3em; } h6, .h6 { font-size: 1.1em; } strong { font-weight: 700; } /* inpput */ p { margin: 0 0 10px 0; line-height: 1.5; font-size: 1em; color: #626262; } p {} p img { margin: 0; } p.lead { font-size: 21px; color: #777; } em { font-style: italic; } strong { font-weight: 600; } small { font-size: 80%; } /*	Blockquotes  */ blockquote, blockquote p { font-size: 17px; line-height: 24px; color: #777; font-style: italic; } blockquote { margin: 0 0 20px; padding: 9px 20px 0 19px; border-left: 1px solid #ddd; } blockquote cite { display: block; font-size: 12px; color: #555; } blockquote cite:before { content: "\2014 \0020"; } blockquote cite a, blockquote cite a:visited, blockquote cite a:visited { color: #555; } hr { border: solid #ddd; border-width: 1px 0 0; clear: both; margin: 10px 0 30px; height: 0; } button, html input[type="button"], input[type="reset"], input[type="submit"], a { cursor: pointer; } /* #Links ================================================== */ a { color: var(--first-color); } a, a:visited { line-height: normal; text-decoration: none; outline: 0; -webkit-transition: all ease .3s; -moz-transition: all ease .3s; -o-transition: all ease .3s; transition: all ease .3s; } a:hover, a:focus { -webkit-transition: all ease .3s; -moz-transition: all ease .3s; -o-transition: all ease .3s; transition: all ease .3s; } p a, p a:visited { line-height: inherit; } /* #Lists ================================================== */ ul, ol { margin-bottom: 0px; } ul { list-style: none outside; } ol { list-style: decimal; } ol, ul.square, ul.circle, ul.disc {} ul.square { list-style: square outside; } ul.circle { list-style: circle outside; } ul.disc { list-style: disc outside; } ul ul, ul ol, ol ol, ol ul { margin: 0px; } ul ul li, ul ol li, ol ol li, ol ul li { margin-bottom: 0px; } li {} ul.large li { line-height: 21px; } li p { line-height: 21px; } /* #Images ================================================== */ img.scale-with-grid { max-width: 100%; height: auto; } /* form elements ---------------------- */ input::-moz-focus-inner { border: 0; padding: 0; } input, select, textarea { outline: none; font-family: inherit; } input[type="submit"], input[type="button"], input[type="reset"] { -webkit-appearance: none; } input[type="text"], input[type="password"], input[type="reset"], textarea, select { -webkit-appearance: none; -moz-appearance: none; appearance: none; } input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill { background: transparent !important; } select::-ms-expand { display: none; } input[type="text"]:focus, input[type="email"]:focus, input[type="phone"]:focus, input[type="search"]:focus, input[type="password"]:focus, textarea:focus, select:focus, input[type="number"]:focus, input[type="file"]:focus {} /*Misc*/ .show--mobile { display: inline-block !important; } .hide--desktop { display: none !important; } .show--desktop { display: inline-block !important; } .float--left { float: left !important; } .float--right { float: right !important; } .nomargin { margin: 0 !important; } .nomargin--bottom { margin-bottom: 0 !important; } .nomargin--top { margin-top: 0 !important; } .nomargin--left { margin-left: 0 !important; } .nomargin--right { margin-right: 0 !important; } .nopadding { padding: 0 !important; } .nopadding--bottom { padding-bottom: 0 !important; } .nopadding--top { padding-top: 0 !important; } .nopadding--left { padding-left: 0 !important; } .nopadding--right { padding-right: 0 !important; } .noborder--right { border-right: none !important; } .no-radius { border-radius: 0 !important; } .align--left { text-align: left !important; } .align--right { text-align: right !important; } .align--center { text-align: center !important; } .no--bg { background: none !important; } .transition--none { -webkit-transition: none; -moz-transition: none; -o-transition: none; transition: none; } .remove--bottom { margin-bottom: 0; } .half--bottom { margin-bottom: 10px; } .add--bottom { margin-bottom: 20px; } .fl { float: left; } .fr { float: right; } .fn { float: none; } .align--left { text-align: left; } .align--right { text-align: right; } .align--center { margin: 0 auto; text-align: center; } .gap { height: 15px; clear: both; display: table; } .padding20 { padding: 20px; } .link { color: inherit; } .link--primary { color: #ccc; text-decoration: underline; } .link--normal { color: #999; font-weight: 500; } .link--normal:hover { color: #ccc; } .link--arrow { display: inline-block; line-height: 1; color: #ccc; font-weight: 400; position: relative; text-decoration: underline; padding: 0 10px 0 0; } .link--arrow:before { border-right: 2px solid #ccc; border-top: 2px solid #ccc; content: ""; display: inline-block; height: 7px; margin: 0 0 0 8px; position: absolute; right: 0; top: 5px; transform: rotate(45deg); -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); vertical-align: middle; width: 7px; } .link--arrow:hover, .link--arrow:hover:before { color: #555555; border-color: #555555; } .text--bold { font-weight: 700; } .text--uppercase { text-transform: uppercase; } .text--dark { color: #555555; } .text--light { opacity: 0.3; font-weight: normal; } .text--small { opacity: 0.4; font-style: italic; font-size: 95%; } .text--block { display: block; } .text--normal { color: #999; } .text--normal a { color: #333; } .text--normal a:hover { text-decoration: underline; } .text--normal a .fa { opacity: 0.3; margin: 0 5px 0 0; } .text--normal-primary { color: #24b26b !important; } .text--normal-secondary { color: #f15c5c !important; } .list__socials li { display: inline-block; vertical-align: top; padding: 0 0 0 0; color: #999; line-height: 30px; } .list__socials li:first-child { padding-right: 10px; } .list__socials li a { font-size: 1.1em; color: inherit; width: 30px; border: 1px solid transparent; height: 30px; display: block; border-radius: 100%; line-height: 28px; text-align: center; } .list__socials li a:hover { border-color: inherit; } .list__socials li.social--fb { color: #3b5998; } .list__socials li.social--tw { color: #55acee; } .list__socials li.social--pt { color: #cb2027; } .list__socials li.social--li { color: #0177b5; } .list__socials li.social--gp { color: #d95232; } .list__socials--filled li.social--fb a { background: #3b5998; color: #fff; } .list__socials--filled li.social--tw a { background: #55acee; color: #fff; } .list__socials--filled li.social--pt a { background: #cb2027; color: #fff; } .list__socials--filled li.social--li a { background: #0177b5; color: #fff; } .list__socials--filled li.social--gp a { background: #d95232; color: #fff; } .hidden { display: none; } .inviso { display: none; } .highlighted { color: #211922; background-color: #ff0; } .inline--block { display: inline-block; vertical-align: middle; } .noFloat { float: none; } .noState:hover { background-color: transparent; } .noState:active { color: #221919; } .border { border: 1px solid #b8c3cd; } .border-top { border-top: 1px solid #b8c3cd; } .border-right { border-right: 1px solid #b8c3cd; } .border-bottom { border-bottom: 1px solid #b8c3cd; } .border-left { border-left: 1px solid #b8c3cd; } .invisible { visibility: hidden; } .red { color: red; } .noscroll { overflow: hidden; } .divider { height: 1px; background: #e9e9e9; margin: 15px 0; } .border-bottom { border-bottom: solid 1px #ccc; height: 1px; } .img-responsive { max-width: 100%; } .text--bold { font-weight: 700; } .text--uppercase { text-transform: uppercase; } .text--dark { color: #555555; } .text--light { opacity: 0.3; font-weight: normal; } .text--small { opacity: 0.4; font-style: italic; font-size: 95%; } .text--block { display: block; } .text--normal { color: #999; } .text--normal a { color: #333; } .text--normal a:hover { text-decoration: underline; } .text--normal a .fa { opacity: 0.3; margin: 0 5px 0 0; } .text--normal-primary {} .text--normal-secondary { color: #f15c5c !important; } .loader-wrapper { position: relative; } .loader { position: absolute; top: 50%; left: 50%; margin: -7px 0 0 -55px; width: 110px; height: 14px; } .circle { width: 10px; height: 10px; border-radius: 14px; border: 2px solid var(--first-color); margin: 10px 5px; animation: rotate 2s infinite linear; animation-fill-mode: both; display: inline-block; } .circle:nth-of-type(2) { animation: rotate2 2s infinite linear; animation-fill-mode: both; } .circle:nth-of-type(3) { animation: rotate3 2s infinite linear; animation-fill-mode: both; } @keyframes rotate { 0% { transform: scale(0); opacity: 0; } 25% { transform: scale(1); opacity: 1; } 75% { transform: scale(1); opacity: 1; } 85% { transform: scale(1); opacity: 1; } 100% { transform: scale(1); opacity: 0; } } @keyframes rotate2 { 0% { transform: scale(0); opacity: 0; } 25% { transform: scale(0); opacity: 0; } 50% { transform: scale(1); opacity: 1; } 75% { transform: scale(1); opacity: 1; } 85% { transform: scale(1); opacity: 1; } 100% { transform: scale(1); opacity: 0; } } @keyframes rotate3 { 0% { transform: scale(0); opacity: 0; } 50% { transform: scale(0); opacity: 0; } 75% { transform: scale(1); opacity: 1; } 85% { transform: scale(1); opacity: 1; } 100% { transform: scale(1); opacity: 0; } } .clearfix.row {} .clearfix:before, .row:before, .clearfix:after, .row:after { content: ""; display: table; line-height: 0; } .clearfix:after, .row:after { clear: both; } /* You can also use a <br class="clear" /> to clear columns */ .clear { clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; } .container-fluid { padding-right: 20px; padding-left: 20px; margin-right: auto; margin-left: auto; } /*grid*/ .container--fluid { width: 100%; } .row:before, .row:after { content: " "; display: table; } .row:after { clear: both; } .row { margin-right: -15px; margin-left: -15px; } .row:after, .fixed-container:after { clear: both; content: ""; display: block; height: 0; visibility: hidden; } .fixed-container { max-width: 1450px; padding: 0 15px; margin: 0 auto; } .col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 { position: relative; min-height: 1px; padding-left: 15px; padding-right: 15px; } .col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 { float: left; } .col-xs-12 { width: 100%; } .col-xs-11 { width: 91.66666667%; } .col-xs-10 { width: 83.33333333%; } .col-xs-9 { width: 75%; } .col-xs-8 { width: 66.66666667%; } .col-xs-7 { width: 58.33333333%; } .col-xs-6 { width: 50%; } .col-xs-5 { width: 41.66666667%; } .col-xs-4 { width: 33.33333333%; } .col-xs-3 { width: 25%; } .col-xs-2 { width: 16.66666667%; } .col-xs-1 { width: 8.33333333%; } @media (min-width: 768px) { .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 { float: left; } .col-sm-12 { width: 100%; } .col-sm-11 { width: 91.66666667%; } .col-sm-10 { width: 83.33333333%; } .col-sm-9 { width: 75%; } .col-sm-8 { width: 66.66666667%; } .col-sm-7 { width: 58.33333333%; } .col-sm-6 { width: 50%; } .col-sm-5 { width: 41.66666667%; } .col-sm-4 { width: 33.33333333%; } .col-sm-3 { width: 25%; } .col-sm-2 { width: 16.66666667%; } .col-sm-1 { width: 8.33333333%; } } @media (min-width: 992px) { .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 { float: left; } .col-md-12 { width: 100%; } .col-md-11 { width: 91.66666667%; } .col-md-10 { width: 83.33333333%; } .col-md-9 { width: 75%; } .col-md-8 { width: 66.66666667%; } .col-md-7 { width: 58.33333333%; } .col-md-6 { width: 50%; } .col-md-5 { width: 41.66666667%; } .col-md-4 { width: 33.33333333%; } .col-md-3 { width: 25%; } .col-md-2 { width: 16.66666667%; } .col-md-1 { width: 8.33333333%; } } @media (min-width: 1200px) { .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 { float: left; } .col-lg-12 { width: 100%; } .col-lg-11 { width: 91.66666667%; } .col-lg-10 { width: 83.33333333%; } .col-lg-9 { width: 75%; } .col-lg-8 { width: 66.66666667%; } .col-lg-7 { width: 58.33333333%; } .col-lg-6 { width: 50%; } .col-lg-5 { width: 41.66666667%; } .col-lg-4 { width: 33.33333333%; } .col-lg-3 { width: 25%; } .col-lg-2 { width: 16.66666667%; } .col-lg-1 { width: 8.33333333%; } } .row.no-gutter, .no-gutter { margin-left: 0; margin-right: 0; } .column { margin-bottom: 15px; } .float-left { float: left; } .float-right { float: right; } .text-left { text-align: left; } .text-right { text-align: right; } .text-center { text-align: center; } /* Set Margins and gaps*/ .marginTop_medium { margin-top: 15px; } .marginTop_small { margin-top: 10px; } .marginTop_minismall { margin-top: 5px; } .section_space { padding: 35px 0 0; } .sectionboth_space { padding: 35px 0; } .insidespace_top { padding-top: 35px; } .insidespace_bottom { padding-bottom: 35px; } .mobile-thead { display: none; } .pull-right { float: right; text-align: right; } .pull-left { text-align: left; float: left; } /*Effects*/ .transition-none { -webkit-transition: none; -moz-transition: none; -o-transition: none; transition: none; } /*Set clear*/ .clearfix:after { clear: both; display: block; content: ""; } img { max-width: 100%; display: block; } /*Base CSS end here*/ [ripple] { z-index: 1; position: relative; overflow: hidden; } [ripple] .ripple { position: absolute; background: #FFFFFF; width: 12px; height: 12px; border-radius: 100%; -webkit-animation: ripple 1.6s; animation: ripple 1.6s; } @-webkit-keyframes ripple { 0% { -webkit-transform: scale(1); transform: scale(1); opacity: 0.2; } 100% { -webkit-transform: scale(40); transform: scale(40); opacity: 0; } } @keyframes ripple { 0% { -webkit-transform: scale(1); transform: scale(1); opacity: 0.2; } 100% { -webkit-transform: scale(40); transform: scale(40); opacity: 0; } } /*Short codes*/ /*btn*/ .btn, .form input[type="submit"], .form input[type="button"], .form input[type="reset"] { position: relative; display: inline-block; margin-bottom: 0; font-weight: normal; text-align: center; vertical-align: bottom; touch-action: manipulation; cursor: pointer; background-image: none; border: solid 1px transparent; white-space: nowrap; padding: 0 20px; height: 40px; font-size: 0.875em; line-height: 40px; color: #fff; background: none; border-radius: 2px; } .btn .txt, .form input[type="button"] span, .form button[type="button"] span { color: #fff; } .form input[type="submit"], .form input[type="button"] { border: solid 1px transparent; } .btn:hover, .btn:focus, .btn.focus, .form input[type="submit"]:hover, .form input[type="submit"]:focus, .form input[type="submit"].focus, .form input[type="button"]:hover, .form input[type="button"]:focus, .form input[type="button"].focus { text-decoration: none; } .btn:active, .btn.active, .form input[type="submit"]:active, .form input[type="submit"].active, .form input[type="button"]:active, .form input[type="button"].active { outline: 0; background-image: none; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2); } .btn.disabled, .btn[disabled], fieldset[disabled] .btn, .form input[type="submit"].disabled, .form input[type="submit"][disabled], fieldset[disabled] .form input[type="submit"], .form input[type="button"].disabled, .form input[type="button"][disabled], fieldset[disabled] .form input[type="button"] { cursor: not-allowed; opacity: 0.65; filter: alpha(opacity=65); -webkit-box-shadow: none; box-shadow: none; } a.btn.disabled, fieldset[disabled] a.btn { pointer-events: none; } .invalid { -webkit-animation: moltinShake .4s ease-in-out .1s normal forwards 1 running; animation: moltinShake .4s ease-in-out .1s normal forwards 1 running } @-webkit-keyframes moltinShake { 12.5% { -webkit-transform: translateX(-6px) rotateY(-5deg); transform: translateX(-6px) rotateY(-5deg) } 37.5% { -webkit-transform: translateX(5px) rotateY(4deg); transform: translateX(5px) rotateY(4deg) } 62.5% { -webkit-transform: translateX(-3px) rotateY(-2deg); transform: translateX(-3px) rotateY(-2deg) } 87.5% { -webkit-transform: translateX(2px) rotateY(1deg); transform: translateX(2px) rotateY(1deg) } 100% { -webkit-transform: translateX(0); transform: translateX(0) } } @keyframes moltinShake { 12.5% { -webkit-transform: translateX(-6px) rotateY(-5deg); transform: translateX(-6px) rotateY(-5deg) } 37.5% { -webkit-transform: translateX(5px) rotateY(4deg); transform: translateX(5px) rotateY(4deg) } 62.5% { -webkit-transform: translateX(-3px) rotateY(-2deg); transform: translateX(-3px) rotateY(-2deg) } 87.5% { -webkit-transform: translateX(2px) rotateY(1deg); transform: translateX(2px) rotateY(1deg) } 100% { -webkit-transform: translateX(0); transform: translateX(0) } } /*default */ .btn--default { color: #ccc; background-color: #fff; border-color: #ccc; border: 1px solid #ddd; } .btn--default:focus, .btn--default.focus { color: #ccc; background-color: #e6e6e6; border-color: #8c8c8c; } .btn--default:hover { background-color: #e6e6e6; border-color: #adadad; } .btn--default:active, .btn--default.active, .open>.btn--default.dropdown-toggle { background-color: #e6e6e6; border-color: #adadad; } .btn--default:active:hover, .btn--default:active:focus, .btn--default:active.focus, .btn--default.active:hover, .btn--default.active:focus, .btn--default.active.focus, .open>.btn--default.dropdown-toggle:hover, .open>.btn--default.dropdown-toggle:focus, .open>.btn--default.dropdown-toggle.focus { background-color: #d4d4d4; border-color: #8c8c8c; } .btn--default:active, .btn--default.active, .open>.btn--default.dropdown-toggle { background-image: none; } .btn--default.disabled:hover, .btn--default.disabled:focus, .btn--default.disabled.focus, .btn--default[disabled]:hover, .btn--default[disabled]:focus, .btn--default[disabled].focus, fieldset[disabled] .btn--default:hover, fieldset[disabled] .btn--default:focus, fieldset[disabled] .btn--default.focus { background-color: #fff; border-color: #ccc; } .btn--default .badge { color: #fff; } /*primary*/ input[type="submit"].btn--primary, .btn--primary { background: var(--first-color); color: #fff; } input[type="submit"].btn--border, .btn--border { border-color: #284a5c; color: #393e4a; } .btn--primary:focus, .btn--primary.focus, .form input[type="submit"]:focus, .form input[type="submit"].focus {} .btn--primary:hover, .form input[type="submit"]:hover {} .btn--primary:active:hover, .btn--primary:active:focus, .btn--primary:active.focus, .btn--primary.active:hover, .btn--primary.active:focus, .btn--primary.active.focus, .open>.btn--primary.dropdown-toggle:hover, .open>.btn--primary.dropdown-toggle:focus, .open>.btn--primary.dropdown-toggle.focus, .form input[type="submit"]:active:hover, .form input[type="submit"]:active:focus, .form input[type="submit"]:active.focus, .form input[type="submit"].active:hover, .form input[type="submit"].active:focus, .form input[type="submit"].active.focus, .open>.form input[type="submit"].dropdown-toggle:hover, .open>.form input[type="submit"].dropdown-toggle:focus, .open>.form input[type="submit"].dropdown-toggle.focus {} .btn--primary:active, .btn--primary.active, .open>.btn--primary.dropdown-toggle, .form input[type="submit"]:active, .form input[type="submit"].active, .open>.form input[type="submit"].dropdown-toggle { background-image: none; } .btn--primary.disabled:hover, .btn--primary.disabled:focus, .btn--primary.disabled.focus, .btn--primary[disabled]:hover, .btn--primary[disabled]:focus, .btn--primary[disabled].focus, fieldset[disabled] .btn--primary:hover, fieldset[disabled] .btn--primary:focus, fieldset[disabled] .btn--primary.focus, .form input[type="submit"].disabled:hover, .form input[type="submit"].disabled:focus, .form input[type="submit"].disabled.focus, .form input[type="submit"][disabled]:hover, .form input[type="submit"][disabled]:focus, .form input[type="submit"][disabled].focus, fieldset[disabled] .form input[type="submit"]:hover, fieldset[disabled] .form input[type="submit"]:focus, fieldset[disabled] .form input[type="submit"].focus {} .btn--primary .badge, .form input[type="submit"] .badge { color: #ccc; background-color: #fff; } /*success*/ .btn--success { color: #fff; background-color: #5cb85c; border-color: #4cae4c; } .btn--success:focus, .btn--success.focus { color: #fff; background-color: #449d44; border-color: #255625; } .btn--success:hover { color: #fff; background-color: #449d44; border-color: #398439; } .btn--success:active, .btn--success.active, .open>.btn--success.dropdown-toggle { color: #fff; background-color: #449d44; border-color: #398439; } .btn--success:active:hover, .btn--success:active:focus, .btn--success:active.focus, .btn--success.active:hover, .btn--success.active:focus, .btn--success.active.focus, .open>.btn--success.dropdown-toggle:hover, .open>.btn--success.dropdown-toggle:focus, .open>.btn--success.dropdown-toggle.focus { color: #fff; background-color: #398439; border-color: #255625; } .btn--success:active, .btn--success.active, .open>.btn--success.dropdown-toggle { background-image: none; } .btn--success.disabled:hover, .btn--success.disabled:focus, .btn--success.disabled.focus, .btn--success[disabled]:hover, .btn--success[disabled]:focus, .btn--success[disabled].focus, fieldset[disabled] .btn--success:hover, fieldset[disabled] .btn--success:focus, fieldset[disabled] .btn--success.focus { background-color: #5cb85c; border-color: #4cae4c; } .btn--success .badge { color: #5cb85c; background-color: #fff; } /*info*/ .btn--info { color: #fff; background-color: #237dbb; border-color: #1f6fa6; } .btn--info:focus, .btn--info.focus { color: #fff; background-color: #1b6090; border-color: #0b273a; } .btn--info:hover { color: #fff; background-color: #1b6090; border-color: #154c72; } .btn--info:active, .btn--info.active, .open>.btn--info.dropdown-toggle { color: #fff; background-color: #1b6090; border-color: #154c72; } .btn--info:active:hover, .btn--info:active:focus, .btn--info:active.focus, .btn--info.active:hover, .btn--info.active:focus, .btn--info.active.focus, .open>.btn--info.dropdown-toggle:hover, .open>.btn--info.dropdown-toggle:focus, .open>.btn--info.dropdown-toggle.focus { color: #fff; background-color: #154c72; border-color: #0b273a; } .btn--info:active, .btn--info.active, .open>.btn--info.dropdown-toggle { background-image: none; } .btn--info.disabled:hover, .btn--info.disabled:focus, .btn--info.disabled.focus, .btn--info[disabled]:hover, .btn--info[disabled]:focus, .btn--info[disabled].focus, fieldset[disabled] .btn--info:hover, fieldset[disabled] .btn--info:focus, fieldset[disabled] .btn--info.focus { background-color: #237dbb; border-color: #1f6fa6; } .btn--info .badge { color: #237dbb; background-color: #fff; } .btn--info:hover {} /*warning*/ .btn--warning { color: #fff; background-color: #f0ad4e; border-color: #eea236; } .btn--warning:focus, .btn--warning.focus { color: #fff; background-color: #ec971f; border-color: #985f0d; } .btn--warning:hover { color: #fff; background-color: #ec971f; border-color: #d58512; } .btn--warning:active, .btn--warning.active, .open>.btn--warning.dropdown-toggle { color: #fff; background-color: #ec971f; border-color: #d58512; } .btn--warning:active:hover, .btn--warning:active:focus, .btn--warning:active.focus, .btn--warning.active:hover, .btn--warning.active:focus, .btn--warning.active.focus, .open>.btn--warning.dropdown-toggle:hover, .open>.btn--warning.dropdown-toggle:focus, .open>.btn--warning.dropdown-toggle.focus { color: #fff; background-color: #d58512; border-color: #985f0d; } .btn--warning:active, .btn--warning.active, .open>.btn--warning.dropdown-toggle { background-image: none; } .btn--warning.disabled:hover, .btn--warning.disabled:focus, .btn--warning.disabled.focus, .btn--warning[disabled]:hover, .btn--warning[disabled]:focus, .btn--warning[disabled].focus, fieldset[disabled] .btn--warning:hover, fieldset[disabled] .btn--warning:focus, fieldset[disabled] .btn--warning.focus { background-color: #f0ad4e; border-color: #eea236; } .btn--warning .badge { color: #f0ad4e; background-color: #fff; } /*danger*/ .btn--danger { color: #fff; background-color: #f15c5c; border-color: #ef4545; } .btn--danger:focus, .btn--danger.focus { color: #fff; background-color: #ed2d2d; border-color: #a60e0e; } .btn--danger:hover { color: #fff; background-color: #ed2d2d; border-color: #e31313; } .btn--danger:active, .btn--danger.active, .open>.btn--danger.dropdown-toggle { color: #fff; background-color: #ed2d2d; border-color: #e31313; } .btn--danger:active:hover, .btn--danger:active:focus, .btn--danger:active.focus, .btn--danger.active:hover, .btn--danger.active:focus, .btn--danger.active.focus, .open>.btn--danger.dropdown-toggle:hover, .open>.btn--danger.dropdown-toggle:focus, .open>.btn--danger.dropdown-toggle.focus { color: #fff; background-color: #e31313; border-color: #a60e0e; } .btn--danger:active, .btn--danger.active, .open>.btn--danger.dropdown-toggle { background-image: none; } .btn--danger.disabled:hover, .btn--danger.disabled:focus, .btn--danger.disabled.focus, .btn--danger[disabled]:hover, .btn--danger[disabled]:focus, .btn--danger[disabled].focus, fieldset[disabled] .btn--danger:hover, fieldset[disabled] .btn--danger:focus, fieldset[disabled] .btn--danger.focus { background-color: #f15c5c; border-color: #ef4545; } .btn--danger .badge { color: #f15c5c; background-color: #fff; } /*secondary */ .btn--secondary, .form input[type="button"] { color: #fff; background-color: var(--second-color); } .btn--secondary:focus, .btn--secondary.focus, .form input[type="button"]:focus, .form input[type="button"].focus {} .btn--secondary:hover, .form input[type="button"]:hover { background-color: ; } .btn--secondary:active, .btn--secondary.active, .open>.btn--secondary.dropdown-toggle, .form input[type="button"]:active, .form input[type="button"].active, .open>.form input[type="button"].dropdown-toggle {} .btn--secondary:active, .btn--secondary.active, .open>.btn--secondary.dropdown-toggle, .form input[type="button"]:active, .form input[type="button"].active, .open>.form input[type="button"].dropdown-toggle { background-image: none; } .btn--secondary.disabled:hover, .btn--secondary.disabled:focus, .btn--secondary.disabled.focus, .btn--secondary[disabled]:hover, .btn--secondary[disabled]:focus, .btn--secondary[disabled].focus, fieldset[disabled] .btn--secondary:hover, fieldset[disabled] .btn--secondary:focus, fieldset[disabled] .btn--secondary.focus, .form input[type="button"].disabled:hover, .form input[type="button"].disabled:focus, .form input[type="button"].disabled.focus, .form input[type="button"][disabled]:hover, .form input[type="button"][disabled]:focus, .form input[type="button"][disabled].focus, fieldset[disabled] .form input[type="button"]:hover, fieldset[disabled] .form input[type="button"]:focus, fieldset[disabled] .form input[type="button"].focus { background-color: #f15c5c; border-color: #ef4545; } .btn--secondary .badge, .form input[type="button"] .badge { color: #f15c5c; background-color: #fff; } .btn--secondary:hover, .form input[type="button"]:hover {} /*third */ .btn--third, .form input[type="button"], .form input[type="reset"] { color: #fff; background-color: #49484d; } .btn--third:focus, .btn--third.focus, .form input[type="button"]:focus, .form input[type="button"].focus {} .btn--third:hover, .form input[type="button"]:hover { background-color: var(--first-color); } .btn--third:active, .btn--third.active, .open>.btn--third.dropdown-toggle, .form input[type="button"]:active, .form input[type="button"].active, .open>.form input[type="button"].dropdown-toggle {} .btn--third:active, .btn--third.active, .open>.btn--third.dropdown-toggle, .form input[type="button"]:active, .form input[type="button"].active, .open>.form input[type="button"].dropdown-toggle { background-image: none; } .btn--third.disabled:hover, .btn--third.disabled:focus, .btn--third.disabled.focus, .btn--third[disabled]:hover, .btn--third[disabled]:focus, .btn--third[disabled].focus, fieldset[disabled] .btn--third:hover, fieldset[disabled] .btn--third:focus, fieldset[disabled] .btn--third.focus, .form input[type="button"].disabled:hover, .form input[type="button"].disabled:focus, .form input[type="button"].disabled.focus, .form input[type="button"][disabled]:hover, .form input[type="button"][disabled]:focus, .form input[type="button"][disabled].focus, fieldset[disabled] .form input[type="button"]:hover, fieldset[disabled] .form input[type="button"]:focus, fieldset[disabled] .form input[type="button"].focus { background-color: #ccc; border-color: #ccc; } .btn--third .badge, .form input[type="button"] .badge { color: #f15c5c; background-color: #fff; } .btn--third:hover, .form input[type="button"]:hover {} /*black*/ .btn--black { color: #fff; background-color: #000; border-color: black; } .btn--black:focus, .btn--black.focus { color: #fff; background-color: black; border-color: black; } .btn--black:hover { color: #fff; background-color: black; border-color: black; } .btn--black:active, .btn--black.active, .open>.btn--black.dropdown-toggle { color: #fff; background-color: black; border-color: black; } .btn--black:active:hover, .btn--black:active:focus, .btn--black:active.focus, .btn--black.active:hover, .btn--black.active:focus, .btn--black.active.focus, .open>.btn--black.dropdown-toggle:hover, .open>.btn--black.dropdown-toggle:focus, .open>.btn--black.dropdown-toggle.focus { color: #fff; background-color: black; border-color: black; } .btn--black:active, .btn--black.active, .open>.btn--black.dropdown-toggle { background-image: none; } .btn--black.disabled:hover, .btn--black.disabled:focus, .btn--black.disabled.focus, .btn--black[disabled]:hover, .btn--black[disabled]:focus, .btn--black[disabled].focus, fieldset[disabled] .btn--black:hover, fieldset[disabled] .btn--black:focus, fieldset[disabled] .btn--black.focus { background-color: #000; border-color: black; } .btn--black .badge { color: #000; background-color: #fff; } .btn--black:hover {} .btn--gray { color: #000; background-color: #ccc; border-color: #ccc; } .btn--gray:focus, .btn--gray.focus { color: #fff; background-color: #c1c1c1; } .btn--gray:hover { border-color: #c1c1c1; } .btn--gray:active, .btn--gray.active, .open>.btn--gray.dropdown-toggle {} .btn--gray:active:hover, .btn--gray:active:focus, .btn--gray:active.focus, .btn--gray.active:hover, .btn--gray.active:focus, .btn--gray.active.focus, .open>.btn--gray.dropdown-toggle:hover, .open>.btn--gray.dropdown-toggle:focus, .open>.btn--gray.dropdown-toggle.focus {} .btn--gray:active, .btn--gray.active, .open>.btn--gray.dropdown-toggle { background-image: none; } .btn--gray.disabled:hover, .btn--gray.disabled:focus, .btn--gray.disabled.focus, .btn--gray[disabled]:hover, .btn--gray[disabled]:focus, .btn--gray[disabled].focus, fieldset[disabled] .btn--gray:hover, fieldset[disabled] .btn--gray:focus, fieldset[disabled] .btn--gray.focus { background-color: #dadada; } .btn--gray .badge { color: #dadada; background-color: #fff; } .btn--gray:hover {} .btn--link { color: #ccc; font-size: 0.8em; font-weight: normal; } .btn--link, .btn--link:active, .btn--link.active, .btn--link[disabled], fieldset[disabled] .btn--link { background-color: transparent; -webkit-box-shadow: none; box-shadow: none; } .btn--link, .btn--link:hover, .btn--link:focus, .btn--link:active { border-color: transparent; } .btn--link:hover, .btn--link:focus { color: inherit; text-decoration: underline; background-color: transparent; } .btn--link[disabled]:hover, .btn--link[disabled]:focus, fieldset[disabled] .btn--link:hover, fieldset[disabled] .btn--link:focus { color: #e7e7e7; text-decoration: none; } .btn--white { background: #fff; color: #999; font-weight: normal; text-align: center; vertical-align: middle; touch-action: manipulation; cursor: pointer; background-image: none; border: 1px solid #ccc; font-weight: 500; white-space: nowrap; padding: 10px 20px; font-size: 14px; line-height: 1.42857; } .btn--white:hover, .btn--white:active, .btn--white:focus { background: #fff; color: #999; } .btn--lg { padding: 10px 16px; font-size: 18px; line-height: 1.33333; } .btn--sm, .btn--sm.btn--white, .form input[type="submit"].btn--sm, .form input[type="button"].btn--sm { padding: 5px 10px; font-size: 12px; line-height: 1.5; } .btn--xs { padding: 1px 5px; font-size: 12px; line-height: 1.5; } .btn--h-large { min-width: 170px; } .btn--block { display: block; width: 100%; } .btn--block+.btn--block { margin-top: 5px; } input[type="submit"].btn-block, input[type="reset"].btn-block, input[type="button"].btn-block { width: 100%; } /**/ /* form ---------------------- */ .form label { display: block; margin-bottom: 10px; font-size: 0.875em; color: #000; } .form fieldset { margin-bottom: 15px; } input::-moz-focus-inner { border: 0; padding: 0; } textarea { resize: vertical; line-height: 1.5; } input, select, textarea { outline: none; font-family: inherit; -webkit-transition: 0.3s all ease-in-out; -moz-transition: 0.3s all ease-in-out; -o-transition: 0.3s all ease-in-out; transition: 0.3s all ease-in-out; } input[type="submit"], input[type="button"] { -webkit-appearance: none; } input[type="text"], input[type="password"], textarea, select { -webkit-appearance: none; -moz-appearance: none; appearance: none; } input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill { background: transparent !important; } select::-ms-expand { display: none; } input[type="text"], input[type="email"], input[type="phone"], input[type="search"], input[type="password"], textarea, select, input[type="number"], input[type="file"] { background-color: #fff; border: 1px solid var(--border-color); height: 40px; line-height: 40px; padding: 0 10px; width: 100%; color: #999; font-family: inherit; font-size: 0.875em; font-weight: normal; } input[type="text"]:focus, input[type="email"]:focus, input[type="phone"]:focus, input[type="search"]:focus, input[type="password"]:focus, textarea:focus, select:focus, input[type="number"]:focus, input[type="file"]:focus { border-color: rgba(243, 114, 66, 0.8); outline: 0; outline: thin dotted \9; } input[type="file"] { height: auto; padding: 8px 10px; } .form input[type="submit"] { margin: 0 0px 0 0; } select { padding-right: 30px; background-color: #fff; background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAFCAYAAAB8ZH1oAAAAI0lEQVQImWOYMmXKf2IwAwMDAwNRimCAKEW4FGNVhK4YXRwAe5JR6xMYuYgAAAAASUVORK5CYII=); background-repeat: no-repeat; background-position: calc(100% - 10px) center; font-size: 1em; } .field--calender { background-color: #fff; padding-right: 35px !important; background-image: url(images/icon--calender.svg); background-repeat: no-repeat; background-position: calc(100% - 10px) center; background-size: 15px; } textarea { height: 150px; padding: 10px 15px; line-height: 1.5; } .field-set { width: 100%; display: inline-block; margin: 0 0 20px; } .form__group { width: 100%; display: inline-block; margin: 15px 0 0; } .field_label { color: #ccc; display: block; margin: 0 0 5px 0; } .form--normal { margin: 20px 0; } .form--normal input[type="submit"] { min-width: 180px; text-transform: uppercase; /*font-weight: 700;*/ margin: 0 20px 0 0; } .mandatory, .spn_must_field { color: red; } .form--auto input, .form--auto select { width: auto; } /* radio and checkbox */ .checkbox, .radio { display: inline-block; color: #333; position: relative; vertical-align: top; padding: 0 0 0 24px; min-height: 15px; font-size: 0.85em; cursor: pointer; } .checkbox img, .radio img { display: inline-block; vertical-align: middle; } .checkbox input, .radio input { top: 0; left: 0; margin: 0 !important; z-index: 1; cursor: pointer; opacity: 0; filter: alpha(opacity=0); } .radio input[type="radio"], .radio-inline input[type="radio"], .checkbox input[type="checkbox"], .checkbox-inline input[type="checkbox"] { position: absolute; margin-left: -20px; margin-top: 4px \9; } .radio.disabled, .checkbox.disabled { cursor: not-allowed; } input[type="radio"][disabled], input[type="checkbox"][disabled], input[type="text"][disabled], input[type="password"][disabled] { cursor: not-allowed; opacity: 0.5; } input[type="text"][disabled], input[type="password"][disabled] { background: rgba(0, 0, 0, 0.03); } .inline.radio, .inline.checkbox { padding-right: 20px; } .checkbox .input-helper:before, .radio .input-helper:before, .checkbox .input-helper:after, .radio .input-helper:after { -webkit-transition: all; -o-transition: all; transition: all; -webkit-transition-duration: 250ms; transition-duration: 250ms; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; backface-visibility: hidden; position: absolute; content: ""; } .checkbox .input-helper:before, .radio .input-helper:before { left: 0; border: 1px solid #ccc; background: #fff; } .checkbox.disabled, .radio.disabled { opacity: 0.6; filter: alpha(opacity=60); } .checkbox input { width: 15px; height: 15px; } .checkbox input:checked+.input-helper:after { -webkit-transform: scale(1) rotate(-50deg); -ms-transform: scale(1) rotate(-50deg); -o-transform: scale(1) rotate(-50deg); transform: scale(1) rotate(-50deg); opacity: 1; filter: alpha(opacity=100); } .checkbox .input-helper:before { top: 2px; width: 15px; height: 15px; } .checkbox .input-helper:after { opacity: 0; filter: alpha(opacity=0); -webkit-transform: scale(0) rotate(80deg); -ms-transform: scale(0) rotate(80deg); -o-transform: scale(0) rotate(80deg); transform: scale(0) rotate(80deg); width: 9px; height: 5px; border-bottom: 2px solid var(--second-color); border-left: 2px solid var(--second-color); border-bottom-left-radius: 1px; left: 3px; top: 6px; } .radio input { width: 15px; height: 15px; } .radio input:checked+.input-helper:after { -webkit-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); } .radio .input-helper:before { top: 1px; width: 15px; height: 15px; border-radius: 50%; } .radio .input-helper:after { width: 7px; height: 7px; background: var(--second-color); border-radius: 50%; top: 5px; left: 4px; -webkit-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); } .form--shadow input[type="text"], .form--shadow select { box-shadow: 0 0 3px rgba(0, 0, 0, 0.1); border: none; } .form--inline { display: inline-block; vertical-align: top; } .form--inline label { font-size: 1em; font-weight: 500; } .form--inline li { display: inline-block; vertical-align: top; padding: 0 10px 0 0; text-align: left; } .form--inline li:last-child { padding-right: 0; } .form--inline .btn--white { display: none; } .form--inline .btn--white .fa { display: none; } .form--inline .field--sort .fa { display: none; } .form__cover { padding: 15px; background: #f5f5f5; border-radius: 3px; width: 100%; display: inline-block; } .form--horizontal .field-set { display: table; table-layout: fixed; } .form--horizontal .caption-wraper { display: table-cell; vertical-align: top; padding: 5px 0 0; width: 30%; } .form--horizontal .field-wraper { display: table-cell; vertical-align: top; width: 70%; } .form .text--small, .preview .text--small { opacity: 0.4; font-style: italic; font-size: 95%; } .labels--inline label { display: inline-block; line-height: 40px; height: 40px; padding: 0 20px 0 40px; background-color: #fff; border: 1px solid #ccc; margin: 0 10px 0 0; border-radius: 5px; } .labels--inline label .input-helper:before { top: 9px; left: 10px; } .labels--inline label .input-helper:after { top: 13px; left: 14px; } .labelgroup--vertical label { display: block; margin: 10px 0; } .labelgroup--horizontal label { display: inline-block; vertical-align: top; margin: 0 15px 0 0; } .radio--large { min-height: 26px; padding-left: 35px; line-height: 26px; } .radio--large input { width: 26px; height: 26px; } .radio--large .input-helper { width: 26px; height: 26px; position: absolute; border-radius: 4px; background: #ddd; left: 0; top: 0; box-shadow: 0 0 1px transparent, inset 0 0 0 3px transparent; -webkit-transition: 0.3s all; -moz-transition: 0.3s all; -o-transition: 0.3s all; transition: 0.1s all; } .radio--large .input-helper:after, .radio--large .input-helper:before { display: none; } .radio--large input:checked+.input-helper { box-shadow: 0 0 1px #666, inset 0 0 0 4px #fff; } .radio--custom { position: relative; display: inline-block; vertical-align: top; margin: 0 2px 2px 0; } .radio--custom input { opacity: 0; visibility: hidden; position: absolute; left: 0; right: 0; top: 0; bottom: 0; } .radio--custom input:checked+.input-txt { background: #f5f5f5; } .radio--custom .input-txt { border: 1px solid #ccc; padding: 10px; border-radius: 4px; display: inline-block; vertical-align: top; } .checkbox--positioned { position: absolute; right: 0px; top: 20px; z-index: 1; } .form--horizontal .field-set { display: table; table-layout: fixed; } .form--horizontal .caption-wraper { display: table-cell; vertical-align: top; padding: 5px 0 0; width: 30%; } .form--horizontal .field-wraper { display: table-cell; vertical-align: top; width: 70%; } .form small, .form .text--small, .preview .text--small { opacity: 0.8; font-style: italic; font-size: 80%; } .labels--inline label { display: inline-block; line-height: 40px; height: 40px; padding: 0 20px 0 40px; background-color: #fff; border: 1px solid #ccc; margin: 0 10px 0 0; border-radius: 5px; } .labels--inline label .input-helper:before { top: 9px; left: 10px; } .labels--inline label .input-helper:after { top: 13px; left: 14px; } .field--small { width: 60px !important; display: inline-block; vertical-align: top; } .field--normal { width: 120px !important; display: inline-block; vertical-align: top; } .field-set-gray { background: #f5f5f5; border-radius: 5px; padding: 15px; } .form--singlefield input[type="text"] { width: 70%; float: left; border-radius: 3px 0 0 3px; } .form--singlefield input[type="submit"] { width: 30%; float: left; margin: 0; border-radius: 0 3px 3px 0; padding: 10px; } .form--secondary input[type="submit"] { color: #fff; background-color: #f15c5c; border-color: #ef4545; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2YxNWM1YyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ViMTYxNiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f15c5c), color-stop(100%, #eb1616)); background-image: -moz-linear-gradient(top, #f15c5c, #eb1616); background-image: -webkit-linear-gradient(top, #f15c5c, #eb1616); background-image: linear-gradient(to bottom, #f15c5c, #eb1616); } .form--secondary input[type="submit"]:focus, .form--secondary input[type="submit"].focus { color: #fff; background-color: #ed2d2d; border-color: #a60e0e; } .form--secondary input[type="submit"]:hover { color: #fff; background-color: #ed2d2d; border-color: #e31313; } .form--secondary input[type="submit"]:active, .form--secondary input[type="submit"].active, .open>.form--secondary input[type="submit"].dropdown-toggle { color: #fff; background-color: #ed2d2d; border-color: #e31313; } .form--secondary input[type="submit"]:active:hover, .form--secondary input[type="submit"]:active:focus, .form--secondary input[type="submit"]:active.focus, .form--secondary input[type="submit"].active:hover, .form--secondary input[type="submit"].active:focus, .form--secondary input[type="submit"].active.focus, .open>.form--secondary input[type="submit"].dropdown-toggle:hover, .open>.form--secondary input[type="submit"].dropdown-toggle:focus, .open>.form--secondary input[type="submit"].dropdown-toggle.focus { color: #fff; background-color: #e31313; border-color: #a60e0e; } .form--secondary input[type="submit"]:active, .form--secondary input[type="submit"].active, .open>.form--secondary input[type="submit"].dropdown-toggle { background-image: none; } .form--secondary input[type="submit"].disabled:hover, .form--secondary input[type="submit"].disabled:focus, .form--secondary input[type="submit"].disabled.focus, .form--secondary input[type="submit"][disabled]:hover, .form--secondary input[type="submit"][disabled]:focus, .form--secondary input[type="submit"][disabled].focus, fieldset[disabled] .form--secondary input[type="submit"]:hover, fieldset[disabled] .form--secondary input[type="submit"]:focus, fieldset[disabled] .form--secondary input[type="submit"].focus { background-color: #f15c5c; border-color: #ef4545; } .form--secondary input[type="submit"] .badge { color: #f15c5c; background-color: #fff; } .form--secondary input[type="submit"]:hover { background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjEuMCIgeDI9IjAuNSIgeTI9IjAuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2YxNWM1YyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ViMTYxNiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0%, #f15c5c), color-stop(100%, #eb1616)); background-image: -moz-linear-gradient(bottom, #f15c5c, #eb1616); background-image: -webkit-linear-gradient(bottom, #f15c5c, #eb1616); background-image: linear-gradient(to top, #f15c5c, #eb1616); } .form--secondary input[type="text"]:focus { box-shadow: none; } /* tablet ---------------------- */ @media (max-width: 1050px) { .form--inline .btn--white { display: block; } .form--inline .btn--white .fa { display: inline-block; } } /* ipad ---------------------- */ @media (min-width: 991px) and (max-width: 1050px) { .form--singlefield input[type="text"] { width: 60%; } .form--singlefield input[type="submit"] { width: 40%; } } /* tablet ---------------------- */ /* mobile ---------------------- */ @media (max-width: 767px) { .form--normal { margin: 0 0 20px 0; } .field-set { margin: 5px 0; } .form--normal input[type="submit"] { min-width: 1%; } .form--inline { margin: 0 -10px; display: block; } .form--inline ul { display: table; table-layout: fixed; width: 100%; vertical-align: top; } .form--inline li { display: table-cell; vertical-align: top; padding: 0 10px; text-align: left; } .form--inline li:last-child { padding-right: 10px; } .form--inline .btn--white { font-weight: normal; text-align: left; padding: 10px; display: block; } .form--inline .btn--white .fa { float: right; font-size: 1.1em; margin: 3px 0 0; display: inline-block; } .form--inline .field--sort { position: relative; } .form--inline .field--sort select { background-image: none; } .form--inline .field--sort .fa { position: absolute; right: 25px; top: 12px; font-size: 1.1em; color: #999; display: block; } .radio--custom .input-txt { padding: 6px 5px; } .form__cover textarea+p { padding-top: 10px; } .field--small, .field--normal { width: 100% !important; margin: 2px 0; } .form--horizontal .field-set { display: inline-block; table-layout: auto; } .form--horizontal .caption-wraper { display: block; padding: 5px 0 0; width: 100%; } .form--horizontal .field-wraper { display: block; width: 100%; } } @media (max-width: 467px) { .form--singlefield input[type="text"] { width: 56%; } .form--singlefield input[type="submit"] { width: 44%; font-size: 0.9em; } .block-on-mobile { display: block; width: 100%; } .block-on-mobile+.block-on-mobile { margin-top: 5px; } } /* paginations */ .pagination { display: inline-block; } .pagination.center { display: table; margin: 0 auto; } .pagination li { float: left; margin: 0 4px; } .pagination li a { background: #777; width: 30px; line-height: 31px; text-align: center; height: 30px; display: block; font-size: 1em; color: #fff; border: none; position: relative; overflow: hidden; border-radius: 50%; } .pagination li.selected a { background: var(--first-color); color: #fff; font-weight: 600; } .pagination li a:hover { color: #fff; background: var(--first-color); } .pagination li.disabled { opacity: 0.4; } .pagination li.disabled a { cursor: not-allowed; } .pagination li.prev a:before, .pagination li.prev--double a:before, .pagination li.prev--double a:after { width: 10px; height: 10px; border-left: 2px solid #fff; border-bottom: 2px solid #fff; position: absolute; left: 12px; top: 10px; content: ""; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .pagination li.prev--double a:before { left: 11px; } .pagination li.prev--double a:after { left: 19px; } .prev--double {} .pagination li.next a:before, .pagination li.next--double a:before, .pagination li.next--double a:after { width: 7px; height: 7px; border-right: 2px solid #fff; border-top: 2px solid #fff; position: absolute; left: 12px; top: 12px; content: ""; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .pagination li.next--double a:before { left: 7px; } .pagination li.next--double a:after { left: 12px; } .page-banner { background-position: center top; position: relative; height: 399px; color: #fff; background-repeat: no-repeat; } .page-banner:before { position: absolute; left: 0; right: 0; top: 0; bottom: 0; background: rgba(0, 0, 0, 0.5); content: ""; } .page-banner .banner-txt { max-width: 60%; margin: 0 auto; text-align: center; position: absolute; bottom: 60px; left: 0; right: 0; } .page-banner .banner-txt h1 { color: inherit; font-size: 3em; font-weight: 600; line-height: 1; } .page-banner .banner-txt h4 { color: inherit; font-size: 1.5em; display: block; } .container--cms p {} .container--cms .space { padding: 50px 0; } .container--cms ul { margin: 10px 0; } .container--cms ul li { position: relative; padding: 0 0 5px 15px; color: #999999; font-size: 1em; } .container--cms ul li:before { position: absolute; left: 0; top: 5px; content: ""; border-bottom: 5px solid transparent; border-top: 5px solid transparent; border-left: 5px solid #c5c5c5; } .container--cms ol { list-style: decimal; } .container--cms ol li { position: relative; padding: 0 0 15px 0; color: #666; margin: 0 0 0 15px; font-size: 1.1em; } .container--cms ol li a { color: inherit; } .bg--second { background: var(--second-color); color: #fff; } .bg--second * { color: inherit !important; } .bg--second a.btn--custom { border-color: #fff; color: inherit; border-width: 2px; } .boxcontainer { padding: 20px 0 20px; } .boxcontainer .box--gray { background: rgba(0, 0, 0, 0.04); position: relative; padding: 30px 40px 20px 210px; border-radius: 3px; margin: 20px 0 0; } .boxcontainer .box--gray .fa { position: absolute; left: 120px; top: 25px; font-size: 4em; color: #ccc; } .boxcontainer .box--gray p { color: #555555; margin: 0; } .boxcontainer .box--gray h3 { padding: 0 0 5px 0; } .boxcontainer .box--gray h3 a { color: inherit; } /*page loader*/ .no-js #loader { display: none; } .js #loader { display: block; position: absolute; left: 100px; top: 0; } .pageloader { position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 9999; background: #fff; } .round-wrapper { position: absolute; top: 0; left: 0; bottom: 0; right: 0; height: 65px; width: 25px; margin: auto; transform: rotate(90deg); } .round { width: 15px; height: 15px; margin: 5px; background: #ccc; border-radius: 50%; } @-webkit-keyframes loading { 0% {} 25% { transform: translateX(-100%); } 50% { transform: translateX(0); } 75% { transform: translateX(100%); } 100% { transform: translateX(0); } } .round:nth-child(1) { -webkit-animation: loading 1s infinite; -webkit-animation-delay: 0s; } .round:nth-child(2) { -webkit-animation: loading 1s infinite; -webkit-animation-delay: 0.5s; } .round:nth-child(3) { -webkit-animation: loading 1s infinite; } /*page loader end*/ /*gradient backgrounds*/ .backgrounds1 { background: url(images/bg-pattern.png), #7b4397; background: url(images/bg-pattern.png), -webkit-linear-gradient(to left, #7b4397, #dc2430); background: url(images/bg-pattern.png), linear-gradient(to left, #ae8027 21.85%, #dc20a8); } .backgrounds2 { background-color: #6C84E5; background: url(images/elements_header_background.png), linear-gradient(to right, rgba(249, 75, 113, 1), rgba(117, 109, 227, 1)); background-size: 300px 300px, auto; } .backgrounds3 { background: -webkit-linear-gradient(45deg, #CF78D4 0%, #F34883 50%, #447FE4 100%); background: linear-gradient(45deg, #CF78D4 0%, #F34883 50%, #447FE4 100%); content: ''; opacity: 0.65; } .fh5co-loader { position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 9999; background: url(images/loader.gif) center no-repeat #fff; } .js .animate-box { opacity: 0; } .block--empty img { display: inline-block; opacity: 0.2; } /* ============================================================ switch ============================================================ */ .switch-labels { position: absolute; margin-left: -9999px; visibility: hidden; } .switch-labels+.switch-handles { position: relative; cursor: pointer; outline: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } /* ============================================================ SWITCH 1 - ROUND ============================================================ */ .switch-labels+.switch-handles { display: inline-block; vertical-align: middle; margin: 0 8px 0 0; padding: 2px; width: 60px; height: 24px; background-color: #d7dadf; -webkit-border-radius: 60px; -moz-border-radius: 60px; -ms-border-radius: 60px; -o-border-radius: 60px; border-radius: 60px; } .switch-labels+.switch-handles:before, .switch-labels+.switch-handles:after { display: block; position: absolute; top: 0; left: 0; bottom: 0; content: ""; } .switch-labels+.switch-handles:before { right: 1px; background-color: #d7dadf; -webkit-border-radius: 60px; -moz-border-radius: 60px; -ms-border-radius: 60px; -o-border-radius: 60px; border-radius: 60px; -webkit-transition: background 0.4s; -moz-transition: background 0.4s; -o-transition: background 0.4s; transition: background 0.4s; } .switch-labels+.switch-handles:after { width: 24px; background-color: #fff; -webkit-border-radius: 100%; -moz-border-radius: 100%; -ms-border-radius: 100%; -o-border-radius: 100%; border-radius: 100%; -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); -webkit-transition: margin 0.4s; -moz-transition: margin 0.4s; -o-transition: margin 0.4s; transition: margin 0.4s; } .statustab.active .switch-labels+.switch-handles:before, .statustab .switch-labels:checked+.switch-handles:before { background-color: var(--first-color); } .statustab.active .switch-labels+.switch-handles:after, .statustab .switch-labels:checked+.switch-handles:after { margin-left: 36px; } /* dialog boxes */ .dialog_box_wrap { position: fixed; left: 0; top: 0; bottom: 0; right: 0; z-index: -1; opacity: 0; } .dialog_box_wrap.active { z-index: 99999; opacity: 1; } .dialog_overlay { background-color: black; /* IE8 */ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)"; /* IE8 */ background-color: rgba(0, 0, 0, 0.7); position: fixed; left: 0; right: 0; top: 0; bottom: 0; } .dialog_box { position: absolute; left: 50%; top: 50%; -ms-transform: translate(-50%, -50%); /* IE 9 */ -webkit-transform: translate(-50%, -50%); /* Chrome, Safari, Opera */ transform: translate(-50%, -50%); } .dialog_box_content { position: relative; border-radius: 5px; text-align: center; background-color: white; max-width: 500px; min-width: 500px; padding: 20px; } .dialog_box_content .close { width: 20px; height: 20px; position: absolute; right: 5px; top: 5px; text-align: center; line-height: 18px; } .dialog_box_content .close:before { content: "\f2d7"; font-family: "Ionicons"; font-size: 16px; color: rgba(0, 0, 0, 0.8); } .dialog_box_content .close:hover { background: #333; } .dialog_box_content .close:hover:before { color: #fff; } .dialog_box_wrap.active .dialog_box_content[data-animation=pop] { -webkit-animation: showSweetAlert 0.3s; animation: showSweetAlert 0.3s; } .dialog_box_wrap.active .dialog_box_content[data-animation=none] { -webkit-animation: none; animation: none; } /* * Animations */ @-webkit-keyframes showSweetAlert { 0% { transform: scale(0.7); -webkit-transform: scale(0.7); } 45% { transform: scale(1.05); -webkit-transform: scale(1.05); } 80% { transform: scale(0.95); -webkit-transform: scale(0.95); } 100% { transform: scale(1); -webkit-transform: scale(1); } } @keyframes showSweetAlert { 0% { transform: scale(0.7); -webkit-transform: scale(0.7); } 45% { transform: scale(1.05); -webkit-transform: scale(1.05); } 80% { transform: scale(0.95); -webkit-transform: scale(0.95); } 100% { transform: scale(1); -webkit-transform: scale(1); } } .dialogicon { display: table; margin: 0 auto; } .dialogicon .icon.green { color: #00bf6f; border: 2px solid #00bf6f; } .dialogicon .icon.red { color: #f25454; border: 2px solid #f25454; } .dialogicon .icon.orange { color: #eb8f34; border: 2px solid #eb8f34; } .dialogicon .icon { border-radius: 100%; display: block; height: 40px; margin: 0 auto 10px; position: relative; text-align: center; width: 40px; } .dialogicon .icon.orange:before { background: #eb8f34 none repeat scroll 0 0; } .dialogicon .icon.green:before { background: #00bf6f none repeat scroll 0 0; } .dialogicon .icon.red:before { background: #f25454 none repeat scroll 0 0; } .dialogicon .icon.orange:after { background: #eb8f34 none repeat scroll 0 0; } .dialogicon .icon.green:after { background: #00bf6f none repeat scroll 0 0; } .dialogicon .icon.red:after { background: #f25454 none repeat scroll 0 0; } .dialogicon .icon:before { border-radius: 5px; content: ""; height: 18px; left: 50%; margin: 0 0 0 -2px; position: absolute; top: 3px; width: 3px; } .dialogicon .icon:after { background: #eb8f34 none repeat scroll 0 0; border-radius: 3px; content: ""; height: 3px; left: 50%; margin: 0 0 0 -2px; position: absolute; top: 23px; width: 3px; } .dialogicon .icon { font-size: 120px; line-height: 1; } .lbl-date-time{ color: var(--first-color); padding-left: 10px; font-weight: 600; vertical-align: top; } .your-order tr td a {color:#000;} .buyer-feedback-cancel-textarea{height:62px} .section--navs { margin: 0 auto; float: none; text-align: center; } .overlay--nav { background-color: rgba(0, 0, 0, 0.7); bottom: 0; left: 0; position: fixed; right: 0; top: 0; z-index: 100; display: none; } .toggle--nav { display: none; } /* navigation css for desktop ---------------------- */ @media(min-width:1026px) { .section--navs { display: inline-block; vertical-align: top; } .navs--main { margin: 0; -webkit-transition: all ease .3s; -moz-transition: all ease .3s; -o-transition: all ease .3s; transition: all ease .3s; } .navs--main>ul { position: relative; display: inline-block; } .navs--main>ul>li { display: inline-block; position: relative; vertical-align: middle; margin: 0 18px; } .navs--main>ul>li.blank { width: 256px; margin: 0; padding: 0; } .navs--main>ul>li.blank:after { content: normal; } .navs--main>ul>li:after {} .navs--main>ul>li.dropdown>a {} .navs--main>ul>li:first-child { margin-left: 0; } .navs--main>ul>li:last-child { margin-right: 0; } .navs--main>ul>li>a { font-weight: 500; z-index: 1; color: #fff; display: block; font-size: 1em; padding: 0px 0px; line-height: 1; position: relative; text-align: center; } .navs--main>ul>li:after { content: ""; bottom: -18px; background: #fff; height: 3px; position: absolute; z-index: 12; left: 0; right: 100%; transition-duration: 0.3s; transition-property: right; transition-timing-function: ease-out; } .navs--main>ul>li:hover:after { right: 0; } .navs--main ul li a:only-child:after { display: none; } .navs--main>ul>li:hover:before, .navs--main>ul>li:hover:after { opacity: 1; visibility: visible; } .navs--main>ul>li.is-nav-active:before, .navs--main>ul>li.is-nav-active:after { opacity: 1; visibility: visible; box-shadow: none; } .navs--main>ul>li.is-nav-active a { color: #fff; } .navs--main ul ul { margin: 0 0 0; background-color: rgba(255, 255, 255, 0.86); opacity: 0; position: absolute; top: 160%; visibility: hidden; z-index: 1; transition: all .4s ease; -webkit-transition: all .4s ease; box-shadow: 0px 2px 3px 0px rgba(0, 0, 0, 0.2); left: 1px; } .navs--main ul ul li { float: inherit; width: 100%; display: block; text-align: left; position: static; } .navs--main ul ul li:last-child { border-bottom: none; } .navs--main ul ul li a { padding: 10px 15px; display: block; color: #4f4d4e; text-align: center; position: relative; font-size: 12px; text-transform: uppercase; } .navs--main ul ul li a:hover { color: #000; } .navs--main ul ul li a:after { right: 10px; transform: rotate(45deg); -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); top: 15px; } .navs--main ul ul .dropdown__target { top: 0; background: #fff; bottom: 0; } .navs--main ul ul .dropdown__target li { background: #fff; } .navs--main ul ul .dropdown__target li a { color: #333; } .navs--main ul ul .dropdown__target li a:hover { background: rgba(0, 0, 0, 0.03); color: #333; } .navs--main ul li:hover a { color: #fff; } .navs--main ul li ul li:hover a { color: #000; } .navs--main ul li ul li:hover a:after { border-color: #000; } .navs--main ul ul ul { top: 0%; left: 160%; } .navs--main ul ul li:hover>ul { top: 0%; left: 100%; opacity: 1; visibility: visible; } .navs--main ul li:hover>ul { opacity: 1; top: 100%; visibility: visible; } .dropdown__trigger { display: none; } } @media only screen and (min-width:991px) and (max-width: 1220px) { .navs--main>ul>li>a { padding: 17px 17px } } /* dropdown menu css for touch devices ---------------------- */ @media(max-width:1025px) { .toggle--nav { position: absolute; top:18px; left: 0; display: inline-block; margin: 0; z-index:100; } .toggle--nav span { display: block; background: #000; width: 30px; height: 3px; border-radius: 0; -webkit-transition: .25s margin .25s, .25s transform; transition: .25s margin .25s, .25s transform; } .toggle--nav span:nth-child(1) { margin-bottom: 6px; } .toggle--nav span:nth-child(3) { margin-top: 6px; } .toggle--nav.is-active span { -webkit-transition: .25s margin, .25s transform .25s; transition: .25s margin, .25s transform .25s; } .toggle--nav.is-active span:nth-child(1) { margin-top: 8px; margin-bottom: -4px; } .toggle--nav.is-active span:nth-child(1), .toggle--nav.is-active span:nth-child(2) { -webkit-transform: rotate(45deg); transform: rotate(45deg); } .toggle--nav.is-active span:nth-child(3) { margin-top: -4px; -webkit-transform: rotate(135deg); transform: rotate(135deg); } .section--navs { background: #fff; bottom: 0; box-shadow: 0 0 10px rgba(51, 51, 51, 0.38); left: 0; margin: 0; overflow: auto; position: fixed; text-align: left; top: 0; transform: translate3d(-350px, 0px, 0px); -webkit-transform: translate3d(-350px, 0px, 0px); -ms-transform: translate3d(-350px, 0px, 0px); transition: all 300ms ease 0s; -webkit-transition: all 300ms ease 0s; -ms-transition: all 300ms ease 0s; width: 270px; opacity: 0; visibility: hidden; z-index: 111; padding: 0; /*  padding-top:80px;*/ } body.toggled-left .section--navs { opacity: 1; transform: translate3d(0px, 0px, 0px); -webkit-transform: translate3d(0px, 0px, 0px); -ms-transform: translate3d(0px, 0px, 0px); visibility: visible; } body.toggled-left .overlay--nav, body.toggled-right .overlay--nav, .is--dashboard-visible .overlay--nav, .is--account-visible .overlay--nav  { display: block; } body.toggled-left, body.toggled-right { overflow: hidden; } .section--navs .container { padding: 0; } .dropdown__target { display: none; } .navs--main>ul { display: block; } .dropdown__trigger { cursor: pointer; display: block; position: absolute; right: 5px; top: 0px; bottom: 5px; width: 35px; } .dropdown__trigger:active { background: rgba(0, 0, 0, 0.06); } .dropdown__trigger:after { width: 8px; content: "+"; height: 8px; position: absolute; right: 14px; top: 0px; font-size: 1.5em; font-weight: 700; color: var(--first-color); } .dropdown__trigger.is-active:after { content: "-"; font-size: 1.7em; right: 12px; top: 0px; } .navs--main li { position: relative; display: block; border-bottom: 1px solid rgba(0, 0, 0, 0.1); text-align: left; } .navs--main>ul>li a { display: block; padding: 10px; font-weight: 600; font-size: 1em; color: #252525; } .navs--main>ul>li a:active { background: rgba(0, 0, 0, 0.06); } .navs--main li ul { background: rgba(0, 0, 0, 0.02); margin: 0; border-top: 1px dashed rgba(0, 0, 0, 0.06); } .navs--main li ul li:last-child { border-bottom: none; } .navs--main li ul li a { text-transform: none; font-weight: normal; } .navs--main li ul li ul a { padding-left: 20px; padding-right: 35px; font-size: 0.9em; } #header.sticky { background-color: #000; left: 0; position: fixed; right: 0; top: 0; z-index: 100; } #header.sticky #logo img, #header.sticky .social { display: none; } #header.sticky #logo .mobile-logo { display: block; } .dropdown__trigger { width: 100%; } } :root { --border-color: #dbdbdb; --first-color: #f37242; --second-color: #f5bb41; } html { font-size: 16px; height: 100%; } .btn i { display: inline-block; margin-right: 5px; vertical-align: middle; color: inherit; } /*Shine*/ .btn { overflow: hidden; } .btn:before { content: ""; display: block; width: 50%; height: 100%; background: linear-gradient(to right, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .3) 100%); position: absolute; top: 0; left: -75%; z-index: 2; -ms-transform: skewX(-25deg); transform: skewX(-25deg); } .btn:hover:before { animation: shine 1.2s } @keyframes shine { 100% { left: 125%; } } /*Shine end*/ .btn.btn--block { display: block !important; width: 100% !important; text-align: center; } .btn.btn--small { line-height: normal; height: auto; padding: 5px 15px; text-transform: none; } .btn.btn--large { line-height: 54px; height: 54px; padding: 0 40px; font-size: 1.2em; } .btn.btn--xlarge { line-height: 64px; padding: 0 50px; font-size: 2em; } .btn.btn--xsmall { height: auto; line-height: 1.5; padding: 5px 8px; } .btn.btn--bordered { background-color: transparent; } .btn.btn--bordered:hover {} .btn.btn--white { background-color: #fff; color: #333; } .container { margin: 0 auto; max-width: 1300px; padding: 0 15px; } .container--1200 { max-width: 1200px; } #header { position: fixed; left: 0; right: 0; top: 0; width: 100%; border-bottom: solid 1px var(--border-color); background: #fff; z-index: 14; text-align: center; /*min-height: 78px;*/ background-color: var(--second-color); transition: all 0.5s; -webkit-transition: all 0.5s; -ms-transition: all 0.5s; } .header-inner { display: flex; justify-content: space-between; align-items: center; } .after-header { height: 116px; } .logo { float: left; margin: 9px 0; max-width: 155px; } .right-head { display: flex; justify-content: space-between; align-items: center; } .accounts-link { margin: 0px 0; margin-left: 20px; float: right; } .accounts-link>ul>li { display: inline-block; position: relative; vertical-align: top; width: auto; } .accounts-link ul>li>a { display: block; color: #000; font-size: 0.9em; /* text-transform: uppercase;*/ font-weight: 500; border: solid 1px #000; border-radius: 3px; padding: 10px 20px; line-height: 0.9375em; vertical-align: top; } .accounts-link ul>li.bordered>a { border-color: #fff; } .accounts-link .ion-ios-location, .accounts-link .ion-android-arrow-dropdown { color: inherit; line-height: 0; font-size: 12px; vertical-align: top; } .accounts-link a:hover { /* border-color: var(--first-color); color: var(--first-color);*/ } .accounts-link .filled>a { background: #000; color: #fff; } .hero-slider { position: relative; overflow: hidden; width: 100%; height: 656px; } .zs-enabled { position: relative; } .zs-enabled .zs-slideshow, .zs-enabled .zs-slides, .zs-enabled .zs-slide { position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; } .zs-enabled .zs-slideshow .zs-slides .zs-slide { background: transparent none no-repeat 50% 50%; background-size: cover; position: absolute; visibility: hidden; opacity: 0; -webkit-transform: scale(1.2, 1.2); -moz-transform: scale(1.2, 1.2); -ms-transform: scale(1.2, 1.2); -o-transform: scale(1.2, 1.2); transform: scale(1.2, 1.2) } .zs-enabled .zs-slideshow .zs-slides .zs-slide.active { visibility: visible; opacity: 1 } .first-fold { position: relative; } .banner { position: relative; } .slide-img { background-repeat: no-repeat; background-position: center top; position: relative; background-size: 100%; } .slide-img::before { padding-bottom: 32.8%; content: ""; display: block; } .banner-text { position: absolute; top: -73px; right: 50%; margin-right: -680px; z-index: 2; color: #fff; width: 456px; height: 456px; display: block; border-radius: 50%; background: rgba(243, 114, 66, 0.89); text-align: center; padding: 122px 0 0 0; } .banner-text h2 { font-size: 1.8em; line-height: 1.3; color: inherit; margin: 15px 0; padding: 0 50px; font-family: 'trend_hm_sansone'; } .banner-text p { font-size: 1em; line-height: 1.3; color: inherit; margin: 0 0 30px 0; padding: 0 50px; } .banner .slick-arrow { width: 64px; height: 64px; border: none; border-radius: 50%; background-color: #fff; font-size: 0; position: absolute; bottom: 8%; left: 185px; cursor: pointer; z-index: 3; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAASCAYAAACw50UTAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAKdJREFUeNpiZLBbwkArwERAfg4Q15FrOAsBg5OR+E3Ucjm6wYpAzEwNl88H4gQk/gIgTgHiv5S6nGoGoxtOVYORDae6wTDDW9AMZoDy/wDxf0owyPB8WmaiKbQ0vBKIp6OJg/iMlGJmBvkgkGFbgVgKiI2hhpsCsThUnGwAMxwEtlDbAmTDqW4BuuG4LJCCilOl4EoH4llI/AvULnLTkQyeTo7hAAEGAO4gMyf1YJcwAAAAAElFTkSuQmCC'); background-repeat: no-repeat; background-position: center; } .banner .slick-next.slick-arrow { left: 290px; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABcAAAASCAYAAACw50UTAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAJ5JREFUeNpiZLBbwkArwESB3jogno9PAQsFBjci8ROp5XJmIFZE4ifg8gEzg3wQqYb/B+ItQCwHxAZQMRCtAMQbKTWcaAvINZwoCygxnKAFLFAF1AagSH7KCMxE/2mUh74wMdAOTAEZzkgFPB3N4FlAXEkNl08D4kw0g9MpLVvwGkyp4XgNpsRwggZTYvhlQgZTUuROR8qN6bgUAQQYAM62JOWQzEWnAAAAAElFTkSuQmCC'); } .section-headings { margin: 0 auto; text-align: center; margin-bottom: 45px; } .section-headings.left-theme { text-align: left; } .section-headings.left-theme h2 { text-align: left; } .section-headings.left-theme h2:after { left: 0; margin: 0; } .section-headings h2 { color: #000; font-size: 1.8em; line-height: 1.2; margin: 0 0 25px 0; text-transform: uppercase; position: relative; font-weight: 600; font-family: 'trend_hm_sansone'; } .section-headings h2.no-after:after { content: normal; } .section-headings h2:after, .after-border:after { background-color: #a1a0a0; width: 70px; height: 3px; position: absolute; left: 0; right: 0; margin: 0 auto; bottom: -10px; content: ""; display: block; } .after-border { position: relative; } .after-border:after { left: 0; right: auto; } .section-headings h4 { color: #393e4a; margin: 0 auto; font-size: 1.5em; margin-bottom: 20px; line-height: 1.7; padding: 0; max-width: 700px; } .section-headings p { color: #393e4a; font-size: 1em; margin-bottom: 20px; line-height: 1.7; padding: 0; } .section-headings p em { font-style: italic; } .section-headings .blue { color: #1984bd; } .section-headings.white-theme h2 { color: #fff; } .white-theme h2:after { background: #fff; } .section { padding: 40px 0; } .steps .step-item { text-align: center; } .steps .count { width: 45px; height: 45px; display: block; text-align: center; font-size: 1.875em; color: #c5c4c0; border-radius: 50%; margin: 10px auto; border: solid 1px var(--border-color); font-weight: 600; } .steps .icn { margin: 15px auto; display: block; max-width: 110px; min-height: 110px; } .steps .icn img { display: inline-block; } .steps h3 { color: #2e2e2e; font-weight: 600; font-size: 1.125em; margin: 10px auto; } .steps p { font-size: 0.875em; } .meals-pattern { background: url(images/meal-pattern.png) repeat 0 0; } .meals-pattern2 { border-top: solid 1px #ccccca; border-bottom: solid 1px #ccccca; background: url(images/meal-pattern-light.png) repeat 0 0; } .meals-section { position: relative; } .featured-slider { margin-bottom: 30px; } .featured-slider .slick-arrow { position: absolute; z-index: 5; top: 50%; transform: translateY(-50%); background: #858835; border-radius: 50%; width: 75px; height: 76px; padding: 0; cursor: pointer; text-indent: -9999px; border: none; } .featured-slider .slick-prev { background: rgba(0, 0, 0, 0.75) url(images/retina/left-arrow.svg) no-repeat center; background-size: 40px; left: 50%; margin-left: -800px; } .featured-slider .slick-next { background: rgba(0, 0, 0, 0.75) url(images/retina/right-arrow.svg) no-repeat center; background-size: 40px; right: 50%; margin-right: -800px; } .featured-slider .slick-arrow:hover { background-color: background: rgba(0, 0, 0, 1); } .featured-slider .slick-slide { margin: 0 76px; position: relative; } .featured-slider .slick-slide .item { display: inline-block; position: relative; width: 100%; } .featured-slider .slick-slide.slick-current .item:after { position: absolute; content: ""; border: solid 3px #fff; left: 3%; top: 5%; right: 3%; bottom: 5%; } .slider-sticker-wrapper { position: absolute !important; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 1; background: rgba(255, 255, 255, 0.99); max-width: 372px; margin-left: -328px; padding: 40px; } .pagingInfo { height: 45px; width: 70px; color: #a7a8a8; font-size: 1.25em; font-weight: 300; position: relative; } .pagingInfo:after { -webkit-transform: rotate(32deg); -moz-transform: rotate(32deg); -o-transform: rotate(32deg); -ms-transform: rotate(32deg); transform: rotate(32deg); background: #a7a8a8; content: ""; height: 60px; position: absolute; right: 36px; top: -5px; width: 1px; } .pagingInfo span { line-height: 1; display: block; color: #a7a8a8; padding: 2px 8px; } .pagingInfo span:last-child { text-align: right; } .txt-slip h3 { color: #000; font-size: 4.375em; font-weight: 300; line-height: 1; margin: 20px 0; } .txt-slip p { line-height: 1.5; font-weight: 300; margin: 0; } .food-system { /*background: url(images/rectangle.png) no-repeat 0 0;*/ background: var(--second-color); } .link { color: inherit; font-size: 1rem; line-height: 1; } .link:hover { /*text-decoration: underline;*/ } .link .icn { color: inherit !important; } .link-white { color: #fff; } .arrow { margin-left: 10px; width: 20px; height: 20px; vertical-align: sub; display: inline-block; } .arrow.first-color svg { fill: var(--first-color); } .arrow.arrow--white svg { fill: #fff; } .arrow svg { vertical-align: top; } .link.link--white { color: #fff; } .weekly-slider {} .weekly-slider .slick-arrow { position: absolute; z-index: 5; top: 50%; transform: translateY(-50%); background: #858835; border-radius: 50%; width: 75px; height: 76px; padding: 0; cursor: pointer; text-indent: -9999px; border: none; } .weekly-slider .slick-prev { background: #f5bb41 url(images/retina/left-arrow.svg) no-repeat center; background-size: 40px; left: 50%; margin-left: -486px; } .weekly-slider .slick-next { background: #f5bb41 url(images/retina/right-arrow.svg) no-repeat center; background-size: 40px; right: 50%; margin-right: -486px; } .weekly-slider .slick-arrow:hover { background-color: background: rgba(0, 0, 0, 1); } .weekly-slider .slick-slide { margin: 0 25px; position: relative; border: solid 3px transparent; } .slick-slide .slide-img { width: 100%; } .over-detail { position: absolute; left: 50%; right: 0; top: 50%; text-align: center; display: block; transform: translate(-50%, -50%); opacity: 0; visibility: hidden; z-index: 2; } .over-detail .favourites { background-image: url(images/retina/favorite.svg); background-position: center; background-repeat: no-repeat; width: 32px; height: 32px; margin: 0 auto; background-size: 32px; } .over-detail .favourites.favourited { background-image: url(images/retina/favorite-active.svg); } .weekly-slider .slick-slide:hover:hover { border-color: #f5bb41; } .weekly-slider .slick-slide:hover:after { position: absolute; height: 100%; width: 100%; top: 0; bottom: 0; left: 0; right: 0; content: ""; background: rgba(72, 71, 75, 0.75); display: block; z-index: 1; } .weekly-slider .slick-slide:hover .over-detail { opacity: 1; visibility: visible; } .over-detail .time .hrs { display: block; color: #ffffff; } .over-detail .time img { display: inline-block; } .over-detail h3 { color: #fff; font-size: 1.8em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .over-detail h3 a { color: inherit; } .over-detail .price { color: #fff; font-size: 1.5em; font-weight: 600; } .over-detail p { color: #fff; font-size: 1.125em; } .circle-image-wrapper { margin: 0 auto; position: relative; width: 423px; height: 423px; border-radius: 50%; border: solid 5px var(--second-color); } .circle-image-wrapper:before { background: url(images/y-shape.png); width: 326px; height: 452px; display: block; position: absolute; content: ""; left: -230px; top: -41px; z-index: 1; } .circle-image-wrapper:after { border: solid 3px #fff; left: 22px; top: 22px; right: 22px; bottom: 22px; display: block; position: absolute; content: ""; z-index: 1; border-radius: 50%; } .circle-image-wrapper .circle-image { border-radius: 50%; overflow: hidden; } .side-txt { padding: 50px 0 0 0; } .side-txt .section-headings h2 { text-align: left; } .side-txt .section-headings h2:after { left: 0; margin: 0; } .side-txt ul { margin: 35px 0; } .side-txt li { display: inline-block; vertical-align: top; margin: 5px 0; } .side-txt .icn { display: inline-block; vertical-align: top; text-align: center; border-radius: 50%; border: solid 2px #fff; width: 59px; height: 59px; margin-right: 10px; } .side-txt .icn img { display: inline-block; padding: 10px 0; } .side-txt p { display: inline-block; vertical-align: top; color: #fff; font-size: 1.125em; max-width: 100px; margin: 0; padding-top: 10px; line-height: 1.2; } .btn--bordered { border: solid 2px var(--first-color); color: var(--first-color); line-height: 36px; } .btn--bordered:hover { border: solid 2px var(--second-color); color: var(--second-color); } .btn--bordered:hover .arrow.first-color svg { fill: var(--second-color); } .btn--bordered-white { border-color: #fff; color: #fff; background: none; } .btn--bordered-white:hover { border-color: inherit; color: inherit; } .btn--bordered-black { border-color: #000; color: #000; background: none; } .btn--bordered-black:hover { border-color: #000; color: #000; background: none; } .testimonial-box { border-radius: 2px; border: solid 1px var(--border-color); margin: 0 12px; padding: 35px; } .testimonial-box .testimonial-txt { color: #575757; font-style: italic; font-size: 1em; line-height: 1.5; font-weight: 300; margin: 0; padding: 60px 0 50px 0; position: relative; height: 300px; } .testimonial-box .testimonial-txt:before { content: ""; position: absolute; top: 0; left: 0; background: url(images/qoute.png) no-repeat 0 0; width: 53px; height: 43px; display: block; } .testimonial-box .from .img { float: left; border-radius: 50%; overflow: hidden; margin-right: 10px; } .testimonial-box .from p { color: #2a2a2a; font-size: 1.2375em; padding: 5px 0 0 0; } .testimonial-box .from p span { font-size: 1.0625rem; color: var(--first-color); display: block; } .testimonial-slider .slick-dots { margin: 30px auto; text-align: center; } .testimonial-slider .slick-dots li { border: 1px solid transparent; border-radius: 50%; display: inline-block; margin: 0 2px; padding: 3px; } .testimonial-slider .slick-dots li button { background: #c9c8c8; border: medium none; border-radius: 50%; display: block; height: 11px; position: relative; text-indent: -9999px; width: 11px; } .testimonial-slider .slick-dots li.slick-active button { background: var(--first-color); border-color: #fff; } .testimonial-slider .slick-dots li.slick-active { border: 1px solid var(--first-color); } .footer { background: url(images/bg-footer.jpg) no-repeat center bottom; border-top: solid 1px var(--border-color); } .newsletter { margin: 0 auto; max-width: 508px; padding: 0; text-align: center; } .newsletter h4 { color: #000; font-size: 1.8em; padding: 0; } .newsletter p { color: #636262; font-size: 1.0em; } .newsletter-form { position: relative; margin-top: 20px; } .newsletter-form input[type="text"] { background: none; border: solid 1px #c8c6c6; height: 40px; border-radius: 1px; text-align: left; padding-right: 152px; } .newsletter-form input[type="submit"] { background: #49484d; color: #fff; border: none; border-radius: 1px; height: 40px; position: absolute; font-size: 1em; right: 0; top: 0; padding: 0 20px; } .newsletter-form input[type="submit"]:hover { background: var(--first-color); } .middle-footer { position: relative; padding-top: 250px; } .f-links { color: #000; } .f-links h3, .f-heading { color: inherit; font-size: 1.125em; font-weight: 600; padding: 5px 0; text-transform: uppercase; margin-bottom: 15px; } .f-links li { color: #262529; font-size: 0.9375em; font-weight: 300; padding: 5px 0; } .f-links li a { color: inherit; font-size: inherit; position: relative; text-decoration: none; font-weight: 400; } .f-links li a:hover { color: #976600; } .f-links li a:before { background: #976600; bottom: 0px; content: ""; height: 1px; left: 0; position: absolute; right: 100%; transition-duration: 0.3s; transition-property: right; transition-timing-function: ease-out; } .f-links li a:hover:before { right: 0; } .f-heading span { display: block; color: inherit; font-size: 0.9em; font-weight: 300; text-transform: none; } .app-adds { max-width: 316px; text-align: center; margin: 0 auto; position: absolute; left: 0; right: 0; padding: 50px 0 0 0; } .app-adds a { color: var(--third-color); font-size: 1.06em; } .social-media { margin: 0 auto; text-align: center; display: block; padding-top: 40px; } .social-media li { display: inline-block; padding-left: 15px; vertical-align: middle; } .copy-right { font-size: 0.8325em; padding: 0; margin: 4px 0; color: #9c7421; line-height: 1.5; } /*checkout*/ .checkout-nav { border-bottom: solid 1px var(--border-color); position: relative; padding: 0; text-align: center; } .checkout-nav ul { white-space: nowrap; width: 100%; overflow-x: auto; } .checkout-nav ul li { display: inline-block; text-align: center; position: relative; padding: 35px 10px; vertical-align: top; min-width: 160px; margin: 0 20px; } .checkout-nav ul li a { position: relative; display: block; max-width: 170px; margin: 0 auto; -webkit-filter: grayscale(100%); filter: grayscale(100%); } .checkout-nav ul li a:after { content: ""; position: absolute; right: 25px; top: 20px; background: url(images/retina/icn-tick.svg); width: 18px; height: 18px; display: block; } .checkout-nav .icn { display: inline-block; margin: 0 auto; text-align: center; vertical-align: middle; max-width: 44px; width: 44px; height: 44px; } .checkout-nav .txt { color: #83b229; font-size: 1.125em; display: block; padding: 5px 0; text-align: center; } .checkout-nav ul li a { opacity: 0.25; } .checkout-nav .icn svg { fill: #83b229; } .checkout-nav .is-active { opacity: 1; } .checkout-nav .is-active:after { background: url(images/retina/icn-tick-active.svg); } .checkout-nav .is-active .icn svg { fill: var(--first-color); } .checkout-nav .is-active .txt { color: var(--first-color); } .checkout-nav .is-active { -webkit-filter: grayscale(0%); filter: grayscale(0%); } .checkout-nav ul li a.completed { -webkit-filter: grayscale(0%); filter: grayscale(0%); opacity: 1; } .checkout-data { margin: 0 auto; padding: 0px; } .checkout--data { margin: 0 auto; max-width: 700px; } #checkOutProcess {} .review-checkout--data { margin: 0 auto; margin-right: 3%; } .login-checkout--data, .billing-checkout--data, .payment-checkout--data { max-width: 800px; margin: 0 auto; } .tab-data { display: none; } .login-data, .billing-data, .shipping-data, .payment-data { max-width: 730px; margin: 0 auto; } .tab-heading { color: #000; font-size: 2.1875em; line-height: 1.2; margin: 40px 0; text-align: center; text-transform: uppercase; position: relative; font-weight: 600; font-family: 'trend_hm_sansone'; } .tabs-left { float: left; width: 50%; border-right: solid 1px var(--border-color); padding: 0 50px 0 0; } .tab-data .box-heading { font-family: 'Poppins', sans-serif; text-transform: none; color: #000; font-size: 1.666em; font-weight: 500; margin: 15px 0 0 0; } .box-heading span { display: block; font-size: 0.975rem; font-weight: 400; } .login-form { margin: 40px 0 0 0; } .login-form fieldset { margin-bottom: 15px; } .connect { text-align: center; } .connect a { vertical-align: top; border-radius: 2px; display: inline-block; max-width: 290px; margin: 10px 0; color: #fff; text-transform: uppercase; } .connect a .svg svg { fill: #fff; width: 20px; height: 20px; vertical-align: top; } .connect a.fb { background: #3957a0; } .connect a.gp { background: #de4331; } .tabs-right { float: left; width: 50%; padding-left: 50px; } .checkbox-wrapper li { background: #eeeeee; padding: 15px 10px; margin: 15px 0; display: block; border-radius: 2px; } .section-head { display: table; width: 100%; border-bottom: solid 1px var(--border-color); } .section-head .box-heading { display: inline-block; } .section-head .right-section { float: right; } .section-bottom { display: table; width: 100%; padding: 20px 0; border-top: solid 1px var(--border-color); } .section-bottom p { margin: 0; } .all-addresses {} .all-addresses li { padding: 20px 25px 20px 50px; float: left; position: relative; width: 50%; border-bottom: solid 1px var(--border-color); } .all-addresses li:nth-child(even) { border-left: solid 1px var(--border-color); } .all-addresses li * { /*opacity: 0.55; -webkit-filter: grayscale(100%); filter: grayscale(100%);*/ } .all-addresses li:before { position: absolute; left: 25px; top: 23px; content: normal; border-radius: 50%; width: 16px; height: 16px; border: solid 3px var(--first-color); opacity: 0.55; -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */ filter: grayscale(100%); } .all-addresses li.is-active *, .all-addresses li.is-active:before { /*opacity: 1; -webkit-filter: none; filter: none;*/ } .all-addresses p strong { color: #000; font-weight: 400; font-size: 1.06rem; line-height: 1; } .all-addresses p { font-size: 0.86em; color: #646363; } .user-address { padding-left: 25px; display: block; } .all-addresses.type-2 li { float: none; width: auto; padding-right: 0; padding-left: 0; } .all-addresses.type-2 li:nth-child(even) { border-left: none; } .all-addresses.type-2 li:before { left: 0; } .actions { float: right; width: 90px; } .actions>a { margin: 10px 0; padding: 5px 6px; display: block; } .actions a .icn { display: inline-block; margin-right: 5px; } .actions a.delete { background: #49484d; } .actions a.edit { background: var(--first-color); } .shipping-data {} .heading1 { line-height: 1.1; font-weight: 600; color: #292929; font-size: 2.3em; margin: 10px 0; } .heading3 { color: #000; font-size: 1.2em; margin: 10px 0; } .heading4 { color: var(--first-color); font-size: 1.06em; } .divider { height: 1px; background: var(--border-color); margin: 15px 0; } .payment-data {} .payment-type { margin: 25px 0; display: block; } .payment-type label { color: var(--first-color); font-weight: 500; } .payment-form .cvv { width: 82px; display: inline-block; } .payment-form .cvv-img { vertical-align: middle; display: inline-block; margin: 0 15px; } .payment-form .cvv-txt { vertical-align: middle; display: inline-block; color: #505050; max-width: 170px; font-size: 0.875em; } .review-data { padding-left: 3%; } .review-data .tab-heading { text-align: left; } .reviewtable { display: table; width: 100%; table-layout: fixed; } .reviewtable .cart-main, .reviewtable .cart-footer { display: table-cell; width: 70%; vertical-align: top; } .reviewtable .cart-footer { width: 30%; } .cart-main { padding-right: 3%; } /*shopping-cart-table*/ .shopping-cart-table { padding: 0; margin: 0; width: 100%; border-collapse: collapse; } .shopping-cart-table tr { border-bottom: solid 1px var(--border-color); } .shopping-cart-table tbody>tr:last-child { border-bottom: none; } .shopping-cart-table th { color: var(--first-color); padding: 20px 10px; font-weight: 600; vertical-align: top; } .shopping-cart-table tr>th:last-child { /* text-align: right;*/ } .shopping-cart-table td { padding: 30px 10px; vertical-align: top; } .shopping-cart-table tr td:first-child, .shopping-cart-table tr th:first-child { padding-left: 0; } .shopping-cart-table .product-cart-image { display: inline-block; } .shopping-cart-table .product-cart-image .product-image { float: left; margin-right: 10px; min-width: 50px; max-width: 100px; } .shopping-cart-table .product-cart-info { margin-left: 110px; max-width: 227px; } .shopping-cart-table .product-name { font-size: 1em; color: #000; } .link-txt { color: var(--first-color); } .shopping-cart-table .product-cart-info .actions { float: none; width: auto; } .shopping-cart-table .product-cart-info .actions a { display: inline-block; } .shopping-cart-table .cart-caption { color: #666666; font-size: 0.93333em; font-weight: 600; padding-bottom: 4px; } .shopping-cart-table .select-small { width: 70px; height: 30px; line-height: 30px; display: block; font-size: 0.875em; cursor: pointer; } .shopping-cart-table .select-small.date { width: 205px; } .shopping-cart-table .cart-price { /* text-align: right;*/ color: #000; font-size: 1.13333em; font-weight: 600; } table.cart-tbl-addons {} table.cart-tbl-addons th, table.cart-tbl-addons td { padding: 10px 5px; font-size: 0.775em; } .remove-icn { font-size: 1.5em; line-height: 1; } /*cart-footer*/ .cart-footer { background: #f6f6f5; border-left: solid 1px var(--border-color); border-top: none; max-width: 408px; } .cartdetail__footer { padding: 20px; } .order-list { padding: 20px; } .order-list h3 { color: #000; font-size: 1.2em; font-weight: 500; } .order-list li { border-top: solid 1px var(--border-color); padding: 10px 0; color: #515151; font-size: 0.8125em; display: table; width: 100%; vertical-align: top; table-layout: fixed; } .order-list .order-name, .order-list .qnt, .order-list .price { display: table-cell; width: auto; vertical-align: top; } .order-list .qnt { padding: 0 10px; } .order-list a { color: inherit; } .order-list .order-name { width: 60%; } .cartdetail__footer tr.total {} .cartdetail__footer td { padding: 6px 0; font-size: 0.9em; font-weight: 500; color: #5c5b5b; } .cartdetail__footer td.hightlighted { font-weight: 600; font-size: 1em; color: #000; border-bottom: solid 1px var(--border-color); border-top: solid 1px var(--border-color); } .buttons-last { margin-top: 10px; } .buttons-last a { padding: 0 22px; } .text-left { text-align: left; } .text-right { text-align: right; } .discount-form { background: #ebebea; padding: 20px; } .discount-form label { color: #000; font-size: 1em; } .discount-form .field-wrapper { position: relative; } .discount-form .coupon_code { padding-right: 76px; height: 51px; line-height: 51px; } .button-wrapper { position: absolute; top: 5px; right: 6px; } .small-header { height: 146px; background-position: center; background-repeat: no-repeat; text-align: center; position: relative; } .small-header:after { background: rgba(0, 0, 0, 0.5); content: ""; position: absolute; width: 100%; height: 100%; left: 0; right: 0; top: 0; bottom: 0; } .small-header .container { position: relative; z-index: 1; height: 100%; } .small-header-b { height: 348px; } .small-header-c { height: 267px; } .small-header-c:after { background: rgba(1, 69, 82, 0.75); } .small-header-d { height: 300px; } .page-title { transform: translateY(-50%); top: 50%; position: absolute; left: 0; right: 0; margin: 0 auto; color: #fff; } .page-title.top-middle { top: 15%; } .page-title h1 { padding: 0; position: relative; z-index: 1; text-transform: uppercase; color: #fff; font-size: 2em; line-height: 1.2; font-weight: 600; text-align: center; font-family: 'trend_hm_sansone'; } .page-title h1 small { text-transform: none; line-height: 1; font-size: 1.5rem; display: block; color: #fff; } .page-title h1~.rating-wrapper p { color: #fff; } .page-title h1~.rating-wrapper p a { color: #fff; } /*new page*/ .about-chef-review { margin: auto; max-width: 950px; } .review-product-img { width: 366px; height: 366px; padding: 0px; box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.33); border: solid 8px #fff; border-radius: 50%; overflow: hidden; margin: auto; } .review-product-img img { /*border-radius: 50%;*/ } .product-review { padding-top: 30px; text-align: center; } .product-title { font-weight: 800; color: #292929; font-size: 2.33em; line-height: 1.3; } .product-title a { color: inherit; } .product-review h3 { margin-bottom: 20px; } .about-chef h2 { font-size: 2.18em; color: #000; } .about-chef p { line-height: 1.6; } .about-chef h4 { font-size: 1.5em; color: var(--first-color); } .about-chef a { color: #626262; } .rating-wrapper .ratings, .rating-wrapper p { display: inline-block; vertical-align: top; font-weight: 600; font-size: 0.9em; } .rating-wrapper .ratings { margin-right: 8px; } .ratings li { display: inline-block; } .normaltxt { font-size: 0.975rem; } .review-action .btn, .review-action .select-newest { min-width: 180px; vertical-align: top; } .review-action .select-newest { display: inline-block; width: auto; } .listing--progress { margin-top: 40px; } .listing--progress>li { display: inline-block; vertical-align: top; width: 100%; padding: 0; } .listing--progress>li .grid--left { width: 35px; float: left; font-size: 0.8em; line-height: 1.2; color: #f07b22; padding-right: 10px; } .listing--progress>li .star { display: inline-block; vertical-align: middle; text-align: right; float: right; max-width: 12px; } .listing--progress>li .grid--right { width: calc(100% - 69px); float: left; padding: 0 0 0 0; } .listing--progress>li .count { margin: 0 10px; font-size: 0.8em; width: 10px; float: left; color: #616161; text-align: center; } .progress--horizontal { background-color: #ededed; height: 6px; margin: 5px 0 0; } .progress--horizontal .progress__bar { background-color: #616161; float: left; height: 100%; line-height: 20px; padding: 0 10px; position: relative; text-align: right; } .reviews-list .review-item { border-bottom: solid 1px #dcdcdc; padding-bottom: 10px; margin-bottom: 30px; } .reviews-list .review-item:last-child { border-bottom: none; } .yes-no { text-align: right; margin: 15px 0; white-space: nowrap; } .yes-no li { display: inline-block; color: #000; vertical-align: top; margin: 0 5px; } .yes-no li a { color: inherit; display: block; font-weight: 600; font-size: 1.1em; line-height: 1.3em; } .yes-no li img { display: inline-block; vertical-align: top; margin: 0 5px; } .review-by { font-weight: 600; } .review-by span { display: block; color: #636363; font-weight: 300; } .review-content .date { margin-bottom: 25px; color: #636363; } .review-content .description { margin-bottom: 25px; } .negetive-wrapper { margin-top: -168px; background: #fff; position: relative; padding: 60px 40px 40px 40px; } .panel-heading { text-align: center; } .panel-heading h2 { color: #2e2e2e; font-weight: 600; font-size: 2.1875em; margin: 10px auto; padding: 0; } .panel-heading p { font-weight: 300; } .plan { border: solid 2px #a1a0a0; text-align: center; position: relative; padding: 15px; margin: 70px 0; color: #8f9090; } .plan:after { /*content: attr(data-count);*/ content: normal; position: absolute; left: 0; right: 0; margin: 0 auto; top: -39px; background: #a1a0a0; width: 76px; height: 76px; color: #fff; font-size: 3.75em; border-radius: 50%; line-height: 74px; font-family: 'trend_hm_sansone'; border: solid 2px transparent; } .plan .pkg-name { margin-top: 15px; font-size: 2em; line-height: 1; font-weight: 600; } .plan .time { padding: 0px 0 0 0; margin: 0 0 50px 0; color: inherit; position: relative; display: block; } .plan .time .count { color: inherit; } .plan .time:after { background: #a1a0a0; width: 46px; height: 1px; left: 0; right: 0; margin: 0 auto; position: absolute; bottom: -10px; content: ""; } .plan ul { margin: 10px 0; color: inherit; } .plan ul li { font-size: 1.375em; color: inherit; margin: 5px 0; } .plan a.btn { display: block; background: #a1a0a0; } .plan .shipping { margin: 25px auto; display: table; line-height: 27px; background: url("images/shipping-icon.png") no-repeat 0 0; color: inherit; font-weight: 400; padding: 0 0 0 50px; } .plan .total-meals { border-top: solid 1px var(--border-color); } .plan .total-meals li { display: table; width: 100%; text-align: left; line-height: 30px; padding: 10px; margin: 0; font-size: 0.875em; } .plan .total-meals li .count { float: right; width: 30px; height: 30px; line-height: 30px; text-align: center; background: var(--first-color); border-radius: 50%; color: #fff; } .plan .total-meals li.balance { background: var(--first-color); color: #fff; border-radius: 2px; height: auto; } .plan .total-meals li.balance .count { background: #fff; color: #252525; } .billing-txt { font-size: 0.75em; } .plan.de-activated * { position: relative; -webkit-filter: grayscale(100%); filter: grayscale(100%); opacity: 0.5 !important; } .plan .deactivated-txt { background: #fff; z-index: 2; width: 100%; position: absolute; left: 0; right: ; top: 50%; text-align: center; -webkit-filter: grayscale(0%); filter: grayscale(0%); opacity: 1 !important; font-size: 1.4em; } .plan .deactivated-txt p { -webkit-filter: grayscale(0%); filter: grayscale(0%); opacity: 1 !important; font-size: 0.875rem; } .subscription-plan .plan { min-height: 380px; } /*hover*/ .plan.is-active .pkg-name, .plan:hover .pkg-name { color: var(--first-color); } .plan:hover, .plan.is-active { border-color: var(--first-color); color: var(--first-color); } .plan:hover { box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.33); } .plan:hover:after, .plan.is-active:after { border-color: var(--first-color); background: #fff; color: var(--first-color); } .plan:hover .time:after, .plan.is-active .time:after { background: var(--first-color); } .plan:hover .shipping, .plan.is-active .shipping { background: url("images/shipping-icon-hover.png") no-repeat 0 0; } .plan:hover a.btn, .plan.is-active a.btn { background: var(--first-color); } .acc { margin: 0px 0; overflow: hidden; padding: 0; } .acc_ctrl { background: #FFFFFF; border: none; border-bottom: solid 1px #e9e9e9; cursor: pointer; display: block; outline: none; padding: 15px 25px 15px 0px; position: relative; width: 100%; text-transform: none; } .acc_ctrl h4 { text-transform: none; color: #000; padding: 0; margin: 0; font-size: 1.15em; } .acc_ctrl:before { background: var(--first-color); content: ''; height: 3px; margin-right: 10px; position: absolute; right: 0; top: 50%; font-weight: 800; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; width: 14px; } .acc_ctrl:after { font-weight: 800; background: var(--first-color); content: ''; height: 3px; margin-right: 10px; position: absolute; right: 0; top: 50%; width: 14px; } .acc_ctrl.active:before { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } .acc_ctrl.active h4, .acc_ctrl:focus h4 { position: relative; } .acc_panel { padding: 0 15px 0 0; display: none; overflow: hidden; margin: 10px 0; } .acc_panel p { margin-bottom: 0; line-height: 1.6; } /*dashboard*/ .dashboard-body { position: relative; } .dashboard-body:before { background: #f6f6f5; width: 50%; left: 0; top: 0; height: 100%; content: ""; position: absolute; z-index: -1; } .dashboard-wrapper { vertical-align: top; table-layout: fixed; position: relative; z-index: 1; } .dashboard-wrapper .dashboard-left, .dashboard-wrapper .dashboard-right { display: table-cell; vertical-align: top; } .dashboard-wrapper .dashboard-left {} .fixed__panel .stick { position: fixed; width: 201px; } .dashboard-wrapper .dashboard-right { min-height: 550px; position: relative; background: #fff; border-left: solid 1px var(--border-color); } .dashboard-nav { text-align: left; float: right; width: 100%; padding: 22px 0; } .dashboard-nav li { display: block; color: #8f8e8e; } .dashboard-nav li a { padding: 10px 0; display: block; color: inherit; font-weight: 500; } .dashboard-nav li a:hover, .dashboard-nav li.is-active a { color: var(--first-color); } .dashboard-nav li .icn { float: right; margin: 0 15px; font-size: 1.775em; color: inherit; line-height: 1; } .dashboard-padding { padding-left: 20px; } .page-data { padding-top: 30px; } .chef-profile { display: inline-block; margin: 10px 0; text-align: left; } .chef-profile .avatar { width: 150px; height: 150px; border-radius: 50%; overflow: hidden; display: inline-block; margin-right: 20px; border: solid 4px #fff; position: relative; } .chef-profile.white-theme *, .chef-profile.white-theme .avatar-info .name { color: #fff; } .hover-elemnts { position: absolute; top: 50%; left: 50%; z-index: 1; transform: translate(-50%, -300%); width: 100%; text-align: center; margin: 0 auto; -webkit-transition: all ease .3s; -moz-transition: all ease .3s; -o-transition: all ease .3s; transition: all ease .3s; } .chef-profile .avatar:hover .hover-elemnts { transform: translate(-50%, -50%); } .chef-profile .avatar:hover .hover-elemnts~img { -webkit-filter: grayscale(100%); filter: grayscale(100%); opacity: 0.22; } .hover-elemnts a { background: var(--first-color); color: #fff; border-radius: 50%; width: 34px; height: 34px; line-height: 35px; display: inline-block; text-align: center; } .hover-elemnts a i { color: inherit; } .chef-profile .avatar img { /*border-radius: 50%;*/ } .chef-profile .avatar.avatar274 { max-width: 274px; } .chef-profile .avatar.avatar274 { max-width: 274px; } .chef-profile.profile-sm .avatar { width: 80px; height: 80px; } .chef-profile.profile-sm .avatar-info .name { font-size: 1em; font-weight: 600; } .avatar-info { display: inline-block; vertical-align: top; } .avatar-info .name { color: #000; font-size: 1.875em; } .avatar-contact .phone { display: block; } .action-profile { float: right; margin-top: 45px; } .profile-dv { display: flex; margin: 10px 0; text-align: left; } .profile-dv .avatar { width: 100px; height: 100px; border-radius: 50%; overflow: hidden; margin-right: 20px; border: solid 4px #fff; position: relative; flex: none; } .profile-dv .avatar-info {} .review-for i { font-style: italic; color: #626262; } .review-for .tag { border: solid 1px var(--first-color); padding: 0 5px; line-height: 1.5; border-radius: 2px; font-size: 0.8em; display: inline-block; ; } .date { color: #626262; font-size: 0.9em; } .review-txt { margin: 5px 0; font-size: 0.875em; line-height: 1.5; color: #626262; } .stats { border: solid 2px #a1a0a0; border-radius: 2px; overflow: hidden; min-height: 200px; max-width: 250px; margin: 0 auto; } .stats .icon { position: relative; text-align: center; height: 100px; line-height: 142px; } .stats .icon img { position: relative; z-index: 1; text-align: center; display: inline-block; } .stats .icon:after { content: ""; background: #a1a0a0; width: 237px; height: 237px; border-radius: 50%; text-align: center; position: absolute; top: -140px; left: 0; right: 0; margin: 0 auto; } .totals { display: block; margin: 10px auto; text-align: center; color: #a1a0a0; line-height: 1.5; font-size: 1.125em; } .totals .totals-value { color: inherit; font-size: 1.875em; font-weight: 600; display: block; } .stats.is-active { border-color: var(--first-color); } .stats.is-active .icon:after { background: var(--first-color); } .stats.is-active .totals { color: var(--first-color); } .table-head { display: table; width: 100%; vertical-align: top; border-bottom: solid 1px var(--border-color); margin-bottom: 10px; padding-bottom: 10px; display: flex; justify-content: space-between; align-items: center; } .head-left { margin-right: 15px; /*float: left;max-width: 80%;*/ display: inline-block; } .head-right { /*  float: right;*/ display: inline-block; } .table-heading { color: #000; font-size: 1.375em; } .table-heading p { font-size: 0.875rem; font-weight: 400; } .tabs li { display: inline-block; color: #252525; font-size: 0.9em; position: relative; margin-right: 25px; padding-bottom: 0px; line-height: 1; min-height: 30px; } .tabs li:last-child { margin-right: 0; } .tabs li a { color: inherit; line-height: 1; } .tabs li.is--active a, .tabs li a:hover { color: var(--first-color); } .tabs li:after { content: ""; bottom: -11px; background: var(--first-color); height: 2px; position: absolute; z-index: 12; left: 0; right: 100%; transition-duration: 0.3s; transition-property: right; transition-timing-function: ease-out; } .tabs li:hover:after, .tabs li.is--active:after { right: 0; } .table-listing { width: 100%; } .table-listing tr { border-bottom: solid 1px var(--border-color); } .table-listing tr:last-child { border-bottom: none; } .table-listing tr td { padding: 10px; vertical-align: top; font-size: 0.875em; } .table-listing tr td:first-child { padding-left: 0; } .table-listing tr td:last-child { padding-right: 0; text-align: right; } .table-listing .block-ele { margin-bottom: 25px; } .table-listing .caption { display: block; color: #000; font-size: 0.975rem; } .ird-id { /*color: var(--first-color);*/ } .tbl-actions li { display: block; margin: 5px 0; } a.button, .status { padding: 0px 10px; display: inline-block; height: 28px; line-height: 28px; border: solid 1px var(--border-color); border-radius: 2px; white-space: nowrap; font-size: 0.875em; text-align: center; vertical-align: top; } a.button.delivered { color: #83b229; } .status { background: #777777; color: #fff; border: none; min-width: 82px; } .status.paid { background: #337ab7; color: #fff; } .status.inprocess { background: #5cb85c; color: #fff; } .status.shipped { background: #5bc0de; color: #fff; } .status.delivered { background: #24b26b; color: #fff; } .status.cancelled { background: #ff0000; color: #fff; } .status.pending { background: #d9534f; color: #fff; } a.button.view { color: #8c8c8c; } a.button span { color: inherit; vertical-align: middle; } .icn-delivered { background: url(images/delivered.png) no-repeat center; width: 13px; height: 13px; } .button span.icn { margin-right: 5px; display: inline-block; } .reviews-listing li { border-bottom: solid 1px var(--border-color); padding: 10px 0; margin: 10px 0; } .reviews-listing li:last-child { border-bottom: none; } .reviews-listing .review-by { color: var(--first-color); font-weight: 600; } .reviews-listing .review-date { color: #000; font-size: 0.8125em; } .reviews-listing .review-txt { margin: 10px 0; } .order-details {} .order-details ul li { font-size: 0.9em; padding: 5px 0; } .order-details ul li .cell-left { display: inline-block; color: #000; width: 40%; vertical-align: top; } .order-details ul li .cell-right { vertical-align: top; display: inline-block; width: 58%; } .txt-first-color { color: var(--first-color); } .txt-black-color { color: #000; } .your-order th { font-weight: 600; color: #000; } .your-order { border-collapse: collapse; } .your-order th, .your-order td { padding: 10px; border-bottom: solid 1px var(--border-color); border-top: solid 1px var(--border-color); font-size: 0.875em; } .your-order th { font-size: 1em; } .your-order tr td:first-child, .your-order tr th:first-child { padding-left: 0; text-align: left; } .your-order tr td:last-child, .your-order tr th:last-child { text-align: right; padding-right: 0; } .grand-total { color: #000; font-weight: 600; border-top: solid 1px var(--border-color); } .order-bottom { width: 383px; float: right; padding: 20px 0; } .order-bottom li { padding: 10px 0; font-size: 0.875em; } .order-bottom li .first-cell { display: inline-block; color: #000; width: 40%; vertical-align: top; } .order-bottom li .second-cell { display: inline-block; width: 58%; text-align: right; vertical-align: top; } .inline-block li { display: inline-block; margin-right: 10px; } .table {} .table { padding: 0; margin: 0; width: 100%; border-collapse: collapse; } .table tr { border-bottom: solid 1px var(--border-color); /* border-top: solid 1px var(--border-color);*/ } .table tbody tr:last-child { border-bottom: none; } .table th { color: var(--first-color); padding: 20px 10px; font-weight: 600; vertical-align: top; } .table td:last-child, .table th:last-child {} .table td { padding: 30px 10px; vertical-align: top; font-size: 0.875em; } .table tr td:first-child, .table tr th:first-child { padding-left: 0; } .table td a { color: #000; } .status-veg img { display: inline-block; vertical-align: top; } .menu-pic { width: 320px; height: 320px; display: block; border-radius: 50%; overflow: hidden; margin: 0 auto; margin-bottom: 25px; } .menu-pic img { border-radius: 50%; height: inherit; object-fit: cover; } .menu-actions { margin: 0 auto; text-align: center; max-width: 370px; } .menu-actions a { margin: 0 20px; } .meal-recipe-slider {} .meal-recipe-slider .slick-slide { margin: 0 1px; position: relative; } .meal-recipe-slider .slick-arrow { position: absolute; z-index: 5; top: 50%; transform: translateY(-50%); background: #858835; border-radius: 50%; width: 60px; height: 60px; padding: 0; cursor: pointer; text-indent: -9999px; border: none; } .meal-recipe-slider .slick-prev { background: #f5bb41 url(images/retina/left-arrow.svg) no-repeat center; background-size: 30px 30px; left: 50%; margin-left: -486px; } .meal-recipe-slider .slick-next { background: #f5bb41 url(images/retina/right-arrow.svg) no-repeat center; background-size: 30px 30px; right: 50%; margin-right: -486px; } .meal-recipe-slider .slick-arrow:hover { background-color: background: rgba(0, 0, 0, 1); } .deal-price { text-align: center; color: #000; font-size: 1.5em; font-weight: 600; font-family: 'trend_hm_sansone'; margin-bottom: 40px; } .recipe-features { float: right; border: solid 2px var(--first-color); } .recipe-features ul { display: table; table-layout: fixed; } .recipe-features li { text-align: center; display: table-cell; vertical-align: top; color: var(--first-color); border-left: solid 2px var(--first-color); padding: 10px; } .recipe-features li:first-child { border-left: none; } .recipe-features li i img { max-width: 32px; height: auto; } .recipe-features p { font-size: 0.9em; color: inherit; margin-bottom: 0; } .recipe-features img { display: inline-block !important; } .recipe-features-white { border-color: #fff; } .recipe-features-white li { border-color: #fff; } .recipe-features-white p { color: #fff; } .recipe-features-w-bordered { border: none; } .recipe-features-w-bordered ul li { border: none; padding: 5px 10px; } .recipe-features-w-bordered p { font-size: 0.775em; line-height: 1; } .ingredients-listing li { width: 24%; display: inline-block; vertical-align: middle; color: #000; margin: 15px 0; } .ingredients-listing .icn { /*  float: left;*/ display: inline-block; vertical-align: middle; margin-right: 10px; } .ingredients-listing .icn img { border-radius: 50%; } .bg-gray { background: #f4f4f3; } .pdf-icn { margin-right: 10px; vertical-align: text-bottom; background: url(images/icon-pdf.png) no-repeat 0 0; width: 33px; height: 34px; display: inline-block; } .subcribed { font-size: 1em; text-transform: uppercase; height: auto; padding: 15px 10px; font-weight: 600; } .need-ingredients-list { margin-top: 50px; padding: 15px 25px; border-radius: 2px; border: solid 1px var(--border-color); background: #fff; } .need-ingredients-list li { display: block; margin: 8px 0; } .need-ingredients-list .left-cell, .need-ingredients-list .right-cell { display: inline-block; vertical-align: top; font-size: 0.825em; } .need-ingredients-list .left-cell { font-weight: 600; color: #000; width: 30%; } .need-ingredients-list .right-cell { width: 64%; } .instructions-tbl { direction: ltr; text-align: left; display: table; table-layout: fixed; width: 100%; overflow: hidden; position: relative; padding: 40px 0; } .instructions-tbl.instructions-tbl-odd { direction: rtl; } .instructions-tbl .image-cell { /* display: table-cell;*/ vertical-align: top; padding: 0 0 50% 0; background-repeat: no-repeat; background-size: cover; background-position: 50% 50%; border: solid 4px var(--second-color); position: relative; } .instructions-tbl .image-cell:before { font-family: 'trend_hm_sansone'; content: attr(data-count); position: absolute; right: 0; top: 30px; background: var(--second-color); color: #49484d; text-align: center; width: 70px; height: 70px; display: block; font-size: 2.75em; line-height: 70px; border-radius: 50%; margin-right: -45px; margin-left: auto; } .instructions-tbl.instructions-tbl-odd .image-cell:before { left: 0; right: auto; margin-left: -45px; margin-right: auto; } .instructions-tbl .txt-cell { display: table-cell; vertical-align: top; padding: 0 50px; padding-left: 80px; } .instructions-tbl.instructions-tbl-odd .txt-cell { padding-left: 0px; } .instructions-tbl .txt-cell h2 { position: relative; margin-bottom: 20px; color: #000; direction: ltr; } .instructions-tbl .txt-cell h2:after { background-color: #a1a0a0; width: 70px; height: 3px; position: absolute; left: 0; margin: 0 auto; bottom: -5px; content: ""; display: block; } .instructions-tbl .txt-cell p { font-size: 1.125em; } .discuss-area { margin: 0 auto; } .discuss-area img { display: inline-block; margin: 0 auto; } .add-comnt { margin: 0 auto; max-width: 800px; } .balance { line-height: 2.5; height: 40px; } .bank-detail { border: solid 1px var(--border-color); padding: 10px 15px; border-radius: 2px; } .ul-tbl {} .ul-tbl li { padding: 6px 0; font-size: 0.875em; } .ul-tbl li .left-cell { display: inline-block; color: #000; width: 40%; vertical-align: top; } .ul-tbl li .right-cell { display: inline-block; width: 58%; vertical-align: top; } .search-meal { margin: 25px auto; background: #fff; border-radius: 2px; max-width: 700px; position: relative; } .search-meal-main { overflow: hidden; } .search-meal.search-meal-small { max-width: 500px; } .search-meal input[type="text"], .search-meal input[type="submit"] { background: none; border: none; height: 48px; } .search-meal input[type="submit"] { margin: 0; } .search__submit { border: none; bottom: 0; display: inline-block; height: 48px; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 60px; z-index: 3; background: #fff; } .search__submit:after { background: #636262; content: ""; height: 3px; left: 34px; pointer-events: none; position: absolute; top: 30px; transform: rotate(45deg); width: 12px; } .search__submit::before { background: rgba(0, 0, 0, 0); border: 2px solid #636262; border-radius: 100%; content: ""; height: 20px; left: 20px; pointer-events: none; position: absolute; top: 12px; width: 20px; } /*product-listing*/ .listing-page {} .listing-page .container, .chef-dishes .container { /*max-width: 1700px;*/ } .filter-bar { background: #fff; border-bottom: solid 1px #dcdcdc; } .filter-bar ul.filter-ul { display: table; width: 100%; } .filter-bar ul.filter-ul li { display: table-cell; vertical-align: middle; } .filter-switch { padding: 15px 0px; } .filter-switch a { font-size: 1.05em; color: #454545; text-transform: uppercase; } .filter-switch a:hover { color: #000; } .filter-switch .icn { display: inline-block; vertical-align: middle; margin-right: 5px; width: 28px; } .product-actions { text-align: right; float: right; } .product-actions * { display: inline-block; vertical-align: middle; } .all-category { font-size: 1.33em; color: #454545; text-transform: uppercase; } .layout { margin: 0 -2px; } .layout a { margin: 0; } .layout a .icn { margin: 0 5px; } .compare { background: #f1eff0; padding: 14px 15px; font-size: 1.05em; color: #646263; text-transform: uppercase; } .sort-by {} .sort-by .sort-txt { border-right: solid 1px var(--border-color); padding: 17px 15px; font-size: 1.05em; color: #454545; text-transform: uppercase; margin-right: -6px; } .sort-toggle { position: relative; } .sort-toggle>a { color: #454545; position: relative; padding: 15px 10px; margin-right: 20px; } .sort-toggle>a:after { border-color: #f17b23; border-style: solid; border-width: 1px 1px 0 0; content: ''; display: inline-block; height: 10px; right: -12px; transform: rotate(45deg) translateY(-50%); position: absolute; top: 46%; vertical-align: top; width: 10px; padding: 0; cursor: pointer; -webkit-transition: all ease .3s; -moz-transition: all ease .3s; -o-transition: all ease .3s; transition: all ease .3s; transform-origin: top; } .sort-toggle.is-active a:after { transform: rotate(133deg) translateY(-50%); } .widgets {} .widgets .heading4 { font-weight: 500; color: var(--first-color); padding: 10px 0; position: relative; } .widgets .heading4.first { border-top: none; } .with-arrows { position: relative; } .widgets .heading4:after, .with-arrows:after { border-color: #f17b23; border-style: solid; border-width: 1px 1px 0 0; content: ''; display: inline-block; height: 10px; right: 10px; transform: rotate(45deg) translateY(-50%); position: absolute; top: 50%; vertical-align: top; width: 10px; padding: 0; cursor: pointer; -webkit-transition: all ease .3s; -moz-transition: all ease .3s; -o-transition: all ease .3s; transition: all ease .3s; transform-origin: top; } .widgets .heading4.is-active:after, .with-arrows.is-active:after { transform: rotate(133deg) translateY(-50%); } .with-arrows.arrows-dark:after { border-color: #676565; } .toggle-target { position: relative; } .filter-content { margin: 0; margin-bottom: 15px; overflow: hidden; transition: height 0.3s ease 0s; } .filter-price-slider { background: #eaeae9; height: 2px; margin: 21px 2px 16px; position: relative; text-align: left; padding: 0 10px; width: 100%; } .price-slider-scroll { background: #c9c9c7; border: none; border-radius: 50%; cursor: pointer; height: 13px; margin-left: 0; outline: none; position: absolute; top: -6px; transition: all 0.2s ease-out 0s; width: 13px; z-index: 2; } .price-slider-scroll:hover { transform: scale3d(1.3, 1.3, 1); } .from-price-text, .to-price-text { font-weight: 600; font-size: 0.8em; vertical-align: top; } .to-price-text { float: right; text-align: right; } .prices { padding-bottom: 10px; } .price-input { float: left; padding: 0; text-align: center; width: 45%; } .price-text-box { position: relative; } .price-text-box .input-filter { height: auto; margin: 0; padding: 9px 5px 9px 30px; display: inline-block; line-height: normal; vertical-align: top; } .rsText { color: #9e9e9e; font-size: 13px; left: 5px; margin-right: 3px; padding-left: 3px; position: absolute; top: 11px; } .filter-content .btn { padding: 9px 10px; float: right; } .filter-content .dash { display: inline-block; float: left; padding: 6px; } .search-chef { margin: 10px auto; border: solid 1px var(--border-color); } /*left-filters*/ .product-listing-wrpper { margin-top: 50px; } .product-listing-wrpper.hide--filters .left-filters { opacity: 0; visibility: hidden; width: 0; height: 0; float: none; z-index: 15; display: none; } .product-listing-wrpper.hide--filters .product-list { float: none; width: 100%; padding-left: 0; } .product-listing-wrpper.hide--filters .product-list .product-grid-item { float: left; width: 25%; } .left-filters { padding-right: 10px; width: 20%; float: left; opacity: 1; visibility: visible; transition: all 300ms ease 0s; } .overlay { z-index: 11; position: fixed; left: 0; right: 0; top: 0; bottom: 0; background: rgba(0, 0, 0, 0.8); visibility: hidden; opacity: 0; -webkit-transition: 0.3s all ease-in-out; -moz-transition: 0.3s all ease-in-out; -o-transition: 0.3s all ease-in-out; transition: 0.3s all ease-in-out; } .sort-toggle ul { position: absolute; top: 100%; left: 0; right: 0; background: #fff; border: solid 1px #dcdcdc; z-index: 3; border-top: none; margin: 0; } .sort-toggle ul li { display: block !important; border-top: solid 1px #dcdcdc; text-align: left; } .sort-toggle ul li a { display: block; margin: 2px 0; padding: 5px; font-size: 0.875em; } .left-filters .heading { color: #000; font-size: 1.75em; margin-bottom: 5px; } .product-list .product-grid-item { position: relative; float: left; width: 33.3333333%; background: none; padding: 10px; margin-bottom: 10px; } .product-list { float: left; width: 80%; } .favourites.product-list { width: 100%; } .filter-scroll { max-height: 300px; } .listing-ul li { display: block; margin: 10px 0; } .readymeals-wrapper { padding: 0 15px; } .readymeals-wrapper {} /*product-grid-item*/ .product-grid-item { transition: all 300ms ease 0s; } .product-wrapper { position: relative; } .product-grid-item .product-head { position: relative; } .product-grid-item .product-image { display: block; margin: 0 0 10px; padding: 0 0 56%; position: relative; width: 100%; overflow: hidden; } .product-grid-item .product-image img { max-width: 100%; bottom: 0; left: 0; margin: auto; position: absolute; right: 0; top: 0; -webkit-transition: all 0.5s linear; transition: all 0.5s linear; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); -webkit-filter: blur(0px); -webkit-animation: fadein linear 1.5s; } .product-grid-item:hover .product-image img { -webkit-transform: scale3d(1.1, 1.1, 1); transform: scale3d(1.1, 1.1, 1); } @-webkit-keyframes fadein { 0% { -webkit-filter: opacity(0%) blur(6px); ; } 50% { -webkit-filter: opacity(100%) blur(3px); ; } 100% { -webkit-filter: opacity(100%) blur(0px); ; } } .product-grid-item .product-image:before { color: #dadada; content: "Y"; font-size: 100px; height: 50px; left: 50%; line-height: 46px; margin: -25px 0 0 -25px; position: absolute; text-align: center; top: 50%; width: 50px; } .product-price { float: right; color: #000; font-size: 1.25em; font-weight: 600; line-height: 1; } .product-name { line-height: 21px; color: #000; font-size: 1.0625em; } .product-name a { color: inherit; line-height: inherit; text-overflow: ellipsis; overflow: hidden; display: block; white-space: nowrap; } .product-name .non-veg, .non-veg, .product-name .veg, .veg { background: url("images/non-veg-icn.png") no-repeat 0 0; background-size: 100% auto; display: inline-block; width: 18px; height: 18px; vertical-align: middle; float: left; margin-right: 8px; } .product-name .veg, .veg { background: url("images/veg-icn.png") no-repeat 0 0; background-size: 100% auto; } .size28 { width: 28px; height: 28px; } .size18 { width: 18px; height: 18px; } .veg-size { width: 18px; } .product-categories { padding: 0 24px; font-size: 0.8125em; } .product-chef-name { font-size: 0.8125em; } .product-categories a { color: inherit; } .chef-filter-bar { border: solid 1px var(--border-color); display: table; width: 100%; } .chef-name { float: left; padding: 12px 10px; line-height: 1.5; color: #000; font-size: 1.375em; } .coloumn { margin-bottom: 20px; } .recipe-filter-trigger { display: none; } .recipe-filter-trigger .icn { display: inline-block; vertical-align: middle; } .listing-left {} .listing-left h3 { color: #000; font-size: 1.3em; border-bottom: solid 2px var(--border-color); margin-bottom: 20px; } .listing-left a.reset-all {} .filter-benefits li { display: table; margin: 15px 0; } .filter-benefits .icn { width: 28px; height: 28px; text-align: center; background: #a1a0a0; display: inline-block; border-radius: 50%; margin-right: 10px; vertical-align: middle; line-height: 28px; position: relative; display: flex; align-items: center; justify-content: center; } .filter-benefits a { color: #494a4a; display: flex; align-items: center; justify-content: center; } /* .filter-benefits img { position: absolute; left: 0; top: 0; bottom: 0; right: 0; margin: auto;}*/ .filter-benefits a:hover, .filter-benefits li.is-active a { color: var(--second-color); } .filter-benefits a:hover .icn, .filter-benefits li.is-active a .icn { background: var(--second-color); } .blog-type-content { max-width: 850px; padding-left: 20px; } .blog-type-content .post-media { margin-bottom: 40px; } .blog-type-content .post-media:last-child { margin-bottom: 0; } .blog-type-content .media { margin-bottom: 20px; } .blog-type-content .post-title { color: #000; font-size: 1.5em; font-weight: 500; line-height: 1.2; position: relative; margin-bottom: 34px; } .blog-type-content .post-title a { color: #000; } .blog-type-content .post-title:after { background-color: #a1a0a0; width: 70px; height: 2px; position: absolute; left: 0; margin: 0; bottom: -15px; content: ""; display: block; } .bg-detail { background: url(images/bg-traingle.png) no-repeat 0 0; } .product-detail-image { border: solid 1px var(--first-color); } .social-ui { margin: 10px 0 0 0; } .social-ui li { text-align: center; display: inline-block; margin-right: 10px; margin-bottom: 10px; } .social-ui li a { padding: 0; display: block; } .social-ui li span { color: #616161; font-size: 1em; font-weight: 600; display: inline-block; } .social-ui li .icn { vertical-align: middle; display: inline-block; } .social-ui li .icn img { width: 17px; height: 16px; } .meal-chef { background-color: #49484d; } /*page-registration*/ .registration-page { min-height: 100%; } .registration-page #header { border-bottom: none; background: none; } .registration-page .after-header { height: auto; } .registration-page { background-attachment: fixed; background-repeat: no-repeat; background-size: cover; background-position: center; position: relative; } .registration-page:before { content: ""; position: fixed; top: 0; width: 100%; height: 300px; background-color: #fff; background-size: cover; clip-path: polygon(0% 0%, 0% 20%, 50% 80%, 100% 20%, 100% 0%); -webkit-clip-path: polygon(0% 0%, 0% 20%, 50% 80%, 100% 20%, 100% 0%); -webkit-transition: all ease .3s; -moz-transition: all ease .3s; -o-transition: all ease .3s; transition: all ease .3s; } .registration-page:after { content: ""; position: absolute; bottom: -10px; width: 100%; height: 300px; background-color: #f5bb41; background-size: cover; clip-path: polygon(100% 100%, 100% 100%, 50% 0%, 0% 100%, 0% 100%); -webkit-clip-path: polygon(100% 100%, 100% 100%, 50% 0%, 0% 100%, 0% 100%); -webkit-transition: all ease .3s; -moz-transition: all ease .3s; -o-transition: all ease .3s; transition: all ease .3s; } .fixed-header .registration-page:before, .fixed-header .registration-page:after { clip-path: polygon(0% 0%, 0% 40%, 50% 40%, 100% 40%, 100% 0%); -webkit-clip-path: polygon(0% 0%, 0% 40%, 50% 40%, 100% 40%, 100% 0%); z-index: 10; } .fixed-header .registration-page:after { bottom: -50px; z-index: -1; clip-path: polygon(100% 100%, 100% 80%, 50% 80%, 0% 80%, 0% 100%); -webkit-clip-path: polygon(100% 100%, 100% 80%, 50% 80%, 0% 80%, 0% 100%); } .registration-middle { padding-top: 150px; position: relative; z-index: 5; } .reg-blocl-wrapper { max-width: 578px; margin: 0 auto 50px; padding: 0; background: #fff; box-shadow: 0px 0 15px 10px rgba(0, 0, 0, 0.08); border-radius: 5px; } .page-tabs ul { margin: 0 auto; padding: 20px 10px; padding-bottom: 10px; text-align: center; } .page-tabs li { display: inline-block; margin: 0 3px; } .page-tabs li a { border-radius: 3px; background: #eaeaea; display: block; padding: 7px 30px; color: #000; font-size: 0.9375em; } .page-tabs li a.active { background: var(--second-color); } .page-tabs-data { display: none; } .page-tabs-data .form { padding: 10px 30px 30px 30px; } .registration-data {} .box-heading { text-align: center; color: #000; font-size: 1.8em; line-height: 1.2; margin: 0; text-transform: uppercase; position: relative; font-weight: 600; font-family: 'trend_hm_sansone'; } .captcha { line-height: 50px; } .captcha .captcha-img, .captcha .refresh-img { display: inline-block; max-width: 140px; margin-right: 10px; vertical-align: middle; } .captcha .refresh-img { display: inline-block; max-width: 24px; height: auto; } .copyright-reg { position: fixed; z-index: 1; left: 0; right: 0; bottom: 0; text-align: center; color: #000; margin: 25px auto; margin-bottom: 0; line-height: 1; font-size: 0.75em; padding: 10px 0 20px; } .product-description { padding-left: 50px; } .pro-name { margin: 0 0 35px 0; text-transform: uppercase; position: relative; font-weight: 600; font-family: 'trend_hm_sansone'; position: relative; } .pro-name.after-border::after { left: 30px; } .pro-name span.txt { font-family: 'trend_hm_sansone'; color: #000; font-size: 1.4em; line-height: 1; vertical-align: top; display: table; } .pro-name span.small-txt { display: block; font-size: 1.06rem; color: #8e8d8d; text-transform: none; font-weight: normal; padding-left: 30px; } .description { line-height: 1.5; margin-bottom: 15px; } .product-description h3 { font-size: 1.25em; padding: 0; margin: 0; color: #000; line-height: 1; margin-bottom: 20px; } .product-description .timings { color: #626262; font-size: 0.9em; } .product-description .timings span { font-weight: 600; font-size: 1rem; } .tags { margin: 10px 0; } .price-fetures { margin: 30px 0 10px; } .price-fetures ul li { display: table-cell; vertical-align: middle; border-right: solid 1px var(--border-color); padding: 0 20px; white-space: nowrap; margin-right: 12px; } .price-fetures ul li:first-child { padding-left: 0; } .price-fetures ul li:last-child { border-right: none; } .price-fetures .caption { display: inline-block; color: #000; font-weight: 600; } .price-fetures .main-price { display: block; color: var(--first-color); font-weight: 500; font-size: 1.5rem; } .price-fetures .select-small { max-width: 70px; height: 30px; line-height: 30px; display: inline-block; font-size: 0.875em; } .proceedtopay { padding: 15px 30px; /* font-size: 1.875em;*/ line-height: 1.2; height: auto; } .on-detail-chef-profile { position: relative; margin: 0 auto; max-width: 636px; color: #fff; } .on-detail-chef-profile:before { background: url(images/y-shape-big.png) no-repeat center center; width: 441px; height: 612px; content: ""; position: absolute; left: -64%; top: -50%; } .on-detail-chef-profile a { color: inherit; } .on-detail-chef-profile .avatar-info .name, .on-detail-chef-profile a, .on-detail-chef-profile .avatar-contact .phone { color: #fff; } .on-detail-chef-profile .action-profile { margin: 10px 0 0 0; } .on-detail-chef-profile .avatar-info { padding: 0px 0; } .login-wrapper { padding-top: 30px; } .login-form-front { padding: 25px 30px 15px 30px; } .not-yet-member { padding: 0 30px 30px 30px; text-align: center; } /*Popup CSS*/ .show-pop { bottom: 0; left: 0; position: fixed; right: 0; top: 0; } .pop-model-box { display: table; margin: 0 auto; height: 100%; } .pop-model-overlay { background-color: rgba(0, 0, 0, .55); bottom: 0; left: 0; position: fixed; right: 0; top: 0; display: none; } html.show-pop .pop-model .pop-model-overlay { display: block; } .pop-model { bottom: 0; left: 0; opacity: 0; position: fixed; right: 0; top: 0; z-index: 999; overflow: auto; visibility: hidden; transition: none; -webkit-transition: none } html.show-pop .pop-model { opacity: 1; visibility: visible; } .model-box-content { border-radius: 5px; max-width: 600px; min-width: 600px; padding: 30px 0; position: relative; display: table-cell; vertical-align: middle; transform: scale(0.5); -webkit-transform: scale(0.5); transition: 0.5s all ease-in-out; -webkit-transition: 0.5s all ease-in-out; } .model-box-mid { padding: 0; position: relative; background-color: #fff; } .pop-up-data { padding: 20px; } /*scroll*/ .pop-up-data { max-height: 350px; overflow-y: auto; } .pop-banner { border-bottom: solid 7px var(--first-color); } .pop-banner2 { height: 135px; border-bottom: solid 3px var(--first-color); } .pop-banner2 h2 { color: #000; padding: 50px 0; } .model-box-mid h2 { font-size: 1.2em; text-align: center; padding: 15px 0; } html.show-pop .pop-model .model-box-content { transform: scale(1); -webkit-transform: scale(1); } .hlp { font-size: 11px; } /* .dropdown-menu { position: absolute; background: #fff; border: solid 1px var(--first-color); z-index: 1; max-height: 300px; overflow-y: auto;} .dropdown-menu li { padding: 5px; position: relative;} .dropdown-menu li a { display: block;}*/ .after-arrow { position: relative; padding-right: 35px !important; } .after-arrow:after { content: ""; position: absolute; top: 10px; right: 10px; z-index: 1; border: solid #fff; border-width: 0 2px 2px 0; display: inline-block; padding: 4px; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -webkit-transition: all ease .3s; -moz-transition: all ease .3s; -o-transition: all ease .3s; transition: all ease .3s; transform-origin: center; } .user-trigger-active.after-arrow:after { transform: rotate(45deg); -webkit-transform: rotate(45deg); top: 8px; } .my-account-dropdown { position: absolute; right: 0; left: 0; top: 110%; background: #fff; border-radius: 3px; border: solid 1px var(--border-color); opacity: 0; visibility: hidden; -webkit-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); filter: alpha(opacity=0); -webkit-transition: all 300ms; -o-transition: all 300ms; transition: all 300ms; -webkit-transform-origin: top center; -moz-transform-origin: top center; -ms-transform-origin: top center; transform-origin: top center; } .my-account-toggle-open .my-account-dropdown { opacity: 1; visibility: visible; -webkit-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); filter: alpha(opacity=100); } .my-account-dropdown ul li { border-bottom: solid 1px var(--border-color) } .my-account-dropdown ul li:last-child { border-bottom: none; } .my-account-dropdown ul li a { font-size: 0.775em; color: var(--txt-color); border: transparent; } .mealkit-slider .over-detail h3 { margin: 10px 0; font-size: 1.188em; line-height: 1.2; display: inline-block; } .mealkit-slider .over-detail h3 a { color: inherit; line-height: inherit; } .mealkit-slider .slick-slide { margin: 0 10px; } .mealkit-slider-sticker-wrapper { padding: 10px; margin-left: auto; background: rgba(255, 255, 255, 0.86); } .mealkit-slider-sticker .txt-slip h3 { font-size: 2.375em; margin: 10px 0; } .mealkit-slider .recipe-features { margin-bottom: 15px; float: none; display: inline-block; } .mealkit-slider .recipe-features p { font-size: 0.875em; } .mealkit-featured-slider .slick-slide { margin: 0 15px; } .mealkit-featured-slider {} .mealkit-featured-slider .item { position: relative; } a.favourite, .meals-pattern2 .item a.favourite { position: absolute; right: 10px; z-index: 2; top: 10px !important; } .mealkit-featured-slider .item a.favourite { position: absolute; right: 15px; z-index: 2; top: 90px; } .meal-recipe-slider+a.favourite { top: 90px !important; } /*.mealkit-featured-slider .item a.favourite svg path, a.favourite svg path { fill: #ccc;}*/ /*.mealkit-featured-slider .item a.favourite.active svg path, a.favourite.active svg path { fill: var(--first-color);}*/ .mealkit-featured-slider .slick-slide.slick-current .item:after { content: normal; } .mealkit-featured-slider .over-slip { background: rgba(0, 0, 0, 0.55); padding: 0; position: absolute; bottom: 0; left: 0; right: 0; z-index: 1; padding: 10px 0; display: flex; justify-content: space-between; align-items: center; } .mealkit-featured-slider .over-slip h3 { color: #fff; line-height: 1.2; font-size: 1.1em; padding: 0px 10px; /*white-space: nowrap; text-overflow: ellipsis;*/ width: 198px; overflow: hidden; display: inline-block; vertical-align: middle; } .mealkit-featured-slider .over-slip h3 a { color: inherit; line-height: inherit; } .mealkit-featured-slider .over-slip .recipe-features { float: none; display: inline-block; vertical-align: middle; } .week-slider { margin: 20px auto; max-width: 640px; background: #fff; border-radius: 2px; font-size: 1em; position: relative; padding: 15px 10px; color: #000; } .week-slider .slick-arrow { position: absolute; z-index: 5; top: 50%; transform: translateY(-50%); background: #858835; border-radius: 50%; width: 40px; height: 40px; padding: 0; cursor: pointer; text-indent: -9999px; border: none; border: solid 2px #fff; } .week-slider .slick-prev { background: #f5bb41 url(images/retina/left-arrow.svg) no-repeat center; background-size: 20px; left: -30px; } .week-slider .slick-next { background: #f5bb41 url(images/retina/right-arrow.svg) no-repeat center; background-size: 20px; right: -30px; } .week-slider .slick-arrow:hover { background-color: rgba(0, 0, 0, 1); } .link-reset { float: left; } .link-keywords { float: right; } /**/ .location-search { border-radius: 10px; background-repeat: no-repeat; background-position: center; } .location-search .close-btn { top: -40px; right: -20px; } .location-popup-content { display: table; width: 100%; height: 300px; } .branding { position: relative; float: left; width: 50%; height: inherit; } .branding-logo { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 230px; margin: 0 auto; } .location-search-wrapper { background: #fff url(images/bg-search.jpg) no-repeat 0 0; background-size: 100%; border-radius: 10px; padding: 20px; float: right; height: 324px; width: 45%; margin-right: 30px; position: relative; margin-top: -12px; margin-bottom: -12px; overflow: hidden; } .search-location-form { margin-bottom: 10px; top: 50%; transform: translateY(-50%); position: relative; } .location-search-field { position: relative; margin-bottom: 15px; } .location-search-field:after { content: "\f455"; font-family: "Ionicons"; color: #b4b4b4; position: absolute; top: 6px; right: 16px; font-size: 24px; } input[type="text"].search-field { border-radius: 50px; border-width: 2px; height: 45px; padding-right: 37px; } .circlebutton input[type="submit"] { opacity: 0; padding: 0 !important; width: 60px; height: 60px; } .circlebutton { text-decoration: none; background-color: #000; width: 60px; height: 60px; border-radius: 100%; box-shadow: 0 0 4px rgba(0, 0, 0, 0.14), 0 4px 8px rgba(0, 0, 0, 0.28); text-align: center; line-height: 60px; position: absolute; right: 6px; bottom: -125px; border: none; cursor: pointer; font-size: 0; z-index: 1; } .search-location-form.form-focused .circlebutton { bottom: -1px; } .circlebutton:hover, .circlebutton:active, .circlebutton:focus { background-color: var(--first-color); } .circlebutton:before { content: "\f30f"; font-size: 30px; color: #fff; font-family: "Ionicons"; position: absolute; left: 20px; top: 0px; -ms-transition: all 500ms ease 0s; /* IE 9 */ -webkit-transition: all 500ms ease 0s; /* Chrome, Safari, Opera */ transition: all 500ms ease 0s; } .circlebutton:hover:before { -webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg); } .location-dropdown-menu { width: 100%; display: none; } .search-location-form.form-focused .location-dropdown-menu { display: block; top: 0; transform: none; } .location-dropdown-menu li { font-size: 0.875em; color: #626262; padding: 5px 15px; position: relative; } .location-dropdown-menu li a { display: block; color: inherit; position: relative; } .location-dropdown-menu li a:hover, .location-dropdown-menu li.is--active a { color: var(--first-color); padding-left: 15px; font-weight: 600; } .location-dropdown-menu li a:hover:after { content: ""; width: 5px; height: 5px; background: var(--first-color); display: block; position: absolute; top: 9px; left: 0; border-radius: 50%; } .scrollbox { overflow: auto; height: 235px; } .vertical-track { width: 1px; background-color: var(--border-color); } .vertical-handle { width: 10px; border-radius: 10px; margin-left: -4px; background-color: var(--first-color); } .address-page { margin: 20px auto; } .cart-sticky { position: fixed; z-index: 10; right: 0; left: 0; -webkit-transition: bottom 0.3s; transition: bottom 0.3s; } .cart-sticky.opened { bottom: 0 !important; -webkit-transition: bottom 0.3s; transition: bottom 0.3s; } .cart-head {} .cart-box-content { background: #2e2e2e; } .cart-box-content.opened {} .cart-item { padding: 10px; background: #fff; display: block; border-radius: 3px; margin: 10px 5px; width: auto; position: relative; } .cart-item:before, .cart-item:after { content: ""; display: table; line-height: 0; } .cart-item:after { clear: both; } .cart-carousel { position: relative; padding: 5px 50px; } .cart-carousel .slick-arrow { position: absolute; z-index: 5; top: 50%; transform: translateY(-50%); background: #858835; border-radius: 50%; width: 35px; height: 35px; padding: 0; cursor: pointer; text-indent: -9999px; border: none; } .cart-carousel .slick-prev { background: rgba(0, 0, 0, 0.75) url(images/retina/left-arrow.svg) no-repeat center; background-size: 13px; left: 10px; } .cart-carousel .slick-next { background: rgba(0, 0, 0, 0.75) url(images/retina/right-arrow.svg) no-repeat center; background-size: 13px; right: 10px; } .cart-carousel .slick-arrow:hover { background-color: background: rgba(0, 0, 0, 1); } .cart-item .pro-img { width: 36%; float: left; margin-right: 5px; } .cart-item .side-data { float: left; width: 60%; display: inline-block; vertical-align: top; position: relative; } .cart-item .cross { position: absolute; top: 2px; right: 7px; color: var(--first-color); z-index: 2; cursor: pointer; } .cart-item .small-qty { max-width: 50px; padding-right: 0; height: 30px; line-height: 30px; display: inline-block; font-size: 0.875em; } .cart-item a { color: #000; } .cart-item .price { font-size: 0.875em; padding: 0; white-space: nowrap; } .cart-item .price .multiply { display: inline-block; ; } .stick-cart-total { padding: 10px; color: #fff; } .subtotal, .subprice { padding: 5px 10px; display: block; color: #fff; } .fat-inactive { opacity: 0.50 } .fat-inactive, .fat-inactive a { cursor: not-allowed; } .layout--rtl { direction: rtl !important; } .bg-light-gray { background: #fafafa; border-bottom: solid 1px var(--border-color); } .morecontent span { display: none; } .addtocart--floated { position: fixed; right: 0; top: 50%; z-index: 1; } .addtocart-trigger { background: #000; border-radius: 50%; width: 60px; height: 60px; color: #fff; display: block; text-align: center; float: right; margin-right: 10px; margin-bottom: 10px; } .addtocart-trigger.opened { /* box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.333); */ } .addtocart-trigger i { color: inherit; font-size: 1.5em; line-height: 60px; } .target-div { background: #000; height: 60px; width: 0; border-radius: 60px; position: absolute; right: 75px; overflow: hidden; -webkit-transition: width 0.5s, height 1s; -moz-transition: width 0.5s, height 1s; -ms-transition: width 0.5s, height 1s; -o-transition: width 0.5s, height 1s; transition: width 0.5s, height 1s; } .target-div.opened { width: 177px; } .target-div input.qty { background: none; border: none; width: 45px; display: inline-block; color: #fff; text-align: center; vertical-align: middle; font-weight: 600; } .target-div .qnty-wrapper { padding: 0 15px; padding-right: 10px; } .target-div .qty-control { display: inline-block; line-height: 60px; vertical-align: middle; cursor: pointer; } .target-div .qty-control i { color: #fff; } .target-div .qnty-submit { display: inline-block; vertical-align: top; color: #fff; border-radius: 20px; height: 30px; line-height: 30px; background: var(--first-color); text-align: center; padding: 0 12px; margin: 15px 0 15px 10px; } .target-div .qnty-submit i { color: inherit; font-size: 1.5em; } .addons-wrapper { display: block; margin: 10px 0; position: relative; width: 100%; max-width: 350px; } .addons-wrapper.added--toppings .addons-trigger { width: auto; display: inline-block;; } .addons-trigger { display: inline-block; cursor: pointer; line-height: 1; color: #fff; font-size: 0.9em; margin: 10px 0; border: solid 1px #333; border-radius: 2px; padding: 10px; padding-right: 30px; background: #333; } .addons-trigger:after { border-color: #fff; } .addons-trigger.opened:after { margin-top: -2px; transform: rotate(133deg) translateY(-50%); } .addons-trigger i { color: inherit; } .addons-scroll { max-height: 350px; } .addons-target.opened { top: 46px; opacity: 1; visibility: visible; } .addons-target ul li { border: solid 1px transparent; padding: 10px 10px; margin: 10px; border-radius: 2px; position: relative; } .added--toppings .addons-target ul li { border: none; border-bottom: solid 1px var(--border-color); } .added--toppings .addons-trigger { font-size: 0.95em; padding: 5px; padding-right: 30px; margin: 0; } .added--toppings .addons-target.opened { top: 27px; } .addons-target ul li:hover, .addons-target ul li.is--selected { border-color: var(--first-color); cursor: pointer; } .addons-target ul li.is--selected:before { color: var(--first-color); position: absolute; top: 3px; right: 5px; } .addons-target .pro-image { min-width: 50px; padding: 5px; border: solid 1px var(--border-color); } .addons-target .name, .addons-target .addon--quantity { font-weight: 400; color: inherit; font-size: 0.8em; display: block; padding: 10px 0; } .addons-target .price { color: #000; font-weight: 600; display: block; padding: 7px 0; } .recipe-header { margin: 0 auto; max-width: 550px; } .recipe-toggle-trigger { float: right; } .recipe-data { display: none; } .recipe-data.is-selected { display: block; } .addon-image { display: inline-block; vertical-align: middle; margin-right: 5px; } .addon-image img { border-radius: 50%; width: 50px; height: 50px; min-width: 50px; } .addon-name { display: inline-block; } .reset-all {} .available-points { border: solid 1px var(--first-color); padding: 0 5px; border-radius: 2px; text-align: center; font-size: 1.5em; color: var(--first-color); } .available-points .icn { color: var(--first-color); margin-right: 5px; font-size: 1.5em; vertical-align: middle; } .small-txt { font-size: 0.88rem; } .share-list { margin: 10px 0; } .share-list li { display: inline-block; vertical-align: middle; text-align: center; min-width: 170px; margin-bottom: 5px; } .share-list li a { text-align: left; border: solid 1px var(--border-color); display: block; padding: 10px 15px; } .share-list li a:hover { opacity: 0.58; } .share-list li img { margin: 0 auto; display: table; } .share-list li .icn { display: inline-block; vertical-align: middle; margin-right: 5px; } .or { max-width: 150px; margin: 0 auto; position: relative; text-align: center; margin-top: 100px; } .or span { font-size: 1.1em; background: #fff; padding: 0 8px; line-height: 1; margin: 0 auto; display: inline-block; position: relative; z-index: 1; } .or:after { content: ""; background: #ddd; height: 1px; width: 100%; position: absolute; top: 10px; left: 0; right: 0; } .small-container { max-width: 800px; } .gift-cart { padding: 70px 0; } .gift-card-wrapper { padding-right: 50px; text-align: center; } .gift-poster { text-align: center; margin: 0 auto; padding: 30px 0; } .gift-poster img { margin: 0 auto; } .inline-block li { display: inline-block; } .gift-card-wrapper .or { padding: 0; margin: 20px auto; } .note { font-size: 0.80rem; font-style: italic; } .alert-text { font-size: 0.80rem; font-style: italic; color: red; line-height: 1.2; } .alert-text i { color: inherit; } .confirmation-page { max-width: 700px; margin: 50px auto; text-align: center; } .confirmation-page-title { color: #a5d76e; font-size: 3.5em; line-height: 1.2; margin: 0 0 30px 0; text-transform: uppercase; position: relative; font-weight: 700; font-family: 'trend_hm_sansone'; text-align: center; } .confirmation-page-title .icon { max-width: 100px; display: block; margin: 10px auto; } .payment-declined .confirmation-page-title { color: #e24c4b; } .total-payment { color: var(--first-color); } .wallet-wrap { border: solid 1px var(--border-color); border-radius: 2px; background: #fff; padding: 15px; margin-bottom: 20px; } .hybrid-box { display: inline-block; vertical-align: top; } .paybox { padding: 15px; border: solid 1px var(--border-color); border-radius: 2px; background: #fff; min-width: 195px; } .paybox p, .remWalletBal { font-size: 0.78em; margin: 0; } .paybox .amount { font-weight: 600; display: block; } .sign { margin: 28px 15px; font-weight: 600; margin: } .make-payment-wrapper {} .payment_methods_ul { width: 100% !important; max-height: 275px; padding-right: 20px; } .payment_methods_list li { border: solid 1px var(--border-color); border-radius: 2px; display: block; margin-bottom: 10px; position: relative; font-size: 0.8em; } .payment_methods_list li a { color: inherit; display: block; line-height: 1.4; padding: 10px 15px; } .payment_methods_list li.is-active, .payment_methods_list li:hover { border-color: var(--first-color); color: var(--first-color); } .payment-here { padding: 15px; border: solid 1px var(--border-color); } .payment-here .you-pay { background: #f8f8f8; padding: 15px; } .tbl-ul>li { display: table; width: 100%; padding: 5px 0; } .tbl-ul .left-cell, .tbl-ul .right-cell { display: table-cell; } .tbl-ul .left-cell { width: 30%; } .tbl-ul .right-cell { width: 70%; } /*contact us page*/ .location { width: 100%; position: relative; } .location iframe { height: 540px; vertical-align: top; width: 100%; } .contact-cell { text-align: center; margin: 0px auto; } .contact-cell p { line-height: 1.5; font-size: 15px; margin: 0; } .contact-cell a { color: #ff7348; } .social_media { margin: 10px 0 0; } .social_media>li { display: inline-block; vertical-align: middle; margin-right: 5px; } .social_media a { background-color: #9c9b9b; border-radius: 50%; display: table; height: 28px; line-height: 24px; text-align: center; vertical-align: middle; width: 28px; } .social_media a svg { color: #fff; height: 16px; margin: 0 auto; vertical-align: middle; width: 16px; } .social_media a svg path { fill: #fff; } .contact-cell a { color: #ff7348; } .contact-cell img { display: inline-block; margin: 10px auto; } .aligner { display: flex; align-items: center; justify-content: center; } .aligner-item { flex: 1; } .aligner-item--top { align-self: flex-start; } .aligner-item--bottom { align-self: flex-end; } .aligner-item--fixed { flex: none; max-width: 50%; } .margin-auto { margin: 0 auto; float: none; } .sponsored-block { padding-left: 80px; } .sponsored-block .product-grid-item { border-radius: 3px; padding: 15px; border: solid 1px var(--border-color); background: #f2f2f2; } .view--more { position: relative; margin-top: -80px; padding: 70px 0 0 0; background: rgba(255, 255, 255, 0.13); background: -moz-linear-gradient(top, rgba(255, 255, 255, 0.13) 0%, rgba(255, 255, 255, 1) 34%, rgba(255, 255, 255, 1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0.13)), color-stop(34%, rgba(255, 255, 255, 1)), color-stop(100%, rgba(255, 255, 255, 1))); background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.13) 0%, rgba(255, 255, 255, 1) 34%, rgba(255, 255, 255, 1) 100%); background: -o-linear-gradient(top, rgba(255, 255, 255, 0.13) 0%, rgba(255, 255, 255, 1) 34%, rgba(255, 255, 255, 1) 100%); background: -ms-linear-gradient(top, rgba(255, 255, 255, 0.13) 0%, rgba(255, 255, 255, 1) 34%, rgba(255, 255, 255, 1) 100%); background: linear-gradient(to bottom, rgba(255, 255, 255, 0.13) 0%, rgba(255, 255, 255, 1) 34%, rgba(255, 255, 255, 1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ffffff', GradientType=0); } .chef-box { padding: 15px; background: #f2f2f2; border-radius: 3px; border: solid 1px var(--border-color); display: block; } .chef-box .avatar { margin: 10px auto; } .morecontent .js_fatbit_more_link { text-decoration: underline; color: var(--first-color); } .registration-page .navs--main>ul>li>a, .registration-page .accounts-link ul>li>a { color: #333; } .registration-page t { color: #fff; } .registration-page .accounts-link ul>li.bordered>a { border-color: #333; } .registration-page .accounts-link ul>li.filled>a { color: #fff; } /*  [ added on 30 june 2018 */ .lang-selector { position: relative; margin: 0; display: inline-block; float: right; } .lang-selector .lang-selector__trigger { position: relative; display: inline-block; padding: 0 18px 0 25px; color: inherit; font-size: 12px; text-align: left; } .lang-selector .lang-selector__trigger:after { position: absolute; right: 0; top: 8px; content: ""; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid #fff; } .lang-selector .lang-selector__trigger .svg-icon { position: absolute; left: 0; top: 3px; width: 14px; height: 14px; overflow: hidden; } .lang-selector .lang-selector__trigger .svg-icon svg { fill: #fff; } .lang-selector .lang-selector__target { position: absolute; right: 0; top: 31px; background: #fff; box-shadow: 0 10px 5px 5px rgba(0, 0, 0, 0.1); border-radius: 0 0 3px 3px; z-index: 2; min-width: 150px; text-align: left; } .lang-selector .lang-selector__target ul li { border-bottom: 1px solid #ddd; } .lang-selector .lang-selector__target ul li:last-child { border-bottom: none; } .lang-selector .lang-selector__target ul li a { display: block; padding: 8px 10px; font-size: 12px; color: #000; text-transform: uppercase; } .lang-selector .lang-selector__target ul li a:active, .lang-selector .lang-selector__target ul li a:hover { background: rgba(0, 0, 0, 0.05); } .product-content .product-name { padding-left: 24px; position: relative; } .product-content .product-name .non-veg, .product-content .product-name .veg { position: absolute; left: 0; top: 0; } .favourite { right: 20px; width: 36px; height: 36px; border-radius: 100%; background: rgba(255, 255, 255, 0.7); box-shadow: 0 0 5px 5px rgba(0, 0, 0, 0.05); } .favourite .svg-icn { position: absolute; left: 0; top: 0; right: 0; margin: auto; width: 16px; height: 16px; bottom: 0; } .favourite .svg-icn svg { width: 100%; height: 100%; } .favourite .svg-icn svg path { fill: #999; } .favourite.active { background: var(--first-color); } .favourite.active .svg-icn svg path { fill: #fff; } .product-detail-image .favourite { right: 30px; } .header__secondary { background: #000; padding: 8px 0; color: #fff; position: relative; z-index: 11; transition: all 0.5s; -webkit-transition: all 0.5s; -ms-transition: all 0.5s; } .location-selector { position: relative; display: inline-block; float: left; margin: 2px 0 0; } .location-selector>a { font-size: 12px; color: inherit; padding: 0 15px 0 20px; position: relative; display: block; } .location-selector>a .ion-ios-location { font-size: 18px; position: absolute; left: 0; top: -1px; line-height: 1; } .location-selector>a:after { position: absolute; right: 0; top: 8px; content: ""; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid #fff; } .not-yet-member .button { height: 40px; line-height: 40px; min-width: 200px; text-align: center; background: #000; color: #ffff; border-color: #000; } .not-yet-member .button span.txt { color: #fff; } .favourite.favourite--static { position: relative; right: auto; top: auto !important; display: inline-block; } .section-headings.section-headings--new h2 { display: inline-block; vertical-align: middle; margin-right: 10px; } .section-headings.section-headings--new h2 .size28 { margin-top: 3px; } .flat-tabs { display: table; margin: 70px auto 20px; } .flat-tabs li { display: inline-block; vertical-align: top; margin: 0 -3px; } .flat-tabs li a { display: block; padding: 20px 50px; border: 1px solid var(--border-color); color: #333; font-size: 1.3em; position: relative; } .flat-tabs li.is-active a { background: var(--first-color); border-color: var(--first-color); color: #fff; z-index: 1; } .container--narrow { max-width: 1000px; margin: auto; } .container--narrow .profile-dv .avatar { border: 1px solid var(--border-color); margin-right: 30px; position: relative; overflow: hidden; } .container--narrow .profile-dv .avatar img { position: absolute; left: 0; top: 0; bottom: 0; right: 0; margin: auto; } .container--narrow .avatar-info h3 { font-size: 1.2em; font-weight: 500; } .container--narrow .avatar-info .review-txt { margin: 5px 0; font-size: 0.8em; line-height: 1.8; color: #888; font-weight: 300; } .container--narrow .discuss-area { background: rgba(0, 0, 0, 0.04); padding: 50px 50px 40px; margin-bottom: 30px; } .container--narrow .discuss-area .add-comnt { max-width: 100%; } .container--narrow .review-item { /* border-bottom:1px solid rgba(0,0,0,0.08); */ padding: 20px; -webkit-transition: all .25s ease; -moz-transition: all .25s ease; -ms-transition: all .25s ease; -o-transition: all .25s ease; transition: all .25s ease; } .container--narrow .review-item:nth-child(odd) { background: rgba(0, 0, 0, 0.03); } .container--narrow .review-item:hover { box-shadow: 0 20px 20px 5px rgba(0, 0, 0, 0.03); } /* .container--narrow .review-item:first-child{border-top:1px solid rgba(0,0,0,0.08);;} */ .container--narrow .review-item:last-child { margin-bottom: 20px; } .buyer-div fieldset [class*="col-"] { padding: 0; } .recipientdetail fieldset [class*="col-"]:first-child { padding-left: 0; } /* ] */ =======:root { --border-color: #dbdbdb; --first-color: #f37242; --second-color: #f5bb41 } html { font-size: 16px; height: 100% } .btn i { display: inline-block; margin-right: 5px; vertical-align: middle; color: inherit } .btn { overflow: hidden } .btn:before { content: ""; display: block; width: 50%; height: 100%; background: linear-gradient(to right, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .3) 100%); position: absolute; top: 0; left: -75%; z-index: 2; -ms-transform: skewX(-25deg); transform: skewX(-25deg) } .btn:hover:before { animation: shine 1.2s } @keyframes shine { 100% { left: 125%; } } .btn.btn--block { display: block !important; width: 100% !important; text-align: center; } .btn.btn--small { line-height: normal; height: auto; padding: 5px 15px; text-transform: none; } .btn.btn--large { line-height: 54px; height: 54px; padding: 0 40px; font-size: 1.2em; } .btn.btn--xlarge { line-height: 64px; padding: 0 50px; font-size: 2em; } .btn.btn--xsmall { height: auto; line-height: 1.5; padding: 5px 8px; } .btn.btn--bordered { background-color: transparent; } .btn.btn--white { background-color: #fff; color: #333; } .container { margin: 0 auto; max-width: 1300px; padding: 0 15px; } .container--1200 { max-width: 1200px; } #header { position: fixed; left: 0; right: 0; top: 0; width: 100%; border-bottom: solid 1px var(--border-color); background: #fff; z-index: 14; text-align: center; min-height: 78px; background-color: var(--second-color); transition: all .5s; -webkit-transition: all .5s; -ms-transition: all .5s } .header-inner { display: flex; justify-content: space-between; align-items: center } .after-header { height: 116px } .logo { float: left; margin: 9px 0; max-width: 155px } .right-head { display: flex; justify-content: space-between; align-items: center } .accounts-link { margin: 0; margin-left: 20px; float: right } .accounts-link>ul>li { display: inline-block; position: relative; vertical-align: top; width: auto } .accounts-link ul>li>a { display: block; color: #000; font-size: .9em; font-weight: 500; border: solid 1px #000; border-radius: 3px; padding: 10px 20px; line-height: .9375em; vertical-align: top; } .accounts-link ul>li.bordered>a { border-color: #fff; } .accounts-link .ion-ios-location, .accounts-link .ion-android-arrow-dropdown { color: inherit; line-height: 0; font-size: 12px; vertical-align: top; } .accounts-link .filled>a { background: #000; color: #fff; } .hero-slider { position: relative; overflow: hidden; width: 100%; height: 656px; } .zs-enabled { position: relative } .zs-enabled .zs-slideshow, .zs-enabled .zs-slides, .zs-enabled .zs-slide { position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; } .zs-enabled .zs-slideshow .zs-slides .zs-slide { background: transparent none no-repeat 50% 50%; background-size: cover; position: absolute; visibility: hidden; opacity: 0; -webkit-transform: scale(1.2, 1.2); -moz-transform: scale(1.2, 1.2); -ms-transform: scale(1.2, 1.2); -o-transform: scale(1.2, 1.2); transform: scale(1.2, 1.2); } .zs-enabled .zs-slideshow .zs-slides .zs-slide.active { visibility: visible; opacity: 1; } .first-fold { position: relative; } .banner { position: relative; } .slide-img { background-repeat: no-repeat; background-position: center top; position: relative; background-size: 100%; } .slide-img::before { padding-bottom: 32.8%; content: ""; display: block; } .banner-text { position: absolute; top: -73px; right: 50%; margin-right: -680px; z-index: 2; color: #fff; width: 456px; height: 456px; display: block; border-radius: 50%; background: rgba(243, 114, 66, 0.89); text-align: center; padding: 122px 0 0; } .banner-text h2 { font-size: 1.8em; line-height: 1.3; color: inherit; margin: 15px 0; padding: 0 50px; font-family: 'trend_hm_sansone'; } .banner-text p { font-size: 1em; line-height: 1.3; color: inherit; margin: 0 0 30px; padding: 0 50px; } .banner .slick-arrow { width: 64px; height: 64px; border: none; border-radius: 50%; background-color: #fff; font-size: 0; position: absolute; bottom: 8%; left: 185px; cursor: pointer; z-index: 3; background-image: url(data:image/png; base64, iVBORw0KGgoAAAANSUhEUgAAABcAAAASCAYAAACw50UTAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAKdJREFUeNpiZLBbwkArwERAfg4Q15FrOAsBg5OR+E3Ucjm6wYpAzEwNl88H4gQk/gIgTgHiv5S6nGoGoxtOVYORDae6wTDDW9AMZoDy/wDxf0owyPB8WmaiKbQ0vBKIp6OJg/iMlGJmBvkgkGFbgVgKiI2hhpsCsThUnGwAMxwEtlDbAmTDqW4BuuG4LJCCilOl4EoH4llI/AvULnLTkQyeTo7hAAEGAO4gMyf1YJcwAAAAAElFTkSuQmCC); background-repeat: no-repeat; background-position: center; } .banner .slick-next.slick-arrow { left: 290px; background-image: url(data:image/png; base64, iVBORw0KGgoAAAANSUhEUgAAABcAAAASCAYAAACw50UTAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAJ5JREFUeNpiZLBbwkArwESB3jogno9PAQsFBjci8ROp5XJmIFZE4ifg8gEzg3wQqYb/B+ItQCwHxAZQMRCtAMQbKTWcaAvINZwoCygxnKAFLFAF1AagSH7KCMxE/2mUh74wMdAOTAEZzkgFPB3N4FlAXEkNl08D4kw0g9MpLVvwGkyp4XgNpsRwggZTYvhlQgZTUuROR8qN6bgUAQQYAM62JOWQzEWnAAAAAElFTkSuQmCC) } .section-headings { margin: 0 auto; text-align: center; margin-bottom: 45px; } .section-headings.left-theme { text-align: left; } .section-headings.left-theme h2 { text-align: left; } .section-headings.left-theme h2:after { left: 0; margin: 0; } .section-headings h2 { color: #000; font-size: 1.8em; line-height: 1.2; margin: 0 0 25px; text-transform: uppercase; position: relative; font-weight: 600; font-family: 'trend_hm_sansone'; } .section-headings h2.no-after:after { content: normal } .section-headings h2:after, .after-border:after { background-color: #a1a0a0; width: 70px; height: 3px; position: absolute; left: 0; right: 0; margin: 0 auto; bottom: -10px; content: ""; display: block; } .after-border { position: relative; } .after-border:after { left: 0; right: auto; } .section-headings h4 { color: #393e4a; margin: 0 auto; font-size: 1.5em; margin-bottom: 20px; line-height: 1.7; padding: 0; max-width: 700px; } .section-headings p { color: #393e4a; font-size: 1em; margin-bottom: 20px; line-height: 1.7; padding: 0; } .section-headings p em { font-style: italic; } .section-headings .blue { color: #1984bd; } .section-headings.white-theme h2 { color: #fff } .white-theme h2:after { background: #fff; } .section { padding: 40px 0; } .steps .step-item { text-align: center; } .steps .count { width: 45px; height: 45px; display: block; text-align: center; font-size: 1.875em; color: #c5c4c0; border-radius: 50%; margin: 10px auto; border: solid 1px var(--border-color); font-weight: 600; } .steps .icn { margin: 15px auto; display: block; max-width: 110px; min-height: 110px; } .steps .icn img { display: inline-block; } .steps h3 { color: #2e2e2e; font-weight: 600; font-size: 1.125em; margin: 10px auto; } .steps p { font-size: .875em; } .meals-pattern { background: url(images/meal-pattern.png) repeat 0 0; } .meals-pattern2 { border-top: solid 1px #ccccca; border-bottom: solid 1px #ccccca; background: url(images/meal-pattern-light.png) repeat 0 0; } .meals-section { position: relative; } .featured-slider { margin-bottom: 30px } .featured-slider .slick-arrow { position: absolute; z-index: 5; top: 50%; transform: translateY(-50%); background: #858835; border-radius: 50%; width: 75px; height: 76px; padding: 0; cursor: pointer; text-indent: -9999px; border: none } .featured-slider .slick-prev { background: rgba(0, 0, 0, 0.75) url(images/retina/left-arrow.svg) no-repeat center; background-size: 40px; left: 50%; margin-left: -800px; } .featured-slider .slick-next { background: rgba(0, 0, 0, 0.75) url(images/retina/right-arrow.svg) no-repeat center; background-size: 40px; right: 50%; margin-right: -800px; } .featured-slider .slick-arrow:hover { background-color: background: rgba(0, 0, 0, 1) } .featured-slider .slick-slide { margin: 0 76px; position: relative; } .featured-slider .slick-slide .item { display: inline-block; position: relative; width: 100%; } .featured-slider .slick-slide.slick-current .item:after { position: absolute; content: ""; border: solid 3px #fff; left: 3%; top: 5%; right: 3%; bottom: 5%; } .slider-sticker-wrapper { position: absolute !important; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 1; background: rgba(255, 255, 255, 0.99); max-width: 372px; margin-left: -328px; padding: 40px; } .pagingInfo { height: 45px; width: 70px; color: #a7a8a8; font-size: 1.25em; font-weight: 300; position: relative; } .pagingInfo:after { -webkit-transform: rotate(32deg); -moz-transform: rotate(32deg); -o-transform: rotate(32deg); -ms-transform: rotate(32deg); transform: rotate(32deg); background: #a7a8a8; content: ""; height: 60px; position: absolute; right: 36px; top: -5px; width: 1px; } .pagingInfo span { line-height: 1; display: block; color: #a7a8a8; padding: 2px 8px; } .pagingInfo span:last-child { text-align: right; } .txt-slip h3 { color: #000; font-size: 4.375em; font-weight: 300; line-height: 1; margin: 20px 0; } .txt-slip p { line-height: 1.5; font-weight: 300; margin: 0 } .food-system { background: var(--second-color) } .link { color: inherit; font-size: 1rem; line-height: 1 } .link .icn { color: inherit !important } .link.link-white { color: #fff } .arrow { margin-left: 10px; width: 20px; height: 20px; vertical-align: sub; display: inline-block } .arrow.first-color svg { fill: var(--first-color) } .arrow.arrow--white svg { fill: #fff } .arrow svg { vertical-align: top } .link.link--white { color: #fff } .weekly-slider .slick-arrow { position: absolute; z-index: 5; top: 50%; transform: translateY(-50%); background: #858835; border-radius: 50%; width: 75px; height: 76px; padding: 0; cursor: pointer; text-indent: -9999px; border: none } .weekly-slider .slick-prev { background: #f5bb41 url(images/retina/left-arrow.svg) no-repeat center; background-size: 40px; left: 50%; margin-left: -486px } .weekly-slider .slick-next { background: #f5bb41 url(images/retina/right-arrow.svg) no-repeat center; background-size: 40px; right: 50%; margin-right: -486px } .weekly-slider .slick-arrow:hover { background-color: background: rgba(0, 0, 0, 1) } .weekly-slider .slick-slide { margin: 0 25px; position: relative; border: solid 3px transparent } .slick-slide .slide-img { width: 100% } .over-detail { position: absolute; left: 50%; right: 0; top: 50%; text-align: center; display: block; transform: translate(-50%, -50%); opacity: 0; visibility: hidden; z-index: 2 } .over-detail .favourites { background-image: url(images/retina/favorite.svg); background-position: center; background-repeat: no-repeat; width: 32px; height: 32px; margin: 0 auto; background-size: 32px } .over-detail .favourites.favourited { background-image: url(images/retina/favorite-active.svg) } .weekly-slider .slick-slide.slick-current:hover { border-color: #f5bb41 } .weekly-slider .slick-slide.slick-current:hover:after { position: absolute; height: 100%; width: 100%; top: 0; bottom: 0; left: 0; right: 0; content: ""; background: rgba(72, 71, 75, 0.75); display: block; z-index: 1 } .weekly-slider .slick-slide.slick-current:hover .over-detail { opacity: 1; visibility: visible } .over-detail .time .hrs { display: block; color: #fff } .over-detail .time img { display: inline-block } .over-detail h3 { color: #fff; font-size: 1.8em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis } .over-detail h3 a { color: inherit } .over-detail .price { color: #fff; font-size: 1.5em; font-weight: 600 } .over-detail p { color: #fff; font-size: 1.125em } .circle-image-wrapper { margin: 0 auto; position: relative; width: 423px; height: 423px; border-radius: 50%; border: solid 5px var(--second-color) } .circle-image-wrapper:before { background: url(images/y-shape.png); width: 326px; height: 452px; display: block; position: absolute; content: ""; left: -230px; top: -41px; z-index: 1 } .circle-image-wrapper:after { border: solid 3px #fff; left: 22px; top: 22px; right: 22px; bottom: 22px; display: block; position: absolute; content: ""; z-index: 1; border-radius: 50% } .circle-image-wrapper .circle-image { border-radius: 50%; overflow: hidden } .side-txt { padding: 50px 0 0 } .side-txt .section-headings h2 { text-align: left } .side-txt .section-headings h2:after { left: 0; margin: 0 } .side-txt ul { margin: 35px 0 } .side-txt li { display: inline-block; vertical-align: top; margin: 5px 0 } .side-txt .icn { display: inline-block; vertical-align: top; text-align: center; border-radius: 50%; border: solid 2px #fff; width: 59px; height: 59px; margin-right: 10px } .side-txt .icn img { display: inline-block; padding: 10px 0 } .side-txt p { display: inline-block; vertical-align: top; color: #fff; font-size: 1.125em; max-width: 100px; margin: 0; padding-top: 10px; line-height: 1.2 } .btn--bordered { border: solid 2px var(--first-color); color: var(--first-color) } .btn--bordered:hover { border: solid 2px var(--second-color); color: var(--second-color) } .btn--bordered:hover .arrow.first-color svg { fill: var(--second-color) } .btn--bordered-white { border-color: #fff; color: #fff; background: none } .btn--bordered-white:hover { border-color: inherit; color: inherit } .btn--bordered-black { border-color: #000; color: #000; background: none } .btn--bordered-black:hover { border-color: #000; color: #000; background: none } .testimonial-box { border-radius: 2px; border: solid 1px var(--border-color); margin: 0 12px; padding: 35px } .testimonial-box .testimonial-txt { color: #575757; font-style: italic; font-size: 1em; line-height: 1.5; font-weight: 300; margin: 0; padding: 60px 0 50px; position: relative; height: 300px } .testimonial-box .testimonial-txt:before { content: ""; position: absolute; top: 0; left: 0; background: url(images/qoute.png) no-repeat 0 0; width: 53px; height: 43px; display: block } .testimonial-box .from .img { float: left; border-radius: 50%; overflow: hidden; margin-right: 10px } .testimonial-box .from p { color: #2a2a2a; font-size: 1.2375em; padding: 5px 0 0 } .testimonial-box .from p span { font-size: 1.0625rem; color: var(--first-color); display: block } .testimonial-slider .slick-dots { margin: 30px auto; text-align: center } .testimonial-slider .slick-dots li { border: 1px solid transparent; border-radius: 50%; display: inline-block; margin: 0 2px; padding: 3px } .testimonial-slider .slick-dots li button { background: #c9c8c8; border: medium none; border-radius: 50%; display: block; height: 11px; position: relative; text-indent: -9999px; width: 11px } .testimonial-slider .slick-dots li.slick-active button { background: var(--first-color); border-color: #fff } .testimonial-slider .slick-dots li.slick-active { border: 1px solid var(--first-color) } .footer { background: url(images/bg-footer.jpg) no-repeat center bottom; border-top: solid 1px var(--border-color) } .newsletter { margin: 0 auto; max-width: 508px; padding: 0; text-align: center } .newsletter h4 { color: #000; font-size: 1.8em; padding: 0 } .newsletter p { color: #636262; font-size: 1em } .newsletter-form { position: relative; margin-top: 20px } .newsletter-form input[type="text"] { background: none; border: solid 1px #c8c6c6; height: 40px; border-radius: 1px; text-align: left; padding-right: 152px } .newsletter-form input[type="submit"] { background: #49484d; color: #fff; border: none; border-radius: 1px; height: 40px; position: absolute; font-size: 1em; right: 0; top: 0; padding: 0 20px } .newsletter-form input[type="submit"]:hover { background: var(--first-color) } .middle-footer { position: relative; padding-top: 250px } .f-links { color: #000 } .f-links h3, .f-heading { color: inherit; font-size: 1.125em; font-weight: 600; padding: 5px 0; text-transform: uppercase; margin-bottom: 15px } .f-links li { color: #262529; font-size: .9375em; font-weight: 300; padding: 5px 0 } .f-links li a { color: inherit; font-size: inherit; position: relative; text-decoration: none; font-weight: 400 } .f-links li a:hover { color: #976600 } .f-links li a:before { background: #976600; bottom: 0; content: ""; height: 1px; left: 0; position: absolute; right: 100%; transition-duration: .3s; transition-property: right; transition-timing-function: ease-out } .f-links li a:hover:before { right: 0 } .f-heading span { display: block; color: inherit; font-size: .9em; font-weight: 300; text-transform: none } .app-adds { max-width: 316px; text-align: center; margin: 0 auto; position: absolute; left: 0; right: 0; padding: 50px 0 0 } .app-adds a { color: var(--third-color); font-size: 1.06em } .social-media { margin: 0 auto; text-align: center; display: block; padding-top: 40px } .social-media li { display: inline-block; padding-left: 15px; vertical-align: middle } .copy-right { font-size: .8325em; padding: 0; margin: 4px 0; color: #9c7421; line-height: 1.5 } .checkout-nav { border-bottom: solid 1px var(--border-color); position: relative; padding: 0; text-align: center } .checkout-nav ul { white-space: nowrap; width: 100%; overflow-x: auto } .checkout-nav ul li { display: inline-block; text-align: center; position: relative; padding: 35px 10px; vertical-align: top; min-width: 160px; margin: 0 20px } .checkout-nav ul li a { position: relative; display: block; max-width: 170px; margin: 0 auto; -webkit-filter: grayscale(100%); filter: grayscale(100%) } .checkout-nav ul li a:after { content: ""; position: absolute; right: 25px; top: 20px; background: url(images/retina/icn-tick.svg); width: 18px; height: 18px; display: block } .checkout-nav .icn { display: inline-block; margin: 0 auto; text-align: center; vertical-align: middle; max-width: 44px; width: 44px; height: 44px } .checkout-nav .txt { color: #83b229; font-size: 1.125em; display: block; padding: 5px 0; text-align: center } .checkout-nav ul li a { opacity: .25 } .checkout-nav .icn svg { fill: #83b229 } .checkout-nav .is-active { opacity: 1 } .checkout-nav .is-active:after { background: url(images/retina/icn-tick-active.svg) } .checkout-nav .is-active .icn svg { fill: var(--first-color) } .checkout-nav .is-active .txt { color: var(--first-color) } .checkout-nav .is-active { -webkit-filter: grayscale(0%); filter: grayscale(0%) } .checkout-nav ul li a.completed { -webkit-filter: grayscale(0%); filter: grayscale(0%); opacity: 1 } .checkout-data { margin: 0 auto; padding: 0 } .checkout--data { margin: 0 auto; max-width: 700px } .review-checkout--data { margin: 0 auto; margin-right: 3% } .login-checkout--data, .billing-checkout--data, .payment-checkout--data { max-width: 800px; margin: 0 auto } .tab-data { display: none } .login-data, .billing-data, .shipping-data, .payment-data { max-width: 730px; margin: 0 auto } .tab-heading { color: #000; font-size: 2.1875em; line-height: 1.2; margin: 40px 0; text-align: center; text-transform: uppercase; position: relative; font-weight: 600; font-family: 'trend_hm_sansone' } .tabs-left { float: left; width: 50%; border-right: solid 1px var(--border-color); padding: 0 50px 0 0 } .tab-data .box-heading { font-family: 'Poppins', sans-serif; text-transform: none; color: #000; font-size: 1.666em; font-weight: 500; margin: 15px 0 0 } .box-heading span { display: block; font-size: .975rem; font-weight: 400 } .login-form { margin: 40px 0 0 } .login-form fieldset { margin-bottom: 15px } .connect { text-align: center } .connect a { vertical-align: top; border-radius: 2px; display: inline-block; max-width: 290px; margin: 10px 0; color: #fff; text-transform: uppercase } .connect a .svg svg { fill: #fff; width: 20px; height: 20px; vertical-align: top } .connect a.fb { background: #3957a0 } .connect a.gp { background: #de4331 } .tabs-right { float: left; width: 50%; padding-left: 50px } .checkbox-wrapper li { background: #eee; padding: 15px 10px; margin: 15px 0; display: block; border-radius: 2px } .section-head { display: table; width: 100%; border-bottom: solid 1px var(--border-color) } .section-head .box-heading { display: inline-block } .section-head .right-section { float: right } .section-bottom { display: table; width: 100%; padding: 20px 0; border-top: solid 1px var(--border-color) } .section-bottom p { margin: 0 } .all-addresses li { padding: 20px 25px 20px 50px; float: left; position: relative; width: 50%; border-bottom: solid 1px var(--border-color) } .all-addresses li:nth-child(even) { border-left: solid 1px var(--border-color) } .all-addresses li:before { position: absolute; left: 25px; top: 23px; content: normal; border-radius: 50%; width: 16px; height: 16px; border: solid 3px var(--first-color); opacity: .55; -webkit-filter: grayscale(100%); filter: grayscale(100%) } .all-addresses p strong { color: #000; font-weight: 400; font-size: 1.06rem; line-height: 1 } .all-addresses p { font-size: .86em; color: #646363 } .user-address { padding-left: 25px; display: block } .all-addresses.type-2 li { float: none; width: auto; padding-right: 0; padding-left: 0 } .all-addresses.type-2 li:nth-child(even) { border-left: none } .all-addresses.type-2 li:before { left: 0 } .actions { float: right; width: 90px } .actions>a { margin: 10px 0; padding: 5px 6px; display: block } .actions a .icn { display: inline-block; margin-right: 5px } .actions a.delete { background: #49484d } .actions a.edit { background: var(--first-color) } .heading1 { line-height: 1.1; font-weight: 600; color: #292929; font-size: 2.3em; margin: 10px 0 } .heading3 { color: #000; font-size: 1.2em; margin: 10px 0 } .heading4 { color: var(--first-color); font-size: 1.06em } .divider { height: 1px; background: var(--border-color); margin: 15px 0 } .payment-type { margin: 25px 0; display: block } .payment-type label { color: var(--first-color); font-weight: 500 } .payment-form .cvv { width: 82px; display: inline-block } .payment-form .cvv-img { vertical-align: middle; display: inline-block; margin: 0 15px } .payment-form .cvv-txt { vertical-align: middle; display: inline-block; color: #505050; max-width: 170px; font-size: .875em } .review-data { padding-left: 3% } .review-data .tab-heading { text-align: left } .reviewtable { display: table; width: 100%; table-layout: fixed } .reviewtable .cart-main, .reviewtable .cart-footer { display: table-cell; width: 70%; vertical-align: top } .reviewtable .cart-footer { width: 30% } .cart-main { padding-right: 3% } .shopping-cart-table { padding: 0; margin: 0; width: 100%; border-collapse: collapse } .shopping-cart-table tr { border-bottom: solid 1px var(--border-color) } .shopping-cart-table tbody>tr:last-child { border-bottom: none } .shopping-cart-table th { color: var(--first-color); padding: 20px 10px; font-weight: 600; vertical-align: top } .shopping-cart-table td { padding: 30px 10px; vertical-align: top } .shopping-cart-table tr td:first-child, .shopping-cart-table tr th:first-child { padding-left: 0 } .shopping-cart-table .product-cart-image { display: inline-block } .shopping-cart-table .product-cart-image .product-image { float: left; margin-right: 10px; min-width: 50px; max-width: 100px } .shopping-cart-table .product-cart-info { margin-left: 110px; max-width: 227px } .shopping-cart-table .product-cart-info .alert-text { display: block; } .shopping-cart-table .product-name { font-size: 1em; color: #000 } .link-txt { color: var(--first-color) } .shopping-cart-table .product-cart-info .actions { float: none; width: auto } .shopping-cart-table .product-cart-info .actions a { display: inline-block } .shopping-cart-table .cart-caption { color: #666; font-size: .93333em; font-weight: 600; padding-bottom: 4px } .shopping-cart-table .select-small { width: 70px; height: 30px; line-height: 30px; display: block; font-size: .875em; cursor: pointer } .shopping-cart-table .select-small.date { width: 205px } .shopping-cart-table .cart-price { color: #000; font-size: 1.13333em; font-weight: 600 } table.cart-tbl-addons th, table.cart-tbl-addons td { padding: 10px 5px; font-size: .775em } .remove-icn { font-size: 1.5em; line-height: 1 } .cart-footer { background: #f6f6f5; border-left: solid 1px var(--border-color); border-top: none; max-width: 408px } .cartdetail__footer { padding: 20px } .order-list { padding: 20px } .order-list h3 { color: #000; font-size: 1.2em; font-weight: 500 } .order-list li { border-top: solid 1px var(--border-color); padding: 10px 0; color: #515151; font-size: .8125em; display: table; width: 100%; vertical-align: top; table-layout: fixed } .order-list .order-name, .order-list .qnt, .order-list .price { display: table-cell; width: auto; vertical-align: top } .order-list .qnt { padding: 0 10px } .order-list a { color: inherit } .order-list .order-name { width: 60% } .cartdetail__footer td { padding: 6px 0; font-size: .9em; font-weight: 500; color: #5c5b5b } .cartdetail__footer td.hightlighted { font-weight: 600; font-size: 1em; color: #000; border-bottom: solid 1px var(--border-color); border-top: solid 1px var(--border-color) } .buttons-last { margin-top: 10px } .buttons-last a { padding: 0 22px } .text-left { text-align: left } .text-right { text-align: right } .discount-form { background: #ebebea; padding: 20px } .discount-form label { color: #000; font-size: 1em } .discount-form .field-wrapper { position: relative } .discount-form .coupon_code { padding-right: 76px; height: 51px; line-height: 51px } .button-wrapper { position: absolute; top: 5px; right: 6px } .small-header { height: 146px; background-position: center; background-repeat: no-repeat; text-align: center; position: relative } .small-header:after { background: rgba(0, 0, 0, 0.5); content: ""; position: absolute; width: 100%; height: 100%; left: 0; right: 0; top: 0; bottom: 0 } .small-header .container { position: relative; z-index: 1; height: 100% } .small-header-b { height: 348px } .small-header-c { height: 267px } .small-header-c:after { background: rgba(1, 69, 82, 0.75) } .small-header-d { height: 300px } .page-title { transform: translateY(-50%); top: 50%; position: absolute; left: 0; right: 0; margin: 0 auto; color: #fff } .page-title.top-middle { top: 15% } .page-title h1 { padding: 0; position: relative; z-index: 1; text-transform: uppercase; color: #fff; font-size: 2em; line-height: 1.2; font-weight: 600; text-align: center; font-family: 'trend_hm_sansone' } .page-title h1 small { text-transform: none; line-height: 1; font-size: 1.5rem; display: block; color: #fff } .page-title h1~.rating-wrapper p { color: #fff } .page-title h1~.rating-wrapper p a { color: #fff } .about-chef-review { margin: auto; max-width: 950px } .review-product-img { width: 366px; height: 366px; padding: 0; box-shadow: 0 0 5px rgba(0, 0, 0, 0.33); border: solid 8px #fff; border-radius: 50%; overflow: hidden; margin: auto } .product-review { padding-top: 30px; text-align: center } .product-title { font-weight: 800; color: #292929; font-size: 2.33em; line-height: 1.3 } .product-title a { color: inherit } .product-review h3 { margin-bottom: 20px } .about-chef h2 { font-size: 2.18em; color: #000 } .about-chef p { line-height: 1.6 } .about-chef h4 { font-size: 1.5em; color: var(--first-color) } .about-chef a { color: #626262 } .rating-wrapper .ratings, .rating-wrapper p { display: inline-block; vertical-align: top; font-weight: 600; font-size: .9em } .rating-wrapper .ratings { margin-right: 8px } .ratings li { display: inline-block } .normaltxt { font-size: .975rem } .review-action .btn, .review-action .select-newest { min-width: 180px; vertical-align: top } .review-action .select-newest { display: inline-block; width: auto } .listing--progress { margin-top: 40px } .listing--progress>li { display: inline-block; vertical-align: top; width: 100%; padding: 0 } .listing--progress>li .grid--left { width: 35px; float: left; font-size: .8em; line-height: 1.2; color: #f07b22; padding-right: 10px } .listing--progress>li .star { display: inline-block; vertical-align: middle; text-align: right; float: right; max-width: 12px } .listing--progress>li .grid--right { width: calc(100% - 69px); float: left; padding: 0 } .listing--progress>li .count { margin: 0 10px; font-size: .8em; width: 10px; float: left; color: #616161; text-align: center } .progress--horizontal { background-color: #ededed; height: 6px; margin: 5px 0 0 } .progress--horizontal .progress__bar { background-color: #616161; float: left; height: 100%; line-height: 20px; padding: 0 10px; position: relative; text-align: right } .reviews-list .review-item { border-bottom: solid 1px #dcdcdc; padding-bottom: 10px; margin-bottom: 30px } .reviews-list .review-item:last-child { border-bottom: none } .yes-no { text-align: right; margin: 15px 0; white-space: nowrap } .yes-no li { display: inline-block; color: #000; vertical-align: top; margin: 0 5px } .yes-no li a { color: inherit; display: block; font-weight: 600; font-size: 1.1em; line-height: 1.3em } .yes-no li img { display: inline-block; vertical-align: top; margin: 0 5px } .review-by { font-weight: 600 } .review-by span { display: block; color: #636363; font-weight: 300 } .review-content .date { margin-bottom: 25px; color: #636363 } .review-content .description { margin-bottom: 25px } .negetive-wrapper { margin-top: -168px; background: #fff; position: relative; padding: 60px 40px 40px } .panel-heading { text-align: center } .panel-heading h2 { color: #2e2e2e; font-weight: 600; font-size: 2.1875em; margin: 10px auto; padding: 0 } .panel-heading p { font-weight: 300 } .plan { border: solid 2px #a1a0a0; text-align: center; position: relative; padding: 15px; margin: 70px 0; color: #8f9090 } .plan:after { content: normal; position: absolute; left: 0; right: 0; margin: 0 auto; top: -39px; background: #a1a0a0; width: 76px; height: 76px; color: #fff; font-size: 3.75em; border-radius: 50%; line-height: 74px; font-family: 'trend_hm_sansone'; border: solid 2px transparent } .plan .pkg-name { margin-top: 15px; font-size: 2em; line-height: 1; font-weight: 600 } .plan .time { padding: 0; margin: 0 0 50px; color: inherit; position: relative; display: block } .plan .time .count { color: inherit } .plan .time:after { background: #a1a0a0; width: 46px; height: 1px; left: 0; right: 0; margin: 0 auto; position: absolute; bottom: -10px; content: "" } .plan ul { margin: 10px 0; color: inherit } .plan ul li { font-size: 1.375em; color: inherit; margin: 5px 0 } .plan a.btn { display: block; background: #a1a0a0 } .plan .shipping { margin: 25px auto; display: table; line-height: 27px; background: url(images/shipping-icon.png) no-repeat 0 0; color: inherit; font-weight: 400; padding: 0 0 0 50px } .plan .total-meals { border-top: solid 1px var(--border-color) } .plan .total-meals li { display: table; width: 100%; text-align: left; line-height: 30px; padding: 10px; margin: 0; font-size: .875em } .plan .total-meals li .count { float: right; width: 30px; height: 30px; line-height: 30px; text-align: center; background: var(--first-color); border-radius: 50%; color: #fff } .plan .total-meals li.balance { background: var(--first-color); color: #fff; border-radius: 2px; height: auto } .plan .total-meals li.balance .count { background: #fff; color: #252525 } .billing-txt { font-size: .75em } .plan.de-activated * { position: relative; -webkit-filter: grayscale(100%); filter: grayscale(100%); opacity: .5 !important } .plan .deactivated-txt { background: #fff; z-index: 2; width: 100%; position: absolute; left: 0; top: 50%; text-align: center; -webkit-filter: grayscale(0%); filter: grayscale(0%); opacity: 1 !important; font-size: 1.4em } .plan .deactivated-txt p { -webkit-filter: grayscale(0%); filter: grayscale(0%); opacity: 1 !important; font-size: .875rem } .subscription-plan .plan { min-height: 380px } .plan.is-active .pkg-name, .plan:hover .pkg-name { color: var(--first-color) } .plan:hover, .plan.is-active { border-color: var(--first-color); color: var(--first-color) } .plan:hover { box-shadow: 0 0 20px rgba(0, 0, 0, 0.33) } .plan:hover:after, .plan.is-active:after { border-color: var(--first-color); background: #fff; color: var(--first-color) } .plan:hover .time:after, .plan.is-active .time:after { background: var(--first-color) } .plan:hover .shipping, .plan.is-active .shipping { background: url(images/shipping-icon-hover.png) no-repeat 0 0 } .plan:hover a.btn, .plan.is-active a.btn { background: var(--first-color) } .acc { margin: 0; overflow: hidden; padding: 0 } .acc_ctrl { background: #FFF; border: none; border-bottom: solid 1px #e9e9e9; cursor: pointer; display: block; outline: none; padding: 15px 25px 15px 0; position: relative; width: 100%; text-transform: none } .acc_ctrl h4 { text-transform: none; color: #000; padding: 0; margin: 0; font-size: 1.15em } .acc_ctrl:before { background: var(--first-color); content: ''; height: 3px; margin-right: 10px; position: absolute; right: 0; top: 50%; font-weight: 800; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); -webkit-transition: all .2s ease-in-out; -moz-transition: all .2s ease-in-out; -ms-transition: all .2s ease-in-out; -o-transition: all .2s ease-in-out; transition: all .2s ease-in-out; width: 14px } .acc_ctrl:after { font-weight: 800; background: var(--first-color); content: ''; height: 3px; margin-right: 10px; position: absolute; right: 0; top: 50%; width: 14px } .acc_ctrl.active:before { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg) } .acc_ctrl.active h4, .acc_ctrl:focus h4 { position: relative } .acc_panel { padding: 0 15px 0 0; display: none; overflow: hidden; margin: 10px 0 } .acc_panel p { margin-bottom: 0; line-height: 1.6 } .dashboard-body { position: relative } .dashboard-body:before { background: #f6f6f5; width: 50%; left: 0; top: 0; height: 100%; content: ""; position: absolute; z-index: -1 } .dashboard-wrapper { vertical-align: top; table-layout: fixed; position: relative; z-index: 1 } .dashboard-wrapper .dashboard-left, .dashboard-wrapper .dashboard-right { display: table-cell; vertical-align: top } .fixed__panel { position: sticky; top: 117px; } .fixed__panel .stick { position: fixed; width: 201px } .dashboard-wrapper .dashboard-right { min-height: 550px; position: relative; background: #fff; border-left: solid 1px var(--border-color) } .dashboard-nav { text-align: left; float: right; width: 100%; padding: 22px 0 } .dashboard-nav li { display: block; color: #8f8e8e } .dashboard-nav li a { padding: 10px 0; display: block; color: inherit; font-weight: 500 } .dashboard-nav li a:hover, .dashboard-nav li.is-active a { color: var(--first-color) } .dashboard-nav li .icn { float: right; margin: 0 15px; font-size: 1.775em; color: inherit; line-height: 1 } .dashboard-padding { padding-left: 20px } .page-data { padding-top: 30px } .chef-profile { display: inline-block; margin: 10px 0; text-align: left } .chef-profile .avatar { width: 150px; height: 150px; border-radius: 50%; overflow: hidden; display: inline-block; margin-right: 20px; border: solid 4px #fff; position: relative } .chef-profile.white-theme *, .chef-profile.white-theme .avatar-info .name { color: #fff } .hover-elemnts { position: absolute; top: 50%; left: 50%; z-index: 1; transform: translate(-50%, -300%); width: 100%; text-align: center; margin: 0 auto; -webkit-transition: all ease .3s; -moz-transition: all ease .3s; -o-transition: all ease .3s; transition: all ease .3s } .chef-profile .avatar:hover .hover-elemnts { transform: translate(-50%, -50%) } .chef-profile .avatar:hover .hover-elemnts~img { -webkit-filter: grayscale(100%); filter: grayscale(100%); opacity: .22 } .hover-elemnts a { background: var(--first-color); color: #fff; border-radius: 50%; width: 34px; height: 34px; line-height: 35px; display: inline-block; text-align: center } .hover-elemnts a i { color: inherit } .chef-profile .avatar.avatar274 { max-width: 274px; max-width: 274px } .chef-profile.profile-sm .avatar { width: 80px; height: 80px } .chef-profile.profile-sm .avatar-info .name { font-size: 1em; font-weight: 600 } .avatar-info { display: inline-block; vertical-align: top } .avatar-info .name { color: #000; font-size: 1.875em } .avatar-contact .phone { display: block } .action-profile { float: right; margin-top: 45px } .profile-dv { display: flex; margin: 10px 0; text-align: left } .profile-dv .avatar { width: 100px; height: 100px; border-radius: 50%; overflow: hidden; margin-right: 20px; border: solid 4px #fff; position: relative; flex: none } .review-for i { font-style: italic; color: #626262 } .review-for .tag { border: solid 1px var(--first-color); padding: 0 5px; line-height: 1.5; border-radius: 2px; font-size: .8em; display: inline-block } .date { color: #626262; font-size: .9em } .review-txt { margin: 5px 0; font-size: .875em; line-height: 1.5; color: #626262 } .stats { border: solid 2px #a1a0a0; border-radius: 2px; overflow: hidden; min-height: 200px; max-width: 250px; margin: 0 auto } .stats .icon { position: relative; text-align: center; height: 100px; line-height: 142px } .stats .icon img { position: relative; z-index: 1; text-align: center; display: inline-block } .stats .icon:after { content: ""; background: #a1a0a0; width: 237px; height: 237px; border-radius: 50%; text-align: center; position: absolute; top: -140px; left: 0; right: 0; margin: 0 auto } .totals { display: block; margin: 10px auto; text-align: center; color: #a1a0a0; line-height: 1.5; font-size: 1.125em } .totals .totals-value { color: inherit; font-size: 1.875em; font-weight: 600; display: block } .stats.is-active { border-color: var(--first-color) } .stats.is-active .icon:after { background: var(--first-color) } .stats.is-active .totals { color: var(--first-color) } .table-head { display: table; width: 100%; vertical-align: top; border-bottom: solid 1px var(--border-color); margin-bottom: 10px; padding-bottom: 10px; display: flex; justify-content: space-between; align-items: center } .head-left { margin-right: 15px; display: inline-block } .head-right { display: inline-block } .table-heading { color: #000; font-size: 1.375em } .table-heading p { font-size: .875rem; font-weight: 400 } .tabs li { display: inline-block; color: #252525; font-size: .9em; position: relative; margin-right: 25px; padding-bottom: 0; line-height: 1; min-height: 30px } .tabs li:last-child { margin-right: 0 } .tabs li a { color: inherit; line-height: 1 } .tabs li.is--active a, .tabs li a:hover { color: var(--first-color) } .tabs li:after { content: ""; bottom: -11px; background: var(--first-color); height: 2px; position: absolute; z-index: 12; left: 0; right: 100%; transition-duration: .3s; transition-property: right; transition-timing-function: ease-out } .tabs li:hover:after, .tabs li.is--active:after { right: 0 } .table-listing { width: 100% } .table-listing tr { border-bottom: solid 1px var(--border-color) } .table-listing tr:last-child { border-bottom: none } .table-listing tr td { padding: 10px; vertical-align: top; font-size: .875em } .table-listing tr td:first-child { padding-left: 0 } .table-listing tr td:last-child { padding-right: 0; text-align: right } .table-listing .block-ele { margin-bottom: 25px } .table-listing .caption { display: block; color: #000; font-size: .975rem } .tbl-actions li { display: block; margin: 5px 0 } a.button, .status { padding: 0 10px; display: inline-block; height: 28px; line-height: 28px; border: solid 1px var(--border-color); border-radius: 2px; white-space: nowrap; font-size: .875em; text-align: center } a.button.delivered { color: #83b229 } .status { background: #777; color: #fff; border: none; min-width: 82px } .status.paid { background: #337ab7; color: #fff } .status.inprocess { background: #5cb85c; color: #fff } .status.shipped { background: #5bc0de; color: #fff } .status.delivered { background: #24b26b; color: #fff } .status.cancelled { background: red; color: #fff } .status.pending { background: #d9534f; color: #fff } a.button.view { color: #8c8c8c } a.button span { color: inherit; vertical-align: middle } .icn-delivered { background: url(images/delivered.png) no-repeat center; width: 13px; height: 13px } .button span.icn { margin-right: 5px; display: inline-block } .reviews-listing li { border-bottom: solid 1px var(--border-color); padding: 10px 0; margin: 10px 0 } .reviews-listing li:last-child { border-bottom: none } .reviews-listing .review-by { color: var(--first-color); font-weight: 600 } .reviews-listing .review-date { color: #000; font-size: .8125em } .reviews-listing .review-txt { margin: 10px 0 } .order-details ul li { font-size: .9em; padding: 5px 0 } .order-details ul li .cell-left { display: inline-block; color: #000; width: 40%; vertical-align: top } .order-details ul li .cell-right { vertical-align: top; display: inline-block; width: 58% } .txt-first-color { color: var(--first-color) } .txt-black-color { color: #000 } .your-order th { font-weight: 600; color: #000 } .your-order { border-collapse: collapse } .your-order th, .your-order td { padding: 10px; border-bottom: solid 1px var(--border-color); border-top: solid 1px var(--border-color); font-size: .875em } .your-order th { font-size: 1em } .your-order tr td:first-child, .your-order tr th:first-child { padding-left: 0; text-align: left } .your-order tr td:last-child, .your-order tr th:last-child { text-align: right; padding-right: 0 } .grand-total { color: #000; font-weight: 600; border-top: solid 1px var(--border-color) } .order-bottom { width: 383px; float: right; padding: 20px 0 } .order-bottom li { padding: 10px 0; font-size: .875em } .order-bottom li .first-cell { display: inline-block; color: #000; width: 40%; vertical-align: top } .order-bottom li .second-cell { display: inline-block; width: 58%; text-align: right; vertical-align: top } .inline-block li { display: inline-block; margin-right: 10px } .table { padding: 0; margin: 0; width: 100%; border-collapse: collapse } .table tr { border-bottom: solid 1px var(--border-color) } .table tbody tr:last-child { border-bottom: none } .table th { color: var(--first-color); padding: 20px 10px; font-weight: 600; vertical-align: top } .table td { padding: 30px 10px; vertical-align: top; font-size: .875em } .table tr td:first-child, .table tr th:first-child { padding-left: 0 } .table td a { color: #000 } .status-veg img { display: inline-block; vertical-align: top } .menu-pic { width: 320px; height: 320px; display: block; border-radius: 50%; overflow: hidden; margin: 0 auto; margin-bottom: 25px } .menu-pic img { border-radius: 50%; height: inherit; object-fit: cover } .menu-actions { margin: 0 auto; text-align: center; max-width: 370px } .menu-actions a { margin: 0 20px } .meal-recipe-slider .slick-slide { margin: 0 1px; position: relative } .meal-recipe-slider .slick-arrow { position: absolute; z-index: 5; top: 50%; transform: translateY(-50%); background: #858835; border-radius: 50%; width: 60px; height: 60px; padding: 0; cursor: pointer; text-indent: -9999px; border: none } .meal-recipe-slider .slick-prev { background: #f5bb41 url(images/retina/left-arrow.svg) no-repeat center; background-size: 30px 30px; left: 50%; margin-left: -486px } .meal-recipe-slider .slick-next { background: #f5bb41 url(images/retina/right-arrow.svg) no-repeat center; background-size: 30px 30px; right: 50%; margin-right: -486px } .meal-recipe-slider .slick-arrow:hover { background-color: background: rgba(0, 0, 0, 1) } .deal-price { text-align: center; color: #000; font-size: 1.5em; font-weight: 600; font-family: 'trend_hm_sansone'; margin-bottom: 40px } .recipe-features { float: right; border: solid 2px var(--first-color) } .recipe-features ul { display: table; table-layout: fixed } .recipe-features li { text-align: center; display: table-cell; vertical-align: top; color: var(--first-color); border-left: solid 2px var(--first-color); padding: 10px } .recipe-features li:first-child { border-left: none } .recipe-features li i img { max-width: 32px; height: auto } .recipe-features p { font-size: .9em; color: inherit; margin-bottom: 0 } .recipe-features img { display: inline-block !important } .recipe-features-white { border-color: #fff } .recipe-features-white li { border-color: #fff } .recipe-features-white p { color: #fff } .recipe-features-w-bordered { border: none } .recipe-features-w-bordered ul li { border: none; padding: 5px 10px } .recipe-features-w-bordered p { font-size: .775em; line-height: 1 } .ingredients-listing li { width: 24%; display: inline-block; vertical-align: middle; color: #000; margin: 15px 0 } .ingredients-listing .icn { display: inline-block; vertical-align: middle; margin-right: 10px } .ingredients-listing .icn img { border-radius: 50% } .bg-gray { background: #f4f4f3 } .pdf-icn { margin-right: 10px; vertical-align: text-bottom; background: url(images/icon-pdf.png) no-repeat 0 0; width: 33px; height: 34px; display: inline-block } .subcribed { font-size: 1em; text-transform: uppercase; height: auto; padding: 15px 10px; font-weight: 600 } .need-ingredients-list { margin-top: 50px; padding: 15px 25px; border-radius: 2px; border: solid 1px var(--border-color); background: #fff } .need-ingredients-list li { display: block; margin: 8px 0 } .need-ingredients-list .left-cell, .need-ingredients-list .right-cell { display: inline-block; vertical-align: top; font-size: .825em } .need-ingredients-list .left-cell { font-weight: 600; color: #000; width: 30% } .need-ingredients-list .right-cell { width: 64% } .instructions-tbl { direction: ltr; text-align: left; display: table; table-layout: fixed; width: 100%; overflow: hidden; position: relative; padding: 40px 0 } .instructions-tbl.instructions-tbl-odd { direction: rtl } .instructions-tbl .image-cell { vertical-align: top; padding: 0 0 50%; background-repeat: no-repeat; background-size: cover; background-position: 50% 50%; border: solid 4px var(--second-color); position: relative } .instructions-tbl .image-cell:before { font-family: 'trend_hm_sansone'; content: attr(data-count); position: absolute; right: 0; top: 30px; background: var(--second-color); color: #49484d; text-align: center; width: 70px; height: 70px; display: block; font-size: 2.75em; line-height: 70px; border-radius: 50%; margin-right: -45px; margin-left: auto } .instructions-tbl.instructions-tbl-odd .image-cell:before { left: 0; right: auto; margin-left: -45px; margin-right: auto } .instructions-tbl .txt-cell { display: table-cell; vertical-align: top; padding: 0 50px; padding-left: 80px } .instructions-tbl.instructions-tbl-odd .txt-cell { padding-left: 0 } .instructions-tbl .txt-cell h2 { position: relative; margin-bottom: 20px; color: #000 } .instructions-tbl .txt-cell h2:after { background-color: #a1a0a0; width: 70px; height: 3px; position: absolute; left: 0; margin: 0 auto; bottom: -5px; content: ""; display: block } .instructions-tbl .txt-cell p { font-size: 1.125em } .discuss-area { margin: 0 auto } .discuss-area img { display: inline-block; margin: 0 auto } .add-comnt { margin: 0 auto; max-width: 800px } .balance { line-height: 2.5; height: 40px } .bank-detail { border: solid 1px var(--border-color); padding: 10px 15px; border-radius: 2px } .ul-tbl li { padding: 6px 0; font-size: .875em } .ul-tbl li .left-cell { display: inline-block; color: #000; width: 40%; vertical-align: top } .ul-tbl li .right-cell { display: inline-block; width: 58%; vertical-align: top } .search-meal { margin: 25px auto; background: #fff; border-radius: 2px; max-width: 700px; position: relative } .search-meal-main { overflow: hidden } .search-meal.search-meal-small { max-width: 500px } .search-meal input[type="text"], .search-meal input[type="submit"] { background: none; border: none; height: 48px } .search-meal input[type="submit"] { margin: 0 } .search__submit { border: none; bottom: 0; display: inline-block; height: 48px; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 60px; z-index: 3; background: #fff } .search__submit:after { background: #636262; content: ""; height: 3px; left: 34px; pointer-events: none; position: absolute; top: 30px; transform: rotate(45deg); width: 12px } .search__submit::before { background: rgba(0, 0, 0, 0); border: 2px solid #636262; border-radius: 100%; content: ""; height: 20px; left: 20px; pointer-events: none; position: absolute; top: 12px; width: 20px } .filter-bar { background: #fff; border-bottom: solid 1px #dcdcdc } .filter-bar ul.filter-ul { display: table; width: 100% } .filter-bar ul.filter-ul li { display: table-cell; vertical-align: middle } .filter-switch { padding: 15px 0 } .filter-switch a { font-size: 1.05em; color: #454545; text-transform: uppercase } .filter-switch a:hover { color: #000 } .filter-switch .icn { display: inline-block; vertical-align: middle; margin-right: 5px; width: 28px } .product-actions { text-align: right; float: right } .product-actions * { display: inline-block; vertical-align: middle } .all-category { font-size: 1.33em; color: #454545; text-transform: uppercase } .layout { margin: 0 -2px } .layout a { margin: 0 } .layout a .icn { margin: 0 5px } .compare { background: #f1eff0; padding: 14px 15px; font-size: 1.05em; color: #646263; text-transform: uppercase } .sort-by .sort-txt { border-right: solid 1px var(--border-color); padding: 17px 15px; font-size: 1.05em; color: #454545; text-transform: uppercase; margin-right: -6px } .sort-toggle { position: relative } .sort-toggle>a { color: #454545; position: relative; padding: 15px 10px; margin-right: 20px } .sort-toggle>a:after { border-color: #f17b23; border-style: solid; border-width: 1px 1px 0 0; content: ''; display: inline-block; height: 10px; right: -12px; transform: rotate(45deg) translateY(-50%); position: absolute; top: 46%; vertical-align: top; width: 10px; padding: 0; cursor: pointer; -webkit-transition: all ease .3s; -moz-transition: all ease .3s; -o-transition: all ease .3s; transition: all ease .3s; transform-origin: top } .sort-toggle.is-active a:after { transform: rotate(133deg) translateY(-50%) } .widgets .heading4 { font-weight: 500; color: var(--first-color); padding: 10px 0; position: relative } .widgets .heading4.first { border-top: none } .with-arrows { position: relative } .widgets .heading4:after, .with-arrows:after { border-color: #f17b23; border-style: solid; border-width: 1px 1px 0 0; content: ''; display: inline-block; height: 10px; right: 10px; transform: rotate(45deg) translateY(-50%); position: absolute; top: 50%; vertical-align: top; width: 10px; padding: 0; cursor: pointer; -webkit-transition: all ease .3s; -moz-transition: all ease .3s; -o-transition: all ease .3s; transition: all ease .3s; transform-origin: top } .widgets .heading4.is-active:after, .with-arrows.is-active:after { transform: rotate(133deg) translateY(-50%) } .with-arrows.arrows-dark:after { border-color: #676565 } .toggle-target { position: relative } .filter-content { margin: 0; margin-bottom: 15px; overflow: hidden; transition: height .3s ease 0 } .filter-price-slider { background: #eaeae9; height: 2px; margin: 21px 2px 16px; position: relative; text-align: left; padding: 0 10px; width: 100% } .price-slider-scroll { background: #c9c9c7; border: none; border-radius: 50%; cursor: pointer; height: 13px; margin-left: 0; outline: none; position: absolute; top: -6px; transition: all .2s ease-out 0; width: 13px; z-index: 2 } .price-slider-scroll:hover { transform: scale3d(1.3, 1.3, 1) } .from-price-text, .to-price-text { font-weight: 600; font-size: .8em; vertical-align: top } .to-price-text { float: right; text-align: right } .prices { padding-bottom: 10px } .price-input { float: left; padding: 0; text-align: center; width: 45% } .price-text-box { position: relative } .price-text-box .input-filter { height: auto; margin: 0; padding: 9px 5px 9px 30px; display: inline-block; line-height: normal; vertical-align: top } .rsText { color: #9e9e9e; font-size: 13px; left: 5px; margin-right: 3px; padding-left: 3px; position: absolute; top: 11px } .filter-content .btn { padding: 9px 10px; float: right } .filter-content .dash { display: inline-block; float: left; padding: 6px } .search-chef { margin: 10px auto; border: solid 1px var(--border-color) } .product-listing-wrpper { margin-top: 50px } .product-listing-wrpper.hide--filters .left-filters { opacity: 0; visibility: hidden; width: 0; height: 0; float: none; z-index: 15; display: none; } .product-listing-wrpper.hide--filters .product-list { float: none; width: 100%; padding-left: 0 } .product-listing-wrpper.hide--filters .product-list .product-grid-item { float: left; width: 25% } .left-filters { padding-right: 10px; width: 20%; float: left; opacity: 1; visibility: visible; transition: all 300ms ease 0 } .overlay { z-index: 11; position: fixed; left: 0; right: 0; top: 0; bottom: 0; background: rgba(0, 0, 0, 0.8); visibility: hidden; opacity: 0; -webkit-transition: .3s all ease-in-out; -moz-transition: .3s all ease-in-out; -o-transition: .3s all ease-in-out; transition: .3s all ease-in-out } .sort-toggle ul { position: absolute; top: 100%; left: 0; right: 0; background: #fff; border: solid 1px #dcdcdc; z-index: 3; border-top: none; margin: 0 } .sort-toggle ul li { display: block !important; border-top: solid 1px #dcdcdc; text-align: left } .sort-toggle ul li a { display: block; margin: 2px 0; padding: 5px; font-size: .875em } .left-filters .heading { color: #000; font-size: 1.75em; margin-bottom: 5px } .product-list .product-grid-item { position: relative; float: left; width: 33.3333333%; background: none; padding: 10px; margin-bottom: 10px } .product-list { float: left; width: 80% } .favourites.product-list { width: 100% } .filter-scroll { max-height: 300px } .listing-ul li { display: block; margin: 10px 0 } .readymeals-wrapper { padding: 0 15px } .product-grid-item { transition: all 300ms ease 0 } .product-wrapper { position: relative } .product-grid-item .product-head { position: relative } .product-grid-item .product-image { display: block; margin: 0 0 10px; padding: 0 0 56%; position: relative; width: 100%; overflow: hidden } .product-grid-item .product-image img { max-width: 100%; bottom: 0; left: 0; margin: auto; position: absolute; right: 0; top: 0; -webkit-transition: all .5s linear; transition: all .5s linear; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); -webkit-filter: blur(0px); -webkit-animation: fadein linear 1.5s } .product-grid-item:hover .product-image img { -webkit-transform: scale3d(1.1, 1.1, 1); transform: scale3d(1.1, 1.1, 1) } @-webkit-keyframes fadein { 0% { -webkit-filter: opacity(0%) blur(6px); } 50% { -webkit-filter: opacity(100%) blur(3px); } 100% { -webkit-filter: opacity(100%) blur(0px); } } .product-grid-item .product-image:before { color: #dadada; content: "Y"; font-size: 100px; height: 50px; left: 50%; line-height: 46px; margin: -25px 0 0 -25px; position: absolute; text-align: center; top: 50%; width: 50px } .product-price { float: right; color: #000; font-size: 1.25em; font-weight: 600; line-height: 1 } .product-name { line-height: 21px; color: #000; font-size: 1.0625em } .product-name a { color: inherit; line-height: inherit } .product-name .non-veg, .non-veg, .product-name .veg, .veg { background: url(images/non-veg-icn.png) no-repeat 0 0; background-size: 100% auto; display: inline-block; width: 18px; height: 18px; vertical-align: middle; float: left; margin-right: 8px } .product-name .veg, .veg { background: url(images/veg-icn.png) no-repeat 0 0; background-size: 100% auto } .size28 { width: 28px; height: 28px } .size18 { width: 18px; height: 18px } .veg-size { width: 18px } .product-categories { padding: 0 24px; font-size: .8125em } .product-categories a { color: inherit } .chef-filter-bar { border: solid 1px var(--border-color); display: table; width: 100% } .chef-name { float: left; padding: 12px 10px; line-height: 1.5; color: #000; font-size: 1.375em } .coloumn { margin-bottom: 20px } .recipe-filter-trigger { display: none } .recipe-filter-trigger .icn { display: inline-block; vertical-align: middle } .listing-left h3 { color: #000; font-size: 1.3em; border-bottom: solid 2px var(--border-color); margin-bottom: 20px } .filter-benefits li { display: table; margin: 15px 0 } .filter-benefits .icn { width: 28px; height: 28px; text-align: center; background: #a1a0a0; display: inline-block; border-radius: 50%; margin-right: 10px; vertical-align: middle; line-height: 28px; position: relative; display: flex; align-items: center; justify-content: center } .filter-benefits a { color: #494a4a; display: flex; align-items: center; justify-content: center } .filter-benefits a:hover, .filter-benefits li.is-active a { color: var(--second-color) } .filter-benefits a:hover .icn, .filter-benefits li.is-active a .icn { background: var(--second-color) } .blog-type-content { max-width: 850px; padding-left: 20px } .blog-type-content .post-media { margin-bottom: 40px } .blog-type-content .post-media:last-child { margin-bottom: 0 } .blog-type-content .media { margin-bottom: 20px } .blog-type-content .post-title { color: #000; font-size: 1.5em; font-weight: 500; line-height: 1.2; position: relative; margin-bottom: 34px } .blog-type-content .post-title a { color: #000 } .blog-type-content .post-title:after { background-color: #a1a0a0; width: 70px; height: 2px; position: absolute; left: 0; margin: 0; bottom: -15px; content: ""; display: block } .bg-detail { background: url(images/bg-traingle.png) no-repeat 0 0 } .product-detail-image { border: solid 1px var(--border-color); } .social-ui { margin: 10px 0 0 } .social-ui li { text-align: center; display: inline-block; margin-right: 10px; margin-bottom: 10px } .social-ui li a { padding: 0; display: block } .social-ui li span { color: #616161; font-size: 1em; font-weight: 600; display: inline-block } .social-ui li .icn { vertical-align: middle; display: inline-block } .social-ui li .icn img { width: 17px; height: 16px } .meal-chef { background-color: #49484d } .registration-page { min-height: 100% } .registration-page #header { border-bottom: none; background: none } .registration-page .after-header { height: auto } .registration-page { background-attachment: fixed; background-repeat: no-repeat; background-size: cover; background-position: center; position: relative } .registration-page:before { content: ""; position: fixed; top: 0; width: 100%; height: 300px; background-color: #fff; background-size: cover; clip-path: polygon(0% 0%, 0% 20%, 50% 80%, 100% 20%, 100% 0%); -webkit-clip-path: polygon(0% 0%, 0% 20%, 50% 80%, 100% 20%, 100% 0%); -webkit-transition: all ease .3s; -moz-transition: all ease .3s; -o-transition: all ease .3s; transition: all ease .3s } .registration-page:after { content: ""; position: absolute; bottom: -10px; width: 100%; height: 300px; background-color: #f5bb41; background-size: cover; clip-path: polygon(100% 100%, 100% 100%, 50% 0%, 0% 100%, 0% 100%); -webkit-clip-path: polygon(100% 100%, 100% 100%, 50% 0%, 0% 100%, 0% 100%); -webkit-transition: all ease .3s; -moz-transition: all ease .3s; -o-transition: all ease .3s; transition: all ease .3s } .fixed-header .registration-page:before, .fixed-header .registration-page:after { clip-path: polygon(0% 0%, 0% 40%, 50% 40%, 100% 40%, 100% 0%); -webkit-clip-path: polygon(0% 0%, 0% 40%, 50% 40%, 100% 40%, 100% 0%); z-index: 10 } .fixed-header .registration-page:after { bottom: -10px; z-index: -1; clip-path: polygon(100% 100%, 100% 80%, 50% 80%, 0% 80%, 0% 100%); -webkit-clip-path: polygon(100% 100%, 100% 80%, 50% 80%, 0% 80%, 0% 100%); } .registration-middle { padding-top: 150px; position: relative; z-index: 5 } .reg-blocl-wrapper { max-width: 578px; margin: 0 auto 50px; padding: 0; background: #fff; box-shadow: 0 0 15px 10px rgba(0, 0, 0, 0.08); border-radius: 5px } .page-tabs ul { margin: 0 auto; padding: 20px 10px; padding-bottom: 10px; text-align: center } .page-tabs li { display: inline-block; margin: 0 3px } .page-tabs li a { border-radius: 3px; background: #eaeaea; display: block; padding: 7px 30px; color: #000; font-size: .9375em } .page-tabs li a.active { background: var(--second-color) } .page-tabs-data { display: none } .page-tabs-data .form { padding: 10px 30px 30px } .box-heading { text-align: center; color: #000; font-size: 1.8em; line-height: 1.2; margin: 0; text-transform: uppercase; position: relative; font-weight: 600; font-family: 'trend_hm_sansone' } .captcha { line-height: 50px } .captcha .captcha-img, .captcha .refresh-img { display: inline-block; max-width: 140px; margin-right: 10px; vertical-align: middle } .captcha .refresh-img { display: inline-block; max-width: 24px; height: auto } .copyright-reg { position: fixed; z-index: 1; left: 0; right: 0; bottom: 0; text-align: center; color: #000; margin: 25px auto; margin-bottom: 0; line-height: 1; font-size: .75em; padding: 10px 0 20px } .product-description { padding-left: 50px } .pro-name { margin: 0 0 35px; text-transform: uppercase; position: relative; font-weight: 600; font-family: 'trend_hm_sansone'; position: relative } .pro-name.after-border::after { left: 30px } .pro-name span.txt { font-family: 'trend_hm_sansone'; color: #000; font-size: 1.4em; line-height: 1; vertical-align: top; display: table } .pro-name span.small-txt { display: block; font-size: 1.06rem; color: #8e8d8d; text-transform: none; font-weight: 400; padding-left: 30px } .description { line-height: 1.5; margin-bottom: 15px } .product-description h3 { font-size: 1.25em; padding: 0; margin: 0; color: #000; line-height: 1; margin-bottom: 20px } .product-description .timings { color: #626262; font-size: .9em } .product-description .timings span { font-weight: 600; font-size: 1rem } .tags { margin: 10px 0 } .price-fetures { margin: 30px 0 10px } .price-fetures ul li { display: table-cell; vertical-align: middle; border-right: solid 1px var(--border-color); padding: 0 20px; white-space: nowrap; margin-right: 12px } .price-fetures ul li:first-child { padding-left: 0 } .price-fetures ul li:last-child { border-right: none } .price-fetures .caption { display: inline-block; color: #000; font-weight: 600 } .price-fetures .main-price { display: block; color: var(--first-color); font-weight: 500; font-size: 1.5rem } .price-fetures .select-small { max-width: 70px; height: 30px; line-height: 30px; display: inline-block; font-size: .875em } .proceedtopay { padding: 15px 30px; line-height: 1.2; height: auto } .on-detail-chef-profile { position: relative; margin: 0 auto; max-width: 636px; color: #fff } .on-detail-chef-profile:before { background: url(images/y-shape-big.png) no-repeat center center; width: 441px; height: 612px; content: ""; position: absolute; left: -64%; top: -50% } .on-detail-chef-profile a { color: inherit } .on-detail-chef-profile .avatar-info .name, .on-detail-chef-profile a, .on-detail-chef-profile .avatar-contact .phone { color: #fff } .on-detail-chef-profile .action-profile { margin: 10px 0 0 } .on-detail-chef-profile .avatar-info { padding: 0 } .login-wrapper { padding-top: 30px } .login-form-front { padding: 25px 30px 15px } .not-yet-member { padding: 0 30px 30px; text-align: center } .show-pop { bottom: 0; left: 0; position: fixed; right: 0; top: 0 } .pop-model-box { display: table; margin: 0 auto; height: 100% } .pop-model-overlay { background-color: rgba(0, 0, 0, .55); bottom: 0; left: 0; position: fixed; right: 0; top: 0; display: none } html.show-pop .pop-model .pop-model-overlay { display: block } .pop-model { bottom: 0; left: 0; opacity: 0; position: fixed; right: 0; top: 0; z-index: 999; overflow: auto; visibility: hidden; transition: none; -webkit-transition: none } html.show-pop .pop-model { opacity: 1; visibility: visible } .model-box-content { border-radius: 5px; max-width: 600px; min-width: 600px; padding: 30px 0; position: relative; display: table-cell; vertical-align: middle; transform: scale(0.5); -webkit-transform: scale(0.5); transition: .5s all ease-in-out; -webkit-transition: .5s all ease-in-out } .model-box-mid { padding: 0; position: relative; } .pop-up-data { padding: 20px } .pop-banner { border-bottom: solid 7px var(--first-color) } .pop-banner2 { height: 135px; border-bottom: solid 3px var(--first-color) } .pop-banner2 h2 { color: #000; padding: 50px 0 } .model-box-mid h2 { font-size: 1.2em; text-align: center; padding: 15px 0 } html.show-pop .pop-model .model-box-content { transform: scale(1); -webkit-transform: scale(1) } .close-btn { float: right; font-size: 0; height: 35px; position: absolute; right: 15px; top: 0; width: 35px; border-radius: 50%; z-index: 9 } .close-btn::after, .close-btn::before { background-color: #000; border-radius: 40px; content: ""; height: 2px; position: absolute; left: 8px; top: 16px; width: 20px; transform: rotate(-45deg); -webkit-transform: rotate(-45deg) } .close-btn::before { transform: rotate(45deg); -webkit-transform: rotate(45deg) } .close-btn.close-btn-white::after, .close-btn.close-btn-white::before { background: #fff } .hlp { font-size: 11px } .after-arrow { position: relative; padding-right: 35px !important } .after-arrow:after { content: ""; position: absolute; top: 10px; right: 10px; z-index: 1; border: solid #fff; border-width: 0 2px 2px 0; display: inline-block; padding: 4px; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -webkit-transition: all ease .3s; -moz-transition: all ease .3s; -o-transition: all ease .3s; transition: all ease .3s; transform-origin: center } .user-trigger-active.after-arrow:after { transform: rotate(45deg); -webkit-transform: rotate(45deg); top: 8px } .my-account-dropdown { position: absolute; right: 0; left: 0; top: 110%; background: #fff; border-radius: 3px; border: solid 1px var(--border-color); opacity: 0; visibility: hidden; -webkit-transform: scale(0); -ms-transform: scale(0); -o-transform: scale(0); transform: scale(0); filter: alpha(opacity=0); -webkit-transition: all 300ms; -o-transition: all 300ms; transition: all 300ms; -webkit-transform-origin: top center; -moz-transform-origin: top center; -ms-transform-origin: top center; transform-origin: top center } .my-account-toggle-open .my-account-dropdown { opacity: 1; visibility: visible; -webkit-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); filter: alpha(opacity=100) } .my-account-dropdown ul li { border-bottom: solid 1px var(--border-color) } .my-account-dropdown ul li:last-child { border-bottom: none } .my-account-dropdown ul li a { font-size: .775em; color: var(--txt-color); border: transparent } .mealkit-slider .over-detail h3 { margin: 10px 0; font-size: 1.188em; line-height: 1.2; display: inline-block } .mealkit-slider .over-detail h3 a { color: inherit; line-height: inherit } .mealkit-slider .slick-slide { margin: 0 10px } .mealkit-slider-sticker-wrapper { padding: 10px; margin-left: auto; background: rgba(255, 255, 255, 0.86) } .mealkit-slider-sticker .txt-slip h3 { font-size: 2.375em; margin: 10px 0 } .mealkit-slider .recipe-features { margin-bottom: 15px; float: none; display: inline-block } .mealkit-slider .recipe-features p { font-size: .875em } .mealkit-featured-slider .slick-slide { margin: 0 15px } .mealkit-featured-slider .item { position: relative } a.favourite, .meals-pattern2 .item a.favourite { position: absolute; right: 10px; z-index: 2; top: 10px !important } .mealkit-featured-slider .item a.favourite { position: absolute; right: 15px; z-index: 2; top: 90px } .meal-recipe-slider+a.favourite { top: 90px !important } .mealkit-featured-slider .slick-slide.slick-current .item:after { content: normal } .mealkit-featured-slider .over-slip { background: rgba(0, 0, 0, 0.55); padding: 0; position: absolute; bottom: 0; left: 0; right: 0; z-index: 1; padding: 10px 0; display: flex; justify-content: space-between; align-items: center } .mealkit-featured-slider .over-slip h3 { color: #fff; line-height: 1.2; font-size: 1.1em; padding: 0 10px; width: 198px; overflow: hidden; display: inline-block; vertical-align: middle } .mealkit-featured-slider .over-slip h3 a { color: inherit; line-height: inherit } .mealkit-featured-slider .over-slip .recipe-features { float: none; display: inline-block; vertical-align: middle } .week-slider { margin: 20px auto; max-width: 640px; background: #fff; border-radius: 2px; font-size: 1em; position: relative; padding: 15px 10px; color: #000 } .week-slider .slick-arrow { position: absolute; z-index: 5; top: 50%; transform: translateY(-50%); background: #858835; border-radius: 50%; width: 40px; height: 40px; padding: 0; cursor: pointer; text-indent: -9999px; border: none; border: solid 2px #fff } .week-slider .slick-prev { background: #f5bb41 url(images/retina/left-arrow.svg) no-repeat center; background-size: 20px; left: -30px } .week-slider .slick-next { background: #f5bb41 url(images/retina/right-arrow.svg) no-repeat center; background-size: 20px; right: -30px } .week-slider .slick-arrow:hover { background-color: rgba(0, 0, 0, 1) } .link-reset { float: left } .link-keywords { float: right } .location-search { border-radius: 10px; background-repeat: no-repeat; background-position: center } .location-search .close-btn { top: -40px; right: -20px } .location-popup-content { display: table; width: 100%; height: 300px } .branding { position: relative; float: left; width: 50%; height: inherit } .branding-logo { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 230px; margin: 0 auto } .location-search-wrapper { background: #fff url(images/bg-search.jpg) no-repeat 0 0; background-size: 100%; border-radius: 10px; padding: 20px; float: right; height: 324px; width: 45%; margin-right: 30px; position: relative; margin-top: -12px; margin-bottom: -12px; overflow: hidden } .search-location-form { margin-bottom: 10px; top: 50%; transform: translateY(-50%); position: relative } .location-search-field { position: relative; margin-bottom: 15px } .location-search-field:after { content: "\f455"; font-family: "Ionicons"; color: #b4b4b4; position: absolute; top: 6px; right: 16px; font-size: 24px } input[type="text"].search-field { border-radius: 50px; border-width: 2px; height: 45px; padding-right: 37px } .circlebutton input[type="submit"] { opacity: 0; padding: 0 !important; width: 60px; height: 60px } .circlebutton { text-decoration: none; background-color: #000; width: 60px; height: 60px; border-radius: 100%; box-shadow: 0 0 4px rgba(0, 0, 0, 0.14), 0 4px 8px rgba(0, 0, 0, 0.28); text-align: center; line-height: 60px; position: absolute; right: 6px; bottom: -125px; border: none; cursor: pointer; font-size: 0; z-index: 1 } .search-location-form.form-focused .circlebutton { bottom: -1px } .circlebutton:hover, .circlebutton:active, .circlebutton:focus { background-color: var(--first-color) } .circlebutton:before { content: "\f30f"; font-size: 30px; color: #fff; font-family: "Ionicons"; position: absolute; left: 20px; top: 0; -ms-transition: all 500ms ease 0; -webkit-transition: all 500ms ease 0; transition: all 500ms ease 0 } .circlebutton:hover:before { -webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg); transform: rotate(360deg) } .location-dropdown-menu { width: 100%; display: none } .search-location-form.form-focused .location-dropdown-menu { display: block; top: 0; transform: none } .location-dropdown-menu li { font-size: .875em; color: #626262; padding: 5px 15px; position: relative } .location-dropdown-menu li a { display: block; color: inherit; position: relative } .location-dropdown-menu li a:hover, .location-dropdown-menu li.is--active a { color: var(--first-color); padding-left: 15px; font-weight: 600 } .location-dropdown-menu li a:hover:after { content: ""; width: 5px; height: 5px; background: var(--first-color); display: block; position: absolute; top: 9px; left: 0; border-radius: 50% } .scrollbox { overflow: auto; height: 235px } .vertical-track { width: 1px; background-color: var(--border-color) } .vertical-handle { width: 10px; border-radius: 10px; margin-left: -4px; background-color: var(--first-color) } .address-page { margin: 20px auto } .cart-sticky { position: fixed; z-index: 10; right: 0; left: 0; -webkit-transition: bottom .3s; transition: bottom .3s } .cart-sticky.opened { bottom: 0 !important; -webkit-transition: bottom .3s; transition: bottom .3s } .cart-box-content { background: #2e2e2e } .cart-item { padding: 10px; background: #fff; display: block; border-radius: 3px; margin: 10px 5px; width: auto; position: relative } .cart-item:before, .cart-item:after { content: ""; display: table; line-height: 0 } .cart-item:after { clear: both } .cart-carousel { position: relative; padding: 5px 50px } .cart-carousel .slick-arrow { position: absolute; z-index: 5; top: 50%; transform: translateY(-50%); background: #858835; border-radius: 50%; width: 35px; height: 35px; padding: 0; cursor: pointer; text-indent: -9999px; border: none } .cart-carousel .slick-prev { background: rgba(0, 0, 0, 0.75) url(images/retina/left-arrow.svg) no-repeat center; background-size: 13px; left: 10px } .cart-carousel .slick-next { background: rgba(0, 0, 0, 0.75) url(images/retina/right-arrow.svg) no-repeat center; background-size: 13px; right: 10px } .cart-carousel .slick-arrow:hover { background-color: background: rgba(0, 0, 0, 1) } .cart-item .pro-img { width: 36%; float: left; margin-right: 5px } .cart-item .side-data { float: left; width: 60%; display: inline-block; vertical-align: top; position: relative } .cart-item .cross { position: absolute; top: 2px; right: 7px; color: var(--first-color); z-index: 2; cursor: pointer } .cart-item .small-qty { max-width: 50px; padding-right: 0; height: 30px; line-height: 30px; display: inline-block; font-size: .875em } .cart-item a { color: #000 } .cart-item .price { font-size: .875em; padding: 0; white-space: nowrap } .stick-cart-total { padding: 10px; color: #fff } .subtotal, .subprice { padding: 5px 10px; display: block; color: #fff } .fat-inactive { opacity: .5 } .fat-inactive, .fat-inactive a { cursor: not-allowed } .layout--rtl { direction: rtl !important } .bg-light-gray { background: #fafafa; border-bottom: solid 1px var(--border-color) } .morecontent span { display: none } .addtocart--floated { position: fixed; right: 0; top: 50%; z-index: 1 } .addtocart-trigger { background: #000; border-radius: 50%; width: 60px; height: 60px; color: #fff; display: block; text-align: center; float: right; margin-right: 10px; margin-bottom: 10px } .addtocart-trigger i { color: inherit; font-size: 1.5em; line-height: 60px } .target-div { background: #000; height: 60px; width: 0; border-radius: 60px; position: absolute; right: 75px; overflow: hidden; -webkit-transition: width 0.5s, height 1s; -moz-transition: width 0.5s, height 1s; -ms-transition: width 0.5s, height 1s; -o-transition: width 0.5s, height 1s; transition: width 0.5s, height 1s } .target-div.opened { width: 177px } .target-div input.qty { background: none; border: none; width: 45px; display: inline-block; color: #fff; text-align: center; vertical-align: middle; font-weight: 600 } .target-div .qnty-wrapper { padding: 0 15px; padding-right: 10px } .target-div .qty-control { display: inline-block; line-height: 60px; vertical-align: middle; cursor: pointer } .target-div .qty-control i { color: #fff } .target-div .qnty-submit { display: inline-block; vertical-align: top; color: #fff; border-radius: 20px; height: 30px; line-height: 30px; background: var(--first-color); text-align: center; padding: 0 12px; margin: 15px 0 15px 10px } .target-div .qnty-submit i { color: inherit; font-size: 1.5em } .addons-wrapper.added--toppings .addons-trigger { min-width: inherit } .addons-trigger { display: block; cursor: pointer; line-height: 1; color: #fff; font-size: .9em; margin: 10px 0; border: solid 1px #333; border-radius: 2px; padding: 10px; padding-right: 30px; background: #333; } .addons-trigger:after { border-color: #fff } .addons-trigger.opened:after { margin-top: -2px; transform: rotate(133deg) translateY(-50%) } .addons-trigger i { color: inherit } .addons-target { border: solid 1px var(--border-color); background: #fff; border-radius: 2px; width: 100%; overflow-y: auto; position: absolute; top: 0; z-index: 1; opacity: 0; visibility: hidden; -webkit-transition: all .25s ease; -moz-transition: all .25s ease; -ms-transition: all .25s ease; -o-transition: all .25s ease; transition: all .25s ease } .added--toppings .addons-target { min-width: 350px; } .addons-scroll { max-height: 350px } .addons-target.opened { top: 46px; opacity: 1; visibility: visible } .addons-target ul li { border: solid 1px transparent; padding: 10px; margin: 10px; border-radius: 2px; position: relative } .added--toppings .addons-target ul {} .added--toppings .addons-target ul li { border: none; /*  border-bottom: solid 1px var(--border-color) */ } .added--toppings .addons-target.opened { top: 27px } .addons-target ul li:hover, .addons-target ul li.is--selected { border-color: var(--first-color); /*cursor: pointer*/ } .addons-target ul li.is--selected:before { color: var(--first-color); position: absolute; top: 3px; right: 5px } .addons-target .name, .addons-target .addon--quantity { font-weight: 400; color: inherit; font-size: .8em; display: block; padding: 10px 0 } .addons-target .price { color: #000; font-weight: 600; display: block; padding: 7px 0 } .recipe-header { margin: 0 auto; max-width: 550px } .recipe-toggle-trigger { float: right } .recipe-data { display: none } .recipe-data.is-selected { display: block } .addon-image { display: inline-block; vertical-align: middle; margin-right: 5px; } .addon-image img { border-radius: 50%; width: 50px; height: 50px; } .addon-name { display: inline-block } .available-points { border: solid 1px var(--first-color); padding: 0 5px; border-radius: 2px; text-align: center; font-size: 1.5em; color: var(--first-color) } .available-points .icn { color: var(--first-color); margin-right: 5px; font-size: 1.5em; vertical-align: middle } .small-txt { font-size: .88rem } .share-list { margin: 10px 0 } .share-list li { display: inline-block; vertical-align: middle; text-align: center; min-width: 170px; margin-bottom: 5px } .share-list li a { text-align: left; border: solid 1px var(--border-color); display: block; padding: 10px 15px } .share-list li a:hover { opacity: .58 } .share-list li img { margin: 0 auto; display: table } .share-list li .icn { display: inline-block; vertical-align: middle; margin-right: 5px } .or { max-width: 150px; margin: 0 auto; position: relative; text-align: center; margin-top: 100px } .or span { font-size: 1.1em; background: #fff; padding: 0 8px; line-height: 1; margin: 0 auto; display: inline-block; position: relative; z-index: 1 } .or:after { content: ""; background: #ddd; height: 1px; width: 100%; position: absolute; top: 10px; left: 0; right: 0 } .small-container { max-width: 800px } .gift-cart { padding: 70px 0 } .gift-card-wrapper { padding-right: 50px; text-align: center } .gift-poster { text-align: center; margin: 0 auto; padding: 30px 0 } .gift-poster img { margin: 0 auto } .inline-block li { display: inline-block } .gift-card-wrapper .or { padding: 0; margin: 20px auto } .note { font-size: .8rem; font-style: italic } .alert-text { font-size: .8rem; font-style: italic; color: red; line-height: 1.2 } .alert-text i { color: inherit } .confirmation-page { max-width: 700px; margin: 50px auto; text-align: center } .confirmation-page-title { color: #a5d76e; font-size: 3.5em; line-height: 1.2; margin: 0 0 30px; text-transform: uppercase; position: relative; font-weight: 700; font-family: 'trend_hm_sansone'; text-align: center } .confirmation-page-title .icon { max-width: 100px; display: block; margin: 10px auto } .payment-declined .confirmation-page-title { color: #e24c4b } .total-payment { color: var(--first-color) } .wallet-wrap { border: solid 1px var(--border-color); border-radius: 2px; background: #fff; padding: 15px; margin-bottom: 20px } .hybrid-box { display: inline-block; vertical-align: top } .paybox { padding: 15px; border: solid 1px var(--border-color); border-radius: 2px; background: #fff; min-width: 195px } .paybox p, .remWalletBal { font-size: .78em; margin: 0 } .paybox .amount { font-weight: 600; display: block } .sign { margin: 28px 15px; font-weight: 600 } .payment_methods_ul { width: 100% !important; max-height: 275px; padding-right: 20px } .payment_methods_list li { border: solid 1px var(--border-color); border-radius: 2px; display: block; margin-bottom: 10px; position: relative; font-size: .8em } .payment_methods_list li a { color: inherit; display: block; line-height: 1.4; padding: 10px 15px } .payment_methods_list li.is-active, .payment_methods_list li:hover { border-color: var(--first-color); color: var(--first-color) } .payment-here { padding: 15px; border: solid 1px var(--border-color) } .payment-here .you-pay { background: #f8f8f8; padding: 15px } .tbl-ul>li { display: table; width: 100%; padding: 5px 0 } .tbl-ul .left-cell, .tbl-ul .right-cell { display: table-cell } .tbl-ul .left-cell { width: 30% } .tbl-ul .right-cell { width: 70% } .location { width: 100%; position: relative } .location iframe { height: 540px; vertical-align: top; width: 100% } .contact-cell { text-align: center; margin: 0 auto } .contact-cell p { line-height: 1.5; font-size: 15px; margin: 0 } .contact-cell a { color: #ff7348 } .social_media { margin: 10px 0 0 } .social_media>li { display: inline-block; vertical-align: middle; margin-right: 5px } .social_media a { background-color: #9c9b9b; border-radius: 50%; display: table; height: 28px; line-height: 24px; text-align: center; vertical-align: middle; width: 28px } .social_media a svg { color: #fff; height: 16px; margin: 0 auto; vertical-align: middle; width: 16px } .social_media a svg path { fill: #fff } .contact-cell a { color: #ff7348 } .contact-cell img { display: inline-block; margin: 10px auto } .aligner { display: flex; align-items: center; justify-content: center } .aligner-item { flex: 1 } .aligner-item--top { align-self: flex-start } .aligner-item--bottom { align-self: flex-end } .aligner-item--fixed { flex: none; max-width: 50% } .margin-auto { margin: 0 auto; float: none } .sponsored-block { padding-left: 80px } .sponsored-block .product-grid-item { border-radius: 3px; padding: 15px; border: solid 1px var(--border-color); background: #f2f2f2 } .view--more { position: relative; margin-top: -80px; padding: 70px 0 0; background: rgba(255, 255, 255, 0.13); background: -moz-linear-gradient(top, rgba(255, 255, 255, 0.13) 0%, rgba(255, 255, 255, 1) 34%, rgba(255, 255, 255, 1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0.13)), color-stop(34%, rgba(255, 255, 255, 1)), color-stop(100%, rgba(255, 255, 255, 1))); background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.13) 0%, rgba(255, 255, 255, 1) 34%, rgba(255, 255, 255, 1) 100%); background: -o-linear-gradient(top, rgba(255, 255, 255, 0.13) 0%, rgba(255, 255, 255, 1) 34%, rgba(255, 255, 255, 1) 100%); background: -ms-linear-gradient(top, rgba(255, 255, 255, 0.13) 0%, rgba(255, 255, 255, 1) 34%, rgba(255, 255, 255, 1) 100%); background: linear-gradient(to bottom, rgba(255, 255, 255, 0.13) 0%, rgba(255, 255, 255, 1) 34%, rgba(255, 255, 255, 1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ffffff', GradientType=0) } .chef-box { padding: 15px; background: #f2f2f2; border-radius: 3px; border: solid 1px var(--border-color); display: block } .chef-box .avatar { margin: 10px auto } .morecontent .js_fatbit_more_link { text-decoration: underline; color: var(--first-color) } .registration-page .navs--main>ul>li>a, .registration-page .accounts-link ul>li>a { color: #333 } .registration-page t { color: #fff } .registration-page .accounts-link ul>li.bordered>a { border-color: #333 } .registration-page .accounts-link ul>li.filled>a { color: #fff } .lang-selector { position: relative; margin: 0; display: inline-block; float: right } .lang-selector .lang-selector__trigger { position: relative; display: inline-block; padding: 0 18px 0 25px; color: inherit; font-size: 12px; text-align: left } .lang-selector .lang-selector__trigger:after { position: absolute; right: 0; top: 8px; content: ""; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid #fff } .lang-selector .lang-selector__trigger .svg-icon { position: absolute; left: 0; top: 3px; width: 14px; height: 14px; overflow: hidden } .lang-selector .lang-selector__trigger .svg-icon svg { fill: #fff } .lang-selector .lang-selector__target { position: absolute; right: 0; top: 31px; background: #fff; box-shadow: 0 10px 5px 5px rgba(0, 0, 0, 0.1); border-radius: 0 0 3px 3px; z-index: 2; min-width: 150px; text-align: left } .lang-selector .lang-selector__target ul li { border-bottom: 1px solid #ddd } .lang-selector .lang-selector__target ul li:last-child { border-bottom: none } .lang-selector .lang-selector__target ul li a { display: block; padding: 8px 10px; font-size: 12px; color: #000; text-transform: uppercase } .lang-selector .lang-selector__target ul li a:active, .lang-selector .lang-selector__target ul li a:hover { background: rgba(0, 0, 0, 0.05) } .product-content .product-name { padding-left: 24px; position: relative } .product-content .product-name .non-veg, .product-content .product-name .veg { position: absolute; left: 0; top: 0 } .favourite { right: 20px; width: 36px; height: 36px; border-radius: 100%; background: rgba(255, 255, 255, 0.7); box-shadow: 0 0 5px 5px rgba(0, 0, 0, 0.05) } .favourite .svg-icn { position: absolute; left: 0; top: 0; right: 0; margin: auto; width: 16px; height: 16px; bottom: 0 } .favourite .svg-icn svg { width: 100%; height: 100% } .favourite .svg-icn svg path { fill: #999 } .favourite.active { background: var(--first-color) } .favourite.active .svg-icn svg path { fill: #fff } .product-detail-image .favourite { right: 30px } .header__secondary { background: #000; padding: 8px 0; color: #fff; position: relative; z-index: 11; transition: all .5s; -webkit-transition: all .5s; -ms-transition: all .5s } .location-selector { position: relative; display: inline-block; float: left; margin: 2px 0 0; } .location-selector>a { font-size: 12px; color: inherit; padding: 0 15px 0 20px; position: relative; display: block; } .location-selector>a .ion-ios-location { font-size: 18px; position: absolute; left: 0; top: -1px; line-height: 1 } .location-selector>a:after { position: absolute; right: 0; top: 8px; content: ""; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 5px solid #fff } .not-yet-member .button { height: 40px; line-height: 40px; min-width: 200px; text-align: center; background: #000; color: #ffff; border-color: #000 } .not-yet-member .button span.txt { color: #fff } .favourite.favourite--static { position: relative; right: auto; top: auto !important; display: inline-block } .section-headings.section-headings--new h2 { display: inline-block; vertical-align: middle; margin-right: 10px } .section-headings.section-headings--new h2 .size28 { margin-top: 3px } .flat-tabs { display: table; margin: 70px auto 20px } .flat-tabs li { display: inline-block; vertical-align: top; margin: 0 -3px } .flat-tabs li a { display: block; padding: 20px 50px; border: 1px solid var(--border-color); color: #333; font-size: 1.3em; position: relative } .flat-tabs li.is-active a { background: var(--first-color); border-color: var(--first-color); color: #fff; z-index: 1 } .container--narrow { max-width: 1000px; margin: auto } .container--narrow .profile-dv .avatar { border: 1px solid var(--border-color); margin-right: 30px; position: relative; overflow: hidden; } .container--narrow .profile-dv .avatar img { position: absolute; left: 0; top: 0; bottom: 0; right: 0; margin: auto } .container--narrow .avatar-info h3 { font-size: 1.2em; font-weight: 500 } .container--narrow .avatar-info .review-txt { margin: 5px 0; font-size: .8em; line-height: 1.8; color: #888; font-weight: 300 } .container--narrow .discuss-area { background: rgba(0, 0, 0, 0.04); padding: 50px 50px 40px; margin-bottom: 30px } .container--narrow .discuss-area .add-comnt { max-width: 100% } .container--narrow .review-item { padding: 20px; -webkit-transition: all .25s ease; -moz-transition: all .25s ease; -ms-transition: all .25s ease; -o-transition: all .25s ease; transition: all .25s ease } .container--narrow .review-item:nth-child(odd) { background: rgba(0, 0, 0, 0.03) } .container--narrow .review-item:hover { box-shadow: 0 20px 20px 5px rgba(0, 0, 0, 0.03) } .container--narrow .review-item:last-child { margin-bottom: 20px } .buyer-div fieldset [class*="col-"] { padding: 0 } .recipientdetail fieldset [class*="col-"]:first-child { padding-left: 0 } .fav-list-opt li { display: inline-block; margin: 0 5px; } /*22 oct 2019 1:46PM*/ /** 10 Dec 2019 - **/ .table tr td a.button{margin-bottom:10px;} /** 10 Dec 2019 - **/ .d-inline{display: inline-block !important;} .addon_remove{padding-top:7px;color: var(--first-color);cursor: pointer;}@media only screen and (max-width: 1599px) { .shopping-cart-table .select-small.date { width: 120px; font-size: 0.75em; } .shopping-cart-table .cart-price { font-size: 0.9em; } } @media only screen and (max-width: 1366px) { .registration-page:before, .registration-page:after { content: normal; } .registration-page #header { background: #fff; } } @media only screen and (max-width: 1300px) { html { font-size: 14px; } .listing-page .container, .chef-dishes .container { padding: 0 15px; } .filter-bar ul.filter-ul li { padding: 0 10px; } .product-listing-wrpper { margin-top: 20px; } .left-filters { padding-left: 10px; } .banner-text{ top: 0px; right: 20px; margin-right: 0; width: 335px; height: 335px; padding-top: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; } } @media(max-width:1200px) { body.fixed .header__secondary { margin-top: -40px; } .header-inner { position: relative; } .logo { max-width: 125px; margin-top: 5px; margin-bottom: 5px; } .toggle--account, .toggle--dashboard { margin: 10px 5px; } .lang-selector .lang-selector__target { top: 28px; } .accounts-linkul>li>a { color: #000; border: 1px solid #000; } .accounts-link .filled>a { border-color: #000; } .registration-middle { padding-top: 110px; } } @media only screen and (max-width: 1025px) { html { font-size: 14px; } .hide--desktop { display: block !important; } .after-header { height: 95px; } .logo { margin-left: 50px; } .hero-detail { top: 50%; left: 0; right: 0; margin: 0 auto; transform: translateY(-50%); width: 500px; height: 500px; padding-top: 100px; } .slide-img::before { padding-bottom: 0px; } .slide-img { background-size: cover; } .banner-text { position: relative; top: 0; right: auto; margin-right: 0; z-index: 2; color: #fff; width: auto; height: auto; display: block; border-radius: 0; background: rgba(243, 114, 66, 0.89); text-align: center; padding: 10px; max-width: 500px; margin: 0 auto; } .banner-text h2 { font-size: 2em; padding: 0 0; } .banner-text p { padding: 0; margin-bottom: 5px; } .accounts-popup { max-width: none; padding: 0; margin: 0; background: rgba(255, 255, 255, 0.98); height: 100%; overflow-y: auto; position: fixed; left: 0; right: 0; bottom: 0; top: 0; z-index: 113; opacity: 0; visibility: hidden; -webkit-transition: all 400ms ease-in; -webkit-transform: scale(0); -ms-transition: all 400ms ease-in; -ms-transform: scale(1); -moz-transition: all 400ms ease-in; -moz-transform: scale(0); transition: all 400ms ease-in; transform: scale(0); } .is--account-visible .accounts-popup { opacity: 1; visibility: visible; -webkit-transform: scale(1); -ms-transform: scale(1); -moz-transform: scale(1); transform: scale(1); } .dashboard-nav-popup, .accounts-popup { max-width: none; padding: 0; margin: 0; /*  background: rgba(255, 255, 255, 0.98);*/ background: url(images/meal-pattern-light2.png); height: 100%; overflow-y: auto; position: fixed; left: 0; right: 0; bottom: 0; top: 0; z-index: 113; width: 270px; opacity: 0; visibility: hidden; transform: translate3d(-350px, 0px, 0px); -webkit-transform: translate3d(-350px, 0px, 0px); -ms-transform: translate3d(-350px, 0px, 0px); transition: all 300ms ease 0s; -webkit-transition: all 300ms ease 0s; -ms-transition: all 300ms ease 0s; } .is--dashboard-visible .dashboard-nav-popup, .is--account-visible .accounts-popup { opacity: 1; transform: translate3d(0px, 0px, 0px); -webkit-transform: translate3d(0px, 0px, 0px); -ms-transform: translate3d(0px, 0px, 0px); visibility: visible; } .fixed__panel { position: static; top: auto; } .link__close { height: 40px; width: 40px; position: absolute; left: 10px; top: 10px; z-index: 10; background: url(images/retina/close.svg) no-repeat center center; background-size: 30px; opacity: 0.7; } .toggle--account, .toggle--dashboard { display: inline-block; height: 30px; width: 30px; vertical-align: top; margin: 0px 5px; float: right; background: url(images/retina/user.svg) no-repeat center center; background-size: 30px; } .registration-page .toggle--account, .registration-page .toggle--dashboard { background: url(images/retina/user-yellow.svg) no-repeat center center; } .toggle--dashboard { background: url(images/retina/dashmenu.svg) no-repeat center center; } .accounts-link>ul, .dashboard-nav-popup>ul { top: 0; transform: none; width: 100%; padding: 10px; position: absolute; margin: 0 auto; left: 0; right: 0; max-width: 400px; text-align: center; margin-top: 50px; } .dashboard-nav-popup ul { text-align: left; } .dashboard-wrapper { position: static; } .dashboard-wrapper .dashboard-left, .dashboard-wrapper .dashboard-right {} .dashboard-wrapper .dashboard-right { border-left: none; } .dashboard-padding { padding: 0; } .page-data { max-width: none; padding-top: 10px; } .circle-image-wrapper { width: 300px; margin: 0 auto; height: auto; } .side-txt { padding: 0; } .food-system { background-size: 100%; } /*page*/ .small-header, .small-header-b { height: auto; } .page-title h1 { font-size: 2.2em; } .negetive-wrapper { padding: 20px 0; margin: 0; } .panel-heading h2 { line-height: 1; } .plan { margin: 30px 0; } .chef-profile { padding: 0; margin: 10px auto; } .stats { margin-bottom: 10px; } .table { width: 100%; overflow-x: scroll; } .page-title { position: static; transform: none; padding: 50px 0; } .filter-bar ul.filter-ul li { padding: 0 10px; } .product-listing-wrpper { margin-top: 20px; } .left-filters { padding-left: 10px; width: 30%; } .product-list { width: 70%; } .product-list .product-grid-item { width: 50%; } .product-list .product-grid-item-favorites { width: 33.3333333%; } .product-listing-wrpper.hide--filters .product-list .product-grid-item { width: 33.3333333%; } .registration-page:before, .registration-page:after { content: normal; } .registration-page #header { background: #fff; } .page-tabs li a { padding: 7px 10px; } .meal-recipe-slider .slick-prev, .featured-slider .slick-prev, .weekly-slider .slick-prev { left: 10px; margin: 0; } .meal-recipe-slider .slick-next, .featured-slider .slick-next, .weekly-slider .slick-next { right: 10px; margin: 0; } .meal-recipe-slider .slick-arrow, .featured-slider .slick-arrow, .weekly-slider .slick-arrow { width: 40px; height: 40px; background-size: 24px; } .slider-sticker-wrapper { margin-left: 0; padding: 20px; } .reviewtable .cart-main { width: 60%; } .reviewtable .cart-footer { width: 40%; } .tabs { white-space: nowrap; overflow-x: scroll; width: 100%; } .tabs ul {} .tabs li { display: inline-block; white-space: nowrap; } .tabs li:after { bottom: 0; } .product-description { padding-left: 0; } .copyright-reg { background: var(--second-color); } .shopping-cart-table { display: block; overflow-x: scroll; } .review-data { padding: 0 10px; } .cart-main { padding: 0; } .reviewtable .cart-main { width: auto; display: block; } .reviewtable .cart-footer { width: auto; display: block; max-width: none; border: none; border-top: solid 1px var(--border-color); } .on-detail-chef-profile::before { content: normal; } .sponsored-block { padding-left: 0; } .stick-cart-total .btn { margin: 2px 0; } .lang-selector .lang-selector__target { right: auto; left: 0; } } @media screen and (max-width:992px) { .ingredients-listing li { width: 45%; } } @media screen and (max-width: 767px) { html { font-size: 13px; } .product-list .product-grid-item-favorites { width: 50%; } .hide--mobile { display: none !important; } .fixed-container { margin: 0 auto; max-width: none; padding: 0 15px; } .section { padding: 20px 0; } .footer { background-size: contain; } .f-links h3 { position: relative; margin-bottom: 5px; } .f-links h3:before { background: #44596B; content: ''; height: 2px; margin-right: 10px; position: absolute; right: 0; top: 50%; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; width: 14px; } .f-links h3:after { background: #44596B; content: ''; height: 2px; margin-right: 10px; position: absolute; right: 0; top: 50%; width: 14px; } .f-links h3.active:before { -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); } .f-links ul { display: none; } .app-adds { position: static; padding: 10px 0; max-width: 200px; } .middle-footer { padding-top: 0; } .chef-profile { text-align: center; display: block; } .action-profile { float: none; margin: 0 auto; text-align: center; } .product-list { float: none; width: auto; } .sort-by .sort-txt { display: none; } .left-filters { position: fixed; top: 0; bottom: 0; height: 100%; width: 260px; background: #fff; z-index: 15; transform: translate(-125%, 0px); opacity: 0; } .product-listing-wrpper.hide--filters .left-filters { opacity: 1; transform: translate(0px, 0px); height: 100%; width: 260px; visibility: visible; overflow-y: auto; display: block; } .filter-bar>ul>li { vertical-align: top; } .product-list .card { float: none; margin: 0; width: auto; } .product-listing-wrpper.hide--filters .overlay { opacity: 1; visibility: visible; } .filter-bar>ul>li.first-cell { width: auto; } .filter-switch { padding: 10px 0; } .filter-switch span { display: none; } .review-product-img { width: 250px; height: 250px; } .product-review { text-align: center; } .registration-middle { padding: 115px 10px; } .page-tabs ul { padding: 10px; } .page-tabs-data .form { padding: 10px 15px; } .table-listing { overflow-x: scroll; display: block; } .recipe-features { float: none; display: inline-block; } .instructions-tbl .image-cell { display: block; padding: 0 0 100% 0; } .instructions-tbl .txt-cell { display: block; padding: 0; } .instructions-tbl { padding: 0; } .need-ingredients-list { margin-top: 10px; } .hero-slider { height: 360px; } .hero-detail { width: 300px; height: 300px; padding: 30px 0; } .hero-detail h1 { font-size: 1.5em; } .hero-detail p { font-size: 1em; } .slider-sticker-wrapper { display: none; } .featured-slider .slick-slide { margin: 0; } .weekly-slider .slick-slide { margin: 0; } .testimonial-box { margin: 0; padding: 10px; } .side-txt { text-align: center; } .side-txt li { text-align: left; } .side-txt .section-headings h2 { text-align: center; } .side-txt .section-headings h2:after { margin: 0 auto; right: 0; } .review-data { padding: 0 10px; overflow-x: hidden; } .cart-main { padding: 0; } .reviewtable .cart-main { padding: 0 15px; } .reviewtable .cart-main, .reviewtable .cart-footer { display: block; width: auto; } .shopping-cart-table { display: block; overflow-x: scroll; } .tab-heading { margin: 10px auto; } .menu-pic { width: 280px; height: auto; } .menu-actions a { margin: 0 5px; } .order-bottom { float: none; width: auto; } .head-left { display: block; float: none; margin: 0; margin-bottom: 5px; } .head-right { float: none; display: block; } #listing .table-head { display: inline-block; width: 100%; } #listing .table-head .head-left { float: left; } #listing .table-head .head-right { float: right; padding-top: 5px; } .product-description { padding-top: 20px; } .price-fetures ul li { white-space: normal; } .checkout-data { padding: 0 10px; } .tabs-left { float: none; width: auto; border-right: none; border-bottom: solid 1px var(--border-color); padding: 0; } .tabs-right { float: none; width: auto; padding: 0; } .all-addresses li { float: none; width: auto; padding-right: 0; } .all-addresses li:nth-child(even) { border-left: none; } .cart-footer { border-left: none; } .review-data .reviewtable .cart-main { padding: 0; } .instructions-tbl.instructions-tbl-odd .image-cell:before { margin-left: 10px; } .instructions-tbl .image-cell:before { margin-right: 10px; top: 10px; } .over-detail h3 { line-height: 1; font-size: 1.5em; } .over-detail p { display: none; } .recipe-filter-trigger { display: inline-block; } .recipe-filters-panel { background: #fff; bottom: 0; box-shadow: 0 0 10px rgba(51, 51, 51, 0.38); left: 0; margin: 0; overflow: auto; position: fixed; text-align: left; top: 0; transform: translate3d(-350px, 0px, 0px); -webkit-transform: translate3d(-350px, 0px, 0px); -ms-transform: translate3d(-350px, 0px, 0px); transition: all 300ms ease 0s; -webkit-transition: all 300ms ease 0s; -ms-transition: all 300ms ease 0s; width: 270px; opacity: 0; visibility: hidden; z-index: 111; padding: 10px; } body.toggled-filtered .recipe-filters-panel { opacity: 1; transform: translate3d(0px, 0px, 0px); -webkit-transform: translate3d(0px, 0px, 0px); -ms-transform: translate3d(0px, 0px, 0px); visibility: visible; } .listing-page .container, .chef-dishes .container { padding: 0; } .location-popup-content { display: block; width: auto; height: auto; padding: 15px; } .branding { float: none; width: auto; margin-bottom: 10px; } .branding-logo { transform: none; position: static; ; } .location-search-wrapper { float: none; width: auto; margin: 0; } .location-search .close-btn { top: 0; right: 0; } .or { margin: 15px auto; } .share-via { text-align: center; } .share-list li { margin: 4px auto; min-width: inherit; } .gift-card-wrapper { padding-right: 0; } .gift-poster { padding: 10px 0; } .addons-trigger { min-width: inherit; } .addons-target { width: auto; } .checkout-nav ul li { padding: 0 10px; margin: 0; } .buttons-last a { padding: 0 10px; margin: 3px auto; } .accounts-link>ul>li { display: block; margin: 15px auto; max-height: 250px; } .model-box-mid.location-search { background-color: transparent !important; background-size: cover; } .page-banner .banner-txt { max-width: 100%; padding: 20px; } .page-banner .banner-txt h1 { font-size: 1.6em; } .page-banner .banner-txt h4 { font-size: 1.1em; } .sponsored-block { padding: 0; } .week-slider { padding: 15px 40px; } .week-slider .slick-prev { left: 0; } .week-slider .slick-next { right: 0; } .blog-type-content { padding-left: 0; } .app-adds { max-width: 100%; } .app-adds .f-logo { width: 200px; margin: auto; } .lang-selector .lang-selector__trigger { color: #fff; font-size: 12px; } .lang-selector .lang-selector__trigger .svg-icon svg { fill: #fff; } .product-list .product-grid-item { float: none; display: inline-block; vertical-align: top; margin: 0 -2px; } .section-headings h2 { font-size: 1.3em; } .g-recaptcha { transform: scale(0.85); -webkit-transform: scale(0.85); -ms-transform: scale(0.85); } .copyright-reg { padding-bottom: 10px; } a.button.view { margin-bottom: 4px; } .ingredients-listing li { width: 46%; text-align: center; ; } .ingredients-listing .icn { display: block; } .ingredients-listing .icn img { display: inline-block; } .avatar-info { display: block; } .readymeals-wrapper { padding: 0; } .product-price { float: none; margin: 5px 0; } .checkbox, .radio { font-size: 1em; } .profile-dv .avatar { width: 60px; height: 60px; } .flat-tabs { padding: 10px; margin: 0 auto; } .flat-tabs li a { padding: 10px; font-size: 1em; } .container--narrow .review-item { padding: 10px; } .instructions-tbl .txt-cell p { font-size: 1em; } .login-form-front { padding: 20px; } .pop-model-table { display: block; } .model-box-content { display: block; margin: 0 auto; } .model-box-content { min-width: 100%; padding: 10px; /*  padding-top: 0;*/ transform: scale(1); -webkit-transform: scale(1); } .close-btn { right: 0px; top: 0px; } .pop-model-box { display: block; } .pop-model { position: absolute; } .payment_methods_ul { padding-right: 0; } } @media screen and (max-width: 480px) { .table { display: block; } .table-head { /*  display: block;*/ } .page-data .table-head { display: block; } .section-headings.section-headings--new h2 .size28 { width: 16px; height: 16px; } .location-selector>a { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 80%; } .sort-toggle>a { margin-left: 20px; } .model-box-mid.location-search { background-color: transparent !important; background-size: cover; } } @font-face { font-family: "Ionicons"; src: url("fonts/ionicons.eot?v=2.0.0"); src: url("fonts/ionicons.eot?v=2.0.0#iefix") format("embedded-opentype"), url("fonts/ionicons.ttf?v=2.0.0") format("truetype"), url("fonts/ionicons.woff?v=2.0.0") format("woff"), url("fonts/ionicons.svg?v=2.0.0#Ionicons") format("svg"); font-weight: normal; font-style: normal; } .ion, .ionicons, .ion-alert:before, .ion-alert-circled:before, .ion-android-add:before, .ion-android-add-circle:before, .ion-android-alarm-clock:before, .ion-android-alert:before, .ion-android-apps:before, .ion-android-archive:before, .ion-android-arrow-back:before, .ion-android-arrow-down:before, .ion-android-arrow-dropdown:before, .ion-android-arrow-dropdown-circle:before, .ion-android-arrow-dropleft:before, .ion-android-arrow-dropleft-circle:before, .ion-android-arrow-dropright:before, .ion-android-arrow-dropright-circle:before, .ion-android-arrow-dropup:before, .ion-android-arrow-dropup-circle:before, .ion-android-arrow-forward:before, .ion-android-arrow-up:before, .ion-android-attach:before, .ion-android-bar:before, .ion-android-bicycle:before, .ion-android-boat:before, .ion-android-bookmark:before, .ion-android-bulb:before, .ion-android-bus:before, .ion-android-calendar:before, .ion-android-call:before, .ion-android-camera:before, .ion-android-cancel:before, .ion-android-car:before, .ion-android-cart:before, .ion-android-chat:before, .ion-android-checkbox:before, .ion-android-checkbox-blank:before, .ion-android-checkbox-outline:before, .ion-android-checkbox-outline-blank:before, .ion-android-checkmark-circle:before, .ion-android-clipboard:before, .ion-android-close:before, .ion-android-cloud:before, .ion-android-cloud-circle:before, .ion-android-cloud-done:before, .ion-android-cloud-outline:before, .ion-android-color-palette:before, .ion-android-compass:before, .ion-android-contact:before, .ion-android-contacts:before, .ion-android-contract:before, .ion-android-create:before, .ion-android-delete:before, .ion-android-desktop:before, .ion-android-document:before, .ion-android-done:before, .ion-android-done-all:before, .ion-android-download:before, .ion-android-drafts:before, .ion-android-exit:before, .ion-android-expand:before, .ion-android-favorite:before, .ion-android-favorite-outline:before, .ion-android-film:before, .ion-android-folder:before, .ion-android-folder-open:before, .ion-android-funnel:before, .ion-android-globe:before, .ion-android-hand:before, .ion-android-hangout:before, .ion-android-happy:before, .ion-android-home:before, .ion-android-image:before, .ion-android-laptop:before, .ion-android-list:before, .ion-android-locate:before, .ion-android-lock:before, .ion-android-mail:before, .ion-android-map:before, .ion-android-menu:before, .ion-android-microphone:before, .ion-android-microphone-off:before, .ion-android-more-horizontal:before, .ion-android-more-vertical:before, .ion-android-navigate:before, .ion-android-notifications:before, .ion-android-notifications-none:before, .ion-android-notifications-off:before, .ion-android-open:before, .ion-android-options:before, .ion-android-people:before, .ion-android-person:before, .ion-android-person-add:before, .ion-android-phone-landscape:before, .ion-android-phone-portrait:before, .ion-android-pin:before, .ion-android-plane:before, .ion-android-playstore:before, .ion-android-print:before, .ion-android-radio-button-off:before, .ion-android-radio-button-on:before, .ion-android-refresh:before, .ion-android-remove:before, .ion-android-remove-circle:before, .ion-android-restaurant:before, .ion-android-sad:before, .ion-android-search:before, .ion-android-send:before, .ion-android-settings:before, .ion-android-share:before, .ion-android-share-alt:before, .ion-android-star:before, .ion-android-star-half:before, .ion-android-star-outline:before, .ion-android-stopwatch:before, .ion-android-subway:before, .ion-android-sunny:before, .ion-android-sync:before, .ion-android-textsms:before, .ion-android-time:before, .ion-android-train:before, .ion-android-unlock:before, .ion-android-upload:before, .ion-android-volume-down:before, .ion-android-volume-mute:before, .ion-android-volume-off:before, .ion-android-volume-up:before, .ion-android-walk:before, .ion-android-warning:before, .ion-android-watch:before, .ion-android-wifi:before, .ion-aperture:before, .ion-archive:before, .ion-arrow-down-a:before, .ion-arrow-down-b:before, .ion-arrow-down-c:before, .ion-arrow-expand:before, .ion-arrow-graph-down-left:before, .ion-arrow-graph-down-right:before, .ion-arrow-graph-up-left:before, .ion-arrow-graph-up-right:before, .ion-arrow-left-a:before, .ion-arrow-left-b:before, .ion-arrow-left-c:before, .ion-arrow-move:before, .ion-arrow-resize:before, .ion-arrow-return-left:before, .ion-arrow-return-right:before, .ion-arrow-right-a:before, .ion-arrow-right-b:before, .ion-arrow-right-c:before, .ion-arrow-shrink:before, .ion-arrow-swap:before, .ion-arrow-up-a:before, .ion-arrow-up-b:before, .ion-arrow-up-c:before, .ion-asterisk:before, .ion-at:before, .ion-backspace:before, .ion-backspace-outline:before, .ion-bag:before, .ion-battery-charging:before, .ion-battery-empty:before, .ion-battery-full:before, .ion-battery-half:before, .ion-battery-low:before, .ion-beaker:before, .ion-beer:before, .ion-bluetooth:before, .ion-bonfire:before, .ion-bookmark:before, .ion-bowtie:before, .ion-briefcase:before, .ion-bug:before, .ion-calculator:before, .ion-calendar:before, .ion-camera:before, .ion-card:before, .ion-cash:before, .ion-chatbox:before, .ion-chatbox-working:before, .ion-chatboxes:before, .ion-chatbubble:before, .ion-chatbubble-working:before, .ion-chatbubbles:before, .ion-checkmark:before, .ion-checkmark-circled:before, .ion-checkmark-round:before, .ion-chevron-down:before, .ion-chevron-left:before, .ion-chevron-right:before, .ion-chevron-up:before, .ion-clipboard:before, .ion-clock:before, .ion-close:before, .ion-close-circled:before, .ion-close-round:before, .ion-closed-captioning:before, .ion-cloud:before, .ion-code:before, .ion-code-download:before, .ion-code-working:before, .ion-coffee:before, .ion-compass:before, .ion-compose:before, .ion-connection-bars:before, .ion-contrast:before, .ion-crop:before, .ion-cube:before, .ion-disc:before, .ion-document:before, .ion-document-text:before, .ion-drag:before, .ion-earth:before, .ion-easel:before, .ion-edit:before, .ion-egg:before, .ion-eject:before, .ion-email:before, .ion-email-unread:before, .ion-erlenmeyer-flask:before, .ion-erlenmeyer-flask-bubbles:before, .ion-eye:before, .ion-eye-disabled:before, .ion-female:before, .ion-filing:before, .ion-film-marker:before, .ion-fireball:before, .ion-flag:before, .ion-flame:before, .ion-flash:before, .ion-flash-off:before, .ion-folder:before, .ion-fork:before, .ion-fork-repo:before, .ion-forward:before, .ion-funnel:before, .ion-gear-a:before, .ion-gear-b:before, .ion-grid:before, .ion-hammer:before, .ion-happy:before, .ion-happy-outline:before, .ion-headphone:before, .ion-heart:before, .ion-heart-broken:before, .ion-help:before, .ion-help-buoy:before, .ion-help-circled:before, .ion-home:before, .ion-icecream:before, .ion-image:before, .ion-images:before, .ion-information:before, .ion-information-circled:before, .ion-ionic:before, .ion-ios-alarm:before, .ion-ios-alarm-outline:before, .ion-ios-albums:before, .ion-ios-albums-outline:before, .ion-ios-americanfootball:before, .ion-ios-americanfootball-outline:before, .ion-ios-analytics:before, .ion-ios-analytics-outline:before, .ion-ios-arrow-back:before, .ion-ios-arrow-down:before, .ion-ios-arrow-forward:before, .ion-ios-arrow-left:before, .ion-ios-arrow-right:before, .ion-ios-arrow-thin-down:before, .ion-ios-arrow-thin-left:before, .ion-ios-arrow-thin-right:before, .ion-ios-arrow-thin-up:before, .ion-ios-arrow-up:before, .ion-ios-at:before, .ion-ios-at-outline:before, .ion-ios-barcode:before, .ion-ios-barcode-outline:before, .ion-ios-baseball:before, .ion-ios-baseball-outline:before, .ion-ios-basketball:before, .ion-ios-basketball-outline:before, .ion-ios-bell:before, .ion-ios-bell-outline:before, .ion-ios-body:before, .ion-ios-body-outline:before, .ion-ios-bolt:before, .ion-ios-bolt-outline:before, .ion-ios-book:before, .ion-ios-book-outline:before, .ion-ios-bookmarks:before, .ion-ios-bookmarks-outline:before, .ion-ios-box:before, .ion-ios-box-outline:before, .ion-ios-briefcase:before, .ion-ios-briefcase-outline:before, .ion-ios-browsers:before, .ion-ios-browsers-outline:before, .ion-ios-calculator:before, .ion-ios-calculator-outline:before, .ion-ios-calendar:before, .ion-ios-calendar-outline:before, .ion-ios-camera:before, .ion-ios-camera-outline:before, .ion-ios-cart:before, .ion-ios-cart-outline:before, .ion-ios-chatboxes:before, .ion-ios-chatboxes-outline:before, .ion-ios-chatbubble:before, .ion-ios-chatbubble-outline:before, .ion-ios-checkmark:before, .ion-ios-checkmark-empty:before, .ion-ios-checkmark-outline:before, .ion-ios-circle-filled:before, .ion-ios-circle-outline:before, .ion-ios-clock:before, .ion-ios-clock-outline:before, .ion-ios-close:before, .ion-ios-close-empty:before, .ion-ios-close-outline:before, .ion-ios-cloud:before, .ion-ios-cloud-download:before, .ion-ios-cloud-download-outline:before, .ion-ios-cloud-outline:before, .ion-ios-cloud-upload:before, .ion-ios-cloud-upload-outline:before, .ion-ios-cloudy:before, .ion-ios-cloudy-night:before, .ion-ios-cloudy-night-outline:before, .ion-ios-cloudy-outline:before, .ion-ios-cog:before, .ion-ios-cog-outline:before, .ion-ios-color-filter:before, .ion-ios-color-filter-outline:before, .ion-ios-color-wand:before, .ion-ios-color-wand-outline:before, .ion-ios-compose:before, .ion-ios-compose-outline:before, .ion-ios-contact:before, .ion-ios-contact-outline:before, .ion-ios-copy:before, .ion-ios-copy-outline:before, .ion-ios-crop:before, .ion-ios-crop-strong:before, .ion-ios-download:before, .ion-ios-download-outline:before, .ion-ios-drag:before, .ion-ios-email:before, .ion-ios-email-outline:before, .ion-ios-eye:before, .ion-ios-eye-outline:before, .ion-ios-fastforward:before, .ion-ios-fastforward-outline:before, .ion-ios-filing:before, .ion-ios-filing-outline:before, .ion-ios-film:before, .ion-ios-film-outline:before, .ion-ios-flag:before, .ion-ios-flag-outline:before, .ion-ios-flame:before, .ion-ios-flame-outline:before, .ion-ios-flask:before, .ion-ios-flask-outline:before, .ion-ios-flower:before, .ion-ios-flower-outline:before, .ion-ios-folder:before, .ion-ios-folder-outline:before, .ion-ios-football:before, .ion-ios-football-outline:before, .ion-ios-game-controller-a:before, .ion-ios-game-controller-a-outline:before, .ion-ios-game-controller-b:before, .ion-ios-game-controller-b-outline:before, .ion-ios-gear:before, .ion-ios-gear-outline:before, .ion-ios-glasses:before, .ion-ios-glasses-outline:before, .ion-ios-grid-view:before, .ion-ios-grid-view-outline:before, .ion-ios-heart:before, .ion-ios-heart-outline:before, .ion-ios-help:before, .ion-ios-help-empty:before, .ion-ios-help-outline:before, .ion-ios-home:before, .ion-ios-home-outline:before, .ion-ios-infinite:before, .ion-ios-infinite-outline:before, .ion-ios-information:before, .ion-ios-information-empty:before, .ion-ios-information-outline:before, .ion-ios-ionic-outline:before, .ion-ios-keypad:before, .ion-ios-keypad-outline:before, .ion-ios-lightbulb:before, .ion-ios-lightbulb-outline:before, .ion-ios-list:before, .ion-ios-list-outline:before, .ion-ios-location:before, .ion-ios-location-outline:before, .ion-ios-locked:before, .ion-ios-locked-outline:before, .ion-ios-loop:before, .ion-ios-loop-strong:before, .ion-ios-medical:before, .ion-ios-medical-outline:before, .ion-ios-medkit:before, .ion-ios-medkit-outline:before, .ion-ios-mic:before, .ion-ios-mic-off:before, .ion-ios-mic-outline:before, .ion-ios-minus:before, .ion-ios-minus-empty:before, .ion-ios-minus-outline:before, .ion-ios-monitor:before, .ion-ios-monitor-outline:before, .ion-ios-moon:before, .ion-ios-moon-outline:before, .ion-ios-more:before, .ion-ios-more-outline:before, .ion-ios-musical-note:before, .ion-ios-musical-notes:before, .ion-ios-navigate:before, .ion-ios-navigate-outline:before, .ion-ios-nutrition:before, .ion-ios-nutrition-outline:before, .ion-ios-paper:before, .ion-ios-paper-outline:before, .ion-ios-paperplane:before, .ion-ios-paperplane-outline:before, .ion-ios-partlysunny:before, .ion-ios-partlysunny-outline:before, .ion-ios-pause:before, .ion-ios-pause-outline:before, .ion-ios-paw:before, .ion-ios-paw-outline:before, .ion-ios-people:before, .ion-ios-people-outline:before, .ion-ios-person:before, .ion-ios-person-outline:before, .ion-ios-personadd:before, .ion-ios-personadd-outline:before, .ion-ios-photos:before, .ion-ios-photos-outline:before, .ion-ios-pie:before, .ion-ios-pie-outline:before, .ion-ios-pint:before, .ion-ios-pint-outline:before, .ion-ios-play:before, .ion-ios-play-outline:before, .ion-ios-plus:before, .ion-ios-plus-empty:before, .ion-ios-plus-outline:before, .ion-ios-pricetag:before, .ion-ios-pricetag-outline:before, .ion-ios-pricetags:before, .ion-ios-pricetags-outline:before, .ion-ios-printer:before, .ion-ios-printer-outline:before, .ion-ios-pulse:before, .ion-ios-pulse-strong:before, .ion-ios-rainy:before, .ion-ios-rainy-outline:before, .ion-ios-recording:before, .ion-ios-recording-outline:before, .ion-ios-redo:before, .ion-ios-redo-outline:before, .ion-ios-refresh:before, .ion-ios-refresh-empty:before, .ion-ios-refresh-outline:before, .ion-ios-reload:before, .ion-ios-reverse-camera:before, .ion-ios-reverse-camera-outline:before, .ion-ios-rewind:before, .ion-ios-rewind-outline:before, .ion-ios-rose:before, .ion-ios-rose-outline:before, .ion-ios-search:before, .ion-ios-search-strong:before, .ion-ios-settings:before, .ion-ios-settings-strong:before, .ion-ios-shuffle:before, .ion-ios-shuffle-strong:before, .ion-ios-skipbackward:before, .ion-ios-skipbackward-outline:before, .ion-ios-skipforward:before, .ion-ios-skipforward-outline:before, .ion-ios-snowy:before, .ion-ios-speedometer:before, .ion-ios-speedometer-outline:before, .ion-ios-star:before, .ion-ios-star-half:before, .ion-ios-star-outline:before, .ion-ios-stopwatch:before, .ion-ios-stopwatch-outline:before, .ion-ios-sunny:before, .ion-ios-sunny-outline:before, .ion-ios-telephone:before, .ion-ios-telephone-outline:before, .ion-ios-tennisball:before, .ion-ios-tennisball-outline:before, .ion-ios-thunderstorm:before, .ion-ios-thunderstorm-outline:before, .ion-ios-time:before, .ion-ios-time-outline:before, .ion-ios-timer:before, .ion-ios-timer-outline:before, .ion-ios-toggle:before, .ion-ios-toggle-outline:before, .ion-ios-trash:before, .ion-ios-trash-outline:before, .ion-ios-undo:before, .ion-ios-undo-outline:before, .ion-ios-unlocked:before, .ion-ios-unlocked-outline:before, .ion-ios-upload:before, .ion-ios-upload-outline:before, .ion-ios-videocam:before, .ion-ios-videocam-outline:before, .ion-ios-volume-high:before, .ion-ios-volume-low:before, .ion-ios-wineglass:before, .ion-ios-wineglass-outline:before, .ion-ios-world:before, .ion-ios-world-outline:before, .ion-ipad:before, .ion-iphone:before, .ion-ipod:before, .ion-jet:before, .ion-key:before, .ion-knife:before, .ion-laptop:before, .ion-leaf:before, .ion-levels:before, .ion-lightbulb:before, .ion-link:before, .ion-load-a:before, .ion-load-b:before, .ion-load-c:before, .ion-load-d:before, .ion-location:before, .ion-lock-combination:before, .ion-locked:before, .ion-log-in:before, .ion-log-out:before, .ion-loop:before, .ion-magnet:before, .ion-male:before, .ion-man:before, .ion-map:before, .ion-medkit:before, .ion-merge:before, .ion-mic-a:before, .ion-mic-b:before, .ion-mic-c:before, .ion-minus:before, .ion-minus-circled:before, .ion-minus-round:before, .ion-model-s:before, .ion-monitor:before, .ion-more:before, .ion-mouse:before, .ion-music-note:before, .ion-navicon:before, .ion-navicon-round:before, .ion-navigate:before, .ion-network:before, .ion-no-smoking:before, .ion-nuclear:before, .ion-outlet:before, .ion-paintbrush:before, .ion-paintbucket:before, .ion-paper-airplane:before, .ion-paperclip:before, .ion-pause:before, .ion-person:before, .ion-person-add:before, .ion-person-stalker:before, .ion-pie-graph:before, .ion-pin:before, .ion-pinpoint:before, .ion-pizza:before, .ion-plane:before, .ion-planet:before, .ion-play:before, .ion-playstation:before, .ion-plus:before, .ion-plus-circled:before, .ion-plus-round:before, .ion-podium:before, .ion-pound:before, .ion-power:before, .ion-pricetag:before, .ion-pricetags:before, .ion-printer:before, .ion-pull-request:before, .ion-qr-scanner:before, .ion-quote:before, .ion-radio-waves:before, .ion-record:before, .ion-refresh:before, .ion-reply:before, .ion-reply-all:before, .ion-ribbon-a:before, .ion-ribbon-b:before, .ion-sad:before, .ion-sad-outline:before, .ion-scissors:before, .ion-search:before, .ion-settings:before, .ion-share:before, .ion-shuffle:before, .ion-skip-backward:before, .ion-skip-forward:before, .ion-social-android:before, .ion-social-android-outline:before, .ion-social-angular:before, .ion-social-angular-outline:before, .ion-social-apple:before, .ion-social-apple-outline:before, .ion-social-bitcoin:before, .ion-social-bitcoin-outline:before, .ion-social-buffer:before, .ion-social-buffer-outline:before, .ion-social-chrome:before, .ion-social-chrome-outline:before, .ion-social-codepen:before, .ion-social-codepen-outline:before, .ion-social-css3:before, .ion-social-css3-outline:before, .ion-social-designernews:before, .ion-social-designernews-outline:before, .ion-social-dribbble:before, .ion-social-dribbble-outline:before, .ion-social-dropbox:before, .ion-social-dropbox-outline:before, .ion-social-euro:before, .ion-social-euro-outline:before, .ion-social-facebook:before, .ion-social-facebook-outline:before, .ion-social-foursquare:before, .ion-social-foursquare-outline:before, .ion-social-freebsd-devil:before, .ion-social-github:before, .ion-social-github-outline:before, .ion-social-google:before, .ion-social-google-outline:before, .ion-social-googleplus:before, .ion-social-googleplus-outline:before, .ion-social-hackernews:before, .ion-social-hackernews-outline:before, .ion-social-html5:before, .ion-social-html5-outline:before, .ion-social-instagram:before, .ion-social-instagram-outline:before, .ion-social-javascript:before, .ion-social-javascript-outline:before, .ion-social-linkedin:before, .ion-social-linkedin-outline:before, .ion-social-markdown:before, .ion-social-nodejs:before, .ion-social-octocat:before, .ion-social-pinterest:before, .ion-social-pinterest-outline:before, .ion-social-python:before, .ion-social-reddit:before, .ion-social-reddit-outline:before, .ion-social-rss:before, .ion-social-rss-outline:before, .ion-social-sass:before, .ion-social-skype:before, .ion-social-skype-outline:before, .ion-social-snapchat:before, .ion-social-snapchat-outline:before, .ion-social-tumblr:before, .ion-social-tumblr-outline:before, .ion-social-tux:before, .ion-social-twitch:before, .ion-social-twitch-outline:before, .ion-social-twitter:before, .ion-social-twitter-outline:before, .ion-social-usd:before, .ion-social-usd-outline:before, .ion-social-vimeo:before, .ion-social-vimeo-outline:before, .ion-social-whatsapp:before, .ion-social-whatsapp-outline:before, .ion-social-windows:before, .ion-social-windows-outline:before, .ion-social-wordpress:before, .ion-social-wordpress-outline:before, .ion-social-yahoo:before, .ion-social-yahoo-outline:before, .ion-social-yen:before, .ion-social-yen-outline:before, .ion-social-youtube:before, .ion-social-youtube-outline:before, .ion-soup-can:before, .ion-soup-can-outline:before, .ion-speakerphone:before, .ion-speedometer:before, .ion-spoon:before, .ion-star:before, .ion-stats-bars:before, .ion-steam:before, .ion-stop:before, .ion-thermometer:before, .ion-thumbsdown:before, .ion-thumbsup:before, .ion-toggle:before, .ion-toggle-filled:before, .ion-transgender:before, .ion-trash-a:before, .ion-trash-b:before, .ion-trophy:before, .ion-tshirt:before, .ion-tshirt-outline:before, .ion-umbrella:before, .ion-university:before, .ion-unlocked:before, .ion-upload:before, .ion-usb:before, .ion-videocamera:before, .ion-volume-high:before, .ion-volume-low:before, .ion-volume-medium:before, .ion-volume-mute:before, .ion-wand:before, .ion-waterdrop:before, .ion-wifi:before, .ion-wineglass:before, .ion-woman:before, .ion-wrench:before, .ion-xbox:before { display: inline-block; font-family: "Ionicons"; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; text-rendering: auto; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .ion-alert:before { content: "\f101"; } .ion-alert-circled:before { content: "\f100"; } .ion-android-add:before { content: "\f2c7"; } .ion-android-add-circle:before { content: "\f359"; } .ion-android-alarm-clock:before { content: "\f35a"; } .ion-android-alert:before { content: "\f35b"; } .ion-android-apps:before { content: "\f35c"; } .ion-android-archive:before { content: "\f2c9"; } .ion-android-arrow-back:before { content: "\f2ca"; } .ion-android-arrow-down:before { content: "\f35d"; } .ion-android-arrow-dropdown:before { content: "\f35f"; } .ion-android-arrow-dropdown-circle:before { content: "\f35e"; } .ion-android-arrow-dropleft:before { content: "\f361"; } .ion-android-arrow-dropleft-circle:before { content: "\f360"; } .ion-android-arrow-dropright:before { content: "\f363"; } .ion-android-arrow-dropright-circle:before { content: "\f362"; } .ion-android-arrow-dropup:before { content: "\f365"; } .ion-android-arrow-dropup-circle:before { content: "\f364"; } .ion-android-arrow-forward:before { content: "\f30f"; } .ion-android-arrow-up:before { content: "\f366"; } .ion-android-attach:before { content: "\f367"; } .ion-android-bar:before { content: "\f368"; } .ion-android-bicycle:before { content: "\f369"; } .ion-android-boat:before { content: "\f36a"; } .ion-android-bookmark:before { content: "\f36b"; } .ion-android-bulb:before { content: "\f36c"; } .ion-android-bus:before { content: "\f36d"; } .ion-android-calendar:before { content: "\f2d1"; } .ion-android-call:before { content: "\f2d2"; } .ion-android-camera:before { content: "\f2d3"; } .ion-android-cancel:before { content: "\f36e"; } .ion-android-car:before { content: "\f36f"; } .ion-android-cart:before { content: "\f370"; } .ion-android-chat:before { content: "\f2d4"; } .ion-android-checkbox:before { content: "\f374"; } .ion-android-checkbox-blank:before { content: "\f371"; } .ion-android-checkbox-outline:before { content: "\f373"; } .ion-android-checkbox-outline-blank:before { content: "\f372"; } .ion-android-checkmark-circle:before { content: "\f375"; } .ion-android-clipboard:before { content: "\f376"; } .ion-android-close:before { content: "\f2d7"; } .ion-android-cloud:before { content: "\f37a"; } .ion-android-cloud-circle:before { content: "\f377"; } .ion-android-cloud-done:before { content: "\f378"; } .ion-android-cloud-outline:before { content: "\f379"; } .ion-android-color-palette:before { content: "\f37b"; } .ion-android-compass:before { content: "\f37c"; } .ion-android-contact:before { content: "\f2d8"; } .ion-android-contacts:before { content: "\f2d9"; } .ion-android-contract:before { content: "\f37d"; } .ion-android-create:before { content: "\f37e"; } .ion-android-delete:before { content: "\f37f"; } .ion-android-desktop:before { content: "\f380"; } .ion-android-document:before { content: "\f381"; } .ion-android-done:before { content: "\f383"; } .ion-android-done-all:before { content: "\f382"; } .ion-android-download:before { content: "\f2dd"; } .ion-android-drafts:before { content: "\f384"; } .ion-android-exit:before { content: "\f385"; } .ion-android-expand:before { content: "\f386"; } .ion-android-favorite:before { content: "\f388"; } .ion-android-favorite-outline:before { content: "\f387"; } .ion-android-film:before { content: "\f389"; } .ion-android-folder:before { content: "\f2e0"; } .ion-android-folder-open:before { content: "\f38a"; } .ion-android-funnel:before { content: "\f38b"; } .ion-android-globe:before { content: "\f38c"; } .ion-android-hand:before { content: "\f2e3"; } .ion-android-hangout:before { content: "\f38d"; } .ion-android-happy:before { content: "\f38e"; } .ion-android-home:before { content: "\f38f"; } .ion-android-image:before { content: "\f2e4"; } .ion-android-laptop:before { content: "\f390"; } .ion-android-list:before { content: "\f391"; } .ion-android-locate:before { content: "\f2e9"; } .ion-android-lock:before { content: "\f392"; } .ion-android-mail:before { content: "\f2eb"; } .ion-android-map:before { content: "\f393"; } .ion-android-menu:before { content: "\f394"; } .ion-android-microphone:before { content: "\f2ec"; } .ion-android-microphone-off:before { content: "\f395"; } .ion-android-more-horizontal:before { content: "\f396"; } .ion-android-more-vertical:before { content: "\f397"; } .ion-android-navigate:before { content: "\f398"; } .ion-android-notifications:before { content: "\f39b"; } .ion-android-notifications-none:before { content: "\f399"; } .ion-android-notifications-off:before { content: "\f39a"; } .ion-android-open:before { content: "\f39c"; } .ion-android-options:before { content: "\f39d"; } .ion-android-people:before { content: "\f39e"; } .ion-android-person:before { content: "\f3a0"; } .ion-android-person-add:before { content: "\f39f"; } .ion-android-phone-landscape:before { content: "\f3a1"; } .ion-android-phone-portrait:before { content: "\f3a2"; } .ion-android-pin:before { content: "\f3a3"; } .ion-android-plane:before { content: "\f3a4"; } .ion-android-playstore:before { content: "\f2f0"; } .ion-android-print:before { content: "\f3a5"; } .ion-android-radio-button-off:before { content: "\f3a6"; } .ion-android-radio-button-on:before { content: "\f3a7"; } .ion-android-refresh:before { content: "\f3a8"; } .ion-android-remove:before { content: "\f2f4"; } .ion-android-remove-circle:before { content: "\f3a9"; } .ion-android-restaurant:before { content: "\f3aa"; } .ion-android-sad:before { content: "\f3ab"; } .ion-android-search:before { content: "\f2f5"; } .ion-android-send:before { content: "\f2f6"; } .ion-android-settings:before { content: "\f2f7"; } .ion-android-share:before { content: "\f2f8"; } .ion-android-share-alt:before { content: "\f3ac"; } .ion-android-star:before { content: "\f2fc"; } .ion-android-star-half:before { content: "\f3ad"; } .ion-android-star-outline:before { content: "\f3ae"; } .ion-android-stopwatch:before { content: "\f2fd"; } .ion-android-subway:before { content: "\f3af"; } .ion-android-sunny:before { content: "\f3b0"; } .ion-android-sync:before { content: "\f3b1"; } .ion-android-textsms:before { content: "\f3b2"; } .ion-android-time:before { content: "\f3b3"; } .ion-android-train:before { content: "\f3b4"; } .ion-android-unlock:before { content: "\f3b5"; } .ion-android-upload:before { content: "\f3b6"; } .ion-android-volume-down:before { content: "\f3b7"; } .ion-android-volume-mute:before { content: "\f3b8"; } .ion-android-volume-off:before { content: "\f3b9"; } .ion-android-volume-up:before { content: "\f3ba"; } .ion-android-walk:before { content: "\f3bb"; } .ion-android-warning:before { content: "\f3bc"; } .ion-android-watch:before { content: "\f3bd"; } .ion-android-wifi:before { content: "\f305"; } .ion-aperture:before { content: "\f313"; } .ion-archive:before { content: "\f102"; } .ion-arrow-down-a:before { content: "\f103"; } .ion-arrow-down-b:before { content: "\f104"; } .ion-arrow-down-c:before { content: "\f105"; } .ion-arrow-expand:before { content: "\f25e"; } .ion-arrow-graph-down-left:before { content: "\f25f"; } .ion-arrow-graph-down-right:before { content: "\f260"; } .ion-arrow-graph-up-left:before { content: "\f261"; } .ion-arrow-graph-up-right:before { content: "\f262"; } .ion-arrow-left-a:before { content: "\f106"; } .ion-arrow-left-b:before { content: "\f107"; } .ion-arrow-left-c:before { content: "\f108"; } .ion-arrow-move:before { content: "\f263"; } .ion-arrow-resize:before { content: "\f264"; } .ion-arrow-return-left:before { content: "\f265"; } .ion-arrow-return-right:before { content: "\f266"; } .ion-arrow-right-a:before { content: "\f109"; } .ion-arrow-right-b:before { content: "\f10a"; } .ion-arrow-right-c:before { content: "\f10b"; } .ion-arrow-shrink:before { content: "\f267"; } .ion-arrow-swap:before { content: "\f268"; } .ion-arrow-up-a:before { content: "\f10c"; } .ion-arrow-up-b:before { content: "\f10d"; } .ion-arrow-up-c:before { content: "\f10e"; } .ion-asterisk:before { content: "\f314"; } .ion-at:before { content: "\f10f"; } .ion-backspace:before { content: "\f3bf"; } .ion-backspace-outline:before { content: "\f3be"; } .ion-bag:before { content: "\f110"; } .ion-battery-charging:before { content: "\f111"; } .ion-battery-empty:before { content: "\f112"; } .ion-battery-full:before { content: "\f113"; } .ion-battery-half:before { content: "\f114"; } .ion-battery-low:before { content: "\f115"; } .ion-beaker:before { content: "\f269"; } .ion-beer:before { content: "\f26a"; } .ion-bluetooth:before { content: "\f116"; } .ion-bonfire:before { content: "\f315"; } .ion-bookmark:before { content: "\f26b"; } .ion-bowtie:before { content: "\f3c0"; } .ion-briefcase:before { content: "\f26c"; } .ion-bug:before { content: "\f2be"; } .ion-calculator:before { content: "\f26d"; } .ion-calendar:before { content: "\f117"; } .ion-camera:before { content: "\f118"; } .ion-card:before { content: "\f119"; } .ion-cash:before { content: "\f316"; } .ion-chatbox:before { content: "\f11b"; } .ion-chatbox-working:before { content: "\f11a"; } .ion-chatboxes:before { content: "\f11c"; } .ion-chatbubble:before { content: "\f11e"; } .ion-chatbubble-working:before { content: "\f11d"; } .ion-chatbubbles:before { content: "\f11f"; } .ion-checkmark:before { content: "\f122"; } .ion-checkmark-circled:before { content: "\f120"; } .ion-checkmark-round:before { content: "\f121"; } .ion-chevron-down:before { content: "\f123"; } .ion-chevron-left:before { content: "\f124"; } .ion-chevron-right:before { content: "\f125"; } .ion-chevron-up:before { content: "\f126"; } .ion-clipboard:before { content: "\f127"; } .ion-clock:before { content: "\f26e"; } .ion-close:before { content: "\f12a"; } .ion-close-circled:before { content: "\f128"; } .ion-close-round:before { content: "\f129"; } .ion-closed-captioning:before { content: "\f317"; } .ion-cloud:before { content: "\f12b"; } .ion-code:before { content: "\f271"; } .ion-code-download:before { content: "\f26f"; } .ion-code-working:before { content: "\f270"; } .ion-coffee:before { content: "\f272"; } .ion-compass:before { content: "\f273"; } .ion-compose:before { content: "\f12c"; } .ion-connection-bars:before { content: "\f274"; } .ion-contrast:before { content: "\f275"; } .ion-crop:before { content: "\f3c1"; } .ion-cube:before { content: "\f318"; } .ion-disc:before { content: "\f12d"; } .ion-document:before { content: "\f12f"; } .ion-document-text:before { content: "\f12e"; } .ion-drag:before { content: "\f130"; } .ion-earth:before { content: "\f276"; } .ion-easel:before { content: "\f3c2"; } .ion-edit:before { content: "\f2bf"; } .ion-egg:before { content: "\f277"; } .ion-eject:before { content: "\f131"; } .ion-email:before { content: "\f132"; } .ion-email-unread:before { content: "\f3c3"; } .ion-erlenmeyer-flask:before { content: "\f3c5"; } .ion-erlenmeyer-flask-bubbles:before { content: "\f3c4"; } .ion-eye:before { content: "\f133"; } .ion-eye-disabled:before { content: "\f306"; } .ion-female:before { content: "\f278"; } .ion-filing:before { content: "\f134"; } .ion-film-marker:before { content: "\f135"; } .ion-fireball:before { content: "\f319"; } .ion-flag:before { content: "\f279"; } .ion-flame:before { content: "\f31a"; } .ion-flash:before { content: "\f137"; } .ion-flash-off:before { content: "\f136"; } .ion-folder:before { content: "\f139"; } .ion-fork:before { content: "\f27a"; } .ion-fork-repo:before { content: "\f2c0"; } .ion-forward:before { content: "\f13a"; } .ion-funnel:before { content: "\f31b"; } .ion-gear-a:before { content: "\f13d"; } .ion-gear-b:before { content: "\f13e"; } .ion-grid:before { content: "\f13f"; } .ion-hammer:before { content: "\f27b"; } .ion-happy:before { content: "\f31c"; } .ion-happy-outline:before { content: "\f3c6"; } .ion-headphone:before { content: "\f140"; } .ion-heart:before { content: "\f141"; } .ion-heart-broken:before { content: "\f31d"; } .ion-help:before { content: "\f143"; } .ion-help-buoy:before { content: "\f27c"; } .ion-help-circled:before { content: "\f142"; } .ion-home:before { content: "\f144"; } .ion-icecream:before { content: "\f27d"; } .ion-image:before { content: "\f147"; } .ion-images:before { content: "\f148"; } .ion-information:before { content: "\f14a"; } .ion-information-circled:before { content: "\f149"; } .ion-ionic:before { content: "\f14b"; } .ion-ios-alarm:before { content: "\f3c8"; } .ion-ios-alarm-outline:before { content: "\f3c7"; } .ion-ios-albums:before { content: "\f3ca"; } .ion-ios-albums-outline:before { content: "\f3c9"; } .ion-ios-americanfootball:before { content: "\f3cc"; } .ion-ios-americanfootball-outline:before { content: "\f3cb"; } .ion-ios-analytics:before { content: "\f3ce"; } .ion-ios-analytics-outline:before { content: "\f3cd"; } .ion-ios-arrow-back:before { content: "\f3cf"; } .ion-ios-arrow-down:before { content: "\f3d0"; } .ion-ios-arrow-forward:before { content: "\f3d1"; } .ion-ios-arrow-left:before { content: "\f3d2"; } .ion-ios-arrow-right:before { content: "\f3d3"; } .ion-ios-arrow-thin-down:before { content: "\f3d4"; } .ion-ios-arrow-thin-left:before { content: "\f3d5"; } .ion-ios-arrow-thin-right:before { content: "\f3d6"; } .ion-ios-arrow-thin-up:before { content: "\f3d7"; } .ion-ios-arrow-up:before { content: "\f3d8"; } .ion-ios-at:before { content: "\f3da"; } .ion-ios-at-outline:before { content: "\f3d9"; } .ion-ios-barcode:before { content: "\f3dc"; } .ion-ios-barcode-outline:before { content: "\f3db"; } .ion-ios-baseball:before { content: "\f3de"; } .ion-ios-baseball-outline:before { content: "\f3dd"; } .ion-ios-basketball:before { content: "\f3e0"; } .ion-ios-basketball-outline:before { content: "\f3df"; } .ion-ios-bell:before { content: "\f3e2"; } .ion-ios-bell-outline:before { content: "\f3e1"; } .ion-ios-body:before { content: "\f3e4"; } .ion-ios-body-outline:before { content: "\f3e3"; } .ion-ios-bolt:before { content: "\f3e6"; } .ion-ios-bolt-outline:before { content: "\f3e5"; } .ion-ios-book:before { content: "\f3e8"; } .ion-ios-book-outline:before { content: "\f3e7"; } .ion-ios-bookmarks:before { content: "\f3ea"; } .ion-ios-bookmarks-outline:before { content: "\f3e9"; } .ion-ios-box:before { content: "\f3ec"; } .ion-ios-box-outline:before { content: "\f3eb"; } .ion-ios-briefcase:before { content: "\f3ee"; } .ion-ios-briefcase-outline:before { content: "\f3ed"; } .ion-ios-browsers:before { content: "\f3f0"; } .ion-ios-browsers-outline:before { content: "\f3ef"; } .ion-ios-calculator:before { content: "\f3f2"; } .ion-ios-calculator-outline:before { content: "\f3f1"; } .ion-ios-calendar:before { content: "\f3f4"; } .ion-ios-calendar-outline:before { content: "\f3f3"; } .ion-ios-camera:before { content: "\f3f6"; } .ion-ios-camera-outline:before { content: "\f3f5"; } .ion-ios-cart:before { content: "\f3f8"; } .ion-ios-cart-outline:before { content: "\f3f7"; } .ion-ios-chatboxes:before { content: "\f3fa"; } .ion-ios-chatboxes-outline:before { content: "\f3f9"; } .ion-ios-chatbubble:before { content: "\f3fc"; } .ion-ios-chatbubble-outline:before { content: "\f3fb"; } .ion-ios-checkmark:before { content: "\f3ff"; } .ion-ios-checkmark-empty:before { content: "\f3fd"; } .ion-ios-checkmark-outline:before { content: "\f3fe"; } .ion-ios-circle-filled:before { content: "\f400"; } .ion-ios-circle-outline:before { content: "\f401"; } .ion-ios-clock:before { content: "\f403"; } .ion-ios-clock-outline:before { content: "\f402"; } .ion-ios-close:before { content: "\f406"; } .ion-ios-close-empty:before { content: "\f404"; } .ion-ios-close-outline:before { content: "\f405"; } .ion-ios-cloud:before { content: "\f40c"; } .ion-ios-cloud-download:before { content: "\f408"; } .ion-ios-cloud-download-outline:before { content: "\f407"; } .ion-ios-cloud-outline:before { content: "\f409"; } .ion-ios-cloud-upload:before { content: "\f40b"; } .ion-ios-cloud-upload-outline:before { content: "\f40a"; } .ion-ios-cloudy:before { content: "\f410"; } .ion-ios-cloudy-night:before { content: "\f40e"; } .ion-ios-cloudy-night-outline:before { content: "\f40d"; } .ion-ios-cloudy-outline:before { content: "\f40f"; } .ion-ios-cog:before { content: "\f412"; } .ion-ios-cog-outline:before { content: "\f411"; } .ion-ios-color-filter:before { content: "\f414"; } .ion-ios-color-filter-outline:before { content: "\f413"; } .ion-ios-color-wand:before { content: "\f416"; } .ion-ios-color-wand-outline:before { content: "\f415"; } .ion-ios-compose:before { content: "\f418"; } .ion-ios-compose-outline:before { content: "\f417"; } .ion-ios-contact:before { content: "\f41a"; } .ion-ios-contact-outline:before { content: "\f419"; } .ion-ios-copy:before { content: "\f41c"; } .ion-ios-copy-outline:before { content: "\f41b"; } .ion-ios-crop:before { content: "\f41e"; } .ion-ios-crop-strong:before { content: "\f41d"; } .ion-ios-download:before { content: "\f420"; } .ion-ios-download-outline:before { content: "\f41f"; } .ion-ios-drag:before { content: "\f421"; } .ion-ios-email:before { content: "\f423"; } .ion-ios-email-outline:before { content: "\f422"; } .ion-ios-eye:before { content: "\f425"; } .ion-ios-eye-outline:before { content: "\f424"; } .ion-ios-fastforward:before { content: "\f427"; } .ion-ios-fastforward-outline:before { content: "\f426"; } .ion-ios-filing:before { content: "\f429"; } .ion-ios-filing-outline:before { content: "\f428"; } .ion-ios-film:before { content: "\f42b"; } .ion-ios-film-outline:before { content: "\f42a"; } .ion-ios-flag:before { content: "\f42d"; } .ion-ios-flag-outline:before { content: "\f42c"; } .ion-ios-flame:before { content: "\f42f"; } .ion-ios-flame-outline:before { content: "\f42e"; } .ion-ios-flask:before { content: "\f431"; } .ion-ios-flask-outline:before { content: "\f430"; } .ion-ios-flower:before { content: "\f433"; } .ion-ios-flower-outline:before { content: "\f432"; } .ion-ios-folder:before { content: "\f435"; } .ion-ios-folder-outline:before { content: "\f434"; } .ion-ios-football:before { content: "\f437"; } .ion-ios-football-outline:before { content: "\f436"; } .ion-ios-game-controller-a:before { content: "\f439"; } .ion-ios-game-controller-a-outline:before { content: "\f438"; } .ion-ios-game-controller-b:before { content: "\f43b"; } .ion-ios-game-controller-b-outline:before { content: "\f43a"; } .ion-ios-gear:before { content: "\f43d"; } .ion-ios-gear-outline:before { content: "\f43c"; } .ion-ios-glasses:before { content: "\f43f"; } .ion-ios-glasses-outline:before { content: "\f43e"; } .ion-ios-grid-view:before { content: "\f441"; } .ion-ios-grid-view-outline:before { content: "\f440"; } .ion-ios-heart:before { content: "\f443"; } .ion-ios-heart-outline:before { content: "\f442"; } .ion-ios-help:before { content: "\f446"; } .ion-ios-help-empty:before { content: "\f444"; } .ion-ios-help-outline:before { content: "\f445"; } .ion-ios-home:before { content: "\f448"; } .ion-ios-home-outline:before { content: "\f447"; } .ion-ios-infinite:before { content: "\f44a"; } .ion-ios-infinite-outline:before { content: "\f449"; } .ion-ios-information:before { content: "\f44d"; } .ion-ios-information-empty:before { content: "\f44b"; } .ion-ios-information-outline:before { content: "\f44c"; } .ion-ios-ionic-outline:before { content: "\f44e"; } .ion-ios-keypad:before { content: "\f450"; } .ion-ios-keypad-outline:before { content: "\f44f"; } .ion-ios-lightbulb:before { content: "\f452"; } .ion-ios-lightbulb-outline:before { content: "\f451"; } .ion-ios-list:before { content: "\f454"; } .ion-ios-list-outline:before { content: "\f453"; } .ion-ios-location:before { content: "\f456"; } .ion-ios-location-outline:before { content: "\f455"; } .ion-ios-locked:before { content: "\f458"; } .ion-ios-locked-outline:before { content: "\f457"; } .ion-ios-loop:before { content: "\f45a"; } .ion-ios-loop-strong:before { content: "\f459"; } .ion-ios-medical:before { content: "\f45c"; } .ion-ios-medical-outline:before { content: "\f45b"; } .ion-ios-medkit:before { content: "\f45e"; } .ion-ios-medkit-outline:before { content: "\f45d"; } .ion-ios-mic:before { content: "\f461"; } .ion-ios-mic-off:before { content: "\f45f"; } .ion-ios-mic-outline:before { content: "\f460"; } .ion-ios-minus:before { content: "\f464"; } .ion-ios-minus-empty:before { content: "\f462"; } .ion-ios-minus-outline:before { content: "\f463"; } .ion-ios-monitor:before { content: "\f466"; } .ion-ios-monitor-outline:before { content: "\f465"; } .ion-ios-moon:before { content: "\f468"; } .ion-ios-moon-outline:before { content: "\f467"; } .ion-ios-more:before { content: "\f46a"; } .ion-ios-more-outline:before { content: "\f469"; } .ion-ios-musical-note:before { content: "\f46b"; } .ion-ios-musical-notes:before { content: "\f46c"; } .ion-ios-navigate:before { content: "\f46e"; } .ion-ios-navigate-outline:before { content: "\f46d"; } .ion-ios-nutrition:before { content: "\f470"; } .ion-ios-nutrition-outline:before { content: "\f46f"; } .ion-ios-paper:before { content: "\f472"; } .ion-ios-paper-outline:before { content: "\f471"; } .ion-ios-paperplane:before { content: "\f474"; } .ion-ios-paperplane-outline:before { content: "\f473"; } .ion-ios-partlysunny:before { content: "\f476"; } .ion-ios-partlysunny-outline:before { content: "\f475"; } .ion-ios-pause:before { content: "\f478"; } .ion-ios-pause-outline:before { content: "\f477"; } .ion-ios-paw:before { content: "\f47a"; } .ion-ios-paw-outline:before { content: "\f479"; } .ion-ios-people:before { content: "\f47c"; } .ion-ios-people-outline:before { content: "\f47b"; } .ion-ios-person:before { content: "\f47e"; } .ion-ios-person-outline:before { content: "\f47d"; } .ion-ios-personadd:before { content: "\f480"; } .ion-ios-personadd-outline:before { content: "\f47f"; } .ion-ios-photos:before { content: "\f482"; } .ion-ios-photos-outline:before { content: "\f481"; } .ion-ios-pie:before { content: "\f484"; } .ion-ios-pie-outline:before { content: "\f483"; } .ion-ios-pint:before { content: "\f486"; } .ion-ios-pint-outline:before { content: "\f485"; } .ion-ios-play:before { content: "\f488"; } .ion-ios-play-outline:before { content: "\f487"; } .ion-ios-plus:before { content: "\f48b"; } .ion-ios-plus-empty:before { content: "\f489"; } .ion-ios-plus-outline:before { content: "\f48a"; } .ion-ios-pricetag:before { content: "\f48d"; } .ion-ios-pricetag-outline:before { content: "\f48c"; } .ion-ios-pricetags:before { content: "\f48f"; } .ion-ios-pricetags-outline:before { content: "\f48e"; } .ion-ios-printer:before { content: "\f491"; } .ion-ios-printer-outline:before { content: "\f490"; } .ion-ios-pulse:before { content: "\f493"; } .ion-ios-pulse-strong:before { content: "\f492"; } .ion-ios-rainy:before { content: "\f495"; } .ion-ios-rainy-outline:before { content: "\f494"; } .ion-ios-recording:before { content: "\f497"; } .ion-ios-recording-outline:before { content: "\f496"; } .ion-ios-redo:before { content: "\f499"; } .ion-ios-redo-outline:before { content: "\f498"; } .ion-ios-refresh:before { content: "\f49c"; } .ion-ios-refresh-empty:before { content: "\f49a"; } .ion-ios-refresh-outline:before { content: "\f49b"; } .ion-ios-reload:before { content: "\f49d"; } .ion-ios-reverse-camera:before { content: "\f49f"; } .ion-ios-reverse-camera-outline:before { content: "\f49e"; } .ion-ios-rewind:before { content: "\f4a1"; } .ion-ios-rewind-outline:before { content: "\f4a0"; } .ion-ios-rose:before { content: "\f4a3"; } .ion-ios-rose-outline:before { content: "\f4a2"; } .ion-ios-search:before { content: "\f4a5"; } .ion-ios-search-strong:before { content: "\f4a4"; } .ion-ios-settings:before { content: "\f4a7"; } .ion-ios-settings-strong:before { content: "\f4a6"; } .ion-ios-shuffle:before { content: "\f4a9"; } .ion-ios-shuffle-strong:before { content: "\f4a8"; } .ion-ios-skipbackward:before { content: "\f4ab"; } .ion-ios-skipbackward-outline:before { content: "\f4aa"; } .ion-ios-skipforward:before { content: "\f4ad"; } .ion-ios-skipforward-outline:before { content: "\f4ac"; } .ion-ios-snowy:before { content: "\f4ae"; } .ion-ios-speedometer:before { content: "\f4b0"; } .ion-ios-speedometer-outline:before { content: "\f4af"; } .ion-ios-star:before { content: "\f4b3"; } .ion-ios-star-half:before { content: "\f4b1"; } .ion-ios-star-outline:before { content: "\f4b2"; } .ion-ios-stopwatch:before { content: "\f4b5"; } .ion-ios-stopwatch-outline:before { content: "\f4b4"; } .ion-ios-sunny:before { content: "\f4b7"; } .ion-ios-sunny-outline:before { content: "\f4b6"; } .ion-ios-telephone:before { content: "\f4b9"; } .ion-ios-telephone-outline:before { content: "\f4b8"; } .ion-ios-tennisball:before { content: "\f4bb"; } .ion-ios-tennisball-outline:before { content: "\f4ba"; } .ion-ios-thunderstorm:before { content: "\f4bd"; } .ion-ios-thunderstorm-outline:before { content: "\f4bc"; } .ion-ios-time:before { content: "\f4bf"; } .ion-ios-time-outline:before { content: "\f4be"; } .ion-ios-timer:before { content: "\f4c1"; } .ion-ios-timer-outline:before { content: "\f4c0"; } .ion-ios-toggle:before { content: "\f4c3"; } .ion-ios-toggle-outline:before { content: "\f4c2"; } .ion-ios-trash:before { content: "\f4c5"; } .ion-ios-trash-outline:before { content: "\f4c4"; } .ion-ios-undo:before { content: "\f4c7"; } .ion-ios-undo-outline:before { content: "\f4c6"; } .ion-ios-unlocked:before { content: "\f4c9"; } .ion-ios-unlocked-outline:before { content: "\f4c8"; } .ion-ios-upload:before { content: "\f4cb"; } .ion-ios-upload-outline:before { content: "\f4ca"; } .ion-ios-videocam:before { content: "\f4cd"; } .ion-ios-videocam-outline:before { content: "\f4cc"; } .ion-ios-volume-high:before { content: "\f4ce"; } .ion-ios-volume-low:before { content: "\f4cf"; } .ion-ios-wineglass:before { content: "\f4d1"; } .ion-ios-wineglass-outline:before { content: "\f4d0"; } .ion-ios-world:before { content: "\f4d3"; } .ion-ios-world-outline:before { content: "\f4d2"; } .ion-ipad:before { content: "\f1f9"; } .ion-iphone:before { content: "\f1fa"; } .ion-ipod:before { content: "\f1fb"; } .ion-jet:before { content: "\f295"; } .ion-key:before { content: "\f296"; } .ion-knife:before { content: "\f297"; } .ion-laptop:before { content: "\f1fc"; } .ion-leaf:before { content: "\f1fd"; } .ion-levels:before { content: "\f298"; } .ion-lightbulb:before { content: "\f299"; } .ion-link:before { content: "\f1fe"; } .ion-load-a:before { content: "\f29a"; } .ion-load-b:before { content: "\f29b"; } .ion-load-c:before { content: "\f29c"; } .ion-load-d:before { content: "\f29d"; } .ion-location:before { content: "\f1ff"; } .ion-lock-combination:before { content: "\f4d4"; } .ion-locked:before { content: "\f200"; } .ion-log-in:before { content: "\f29e"; } .ion-log-out:before { content: "\f29f"; } .ion-loop:before { content: "\f201"; } .ion-magnet:before { content: "\f2a0"; } .ion-male:before { content: "\f2a1"; } .ion-man:before { content: "\f202"; } .ion-map:before { content: "\f203"; } .ion-medkit:before { content: "\f2a2"; } .ion-merge:before { content: "\f33f"; } .ion-mic-a:before { content: "\f204"; } .ion-mic-b:before { content: "\f205"; } .ion-mic-c:before { content: "\f206"; } .ion-minus:before { content: "\f209"; } .ion-minus-circled:before { content: "\f207"; } .ion-minus-round:before { content: "\f208"; } .ion-model-s:before { content: "\f2c1"; } .ion-monitor:before { content: "\f20a"; } .ion-more:before { content: "\f20b"; } .ion-mouse:before { content: "\f340"; } .ion-music-note:before { content: "\f20c"; } .ion-navicon:before { content: "\f20e"; } .ion-navicon-round:before { content: "\f20d"; } .ion-navigate:before { content: "\f2a3"; } .ion-network:before { content: "\f341"; } .ion-no-smoking:before { content: "\f2c2"; } .ion-nuclear:before { content: "\f2a4"; } .ion-outlet:before { content: "\f342"; } .ion-paintbrush:before { content: "\f4d5"; } .ion-paintbucket:before { content: "\f4d6"; } .ion-paper-airplane:before { content: "\f2c3"; } .ion-paperclip:before { content: "\f20f"; } .ion-pause:before { content: "\f210"; } .ion-person:before { content: "\f213"; } .ion-person-add:before { content: "\f211"; } .ion-person-stalker:before { content: "\f212"; } .ion-pie-graph:before { content: "\f2a5"; } .ion-pin:before { content: "\f2a6"; } .ion-pinpoint:before { content: "\f2a7"; } .ion-pizza:before { content: "\f2a8"; } .ion-plane:before { content: "\f214"; } .ion-planet:before { content: "\f343"; } .ion-play:before { content: "\f215"; } .ion-playstation:before { content: "\f30a"; } .ion-plus:before { content: "\f218"; } .ion-plus-circled:before { content: "\f216"; } .ion-plus-round:before { content: "\f217"; } .ion-podium:before { content: "\f344"; } .ion-pound:before { content: "\f219"; } .ion-power:before { content: "\f2a9"; } .ion-pricetag:before { content: "\f2aa"; } .ion-pricetags:before { content: "\f2ab"; } .ion-printer:before { content: "\f21a"; } .ion-pull-request:before { content: "\f345"; } .ion-qr-scanner:before { content: "\f346"; } .ion-quote:before { content: "\f347"; } .ion-radio-waves:before { content: "\f2ac"; } .ion-record:before { content: "\f21b"; } .ion-refresh:before { content: "\f21c"; } .ion-reply:before { content: "\f21e"; } .ion-reply-all:before { content: "\f21d"; } .ion-ribbon-a:before { content: "\f348"; } .ion-ribbon-b:before { content: "\f349"; } .ion-sad:before { content: "\f34a"; } .ion-sad-outline:before { content: "\f4d7"; } .ion-scissors:before { content: "\f34b"; } .ion-search:before { content: "\f21f"; } .ion-settings:before { content: "\f2ad"; } .ion-share:before { content: "\f220"; } .ion-shuffle:before { content: "\f221"; } .ion-skip-backward:before { content: "\f222"; } .ion-skip-forward:before { content: "\f223"; } .ion-social-android:before { content: "\f225"; } .ion-social-android-outline:before { content: "\f224"; } .ion-social-angular:before { content: "\f4d9"; } .ion-social-angular-outline:before { content: "\f4d8"; } .ion-social-apple:before { content: "\f227"; } .ion-social-apple-outline:before { content: "\f226"; } .ion-social-bitcoin:before { content: "\f2af"; } .ion-social-bitcoin-outline:before { content: "\f2ae"; } .ion-social-buffer:before { content: "\f229"; } .ion-social-buffer-outline:before { content: "\f228"; } .ion-social-chrome:before { content: "\f4db"; } .ion-social-chrome-outline:before { content: "\f4da"; } .ion-social-codepen:before { content: "\f4dd"; } .ion-social-codepen-outline:before { content: "\f4dc"; } .ion-social-css3:before { content: "\f4df"; } .ion-social-css3-outline:before { content: "\f4de"; } .ion-social-designernews:before { content: "\f22b"; } .ion-social-designernews-outline:before { content: "\f22a"; } .ion-social-dribbble:before { content: "\f22d"; } .ion-social-dribbble-outline:before { content: "\f22c"; } .ion-social-dropbox:before { content: "\f22f"; } .ion-social-dropbox-outline:before { content: "\f22e"; } .ion-social-euro:before { content: "\f4e1"; } .ion-social-euro-outline:before { content: "\f4e0"; } .ion-social-facebook:before { content: "\f231"; } .ion-social-facebook-outline:before { content: "\f230"; } .ion-social-foursquare:before { content: "\f34d"; } .ion-social-foursquare-outline:before { content: "\f34c"; } .ion-social-freebsd-devil:before { content: "\f2c4"; } .ion-social-github:before { content: "\f233"; } .ion-social-github-outline:before { content: "\f232"; } .ion-social-google:before { content: "\f34f"; } .ion-social-google-outline:before { content: "\f34e"; } .ion-social-googleplus:before { content: "\f235"; } .ion-social-googleplus-outline:before { content: "\f234"; } .ion-social-hackernews:before { content: "\f237"; } .ion-social-hackernews-outline:before { content: "\f236"; } .ion-social-html5:before { content: "\f4e3"; } .ion-social-html5-outline:before { content: "\f4e2"; } .ion-social-instagram:before { content: "\f351"; } .ion-social-instagram-outline:before { content: "\f350"; } .ion-social-javascript:before { content: "\f4e5"; } .ion-social-javascript-outline:before { content: "\f4e4"; } .ion-social-linkedin:before { content: "\f239"; } .ion-social-linkedin-outline:before { content: "\f238"; } .ion-social-markdown:before { content: "\f4e6"; } .ion-social-nodejs:before { content: "\f4e7"; } .ion-social-octocat:before { content: "\f4e8"; } .ion-social-pinterest:before { content: "\f2b1"; } .ion-social-pinterest-outline:before { content: "\f2b0"; } .ion-social-python:before { content: "\f4e9"; } .ion-social-reddit:before { content: "\f23b"; } .ion-social-reddit-outline:before { content: "\f23a"; } .ion-social-rss:before { content: "\f23d"; } .ion-social-rss-outline:before { content: "\f23c"; } .ion-social-sass:before { content: "\f4ea"; } .ion-social-skype:before { content: "\f23f"; } .ion-social-skype-outline:before { content: "\f23e"; } .ion-social-snapchat:before { content: "\f4ec"; } .ion-social-snapchat-outline:before { content: "\f4eb"; } .ion-social-tumblr:before { content: "\f241"; } .ion-social-tumblr-outline:before { content: "\f240"; } .ion-social-tux:before { content: "\f2c5"; } .ion-social-twitch:before { content: "\f4ee"; } .ion-social-twitch-outline:before { content: "\f4ed"; } .ion-social-twitter:before { content: "\f243"; } .ion-social-twitter-outline:before { content: "\f242"; } .ion-social-usd:before { content: "\f353"; } .ion-social-usd-outline:before { content: "\f352"; } .ion-social-vimeo:before { content: "\f245"; } .ion-social-vimeo-outline:before { content: "\f244"; } .ion-social-whatsapp:before { content: "\f4f0"; } .ion-social-whatsapp-outline:before { content: "\f4ef"; } .ion-social-windows:before { content: "\f247"; } .ion-social-windows-outline:before { content: "\f246"; } .ion-social-wordpress:before { content: "\f249"; } .ion-social-wordpress-outline:before { content: "\f248"; } .ion-social-yahoo:before { content: "\f24b"; } .ion-social-yahoo-outline:before { content: "\f24a"; } .ion-social-yen:before { content: "\f4f2"; } .ion-social-yen-outline:before { content: "\f4f1"; } .ion-social-youtube:before { content: "\f24d"; } .ion-social-youtube-outline:before { content: "\f24c"; } .ion-soup-can:before { content: "\f4f4"; } .ion-soup-can-outline:before { content: "\f4f3"; } .ion-speakerphone:before { content: "\f2b2"; } .ion-speedometer:before { content: "\f2b3"; } .ion-spoon:before { content: "\f2b4"; } .ion-star:before { content: "\f24e"; } .ion-stats-bars:before { content: "\f2b5"; } .ion-steam:before { content: "\f30b"; } .ion-stop:before { content: "\f24f"; } .ion-thermometer:before { content: "\f2b6"; } .ion-thumbsdown:before { content: "\f250"; } .ion-thumbsup:before { content: "\f251"; } .ion-toggle:before { content: "\f355"; } .ion-toggle-filled:before { content: "\f354"; } .ion-transgender:before { content: "\f4f5"; } .ion-trash-a:before { content: "\f252"; } .ion-trash-b:before { content: "\f253"; } .ion-trophy:before { content: "\f356"; } .ion-tshirt:before { content: "\f4f7"; } .ion-tshirt-outline:before { content: "\f4f6"; } .ion-umbrella:before { content: "\f2b7"; } .ion-university:before { content: "\f357"; } .ion-unlocked:before { content: "\f254"; } .ion-upload:before { content: "\f255"; } .ion-usb:before { content: "\f2b8"; } .ion-videocamera:before { content: "\f256"; } .ion-volume-high:before { content: "\f257"; } .ion-volume-low:before { content: "\f258"; } .ion-volume-medium:before { content: "\f259"; } .ion-volume-mute:before { content: "\f25a"; } .ion-wand:before { content: "\f358"; } .ion-waterdrop:before { content: "\f25b"; } .ion-wifi:before { content: "\f25c"; } .ion-wineglass:before { content: "\f2b9"; } .ion-woman:before { content: "\f25d"; } .ion-wrench:before { content: "\f2ba"; } .ion-xbox:before { content: "\f30c"; } /*! Animate.css - http://daneden.me/animate Licensed under the MIT license - http://opensource.org/licenses/MIT Copyright (c) 2015 Daniel Eden */ .animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .animated-fast { -webkit-animation-duration: .5s; animation-duration: .5s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .animated.infinite { -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } .animated.hinge { -webkit-animation-duration: 2s; animation-duration: 2s; } .animated.bounceIn, .animated.bounceOut { -webkit-animation-duration: .75s; animation-duration: .75s; } .animated.flipOutX, .animated.flipOutY { -webkit-animation-duration: .75s; animation-duration: .75s; } @-webkit-keyframes bounce { from, 20%, 53%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); } 40%, 43% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); -webkit-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0); } 70% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); -webkit-transform: translate3d(0, -15px, 0); transform: translate3d(0, -15px, 0); } 90% { -webkit-transform: translate3d(0,-4px,0); transform: translate3d(0,-4px,0); } } @keyframes bounce { from, 20%, 53%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); } 40%, 43% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); -webkit-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0); } 70% { -webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); -webkit-transform: translate3d(0, -15px, 0); transform: translate3d(0, -15px, 0); } 90% { -webkit-transform: translate3d(0,-4px,0); transform: translate3d(0,-4px,0); } } .bounce { -webkit-animation-name: bounce; animation-name: bounce; -webkit-transform-origin: center bottom; transform-origin: center bottom; } @-webkit-keyframes flash { from, 50%, to { opacity: 1; } 25%, 75% { opacity: 0; } } @keyframes flash { from, 50%, to { opacity: 1; } 25%, 75% { opacity: 0; } } .flash { -webkit-animation-name: flash; animation-name: flash; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes pulse { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 50% { -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes pulse { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 50% { -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } .pulse { -webkit-animation-name: pulse; animation-name: pulse; } @-webkit-keyframes rubberBand { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 30% { -webkit-transform: scale3d(1.25, 0.75, 1); transform: scale3d(1.25, 0.75, 1); } 40% { -webkit-transform: scale3d(0.75, 1.25, 1); transform: scale3d(0.75, 1.25, 1); } 50% { -webkit-transform: scale3d(1.15, 0.85, 1); transform: scale3d(1.15, 0.85, 1); } 65% { -webkit-transform: scale3d(.95, 1.05, 1); transform: scale3d(.95, 1.05, 1); } 75% { -webkit-transform: scale3d(1.05, .95, 1); transform: scale3d(1.05, .95, 1); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes rubberBand { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 30% { -webkit-transform: scale3d(1.25, 0.75, 1); transform: scale3d(1.25, 0.75, 1); } 40% { -webkit-transform: scale3d(0.75, 1.25, 1); transform: scale3d(0.75, 1.25, 1); } 50% { -webkit-transform: scale3d(1.15, 0.85, 1); transform: scale3d(1.15, 0.85, 1); } 65% { -webkit-transform: scale3d(.95, 1.05, 1); transform: scale3d(.95, 1.05, 1); } 75% { -webkit-transform: scale3d(1.05, .95, 1); transform: scale3d(1.05, .95, 1); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } .rubberBand { -webkit-animation-name: rubberBand; animation-name: rubberBand; } @-webkit-keyframes shake { from, to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 20%, 40%, 60%, 80% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } } @keyframes shake { from, to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 20%, 40%, 60%, 80% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } } .shake { -webkit-animation-name: shake; animation-name: shake; } @-webkit-keyframes swing { 20% { -webkit-transform: rotate3d(0, 0, 1, 15deg); transform: rotate3d(0, 0, 1, 15deg); } 40% { -webkit-transform: rotate3d(0, 0, 1, -10deg); transform: rotate3d(0, 0, 1, -10deg); } 60% { -webkit-transform: rotate3d(0, 0, 1, 5deg); transform: rotate3d(0, 0, 1, 5deg); } 80% { -webkit-transform: rotate3d(0, 0, 1, -5deg); transform: rotate3d(0, 0, 1, -5deg); } to { -webkit-transform: rotate3d(0, 0, 1, 0deg); transform: rotate3d(0, 0, 1, 0deg); } } @keyframes swing { 20% { -webkit-transform: rotate3d(0, 0, 1, 15deg); transform: rotate3d(0, 0, 1, 15deg); } 40% { -webkit-transform: rotate3d(0, 0, 1, -10deg); transform: rotate3d(0, 0, 1, -10deg); } 60% { -webkit-transform: rotate3d(0, 0, 1, 5deg); transform: rotate3d(0, 0, 1, 5deg); } 80% { -webkit-transform: rotate3d(0, 0, 1, -5deg); transform: rotate3d(0, 0, 1, -5deg); } to { -webkit-transform: rotate3d(0, 0, 1, 0deg); transform: rotate3d(0, 0, 1, 0deg); } } .swing { -webkit-transform-origin: top center; transform-origin: top center; -webkit-animation-name: swing; animation-name: swing; } @-webkit-keyframes tada { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 10%, 20% { -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); } 40%, 60%, 80% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes tada { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 10%, 20% { -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); } 40%, 60%, 80% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } .tada { -webkit-animation-name: tada; animation-name: tada; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes wobble { from { -webkit-transform: none; transform: none; } 15% { -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); } 30% { -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); } 45% { -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); } 60% { -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); } 75% { -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); } to { -webkit-transform: none; transform: none; } } @keyframes wobble { from { -webkit-transform: none; transform: none; } 15% { -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); } 30% { -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); } 45% { -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); } 60% { -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); } 75% { -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); } to { -webkit-transform: none; transform: none; } } .wobble { -webkit-animation-name: wobble; animation-name: wobble; } @-webkit-keyframes jello { from, 11.1%, to { -webkit-transform: none; transform: none; } 22.2% { -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); transform: skewX(-12.5deg) skewY(-12.5deg); } 33.3% { -webkit-transform: skewX(6.25deg) skewY(6.25deg); transform: skewX(6.25deg) skewY(6.25deg); } 44.4% { -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); transform: skewX(-3.125deg) skewY(-3.125deg); } 55.5% { -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); transform: skewX(1.5625deg) skewY(1.5625deg); } 66.6% { -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg); transform: skewX(-0.78125deg) skewY(-0.78125deg); } 77.7% { -webkit-transform: skewX(0.390625deg) skewY(0.390625deg); transform: skewX(0.390625deg) skewY(0.390625deg); } 88.8% { -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg); transform: skewX(-0.1953125deg) skewY(-0.1953125deg); } } @keyframes jello { from, 11.1%, to { -webkit-transform: none; transform: none; } 22.2% { -webkit-transform: skewX(-12.5deg) skewY(-12.5deg); transform: skewX(-12.5deg) skewY(-12.5deg); } 33.3% { -webkit-transform: skewX(6.25deg) skewY(6.25deg); transform: skewX(6.25deg) skewY(6.25deg); } 44.4% { -webkit-transform: skewX(-3.125deg) skewY(-3.125deg); transform: skewX(-3.125deg) skewY(-3.125deg); } 55.5% { -webkit-transform: skewX(1.5625deg) skewY(1.5625deg); transform: skewX(1.5625deg) skewY(1.5625deg); } 66.6% { -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg); transform: skewX(-0.78125deg) skewY(-0.78125deg); } 77.7% { -webkit-transform: skewX(0.390625deg) skewY(0.390625deg); transform: skewX(0.390625deg) skewY(0.390625deg); } 88.8% { -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg); transform: skewX(-0.1953125deg) skewY(-0.1953125deg); } } .jello { -webkit-animation-name: jello; animation-name: jello; -webkit-transform-origin: center; transform-origin: center; } @-webkit-keyframes bounceIn { from, 20%, 40%, 60%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } 20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 40% { -webkit-transform: scale3d(.9, .9, .9); transform: scale3d(.9, .9, .9); } 60% { opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03); } 80% { -webkit-transform: scale3d(.97, .97, .97); transform: scale3d(.97, .97, .97); } to { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes bounceIn { from, 20%, 40%, 60%, 80%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } 20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 40% { -webkit-transform: scale3d(.9, .9, .9); transform: scale3d(.9, .9, .9); } 60% { opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03); } 80% { -webkit-transform: scale3d(.97, .97, .97); transform: scale3d(.97, .97, .97); } to { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } .bounceIn { -webkit-animation-name: bounceIn; animation-name: bounceIn; } @-webkit-keyframes bounceInDown { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(0, -3000px, 0); transform: translate3d(0, -3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, 25px, 0); transform: translate3d(0, 25px, 0); } 75% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 90% { -webkit-transform: translate3d(0, 5px, 0); transform: translate3d(0, 5px, 0); } to { -webkit-transform: none; transform: none; } } @keyframes bounceInDown { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(0, -3000px, 0); transform: translate3d(0, -3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, 25px, 0); transform: translate3d(0, 25px, 0); } 75% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 90% { -webkit-transform: translate3d(0, 5px, 0); transform: translate3d(0, 5px, 0); } to { -webkit-transform: none; transform: none; } } .bounceInDown { -webkit-animation-name: bounceInDown; animation-name: bounceInDown; } @-webkit-keyframes bounceInLeft { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(-3000px, 0, 0); transform: translate3d(-3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(25px, 0, 0); transform: translate3d(25px, 0, 0); } 75% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 90% { -webkit-transform: translate3d(5px, 0, 0); transform: translate3d(5px, 0, 0); } to { -webkit-transform: none; transform: none; } } @keyframes bounceInLeft { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(-3000px, 0, 0); transform: translate3d(-3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(25px, 0, 0); transform: translate3d(25px, 0, 0); } 75% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 90% { -webkit-transform: translate3d(5px, 0, 0); transform: translate3d(5px, 0, 0); } to { -webkit-transform: none; transform: none; } } .bounceInLeft { -webkit-animation-name: bounceInLeft; animation-name: bounceInLeft; } @-webkit-keyframes bounceInRight { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } from { opacity: 0; -webkit-transform: translate3d(3000px, 0, 0); transform: translate3d(3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(-25px, 0, 0); transform: translate3d(-25px, 0, 0); } 75% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } 90% { -webkit-transform: translate3d(-5px, 0, 0); transform: translate3d(-5px, 0, 0); } to { -webkit-transform: none; transform: none; } } @keyframes bounceInRight { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } from { opacity: 0; -webkit-transform: translate3d(3000px, 0, 0); transform: translate3d(3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(-25px, 0, 0); transform: translate3d(-25px, 0, 0); } 75% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } 90% { -webkit-transform: translate3d(-5px, 0, 0); transform: translate3d(-5px, 0, 0); } to { -webkit-transform: none; transform: none; } } .bounceInRight { -webkit-animation-name: bounceInRight; animation-name: bounceInRight; } @-webkit-keyframes bounceInUp { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } from { opacity: 0; -webkit-transform: translate3d(0, 3000px, 0); transform: translate3d(0, 3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } 75% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 90% { -webkit-transform: translate3d(0, -5px, 0); transform: translate3d(0, -5px, 0); } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes bounceInUp { from, 60%, 75%, 90%, to { -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } from { opacity: 0; -webkit-transform: translate3d(0, 3000px, 0); transform: translate3d(0, 3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } 75% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 90% { -webkit-transform: translate3d(0, -5px, 0); transform: translate3d(0, -5px, 0); } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .bounceInUp { -webkit-animation-name: bounceInUp; animation-name: bounceInUp; } @-webkit-keyframes bounceOut { 20% { -webkit-transform: scale3d(.9, .9, .9); transform: scale3d(.9, .9, .9); } 50%, 55% { opacity: 1; -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } to { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } } @keyframes bounceOut { 20% { -webkit-transform: scale3d(.9, .9, .9); transform: scale3d(.9, .9, .9); } 50%, 55% { opacity: 1; -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } to { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } } .bounceOut { -webkit-animation-name: bounceOut; animation-name: bounceOut; } @-webkit-keyframes bounceOutDown { 20% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } @keyframes bounceOutDown { 20% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } .bounceOutDown { -webkit-animation-name: bounceOutDown; animation-name: bounceOutDown; } @-webkit-keyframes bounceOutLeft { 20% { opacity: 1; -webkit-transform: translate3d(20px, 0, 0); transform: translate3d(20px, 0, 0); } to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } @keyframes bounceOutLeft { 20% { opacity: 1; -webkit-transform: translate3d(20px, 0, 0); transform: translate3d(20px, 0, 0); } to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } .bounceOutLeft { -webkit-animation-name: bounceOutLeft; animation-name: bounceOutLeft; } @-webkit-keyframes bounceOutRight { 20% { opacity: 1; -webkit-transform: translate3d(-20px, 0, 0); transform: translate3d(-20px, 0, 0); } to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } @keyframes bounceOutRight { 20% { opacity: 1; -webkit-transform: translate3d(-20px, 0, 0); transform: translate3d(-20px, 0, 0); } to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } .bounceOutRight { -webkit-animation-name: bounceOutRight; animation-name: bounceOutRight; } @-webkit-keyframes bounceOutUp { 20% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } @keyframes bounceOutUp { 20% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } .bounceOutUp { -webkit-animation-name: bounceOutUp; animation-name: bounceOutUp; } @-webkit-keyframes fadeIn { from { opacity: 0; -ms-transform: scale(0.95); -webkit-transform: scale(0.95); transform: scale(0.95); } to { opacity: 1; -ms-transform: scale(1.0); -webkit-transform: scale(1.0); transform: scale(1.0); } } @keyframes fadeIn { from { opacity: 0; -ms-transform: scale(0.95); -webkit-transform: scale(0.95); transform: scale(0.95); } to { opacity: 1; -ms-transform: scale(1.0); -webkit-transform: scale(1.0); transform: scale(1.0); } } .fadeIn { -webkit-animation-name: fadeIn; animation-name: fadeIn; } @-webkit-keyframes fadeInDown { from { opacity: 0; /*-webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0);*/ -webkit-transform: translate3d(0, -50px, 0); transform: translate3d(0, -50px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInDown { from { opacity: 0; /*-webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0);*/ -webkit-transform: translate3d(0, -50px, 0); transform: translate3d(0, -50px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInDown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown; } @-webkit-keyframes fadeInDownBig { from { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInDownBig { from { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInDownBig { -webkit-animation-name: fadeInDownBig; animation-name: fadeInDownBig; } @-webkit-keyframes fadeInLeft { from { opacity: 0; /*-webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0);*/ -webkit-transform: translate3d(-50px, 0, 0); transform: translate3d(-50px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInLeft { from { opacity: 0; /*-webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0);*/ -webkit-transform: translate3d(-50px, 0, 0); transform: translate3d(-50px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft; } @-webkit-keyframes fadeInLeftBig { from { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInLeftBig { from { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig; } @-webkit-keyframes fadeInRight { from { opacity: 0; /*-webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0);*/ -webkit-transform: translate3d(50px, 0, 0); transform: translate3d(50px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInRight { from { opacity: 0; /*-webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0);*/ -webkit-transform: translate3d(50px, 0, 0); transform: translate3d(50px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInRight { -webkit-animation-name: fadeInRight; animation-name: fadeInRight; } @-webkit-keyframes fadeInRightBig { from { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInRightBig { from { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInRightBig { -webkit-animation-name: fadeInRightBig; animation-name: fadeInRightBig; } @-webkit-keyframes fadeInUp { from { opacity: 0; visibility: hidden; /*-webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0);*/ -webkit-transform: translate3d(0, 40px, 0); transform: translate3d(0, 40px, 0); } to { opacity: 1; /*visibility: visible;*/ -webkit-transform: none; transform: none; } } @keyframes fadeInUp { from { opacity: 0; visibility: hidden; /*-webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0);*/ -webkit-transform: translate3d(0, 40px, 0); transform: translate3d(0, 40px, 0); } to { visibility: visible; opacity: 1; -webkit-transform: none; transform: none; } } .fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } @-webkit-keyframes fadeInUpMenu { from { opacity: 0; visibility: hidden; /*-webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0);*/ -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } to { opacity: 1; visibility: visible; -webkit-transform: none; transform: none; } } @keyframes fadeInUpMenu { from { opacity: 0; visibility: hidden; /*-webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0);*/ -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } to { visibility: visible; opacity: 1; -webkit-transform: none; transform: none; } } .fadeInUpMenu { -webkit-animation-name: fadeInUpMenu; animation-name: fadeInUpMenu; } @-webkit-keyframes fadeInUpBig { from { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInUpBig { from { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } to { opacity: 1; -webkit-transform: none; transform: none; } } .fadeInUpBig { -webkit-animation-name: fadeInUpBig; animation-name: fadeInUpBig; } @-webkit-keyframes fadeOut { from { opacity: 1; } to { opacity: 0; } } @keyframes fadeOut { from { opacity: 1; } to { opacity: 0; } } .fadeOut { -webkit-animation-name: fadeOut; animation-name: fadeOut; } @-webkit-keyframes fadeOutDown { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, 40px, 0); transform: translate3d(0, 40px, 0); } } @keyframes fadeOutDown { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, 40px, 0); transform: translate3d(0, 40px, 0); } } .fadeOutDown { -webkit-animation-name: fadeOutDown; animation-name: fadeOutDown; } @-webkit-keyframes fadeOutDownBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } @keyframes fadeOutDownBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } .fadeOutDownBig { -webkit-animation-name: fadeOutDownBig; animation-name: fadeOutDownBig; } @-webkit-keyframes fadeOutLeft { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } @keyframes fadeOutLeft { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } .fadeOutLeft { -webkit-animation-name: fadeOutLeft; animation-name: fadeOutLeft; } @-webkit-keyframes fadeOutLeftBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } @keyframes fadeOutLeftBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } .fadeOutLeftBig { -webkit-animation-name: fadeOutLeftBig; animation-name: fadeOutLeftBig; } @-webkit-keyframes fadeOutRight { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } @keyframes fadeOutRight { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } .fadeOutRight { -webkit-animation-name: fadeOutRight; animation-name: fadeOutRight; } @-webkit-keyframes fadeOutRightBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } @keyframes fadeOutRightBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } .fadeOutRightBig { -webkit-animation-name: fadeOutRightBig; animation-name: fadeOutRightBig; } @-webkit-keyframes fadeOutUp { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } } @keyframes fadeOutUp { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } } .fadeOutUp { -webkit-animation-name: fadeOutUp; animation-name: fadeOutUp; } @-webkit-keyframes fadeOutUpBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } @keyframes fadeOutUpBig { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } .fadeOutUpBig { -webkit-animation-name: fadeOutUpBig; animation-name: fadeOutUpBig; } @-webkit-keyframes flip { from { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg); transform: perspective(400px) rotate3d(0, 1, 0, -360deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) scale3d(.95, .95, .95); transform: perspective(400px) scale3d(.95, .95, .95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } to { -webkit-transform: perspective(400px); transform: perspective(400px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } @keyframes flip { from { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg); transform: perspective(400px) rotate3d(0, 1, 0, -360deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) scale3d(.95, .95, .95); transform: perspective(400px) scale3d(.95, .95, .95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } to { -webkit-transform: perspective(400px); transform: perspective(400px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } .animated.flip { -webkit-backface-visibility: visible; backface-visibility: visible; -webkit-animation-name: flip; animation-name: flip; } @-webkit-keyframes flipInX { from { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg); transform: perspective(400px) rotate3d(1, 0, 0, 10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg); transform: perspective(400px) rotate3d(1, 0, 0, -5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } } @keyframes flipInX { from { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg); transform: perspective(400px) rotate3d(1, 0, 0, 10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg); transform: perspective(400px) rotate3d(1, 0, 0, -5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } } .flipInX { -webkit-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInX; animation-name: flipInX; } @-webkit-keyframes flipInY { from { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg); transform: perspective(400px) rotate3d(0, 1, 0, -20deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg); transform: perspective(400px) rotate3d(0, 1, 0, 10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg); transform: perspective(400px) rotate3d(0, 1, 0, -5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } } @keyframes flipInY { from { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg); transform: perspective(400px) rotate3d(0, 1, 0, -20deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg); transform: perspective(400px) rotate3d(0, 1, 0, 10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg); transform: perspective(400px) rotate3d(0, 1, 0, -5deg); } to { -webkit-transform: perspective(400px); transform: perspective(400px); } } .flipInY { -webkit-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInY; animation-name: flipInY; } @-webkit-keyframes flipOutX { from { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); opacity: 0; } } @keyframes flipOutX { from { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); opacity: 0; } } .flipOutX { -webkit-animation-name: flipOutX; animation-name: flipOutX; -webkit-backface-visibility: visible !important; backface-visibility: visible !important; } @-webkit-keyframes flipOutY { from { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg); transform: perspective(400px) rotate3d(0, 1, 0, -15deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); opacity: 0; } } @keyframes flipOutY { from { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg); transform: perspective(400px) rotate3d(0, 1, 0, -15deg); opacity: 1; } to { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); opacity: 0; } } .flipOutY { -webkit-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipOutY; animation-name: flipOutY; } @-webkit-keyframes lightSpeedIn { from { -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg); transform: translate3d(100%, 0, 0) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: skewX(20deg); transform: skewX(20deg); opacity: 1; } 80% { -webkit-transform: skewX(-5deg); transform: skewX(-5deg); opacity: 1; } to { -webkit-transform: none; transform: none; opacity: 1; } } @keyframes lightSpeedIn { from { -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg); transform: translate3d(100%, 0, 0) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: skewX(20deg); transform: skewX(20deg); opacity: 1; } 80% { -webkit-transform: skewX(-5deg); transform: skewX(-5deg); opacity: 1; } to { -webkit-transform: none; transform: none; opacity: 1; } } .lightSpeedIn { -webkit-animation-name: lightSpeedIn; animation-name: lightSpeedIn; -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } @-webkit-keyframes lightSpeedOut { from { opacity: 1; } to { -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); transform: translate3d(100%, 0, 0) skewX(30deg); opacity: 0; } } @keyframes lightSpeedOut { from { opacity: 1; } to { -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); transform: translate3d(100%, 0, 0) skewX(30deg); opacity: 0; } } .lightSpeedOut { -webkit-animation-name: lightSpeedOut; animation-name: lightSpeedOut; -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } @-webkit-keyframes rotateIn { from { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, -200deg); transform: rotate3d(0, 0, 1, -200deg); opacity: 0; } to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateIn { from { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, -200deg); transform: rotate3d(0, 0, 1, -200deg); opacity: 0; } to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: none; transform: none; opacity: 1; } } .rotateIn { -webkit-animation-name: rotateIn; animation-name: rotateIn; } @-webkit-keyframes rotateInDownLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInDownLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInDownLeft { -webkit-animation-name: rotateInDownLeft; animation-name: rotateInDownLeft; } @-webkit-keyframes rotateInDownRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInDownRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInDownRight { -webkit-animation-name: rotateInDownRight; animation-name: rotateInDownRight; } @-webkit-keyframes rotateInUpLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInUpLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInUpLeft { -webkit-animation-name: rotateInUpLeft; animation-name: rotateInUpLeft; } @-webkit-keyframes rotateInUpRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -90deg); transform: rotate3d(0, 0, 1, -90deg); opacity: 0; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInUpRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -90deg); transform: rotate3d(0, 0, 1, -90deg); opacity: 0; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } .rotateInUpRight { -webkit-animation-name: rotateInUpRight; animation-name: rotateInUpRight; } @-webkit-keyframes rotateOut { from { -webkit-transform-origin: center; transform-origin: center; opacity: 1; } to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, 200deg); transform: rotate3d(0, 0, 1, 200deg); opacity: 0; } } @keyframes rotateOut { from { -webkit-transform-origin: center; transform-origin: center; opacity: 1; } to { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, 200deg); transform: rotate3d(0, 0, 1, 200deg); opacity: 0; } } .rotateOut { -webkit-animation-name: rotateOut; animation-name: rotateOut; } @-webkit-keyframes rotateOutDownLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } } @keyframes rotateOutDownLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } } .rotateOutDownLeft { -webkit-animation-name: rotateOutDownLeft; animation-name: rotateOutDownLeft; } @-webkit-keyframes rotateOutDownRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } } @keyframes rotateOutDownRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } } .rotateOutDownRight { -webkit-animation-name: rotateOutDownRight; animation-name: rotateOutDownRight; } @-webkit-keyframes rotateOutUpLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } } @keyframes rotateOutUpLeft { from { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } to { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } } .rotateOutUpLeft { -webkit-animation-name: rotateOutUpLeft; animation-name: rotateOutUpLeft; } @-webkit-keyframes rotateOutUpRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 90deg); transform: rotate3d(0, 0, 1, 90deg); opacity: 0; } } @keyframes rotateOutUpRight { from { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } to { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 90deg); transform: rotate3d(0, 0, 1, 90deg); opacity: 0; } } .rotateOutUpRight { -webkit-animation-name: rotateOutUpRight; animation-name: rotateOutUpRight; } @-webkit-keyframes hinge { 0% { -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate3d(0, 0, 1, 80deg); transform: rotate3d(0, 0, 1, 80deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40%, 80% { -webkit-transform: rotate3d(0, 0, 1, 60deg); transform: rotate3d(0, 0, 1, 60deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; opacity: 1; } to { -webkit-transform: translate3d(0, 700px, 0); transform: translate3d(0, 700px, 0); opacity: 0; } } @keyframes hinge { 0% { -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate3d(0, 0, 1, 80deg); transform: rotate3d(0, 0, 1, 80deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40%, 80% { -webkit-transform: rotate3d(0, 0, 1, 60deg); transform: rotate3d(0, 0, 1, 60deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; opacity: 1; } to { -webkit-transform: translate3d(0, 700px, 0); transform: translate3d(0, 700px, 0); opacity: 0; } } .hinge { -webkit-animation-name: hinge; animation-name: hinge; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollIn { from { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); } to { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes rollIn { from { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); } to { opacity: 1; -webkit-transform: none; transform: none; } } .rollIn { -webkit-animation-name: rollIn; animation-name: rollIn; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollOut { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); } } @keyframes rollOut { from { opacity: 1; } to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); } } .rollOut { -webkit-animation-name: rollOut; animation-name: rollOut; } @-webkit-keyframes zoomIn { from { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } 50% { opacity: 1; } } @keyframes zoomIn { from { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } 50% { opacity: 1; } } .zoomIn { -webkit-animation-name: zoomIn; animation-name: zoomIn; } @-webkit-keyframes zoomInDown { from { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomInDown { from { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomInDown { -webkit-animation-name: zoomInDown; animation-name: zoomInDown; } @-webkit-keyframes zoomInLeft { from { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomInLeft { from { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomInLeft { -webkit-animation-name: zoomInLeft; animation-name: zoomInLeft; } @-webkit-keyframes zoomInRight { from { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomInRight { from { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomInRight { -webkit-animation-name: zoomInRight; animation-name: zoomInRight; } @-webkit-keyframes zoomInUp { from { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomInUp { from { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomInUp { -webkit-animation-name: zoomInUp; animation-name: zoomInUp; } @-webkit-keyframes zoomOut { from { opacity: 1; } 50% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } to { opacity: 0; } } @keyframes zoomOut { from { opacity: 1; } 50% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } to { opacity: 0; } } .zoomOut { -webkit-animation-name: zoomOut; animation-name: zoomOut; } @-webkit-keyframes zoomOutDown { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } to { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomOutDown { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } to { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomOutDown { -webkit-animation-name: zoomOutDown; animation-name: zoomOutDown; } @-webkit-keyframes zoomOutLeft { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(.1) translate3d(-2000px, 0, 0); transform: scale(.1) translate3d(-2000px, 0, 0); -webkit-transform-origin: left center; transform-origin: left center; } } @keyframes zoomOutLeft { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(.1) translate3d(-2000px, 0, 0); transform: scale(.1) translate3d(-2000px, 0, 0); -webkit-transform-origin: left center; transform-origin: left center; } } .zoomOutLeft { -webkit-animation-name: zoomOutLeft; animation-name: zoomOutLeft; } @-webkit-keyframes zoomOutRight { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(.1) translate3d(2000px, 0, 0); transform: scale(.1) translate3d(2000px, 0, 0); -webkit-transform-origin: right center; transform-origin: right center; } } @keyframes zoomOutRight { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); } to { opacity: 0; -webkit-transform: scale(.1) translate3d(2000px, 0, 0); transform: scale(.1) translate3d(2000px, 0, 0); -webkit-transform-origin: right center; transform-origin: right center; } } .zoomOutRight { -webkit-animation-name: zoomOutRight; animation-name: zoomOutRight; } @-webkit-keyframes zoomOutUp { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } to { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomOutUp { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } to { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomOutUp { -webkit-animation-name: zoomOutUp; animation-name: zoomOutUp; } @-webkit-keyframes slideInDown { from { -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes slideInDown { from { -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .slideInDown { -webkit-animation-name: slideInDown; animation-name: slideInDown; } @-webkit-keyframes slideInLeft { from { -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes slideInLeft { from { -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .slideInLeft { -webkit-animation-name: slideInLeft; animation-name: slideInLeft; } @-webkit-keyframes slideInRight { from { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes slideInRight { from { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .slideInRight { -webkit-animation-name: slideInRight; animation-name: slideInRight; } @-webkit-keyframes slideInUp { from { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes slideInUp { from { -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .slideInUp { -webkit-animation-name: slideInUp; animation-name: slideInUp; } @-webkit-keyframes slideOutDown { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } } @keyframes slideOutDown { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } } .slideOutDown { -webkit-animation-name: slideOutDown; animation-name: slideOutDown; } @-webkit-keyframes slideOutLeft { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } @keyframes slideOutLeft { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } .slideOutLeft { -webkit-animation-name: slideOutLeft; animation-name: slideOutLeft; } @-webkit-keyframes slideOutRight { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } @keyframes slideOutRight { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } .slideOutRight { -webkit-animation-name: slideOutRight; animation-name: slideOutRight; } @-webkit-keyframes slideOutUp { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } } @keyframes slideOutUp { from { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } to { visibility: hidden; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } } .slideOutUp { -webkit-animation-name: slideOutUp; animation-name: slideOutUp; }@import url('https://fonts.googleapis.com/css?family=Montserrat:400,600,700'); @import url('https://fonts.googleapis.com/css?family=Catamaran:400,800'); .error-container { text-align: center; font-size: 180px; font-family: 'Catamaran', sans-serif; font-weight: 800; margin: 20px 15px; } .error-container > span { display: inline-block; line-height: 0.7; position: relative; color: #FFB485; } .error-container > span { display: inline-block; position: relative; vertical-align: middle; } .error-container > span:nth-of-type(1) { color: #D1F2A5; animation: colordancing 4s infinite; } .error-container > span:nth-of-type(3) { color: #F56991; animation: colordancing2 4s infinite; } .error-container > span:nth-of-type(2) { width: 120px; height: 120px; border-radius: 999px; } .error-container > span:nth-of-type(2):before, .error-container > span:nth-of-type(2):after { border-radius: 0%; content:""; position: absolute; top: 0; left: 0; width: inherit; height: inherit; border-radius: 999px; box-shadow: inset 30px 0 0 rgba(209, 242, 165, 0.4), inset 0 30px 0 rgba(239, 250, 180, 0.4), inset -30px 0 0 rgba(255, 196, 140, 0.4),	 inset 0 -30px 0 rgba(245, 105, 145, 0.4); animation: shadowsdancing 4s infinite; } .error-container > span:nth-of-type(2):before { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg); } .screen-reader-text { position: absolute; top: -9999em; left: -9999em; } @keyframes shadowsdancing { 0% { box-shadow: inset 30px 0 0 rgba(209, 242, 165, 0.4), inset 0 30px 0 rgba(239, 250, 180, 0.4), inset -30px 0 0 rgba(255, 196, 140, 0.4),	 inset 0 -30px 0 rgba(245, 105, 145, 0.4); } 25% { box-shadow: inset 30px 0 0 rgba(245, 105, 145, 0.4), inset 0 30px 0 rgba(209, 242, 165, 0.4), inset -30px 0 0 rgba(239, 250, 180, 0.4),	 inset 0 -30px 0 rgba(255, 196, 140, 0.4); } 50% { box-shadow: inset 30px 0 0 rgba(255, 196, 140, 0.4), inset 0 30px 0 rgba(245, 105, 145, 0.4), inset -30px 0 0 rgba(209, 242, 165, 0.4),	 inset 0 -30px 0 rgba(239, 250, 180, 0.4); } 75% { box-shadow: inset 30px 0 0 rgba(239, 250, 180, 0.4), inset 0 30px 0 rgba(255, 196, 140, 0.4), inset -30px 0 0 rgba(245, 105, 145, 0.4),	 inset 0 -30px 0 rgba(209, 242, 165, 0.4); } 100% { box-shadow: inset 30px 0 0 rgba(209, 242, 165, 0.4), inset 0 30px 0 rgba(239, 250, 180, 0.4), inset -30px 0 0 rgba(255, 196, 140, 0.4),	 inset 0 -30px 0 rgba(245, 105, 145, 0.4); } } @keyframes colordancing { 0% { color: #D1F2A5; } 25% { color: #F56991; } 50% { color: #FFC48C; } 75% { color: #EFFAB4; } 100% { color: #D1F2A5; } } @keyframes colordancing2 { 0% { color: #FFC48C; } 25% { color: #EFFAB4; } 50% { color: #D1F2A5; } 75% { color: #F56991; } 100% { color: #FFC48C; } } .bg404{ background: url(images/meal-pattern.png) repeat 0 0; } .page-404{text-align: center; padding: 100px 0;} .page-404 h1{ color: #fff;font-family: 'trend_hm_sansone';} #facebox { position: absolute; top: 0; left: 0; z-index: 100; text-align: left; } /*animation by pawan*/ @-webkit-keyframes hvr-pop { 50% { -webkit-transform: scale(1.2); transform: scale(1.2); } } @keyframes hvr-pop { 50% { -webkit-transform: scale(1.2); transform: scale(1.2); } } #facebox { -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); box-shadow: 0 0 1px transparent; } #facebox { -webkit-animation-name: hvr-pop; animation-name: hvr-pop; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: 1; animation-iteration-count: 1; } #facebox .popup { position: relative;/*  border:3px solid rgba(0,0,0,0); -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; -webkit-box-shadow:0 0 18px rgba(0,0,0,0.4); -moz-box-shadow:0 0 18px rgba(0,0,0,0.4); box-shadow:0 0 18px rgba(0,0,0,0.4);*/ } #facebox .content { display: table; width: 100%; padding: 15px; padding-top:40px; background: #fff; } #facebox .content.faceboxWidth { width: 850px;min-width: 350px;min-height: 150px; } #facebox .content.fbminwidth { min-width: 350px; min-height: 150px; } #facebox .content.loginpopup { padding: 0; } #facebox .content > p:first-child { margin-top: 0; } #facebox .content > p:last-child { margin-bottom: 0; } #facebox .close { position: absolute; top: 5px; right: 5px; padding: 0px; width: 30px; height: 30px; } #facebox .close:before { width: 1px; height: 30px; left: 50%; margin: 0 0 0 -1px; position: absolute; top: 0; content: ""; background: #000; } #facebox .close:after { width: 30px; height: 1px; left: 0px; top: 50%; margin: -0px 0 0 0; position: absolute; content: ""; background: #000; }/* #facebox .close:hover{animation: spin180 0.4s;-webkit-animation: spin180 0.4s;} @keyframes spin180 { from {transform: rotate(0deg);} to {transform: rotate(360deg);} } @-moz-keyframes spin180 { from {-moz-transform: rotate(0deg);} to {-moz-transform: rotate(360deg);} } @-webkit-keyframes spin180 { from {-webkit-transform: rotate(0deg);} to {-webkit-transform: rotate(360deg);} } @-o-keyframes spin180 { from {-o-transform: rotate(0deg);} to {-o-transform: rotate(360deg);} } @-ms-keyframes spin180 { from {-ms-transform: rotate(0deg);} to {-ms-transform: rotate(360deg);} }*/ #facebox .close img { opacity: 0.3; } #facebox .close:hover img { opacity: 1.0; } #facebox .loading { text-align: center; } #facebox .image { text-align: center; } #facebox img { border: 0; margin: 0; } #facebox_overlay { position: fixed; top: 0px; left: 0px; height: 100%; width: 100%; } .facebox_hide { z-index: -100; } .facebox_overlayBG { opacity: 0.7; background-color: #000; z-index: 99; } @media only screen and (max-width: 1025px) { #facebox { left: 0 !important; right: 0 !important; } #facebox .content { display: block; padding: 10px; } #facebox .content.faceboxWidth { width: auto;  }       } @media only screen and (max-width: 767px) { #facebox .content{ padding-top: 30px;} #facebox .content.fbminwidth{min-width: inherit;}} /** * Featherlight – ultra slim jQuery lightbox * Version 1.7.1 - http://noelboss.github.io/featherlight/ * * Copyright 2017, Noël Raoul Bossart (http://www.noelboss.com) * MIT Licensed. **/ @media all { .featherlight { display: none; /* dimensions: spanning the background from edge to edge */ position:fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 2147483647; /* z-index needs to be >= elements on the site. */ /* position: centering content */ text-align: center; /* insures that the ::before pseudo element doesn't force wrap with fixed width content; */ white-space: nowrap; /* styling */ cursor: pointer; background: #333; /* IE8 "hack" for nested featherlights */ background: rgba(0, 0, 0, 0); } /* support for nested featherlights. Does not work in IE8 (use JS to fix) */ .featherlight:last-of-type { background: rgba(0, 0, 0, 0.8); } .featherlight:before { /* position: trick to center content vertically */ content: ''; display: inline-block; height: 100%; vertical-align: middle; } .featherlight .featherlight-content { /* make content container for positioned elements (close button) */ position: relative; /* position: centering vertical and horizontal */ text-align: left; vertical-align: middle; display: inline-block; /* dimensions: cut off images */ overflow: auto; padding: 25px 25px 0; border-bottom: 25px solid transparent; /* dimensions: handling large content */ margin-left: 5%; margin-right: 5%; max-height: 95%; /* styling */ background: #fff; cursor: auto; /* reset white-space wrapping */ white-space: normal; } /* contains the content */ .featherlight .featherlight-inner { /* make sure its visible */ display: block; } .featherlight .featherlight-close-icon { /* position: centering vertical and horizontal */ position: absolute; z-index: 9999; top: 0; right: 0; /* dimensions: 25px x 25px */ line-height: 25px; width: 25px; /* styling */ cursor: pointer; text-align: center; font-family: Arial, sans-serif; background: #fff; /* Set the background in case it overlaps the content */ background: rgba(255, 255, 255, 0.3); color: #000; border: none; padding: 0; } /* See http://stackoverflow.com/questions/16077341/how-to-reset-all-default-styles-of-the-html5-button-element */ .featherlight .featherlight-close-icon::-moz-focus-inner { border: 0; padding: 0; } .featherlight .featherlight-image { /* styling */ width: 100%; } .featherlight-iframe .featherlight-content { /* removed the border for image croping since iframe is edge to edge */ border-bottom: 0; padding: 0; -webkit-overflow-scrolling: touch; overflow-y: scroll; } .featherlight iframe { /* styling */ border: none; } .featherlight * { /* See https://github.com/noelboss/featherlight/issues/42 */ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } } /* handling phones and small screens */ @media only screen and (max-width: 1024px) { .featherlight .featherlight-content { /* dimensions: maximize lightbox with for small screens */ margin-left: 0; margin-right: 0; max-height: 98%; padding: 10px 10px 0; border-bottom: 10px solid transparent; } } /*.container { width: 800px; margin: 0 auto; }*/ .autocomplete-suggestions { border: 1px solid #999; background: #FFF; cursor: default; overflow: auto;  -webkit-box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64); -moz-box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64); box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64); } .autocomplete-suggestion { padding: 2px 5px; white-space: nowrap; overflow: hidden;background:#fff; } .autocomplete-no-suggestion { padding: 2px 5px; } .autocomplete-selected { background: #F0F0F0; } .autocomplete-suggestions strong { font-weight: bold; color: #000; } .autocomplete-group { padding: 2px 5px; } .autocomplete-group strong { font-weight: bold; font-size: 16px; color: #000; display: block; border-bottom: 1px solid #000; } .ui-timepicker-div .ui-widget-header { margin-bottom: 8px; } .ui-timepicker-div dl { text-align: left; } .ui-timepicker-div dl dt { float: left; clear:left; padding: 0 0 0 5px; } .ui-timepicker-div dl dd { margin: 0 10px 10px 40%; } .ui-timepicker-div td { font-size: 90%; } .ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; } .ui-timepicker-div .ui_tpicker_unit_hide{ display: none; } .ui-timepicker-div .ui_tpicker_time .ui_tpicker_time_input { background: none; color: inherit; border: none; outline: none; border-bottom: solid 1px #555; width: 95%; } .ui-timepicker-div .ui_tpicker_time .ui_tpicker_time_input:focus { border-bottom-color: #aaa; } .ui-timepicker-rtl{ direction: rtl; } .ui-timepicker-rtl dl { text-align: right; padding: 0 5px 0 0; } .ui-timepicker-rtl dl dt{ float: right; clear: right; } .ui-timepicker-rtl dl dd { margin: 0 40% 10px 10px; } /* Shortened version style */ .ui-timepicker-div.ui-timepicker-oneLine { padding-right: 2px; } .ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_time,  .ui-timepicker-div.ui-timepicker-oneLine dt { display: none; } .ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_time_label { display: block; padding-top: 2px; } .ui-timepicker-div.ui-timepicker-oneLine dl { text-align: right; } .ui-timepicker-div.ui-timepicker-oneLine dl dd,  .ui-timepicker-div.ui-timepicker-oneLine dl dd > div { display:inline-block; margin:0; } .ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_minute:before, .ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_second:before { content:':'; display:inline-block; } .ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_millisec:before, .ui-timepicker-div.ui-timepicker-oneLine dl dd.ui_tpicker_microsec:before { content:'.'; display:inline-block; } .ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_unit_hide, .ui-timepicker-div.ui-timepicker-oneLine .ui_tpicker_unit_hide:before{ display: none; } /*! jQuery UI - v1.12.0 - 2016-07-08 * http://jqueryui.com * Includes: core.css, accordion.css, autocomplete.css, menu.css, button.css, controlgroup.css, checkboxradio.css, datepicker.css, dialog.css, draggable.css, resizable.css, progressbar.css, selectable.css, selectmenu.css, slider.css, sortable.css, spinner.css, tabs.css, tooltip.css, theme.css * To view and modify this theme, visit http://jqueryui.com/themeroller/?ffDefault=Arial%2CHelvetica%2Csans-serif&fsDefault=1em&fwDefault=normal&cornerRadius=3px&bgColorHeader=e9e9e9&bgTextureHeader=flat&borderColorHeader=dddddd&fcHeader=333333&iconColorHeader=444444&bgColorContent=ffffff&bgTextureContent=flat&borderColorContent=dddddd&fcContent=333333&iconColorContent=444444&bgColorDefault=f6f6f6&bgTextureDefault=flat&borderColorDefault=c5c5c5&fcDefault=454545&iconColorDefault=777777&bgColorHover=ededed&bgTextureHover=flat&borderColorHover=cccccc&fcHover=2b2b2b&iconColorHover=555555&bgColorActive=007fff&bgTextureActive=flat&borderColorActive=003eff&fcActive=ffffff&iconColorActive=ffffff&bgColorHighlight=fffa90&bgTextureHighlight=flat&borderColorHighlight=dad55e&fcHighlight=777620&iconColorHighlight=777620&bgColorError=fddfdf&bgTextureError=flat&borderColorError=f1a899&fcError=5f3f3f&iconColorError=cc0000&bgColorOverlay=aaaaaa&bgTextureOverlay=flat&bgImgOpacityOverlay=0&opacityOverlay=30&bgColorShadow=666666&bgTextureShadow=flat&bgImgOpacityShadow=0&opacityShadow=30&thicknessShadow=5px&offsetTopShadow=0px&offsetLeftShadow=0px&cornerRadiusShadow=8px * Copyright jQuery Foundation and other contributors; Licensed MIT */ /* Layout helpers ----------------------------------*/ .ui-helper-hidden { display: none; } .ui-helper-hidden-accessible { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; } .ui-helper-clearfix:before, .ui-helper-clearfix:after { content: ""; display: table; border-collapse: collapse; } .ui-helper-clearfix:after { clear: both; } .ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter:Alpha(Opacity=0); /* support: IE8 */ } .ui-front { z-index: 100; } /* Interaction Cues ----------------------------------*/ .ui-state-disabled { cursor: default !important; pointer-events: none; } /* Icons ----------------------------------*/ .ui-icon { display: inline-block; vertical-align: middle; margin-top: -.25em; position: relative; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; } .ui-widget-icon-block { left: 50%; margin-left: -8px; display: block; } /* Misc visuals ----------------------------------*/ /* Overlays */ .ui-widget-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; } .ui-accordion .ui-accordion-header { display: block; cursor: pointer; position: relative; margin: 2px 0 0 0; padding: .5em .5em .5em .7em; font-size: 100%; } .ui-accordion .ui-accordion-content { padding: 1em 2.2em; border-top: 0; overflow: auto; } .ui-autocomplete { position: absolute; top: 0; left: 0; cursor: default; } .ui-menu { list-style: none; padding: 0; margin: 0; display: block; outline: 0; } .ui-menu .ui-menu { position: absolute; } .ui-menu .ui-menu-item { margin: 0; cursor: pointer; /* support: IE10, see #8844 */ list-style-image: url("data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7"); } .ui-menu .ui-menu-item-wrapper { position: relative; padding: 3px 1em 3px .4em; } .ui-menu .ui-menu-divider { margin: 5px 0; height: 0; font-size: 0; line-height: 0; border-width: 1px 0 0 0; } .ui-menu .ui-state-focus, .ui-menu .ui-state-active { margin: -1px; } /* icon support */ .ui-menu-icons { position: relative; } .ui-menu-icons .ui-menu-item-wrapper { padding-left: 2em; } /* left-aligned */ .ui-menu .ui-icon { position: absolute; top: 0; bottom: 0; left: .2em; margin: auto 0; } /* right-aligned */ .ui-menu .ui-menu-icon { left: auto; right: 0; } .ui-button { padding: .4em 1em; display: inline-block; position: relative; line-height: normal; margin-right: .1em; cursor: pointer; vertical-align: middle; text-align: center; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; /* Support: IE <= 11 */ overflow: visible; } .ui-button, .ui-button:link, .ui-button:visited, .ui-button:hover, .ui-button:active { text-decoration: none; } /* to make room for the icon, a width needs to be set here */ .ui-button-icon-only { width: 2em; box-sizing: border-box; text-indent: -9999px; white-space: nowrap; } /* no icon support for input elements */ input.ui-button.ui-button-icon-only { text-indent: 0; } /* button icon element(s) */ .ui-button-icon-only .ui-icon { position: absolute; top: 50%; left: 50%; margin-top: -8px; margin-left: -8px; } .ui-button.ui-icon-notext .ui-icon { padding: 0; width: 2.1em; height: 2.1em; text-indent: -9999px; white-space: nowrap; } input.ui-button.ui-icon-notext .ui-icon { width: auto; height: auto; text-indent: 0; white-space: normal; padding: .4em 1em; } /* workarounds */ /* Support: Firefox 5 - 40 */ input.ui-button::-moz-focus-inner, button.ui-button::-moz-focus-inner { border: 0; padding: 0; } .ui-controlgroup { vertical-align: middle; display: inline-block; } .ui-controlgroup > .ui-controlgroup-item { float: left; margin-left: 0; margin-right: 0; } .ui-controlgroup > .ui-controlgroup-item:focus, .ui-controlgroup > .ui-controlgroup-item.ui-visual-focus { z-index: 9999; } .ui-controlgroup-vertical > .ui-controlgroup-item { display: block; float: none; width: 100%; margin-top: 0; margin-bottom: 0; text-align: left; } .ui-controlgroup-vertical .ui-controlgroup-item { box-sizing: border-box; } .ui-controlgroup .ui-controlgroup-label { padding: .4em 1em; } .ui-controlgroup .ui-controlgroup-label span { font-size: 80%; } .ui-controlgroup-horizontal .ui-controlgroup-label + .ui-controlgroup-item { border-left: none; } .ui-controlgroup-vertical .ui-controlgroup-label + .ui-controlgroup-item { border-top: none; } .ui-controlgroup-horizontal .ui-controlgroup-label.ui-widget-content { border-right: none; } .ui-controlgroup-vertical .ui-controlgroup-label.ui-widget-content { border-bottom: none; } /* Spinner specific style fixes */ .ui-controlgroup-vertical .ui-spinner-input { /* Support: IE8 only, Android < 4.4 only */ width: 75%; width: calc( 100% - 2.4em ); } .ui-controlgroup-vertical .ui-spinner .ui-spinner-up { border-top-style: solid; } .ui-checkboxradio-label .ui-icon-background { box-shadow: inset 1px 1px 1px #ccc; border-radius: .12em; border: none; } .ui-checkboxradio-radio-label .ui-icon-background { width: 16px; height: 16px; border-radius: 1em; overflow: visible; border: none; } .ui-checkboxradio-radio-label.ui-checkboxradio-checked .ui-icon, .ui-checkboxradio-radio-label.ui-checkboxradio-checked:hover .ui-icon { background-image: none; width: 8px; height: 8px; border-width: 4px; border-style: solid; } .ui-checkboxradio-disabled { pointer-events: none; } .ui-datepicker { width: 17em; padding: .2em .2em 0; display: none; } .ui-datepicker .ui-datepicker-header { position: relative; padding: .2em 0; } .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position: absolute; top:6px; width: 1.8em; height: 1.8em; } /*.ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover { top: 1px; }*/ .ui-datepicker .ui-datepicker-prev { left: 2px; } .ui-datepicker .ui-datepicker-next { right: 2px; } .ui-datepicker .ui-datepicker-prev-hover { left: 1px; } .ui-datepicker .ui-datepicker-next-hover { right: 1px; } .ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span { display: block; position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -8px; } .ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 1.8em; text-align: center; } .ui-datepicker .ui-datepicker-title select { font-size: 1em; margin: 1px 0; } .ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year { width: 48%;height: 30px; padding-left: 5px; } .ui-datepicker table { width: 100%; font-size: .9em; border-collapse: collapse; margin: 0 0 .4em; } .ui-datepicker th { padding: .7em .3em; text-align: center; font-weight: bold; border: 0; } .ui-datepicker td { border: 0; padding: 1px; } .ui-datepicker td span, .ui-datepicker td a { display: block; padding: .2em; text-align: right; text-decoration: none; } .ui-datepicker .ui-datepicker-buttonpane { background-image: none; margin: .7em 0 0 0; padding: 0 .2em; border-left: 0; border-right: 0; border-bottom: 0; } .ui-datepicker .ui-datepicker-buttonpane button { float: right; margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width: auto; overflow: visible; } .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float: left; } /* with multiple calendars */ .ui-datepicker.ui-datepicker-multi { width: auto; } .ui-datepicker-multi .ui-datepicker-group { float: left; } .ui-datepicker-multi .ui-datepicker-group table { width: 95%; margin: 0 auto .4em; } .ui-datepicker-multi-2 .ui-datepicker-group { width: 50%; } .ui-datepicker-multi-3 .ui-datepicker-group { width: 33.3%; } .ui-datepicker-multi-4 .ui-datepicker-group { width: 25%; } .ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header, .ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header { border-left-width: 0; } .ui-datepicker-multi .ui-datepicker-buttonpane { clear: left; } .ui-datepicker-row-break { clear: both; width: 100%; font-size: 0; } /* RTL support */ .ui-datepicker-rtl { direction: rtl; } .ui-datepicker-rtl .ui-datepicker-prev { right: 2px; left: auto; } .ui-datepicker-rtl .ui-datepicker-next { left: 2px; right: auto; } .ui-datepicker-rtl .ui-datepicker-prev:hover { right: 1px; left: auto; } .ui-datepicker-rtl .ui-datepicker-next:hover { left: 1px; right: auto; } .ui-datepicker-rtl .ui-datepicker-buttonpane { clear: right; } .ui-datepicker-rtl .ui-datepicker-buttonpane button { float: left; } .ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current, .ui-datepicker-rtl .ui-datepicker-group { float: right; } .ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header, .ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header { border-right-width: 0; border-left-width: 1px; } /* Icons */ .ui-datepicker .ui-icon { display: block; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; left: .5em; top: .3em; } .ui-dialog { position: absolute; top: 0; left: 0; padding: .2em; outline: 0; } .ui-dialog .ui-dialog-titlebar { padding: .4em 1em; position: relative; } .ui-dialog .ui-dialog-title { float: left; margin: .1em 0; white-space: nowrap; width: 90%; overflow: hidden; text-overflow: ellipsis; } .ui-dialog .ui-dialog-titlebar-close { position: absolute; right: .3em; top: 50%; width: 20px; margin: -10px 0 0 0; padding: 1px; height: 20px; } .ui-dialog .ui-dialog-content { position: relative; border: 0; padding: .5em 1em; background: none; overflow: auto; } .ui-dialog .ui-dialog-buttonpane { text-align: left; border-width: 1px 0 0 0; background-image: none; margin-top: .5em; padding: .3em 1em .5em .4em; } .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset { float: right; } .ui-dialog .ui-dialog-buttonpane button { margin: .5em .4em .5em 0; cursor: pointer; } .ui-dialog .ui-resizable-n { height: 2px; top: 0; } .ui-dialog .ui-resizable-e { width: 2px; right: 0; } .ui-dialog .ui-resizable-s { height: 2px; bottom: 0; } .ui-dialog .ui-resizable-w { width: 2px; left: 0; } .ui-dialog .ui-resizable-se, .ui-dialog .ui-resizable-sw, .ui-dialog .ui-resizable-ne, .ui-dialog .ui-resizable-nw { width: 7px; height: 7px; } .ui-dialog .ui-resizable-se { right: 0; bottom: 0; } .ui-dialog .ui-resizable-sw { left: 0; bottom: 0; } .ui-dialog .ui-resizable-ne { right: 0; top: 0; } .ui-dialog .ui-resizable-nw { left: 0; top: 0; } .ui-draggable .ui-dialog-titlebar { cursor: move; } .ui-draggable-handle { -ms-touch-action: none; touch-action: none; } .ui-resizable { position: relative; } .ui-resizable-handle { position: absolute; font-size: 0.1px; display: block; -ms-touch-action: none; touch-action: none; } .ui-resizable-disabled .ui-resizable-handle, .ui-resizable-autohide .ui-resizable-handle { display: none; } .ui-resizable-n { cursor: n-resize; height: 7px; width: 100%; top: -5px; left: 0; } .ui-resizable-s { cursor: s-resize; height: 7px; width: 100%; bottom: -5px; left: 0; } .ui-resizable-e { cursor: e-resize; width: 7px; right: -5px; top: 0; height: 100%; } .ui-resizable-w { cursor: w-resize; width: 7px; left: -5px; top: 0; height: 100%; } .ui-resizable-se { cursor: se-resize; width: 12px; height: 12px; right: 1px; bottom: 1px; } .ui-resizable-sw { cursor: sw-resize; width: 9px; height: 9px; left: -5px; bottom: -5px; } .ui-resizable-nw { cursor: nw-resize; width: 9px; height: 9px; left: -5px; top: -5px; } .ui-resizable-ne { cursor: ne-resize; width: 9px; height: 9px; right: -5px; top: -5px; } .ui-progressbar { height: 2em; text-align: left; overflow: hidden; } .ui-progressbar .ui-progressbar-value { margin: -1px; height: 100%; } .ui-progressbar .ui-progressbar-overlay { background: url("data:image/gif;base64,R0lGODlhKAAoAIABAAAAAP///yH/C05FVFNDQVBFMi4wAwEAAAAh+QQJAQABACwAAAAAKAAoAAACkYwNqXrdC52DS06a7MFZI+4FHBCKoDeWKXqymPqGqxvJrXZbMx7Ttc+w9XgU2FB3lOyQRWET2IFGiU9m1frDVpxZZc6bfHwv4c1YXP6k1Vdy292Fb6UkuvFtXpvWSzA+HycXJHUXiGYIiMg2R6W459gnWGfHNdjIqDWVqemH2ekpObkpOlppWUqZiqr6edqqWQAAIfkECQEAAQAsAAAAACgAKAAAApSMgZnGfaqcg1E2uuzDmmHUBR8Qil95hiPKqWn3aqtLsS18y7G1SzNeowWBENtQd+T1JktP05nzPTdJZlR6vUxNWWjV+vUWhWNkWFwxl9VpZRedYcflIOLafaa28XdsH/ynlcc1uPVDZxQIR0K25+cICCmoqCe5mGhZOfeYSUh5yJcJyrkZWWpaR8doJ2o4NYq62lAAACH5BAkBAAEALAAAAAAoACgAAAKVDI4Yy22ZnINRNqosw0Bv7i1gyHUkFj7oSaWlu3ovC8GxNso5fluz3qLVhBVeT/Lz7ZTHyxL5dDalQWPVOsQWtRnuwXaFTj9jVVh8pma9JjZ4zYSj5ZOyma7uuolffh+IR5aW97cHuBUXKGKXlKjn+DiHWMcYJah4N0lYCMlJOXipGRr5qdgoSTrqWSq6WFl2ypoaUAAAIfkECQEAAQAsAAAAACgAKAAAApaEb6HLgd/iO7FNWtcFWe+ufODGjRfoiJ2akShbueb0wtI50zm02pbvwfWEMWBQ1zKGlLIhskiEPm9R6vRXxV4ZzWT2yHOGpWMyorblKlNp8HmHEb/lCXjcW7bmtXP8Xt229OVWR1fod2eWqNfHuMjXCPkIGNileOiImVmCOEmoSfn3yXlJWmoHGhqp6ilYuWYpmTqKUgAAIfkECQEAAQAsAAAAACgAKAAAApiEH6kb58biQ3FNWtMFWW3eNVcojuFGfqnZqSebuS06w5V80/X02pKe8zFwP6EFWOT1lDFk8rGERh1TTNOocQ61Hm4Xm2VexUHpzjymViHrFbiELsefVrn6XKfnt2Q9G/+Xdie499XHd2g4h7ioOGhXGJboGAnXSBnoBwKYyfioubZJ2Hn0RuRZaflZOil56Zp6iioKSXpUAAAh+QQJAQABACwAAAAAKAAoAAACkoQRqRvnxuI7kU1a1UU5bd5tnSeOZXhmn5lWK3qNTWvRdQxP8qvaC+/yaYQzXO7BMvaUEmJRd3TsiMAgswmNYrSgZdYrTX6tSHGZO73ezuAw2uxuQ+BbeZfMxsexY35+/Qe4J1inV0g4x3WHuMhIl2jXOKT2Q+VU5fgoSUI52VfZyfkJGkha6jmY+aaYdirq+lQAACH5BAkBAAEALAAAAAAoACgAAAKWBIKpYe0L3YNKToqswUlvznigd4wiR4KhZrKt9Upqip61i9E3vMvxRdHlbEFiEXfk9YARYxOZZD6VQ2pUunBmtRXo1Lf8hMVVcNl8JafV38aM2/Fu5V16Bn63r6xt97j09+MXSFi4BniGFae3hzbH9+hYBzkpuUh5aZmHuanZOZgIuvbGiNeomCnaxxap2upaCZsq+1kAACH5BAkBAAEALAAAAAAoACgAAAKXjI8By5zf4kOxTVrXNVlv1X0d8IGZGKLnNpYtm8Lr9cqVeuOSvfOW79D9aDHizNhDJidFZhNydEahOaDH6nomtJjp1tutKoNWkvA6JqfRVLHU/QUfau9l2x7G54d1fl995xcIGAdXqMfBNadoYrhH+Mg2KBlpVpbluCiXmMnZ2Sh4GBqJ+ckIOqqJ6LmKSllZmsoq6wpQAAAh+QQJAQABACwAAAAAKAAoAAAClYx/oLvoxuJDkU1a1YUZbJ59nSd2ZXhWqbRa2/gF8Gu2DY3iqs7yrq+xBYEkYvFSM8aSSObE+ZgRl1BHFZNr7pRCavZ5BW2142hY3AN/zWtsmf12p9XxxFl2lpLn1rseztfXZjdIWIf2s5dItwjYKBgo9yg5pHgzJXTEeGlZuenpyPmpGQoKOWkYmSpaSnqKileI2FAAACH5BAkBAAEALAAAAAAoACgAAAKVjB+gu+jG4kORTVrVhRlsnn2dJ3ZleFaptFrb+CXmO9OozeL5VfP99HvAWhpiUdcwkpBH3825AwYdU8xTqlLGhtCosArKMpvfa1mMRae9VvWZfeB2XfPkeLmm18lUcBj+p5dnN8jXZ3YIGEhYuOUn45aoCDkp16hl5IjYJvjWKcnoGQpqyPlpOhr3aElaqrq56Bq7VAAAOw=="); height: 100%; filter: alpha(opacity=25); /* support: IE8 */ opacity: 0.25; } .ui-progressbar-indeterminate .ui-progressbar-value { background-image: none; } .ui-selectable { -ms-touch-action: none; touch-action: none; } .ui-selectable-helper { position: absolute; z-index: 100; border: 1px dotted black; } .ui-selectmenu-menu { padding: 0; margin: 0; position: absolute; top: 0; left: 0; display: none; } .ui-selectmenu-menu .ui-menu { overflow: auto; overflow-x: hidden; padding-bottom: 1px; } .ui-selectmenu-menu .ui-menu .ui-selectmenu-optgroup { font-size: 1em; font-weight: bold; line-height: 1.5; padding: 2px 0.4em; margin: 0.5em 0 0 0; height: auto; border: 0; } .ui-selectmenu-open { display: block; } .ui-selectmenu-text { display: block; margin-right: 20px; overflow: hidden; text-overflow: ellipsis; } .ui-selectmenu-button.ui-button { text-align: left; white-space: nowrap; width: 14em; } .ui-selectmenu-icon.ui-icon { float: right; margin-top: 0; } .ui-slider {border: none!important; position: relative; text-align: left; } .ui-slider .ui-slider-handle {border-radius: 100%;border: none!important;background: #c4c8cc!important; position: absolute; z-index: 2; width: 1.2em; height: 1.2em; cursor: default; -ms-touch-action: none; touch-action: none; } .ui-slider .ui-slider-range {border: none!important;background: #0064ca!important; position: absolute; z-index: 1; font-size: .7em; display: block; border: 0; background-position: 0 0; } /* support: IE8 - See #6727 */ .ui-slider.ui-state-disabled .ui-slider-handle, .ui-slider.ui-state-disabled .ui-slider-range { filter: inherit; } .ui-slider-horizontal {background: #e9e9e9!important; height: 6px; } .ui-slider-horizontal .ui-slider-handle { top: -.4em; margin-left: -.6em; } .ui-slider-horizontal .ui-slider-range { top: 0; height: 100%; } .ui-slider-horizontal .ui-slider-range-min { left: 0; } .ui-slider-horizontal .ui-slider-range-max { right: 0; } .ui-slider-vertical { width: .8em; height: 100px; } .ui-slider-vertical .ui-slider-handle { left: -.3em; margin-left: 0; margin-bottom: -.6em; } .ui-slider-vertical .ui-slider-range { left: 0; width: 100%; } .ui-slider-vertical .ui-slider-range-min { bottom: 0; } .ui-slider-vertical .ui-slider-range-max { top: 0; } .ui-sortable-handle { -ms-touch-action: none; touch-action: none; } .ui-spinner { position: relative; display: inline-block; overflow: hidden; padding: 0; vertical-align: middle; } .ui-spinner-input { border: none; background: none; color: inherit; padding: .222em 0; margin: .2em 0; vertical-align: middle; margin-left: .4em; margin-right: 2em; } .ui-spinner-button { width: 1.6em; height: 50%; font-size: .5em; padding: 0; margin: 0; text-align: center; position: absolute; cursor: default; display: block; overflow: hidden; right: 0; } /* more specificity required here to override default borders */ .ui-spinner a.ui-spinner-button { border-top-style: none; border-bottom-style: none; border-right-style: none; } .ui-spinner-up { top: 0; } .ui-spinner-down { bottom: 0; } .ui-tabs { position: relative;/* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */ padding: .2em; } .ui-tabs .ui-tabs-nav { margin: 0; padding: .2em .2em 0; } .ui-tabs .ui-tabs-nav li { list-style: none; float: left; position: relative; top: 0; margin: 1px .2em 0 0; border-bottom-width: 0; padding: 0; white-space: nowrap; } .ui-tabs .ui-tabs-nav .ui-tabs-anchor { float: left; padding: .5em 1em; text-decoration: none; } .ui-tabs .ui-tabs-nav li.ui-tabs-active { margin-bottom: -1px; padding-bottom: 1px; } .ui-tabs .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor, .ui-tabs .ui-tabs-nav li.ui-state-disabled .ui-tabs-anchor, .ui-tabs .ui-tabs-nav li.ui-tabs-loading .ui-tabs-anchor { cursor: text; } .ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor { cursor: pointer; } .ui-tabs .ui-tabs-panel { display: block; border-width: 0; padding: 1em 1.4em; background: none; } .ui-tooltip { padding: 8px; position: absolute; z-index: 9999; max-width: 300px; } body .ui-tooltip { border-width: 2px; } /* Component containers ----------------------------------*/ .ui-widget { font-family: Arial,Helvetica,sans-serif; font-size: 1em; } .ui-widget .ui-widget { font-size: 1em; } .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: Arial,Helvetica,sans-serif; font-size: 1em; } .ui-widget.ui-widget-content { border: 1px solid #c5c5c5; } .ui-widget-content { border: 1px solid #dddddd; background: #ffffff; color: #333333; } .ui-widget-content a { color: #333333; } .ui-widget-header { border: 1px solid #dddddd; background: #e9e9e9; color: #333333; font-weight: bold; } .ui-widget-header a { color: #333333; } /* Interaction states ----------------------------------*/ .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, /* We use html here because we need a greater specificity to make sure disabled works properly when clicked or hovered */ html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active { border: 1px solid #c5c5c5; background: #f6f6f6; font-weight: normal; color: #454545; } .ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited, a.ui-button, a:link.ui-button, a:visited.ui-button, .ui-button { color: #454545; text-decoration: none; } .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus, .ui-button:hover, .ui-button:focus { border: 1px solid #cccccc; background: #ededed; font-weight: normal; color: #2b2b2b; } .ui-state-hover a, .ui-state-hover a:hover, .ui-state-hover a:link, .ui-state-hover a:visited, .ui-state-focus a, .ui-state-focus a:hover, .ui-state-focus a:link, .ui-state-focus a:visited, a.ui-button:hover, a.ui-button:focus { color: #2b2b2b; text-decoration: none; } .ui-visual-focus { box-shadow: 0 0 3px 1px rgb(94, 158, 214); } .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover { border: 1px solid #003eff; background: #007fff; font-weight: normal; color: #ffffff; } .ui-icon-background, .ui-state-active .ui-icon-background { border: #003eff; background-color: #ffffff; } .ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: #ffffff; text-decoration: none; } /* Interaction Cues ----------------------------------*/ .ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight { border: 1px solid #dad55e; background: #fffa90; color: #777620; } .ui-state-checked { border: 1px solid #dad55e; background: #fffa90; } .ui-state-highlight a, .ui-widget-content .ui-state-highlight a, .ui-widget-header .ui-state-highlight a { color: #777620; } .ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error { border: 1px solid #f1a899; background: #fddfdf; color: #5f3f3f; } .ui-state-error a, .ui-widget-content .ui-state-error a, .ui-widget-header .ui-state-error a { color: #5f3f3f; } .ui-state-error-text, .ui-widget-content .ui-state-error-text, .ui-widget-header .ui-state-error-text { color: #5f3f3f; } .ui-priority-primary, .ui-widget-content .ui-priority-primary, .ui-widget-header .ui-priority-primary { font-weight: bold; } .ui-priority-secondary, .ui-widget-content .ui-priority-secondary, .ui-widget-header .ui-priority-secondary { opacity: .7; filter:Alpha(Opacity=70); /* support: IE8 */ font-weight: normal; } .ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled { opacity: .35; filter:Alpha(Opacity=35); /* support: IE8 */ background-image: none; } .ui-state-disabled .ui-icon { filter:Alpha(Opacity=35); /* support: IE8 - See #6059 */ } /* Icons ----------------------------------*/ /* states and images */ .ui-icon { width: 16px; height: 16px; } .ui-icon, .ui-widget-content .ui-icon { background-image: url("images/ui-icons_222222_256x240.png"); } .ui-widget-header .ui-icon { background-image: url("images/ui-icons_222222_256x240.png"); } .ui-button .ui-icon { background-image: url("images/ui-icons_777777_256x240.png"); } .ui-state-hover .ui-icon, .ui-state-focus .ui-icon, .ui-button:hover .ui-icon, .ui-button:focus .ui-icon, .ui-state-default .ui-icon { background-image: url("images/ui-icons_222222_256x240.png"); } .ui-state-active .ui-icon, .ui-button:active .ui-icon { background-image: url("images/ui-icons_ffffff_256x240.png"); } .ui-state-highlight .ui-icon, .ui-button .ui-state-highlight.ui-icon { background-image: url("images/ui-icons_777620_256x240.png"); } .ui-state-error .ui-icon, .ui-state-error-text .ui-icon { background-image: url("images/ui-icons_cc0000_256x240.png"); } /* positioning */ .ui-icon-blank { background-position: 16px 16px; } .ui-icon-caret-1-n { background-position: 0 0; } .ui-icon-caret-1-ne { background-position: -16px 0; } .ui-icon-caret-1-e { background-position: -32px 0; } .ui-icon-caret-1-se { background-position: -48px 0; } .ui-icon-caret-1-s { background-position: -65px 0; } .ui-icon-caret-1-sw { background-position: -80px 0; } .ui-icon-caret-1-w { background-position: -96px 0; } .ui-icon-caret-1-nw { background-position: -112px 0; } .ui-icon-caret-2-n-s { background-position: -128px 0; } .ui-icon-caret-2-e-w { background-position: -144px 0; } .ui-icon-triangle-1-n { background-position: 0 -16px; } .ui-icon-triangle-1-ne { background-position: -16px -16px; } .ui-icon-triangle-1-e { background-position: -32px -16px; } .ui-icon-triangle-1-se { background-position: -48px -16px; } .ui-icon-triangle-1-s { background-position: -65px -16px; } .ui-icon-triangle-1-sw { background-position: -80px -16px; } .ui-icon-triangle-1-w { background-position: -96px -16px; } .ui-icon-triangle-1-nw { background-position: -112px -16px; } .ui-icon-triangle-2-n-s { background-position: -128px -16px; } .ui-icon-triangle-2-e-w { background-position: -144px -16px; } .ui-icon-arrow-1-n { background-position: 0 -32px; } .ui-icon-arrow-1-ne { background-position: -16px -32px; } .ui-icon-arrow-1-e { background-position: -32px -32px; } .ui-icon-arrow-1-se { background-position: -48px -32px; } .ui-icon-arrow-1-s { background-position: -65px -32px; } .ui-icon-arrow-1-sw { background-position: -80px -32px; } .ui-icon-arrow-1-w { background-position: -96px -32px; } .ui-icon-arrow-1-nw { background-position: -112px -32px; } .ui-icon-arrow-2-n-s { background-position: -128px -32px; } .ui-icon-arrow-2-ne-sw { background-position: -144px -32px; } .ui-icon-arrow-2-e-w { background-position: -160px -32px; } .ui-icon-arrow-2-se-nw { background-position: -176px -32px; } .ui-icon-arrowstop-1-n { background-position: -192px -32px; } .ui-icon-arrowstop-1-e { background-position: -208px -32px; } .ui-icon-arrowstop-1-s { background-position: -224px -32px; } .ui-icon-arrowstop-1-w { background-position: -240px -32px; } .ui-icon-arrowthick-1-n { background-position: 1px -48px; } .ui-icon-arrowthick-1-ne { background-position: -16px -48px; } .ui-icon-arrowthick-1-e { background-position: -32px -48px; } .ui-icon-arrowthick-1-se { background-position: -48px -48px; } .ui-icon-arrowthick-1-s { background-position: -64px -48px; } .ui-icon-arrowthick-1-sw { background-position: -80px -48px; } .ui-icon-arrowthick-1-w { background-position: -96px -48px; } .ui-icon-arrowthick-1-nw { background-position: -112px -48px; } .ui-icon-arrowthick-2-n-s { background-position: -128px -48px; } .ui-icon-arrowthick-2-ne-sw { background-position: -144px -48px; } .ui-icon-arrowthick-2-e-w { background-position: -160px -48px; } .ui-icon-arrowthick-2-se-nw { background-position: -176px -48px; } .ui-icon-arrowthickstop-1-n { background-position: -192px -48px; } .ui-icon-arrowthickstop-1-e { background-position: -208px -48px; } .ui-icon-arrowthickstop-1-s { background-position: -224px -48px; } .ui-icon-arrowthickstop-1-w { background-position: -240px -48px; } .ui-icon-arrowreturnthick-1-w { background-position: 0 -64px; } .ui-icon-arrowreturnthick-1-n { background-position: -16px -64px; } .ui-icon-arrowreturnthick-1-e { background-position: -32px -64px; } .ui-icon-arrowreturnthick-1-s { background-position: -48px -64px; } .ui-icon-arrowreturn-1-w { background-position: -64px -64px; } .ui-icon-arrowreturn-1-n { background-position: -80px -64px; } .ui-icon-arrowreturn-1-e { background-position: -96px -64px; } .ui-icon-arrowreturn-1-s { background-position: -112px -64px; } .ui-icon-arrowrefresh-1-w { background-position: -128px -64px; } .ui-icon-arrowrefresh-1-n { background-position: -144px -64px; } .ui-icon-arrowrefresh-1-e { background-position: -160px -64px; } .ui-icon-arrowrefresh-1-s { background-position: -176px -64px; } .ui-icon-arrow-4 { background-position: 0 -80px; } .ui-icon-arrow-4-diag { background-position: -16px -80px; } .ui-icon-extlink { background-position: -32px -80px; } .ui-icon-newwin { background-position: -48px -80px; } .ui-icon-refresh { background-position: -64px -80px; } .ui-icon-shuffle { background-position: -80px -80px; } .ui-icon-transfer-e-w { background-position: -96px -80px; } .ui-icon-transferthick-e-w { background-position: -112px -80px; } .ui-icon-folder-collapsed { background-position: 0 -96px; } .ui-icon-folder-open { background-position: -16px -96px; } .ui-icon-document { background-position: -32px -96px; } .ui-icon-document-b { background-position: -48px -96px; } .ui-icon-note { background-position: -64px -96px; } .ui-icon-mail-closed { background-position: -80px -96px; } .ui-icon-mail-open { background-position: -96px -96px; } .ui-icon-suitcase { background-position: -112px -96px; } .ui-icon-comment { background-position: -128px -96px; } .ui-icon-person { background-position: -144px -96px; } .ui-icon-print { background-position: -160px -96px; } .ui-icon-trash { background-position: -176px -96px; } .ui-icon-locked { background-position: -192px -96px; } .ui-icon-unlocked { background-position: -208px -96px; } .ui-icon-bookmark { background-position: -224px -96px; } .ui-icon-tag { background-position: -240px -96px; } .ui-icon-home { background-position: 0 -112px; } .ui-icon-flag { background-position: -16px -112px; } .ui-icon-calendar { background-position: -32px -112px; } .ui-icon-cart { background-position: -48px -112px; } .ui-icon-pencil { background-position: -64px -112px; } .ui-icon-clock { background-position: -80px -112px; } .ui-icon-disk { background-position: -96px -112px; } .ui-icon-calculator { background-position: -112px -112px; } .ui-icon-zoomin { background-position: -128px -112px; } .ui-icon-zoomout { background-position: -144px -112px; } .ui-icon-search { background-position: -160px -112px; } .ui-icon-wrench { background-position: -176px -112px; } .ui-icon-gear { background-position: -192px -112px; } .ui-icon-heart { background-position: -208px -112px; } .ui-icon-star { background-position: -224px -112px; } .ui-icon-link { background-position: -240px -112px; } .ui-icon-cancel { background-position: 0 -128px; } .ui-icon-plus { background-position: -16px -128px; } .ui-icon-plusthick { background-position: -32px -128px; } .ui-icon-minus { background-position: -48px -128px; } .ui-icon-minusthick { background-position: -64px -128px; } .ui-icon-close { background-position: -80px -128px; } .ui-icon-closethick { background-position: -96px -128px; } .ui-icon-key { background-position: -112px -128px; } .ui-icon-lightbulb { background-position: -128px -128px; } .ui-icon-scissors { background-position: -144px -128px; } .ui-icon-clipboard { background-position: -160px -128px; } .ui-icon-copy { background-position: -176px -128px; } .ui-icon-contact { background-position: -192px -128px; } .ui-icon-image { background-position: -208px -128px; } .ui-icon-video { background-position: -224px -128px; } .ui-icon-script { background-position: -240px -128px; } .ui-icon-alert { background-position: 0 -144px; } .ui-icon-info { background-position: -16px -144px; } .ui-icon-notice { background-position: -32px -144px; } .ui-icon-help { background-position: -48px -144px; } .ui-icon-check { background-position: -64px -144px; } .ui-icon-bullet { background-position: -80px -144px; } .ui-icon-radio-on { background-position: -96px -144px; } .ui-icon-radio-off { background-position: -112px -144px; } .ui-icon-pin-w { background-position: -128px -144px; } .ui-icon-pin-s { background-position: -144px -144px; } .ui-icon-play { background-position: 0 -160px; } .ui-icon-pause { background-position: -16px -160px; } .ui-icon-seek-next { background-position: -32px -160px; } .ui-icon-seek-prev { background-position: -48px -160px; } .ui-icon-seek-end { background-position: -64px -160px; } .ui-icon-seek-start { background-position: -80px -160px; } /* ui-icon-seek-first is deprecated, use ui-icon-seek-start instead */ .ui-icon-seek-first { background-position: -80px -160px; } .ui-icon-stop { background-position: -96px -160px; } .ui-icon-eject { background-position: -112px -160px; } .ui-icon-volume-off { background-position: -128px -160px; } .ui-icon-volume-on { background-position: -144px -160px; } .ui-icon-power { background-position: 0 -176px; } .ui-icon-signal-diag { background-position: -16px -176px; } .ui-icon-signal { background-position: -32px -176px; } .ui-icon-battery-0 { background-position: -48px -176px; } .ui-icon-battery-1 { background-position: -64px -176px; } .ui-icon-battery-2 { background-position: -80px -176px; } .ui-icon-battery-3 { background-position: -96px -176px; } .ui-icon-circle-plus { background-position: 0 -192px; } .ui-icon-circle-minus { background-position: -16px -192px; } .ui-icon-circle-close { background-position: -32px -192px; } .ui-icon-circle-triangle-e { background-position: -48px -192px; } .ui-icon-circle-triangle-s { background-position: -64px -192px; } .ui-icon-circle-triangle-w { background-position: -80px -192px; } .ui-icon-circle-triangle-n { background-position: -96px -192px; } .ui-icon-circle-arrow-e { background-position: -112px -192px; } .ui-icon-circle-arrow-s { background-position: -128px -192px; } .ui-icon-circle-arrow-w { background-position: -144px -192px; } .ui-icon-circle-arrow-n { background-position: -160px -192px; } .ui-icon-circle-zoomin { background-position: -176px -192px; } .ui-icon-circle-zoomout { background-position: -192px -192px; } .ui-icon-circle-check { background-position: -208px -192px; } .ui-icon-circlesmall-plus { background-position: 0 -208px; } .ui-icon-circlesmall-minus { background-position: -16px -208px; } .ui-icon-circlesmall-close { background-position: -32px -208px; } .ui-icon-squaresmall-plus { background-position: -48px -208px; } .ui-icon-squaresmall-minus { background-position: -64px -208px; } .ui-icon-squaresmall-close { background-position: -80px -208px; } .ui-icon-grip-dotted-vertical { background-position: 0 -224px; } .ui-icon-grip-dotted-horizontal { background-position: -16px -224px; } .ui-icon-grip-solid-vertical { background-position: -32px -224px; } .ui-icon-grip-solid-horizontal { background-position: -48px -224px; } .ui-icon-gripsmall-diagonal-se { background-position: -64px -224px; } .ui-icon-grip-diagonal-se { background-position: -80px -224px; } /* Misc visuals ----------------------------------*/ /* Corner radius */ .ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl { border-top-left-radius: 3px; } .ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr { border-top-right-radius: 3px; } .ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl { border-bottom-left-radius: 3px; } .ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br { border-bottom-right-radius: 3px; } /* Overlays */ .ui-widget-overlay { background: #aaaaaa; opacity: .3; filter: Alpha(Opacity=30); /* support: IE8 */ } .ui-widget-shadow { -webkit-box-shadow: 0px 0px 5px #666666; box-shadow: 0px 0px 5px #666666; } /* Magnific Popup CSS */ .mfp-bg { top: 0; left: 0; width: 100%; height: 100%; z-index: 1042; overflow: hidden; position: fixed; background: #0b0b0b; opacity: 0.8; filter: alpha(opacity=80); } .mfp-wrap { top: 0; left: 0; width: 100%; height: 100%; z-index: 1043; position: fixed; outline: none !important; -webkit-backface-visibility: hidden; } .mfp-container { text-align: center; position: absolute; width: 100%; height: 100%; left: 0; top: 0; padding: 0 8px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .mfp-container:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; } .mfp-align-top .mfp-container:before { display: none; } .mfp-content { position: relative; display: inline-block; vertical-align: middle; margin: 0 auto; text-align: left; z-index: 1045; } .mfp-inline-holder .mfp-content, .mfp-ajax-holder .mfp-content { width: 100%; cursor: auto; } .mfp-ajax-cur { cursor: progress; } .mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close { cursor: -moz-zoom-out; cursor: -webkit-zoom-out; cursor: zoom-out; } .mfp-zoom { cursor: pointer; cursor: -webkit-zoom-in; cursor: -moz-zoom-in; cursor: zoom-in; } .mfp-auto-cursor .mfp-content { cursor: auto; } .mfp-close, .mfp-arrow, .mfp-preloader, .mfp-counter { -webkit-user-select: none; -moz-user-select: none; user-select: none; } .mfp-loading.mfp-figure { display: none; } .mfp-hide { display: none !important; } .mfp-preloader { color: #cccccc; position: absolute; top: 50%; width: auto; text-align: center; margin-top: -0.8em; left: 8px; right: 8px; z-index: 1044; } .mfp-preloader a { color: #cccccc; } .mfp-preloader a:hover { color: white; } .mfp-s-ready .mfp-preloader { display: none; } .mfp-s-error .mfp-content { display: none; } button.mfp-close, button.mfp-arrow { overflow: visible; cursor: pointer; background: transparent; border: 0; -webkit-appearance: none; display: block; outline: none; padding: 0; z-index: 1046; -webkit-box-shadow: none; box-shadow: none; } button::-moz-focus-inner { padding: 0; border: 0; } .mfp-close { width: 44px; height: 44px; line-height: 44px; position: absolute; right: 0; top: 0; text-decoration: none; text-align: center; opacity: 0.65; filter: alpha(opacity=65); padding: 0 0 18px 10px; color: white; font-style: normal; font-size: 28px; font-family: Arial, Baskerville, monospace; } .mfp-close:hover, .mfp-close:focus { opacity: 1; filter: alpha(opacity=100); } .mfp-close:active { top: 1px; } .mfp-close-btn-in .mfp-close { color: #333333; } .mfp-image-holder .mfp-close, .mfp-iframe-holder .mfp-close { color: white; right: -6px; text-align: right; padding-right: 6px; width: 100%; } .mfp-counter { position: absolute; top: 0; right: 0; color: #cccccc; font-size: 12px; line-height: 18px; } .mfp-arrow { position: absolute; opacity: 0.65; filter: alpha(opacity=65); margin: 0; top: 50%; margin-top: -55px; padding: 0; width: 90px; height: 110px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .mfp-arrow:active { margin-top: -54px; } .mfp-arrow:hover, .mfp-arrow:focus { opacity: 1; filter: alpha(opacity=100); } .mfp-arrow:before, .mfp-arrow:after, .mfp-arrow .mfp-b, .mfp-arrow .mfp-a { content: ''; display: block; width: 0; height: 0; position: absolute; left: 0; top: 0; margin-top: 35px; margin-left: 35px; border: medium inset transparent; } .mfp-arrow:after, .mfp-arrow .mfp-a { border-top-width: 13px; border-bottom-width: 13px; top: 8px; } .mfp-arrow:before, .mfp-arrow .mfp-b { border-top-width: 21px; border-bottom-width: 21px; opacity: 0.7; } .mfp-arrow-left { left: 0; } .mfp-arrow-left:after, .mfp-arrow-left .mfp-a { border-right: 17px solid white; margin-left: 31px; } .mfp-arrow-left:before, .mfp-arrow-left .mfp-b { margin-left: 25px; border-right: 27px solid #3f3f3f; } .mfp-arrow-right { right: 0; } .mfp-arrow-right:after, .mfp-arrow-right .mfp-a { border-left: 17px solid white; margin-left: 39px; } .mfp-arrow-right:before, .mfp-arrow-right .mfp-b { border-left: 27px solid #3f3f3f; } .mfp-iframe-holder { padding-top: 40px; padding-bottom: 40px; } .mfp-iframe-holder .mfp-content { line-height: 0; width: 100%; max-width: 900px; } .mfp-iframe-holder .mfp-close { top: -40px; } .mfp-iframe-scaler { width: 100%; height: 0; overflow: hidden; padding-top: 56.25%; } .mfp-iframe-scaler iframe { position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: black; } /* Main image in popup */ img.mfp-img { width: auto; max-width: 100%; height: auto; display: block; line-height: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 40px 0 40px; margin: 0 auto; } /* The shadow behind the image */ .mfp-figure { line-height: 0; } .mfp-figure:after { content: ''; position: absolute; left: 0; top: 40px; bottom: 40px; display: block; right: 0; width: auto; height: auto; z-index: -1; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: #444444; } .mfp-figure small { color: #bdbdbd; display: block; font-size: 12px; line-height: 14px; } .mfp-figure figure { margin: 0; } .mfp-bottom-bar { margin-top: -36px; position: absolute; top: 100%; left: 0; width: 100%; cursor: auto; } .mfp-title { text-align: left; line-height: 18px; color: #f3f3f3; word-wrap: break-word; padding-right: 36px; } .mfp-image-holder .mfp-content { max-width: 100%; } .mfp-gallery .mfp-image-holder .mfp-figure { cursor: pointer; } @media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) { /** * Remove all paddings around the image on small screen */ .mfp-img-mobile .mfp-image-holder { padding-left: 0; padding-right: 0; } .mfp-img-mobile img.mfp-img { padding: 0; } .mfp-img-mobile .mfp-figure:after { top: 0; bottom: 0; } .mfp-img-mobile .mfp-figure small { display: inline; margin-left: 5px; } .mfp-img-mobile .mfp-bottom-bar { background: rgba(0, 0, 0, 0.6); bottom: 0; margin: 0; top: auto; padding: 3px 5px; position: fixed; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .mfp-img-mobile .mfp-bottom-bar:empty { padding: 0; } .mfp-img-mobile .mfp-counter { right: 5px; top: 3px; } .mfp-img-mobile .mfp-close { top: 0; right: 0; width: 35px; height: 35px; line-height: 35px; background: rgba(0, 0, 0, 0.6); position: fixed; text-align: center; padding: 0; } } @media all and (max-width: 900px) { .mfp-arrow { -webkit-transform: scale(0.75); transform: scale(0.75); } .mfp-arrow-left { -webkit-transform-origin: 0; transform-origin: 0; } .mfp-arrow-right { -webkit-transform-origin: 100%; transform-origin: 100%; } .mfp-container { padding-left: 6px; padding-right: 6px; } } .mfp-ie7 .mfp-img { padding: 0; } .mfp-ie7 .mfp-bottom-bar { width: 600px; left: 50%; margin-left: -300px; margin-top: 5px; padding-bottom: 5px; } .mfp-ie7 .mfp-container { padding: 0; } .mfp-ie7 .mfp-content { padding-top: 44px; } .mfp-ie7 .mfp-close { top: 0; right: 0; padding-top: 0; } /* sliders ---------------------- */ .slick-slider{position: relative;display: block;box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list{position: relative;display: block;overflow: hidden;margin: 0;padding: 0;} .slick-list:focus{outline: none;} .slick-list.dragging{cursor: pointer;cursor: hand;} .slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track{position: relative;top: 0;left: 0;display: block;} .slick-track:before, .slick-track:after{display: table;content: '';} .slick-track:after{clear: both;} .slick-loading .slick-track{visibility: hidden;} .slick-slide{display: none;float: left;height: 100%;min-height: 1px;} [dir='rtl'] .slick-slide{float: right;} .slick-slide img{display: block;} .slick-slide.slick-loading img{display: none;} .slick-slide.dragging img{pointer-events: none;} .slick-initialized .slick-slide{display: block;} .slick-loading .slick-slide{visibility: hidden;} .slick-vertical .slick-slide{display: block;height: auto;border: 1px solid transparent;} .slick-arrow.slick-hidden {display: none;} /** system message **/ #mbsmessage, .system_message { position: fixed; width: auto; margin: 0 auto; box-shadow: 0 0 10px 5px rgba(0, 0, 0, 0.07); z-index: 101; text-align: center; } #mbsmessage .content, .system_message .content { margin: 0 auto; text-align: center; position: relative; display: inline-block; vertical-align: top; } #mbsmessage .content:before, .system_message .content:before { background-size: 30px !important; content: ""; left: -40px; position: absolute; top: 0; z-index: 2; width: 30px; height: 30px; display: block; } #mbsmessage.alert--danger .content:before, .system_message.alert--danger .content:before { background: url(images/icon--attention.svg) no-repeat; } #mbsmessage.alert--success .content:before, .system_message.alert--success .content:before { background: url(images/icon--success.svg) no-repeat; } #mbsmessage.alert--info .content:before, .system_message.alert--info .content:before { background: url(images/icon--info.svg) no-repeat no-repeat; } #mbsmessage.alert--warning .content:before, .system_message.alert--warning .content:before { background: url(images/icon--warning.svg) no-repeat no-repeat; } #mbsmessage.alert--process .content:before, .system_message.alert--process .content:before { content: ""; border-radius: 50%; width: 32px; height: 32px; display: inline-block; position: absolute; left: -46px; top: -4px; border-top: 3px solid rgba(255, 255, 255, 0.2); border-right: 3px solid rgba(255, 255, 255, 0.2); border-bottom: 3px solid rgba(255, 255, 255, 0.2); border-left: 3px solid #ffffff; -webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); -webkit-animation: load8 1.1s infinite linear; animation: load8 1.1s infinite linear; } .alert--success { background: #00b6ad; } .alert--info { background: #02b4d1; } .alert--warning { background: #f3c532; } .alert--process { background: #333; } .alert--danger { background-color: #f35f5f; } .div_error { text-align: left; padding: 20px 60px 20px 60px; position: relative; color: #fff; /*font-size: 0;*/ line-height: normal; background: url(images/icon--attention.svg) no-repeat 15px 15px #f35f5f; background-size: 30px; } .alert .div_error { padding: 0px; } #mbsmessage .content .div_error, #mbsmessage .content .div_info { padding: 0px; } .alert .div_error { background: none; } .div_error li { color: inherit; position: relative; padding: 0 0 5px 0; } .div_error li a { color: #fff; text-decoration: underline; } .div_info { font-weight: normal; padding: 20px 40px 20px 60px; position: relative; color: #fff; background: url(images/icon--info.svg) no-repeat 15px 15px #02b4d1; background-size: 30px; } .alert .div_info { background: none; } .div_info li { font-weight: 300; font-size: 1em; position: relative; padding: 0 0 5px 0; color: inherit; } .div_info li a { font-weight: normal; text-decoration: none; color: #fff; cursor: default; } .alert .div_msg { background: none; } .div_msg { font-weight: normal; padding: 20px 40px 20px 60px; position: relative; color: #fff; background: url(images/icon--success.svg) no-repeat 15px 15px #00b6ad; background-size: 30px; } #mbsmessage .div_msg, .system_message .div_msg { padding: 0; } .div_msg li { font-weight: 300; font-size: 1em; position: relative; padding: 0 0 5px 0; color: inherit; } .div_msg li a { font-weight: normal; font-size: 13px; text-decoration: none; color: #fff; cursor: default; } .div_info li:last-child, .div_error li:last-child, .div_msg li:last-child { padding-bottom: 0; } /* validation error messages */ .error { border-color: #F00!important; } .errorlist { margin: 0; list-style: none; padding: 2px 10px 4px; position: relative; background: #fdf7f6; clear: both; } .errorlist li a { color: #f44336; font-size: 11px; /*text-transform: uppercase;*/ text-decoration: none; } .errorlist li:last-child { padding-bottom: 0; } .errorlist li { font-size: 12px; position: relative; } /* alerts */ .alert { font-size: 1em; color: #fff; width: 100%; /*position: relative;*/ padding: 20px 20px; border: 1px solid transparent; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } @-webkit-keyframes fadeInUp { from { opacity: 0; visibility: hidden; /*-webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0);*/ -webkit-transform: translate3d(0, 40px, 0); transform: translate3d(0, 40px, 0); } to { opacity: 1; /*visibility: visible;*/ -webkit-transform: none; transform: none; } } @keyframes fadeInUp { from { opacity: 0; visibility: hidden; /*-webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0);*/ -webkit-transform: translate3d(0, 40px, 0); transform: translate3d(0, 40px, 0); } to { visibility: visible; opacity: 1; -webkit-transform: none; transform: none; } } .alert a { color: #fff; text-decoration: underline; } .alert--positioned-top { right: 20px; top: 25px; left: auto!important; bottom: auto!important; } .alert--positioned-bottom { left: 20px; bottom: 25px; } .alert--positioned-right-top { right: 20px; top: 25px; left: auto!important; bottom: auto!important; } .alert--positioned-right-bottom { right: 20px; bottom: 25px; left: auto!important; bottom: auto!important; } .alert--positioned-bottom-center { left: 0!important; right: 0!important; bottom: 25px; } .alert--positioned-top-center { left: 0!important; right: 0!important; top: 0; } .alert--positioned-center-center { left: 50%!important; top: 50% !important; bottom: auto !important; transform: translateX(-50%) !important; } .alert--positioned-top-full { left: 0!important; right: 0!important; top: 0; z-index: 9999; } .alert p { color: inherit; } .alert h5 { font-size: 18px; font-weight: 500; padding: 0; color: inherit; } .alert .close, .system_message .close { opacity: 0.3; } .alert .close:hover, .system_message .close:hover { opacity: 1; } .close, .system_message .closeMsg { z-index: 1; width: 20px; height: 20px; position: absolute; right: 10px; top: 10px; text-align: center; line-height: 18px; -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); } .close:before, .system_message .closeMsg:before { width: 3px; height: 15px; left: 50%; margin: 0 0 0 -2px; position: absolute; top: 2px; content: ""; background: #fff; } .close:after, .system_message .closeMsg:after { width: 15px; height: 3px; left: 2px; top: 50%; margin: -2px 0 0 0; position: absolute; content: ""; background: #fff; } .alert h4, .alert p { margin: 0; color: inherit; } .alert > p, .alert > ul { margin-bottom: 0; } .alert > p + p { margin-top: 5px; } @-webkit-keyframes load8 { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes load8 { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @media(max-width:767px) { #mbsmessage, .system_message { left: 10px; right: 10px; width: auto; } #mbsmessage .content, .system_message .content { min-width: inherit; } }/*---Bolg page  style ===========*/ .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 { line-height: 1.1; } .post { background: #fff; border: 1px solid #eaeaea; border-radius: 5px; margin-bottom: 20px; padding: 20px; position: relative; } .post:last-child { margin-bottom: 0px; } .top { display: inline-block; width: 100%; vertical-align: top; } .post_imges { margin: 20px 0; text-align: center; } .post_imges img { max-width: 100%; } .title { color: #ff3a59; font-size: 24px; padding-bottom: 7px; font-weight: 600; line-height: 1.2; } .title a:hover { color: #000; } /* .date { border-radius: 2px; float: left; font-size: 23px; font-weight: bold; line-height: 30px; overflow: hidden; text-align: center; padding-top: 5px; background: #eaeaea; width: 55px; color: #000; } .date span { line-height: 1; display: block; font-size: 14px; font-weight: 600; padding: 4px 12px; text-transform: uppercase; background: #333; color: #fff; }*/ .cmnt_area { padding-left: 70px; } .entry { padding-bottom: 10px; font-size: 14px; } .entry, .entry p { line-height: 25px; } .entry a { color: #009bcd; font-weight: 600; } .entry a:hover { color: #000; } .cmt-box { color: #4d5257; font-size: 14px; } .cmt-box li:first-child { border-left: medium none; padding-left: 0; } .cmt-box li { border-left: 1px solid #dddddd; float: left; font-size: 14px; margin-right: 10px; padding-left: 10px; margin-bottom:8px; } .cmt-box li .icon { color: #7e7d7d; padding-right: 7px; font-size: 18px; } .cmt-box a { color: #000000; } .cmt-box a:hover { text-decoration: underline; } .cmt-box span { background: #eaeaea; border-radius: 3px; display: inline-block; font-size: 13px; margin-left: 10px; padding: 2px 7px; position: relative; } .cmt-box span:before { border-bottom: 6px solid rgba(0, 0, 0, 0); border-right: 6px solid #eaeaea; border-top: 6px solid rgba(0, 0, 0, 0); content: ""; left: -6px; position: absolute; top: 5px; z-index: 1; } .post_midlSectn { position: relative; } .post_midlSectn p { font-size: 15px; line-height: 24px; padding-bottom: 10px; text-align: justify; } .link { color: #ff3a59; font-size: 15px; display: inline-block; } .link:hover { color: #000; } .sharewrap { border-top: 1px dashed #dddddd; clear: left; display: block; padding: 15px 0 0 0; width: 100%; margin-top: 15px; } .openToggle:before { color: #000; content: ""; font-family: "Ionicons"; font-size: 20px } .sectnTop.active .openToggle:before { content: "" } .sectnTop .openToggle { background: #ffb503; border-radius: 50%; float: right; height: 30px; line-height: 30px; margin: 0; text-align: center; width: 30px; display: none } .round_sectn { margin-top: 20px; } .round_sectn:last-child { margin-bottom: 0px; } .round_sectn>.sectnTop h4 { color: #fff; font-size: 16px; padding: 0 40px 0 0; margin: 0; } .round_sectn>.sectnTop { background: #727272; border-radius: 3px 3px 0 0; padding: 10px 18px; width: 100%; } .sectnMiddle { display: block; background: #fff; max-height: 390px; overflow-y: auto; } .blog_lnks, .post-links { border: 1px solid #e1e1e1; border-top: none } .blog_lnks li a:hover { color: #0fd3ec } .post-links>li { border-bottom: 1px solid #e7e7e7; padding: 10px 15px } .post-links>li>a { color: #505050; display: block; font-size: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap } .comnt_date { margin: 5px 0 0 } .comnt_date>li { display: inline-block; width: auto; } .comnt_date li a { color: #505050; font-size: 12px } .comnt_date span { padding: 0 4px 0 0 } .comnt_date span i { font-size: 14px; line-height: 14px } .post-links>li>a:hover, .comnt_date li a:hover { color: #000 } .accordion_icon { position: absolute; top: 6px; cursor: pointer; right: 0px; height: 29px; width: 30px; padding-left: 5px; } .accordion_icon:after { position: absolute; content: "\f218"; font-size: 16px; font-family: "Ionicons"; z-index: 5; color: var(--first-color); height: 29px; width: 17px; display: inline-block; padding: 6px 0 0 3px; } .accordion_icon.active:after { content: "\f209"; } .searchform { background: #fff; border: 1px solid #e3e3e3; border-radius: 4px; height: 45px; position: relative; margin-bottom: 20px; } .searchform input[type="text"] { width: 100%; background: #fff; border: none; border-radius: 4px; color: #666; font-size: 14px; position: relative; margin-top: 0px; box-shadow: none; padding: 10px 40px 10px 10px; height: 43px; } .searchform input[type="submit"] { background: url("images/search.png") no-repeat  center; border: none; cursor: pointer; font-size: 0; height:42px; position: absolute; right: 4px; top: 0; width: 30px; } .blog_lnks>li a { color: #505050; display: inline-block; font-size: 14px; padding: 10px 30px 10px 15px; } .blog_lnks li a:hover { color: #000 } .blog_lnks li { position: relative; border-bottom: 1px solid #e7e7e7; } .comnt_date { margin: 5px 0 0 } .comnt_date>li { display: inline-block; width: 46% } .comnt_date li a { color: #505050; font-size: 12px } .post-links>li>a:hover { color: #000 } .comnt_date li a:hover { text-decoration: underline } .blog_lnks li a .countxt { color: var(--first-color); display: inline-block; font-size: 14px; height: 20px; line-height: 19px; margin-left: 5px; } .themeBtn { width: 100%; padding: 15px 0; margin-top: 20px; } .post_imges .slider_nav img { border: 1px solid #eee; border-radius: 2px; padding: 5px; width: 97%; } .post_imges .slick-current img { border-color: #000; } .post_imges .slick-prev, .post_imges .slick-next { font-family: "Ionicons"; font-size: 0px; position: relative; background: none; border: none; position: absolute; top: 50%; display: inline-block; z-index: 444; width: 30px; height: 30px; display: block; cursor: pointer; } .post_imges .slick-prev:before, .post_imges .slick-next:before { font-family: "Ionicons"; color: #fff; border-radius: 100%; width: 30px; height: 30px; background: rgba(15, 211, 236, 07); font-size: 15px; line-height: 30px; display: block; position: absolute; cursor: pointer; top: 0px; left: 0px; right: 0px; } .post_imges .slick-prev { left: 10px; } .post_imges .slick-next { right: 10px; } .slick-prev:focus, .slick-next:focus { outline: none; } .post_imges .slick-prev:before { content: "\f124"; } .post_imges .slick-next:before { content: "\f125"; } .post_imges .slider_nav { margin-top: 20px; } .post_imges .slider_nav .slick-prev, .post_imges .slider_nav .slick-next { top: 33%; } .post_imges .slider_nav .slick-next { right: 17px; } .slick-slide:focus { outline: none; } .blog_lnks ul { background: #f7f7f7; border-top: 1px solid #e7e7e7; } .blog_lnks ul ul { background: #f2f2f2; border-bottom: 1px solid #e7e7e7; } .blog_lnks li li a { font-size: 13px; padding-left: 25px; } .blog_lnks li li li a { font-size: 14px; padding-left: 35px; } .accordion .sub_cat { display: none; } /*---blog details page style -----*/ .comment-section { background: #fff; border: 1px solid #eaeaea; border-radius: 5px; margin-bottom: 20px; padding: 20px; position: relative; } .comment-section .comnt { border-bottom: 1px dashed #ccc; padding: 10px 0; margin-bottom: 10px; } .comment-section .comnt:last-child { border-bottom: 0px; } .comment-section>h2 { color: #414042; font-size: 22px; font-weight: 600; padding-bottom: 10px; border-bottom: 1px solid #e7e7e7; margin-bottom: 10px; } .comment-section .imgbox { background: #fafafa; border: 1px solid #e1e1e1; border-radius: 50%; display: table; float: left; height: 80px; text-align: center; width: 80px; line-height: 74px; overflow: hidden; } .comment-section .imgbox:before { display: none; } .comment-section .imgbox img { vertical-align: middle; min-width: 100%; min-height: 100%; } .comnt-txt { padding: 0 0 0 95px } .comnt-txt>h3 { color: #333; font-size: 18px; font-weight: 600; } .publsh_date { padding-bottom: 8px } .publsh_date>li { color: #a6a6a6; display: inline-block; font-size: 13px; margin: 0 10px 0 0; vertical-align: middle; line-height: 15px; } .publsh_date>li span i { font-size: 15px; line-height: 15px; margin-right: 6px; vertical-align: top } .publsh_date span { line-height: 1.1; } .comnt-txt>p { color: #505050; font-size: 16px; line-height: 24px; padding: 0 0 5px } .add-review { background: #fff; border: 1px solid #eaeaea; border-radius: 3px; margin-top: 10px; padding: 15px; } .add-review h2 { color: #505050; font-size: 22px; padding: 0 0 10px 5px; font-weight: 600; } .add-review .themeBtn { float: right; height: 50px!important; } .reviewTbl { padding: 0 10px } .reviewTbl td { padding: 0 0 10px 10px; width: 50%; position: relative; vertical-align: top; } .reviewTbl td:first-child { padding-left: 0 } .reviewTbl td textarea { height: auto; } .themeBtn { background: var(--first-color); border: 1px solid transparent; border-radius: 3px; color: #fff; display: inline-block; font-size: 14px; margin: 0; padding: 7px 25px; text-transform: uppercase; vertical-align: top; text-align: center; } .themeBtn:hover { background: #333; color: #fff; } .reviewTbl input[type="text"] { height: 50px; padding: 0 10px; } .reviewTbl textarea { padding: 10px; } .reviewTbl .captcha_code { padding-right: 200px!important; } div.captcha { position: absolute; right: 20px; top: 5px; white-space: nowrap; } div.captcha .captcha-img img { height: 40px; } div.captcha .captcha-img { float: left; } div.captcha .refsh-btn { color: #333333; display: inline-block; float: right; font-size: 24px; padding: 0 0 0 10px; } .captcha i.ion-loop { color: #ff3a59; font-size: 25px; } .login_wrapper { background: #f7f7f7; border-radius: 3px; margin: 0 auto; max-width: 700px; position: relative; width: 100%; z-index: 3; padding: 30px; } .login_wrapper .loggin_form { border-collapse: separate; border-spacing: 0 20px; table-layout: fixed; } .login_wrapper .loggin_form td { vertical-align: top; position: relative; } .loggin_form td { padding: 0!important; } .loggin_form .captcha { position: static; margin: 10px 0 0; } .loggin_form div.captcha .refsh-btn { float: none; } .loggin_form input[type="file"] { height: auto; } .loggin_form input { margin: 0!important; } .no_result { text-align: center; padding: 50px 20px; border: 1px solid #e1e1e1; border-radius: 3px; } /*#editor*/ .editor-cms a, .editor-cms a:visited { line-height: normal; color: #333; text-decoration: none; outline: 0; -webkit-transition: all ease .3s; -moz-transition: all ease .3s; -o-transition: all ease .3s; transition: all ease .3s; } .editor-cms a:hover, .editor-cms a:focus, .editor-cms:hover { -webkit-transition: all ease .3s; -moz-transition: all ease .3s; -o-transition: all ease .3s; transition: all ease .3s; } .editor-cms img.scale-with-grid { max-width: 100%; height: auto; } .editor-cms {} .editor-cms h1, .editor-cms h2, .editor-cms h3, .editor-cms h4, .editor-cms h5, .editor-cms h6 { margin: 0 0 .8em; font-weight: 400; line-height: 1.3em; } .editor-cms h5, .editor-cms h6 { margin-bottom: 8px } .editor-cms h1 { font-size: 36px; margin-bottom: 16px } .editor-cms h2 { font-size: 30px; margin-bottom: 14px } .editor-cms h3 { font-size: 28px; margin-bottom: 10px } .editor-cms h4 { font-size: 24px; margin-bottom: 9px } .editor-cms h5 { font-size: 18px } .editor-cms h6 { font-size: 14px } .editor-cms p {} .editor-cms ul, .editor-cms ol { margin: 10px; } .editor-cms ul li { font-size: 15px; margin: 5px 0; padding: 3px 15px; position: relative; } .editor-cms ul li:before { background: #6b6a6a; border-radius: 100%; content: ""; display: block; height: 7px; left: 0px; position: absolute; top: 10px; width: 7px; } .editor-cms table { border: solid 1px #dedddd; border-collapse: collapse; width: 100%; } .editor-cms table th { text-transform: uppercase; background: #f1f0f0; font-size: 14px; color: #545353; font-weight: 600; padding: 15px 20px; border: solid 1px #dedddd; } .editor-cms table td { vertical-align: top; font-size: 14px; color: #545353; font-weight: 400; padding: 15px 20px; border: solid 1px #dedddd; } .editor-cms { color: #999999; } .editor-cms ul { margin: 10px 0; color: #999999; } .editor-cms h4 { text-transform: uppercase; } .editor-cms ol { list-style: decimal; } .editor-cms ol li { position: relative; padding: 0 0 15px 0; color: inherit; margin: 0 0 0 15px; } .editor-cms ol li a { color: inherit; } .editor-cms a:active, .editor-cms a:focus, .editor-cms a:hover, .editor-cms a:link, .editor-cms a:visited { outline: 0; text-decoration: none } .editor-cms .alignleft, .editor-cms .floatleft { float: left; text-align: left } .editor-cms .alignright, .editor-cms .floatright { float: right; text-align: right } .editor-cms .aligncenter { text-align: center; margin: 0 auto; } .editor-cms .align-right { text-align: right } .editor-cms .align-left { text-align: left } .editor-cms .align-center { text-align: center } .alignnone, img.alignnone { /* not sure about this one */ } .editor-cms p img { margin: 0; } .editor-cms p.lead { font-size: 21px; color: #777; } .editor-cms em { font-style: italic; } .editor-cms small { font-size: 80%; } .editor-cms strong, .editor-cms th, .editor-cms thead td { font-weight: 700 } .editor-cms blockquote, .editor-cms blockquote p { font-size: 17px; line-height: 24px; color: #777; font-style: italic; } .editor-cms blockquote { margin: 0 0 20px; padding: 9px 20px 0 19px; border-left: 1px solid #ddd; } .editor-cms blockquote cite { display: block; font-size: 12px; color: #555; } .editor-cms blockquote cite:before { content: "\2014 \0020"; } .editor-cms blockquote cite a, .editor-cms blockquote cite a:visited, .editor-cms blockquote cite a:visited { color: #555; } .editor-cms hr { border: solid #ddd; border-width: 1px 0 0; clear: both; margin: 10px 0 30px; height: 0; } .post .date{ margin-bottom:10px; } .post .date p, .post .date span{ display: inline-block; margin-bottom:0; } /*#editor end*/ /*tablet**/ @media(min-width:768px) and (max-width:990px) { .round_sectn { margin-top: 10px; display: inline-block; width: 100%; vertical-align: top; } } @media(min-width:991px) and (max-width:1050px) { .sectnMiddle { display: block!important; } } /*phone**/ @media(max-width:767px) { body { font-size: 13px; } .round_sectn { margin-top: 10px; display: inline-block; width: 100%; vertical-align: top; } .post_imges img { width: 100%; } .post { margin-bottom: 10px; padding: 10px; } .col_right .themeBtn { margin-top: 10px; padding: 10px 0; } .sectnMiddle { display: none; } .round_sectn>.sectnTop { border-radius: 3px; position: relative; padding: 10px; } .round_sectn>.sectnTop:after { content: "\f217"; font-family: "Ionicons"; position: absolute; color: #fff; top: 6px; right: 13px; font-size: 16px; } .round_sectn>.sectnTop.active:after { content: "\f209" } .round_sectn>.sectnTop h4 { font-size: 14px; } .date { font-size: 16px; width: 42px; margin-right: 10px; margin-bottom: 5px; } .date span { font-size: 12px; padding: 4px 0px; text-align: center; } .cmnt_area { padding-left: 0px; } .title { font-size: 18px; } .cmt-box { display: inline-block; width: 100%; } .post_imges { margin: 10px 0; } .searchform { padding: 0px; } .blog_lnks>li { padding: 10px; } .cmt-box li { border: none; padding-left: 5px; } .content .col_left .cmt-box li .icon { font-size: 15px; } .comment-section { padding: 10px; margin-bottom: 10px; } .comment-section>h2, .add-review h2 { font-size: 19px; padding-bottom: 5px; margin-bottom: 0px; } .add-review { padding: 10px; } .reviewTbl td { display: inline-block; width: 100%; padding-left: 0px; } .post_imges .slider_nav { margin-top: 10px; } .post_imges .slider_nav .slick-next { right: 10px; } .post_imges .slider_nav img { width: 99%; } .post_midlSectn p { font-size: 13px; line-height: 1.4; } .link, .cmt-box li { font-size: 13px; } .date p { line-height: 1; padding: 5px 0; } .login_wrapper { padding: 15px; } .login_wrapper h2 { font-size: 20px; } .siteForm .g-recaptcha { transform: scale(0.88); -webkit-transform: scale(0.88); transform-origin: 0 0; -webkit-transform-origin: 0 0; width: 0; } } /*fsdfdfs*/ .tabhide { display: none; }/* a.link .svg-icn svg { width: 22px; height: 21px; display: block; } */ .kitdetail a.favourite { position: absolute; right: 50px; z-index: 9; top: 100px; } .kitdetail a.link .svg-icn svg { width: 44px; height: 42px; } .kitlist a.favourite { position: absolute; right: 50px; z-index: 9; margin-top: 10px; top: auto; } .kitlist a.link .svg-icn svg { width: 44px; height: 42px; } .favourite.product-list { width: 100%; } .width-auto-important{ width:auto !important;} .no-pointer{cursor: inherit;} /* developer css */ #srch-recipe .size18 { width: 20px; height: 20px; margin: 9px 8px 0px 0; } #srch-recipe .favourite { position: relative; float: right; top: 45px !important; } .over-detail .favourites.active { background-image: url(images/retina/favorite-active.svg); } h3.meal-type .tags, h3.meal-type{color: #626262; font-size: 1em; display: inline-block; margin:0; } h3.meal-type span.lbl{ font-weight: 600; display: inline-block; margin-right:5px; font-size: 1rem; } .product-description h3{ margin-bottom: 10px; } .description{ margin-bottom: 10px; } .product-description .price-fetures { margin: 5px 0 10px; display: block; } .product-description .pro-name{position: relative;} .product-description .pro-name .icon-heading { position: absolute; left: -25px; top: 3px; } .product-list.-meal-detail{ margin-left:-10px; margin-right:-10px; width:100%; } .align-items-center{-webkit-box-align: center;align-items: center;} .d-flex{display: -webkit-box;display: flex;} .product-description .chef-box .avatar{ margin:0; margin-right:10px; width:60px; height:60px; } .product-description .avatar-info .name{font-size:1.2em;display: -webkit-box;display: flex;-webkit-box-align: center;align-items: center;} .product-description .chef-profile{display: -webkit-box;display: flex;-webkit-box-align: center;align-items: center;} .product-description .price-feature--wrapper .btn.btn--large{line-height: 40px; height: 40px; padding: 0 20px; font-size: 1em;} .justify-content-between{-webkit-box-pack: justify;justify-content: space-between;} .product-description .avatar-info{-webkit-box-pack: justify;justify-content: space-between; display: -webkit-box; display: flex; width: calc(100% - 75px); } .product-description span.ratings{margin-left:5px;margin-top:4px;} .product-description .rating-wrapper{display: -webkit-box;display: flex;-webkit-box-align: center;align-items: center;} .product-description .rating-wrapper p{margin-bottom:0;} .product-description .addons-trigger{height:40px;padding: 10px 15px} .product-description .addons-trigger.with-arrows:after{right:15px;} .meal-detail--page .section-headings, .chef-detail--page  .section-headings{margin-bottom: 20px} .product-description .icon--meal-type{display: inline-block;vertical-align: middle;opacity: 0.6;} .product-description .addons-wrapper{margin:0;} .product-description .pro-name.after-border::after { left: 0; } .chef-detail--page .review-for .tag{border-lefT:0;border-right:0;border-top:0;border-radius:0;padding:0;} .flex-wrap{flex-wrap: wrap;} .middle-footer .f-logo img{margin: auto;} .page-banner .banner-txt h1{margin-bottom:30px;} .product-grid-item .product-content{min-height:40px;} @media screen and (max-width:1024px){ .flex-lg--col{-webkit-box-orient: vertical;-webkit-box-direction: normal;flex-direction: column;-webkit-box-align: start;align-items: flex-start;} } @media screen and (max-width:767px){ .product-description .pro-name .icon-heading { position: absolute; top: 1px; left: 0; } .product-description .pro-name span.txt{ padding-left: 25px; } .product-description .pro-name.after-border::after { left: 25px; } } .block-ele .tbl-actions a{margin-bottom:3px;margin-right:3px;} .ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year{line-height: 30px!important;} input[type="radio"][disabled], input[type="checkbox"][disabled], input[type="text"][disabled], input[type="password"][disabled]{opacity: 1!important;} .magicsearch-wrapper .multi-item{padding-right: 17px!important;height:35px!important;padding-left:2px!important;} .irs{margin-top: -20px;} .magicsearch-wrapper .multi-item-close{top:10px!important;} .pop-model-box .model-box-content .pop-up-data {max-height: 90vh!important;} .magicsearch-wrapper .magicsearch-arrow{display: block!important; top: 18px!important} .meal-recipe-slider .slick-prev{left: 24.8%;margin-left:0;} .meal-recipe-slider .slick-next{right: 24.8%;margin-right: 0;} .weekly-slider .slick-next{right: 31.5%;margin-right: 0;} .weekly-slider .slick-prev{left: 31.5%;margin-left: 0;} .chef-profile{display: -webkit-box;display: flex;-webkit-box-align: center;align-items: center;} .ingredients-listing ul{display: -webkit-box;display: flex;flex-wrap: wrap;-webkit-box-align: center;align-items: center;-webkit-box-pack: start;justify-content: flex-start;} .ingredients-listing li{-webkit-box-align: center;align-items: center;display: -webkit-box;display: flex;} @supports (-ms-ime-align:auto) { .registration-page::before, .registration-page::after{ display: none; } .registration-page #header, .copyright-reg{background-color:var(--second-color);} } @media screen and (max-width:1599px){ .shopping-cart-table .select-small.date { width: 200px; } } @media screen and (max-width:1440px){ .container--cms{padding: 0 10px;} .middle-footer .row div:last-child .f-links{padding-left:25px;} } @media screen and (max-width:1299px){ .middle-footer .row div:first-child .f-links{padding-left:25px;} } @media screen and (max-width:1199px){ .middle-footer .row div:first-child .f-links {padding-left: 15px;} } @media screen and (max-width:1099px){ .middle-footer .row div:first-child .f-links {padding-left: 0px;} } @media screen and (max-width:1025px){ .middle-footer .row div:last-child .f-links {padding-left: 10px;} } @media screen and (max-width:991px){ .middle-footer .row div:last-child .f-links {padding-left: 0px;} .weekly-slider .slick-prev { left: 50px; margin-left: 0; } .weekly-slider .slick-next { right: 50px; margin-right: 0; } } @media screen and (max-width:767px){ .dashboard-wrapper .fav_radio { text-align: left; } .fav-list-opt li:first-child{margin-left:0;} .trans--table table tr.hide--mobile {display: block!important;} .chef-profile{-webkit-box-orient: vertical;-webkit-box-direction: normal;flex-direction: column;} } @media screen and (max-width:575px){ .product-description .avatar-info .name{-webkit-box-orient: vertical;-webkit-box-direction: normal;flex-direction: column;text-align: left;-webkit-box-align: start;align-items: flex-start;} .product-description span.ratings{margin-left:0;} .product-description .chef-box .avatar{margin-right: 5px;} .table tr td .addon-name{display: block;text-align: left;} .table tr td a.button, .status{display: block;} } @media screen and (max-width:480px){ .table{display: table;} }