/* Text Domain: templateforest */ /** * 1.0 - Reset */ html { font-family: sans-serif; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; scroll-behavior: smooth; } body { margin: 0; background:#fcfcfc; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; } body.no-hidden { overflow: auto; } *:focus { outline: none; } *::-moz-focus-inner { border: 0; } .notransition * { -webkit-transition: none !important; -moz-transition: none !important; -o-transition: none !important; -ms-transition: none !important; transition: none !important; } table, th, td { border:none; } table { border-collapse: separate; border-spacing: 0; border-width: 1px 0 0 1px; margin: 0 0 1.75em; table-layout: fixed; /* Prevents HTML tables from becoming too wide */ width: 100%; } caption, th, td { font-weight: normal; text-align: left; font-size: 13px; } th { border-width: 0 1px 1px 0; font-weight: 700; } td { border-width: 0 1px 1px 0; } th, td { padding: 0.4375em; } /* * data tables */ .table { width: 100%; max-width: 100%; margin-bottom: 0px; } thead { border-bottom: 1px solid #d0d0d0; } .table > thead > tr > th { vertical-align: bottom; border-bottom: 2px solid #ddd; } .table > caption + thead > tr:first-child > th, .table > colgroup + thead > tr:first-child > th, .table > thead:first-child > tr:first-child > th, .table > caption + thead > tr:first-child > td, .table > colgroup + thead > tr:first-child > td, .table > thead:first-child > tr:first-child > td { border-top: 0; } .thumb{ width:55px; } /* Placeholder text color -- selectors need to be separate to work. */ ::-webkit-input-placeholder { color: #454545; font-family: 'Open Sans', sans-serif; } textarea.form-control { height: auto; resize: vertical; margin-top: 10px; min-height: 100px; } :-moz-placeholder { color: #454545; font-family: 'Open Sans', sans-serif; } ::-moz-placeholder { color: #454545; font-family: 'Open Sans', sans-serif; opacity: 1; /* Since FF19 lowers the opacity of the placeholder by default */ } :-ms-input-placeholder { color: #454545; font-family: 'Open Sans', sans-serif; } .align-left { text-align: left !important; } .align-right { text-align: right !important; } .align-center { text-align: center !important; } ul, ol { margin-top: 0; margin-bottom: 10px; padding-left: 0px; } .section { padding: 60px 0; } /*2.0 =WordPress Core -------------------------------------------------------------- */ .alignnone { margin: 5px 20px 20px 0; } .aligncenter, div.aligncenter { display: block; margin: 5px auto 5px auto; } .alignright { float:right; margin: 5px 0 20px 20px; } .alignleft { float: left; margin: 5px 20px 20px 0; } a img.alignright { float: right; margin: 5px 0 20px 20px; } a img.alignnone { margin: 5px 20px 20px 0; } a img.alignleft { float: left; margin: 5px 20px 20px 0; } a img.aligncenter { display: block; margin-left: auto; margin-right: auto; } /* * 3.0 Typography */ a{ font-family: 'Open Sans', sans-serif; text-decoration:none; color:#262626; } a:hover, a:focus{ text-decoration:none; outline:none; } body, button, input, select, textarea { color: #454545; font-family: 'Open Sans', sans-serif; font-size: 14px; font-weight: 400; line-height: 16px; } h1, h2, h3, h4, h5, h6 { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; clear: both; line-height:normal; } h1:first-child, h2:first-child, h3:first-child, h4:first-child, h5:first-child, h6:first-child { padding-top: 0; margin-top:0; } h1 { font-size: 28px; font-weight: 300; } h2, .home.blog .entry-title { color: #666; font-size: 24px; font-weight: 300; } h3 { color: #454545; font-size: 20px; font-weight: 300; } h4 { color: #454545; font-size: 16px; font-weight: 400; } h5 { color: #767676; font-size: 16px; font-weight: 400; letter-spacing: 0.15em; text-transform: uppercase; } h6 { color: #454545; font-size: 14px; font-weight: 400; } p { margin: 0 0 1.5em; padding: 0; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size:14px; line-height: 24px; } dfn, cite, em, i { font-style: italic; } blockquote { color: #666; font-size: 18px; font-size: 1.125rem; font-style: italic; line-height: 1.7; margin: 0; overflow: hidden; padding: 0; } blockquote cite { display: block; font-style: normal; font-weight: 600; margin-top: 0.5em; } address { margin: 0 0 1.5em; } pre { background: #eee; font-family: 'Open Sans', sans-serif; font-size: 15px; font-size: 0.9375rem; line-height: 1.6; margin-bottom: 1.6em; max-width: 100%; overflow: auto; padding: 1.6em; } code, kbd, tt, var { font-family: 'Open Sans', sans-serif; font-size: 15px; font-size: 0.9375rem; } abbr, acronym { border-bottom: 1px dotted #666; cursor: help; } mark, ins { background: #eee; text-decoration: none; } big { font-size: 125%; } blockquote { quotes: "" ""; } q { quotes: "“" "”" "‘" "’"; } blockquote:before, blockquote:after { content: ""; } :focus { outline: none; } /*-------------------------------------------------------------- 4.0 Forms --------------------------------------------------------------*/ label { color: #454545; display: block; font-weight: 600; margin-bottom: 0.5em; } fieldset { margin-bottom: 1em; } input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="number"], input[type="tel"], input[type="range"], input[type="date"], input[type="month"], input[type="week"], input[type="time"], input[type="datetime"], input[type="datetime-local"], input[type="color"], textarea { color: #666; background: #fff; background-image:none; border: 1px solid #bbb; border-radius: 3px; display: block; padding:10px; width: 100%; box-shadow:none; font-family: 'Open Sans', sans-serif; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; } .form-control{ height:36px; font-weight: 500; } input[type="text"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="number"]:focus, input[type="tel"]:focus, input[type="range"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="week"]:focus, input[type="time"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="color"]:focus, textarea:focus { color: #222; box-shadow:none; } select { border: 1px solid #bbb; height: 3em; max-width: 100%; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; } input[type="radio"], input[type="checkbox"] { margin-right: 0.5em; } input[type="radio"] + label, input[type="checkbox"] + label { font-weight: 400; } button, input[type="button"], input[type="submit"] { background-color:#00AEEF; border:1px solid #00AEEF; padding:8px; text-transform:capitalize; color: #fff; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; } input + button, input + input[type="button"], input + input[type="submit"] { } button.secondary, input[type="reset"], input[type="button"].secondary, input[type="reset"].secondary, input[type="submit"].secondary { background-color: #ddd; color: #222; } button:hover, button:focus, input[type="button"]:hover, input[type="button"]:focus, input[type="submit"]:hover, input[type="submit"]:focus { } button.secondary:hover, button.secondary:focus, input[type="reset"]:hover, input[type="reset"]:focus, input[type="button"].secondary:hover, input[type="button"].secondary:focus, input[type="reset"].secondary:hover, input[type="reset"].secondary:focus, input[type="submit"].secondary:hover, input[type="submit"].secondary:focus { } /* * bootstrap overite */ .alert { padding: 10px; margin-bottom: 10px; border: 1px solid transparent; border-radius: 4px; } /* Placeholder text color -- selectors need to be separate to work. */ ::-webkit-input-placeholder { color: #454545; font-family: 'Open Sans', sans-serif; } :-moz-placeholder { color: #454545; font-family: 'Open Sans', sans-serif; } ::-moz-placeholder { color: #454545; font-family: 'Open Sans', sans-serif; opacity: 1; /* Since FF19 lowers the opacity of the placeholder by default */ } :-ms-input-placeholder { color: #454545; font-family: 'Open Sans', sans-serif; } /** * 5.0 Buttons */ .btn { display: inline-block; margin-bottom: 0; font-size: 14px; padding: 6px 12px; font-weight: 500; letter-spacing: 1px; line-height: 1.42857143; text-align: center; white-space: nowrap; vertical-align: middle; -ms-touch-action: manipulation; touch-action: manipulation; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-image: none; border: 1px solid transparent; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; -webkit-transition:ease-in-out .2s; -moz-transition:ease-in-out .2s; -ms-transition:ease-in-out .2s; -o-transition:ease-in-out .2s; transition:ease-in-out .2s; } .btn.active.focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn:active:focus, .btn:focus { outline:none; outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; } .btn-default { color: #454545; background-color: #fff; border-color: #ccc; } .btn-default:hover { color: #454545; background-color: #e6e6e6; border-color: #adadad; } .btn-primary { color: #fff; background-color: #db3742; border-color: #db3742; } .btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open > .dropdown-toggle.btn-primary { color: #fff; background-color: #262626; border-color: #262626; -webkit-transition:ease-in-out .2s; -moz-transition:ease-in-out .2s; -ms-transition:ease-in-out .2s; -o-transition:ease-in-out .2s; transition:ease-in-out .2s; } .btn-success { color: #fff; background-color: #5cb85c; border-color: #5cb85c; } .btn-success:hover { color: #fff; background-color: #449d44; border-color: #449d44; } .btn-info { color: #fff; background-color:transparent; border-color: #ccc; } .btn-info:hover { } .btn-warning { color: #fff; background-color: #f0ad4e; border-color: #f0ad4e; } .btn-warning:hover { color: #fff; background-color: #ec971f; border-color: #ec971f; } .btn-link, .btn-link:active, .btn-link:focus, .btn-link:hover { border-color: transparent; } .btn-link, .btn-link.active, .btn-link:active, .btn-link[disabled], fieldset[disabled] .btn-link { background-color: transparent; -webkit-box-shadow: none; -moz-box-shadow: none; -ms-box-shadow: none; -o-box-shadow: none; box-shadow: none; } .btn-link { font-weight: 400; color: #337ab7; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; border-radius: 0; } .btn-group-lg>.btn, .btn-lg { padding: 10px 16px; font-size: 18px; line-height: 1.3333333; border-radius: 4px; } .btn-group-sm>.btn, .btn-sm { padding: 10px 20px; font-size: 14px; line-height: 1.5; border-radius: 3px; } .btn-group-xs>.btn, .btn-xs { padding: 1px 5px; font-size: 12px; line-height: 1.5; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; -o-border-radius: 3px; border-radius: 3px; } .btn-outline { background-color: transparent; color: inherit; transition: all .5s; } .btn:focus, .btn:active:focus, .btn.active:focus { outline: 0 none; } .btn-primary.disabled, .btn-primary.disabled.active, .btn-primary.disabled.focus, .btn-primary.disabled:active, .btn-primary.disabled:focus, .btn-primary.disabled:hover, .btn-primary[disabled], .btn-primary[disabled].active, .btn-primary[disabled].focus, .btn-primary[disabled]:active, .btn-primary[disabled]:focus, .btn-primary[disabled]:hover, fieldset[disabled] .btn-primary, fieldset[disabled] .btn-primary.active, fieldset[disabled] .btn-primary.focus, fieldset[disabled] .btn-primary:active, fieldset[disabled] .btn-primary:focus, fieldset[disabled] .btn-primary:hover{ opacity:.65; -webkit-transition:ease-in-out .2s; -moz-transition:ease-in-out .2s; -ms-transition:ease-in-out .2s; -o-transition:ease-in-out .2s; transition:ease-in-out .2s; } .btn.disabled, .btn[disabled], fieldset[disabled] .btn { pointer-events: none; cursor: not-allowed; filter: alpha(opacity=65); -webkit-box-shadow: none; box-shadow: none; opacity: .65; } .btn-info.active, .btn-info.focus, .btn-info:active, .btn-info:focus, .btn-info:hover, .open>.dropdown-toggle.btn-info{ color:#ffffff; background-color:#00AEEF; border-color:#00AEEF; } /* * header styles */ .container{ max-width: 1400px; width: 1300px; } .top-header{ background: #ffffff; padding: 15px 0; } .top-header .theme-logo{ width:190px; height: auto; margin-top: 13px; } .theme-logo{ float: left; } .top-right-nav{ float: right; position: relative; } .top-header .theme-logo img{ width: 100%; height: auto; } .top-nav{ margin-bottom: 0; margin-top: 0px; } .top-nav li { list-style-type: none; display: inline-block; margin-left: 30px; } .top-nav li a{ color: #808080; font-size: 14px; opacity: 1; -webkit-transition: opacity 0.2s cubic-bezier(0.39, 0.575, 0.565, 1); transition: opacity 0.2s cubic-bezier(0.39, 0.575, 0.565, 1); vertical-align: middle; font-weight: 600; -webkit-transition:ease-in-out .2s; -moz-transition: ease-in-out .2s; transition: ease-in-out .2s; } .top-nav li a:hover{ opacity: 1; color: #db3742; vertical-align: middle; -webkit-transition:ease-in-out .2s; -moz-transition: ease-in-out .2s; transition: ease-in-out .2s; } .top-nav li a .grid-icon, .top-nav li a .cart-icon{ display: inline-block; } .top-nav li a .cart-icon img{ width: 18px; position: relative; top: -2px; } .top-nav li a .grid-icon img{ position: relative; top: -2px; width:14px; } .top-nav li ul{ width: 160px; position: absolute; background:#db3742; margin-top: 10px; opacity: 0; right: 0; visibility: hidden; -webkit-transition: ease-in-out .2s; -moz-transition: ease-in-out .2s; -ms-transition: ease-in-out .2s; transition: ease-in-out .2s; } .top-nav li:hover ul{ margin-top: 0px; opacity: 1; visibility: visible; -webkit-transition: ease-in-out .2s; -moz-transition: ease-in-out .2s; -ms-transition: ease-in-out .2s; transition: ease-in-out .2s; } .top-nav li ul li{ display: block; margin-left: 15px; } .top-nav li ul li a{ line-height: 30px; color: #fff; } .top-nav li ul li a:hover{ color: #fff!important; } .for-home{ display: none; } .home-page .for-home{ display: block; } .home-page .not-home{ display: none; } .category-menu{ background: #f3f3f3; border-bottom: 1px solid #e8e8e8; } .category-menu ul{ margin-bottom: 0; text-align: center; } .category-menu ul li{ list-style-type: none; display: inline-block; } .category-menu ul li a{ display: block; text-align: center; padding: 16px 20px; font-weight: 600; border-radius: 30px; font-size: 13px; margin-left: 0px; margin-right: 0px; text-decoration: none; color: #454545; text-transform: uppercase; transition: background .2s; } .category-menu ul li.active a, .category-menu ul li a:hover{ color:#db3742; } .caret{ display: inline-block; width: 0; height: 0; margin-left: 2px; vertical-align: middle; border-top: 4px dashed; border-top: 4px solid \9; border-right: 4px solid transparent; border-left: 4px solid transparent; } /* * banner styles */ #banner-slider img{ width:100%; } .search-form-banner { position: absolute; width: 70%; background: rgba(0,0,0,.5); padding: 20px 25px; margin: -250px auto 0; left: 0; right: 0; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; } .form-wrap h1 { color: #fff; font-size: 24px; font-weight: 600; text-align: center; } .select { margin: 0 auto 0 0; width: 100%; color: #939598; vertical-align: middle; text-align: left; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; } .select, .select .placeholder { position: relative; border-radius: 3px; display: block; } .select .placeholder { background-color: #fff; z-index: 1; color: grey; padding: 12px; font-size: 14px; cursor: pointer; line-height: 14px; } .select ul { display: none; position: absolute; overflow: hidden; width: 100%; background: #F7F7F7; max-height: 186px; overflow-y: scroll; top: 100%; left: 0; list-style: none; margin: 0; padding: 0; z-index: 100; transition: ease-in-out .2s; } .select ul li { display: block; text-align: left; padding: .8em 1em; color: #000; font-size: 13px; cursor: pointer; transition: ease-in-out .2s; } #location { padding-right: 34px; border: 1px solid #fff; border-radius: 4px; } .search-form-banner .location-icon { position: absolute; z-index: 9; font-size: 16px; margin-top: 0; color: #333; cursor: pointer; top: 11px; right: 20px; } .select .placeholder:after { position: absolute; right: 1em; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); font-family: FontAwesome; content: '\f078'; z-index: 10; -moz-transition: ease-in-out .2s; -ms-transition: ease-in-out .2s; -o-transition: ease-in-out .2s; transition: ease-in-out .2s; } .select.is-open .placeholder:after { content: '\f077'; } .select.is-open ul { display: block; } button, input[type=button], input[type=submit] { background-color: #db3742; border: 0; -webkit-border-radius: 2px; border-radius: 2px; -webkit-box-shadow: none; box-shadow: none; color: #fff; cursor: pointer; display: inline-block; font-size: 14px; font-weight: 600; line-height: 1; padding: 14px; text-shadow: none; -webkit-transition: background .2s; transition: background .2s; } .btn_submit{ width: 100% !important; line-height: 14px !important; padding: 12px !important; } .form-wrap .col-md-7, .form-wrap .col-md-2, .form-wrap .col-md-{ padding-left: 8px; padding-right: 8px; } .app-link { text-align: center; margin-top: 10px; } /* * welcome section */ .section-header{ text-align: center; } .section-header h3, .section-header h2, .section-header h4, .section-header h1{ position: relative; font-size: 28px; } .section-header h3:before, .section-header h2:before, .section-header h4:before, .section-header h1:before{ content: ''; height: 13px; width: 142px; background: url(https://ebeautician.co.uk/resources/images/heading-art-01.svg); display: block; opacity: 0.5; text-align: center; margin-left: auto; margin-right: auto; margin-top: 20px; position: absolute; bottom: -25px; left: 0; right: 0; } #welcome-section{ background: url(https://ebeautician.co.uk/resources/images/features-bg.jpg); background-size: cover; background-position: top; padding: 50px 0; min-height: 400px; background-position-y: -60px; } .our-service{ margin-top: 90px; } .service-wrap{ border: 1px solid #db374261; border-radius: 3px; padding: 20px; background: #ffffff; -webkit-transition:ease-in-out .5s; -moz-transition: ease-in-out .5s; transition: ease-in-out .5s; } .service-wrap:hover{ border: 1px solid #db374261; border-radius: 3px; padding: 20px; background: #db3742; -webkit-transition:ease-in-out .5s; -moz-transition: ease-in-out .5s; transition: ease-in-out .5s; } .service-wrap .icon-list { box-sizing: initial; width: 24px; height: 24px; font-size: 26px; margin: 0 auto; background-color: #db3742; padding: 18px; transform: translateY(-85%); box-shadow: 0 0 0 5px #ffffff, 0 0 0 6px #db374261; border-radius:40px; -webkit-transition: all 0.8s cubic-bezier(0, 0.41, 0.18, 0.9); -moz-transition: all 0.8s cubic-bezier(0, 0.41, 0.18, 0.9); transition: all 0.8s cubic-bezier(0, 0.41, 0.18, 0.9); color: #fff; } .service-wrap p{ text-align: center; font-size: 14px; } .service-wrap:hover .icon-list-icon { background-color: #db374261; color: #fff; border-radius: 40px; } .service-wrap h3 { font-size: 20px; position: relative; margin-bottom: 35px; text-transform: uppercase; text-align: center; margin-top: 0; font-weight: 600; } .service-wrap h3:after { content: ''; position: absolute; height: 2px; width: 80px; background-color: #db374261; left: 50%; bottom: -12px; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); -webkit-transition: width 0.35s ease-out; -moz-transition: width 0.35s ease-out; transition: width 0.35s ease-out; } .service-wrap:hover h3, .service-wrap:hover p { color:#fff; -webkit-transition:ease-in-out .5s; -moz-transition: ease-in-out .5s; transition: ease-in-out .5s; } .service-wrap:hover h3:after{ background-color: #db374261; } /* * our ecpert beautician */ #our-expert-beautician{ padding:50px 0; background:#f3f3f3; } .beautician-detail{ text-align: center; padding: 20px; } .beautician-detail .beautician-name{ font-size: 20px; font-weight: 500; margin-bottom: 10px; } .beautician-wrap{ background:#ffffff; } .beautician-wrap img{ width:100%; -webkit-transition:ease-in-out .2s; -moz-transition: ease-in-out .2s; transition: ease-in-out .2s; } .beautician-detail ul{ margin-bottom: 0; } .beautician-detail ul li{ display: inline-block; position: relative; margin: 12px; list-style-type: disc; font-weight: 600; } .beautician-detail ul li:before{ content: ''; position: absolute; height: 5px; width: 5px; background: #db3742; top: 6px; left: -14px; } .beauticians-wrap{ margin-top: 75px; } .beautician-wrap figure{ position: relative; overflow: hidden; } .beautician-wrap:hover img{ transform: scale(1.3); -webkit-transition:ease-in-out .2s; -moz-transition: ease-in-out .2s; transition: ease-in-out .2s; } /* * feature click */ #customer-beautician-features{ padding: 60px 0; text-align: center; } .btn-feature-click{ background:#db3742; color: #fff; } /* * trustable section */ #trustabale-section{ border-top: 1px solid #f3f3f3; padding: 50px 0; background: url(https://ebeautician.co.uk/resources/images/features-bg.jpg); background-size: cover; } #trustabale-section p{ margin-bottom: 0; font-size: 14px; font-weight: 400; margin-top: 40px; } .counter-wrap{ margin-top: 50px; } .c-wrap{ padding: 20px; text-align: center; background: #fff; border: 1px solid #f3f3f3; border-radius: 4px; } #trustabale-section .c-wrap p{ font-size: 30px; font-weight: 600; color: #db3742; margin-top: 25px; } .c-wrap h3{ margin-top: 15px; font-size: 16px; text-transform: uppercase; } /* * news letter */ #news-letter{ background: url(https://ebeautician.co.uk/resources/images/newsletter-bg.jpg); background-size: cover; background-position: center; padding: 80px 0; } #news-letter h2{ color: #fff; margin-bottom: 8px; } #news-letter p{ margin-bottom: 0; color: #f3f3f3; line-height: 18px; font-size: 13px; } #news-letter .sub-email { width: 260px; border-radius: 0; display: inline-block; } #news-letter .btn { padding: 8px 20px; position: relative; border-radius: 0; top: -1px; left: -5px; } .news-letter-form{ margin-top: 10px; } /* * page salon registration */ #salon-registration{ background:url(https://venuesnearme.co.uk/resources/uploads/marriage-918864_1920.jpg); background-size: cover; background-position: top; } .salon-overlay{ padding: 80px 0; /*min-height: 400px;*/ background: rgba(255,255,255,.85); } .salon-overlay .container{ /*width: 1050px;*/ } #saloon_signup_form{ margin-top: 40px; } #saloon_signup_form label { color: #333; font-weight: 600 !important; } #saloon_signup_form .form-control{ border-radius: 0; margin-bottom: 12px; } #registerwrap .section-header h1{ font-size: 20px; } .points ul li h3 { font-size: 20px; margin-bottom: 5px; font-weight: 500; } .points ul li p { font-size: 13px; line-height: 18px; } .points ul li { position: relative; display: block; list-style-type: none; background-size: 24px; padding-left:50px; font-size: 18px; margin-bottom: 10px; background-position-y: 6px; } .points ul li:before{ content: "\f274"; display: block; font-size: 20px; font-family: FontAwesome; position: absolute; margin-left: -27px; margin-top: 3px; color: #db3742; } .plan-details{ text-align: center; padding: 20px; padding-bottom: 0px; margin-bottom: 20px; font-size: 14px; line-height: 20px; } .plan-wrap{ min-height: 300px; background:#f3f3f3; border-radius: 6px; padding-bottom: 20px; overflow: hidden; text-align: center; } .plan-title{ padding: 20px 10px; background: #db3742; border-top-left-radius: 6px; border-top-right-radius: 6px; text-align: center; } .plan-title h4{ color: #fff; font-size: 18px; text-transform: capitalize; line-height: 22px; font-weight: 600; margin-bottom: 0px; } .prices { font-size: 36px; font-weight: 600; color: #fff; padding-right: 5px; } .time-span { color: #e8e8e8; text-transform: uppercase; font-size: 12px; font-weight: 500; } .rates{ margin-top: 25px; } .plan-details{ text-align: center; padding:20px; padding-bottom: 0px; } .plan-details ul{ padding-left: 0; } .plan-details ul li{ display: block; list-style-type: none; font-size: 13px; margin-bottom: 15px; border-bottom: 1px solid #fff; padding-bottom: 16px; line-height: 18px; } .plan-details ul li:nth-last-child(1){ border-bottom:none; } .plan-details ul li i{ color: #db3742; } .btn-activate-plan{ display: block; margin-right: 20px; margin-left: 20px; } .currently-active{ display: block; padding: 10px; background: #8BC34A; position: relative; width: 100%; bottom: -20px; text-align: center; color: #fff; } .plan-title.active-plan { background: #8BC34A; } .plan-expiry{ text-align: center; display: block; color: #db3742; } #saloon_signup_form{ margin-top: 40px; } #saloon_signup_form label { color: #333; font-weight: 600 !important; } #saloon_signup_form .form-control{ border-radius: 0; margin-bottom: 12px; } #registerwrap .section-header h1{ font-size: 20px; } .points ul li h3 { font-size: 20px; margin-bottom: 5px; font-weight: 500; } .points ul li p { font-size: 13px; line-height: 18px; } .points ul li { position: relative; display: block; list-style-type: none; background-size: 24px; padding-left:50px; font-size: 18px; margin-bottom: 10px; background-position-y: 6px; } .points ul li:before{ content: "\f274"; display: block; font-size: 20px; font-family: FontAwesome; position: absolute; margin-left: -27px; margin-top: 3px; color: #D3004F; } .plan-wrap{ min-height: 300px; background:#f3f3f3; border-radius: 6px; padding-bottom: 20px; margin-bottom: 30px; overflow: hidden; text-align: center; } .plan-title{ padding:30px 10px 10px 10px; background: #db3742; border-top-left-radius: 6px; border-top-right-radius: 6px; text-align: center; } .plan-title h5{ margin: 0px; color: #fff; text-transform: none; font-weight: 400; margin-top: 8px; } .plan-title h4{ color: #fff; font-size: 18px; text-transform: capitalize; line-height: 22px; font-weight: 600; margin-bottom: 0px; } .prices { font-size: 20px; font-weight: 600; color: #fff; padding-right: 5px; } .time-span { color: #e8e8e8; text-transform: uppercase; font-size: 12px; font-weight: 500; } .plan-details ol li { font-size: 14px; line-height: 20px; margin-bottom: 10px; } .plan-details .panel-group .panel{ background: none; } .wrap { width: 110px; height: 200px; position: absolute; top: -5px; left: 10px; overflow: hidden; border-radius: 10px; } .pricing-content #accordion .panel-title a:after, .pricing-content #accordion .panel-title a.collapsed:after { content: "\f068"; font-family: "FontAwesome"; font-weight: 900; width: 25px; height: 25px; line-height: 24px; border-radius: 50%; background: #ffffff; text-align: center; font-size: 12px; color: #d3004f; border: 2px solid #808080; position: absolute; top: 5px; left: -15px; transition: all 0.3s ease 0s; padding: 0px; } .pricing-content #accordion .panel-title a.collapsed:after{ content: "\f067"; } .pricing-content #accordion .panel-title a:hover:after, .pricing-content #accordion .panel-title a.collapsed:hover:after{ transform: rotate(360deg); } .pricing-content .panel-default > .panel-heading { color: #333; background-color: #f5f5f5; border-color: #ddd; position: relative; padding:7px 10px; } /* .wrap:before { width: 40px; height: 8px; right: 100px; background: #4D6530; border-radius: 8px 8px 0px 0px; } */ /* .wrap:after { width: 8px; height: 40px; right: 0px; top: 100px; background: #4D6530; border-radius: 0px 8px 8px 0px; } */ .ribbon6 { width: 145px; height: 40px; line-height: 14px; position: absolute; top: 10px; left: -45px; z-index: 2; overflow: hidden; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); border: 1px dashed; box-shadow: 0 0 0 3px #ffc107, 0px 21px 5px -18px rgba(0,0,0,0.6); background: #ffc107; text-align: center; color: #fff; text-align: center; font-size: 14px; padding: 4px; } .ribbon6 span{ font-size:12px; margin-left: 0px; } .rates{ margin-top: 25px; } .plan-details{ text-align: center; padding:0 20px; padding-bottom: 0px; } .rates { position: absolute; right: 35px; top: 10px; margin-top: 0; } .panel-title{ font-size: 14px; } .plan-details ul{ padding-left: 0; } .plan-details ul li{ display: block; list-style-type: none; font-size: 14px; margin-bottom: 15px; border-bottom: 1px solid #fff; padding-bottom: 16px; } .plan-details ul li:nth-last-child(1){ border-bottom:none; } .plan-details ul li i{ color: #d3004f; } .btn-activate-plan{ display: block; margin-right: 20px; margin-left: 20px; padding: 8px; } .currently-active{ display: block; padding: 10px; background: #8BC34A; position: relative; width: 100%; bottom: -20px; text-align: center; color: #fff; } .plan-title.active-plan { background: #8BC34A; } .plan-expiry{ text-align: center; display: block; color: #d3004f; } /*form styles*/ #msform { width: 100%; margin: 50px auto; text-align: center; position: relative; } #msform fieldset { background: white; border: 0 none; border-radius: 3px; box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.4); padding: 20px 30px; box-sizing: border-box; width: 80%; margin: 0 10%; /*stacking fieldsets above each other*/ position: relative; } /*Hide all except first fieldset*/ #msform fieldset:not(:first-of-type) { display: none; } /*inputs*/ #msform input, #msform textarea { padding: 15px; border: 1px solid #ccc; border-radius: 3px; margin-bottom: 10px; width: 100%; box-sizing: border-box; color: #2C3E50; font-size: 13px; } /*buttons*/ #msform .action-button { width: 100px; background: #db3742; font-weight: bold; color: white; border: 0 none; border-radius: 1px; cursor: pointer; padding: 10px 5px; margin: 10px 5px; } #msform .action-button:hover, #msform .action-button:focus { box-shadow: 0 0 0 2px white, 0 0 0 3px #db3742; } /*headings*/ .fs-title { font-size: 15px; text-transform: uppercase; color: #2C3E50; margin-bottom: 30px; } .fs-subtitle { font-weight: normal; font-size: 13px; color: #666; margin-bottom: 20px; } /*progressbar*/ #progressbar { margin-bottom: 30px; overflow: hidden; /*CSS counters to number the steps*/ counter-reset: step; } #progressbar li { list-style-type: none; color: #454545; text-transform: uppercase; font-size: 9px; width: 33.33%; float: left; position: relative; } #progressbar li:before { content: counter(step); counter-increment: step; width: 20px; line-height: 20px; display: block; font-size: 10px; color: #333; background: #ccc; border-radius: 3px; margin: 0 auto 5px auto; z-index: 11; position: relative; } /*progressbar connectors*/ #progressbar li:after { content: ''; width: 100%; height: 2px; background: #ccc; position: absolute; left: -50%; top: 9px; z-index: 0; /*put it behind the numbers*/ } #progressbar li:first-child:after { /*connector not needed before the first step*/ content: none; } /*marking active/completed steps green*/ /*The number of the step and the connector before it = green*/ #progressbar li.active:before, #progressbar li.active:after{ background: #db3742; color: white; } .salon-overlay { padding: 20px 0; /* min-height: 400px;*/ background: #fff; } .row-field-capacity .form-control{ padding-left: 34px !important; } .row-field-capacity .field-standing{ background: url(https://www.venuesnearme.co.uk/resources/icons/persons.png) no-repeat #fff; background-size: 22px; background-position-x: 5px; background-position-y: 6px; } .row-field-capacity .field-seated{ background: url(https://www.venuesnearme.co.uk/resources/icons/chairs.png) no-repeat #fff; background-size: 22px; background-position-x: 5px; background-position-y: 6px; } .row-field-capacity .field-classes{ background: url(https://www.venuesnearme.co.uk/resources/icons/classes.png) no-repeat #fff; background-size: 22px; background-position-x: 5px; background-position-y: 6px; } .row-field-capacity .field-theater{ background: url(https://www.venuesnearme.co.uk/resources/icons/theater.png) no-repeat #fff; background-size: 22px; background-position-x: 5px; background-position-y: 6px; } .row-field-capacity .field-banquet{ background: url(https://www.venuesnearme.co.uk/resources/icons/banquet.png) no-repeat #fff; background-size: 22px; background-position-x: 5px; background-position-y: 6px; } .row-field-capacity .field-conference{ background: url(https://www.venuesnearme.co.uk/resources/icons/conference.png) no-repeat #fff; background-size: 22px; background-position-x: 5px; background-position-y: 6px; } .row-field-capacity .field-u-shape{ background: url(https://www.venuesnearme.co.uk/resources/icons/u-shape.png) no-repeat #fff; background-size: 22px; background-position-x: 5px; background-position-y: 6px; } .row-field-capacity .field-area{ background: url(https://www.venuesnearme.co.uk/resources/icons/area.png) no-repeat #fff; background-size: 22px; background-position-x: 5px; background-position-y: 6px; } .styled-checkbox+label:before { content: ''; margin-right: 10px; display: inline-block; vertical-align: text-top; width: 20px; height: 20px; background: #fff; border: 1px solid #ccc; } .styled-checkbox:checked+label:before, .styled-checkbox:hover+label:before { background: #fd4851; border: 1px solid #fd4851; } .styled-checkbox:checked+label:after { content: ''; position: absolute; left: 5px; top: 9px; background: #fff; width: 3px; height: 3px; box-shadow: 2px 0 0 #fff, 4px 0 0 #fff, 4px -2px 0 #fff, 4px -4px 0 #fff, 4px -6px 0 #fff, 4px -8px 0 #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg); } .amenities h6:before { content: ''; width: 40px; height: 2px; background-color: #db3742; position: absolute; z-index: 99; bottom: -6px; } .amenities{ text-align: left; margin-bottom: 20px; } .amenities label{ font-size: 13px; } .amenities h6{ margin-bottom: 20px; position: relative; } #add-venue-service-form textarea.form-control { height: 100px; resize: inherit; margin-top: 10px; } /* * signup form overlay */ .signup-wrap .nav-tabs > li { float: left; margin-bottom: -1px; width: 50%; } .signup-wrap .nav-tabs > li a{ text-align: center; border-radius: 0; color: #fff; text-transform: uppercase; font-weight: 600; } .signup-wrap .nav-tabs > li.active a { text-align: center; border-radius: 0; background:#fff; color: #333; } .tab-pane{ padding:25px; } .signup-overlay{ position: fixed; background: rgba(0,0,0,.6); width: 100%; height: 100%; top: 0; left: 0; z-index: 999; } .signup-wrap { width: 720px; background: #191919; height: auto; margin: 0 auto; /* display: table-cell; */ vertical-align: middle; margin-top: 0px; position: relative; } .left-signup{ width: 440px; height: auto; padding: 0px } .right-signup{ width: 282px; height: 100%; position: absolute; right:0; top: 0; background: url(https://ebeautician.co.uk/resources/images/features-bg.jpg) #fff; background-size: cover; background-position: center; } label{ color: #333333; } .signup-wrap label{ color: #f3f3f3; } .form-field{ margin-bottom: 15px; } .form-field .fa-map-marker{ position: absolute; right: 36px; top: 10px; font-size: 20px; } #search-venue .form-field #location{ border-right: 1px solid #e8e8e8; } #search-venue select{ border-left: none; } .btn-login{ padding: 8px 30px; } .forgot-pass-link{ color:#f3f3f3; } .salon-name{ display: none; } .btn-signup{ padding: 8px 30px; } .modal-dialog { width: 720px; margin: 30px auto; } .modal-header { min-height: 16.42857143px; padding: 0; border-bottom: none; border-bottom-width: initial; border-bottom-style: none; border-bottom-color: initial; } .modal-content { position: relative; background-color: #fff; -webkit-background-clip: padding-box; background-clip: padding-box; border: none; border: none; border-radius: 6px; outline: 0; -webkit-box-shadow: none; box-shadow: none; } .modal-content { position: relative; background-color: #fff; -webkit-background-clip: padding-box; background-clip: padding-box; border: none; border: none; border-radius: 0; outline: 0; -webkit-box-shadow: none; box-shadow: none; } .modal-header .close { margin-top: -2px; position: absolute; right: 10px; font-size: 28px; z-index: 999; color: #333; opacity: 1; top: 10px; } .modal-header{ min-height: initial; } /* * custom modal */ .custom-modal{ position: fixed; display: none; top:0; left: 0; width: 100%; height:100%; background: rgba(0,0,0,.5); z-index: 999; overflow-y: scroll; } .cancel-modal-wrap{ position: absolute; top: 0; left: 0; margin: 0 auto; background: #fff; border-radius: 4px; height: 200px; width: 500px; right: 0; margin-top: 80px; margin-bottom: 80px; padding: 20px; } .close-modal{ float: right; padding: 1px; border-radius: 100%; height: 25px; width: 25px; margin-right: 5px; margin-top: 5px; line-height: 0; position: absolute; right: 0; top: 0; } .custom-modal-form{ text-align: center; } .custom-modal-form h4{ font-size: 20px; margin-top: 35px; } /* *page My profile */ #section-my-profile{ min-height: 560px; position: relative; background: #e8edf2; } .sb2-1 { float: left; width: 18%; background: #fff; color: #fff; height: 100%; position: absolute; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; overflow-y: auto; top:0; bottom:0; } .sb2-12 { position: relative; overflow: hidden; padding: 25px 15px; background: #ffffff; text-align: center; } ul:not(.browser-default) { padding-left: 0; list-style-type: none; } .sb2-12 ul li:nth-child(1) { width: 100%; margin-bottom: 25px; } .sb2-12 ul li { float: left; display: inline-block; } .sb2-12 ul li img { width: 75px; height: 75px; border-radius: 50%; border: 3px solid #fff; box-shadow: 0px 1px 10px 1px rgba(0, 0, 0, 0.15); } .sb2-12 ul li h5 { margin-bottom: 0px; margin-top: 0px; font-size: 15px; color: #666; font-weight: 500; } .sb2-13 ul li { list-style-type: none; /* border-bottom: 1px solid #303b40; */ /* padding: 3px 20px; */ } .sb2-1 a { color: #cecece; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; } .sb2-13 ul li a { display: block; font-size: 13px; padding: 10px 0px; border-bottom: 1px solid #ccc; padding: 12px 20px; color: #666; } .sb2-13 ul li a:after { font-family: FontAwesome; content: "\f105"; font-size: 16px; display: block; position: absolute; margin-top: -15px; right: 20px; font-size: 12px; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: -webkit-transform .2s ease-in-out; -o-transition: -webkit-transform .2s ease-in-out; transition: -webkit-transform .2s ease-in-out; } .menu-active { background: #db3742; color: #fff !important; } .sb2-12 .profile-ul li{ display: block; float: none; } .sb2-13 ul li a i{ margin-right: 6px; } .sb2-2 { float: left; width: 82%; padding: 30px; margin-left: 18%; background: #e8edf2; z-index: 9; position: relative; } .profile-image-holder, .thumbnail-image-holder, .logo-image-holder{ width: 200px; margin-bottom: 20px; } .profile-image-holder img, .thumbnail-image-holder img, .logo-image-holder img{ width: auto; min-height: 100px; max-height: 100px; } .thumbnail-image-holder img{ width:auto; } .profile-image-holder button{ margin-top: 15px; } #section-my-profile label { color: #333; font-weight: 500; } .form-group { margin-bottom: 15px; } ul.breadcrumbs{ margin-bottom: 20px; } ul.breadcrumbs li { list-style-type: none; display: inline-block; } .active-bre:before { content: "/"; padding: 0 5px; color: #333; } /* * page my beauticians */ .box-inn-sp { background: #fff; padding: 25px; border-radius: 4px; box-shadow: 0px 1px 10px 1px rgba(0, 0, 0, 0.05); } .action-buttons{ padding: 0px; padding-bottom: 20px; } .card-header{ padding: 0 0px; margin-bottom: 20px; font-size: 22px; } /* * pagintion */ .pagination { display: -webkit-box; display: -ms-flexbox; display: flex; padding-left: 0; list-style: none; border-radius: .25rem; } .page-link { position: relative; display: block; padding: .5rem .75rem; margin-left: -1px; line-height: 1.25; color: #007bff; background-color: #fff; border: 1px solid #dee2e6; padding: 6px 10px; } .container-fluid { padding-right: 0; padding-left: 0; margin-right: auto; margin-left: auto; } .page-link:not([disabled]):not(.disabled) { cursor: pointer; } .page-item:first-child .page-link { margin-left: 0; border-top-left-radius: .25rem; border-bottom-left-radius: .25rem; } .page-item.disabled .page-link { color: #868e96; pointer-events: none; cursor: auto; background-color: #fff; border-color: #dee2e6; } .page-item.active .page-link { z-index: 1; color: #fff; background-color: #007bff; border-color: #007bff; } div.dataTables_wrapper div.dataTables_filter label { font-weight: normal; white-space: nowrap; text-align: left; } #bootstrap-data-table_wrapper label{ font-size:13px; } #bootstrap-data-table_filter label{ text-align: right; } /* * page add salon service */ .category{ display: inline-block; background: #f7941d; padding: 4px 8px; color: #fff; border-radius: 3px; font-size: 12px; } .become-beautician{ color: #fff; background-color: #00BCD4; border-color: #00BCD4; margin-left: 10px; } .btn-action{ background: #3ea8f6; color: #fff; width: 65px; font-size: 14px; } /* * page my treatments */ .btn-edit { padding: 6px 12px; background: #4CAF50; color: #fff; text-transform: capitalize; font-size: 12px; line-height: 12px; display: inline-block; } .btn-delete{ padding: 4px 12px; background:#F44336; margin-left: 10px; color: #fff; text-transform: capitalize; font-size: 12px; } /* * ajax live booking notification */ .notifications-holder { position: fixed; right: 0; z-index: 9999; bottom: 90px; padding: 10px; width: 350px; max-height: 370px; overflow-y: hidden; } .notifications{ background: #e8f9f0; border: 2px solid #d0f2e1; padding: 10px; position: relative; margin-top: 10px; } .notifications h4{ font-size: 14px; margin-bottom: 0; margin-top: 0; } .notifications p{ font-size: 13px; margin-bottom: 0; line-height: 20px; } .notifications p.treatment{ color:#db3742; } .close-booking-notification{ background: none; position: absolute; right: 4px; top: 4px; color: #db3742; font-size: 18px; padding: 0; } #header{ position: relative; width: 100%; z-index: 999; background: #fff; height: auto; box-shadow: 0 2px 28px 0 rgba(0, 0, 0, 0.06); } .home-page #header{ position: absolute; width: 100%; z-index: 999; background: linear-gradient(to top,rgba(0,0,0,0) 0%,rgba(35,35,37,0.1) 35%,rgba(22,22,23,.3) 60%,rgba(35,35,37,0.5) 100%); } .top-header { background: none; padding: 0px 0; } .top-nav li a{ color: #454545; line-height: 70px; display: block; } .home-page .top-nav li a{ color:#fff; } .home-page .top-nav li a:hover, .top-nav li a:hover{ color:#db3742; } .theme-logo a{ font-size: 24px; color: #454545; position: relative; top: 0px; } .home-page .theme-logo a{ color:#ffffff ; } .banner-overlay{ padding: 40px 0; height: 550px; background:rgba(0,0,0,.4); position: relative; } /* * search venue form */ .search-venue-form{ width: 80%; margin: 0 auto; height: 60px; position: absolute; bottom: 200px; left: 0; right: 0; } .search-venue-form form{ background: #ffffff; border-radius: 100px; width: 80%; margin: 0 auto; height: 60px; padding: 12px; } #search-venue .form-control{ border: none; box-shadow: none; border-left: 1px solid #e8e8e8; } #search-venue .no-border{ border:none; } #search-venue .btn{ padding: 12px; width: 100%; border-radius: 28px; position: relative; top: -5px; } .section-header{ text-align: center; } .section-header p{ margin-top: 30px; } .section-header h3{ font-size: 32px; line-height: 46px; color:#334e6f; margin-bottom: 10px; } .search-venue-form h1{ font-size: 42px; line-height: 60px; margin-bottom: 0; color: #fff; font-weight: 600; text-align: center; } .search-venue-form p{ font-size: 16px; color: #fff; font-weight: 500; text-align: center; } /* * featured grid */ /*---------------*/ /***** hover effect *****/ /*---------------*/ /* --------------------------------------------- Grid Property section --------------------------------------------- */ /* Common style */ figure { position: relative; overflow: hidden; margin:0; text-align: center; cursor: pointer; } figure img { position: relative; display: block; width:100%; min-height: 220px; max-height: 220px; max-width: 100%; opacity: 1; background: url('https://venuesnearme.co.uk/resources/images/thumbnail-holder.jpg'); background-size: cover; background-position: center; -webkit-transform: scale(1); transform: scale(1); transition: 0.5s all; -webkit-transition: 0.5s all; -moz-transition: 0.5s all; -o-transition: 0.5s all; } figure figcaption { padding: 2em; color: #fff; text-transform: uppercase; font-size: 1.25em; -webkit-backface-visibility: hidden; backface-visibility: hidden; } figure figcaption::before, figure figcaption::after { pointer-events: none; } figure figcaption, figure figcaption > a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /* Anchor will cover the whole item by default */ /* For some effects it will show as a button */ figure figcaption > a { z-index: 1000; text-indent: 200%; white-space: nowrap; font-size: 0; opacity: 0; } figure h2 { word-spacing: -0.15em; font-weight: 500; } figure h2 span { font-weight: 800; } figure h2, figure p { margin: 0; } figure p { letter-spacing: 1px; font-size: 14px; margin-top: 5px; } .icon-links a{ margin: 0 5px; } .icon-links a:hover i{ color:#ffffff; } figure i{ letter-spacing: 1px; font-size: 14px; } .tags{ position: absolute; z-index: 99; padding: 4px 10px; } .tag{ background: #cccccc; border-radius: 2px; color: #fff; display: inline-block; font-size: 9px; font-weight: 500; margin-right: 5px; padding: 1px 6px; z-index: 1; height: 15px; } .tag.for-sale{ background: #ffc107; color: #fff; } .tag.for-rent{ background: #0062cc; color: #fff; } .for-featured{ background: #28a745; color: #fff; } /*---------------*/ /***** hover effect *****/ /*---------------*/ figure.effect-hover figcaption { top: auto; bottom: 0; padding: 10px; padding-top: 30px; height: 70px; background: linear-gradient(to top,rgba(35,35,37,0.9) 0%,rgba(35,35,37,0.45) 35%,rgba(22,22,23,0) 60%,rgba(0,0,0,0) 100%); color: #ffffff; -webkit-transition: -webkit-transform 0.35s; transition: transform 0.35s; -webkit-transform: translate3d(0,100%,0); transform: translate3d(0,100%,0); } figure.effect-hover h2 { float: left; color: #ffffff; } figure.effect-hover p.icon-links a { float: right; color: #ffffff; font-size: 14px; } figure.effect-hover:hover p.icon-links a:hover, figure.effect-hover:hover p.icon-links a:focus { color: #252d31; } figure.effect-hover p.description { position: absolute; bottom: 100%; padding: 20px; color: #fff; text-transform: none; font-size: 14px; opacity: 0; width: 100%; -webkit-transition: opacity 0.35s; transition: opacity 0.35s; -webkit-backface-visibility: hidden; } .property-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0); transition: background 0.5s ease; } figure.effect-hover:hover .property-overlay { } .property-overlay { text-align: center; display: flex; justify-content: center; align-items: center; } a.overlay-link { color: #fff !important; border: 2px solid #18469d; border-radius: 50%; width: 36px; height: 36px; line-height: 34px; font-size: 12px; text-align: center; margin: 3px; cursor: pointer; background: #18469d; opacity: 0; display: inline-block; visibility: hidden; -webkit-transition:ease-in-out .2s; } figure.effect-hover:hover .overlay-link { visibility: visible; opacity: 1; -webkit-transition:ease-in-out .2s; } figure.effect-hover h2, figure.effect-hover p.icon-links a { -webkit-transition: -webkit-transform 0.35s; transition: transform 0.35s; -webkit-transform: translate3d(0,200%,0); transform: translate3d(0,200%,0); } figure.effect-hover p.icon-links a span::before { display: inline-block; padding: 8px 10px; font-family: 'feathericons'; speak: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .icon-eye::before { content: '\e000'; } .icon-paper-clip::before { content: '\e001'; } .icon-heart::before { content: '\e024'; } figure.effect-hover h2 { display: inline-block; font-size: 24px; } figure.effect-hover:hover p.description { opacity: 1; } figure.effect-hover:hover figcaption, figure.effect-hover:hover h2, figure.effect-hover:hover p.icon-links a { -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); } figure.effect-hover:hover h2 { -webkit-transition-delay: 0.05s; transition-delay: 0.05s; } figure.effect-hover:hover p.icon-links a:nth-child(3) { -webkit-transition-delay: 0.1s; transition-delay: 0.1s; } figure.effect-hover:hover p.icon-links a:nth-child(2) { -webkit-transition-delay: 0.15s; transition-delay: 0.15s; } figure.effect-hover:hover p.icon-links a:first-child { -webkit-transition-delay: 0.2s; transition-delay: 0.2s; } .effect-hover{ margin-bottom: 30px; } .property-list .list-details{ border: 1px solid #f3f3f3; border-top: none; text-align: left; padding:20px 20px 10px 20px; } .property-list .list-details h3{ font-size: 22px; font-weight: 500; margin-bottom: 5px !important; } .property-list .list-details p{ font-size: 12px; } .property-list .list-details ul{ margin-top: 15px; } .property-list .list-details ul li{ display: inline-block; font-size: 12px; color: #242526; line-height: 11px; border-right: 1px solid #ddd; padding: 0px 10px 0px 10px; margin-right: -3px; } .property-list .list-details ul li:nth-child(1){ padding-left: 0; } .property-list .list-details ul li:nth-last-child(1){ border-right:none; } .list-details-footer { background: transparent; border-top: 0px; border-top: 1px solid #dfe0e5; margin-top: 20px; width:100%; padding-top:15px; } .list-details-footer a { color: #aeb4b6; font-size: 12px; position: relative; } .list-details-footer a.pull-right { margin-top: 6px; } .list-details-footer .like .fa { background: #f3f4f7; color: #242526; width: 34px; height: 34px; line-height: 34px; text-align: center; display: inline-block; font-size: 16px; border-radius: 50px; position: relative; top: 1px; padding-left: 1px; z-index: 99; } .list-details-footer a .la-heart-o:hover { color: #fff; } .list-details-footer a .fa-calendar { margin-right: 7px; font-size: 14px; } .featured-grid{ background: #ffffff; padding: 40px 0; } .grid-location-wrap{ margin-top: 50px; } .grid-properties figure{ margin-bottom: 30px; } .grid-properties figure.effect-hover h2{ font-size: 14px; } .grid-properties figure.effect-hover figcaption { padding-top: 40px; } .grid-properties figure p { margin-top: 0; } .grid-properties figure{ border-radius:4px; } /* * page all-listings */ .all-listings{ padding: 40px 0; } #all-venues-listings .tab-pane { padding: 0; } .venue-listing{ padding: 8px; border: 1px solid #e8e8e8; border-radius: 4px; overflow: hidden; background: #ffffff; margin-bottom: 20px; } .listing-details-wrap{ padding:0px 20px; } .listing-details-wrap p span{ margin-right: 10px; margin-left: 0px; } .no-padding{ padding-left: 0; padding-right: 0; } .no-margin{ margin-left: 0; margin-right: 0; } .listing-details-wrap h3{ font-size: 20px; margin-bottom: 5px; } .listing-details-wrap a:hover h3{ color:#db3742; } .listing-details-wrap p{ font-size: 12px; color: #777; margin-bottom: 0px; } .listing-details-wrap ul.services-available{ margin-top: 3px; margin-bottom: 0; } .listing-details-wrap ul.services-available li{ list-style-type: none; display: inline-block; font-size: 12px; padding-right: 10px; margin-bottom: 5px; border-right: 1px solid #e8e8e8; margin-right: 10px; font-weight: 500; } .listing-details-wrap ul.services-available li:nth-last-child(1){ border-right: none; } .listing-details-wrap ul.services-available li i{ font-size: 14px; color: #454545; margin-right: 5px; font-weight: 400; } .listing-details-wrap .btn-view{ font-size:13px; margin-bottom: 10px; margin-right: 10px; } .listing-details-wrap .link{ text-decoration: underline; position: relative; /* line-height: 41px; */ padding: 8px 14px; display: inline-block; height: 32px; margin:10px 0; top: -4px; color: #454545; } .images-gallery{ position: absolute; z-index: 999; right: 10px; padding: 10px; color: #333333; background: rgba(255,255,255,.9); top: 10px; border-radius: 2px; font-weight: 600; } .images-gallery i { margin-left: 4px; } .tags{ position: absolute; z-index: 99; padding: 10px 10px; } .tag{ background: #cccccc; border-radius: 2px; color: #fff; display: inline-block; font-size: 9px; font-weight: 500; margin-right: 5px; padding: 1px 6px; z-index: 1; height: 17px; } .tag.for-sale{ background: #ffc107; color: #fff; } .tag.for-rent{ background: #0062cc; color: #fff; } .for-featured{ background: #28a745; color: #fff; } .gallery-image-list{ margin-left: -5px; margin-right: -5px; margin-bottom: 0px; } .gallery-image-list li{ width: 60px; height: 50px; margin:5px; display: inline-block; list-style-type: none; border-radius: 4px; overflow: hidden; position: relative; } .gallery-image-list li img{ width:60px; height: 50px; cursor: pointer; background: url(https://venuesnearme.co.uk/resources/images/thumbnail-holder.jpg); background-size: cover; background-position: center; } .gallery-image-list li .gallery-overlay-wrap{ position: absolute; width: 100%; height: 100%; text-align: center; background: rgba(16, 16, 16,.7); color: #fff; font-weight: 600; padding: 16px 0; cursor: pointer; } .nav-pills > li > a { color: #fff; background-color: #9E9E9E; margin-right: 5px; } .nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus { color: #fff; background-color: #db3742; } .nav-pills > li.prev-page, .nav-pills > li.next-page{ position: relative; display: block; padding: 10px 15px; color: #fff; background-color: #9E9E9E; margin-right: 5px; } /* * single venue details */ .venue-banner{ position: relative; overflow:hidden; } .venue-banner .venue-banner-image{ width:100%; max-height: 550px; } .venue-info{ position: absolute; width: 100%; min-height: 200px; bottom:0; padding: 30px 0; background: -moz-linear-gradient(top,rgba(0,0,0,0) 0%,rgba(0,0,0,.7) 100%); background: -webkit-linear-gradient(top,rgba(0,0,0,0) 0%,rgba(0,0,0,.7) 100%); background: linear-gradient(to bottom,rgba(0,0,0,0) 0%,rgba(0,0,0,.7) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000',endColorstr='#000000',GradientType=0); } .capacity-list-banner{ margin-top: 10px; } .capacity-list-banner li{ list-style-type: none; display: inline-block; color: #333; height: auto; background: rgba(255,255,255,.9); min-height: inherit; width: 85px; text-align: center; font-size: 13px; font-weight: 500; padding: 10px; margin-right: 6px; border-radius: 4px; margin-bottom: 10px; } .capacity-list-banner li p{ margin-bottom: 0px; font-size: 12px; } .venue-info .container{ position: relative; } .venue-info h1{ font-size: 38px; line-height: 48px; color: #fff; font-weight: 600; margin-top: 0; text-shadow: 0px 2px 8px #454545; margin-bottom: 5px; } .discount_label { border-radius: 15px; height: 30px; font-size: 14px; line-height: 20px; display: inline-block; border: #fd4851 2px solid; color: #fff; padding: 3px 11px 0 12px; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; margin-bottom: 10px; margin-left: 4px; background:#fd4851; } .venue-logo{ width: 70px; height: 70px; border: 2px solid #fff; border-radius: 100px; background-size: 100%; margin-bottom: 15px; } .review-widget i{ color: #FBAF2A; margin-right: 2px; } .review-widget { color:#ccc; font-size: 12px; } .contact-info{ margin-top: 5px; } .contact-info span { color: #fff; font-size: 13px; line-height: 20px; display: inline-block; vertical-align: middle; margin-right: 29px; letter-spacing: -.2px; } .contact-info span a { position: relative; top: -2px; color: #fff; font-size: 13px; line-height: 20px; display: inline-block; vertical-align: middle; letter-spacing: -.2px; } .contact-info span i { color: #fd4851; margin-right: 5px; } .share-widget{ position: absolute; right: 0; bottom: 0px; } .listing_single_share_inner { font-size:14px; transition: opacity .4s; } .listing_single_share_inner a{ font-size: 16px; color: #fff; margin-left: 10px; height: 34px; width: 34px; border-radius: 40px; border: 1px solid #fff; display: inline-block; padding: 8px; text-align: center; } .breadcrumb { padding: 18px 15px; margin-bottom: 0px; list-style: none; background-color: #f5f5f5; border-radius: 4px; } .breadcrumb nav ul{ margin-bottom: 0; } .breadcrumb nav ul li{ display: inline-block; list-style-type: none; font-size: 14px; } .breadcrumb nav ul li i{ margin-left: 5px; margin-right: 5px; } .breadcrumb nav ul li a{ color:#454545; font-size: 14px; } .breadcrumb nav ul li.active{ color:#fd4851; font-weight:500; } /* * thumbnail slider */ #sync1{ width:100%; } #sync1 .item { margin: 0px; color: #FFF; border-radius: 3px; text-align: center; } #sync1 .item img{ width:100%; } #sync2 .item { background: #C9C9C9; margin: 5px; color: #FFF; border-radius: 3px; text-align: center; cursor: pointer; height:80px; overflow:hidden; } #sync2 .item h1 { font-size: 18px; } #sync2 .item img{ width:100px; height:100px; } #sync2 .current .item { background: #0c83e7; } .owl-theme .owl-nav { /*default owl-theme theme reset .disabled:hover links */ } .owl-theme .owl-nav [class*='owl-'] { transition: all 0.3s ease; } .owl-theme .owl-nav [class*='owl-'].disabled:hover { background-color: #D6D6D6; } #sync1.owl-theme { position: relative; } #sync1.owl-theme .owl-next, #sync1.owl-theme .owl-prev { width: 30px; height: 35px; margin-top: -20px; position: absolute; top: 50%; } #sync1.owl-theme .owl-prev { left: 10px; } #sync1.owl-theme .owl-next { right: 10px; } #sync2 .synced .item{ outline: 3px solid #db3742; } .vanue-full-info{ padding:20px 0 40px 0; background: #f1f1f1; } .sidebar-widget{ position: relative; background: #fff; border: #eee 1px solid; border-radius: 5px; padding: 0px 29px 19px; margin-bottom: 30px; } .sidebar-widget h3{ color: #db3742; font-size: 14px; text-transform: uppercase; font-weight: 500; position: relative; } .sidebar-widget h3:after{ content: ''; display: block; width: 50px; height: 3px; margin-right: 0; margin-left: 0; background: #db3742; margin-top: 12px; transition: width .3s; } .working_time_text__item{ margin-bottom: 0; } .working_time_text__item li{ list-style-type: none; border-bottom: 1px solid #e8e8e8; padding-bottom: 10px; margin-bottom: 10px; font-size: 13px; color: #454545; } .working_time_text__item li:nth-last-child(1){ border-bottom: none; } .working_time_text__item li .working_time_text__hours{ float: right; } #venue-location{ /*height:200px;*/ width:100%; background: #e8e8e8; margin-bottom: 20px; overflow: hidden; } #venue-location img{ width: 100%; } .default li{ list-style-type: none; border-bottom: 1px solid #e8e8e8; padding-bottom: 10px; margin-bottom: 10px; font-size: 13px; color: #454545; line-height: 20px; } .default li i{ margin-right: 10px; } .default li a{ color:#db3742; } .default li:nth-last-child(1){ border-bottom: none; } .social-links a{ display: inline-block; margin-right: 15px; font-size: 18px; } /* * timings */ .venue-opening-hours{ margin-bottom: 0px; } .venue-opening-hours li{ border-bottom: 1px solid #e8e8e8; padding: 10px 0; font-size: 13px; } .venue-opening-hours li strong{ width: 75px; display: inline-block; } .venue-opening-hours li:nth-last-child(1){ border:none; } .feature-row{ margin-bottom: 20px; padding: 20px; background: #fff; border-radius: 6px; } .capacity-list li{ list-style-type: none; width: 85px; background: #fff; padding: 6px; text-align: center; border-radius: 4px; border: 1px solid #e8e8e8; display: inline-block; margin-right: 6px; margin-bottom: 10px; font-size: 12px; } .capacity-list li span{ display: block; margin: 5px 0; font-size: 14px; font-weight: 500; color: #454545; } .capacity-list li p{ font-size: 12px; } .capacity-list li p{ margin-bottom: 0; font-size: 12px; } .feature-row .feature-row-header{ font-size: 16px; font-weight: 500; position: relative; margin-bottom: 15px; } .feature-row .feature-row-header:before { content: ''; width: 40px; height: 2px; background-color: #fd4851; position: absolute; z-index: 99; bottom: -10px; } .deailed-info-row ul li{ list-style-type: none; margin-bottom: 10px; font-size: 13px; } .deailed-info-row ul{ margin-bottom: 30px; } .deailed-info-row ul li i{ margin-right: 0.5em; } .m-service-list-available { color: #fd4851; } .deailed-info-row h6{ margin-bottom: 10px; font-weight: 600; } .deailed-info-row ul li.m-service-list-not-available{ text-decoration: line-through; } .deailed-info-row ul li.m-service-list-not-available i{ color:#454545; } /** custom calender ***/ .calender{ margin-top: 0px; position: relative; width: 532px; padding-left: 35px; } .calender ul{ margin:0; padding: 0; } .calender ul li{ list-style-type: none; display: inline-block; border-bottom: 3px solid #ccc; min-width: 80px; text-align: center; padding: 8px; cursor: pointer; font-weight: 500; font-size: 12px; } .calender ul li.selected{ color: #fff; font-weight: bold; border-bottom-color: #29B656; background: #29B656; border-radius: 5px; } .controls-btn{ position: absolute; margin-left: -35px; background: #fd4851; width: 30px; height: 30px; color: #fff; text-align: center; padding: 1px; cursor: pointer; font-size: 20px; line-height: normal; border-radius: 3px; margin-top: 5px; opacity: .5; } .controls-btn.enabled{ opacity:1; } .next-button{ right:0; /* margin-top: -31px;*/ } .available-slots{ margin-top: 10px; } .time-slot, .change-lane { padding: 4px 4px; display: inline-block; border-radius: 3px; background: #db3742; color: #FFF; font-size: 11px; margin: 5px; cursor: pointer; width: 56px; text-align: center; } .time-slot.booked, .change-lane.booked { background: #808080; cursor: not-allowed; } .my-booking-slots{ margin-top: 10px; min-height: 50px; } /* * ajax loader */ .calender .loading{ margin-top: 60px; } .calender .pre-loader { border: 3px solid #f3f3f3; border-radius: 50%; border-top: 3px solid #29B656; width: 30px; height: 30px; -webkit-animation: spin 1s linear infinite; animation: spin 1s linear infinite; margin: 30px auto; } @-webkit-keyframes spin { 0% { -webkit-transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); } } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .calender ul .loading{ margin-top: 10px; } .calender ul .pre-loader { border: 3px solid #f3f3f3; border-radius: 50%; border-top: 3px solid #29B656; width: 30px; height: 30px; -webkit-animation: spin 1s linear infinite; animation: spin 1s linear infinite; margin: 0 auto; margin-bottom: 12px; } .no-avail{ margin-left: 5%; margin-top: 20px; font-weight: bold } .dates-availability{ margin-bottom: 30px; background: #fff; padding: 15px; } .main-service li span.title{ display: block; margin-bottom: 10px; font-size: 16px; font-weight: 500; color: #db3742; } .main-service li p{ margin-bottom: 0; font-size: 12px; line-height: 16px; margin-top: 3px; } .main-service li ul li span{ font-size: 12px; } .main-service li ul{ padding-left: 10px; margin-left: 0px; } .service-list li, .service-list2 { list-style-type: none; position: relative; margin-bottom: 10px; } .service-list li input, .service-list li label { display: inline-block; font-size: 14px; } .service-list li:nth-last-child(1){ border:none; } .styled-checkbox:checked+label:after { content: ''; position: absolute; left: 5px; top: 9px; background: #fff; width: 3px; height: 3px; box-shadow: 2px 0 0 #fff, 4px 0 0 #fff, 4px -2px 0 #fff, 4px -4px 0 #fff, 4px -6px 0 #fff, 4px -8px 0 #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg); } .styled-checkbox+label:before { content: ''; margin-right: 10px; display: inline-block; vertical-align: text-top; width: 20px; height: 20px; background: #fff; border: 1px solid #ccc; } .styled-checkbox:checked+label:before, .styled-checkbox:hover+label:before { background: #fd4851; border: 1px solid #fd4851; } .styled-checkbox { position: absolute; opacity: 0; } .service-list li{ padding-bottom: 10px; border-bottom: 1px solid #e8e8e8; } .service-list li label{ font-weight: 500; } .service-list li span{ display: block; font-size: 13px; } .package-description{ margin-top: 10px; border-bottom: 1px solid #ccc; } .package-description h3{ font-size: 16px; margin-bottom: 10px; text-decoration: underline; } #package-details{ margin-top: 15px; } #package-details h6{ margin-top: 10px; margin-bottom: 10px; } #package-details .venue-event-type li{ display: inline-block; width: 50%; margin-bottom: 10px; } #package-details h3{ font-size: 16px; margin-bottom: 10px; font-weight: 600; } .room-gallery li{ list-style-type: none; display: inline-block; height: 60px; width:80px; border-radius: 4px; overflow: hidden; margin-right: 5px; } .room-gallery li img{ height: 60px; width:80px; } /* * Footer Styles */ #footer-two .footer-overlay { background: rgba(0,0,0,.9); padding: 60px 0 0; } #footer-two .widget .footer-header, #footer-two .widget h3 { font-size: 18px; color: #fff; text-transform: uppercase; position: relative; margin-bottom: 20px; font-weight: 600; } #footer-two .widget .footer-header:before, #footer-two .widget h3:before { content: ''; width: 40px; height: 2px; background-color: #db3742; position: absolute; z-index: 99; bottom: -10px; } #footer-two ul { margin-top: 30px; margin-left: 5px; } #footer-two ul li { list-style-type: none; margin-bottom: 16px; font-size: 14px; line-height: 16px; } #footer-two ul li a{ color: #f3f3f3; } #footer-two .address-widget ul li { padding: 0 0 10px 30px; border-bottom: 1px solid rgba(153,153,153,.4); position: relative; font-size: 16px; } .address-widget ul li.address:before { content: "\f124"; } #footer-two .address-widget ul li p { margin-bottom: 0; color: #999; font-size: 14px; } #footer-two .address-widget ul li { padding: 0 0 10px 30px; border-bottom: 1px solid rgba(153,153,153,.4); position: relative; font-size: 14px; } .address-widget ul li.phone-no:before { content: "\f232"; } #footer-two .address-widget ul li a { padding-left: 0; color: #999999; } .address-widget ul li.e-mail:before { content: "\f0e0"; } #footer-two .btn-primary { background: #db3742; border: none; padding: 12px; border-radius: 0; display: block; } #footer-two .footer-overlay .widget{ margin-bottom: 30px; color: #999999; font-size: 14px; } .address-widget ul li.address:before, .address-widget ul li.e-mail:before, .address-widget ul li.phone-no:before { position: absolute; font-size: 18px; margin-left: -30px; color: #999; font-family: FontAwesome; } #footer-two .social-menu li{ list-style-type: none; display: inline-block; margin-right: 5px; } #footer-two .social-menu li a{ color: #f3f3f3; padding: 5px; font-size: 18px; } #bottom-footer{ padding: 14px 0; background: #100f0f; text-align: left; } #bottom-footer p{ margin: 0; color: #999; float: left; display: inline-block; margin-top: 5px; } #bottom-footer nav{ float:right; display:inline-block; margin-right: 45px; } #bottom-footer nav ul{ margin-bottom:0; margin-top: 6px; } #bottom-footer nav ul li{ display:inline-block; margin-left:10px; } #bottom-footer nav ul ul{ display:none; } #bottom-footer nav ul li a, #bottom-footer nav ul li a:hover{ color: #cccccc; font-size: 14px; } .social-media-connect li a:before{ content:''; display:none; } .social-media-connect a.social-icon{ height:35px; width:35px; display:inline-block; position:relative; border-radius:0; background:none; margin:6px 8px 6px 0; } .subscribe-form input[type=email]{ padding:10px; font-size:16px; width:calc(100% - 120px); border-radius:2px 0 0 2px; } .subscribe-form input[type=submit]{ padding: 14px 20px; margin-top: 10px; font-size: 16px; margin-left: -5px; background: #18B226; position: relative; top: -1px; -webkit-border-radius: 0 2px 2px 0; -moz-border-radius: 0 2px 2px 0; -ms-border-radius: 0 2px 2px 0; -o-border-radius: 0 2px 2px 0; border-radius: 0 2px 2px 0; } #footer-col .address-widget ul{ margin-left:0; } .address-widget ul li{ padding:8px 0 15px 0; border-bottom:1px solid rgba(153,153,153,.4); position:relative; padding-left:30px; } .address-widget ul li:nth-last-child(1){ margin-bottom:0; border:0; } #footer .address-widget ul li:nth-last-child(1){ margin-bottom:0; border:0; } #footer .address-widget ul li a:before{ content:''; } #footer .address-widget ul li.address:before{ content: "\f124"; font-family: 'FontAwesome'; position:absolute; color:#f3f3f3; font-size:18px; margin-left:-30px; } #footer .address-widget p{ margin-bottom:0; } #footer .address-widget ul li.phone-no:before{ content: "\f095"; font-family: 'FontAwesome'; position:absolute; color:#f3f3f3; font-size:18px; margin-left:-30px; } #footer .address-widget ul li.e-mail:before{ content: "\f0e0"; font-family: 'FontAwesome'; position:absolute; color:#f3f3f3; font-size:18px; margin-left:-30px; } /* * gallery css */ .tf_gallery, .upload-thumbnail{ margin-top: 10px; } #myGallery .modal-dialog{ width: 80%; height: 80%; background: #fff; } #myGallery .modal-header{ background: #db3742; padding: 10px; position: relative; z-index: 99; } #myGallery .modal-header h4{ margin-bottom: 0; font-size: 16px; color: #fff; font-weight: 600; } #myGallery .modal-header .close { margin-top: -6px; position: absolute; right: 10px; font-size: 28px; z-index: 999; color: #fff; opacity: 1; top: 10px; font-weight: 400; } .gallery-container{ width:calc(100% - 250px); } #gallery-list-holder li{ list-style-type: none; display: inline-block; height: 115px; width: 115px; margin:5px; border:1px solid #e8e8e8; padding:5px; } #gallery-list-holder li .image-holder{ width:100%; height: 100px; } .image-holder{ height: 100px; } #gallery-list-holder figure{ position: relative; cursor: pointer; overflow: visible; } #gallery-list-holder li figcaption{ position: absolute; bottom: -8px; background: #db3742; width: 113px; padding: 5px; font-size: 12px; left: -5px; right: -5px; text-overflow: ellipsis; overflow: hidden; height: 22px; top: inherit; } .gallery-container{ padding: 10px; } .image-info{ border-left: 1px solid #db3742; position: fixed; right: 0; width: 250px; height: 100%; background:#fff; top: 0; overflow-y: scroll; } .main-gallery-container{ position: relative; } .image-details{ padding: 14px; margin-top: 30px; } .image-details figure{ height:180px; width:100%; text-align: center; overflow: hidden; border-bottom: 1px solid #e8e8e8; margin-bottom: 8px; } .image-details img { max-height: 100%; object-fit: cover; height: 100%; width: auto; text-align: center; } .image-details figcaption{ font-size: 14px; padding: 10px 0; font-weight: 600; } .select-image { position: absolute; font-size: 24px; color: #db3742; top: -10px; display: none; left: -8px; z-index: 99; } #gallery-list-holder li.selected{ outline: 3px solid #db3742; } #gallery-list-holder li.selected .select-image{ display: block; } .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus { color: #db3742; cursor: default; border: 1px solid #ddd; background: #fff; border-radius: 0; font-weight: 600; } #mediaLibrary{ padding: 0; } #upload-image{ display: none; } .btn-select-image{ background: #ccc; color: #000; color: #555; border-color: #ccc; background: #f7f7f7; -webkit-box-shadow: 0 1px 0 #ccc; box-shadow: 0 1px 0 #ccc; vertical-align: top; } #uploadFiles{ text-align: center; } #uploadFiles h3{ margin-top: 50px; } #upload{ padding:11px; } .deafult-text-color{ color: #db3742; font-weight: 600; } #gallery-list-holder p{ margin-top: 50px; } .image-properties ul li{ font-size: 13px; border-bottom: 1px solid #f3f3f3; padding: 5px 0; } .scrollbar { background: #F5F5F5; overflow-y: scroll; margin-bottom: 25px; } /* * STYLE 4 */ #style-4::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); background-color: #F5F5F5; } #style-4::-webkit-scrollbar { width: 8px; background-color: #F5F5F5; } #style-4::-webkit-scrollbar-thumb { background-color: #01d3f5; border: 1px solid #01d3f5; } /** custom calender ***/ .calender{ margin-top: 0px; position: relative; width: 100%; padding-left: 15px; } .calender ul{ margin:0; padding: 0; display:flex; } .calender ul li{ list-style-type: none; /*display: inline-block;*/ display:flex; border-bottom: 3px solid #ccc; /*min-width: 88px;*/ min-width:initial; text-align: center; /*padding: 8px;*/ padding: 8px 5px; cursor: pointer; font-weight: 500; font-size: 12px; flex-wrap:wrap; } .calender ul li.selected{ /*color: #29B656;*/ color: #fff; font-weight: bold; border-bottom-color: #29B656; background :#8BC34A ; } .controls-btn{ position: absolute; margin-left: -35px; background: #db3742; width: 30px; height: 30px; color: #fff; text-align: center; padding: 1px; cursor: pointer; font-size: 20px; line-height: normal; border-radius: 3px; margin-top: 5px; opacity: .5; } .controls-btn.enabled{ opacity:1; } .next-button{ right:0; /*margin-top: -30px;*/ } #slots-booking .next-button{ margin-top: -30px; right:-15px; } .available-slots{ margin-top: 10px; } .time-slot, .change-lane{ padding: 4px 4px; display: inline-block; border-radius: 3px; background: #db3742; color: #FFF; font-size: 11px; margin: 5px; cursor: pointer; width: auto;; min-width: 64px; text-align: center; } .my-booking-slots h4{ font-size: 13px; margin: 15px 0; padding-left: 5px; font-weight: 600; } .time-slot.booked, .change-lane.booked{ background: #808080; cursor: not-allowed; width:auto; } /* * ajax loader */ .calender .loading{ margin-top: 60px; } .calender .pre-loader { border: 3px solid #f3f3f3; border-radius: 50%; border-top: 3px solid #29B656; width: 30px; height: 30px; -webkit-animation: spin 1s linear infinite; animation: spin 1s linear infinite; margin: 30px auto; } @-webkit-keyframes spin { 0% { -webkit-transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); } } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .calender ul .loading{ margin-top: 10px; } .calender ul .pre-loader { border: 3px solid #f3f3f3; border-radius: 50%; border-top: 3px solid #29B656; width: 30px; height: 30px; -webkit-animation: spin 1s linear infinite; animation: spin 1s linear infinite; margin: 0 auto; margin-bottom: 12px; } .no-avail{ margin-left: 5%; margin-top: 20px; font-weight: bold } #slots-booking{ float: none; } #images-gallery{ margin: 0; } .school-logo img { width: 100%; margin-top: 12px; max-height: 75px; min-height: 75px; } @media(max-width:768px){ .calender { margin-top: 20px; position: relative; width: 100%; padding-left: 35px; } .calender ul{ display: inline-flex; width: 100%; padding-right: 35px; } .calender ul li { list-style-type: none; display: inline-block; border-bottom: 3px solid #ccc; min-width: 40px; text-align: center; padding: 8px; cursor: pointer; font-weight: 500; font-size: 12px; /* width: 75px; */ display: inline-flex; width: 100%; } .no-avail { margin-left: 5%; margin-top: 20px; font-weight: bold; font-size: 13px; margin-left: 0; text-align: center; } .details-wrap { position: relative; margin-top: 10px; } .details-wrap h3 { color: #308bd6; font-size: 14px; font-weight: 600; text-transform: uppercase; margin-top: 0; } .details-wrap h4 { color: #000; font-size: 12px; } } @media(max-width: 370px){ .next-button { right: 0; margin-top: -52px; } .time-slot, .change-lane { padding: 4px 4px; display: inline-block; border-radius: 3px; background: #308bd6; color: #FFF; font-size: 11px; margin: 5px; cursor: pointer; width: 66px; text-align: center; } } /* * single beautician page */ #salon-beauticians{ margin-top: 20px; } #employee_selected{ padding: 6px 10px; height: 36px; } .salon-details{ padding:40px 0; } .salon-details figure img{ width:100%; } .social-links { position: absolute; right: 15px; top: 5px; } .social-links li { list-style-type: none; font-size: 13px; display: inline-block; } .social-links li a { height: 35px; width: 35px; display: block; position: relative; background: 0 0; border: 1px solid #ccc; padding: 8px; font-size: 16px; text-align: center; color: grey; } #images-gallery li{ padding: 5px; max-height: 72px; overflow: hidden; } #images-gallery li img{ width:100%; height:auto; cursor: pointer; } .sidebar .fa-search { background-color: #db3742!important; border: none; display: inline-block; width: 37px!important; height: 36px; color: #f5f5f5; margin-left: -3px; vertical-align: bottom; float: right!important; margin-top: -36px; padding: 10px 12px; border-radius: 0 3px 3px 0; font-size: 15px; cursor: pointer; } .sidebar h3{ font-size: 16px; margin-bottom: 10px; font-weight: 500; } .salon-service-list li label{ color: #333; } input[type=checkbox], input[type=radio] { margin-right: .5em; } input[type=checkbox]+label, input[type=radio]+label { font-weight: 600; } .styled-checkbox+label { position: relative; cursor: pointer; padding: 0; } label { display: block; font-weight: 500; margin-bottom: .5em; } .styled-checkbox+label:before { content: ''; margin-right: 10px; display: inline-block; vertical-align: text-top; width: 20px; height: 20px; background: #fff; } .salon-service-list li.selected .styled-checkbox label:before, .styled-checkbox:hover+label:before { background: #b70909; } .salon-service-list li.selected label:before { content: ''; margin-right: 10px; display: inline-block; vertical-align: text-top; width: 20px; height: 20px; background: #db3742; } .salon-service-list li.selected label:after { content: ''; position: absolute; left: 5px; top: 9px; background: #fff; width: 3px; height: 3px; box-shadow: 2px 0 0 #fff, 4px 0 0 #fff, 4px -2px 0 #fff, 4px -4px 0 #fff, 4px -6px 0 #fff, 4px -8px 0 #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg); } .salon-service-list li label { color: #333; margin-bottom: 3px; } .salon-service-list li span{ font-size: 13px; padding-left: 30px; margin-bottom: 10px; display: block; } .styled-checkbox { position: absolute; opacity: 0; } .sidebar { padding: 10px; background: #f3f3f3; margin-bottom: 20px; border-radius: 3px; } /* * salon profile */ .upload-btn { font-size: 16px; cursor: pointer; color: #000; margin-top: 5px; width: 100%; border: 2px dashed #666; text-align: center; padding: 10px; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; } .form-wrap h4{ margin-bottom: 6px; } .form-wrap #images-gallery li { display: inline-block; float: left; height: 60px; width: 75px; margin: 5px; list-style-type: none; position: relative; padding-left: 0; overflow: hidden; } .form-wrap #images-gallery li .imagegallery{ width: 75px; height: 60px; } .form-wrap .delete-property-image { height: 25px; width: 25px; background: #C00; color: #fff; position: absolute; right: 0; top: 0; border: none; cursor: pointer; padding: 0; font-size: 15px; text-align: center; border-radius: 0; } .form-wrap #images-gallery li img { width: 92px; height: auto; } #update-profile-form #about{ min-height: 160px; } /* * beautician liststyle */ .beautician-list { border: 1px solid #ccc; border-radius: 4px; overflow: hidden; padding: 10px; min-height: 222px; padding-left: 225px; margin-bottom: 20px; position: relative; } #booknow{ right: 25px; margin-top: 7px; padding: 5px 25px; font-size: 13px; text-transform: capitalize; font-weight: 600; } .beautician-list .beautician-image{ position: absolute; left:10px; width: 200px; } .beautician-list .beautician-image img{ width: 100%; overflow: hidden; height: 180px; } .beautician-list h3{ margin-bottom: 5px; font-size: 18px; } .beautician-list #ratings{ color: #f7c305; font-size: 12px; } .personal-info li { display: inline-block; margin-right: 15px; font-size: 13px; color: grey; } .about-me p { line-height: 18px; margin-bottom: 0px; font-size: 13px; } .beautician-list ul{ margin-bottom: 0; padding: 0; } .thumb-info-social-icons { margin: 0; padding: 0; } .thumb-info-social-icons { position: absolute; top: 5px; right: 24px; } .thumb-info-social-icons a { display: block; position: relative; background: 0 0; border: none; padding: 5px; font-size: 14px; text-align: center; color: grey; } .thumb-info-social-icons li { display: inline-block; margin-right: 0; } .availabililty li { font-size: 12px; list-style-type: none; display: inline-block; margin-top: 5px; margin-right: 5px; } .availabililty .label-success { background-color: #5cb85c; display: block; padding: 4px 8px; } .serving-category li { list-style-type: none; display: inline-block; padding: 2px 6px; background-color: #ccc; color: #000; margin-right: 10px; border-radius: 3px; font-size: 12px; } .serving-category{ margin:10px 0; } .my-availability p{ margin-bottom: 0; } p span { font-weight: 600; cursor: pointer; color: #db3742; } .school-logo img { width: 100%; margin-top: 12px; max-height: 75px; min-height: 75px; } .salon-info-wrap h1{ margin-bottom: 0; font-size: 22px; } .salon-info-wrap p{ margin-bottom: 5px; font-size: 13px; } .salon-info-wrap ul li{ font-size: 13px; } .owner-details li { list-style-type: none; margin-right: 15px; display: inline-block; } .salon-logo{ position: absolute; right: 15px; width: 100px; top: 0; border: 1px solid #e8e8e8; } .salon-logo img{ width: 100%; } .salon-details-wrap{ padding: 10px; background: #f3f3f3; border: 1px solid #e8e8e8; } .available_slots{ margin-top: 6px; margin-left: -6px; margin-right: -6px; } .loader { margin: 50px auto; border: 3px solid #f3f3f3; border-radius: 50%; border-top: 3px solid #3498db; width: 40px; height: 40px; -webkit-animation: spin .8s linear infinite; /* Safari */ animation: spin .8s linear infinite; } /* Safari */ @-webkit-keyframes spin { 0% { -webkit-transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); } } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .not-found{ padding: 5px 15px; background: #f3f3f3; border: 1px solid #ccc; border-radius: 4px; font-weight: 600; } .no-schedule{ padding: 5px 6px; } /* * page salon features */ #salon-features{ padding:40px 0; } .feature-list{ margin-top: 70px; } .feature-list-wrap{ padding: 12px; background: #f3f3f3; border: 1px solid #ccc; border-radius: 4px; padding-top: 25px; min-height: 334px; margin-bottom: 30px; } .feature-icon{ height: 70px; width: 70px; border-radius: 100px; background: #fff; text-align: center; padding: 10px; font-size: 32px; color: #db3742; margin: 10px auto; border: 2px solid #db3742; } .feature-icon img{ width:44px; } .feature-icon i{ margin-top: 7px; } .feature-details{ text-align:center; margin-top: 20px; } .feature-details h4{ font-size: 18px; font-weight: 600; margin-bottom: 5px; } /* * privacy policy */ #privacy-section{ padding: 40px 0; } #location { padding-right: 34px; border: 1px solid #fff; border-radius: 4px; } .sidebar #location { padding-right: 34px; border: 1px solid #bbb; border-radius: 0px; } /* * page checkout */ #section-checkout{ padding:40px 0; } #section-checkout .section-header{ margin-bottom: 60px; } #checkout-form .form-group { margin-bottom: 15px; /* min-height: 60px;*/ } #checkout-form label{ display: contents; cursor: pointer; } .radio-btn-wrap{ margin-top:30px; } /* The container */ .radio-btn-wrap { display: block; position: relative; margin-bottom: 12px; cursor: pointer; font-size: 14px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } /* Hide the browser's default radio button */ .radio-btn-wrap input { position: absolute; opacity: 0; cursor: pointer; } .radio-btn-wrap label{ position: relative; padding-left: 25px; font-weight: 600; } /* Create a custom radio button */ .checkmark { position: absolute; top: 0; left: 0; height: 20px; width: 20px; background-color: #ccc; border-radius: 50%; } /* On mouse-over, add a grey background color */ .radio-btn-wrap:hover input ~ .checkmark { background-color: #ccc; } /* When the radio button is checked, add a blue background */ .radio-btn-wrap input:checked ~ .checkmark { background-color: #db3742; } /* Create the indicator (the dot/circle - hidden when not checked) */ .checkmark:after { content: ""; position: absolute; display: none; } /* Show the indicator (dot/circle) when checked */ .radio-btn-wrap input:checked ~ .checkmark:after { display: block; } /* Style the indicator (dot/circle) */ .radio-btn-wrap .checkmark:after { top: 7px; left: 7px; width: 6px; height:6px; border-radius: 50%; background: white; } .clabel{ margin-top: 2px; position: relative; display: inline-block; } .team-item { background-image: linear-gradient(127deg, #fff 0%, #fff 91%); box-shadow: 0 2px 48px 0 rgba(0, 0, 0, 0.06); padding: 25px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; position: relative; overflow: hidden; margin-bottom: 30px; margin-top: 22px; } .team-item:before { content: ''; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; position: absolute; width: 100%; height: 5px; background: red; bottom: 0px; left: 0px; z-index: 1; background-image: linear-gradient(127deg, #f5669c 0%, #db3742 91%); -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .team-item:hover:before { height: 100%; } .team-item:hover .header .info strong { color: #fff; } .team-item:hover .header .info span { color: #F7F8FF; } .team-item:hover .body { color: #F7F8FF; } .team-item .header { overflow: hidden; margin-bottom: 10px; position: relative; z-index: 2; } .team-item .header .img { float: left; width: 120px; margin-right: 10px; overflow: hidden; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .team-item .header .info { float: left; width: calc(100% - 150px); } .team-item .header .info p{ margin-bottom: 2px; font-size: 12px; line-height: 16px; } .team-item .header .info strong { display: block; font-weight: 500; font-size: 14px; line-height: 26px; color: #3B566E; letter-spacing: 1px; margin-top: 0px; margin-bottom: 3px; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .team-item .header .info span { display: block; font-weight: 400; font-size: 13px; color: #647E95; letter-spacing: 0.52px; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .team-item .body { font-weight: 400; font-size: 14px; line-height: 18px; color: #647E95; letter-spacing: 0.88px; position: relative; z-index: 2; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .team-item .social { position: absolute; right: 0px; top: 72px; overflow: hidden; width: 150px; height: 40px; background: #fff; text-align: center; border-radius: 3px 0px 0px 3px; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; z-index: 2; box-shadow: 0 2px 48px 0 rgba(0, 0, 0, 0.06); } .team-item .social li { display: inline-block; height: 28px; line-height: 28px; margin-left: 5px; margin-right: 5px; padding-top: 7px; } .team-item .social li i { color: #db3742; } .team-item img{ height: auto; width: 112px; } .booking-info strong{ width: 70px; position: relative; display: inline-block; } .booking-info strong:after{ content:":"; display: block; position: absolute; color: #333; top: 0; right: 3px; } .checkout-overlay{ background: rgba(0,0,0,.65); position: fixed; width: 100%; height: 100%; top: 0; bottom: 0; z-index: 999; display: none; } .center_gravity{ left: 0; right: 0; text-align: center; position: absolute; top: 50%; margin: 0 auto; transform: translateY(-50%); } .checkout-message{ text-align: center; display: block; width: 100%; color: #fff; font-size: 14px; margin-top: 55px; } .center_gravity .btn{ display: none; width: 190px; margin: 0 auto; } .center_gravity i{ display: none; font-size: 60px; color: #17a549; } .succ .center_gravity i{ display: inline-block; } .succ .checkout-message { text-align: center; display: block; width: 100%; color: #fff; font-size: 14px; margin-top: 10px; } .succ .center_gravity .btn{ display: inline-block; } .lds-dual-ring { display: inline-block; width: 64px; height: 64px; margin: 0 auto; position: absolute; left: 0; right: 0; } .succ .lds-dual-ring{ display: none; } .succ i { display: block; } .lds-dual-ring:after { content: " "; display: block; width: 46px; height: 46px; margin: 1px; border-radius: 50%; border: 5px solid #fff; border-color: #db3742 transparent #db3742 transparent; animation: lds-dual-ring 1.2s linear infinite; } @keyframes lds-dual-ring { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } /* * page account verification */ .account-verification .checkout-overlay{ background: rgba(0,0,0,.75); position: fixed; width: 100%; height: 100%; top: 0; bottom: 0; z-index: 999; display: block; } /* * booking success */ .booking-success{ padding: 20px 0; background: #db3742; } .booking-success h1{ margin-bottom: 0; color: #fff; font-size: 22px; text-align: center; font-weight: 500; } .booking-information{ background: url(https://ebeautician.co.uk/resources/images/features-bg.jpg); background-size: cover; background-position: top; padding: 40px 0; background-position-y: -60px; } .booking-wrap{ width: 600px; margin:0 auto; } .booking-information table td{ border:1px solid #e8e8e8; border-bottom: none; padding: 10px; background: #ffffff; } .booking-information table{ border-bottom: 1px solid #e8e8e8; } .table-title-holder{ width:200px; font-weight: 600; } .view-my-bookings{ float: right; } .booking-status{ display: inline-block; padding: 4px 6px; font-size: 10px; background: #4CAF50; color: #fff; border-radius: 4px; height: 22px; font-weight: bold; } .booking-status.waiting{ background: #FF5722; } /* * booking cancel */ .booking-cancel{ padding:20px 0; } .booking-cancel h1{ font-size:22px; color: #db3742; margin-bottom: 0; text-align: center; } .aligncenter{ text-align: center; } .pending{ height: 25px; padding: 3px 10px; background: #00BCD4; color: #fff; font-size: 12px; border-radius: 4px; } .waiting{ /* height: 25px;*/ padding: 3px 10px; background: #FFC107; color: #fff; font-size: 12px; border-radius: 4px; } .confirmed{ height: 25px; padding: 3px 10px; background: #4CAF50; color: #fff; font-size: 12px; border-radius: 4px; } .cancelled{ height: 25px; padding: 3px 10px; background: #9E9E9E; color: #fff; font-size: 12px; border-radius: 4px; } /* * my bookings */ table a { font-family: 'Open Sans', sans-serif; text-decoration: none; color: #db3742; } .table-booking-details{ border-bottom:1px solid #e8e8e8; } .table-booking-details td{ padding: 8px; border:1px solid #e8e8e8; border-bottom: none; } /* * page beauticians */ #beauticians-page{ padding:40px 0; } .sidebar .fa-search { background-color: #db3742!important; border: none; display: inline-block; width: 37px!important; height: 36px; color: #f5f5f5; margin-left: -3px; vertical-align: bottom; float: right!important; margin-top: -36px; padding: 10px 12px; border-radius: 0 3px 3px 0; font-size: 15px; cursor: pointer; } .sidebar h3{ font-size: 16px; margin-bottom: 10px; font-weight: 500; } .service-list li label{ color: #333; } input[type=checkbox], input[type=radio] { margin-right: .5em; } input[type=checkbox]+label, input[type=radio]+label { font-weight: 600; } .styled-checkbox+label { position: relative; cursor: pointer; padding: 0; } label { display: block; font-weight: 800; margin-bottom: .5em; } .styled-checkbox+label:before { content: ''; margin-right: 10px; display: inline-block; vertical-align: text-top; width: 20px; height: 20px; background: #fff; } #packages_available .service-list{ padding-left: 10px; border-left: 2px solid rgb(217, 0, 79); } .service-list li.selected .styled-checkbox label:before, .styled-checkbox:hover+label:before { background: #b70909; } .service-list li.selected label:before { content: ''; margin-right: 10px; display: inline-block; vertical-align: text-top; width: 20px; height: 20px; background: #db3742; } .service-list li.selected label:after { content: ''; position: absolute; left: 5px; top: 9px; background: #fff; width: 3px; height: 3px; box-shadow: 2px 0 0 #fff, 4px 0 0 #fff, 4px -2px 0 #fff, 4px -4px 0 #fff, 4px -6px 0 #fff, 4px -8px 0 #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg); } .styled-checkbox { position: absolute; opacity: 0; } .sidebar { padding: 10px; background: #f3f3f3; margin-bottom: 20px; border-radius: 3px; } /* * category page */ #category-page{ padding: 40px 0; } .page_title{ margin-top: 20px; font-size: 22px; margin-bottom: 5px; } /* * beautician liststyle */ .beautician-list { border: 1px solid #ccc; border-radius: 4px; overflow: hidden; padding: 10px; min-height: 222px; padding-left: 225px; margin-bottom: 20px; } #booknow{ right: 25px; margin-top: 7px; padding: 5px 25px; font-size: 13px; text-transform: capitalize; font-weight: 600; } .beautician-list .beautician-image{ position: absolute; left: 10px; width: 200px; } .beautician-list .beautician-image img{ width: 100%; overflow: hidden; height: 201px; } .beautician-list h3{ margin-bottom: 5px; font-size: 18px; font-weight: 400; } .beautician-list #ratings{ color: #f7c305; font-size: 12px; } .personal-info li { display: inline-block; margin-right: 15px; font-size: 13px; color: grey; } .about-me p { line-height: 18px; margin-bottom: 0px; font-size: 13px; } .beautician-list ul{ margin-bottom: 0; padding: 0; } .thumb-info-social-icons { margin: 0; padding: 0; } .thumb-info-social-icons { position: absolute; top: 5px; right: 24px; } .thumb-info-social-icons a { display: block; position: relative; background: 0 0; border: none; padding: 5px; font-size: 14px; text-align: center; color: grey; } .thumb-info-social-icons li { display: inline-block; margin-right: 0; } .availabililty li { font-size: 12px; list-style-type: none; display: inline-block; margin-top: 5px; margin-right: 5px; } .availabililty .label-success { background-color: #5cb85c; display: block; padding: 4px 8px; } .serving-category li { list-style-type: none; display: inline-block; padding: 2px 6px; background-color: #ccc; color: #000; margin-right: 10px; border-radius: 3px; font-size: 12px; } .serving-category{ margin:10px 0; } .my-availability p{ margin-bottom: 0; } p span { font-weight: 600; cursor: pointer; color: #454545; margin-left: 10px; } .about-me span{ text-decoration: underline; } .not-found{ padding: 5px 15px; background: #f3f3f3; border: 1px solid #ccc; border-radius: 4px; font-weight: 600; } .beautician-list-wrapper .lds-dual-ring:after { content: " "; display: block; width: 46px; height: 46px; margin: 1px; border-radius: 50%; border: 5px solid #db3742; border-color: #db3742 transparent #db3742 transparent; animation: lds-dual-ring 1.2s linear infinite; margin-top: 30px; } #toggle2 { display: block; float: right; width: 28px; height: 30px; padding: 0; margin-top: 5px; top: 5px; } /* Important styles */ .mob-buttons{ display: none; float: right; margin-top: -35px; } .mob-buttons .btn-login{ margin-left: 5px; background: #5CB85C; color: #fff; border: 1px solid #5CB85C; padding: 4px 10px; margin-right: 12px; position: relative; top: 2px; font-size: 14px; } #toggle2{ display:none; float:right; width: 28px; height: 30px; padding: 0; margin-top: -34px; background: none; border: none; } #toggle2:focus{ outline: none; } #toggle2 span:after, #toggle2 span:before { content: ""; position: absolute; left: 0; top: -9px; } #toggle2 span:after{ top: 9px; } #toggle2 span { position: relative; display: block; } #toggle2 span, #toggle2 span:after, #toggle2 span:before { width: 100%; height: 4px; background-color: #454545; transition: all 0.3s; backface-visibility: hidden; border-radius: 0px; } .home-page #toggle2 span, .home-page #toggle2 span:after, .home-page #toggle2 span:before { width: 100%; height: 4px; background-color: #ffffff; transition: all 0.3s; backface-visibility: hidden; border-radius: 0px; } /* on activation */ #toggle2.on span { background-color: transparent; } #toggle2.on span:before { transform: rotate(45deg) translate(5px, 5px); } #toggle2.on span:after { transform: rotate(-45deg) translate(7px, -8px); } .mobile-user-log-stat{ display: none; float: right; margin-right: 45px; margin-top: -26px; } .mobile-user-log-stat img{ width: 18px; } .mobile-user-log-stat a{ font-weight: 600; color: #db3742; } .btn-category-toggle{ display: none; width: 100%; border-radius: 0; text-align: left; padding: 10px 30px; } /* * page beautician */ .btn-filter-menu{ display: none; } /***************************************************/ /**************Responsive Media Query***************/ @media(max-width: 1320px){ .container{ width:90%; } /* * header */ .category-menu ul{ text-align: center; } .category-menu ul li a { padding: 16px 15px; font-size: 13px; } } @media(max-width: 1120px){ /* * header */ .category-menu ul li a { padding: 14px 12px; font-size: 12px; } } @media(max-width: 992px){ .container{ width:95%; } /* * top nav */ .top-nav li{ margin-left: 15px; } .top-nav li a { font-size: 13px; } .top-header .theme-logo { width: 160px; height: auto; } .form-wrap h1 { font-size: 20px; } .beautician-detail { text-align: center; padding: 15px 10px; } .beautician-detail ul li { display: inline-block; position: relative; margin: 10px; list-style-type: disc; font-weight: 600; } .beautician-detail h3 { font-size: 18px; } } @media(max-width: 991px){ .search-form-banner { position: absolute; width: 70%; background: rgba(0,0,0,.5); padding: 20px 25px; margin: -200px auto 0; left: 0; right: 0; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; } .c-wrap h3 { margin-top: 15px; font-size: 14px; } #news-letter{ padding: 40px 0; } } @media(max-width: 767px){ .form-wrap .col-md-7, .form-wrap .col-md-2, .form-wrap .col-md- { padding-left: 15px; padding-right: 15px; } .form-wrap #location{ margin-bottom: 20px; margin-top: 20px; } .beautician-wrap { background: #ffffff; margin-bottom: 30px; } .service-wrap{ margin-bottom: 50px; } .search-form-banner { position: relative; width: 90%; background: rgba(0,0,0,.5); padding: 20px 25px; margin: 30px auto 0; left: 0; right: 0; -webkit-border-radius: 4px; -moz-border-radius: 4px; -ms-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; } .form-wrap h1 { font-size: 16px; font-weight: 500; } .section-header h3, .section-header h1 { position: relative; font-size: 20px; } /* * header */ .contact-info-list li a { color: #f3f3f3; font-size: 12px; } .mobile-user-log-stat{ display: inline-block; } #toggle2{ display:block; } .top-header .theme-logo { float: none; } .top-right-nav { float: none; width: 100%; display: block; display: none; overflow: hidden; background: #fff; margin-top: 10px; } .search-venue-form form{ width:100%; } .top-nav { margin-bottom: 0; margin-top: 18px; } .top-nav li { margin-left: 15px; display: block; } .home-page .top-nav li a, .top-nav li a { font-size: 13px; padding: 12px 0px; display: block; line-height: 14px; color: #454545; border-bottom: 1px solid #f3f3f3; } .home-page .top-nav li a span{ color:#454545; } .category-menu ul { text-align: left; display: none; } .category-menu ul li{ display: block; } .btn-category-toggle{ display: block; } .category-menu ul li a { padding: 9px 12px; font-size: 12px; border-bottom: 1px solid #ccc; border-radius: 0; text-align: left; } .modal-dialog { width: 95%; margin: 30px auto; } .signup-wrap { width: 100%; } .right-signup { display: none; } .left-signup{ width: 100%; } .modal-header .close { margin-top: -2px; position: absolute; right: 10px; font-size: 28px; z-index: 999; color: #f3f3f3; opacity: 1; top: 10px; } .section-header h3, .section-header h2, .section-header h4, .section-header h1 { position: relative; font-size: 20px; } /* * banner */ .banner-overlay{ height: 400px; } .search-venue-form h1 { font-size: 22px; line-height: 32px; } .search-venue-form form{ background:none; } .search-venue-form { width: 80%; margin: 0 auto; height: 60px; position: relative; top: 70px; left: 0; right: 0; } #search-venue .no-border { border: none; border-radius: 30px; height: 40px; } #search-venue .form-field #location { border-right: 1px solid #e8e8e8; border-radius: 30px; height: 40px; } } @media(max-width: 667px){ .beautician-list { border: 1px solid #ccc; border-radius: 4px; overflow: hidden; padding: 10px; min-height: 10px; padding-left: 10px; margin-bottom: 20px; width: 100%; float: left; } .beautician-details{ position: relative; } .beautician-list .beautician-image { position: relative; left: 10px; width: 100%; left: 0; margin-bottom: 14px; } .beautician-list .beautician-image img { width: 100%; overflow: hidden; height: auto; } .filter-sidebar{ display: none; } .btn-filter-menu{ display: block;margin-bottom: 20px; } .social-links { position: relative; right: 0; top: 5px; } .salon-details figure img { width: 100%; margin-bottom: 10px; } .salon-info-wrap h1 { margin-bottom: 0; font-size: 18px; } #employee_selected { padding: 6px 10px; height: 36px; width: 100%; margin-bottom: 10px; } #slots-booking { float: none; } .next-button { right: 0; margin-top: -30px; } .thumb-info-social-icons { position: relative; top: 0; right: 24px; } .time-slot, .change-lane{ padding: 4px 6px; display: inline-block; border-radius: 3px; color: #FFF; font-size: 11px; margin: 5px; cursor: pointer; width: 66px; text-align: center; } } @media(max-width: 380px){ .top-header .theme-logo { width: 130px; height: auto; } } /* --------------------------------------------- blog --------------------------------------------- */ .blog-post-thumb { margin-bottom: 30px; } .blog-post-thumb.big .img { height: 400px; } .blog-post-thumb .img { overflow: hidden; border-radius: 5px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; position: relative; height: 200px; } .blog-post-thumb .img .date { position: absolute; right: 0px; bottom: 0px; width: 60px; background: #db3742; text-align: center; padding-top: 10px; padding-bottom: 10px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; border-bottom-left-radius: 0px; border-top-right-radius: 0px; } .blog-post-thumb .img .date strong { display: block; color: #fff; height: 20px; line-height: 20px; } .blog-post-thumb .img .date span { display: block; color: #fff; height: 20px; line-height: 20px; } .blog-post-thumb .blog-text { padding: 20px 30px; background: #fff; box-shadow: 0 2px 48px 0 rgba(0, 0, 0, 0.06); border-radius: 5px; border-top-right-radius: 0px; border-top-left-radius: 0px; overflow: hidden; } .blog-post-thumb .blog-text h3 { margin-bottom: 24px !important; } .blog-post-thumb .blog-text h3 a { font-weight: 400; font-size: 16px; color: #3B566E; letter-spacing: 1px; line-height: 26px; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .blog-post-thumb .blog-text h3 a:hover { color: #404BCB; } .blog-post-thumb .blog-text .post-meta { overflow: hidden; margin-bottom: 5px; } .blog-post-thumb .blog-text .post-meta li { float: left; margin-right: 30px; height: 30px; line-height: 30px; color: #404BCB; font-size: 14px; } .blog-post-thumb .blog-text .post-meta li a { color: #db3742; } .blog-post-thumb .blog-text .post-meta li span { display: inline-block; margin-right: 5px; } .blog-post-thumb .blog-text .text { font-weight: 400; font-size: 14px; color: #647E95; letter-spacing: 0.88px; line-height: 30px; margin-bottom: 15px; } .blog-post-thumb .blog-text .text.post-detail { font-weight: 400; font-size: 16px; line-height: 28px; text-align: left; } .blog-post-thumb .blog-text .post-footer { overflow: hidden; border-bottom: 1px solid #ECF7FF; border-top: 1px solid #ECF7FF; padding-top: 10px; padding-bottom: 10px; } .blog-post-thumb .blog-text .post-footer span { float: left; height: 30px; line-height: 30px; font-weight: 300; font-size: 14px; color: #647E95; } .blog-post-thumb .blog-text .post-footer ul.share { float: right; } .blog-post-thumb .blog-text .post-footer ul.share li { float: left; margin-left: 15px; } .blog-post-thumb .blog-text .post-footer ul.share li a { display: block; height: 30px; line-height: 30px; color: #db3742; } .blog-post-thumb .blog-text .btn-primary-line { margin: auto; width: 100%; margin-top: 30px; margin-bottom: 15px; } .blog-list .blog-post-thumb { margin-bottom: 30px; text-align: left; } .blog-post-thumb img{ width:100%; height: auto; } .blog-list .blog-post-thumb .btn-primary-line { float: left; } .section-comments { margin-bottom: 60px; margin-top: 30px; } .section-comments h5 { margin-bottom: 40px !important; } .section-comments ul { overflow: hidden; margin: 0px; padding: 0px; } .section-comments ul li { overflow: hidden; } .section-comments ul li .avatar { width: 70px; height: 70px; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; overflow: hidden; float: left; margin-right: 20px; } .section-comments ul li .comment-content { font-weight: 400; font-size: 14px; color: #647E95; float: left; width: calc(100% - 90px); width: -webkit-calc(100% - 90px); } .section-comments ul li .comment-content .comment-by { margin-bottom: 10px; position: relative; } .section-comments ul li .comment-content .comment-by strong { display: block; color: #3B566E; } .section-comments ul li .comment-content .comment-by span { font-size: 12px; } .section-comments ul li .comment-content .comment-by .btn-reply { position: absolute; right: 0px; top: 15px; background: #F4F8FB; color: #647E95; height: 25px; line-height: 25px; padding-left: 10px; padding-right: 10px; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } .section-comments ul li .comment-content .comment-by .btn-reply i { font-size: 12px; } .section-comments ul li .comment-content .comment-by .btn-reply:hover { background: #404BCB; color: #fff; } .section-comments ul li ul { padding-left: 90px; } .post-comment { background: #F4F8FB; padding: 40px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; margin-bottom: 30px; } .post-comment .comment-form .form-item { margin-bottom: 20px; } .post-comment .comment-form .form-item label { display: block; text-transform: uppercase; font-weight: 500; font-size: 14px; margin-bottom: 0px; } .post-comment .comment-form .form-item input, .post-comment .comment-form .form-item textarea { border: 1px solid #eee; width: 100%; height: 50px; outline: none; padding-left: 20px; padding-right: 20px; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-appearance: none; -moz-appearance: none; appearance: none; } .post-comment .comment-form .form-item input:focus, .post-comment .comment-form .form-item textarea:focus { border: 1px solid #404BCB; } .post-comment .comment-form .form-item textarea { height: 150px; resize: none; padding: 20px; } .pagination { margin-bottom: 30px; } .pagination .page-item a { font-size: 14px; color:#454545; font-weight: 500; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; margin-left: 3px; margin-right: 3px; background: #e8e8e8; box-shadow: 0 2px 13px 0 rgba(203, 211, 221, 0.36); border: none; position: relative; overflow: hidden; border-radius: 3px !important; width: 37px; height: 37px; text-align: center; padding: 10px; } .pagination .page-item:hover a, .pagination .page-item.active a { font-size: 14px; color: #fff; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; /* margin-left: 3px; margin-right: 3px;*/ background: #db3742; box-shadow: 0 2px 13px 0 rgba(203, 211, 221, 0.36); border: none; position: relative; overflow: hidden; border-radius: 3px !important; width: 37px; height: 37px; text-align: center; padding: 10px; } .pagination .page-item a:before { content: ''; position: absolute; width: 100%; height: 3px; left: 0px; bottom: 0px; background-image: #db3742; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; z-index: 1; } .pagination .page-item a span { position: relative; z-index: 2; } .sr-only{ display: none; } .pagination .page-item a:hover:before { height: 100%; } .pagination .page-item a:hover span { color: #fff; } .page .cover { min-height: 200px; position: relative; } .page .cover:before { content: ''; position: absolute; width: 100%; height: 100%; left: 0px; top: 0px; right: 0px; bottom: 0px; background: rgba(0,0,0.4); z-index: 2; opacity: 0.85; } .page .cover .page-top { position: absolute; width: 100%; bottom: 50px; z-index: 3; } .page .cover .page-top h1 { font-weight: 400; font-size: 36px; line-height: 46px; letter-spacing: 1.4px; color: #fff; text-align: center; } .page .cover .page-top .breadcrumb { float: none; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; background: none; padding: 0px; margin-top: 8px; margin-bottom: 0px; display: block; text-align: center; } .page .cover .page-top .breadcrumb li { font-weight: 400; font-size: 14px; color: #F7F8FF; line-height: 30px; margin-left: 10px; display: inline-block; } .page .cover .page-top .breadcrumb li:after { font-family: FontAwesome; content: "\f105"; margin-left: 10px; color: #F7F8FF; } .page .cover .page-top .breadcrumb li:first-child { margin-left: 0px; } .page .cover .page-top .breadcrumb li:last-child:after { content: ''; margin-left: 0px; } .page .cover .page-top .breadcrumb li a { font-weight: 400; font-size: 14px; color: #fff; } .breadcrumb-menu ul{ margin-bottom: 0; } .breadcrumb-menu ul li { font-weight: 400; font-size: 14px; color: #F7F8FF; line-height: 30px; margin-right: 10px; display: inline-block; } .breadcrumb-menu ul li a { font-weight: 400; font-size: 14px; color: #fff; } /*.breadcrumb-menu ul li:after { font-family: FontAwesome; content: "\f105"; margin-left: 10px; color: #F7F8FF; } .breadcrumb-menu ul li:last-child:after { content: ''; margin-left: 0px; }*/ .page .page-bottom { padding-top: 100px; padding-bottom: 100px; font-weight: 400; font-size: 16px; letter-spacing: 0.88px; line-height: 30px; color: #647E95; } .page .page-bottom p { margin-bottom: 28px; } .page .page-bottom .home-services-item { margin-top: 0px; margin-bottom: 30px; } .page-gallery { height: 400px; display: block; overflow: hidden; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; margin-bottom: 30px; } .page-gallery.small { height: 185px; } .mtop-70 { margin-top: 70px !important; } .mbottom-20 { margin-bottom: 20px !important; } .mbottom-30 { margin-bottom: 30px !important; } .mbottom-60 { margin-bottom: 60px !important; } .mbottom-0 { margin-bottom: 0px !important; } .pbottom-70 { padding-bottom: 70px !important; } .ptop-60 { padding-top: 60px !important; } .pbottom-30 { padding-bottom: 30px !important; } .pbottom-60 { padding-bottom: 60px !important; } blockquote { margin-bottom: 28px; padding: 30px; padding-top: 40px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; background: #F4F8FB; overflow: hidden; } blockquote .text { position: relative; text-align: center; } blockquote .text p { position: relative; width: 100%; z-index: 2; margin-bottom: 10px !important; } blockquote .text:before { font-family: FontAwesome; content: "\f10d"; position: absolute; left: 0px; top: 0px; color: #3B566E; z-index: 1; font-size: 40px; color: #e1ecf4; } blockquote .text:after { font-family: FontAwesome; content: "\f10e"; position: absolute; right: 0px; bottom: 0px; color: #3B566E; z-index: 1; font-size: 40px; color: #e1ecf4; } blockquote .author { color: #3B566E; text-align: center; } @media (max-width: 991px) { .blog-post-thumb.big .img { height: 350px; } .section-comments ul li ul { padding-left: 50px; } } @media (max-width: 420px) { .blog-post-thumb.big .img { height: 200px; } } /* --------------------------------------------- aside --------------------------------------------- */ aside.default-aside .sidebar .box { margin-bottom: 30px; } aside.default-aside .sidebar ul { border: 1px solid #ECF7FF; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; overflow: hidden; margin-bottom: 30px; } aside.default-aside .sidebar ul li.active a { background: #F4F8FB; color: #647E95; } aside.default-aside .sidebar ul li.active a:after { color: #647E95; } aside.default-aside .sidebar ul li.active a:hover { padding-left: 60px; } aside.default-aside .sidebar ul li:last-child a { border: none; } aside.default-aside .sidebar ul li a { display: block; border-bottom: 1px dashed #ECF7FF; height: 40px; line-height: 40px; padding-left: 30px; position: relative; font-weight: 400; font-size: 14px; color: #3B566E; letter-spacing: 0.88px; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; position: relative; } aside.default-aside .sidebar ul li a:hover { padding-left: 40px; } aside.default-aside .sidebar ul li a:after { font-family: FontAwesome; content: "\f105"; position: absolute; left: 20px; color: #3B566E; } aside.default-aside .sidebar ul li a span { float: right; margin-right: 30px; display: inline-block; background: #F4F8FB; height: 20px; line-height: 20px; padding-left: 10px; padding-right: 10px; font-size: 10px; color: #647E95; margin-top: 18px; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; } aside.default-aside .sidebar .search-widget { display: block; margin-bottom: 30px; height: 50px; position: relative; } aside.default-aside .sidebar .search-widget input { border: 1px solid #ECF7FF; position: absolute; width: 100%; height: 100%; outline: none; padding-left: 20px; padding-right: 50px; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-appearance: none; -moz-appearance: none; appearance: none; } aside.default-aside .sidebar .search-widget input:focus { border: 1px solid #db3742; padding-left: 30px; } aside.default-aside .sidebar .search-widget button { position: absolute; z-index: 2; right: 10px; top: 10px; height: 30px; width: 30px; border: none; background-image: linear-gradient(127deg, #3680D6 0%, #4B0FBF 91%); -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; outline: none; cursor: pointer; text-align: center; padding: 0px; } aside.default-aside .sidebar .search-widget button i { color: #fff; } aside.default-aside .sidebar .widget-tags { border: 1px solid #F4F8FB; padding: 30px; padding-bottom: 20px; overflow: hidden; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } aside.default-aside .sidebar .widget-tags a { float: left; margin-right: 10px; margin-bottom: 10px; background: #F4F8FB; padding-left: 10px; padding-right: 10px; font-weight: 400; font-size: 14px; color: #647E95; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } aside.default-aside .sidebar .widget-tags a:hover { background: #db3742; color: #fff; } aside.default-aside .search-widget button .fa-search { background-color: #db3742!important; border: none; display: inline-block; width: 37px!important; height: 36px; color: #f5f5f5; margin-left: -3px; vertical-align: bottom; float: right!important; margin-top: -3px; padding: 10px 12px; border-radius: 0 3px 3px 0; font-size: 15px; cursor: pointer; } .home-services-item { display: block; background-image: linear-gradient(127deg, #fff 0%, #fff 91%); box-shadow: 0 2px 48px 0 rgba(0, 0, 0, 0.06); font-weight: 400; font-size: 14px; color: #647E95; line-height: 28px; letter-spacing: 0.88px; padding: 30px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; margin-bottom: 30px; position: relative; overflow: hidden; } .home-services-item:hover:before, .home-services-item.active:before { height: 100%; } .home-services-item:before { content: ''; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; position: absolute; width: 100%; height: 5px; background: red; bottom: 0px; left: 0px; z-index: 1; background-image: linear-gradient(127deg, #cf0655 0%, #db3742 91%); opacity: 1; -webkit-transition: all 0.3s ease 0s; -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; } @media (max-width: 991px) { .default-aside { margin-bottom: 30px; } } /* * style overrides */ #delete-salon-service .modal-header{ padding: 10px 20px; } #delete-salon-service .btn-delete{ margin-left: 0; } .pagination .previous a, .pagination .previous:hover a, .pagination .next a, .pagination .next:hover a{ width:80px; } .pagination .next a:before{ } #checkout-form .btn-secondry{ background: #191919; } #checkout-form button{ margin-right: 10px; } .login-link{ text-decoration: underline; margin-top: 15px; display: inline-block; cursor: pointer; } .page-wrap{ overflow:hidden; } /* multiselect option */ .drop { position: relative; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; margin-bottom: 10px; } .drop.open { z-index: 100; } .drop.open .drop-screen { z-index: 100; display: block; } .drop.open .drop-options { z-index: 200; max-height: 200px; } .drop.open .drop-display { z-index: 200; border-color: #ccc; } .drop select { display: none; } .drop .drop-screen { position: fixed; width: 100%; height: 100%; background: #000; top: 0px; left: 0px; opacity: 0; display: none; z-index: 1; } .link { text-align: center; margin: 20px 0px; color:#8CACD7; } .drop .drop-display { position: relative; padding: 0px 20px 5px 5px; border: 1px solid #ccc; width: 100%; background: #FFF; z-index: 1; margin: 0px; font-size: 16px; min-height: 48px; } .drop .drop-display:hover:after { opacity: 0.75; } .drop .drop-display:after { font-family: 'FontAwesome'; content: "\f0dd"; position: absolute; right: 10px; top: 12px; font-size: 16px; color: #444; } .drop .drop-display .item { position: relative; display: inline-block; border: 1px solid #db3742; margin: 5px 5px -4px 0px; padding: 0px 25px 0px 10px; overflow: hidden; height: 36px; line-height: 36px; color: #fff; background: #db3742; border-radius: 4px; font-size: 14px; } .drop .drop-display .item .btnclose { color: #fff; position: absolute; font-size: 14px; right: 5px; top: 0; cursor: pointer; } .drop .drop-display .item .btnclose:hover { opacity: 0.75; } .drop .drop-display .item.remove { -webkit-animation: removeSelected 0.2s, hide 1s infinite; animation: removeSelected 0.2s, hide 1s infinite; -webkit-animation-delay: 0s, 0.2s; animation-delay: 0s, 0.2s; } .drop .drop-display .item.add { -webkit-animation: addSelected 0.2s; animation: addSelected 0.2s; } .drop .drop-display .item.hide { display: none; } .drop .drop-options { background: #444; box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.25); position: absolute; width: 100%; max-height: 0px; overflow-y: auto; transition: all 0.25s linear; z-index: 1; } .drop .drop-options a { display: block; height: 40px; line-height: 40px; padding: 0px 20px; color: white; position: relative; max-height: 40px; transition: all 1s; overflow: hidden; } .drop .drop-options a:hover { background: #465; cursor: pointer; } .drop .drop-options a.remove { -webkit-animation: removeOption 0.2s; animation: removeOption 0.2s; max-height: 0px; } .drop .drop-options a.add { -webkit-animation: addOption 0.2s; animation: addOption 0.2s; } .drop .drop-options a.hide { display: none; } /* * custom select box mobile app atelier */ .multiple-select-option-wrap{ position: relative; } .multiple-category-selected{ width: 100%; border: 1px solid #ccc; padding: 4px; min-height:50px; } .multiple-category-selected li{ padding: 10px 10px; background: #db3742; display: inline-block; color: #fff; border-radius: 4px; margin-left: 5px; margin-bottom: 5px; -webkit-animation: addSelected 0.2s; animation: addSelected 0.2s; -webkit-animation-delay: 0s, 0.2s; animation-delay: 0s, 0.2s; } .multiple-category-selected li.remove{ -webkit-animation: removeSelected 0.2s, hide 1s infinite; animation: removeSelected 0.2s, hide 1s infinite; -webkit-animation-delay: 0s, 0.2s; animation-delay: 0s, 0.2s; } .multiple-category-selected li i{ margin-left: 6px; cursor: pointer; } .drop-down-list{ margin-top: -10px; position: absolute; width: 100%; z-index: 999; display: none; } .drop-down-list li{ border-bottom: 1px solid #ccc; } .drop-down-list li label{ padding:5px 10px; } .drop-down-list ul{ border:1px solid #ccc; border-top: none; border-bottom: none; background: #e8e8e8; } .toggle-drop-list{ position: absolute; right: 5px; padding: 0px 10px 6px 10px; background: #ccc; color: #454545; font-size: 20px; line-height: 5px; height: 35px; top:8px; } .toggle-drop-list.open{ background:#454545; color:#fff; } @-webkit-keyframes pop { from { -webkit-transform: scale(0); transform: scale(0); } to { -webkit-transform: scale(1); transform: scale(1); } } @keyframes pop { from { -webkit-transform: scale(0); transform: scale(0); } to { -webkit-transform: scale(1); transform: scale(1); } } @-webkit-keyframes removeOption { from { max-height: 40px; } to { max-height: 0px; } } @keyframes removeOption { from { max-height: 40px; } to { max-height: 0px; } } @-webkit-keyframes addOption { from { max-height: 0px; } to { max-height: 40px; } } @keyframes addOption { from { max-height: 0px; } to { max-height: 40px; } } @-webkit-keyframes removeSelected { from { -webkit-transform: scale(1); transform: scale(1); } to { -webkit-transform: scale(0); transform: scale(0); } } @keyframes removeSelected { from { -webkit-transform: scale(1); transform: scale(1); } to { -webkit-transform: scale(0); transform: scale(0); } } @-webkit-keyframes addSelected { from { -webkit-transform: scale(0); transform: scale(0); } to { -webkit-transform: scale(1); transform: scale(1); } } @keyframes addSelected { from { -webkit-transform: scale(0); transform: scale(0); } to { -webkit-transform: scale(1); transform: scale(1); } } @-webkit-keyframes hide { from, to { max-height: 0px; max-width: 0px; padding: 0px; margin: 0px; border-width: 0px; } } @keyframes hide { from, to { max-height: 0px; max-width: 0px; padding: 0px; margin: 0px; border-width: 0px; } } /* * page edit venue packages */ .venue-package-event-type{ margin-bottom: 20px; } .venue-package-event-type li{ display: inline-block; margin-right: 10px; margin-bottom: 10px; width: 210px; } .venue-package-event-type-wrap h6{ margin-bottom: 16px; } /* * page venue signup */ #venue-signup-form{ width:70%; margin: 0 auto; text-align:center; } #venue-signup-form .btn-wrap{ text-align: right; } #btn-venue-signup{ padding-left: 20px; padding-right: 20px; } #venue-signup-form #location { padding-right: 34px; border: 1px solid #bbb; border-radius: 0; } #venue-signup-form .section-header{ margin-bottom: 60px; } .drafted{ height: 25px; padding: 3px 10px; background: #9E9E9E; color: #fff; font-size: 12px; border-radius: 4px; } /* * page venue profile */ .gallery-single-image-preview{ position: relative; display: inline-block; vertical-align: top; margin: 5px; min-height: 100px; } .ma-gallery-image{ border-radius: 3px; overflow: hidden; width: 90px; height: 90px; position: relative; transition: all 0.3s; display: block; z-index: 10; } .delete-gallery-image{ z-index: 500; position: absolute; display: block; top: 10px; right: 10px; margin-left: 0; margin-top: 0; border-radius: 100px; width: 40px; height: 40px; background: rgba(255, 255, 255,.8); color: #db3742; font-size: 20px; padding: 0; font-size: 18px; cursor: pointer; } .ma-gallery-image img{ display: block; filter: blur(0px); transition: all 0.4s; width: 100%; height: 100%; } .gallery-single-image-preview:hover .ma-gallery-image img { display: block; filter: blur(5px); transition: all 0.4s; } .upload-logo { margin-top: 15px; } /* * custom service option */ .add-custom-services{ margin-bottom: 30px; } .btn-add-service{ display: block; border-radius: 4px; font-size: 14px; text-align: center; font-weight: 600; height: 40px; width: 200px; padding: 10px 20px; background: none; border: 1px dashed #454545; color: #454545; position: relative; padding-left: 40px; } .btn-add-service i{ position: absolute; left: 10px; font-size: 18px; border-right: 1px solid #454545; padding-right: 8px; } .btn-add-service:hover{ border: 1px dashed #db3742; color:#db3742; } #cust_services li{ display: inline-block; padding: 10px 20px; background: #db3742; border-radius: 4px; color: #fff; margin-right: 10px; position: relative; padding-left: 40px; overflow: hidden; margin-top: 6px; padding-right: 45px; } #cust_services li i{ margin-right: 5px; position: absolute; left: 1px; padding: 10px 10px; top: 1px; color: #ffffff; border-radius: 4px; } #cust_services li i.remove-icon{ right: -5px; left: inherit; background: #333; color: #fff; top: 0; bottom: 0; padding: 12px 10px; cursor: pointer; } .close-service-form { position: absolute; right: -7px; font-size: 22px; top: -7px; cursor: pointer; } .add-custom-service-form{ padding: 15px; background: #fff; border-radius: 4px; max-width: 100%; margin-bottom: 0; position: relative; } .add-custom-service-form .select { border:1px solid #ccc; display: inline-block; } .add-custom-service-form .select ul li{ font-size: 15px; } .add-custom-service-form #custom-service-name{ border-radius: 4px; height: 40px; display: inline-block; } .btn-add-custom-service{ background: #454545; color: #fff; height: 38px; display: block; padding: 8px; } /* *single venue */ #venue-banner-slider .owl-controls .owl-buttons .owl-prev{ margin-left: 40px; } #venue-banner-slider .owl-controls .owl-buttons .owl-next{ margin-right: 40px; } .venue-brand-logo{ text-align: right; } .venue-brand-logo img{ width: 100px; height: auto; } @media(max-width: 767px){ .top-header { background: none; padding: 5px 0; } .salon-overlay .container { width: 100%; } .listing-details-wrap { padding: 0px 0px; padding-top: 10px; } /* * single venue */ .venue-info{ position: relative; background: #f3f3f3; } .venue-info h1 { font-size: 22px; line-height: 28px; color: #db3742; font-weight: 600; margin-top: 0; text-shadow: none; margin-bottom: 5px; } .venue-banner .owl-pagination { position: absolute; text-align: center; right: 0; left: 0; margin-top: -50px; } #venue-banner-slider .owl-controls .owl-buttons .owl-prev { margin-left: 20px; } #venue-banner-slider .owl-controls .owl-buttons .owl-next { margin-right: 20px; } .contact-info span, .contact-info span a{ color: #454545; } .breadcrumb-menu ul li a { font-weight: 500; font-size: 13px; color: #454545; } .breadcrumb-menu ul li { font-weight: 500; font-size: 13px; color: #db3742; line-height: 30px; margin-right: 10px; display: inline-block; } .time-slot, .change-lane{ width:100px; } } .cookies-popup{ position: fixed; width: 100%; text-align: center; border: 0; background: #db3742; z-index: 999; bottom: 0px; padding: 15px 0; color: #ffffff; } .cookies-popup a{ color:#f3f3f3; text-decoration: underline; } #btn-accept-cookie{ background: #f3f3f3; padding: 10px 10px; color: #454545; margin-left: 10px; } .list-btns-game-type{ margin-bottom:20px; } .list-btns-game-type li{ display:inline-block; margin-right:10px; } .list-btns-game-type li a{ background: #fff; border: 1px solid; font-size: 13px;; } .list-btns-game-type li a.active { background: #db3742; border: 1px solid; color: #fff; } .food-tabs.fixed-menu { position: fixed; width: 100%; top: 0px; left: 0px; right: 0px; z-index: 999; } .cart-section.fixed-cart { position: fixed; right: 20px; z-index: 999; background:#fff; width:370px; padding:20px; top:150px; height:500px; overflow-Y:scroll; } .cart-section .ready-checkout { display:none; } .cart-section.fixed-cart .ready-checkout { display:none; } .cp-tooltip { width: 50%; position: absolute; top: 50%; background: rgba(0,0,0,1); padding: 50px; z-index: 9999; left: 50%; transform: translate(-50%, -50%); color: #fff; border-radius: 10px; } a.close-tool-tip { font-size: 20px; color: #fff; position: absolute; top: 0px; right: 0px; background: #000; } .right-side-widget { display: inline-block; position: fixed; top: 200px; right: 0px; z-index: 9999; } .right-side-widget ul { width: 45px; margin: 0; padding: 0; list-style: none; } .right-side-widget ul li { -moz-box-shadow: 0 0 5px rgba(0,0,0,0.1); -webkit-box-shadow: 0 0 5px rgba(0,0,0,0.1); box-shadow: 0 0 5px rgba(0,0,0,0.1); transition: All .5s ease-in-out; -webkit-transition: All .5s ease-in-out; -moz-transition: All .5s ease-in-out; -o-transition: All .5s ease-in-out; float: right; width: 45px; height: 45px; background-color: #FFF; margin-bottom: 1px; position: relative; overflow: hidden; cursor: pointer; } .right-side-widget ul li i { display: block; width: 45px; height: 45px; color: #db3742; font-size: 26px; line-height: 45px; text-align: center; position: absolute; top: 0; right: 0; } .right-side-widget ul li a { display: block; line-height: 45px; color: #db3742; font-size: 20px; text-align: left; padding-left: 10px; } .right-side-widget ul li p { opacity: 0; font-size: 14px; white-space: nowrap; padding-top:10px; } .right-side-widget ul li:hover { background: #db3742; width: auto; padding-right: 45px; overflow: visible; color:#fff; } .right-side-widget ul li:hover a { color:#fff; } .right-side-widget ul li:hover i { color:#fff; } .right-side-widget ul li:hover p { opacity: 1; color:#fff; } .cat p { margin-bottom: 5px; } #checkout-form .button { float: left; margin: 0 5px 10px 0; width: 100px; height: 40px; position: relative; } #checkout-form .button label, #checkout-form .button input { display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; } #checkout-form .button input[type="radio"] { opacity: 0.011; z-index: 100; } #checkout-form .button input[type="radio"]:checked + label { background: #db3742; border-radius: 4px; color:#fff; } #checkout-form .button label { cursor: pointer; z-index: 90; line-height: 1.8em; } .btn-proceed.visible-xs { display:none; }