/************************************************ Css Table Of Content ----------------------- 01. Resset Css 02. Typogrpahy -Font Typography -Color Typography -Hedding Tag Typography 03. Scroll Top CSS 04. Global Style *************************************************/ /*--------------01. Start Resset Css------------------*/ * { margin: 0px; padding: 0px; } *:focus { box-shadow: none; border: none; outline: none; } body, p { padding: 0px; font-size: 15px; line-height: 26px; margin: 0px auto; color: #515151; font-family: 'Arimo', sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } body, html { height: 100%; } h1, h2, h3, h4, h5, h6, p, figur, a { margin: 0px; font-weight: normal; } h1, h2, h3, h4, h5, h6 { font-family: 'Roboto', sans-serif; -webkit-font-variant-ligatures: common-ligatures; font-variant-ligatures: common-ligatures; } a { text-decoration: none; } a:hover, a:focus, input:focus, button:focus, a:active { text-decoration: none; outline: none; outline-offset: 0px; box-shadow: none; } ul { list-style: none; margin: 0; padding: 0; } input, textarea, select { border: 1px solid #d1d1d1; font-size: 14px; padding: 8px 15px; width: 100%; margin: 0 0 20px 0; max-width: 100%; resize: none; } input[type=radio], input[type=checkbox], input[type=file] { width: auto; } /*------------0.1 End Resset Css----------------------*/ /*--------------------02. Typography------------------*/ /*------font weight Typography-------*/ .fw-200 { font-weight: 200; }.fw-300 { font-weight: 300; }.fw-400 { font-weight: 400; }.fw-500 { font-weight: 500; }.fw-600 { font-weight: 600; }.fw-700 { font-weight: 700; }.fw-800 { font-weight: 800; }.fw-900 { font-weight: 900; } /*--------color Typography-------*/ .color-11 { color: #111111; }.color-22 { color: #222222; }.color-33 { color: #333333; }.color-44 { color: #444444; }.color-55 { color: #555555; }.color-66 { color: #666666; }.color-dd { color: #dddddd; }.color-ee { color: #eeeeee; }.color-ff { color: #ffffff; }.color-00 { color: #000000; } /*-------background color----*/ .bg-none { background-color: transparent; } /*-------heading Typogrpahy--------*/ h1{ font-size: 62px; line-height: 70px; } h2{ font-size: 44px; line-height: 55px; } h3{ font-size: 35px; line-height: 45px; } h4{ font-size: 30px; line-height: 40px; } h5 { font-size: 20px; line-height: 36px; } h6 { font-size: 18px; line-height: 24px; } /*-------------03. scroll top css-----------*/ .scroll-top { border-radius: 3px; bottom: 50px; cursor: pointer; height: 40px; position: fixed; right: 30px; text-align: center; width: 40px; z-index: 999; } .not-visible { visibility: hidden; display: none; } .scroll-top i { color: #fff; font-size: 24px; line-height: 38px; } /*-------------04. Global style---------------*/ .pos-relative { position: relative; } .overlay { position: absolute; left: 0; top: 0; width: 100%; height: 100%; } /*---------border-radius-------*/ .radius-3 { border-radius: 3px; }.radius-5 { border-radius: 5px; }.radius-10 { border-radius: 10px; }.radius-50 { border-radius: 50px; }.radius-100p { border-radius: 100%; } .opacity1 {opacity:0.1} .opacity2 {opacity:0.2} .opacity3 {opacity:0.3} .opacity4 {opacity:0.4} .opacity5 {opacity:0.5} .opacity6 {opacity:0.6} .opacity7 {opacity:0.7} .opacity8 {opacity:0.8} .opacity9 {opacity:0.9} .comment-form-section form input, .getin-section .get-in form input, .getin-section .get-in form textarea, .comment-form-section form textarea, .getin-section .get-in form button.send-msg, .comment-form-section form button, .widget_search button, .product-review-tab .review .review-form button, .product-details-wrapper .add-cart-area li.qty i, .experts-section .expert-hover .bio i, .beauty-header, .beauty-header .menuzord-menu > li a, .beauty-header .custom-logo, #search-button, .scroll-top, .scroll-top i, .video-content i, .home3-hero .mouse, .footer-widget .newsletter-widget button, .single-blog .img-area img, .product-carousel-wrapper .owl-prev, .product-carousel-wrapper .owl-next, .beautyLab-gallery .filtering-menu li, .service-section .img-over-content, .service-section .img-over-content a, .service-section .img-over-content i, .service-section .single-service .divider, .service-section .single-service p, .service-section .single-service img, .booking-section .booking-wrapper form button, .booking-section .booking-wrapper .single-input .nice-select:focus, .booking-section .booking-wrapper .single-input input:focus, .booking-section .booking-wrapper .single-input textarea:focus, .welcome-carousel-wrapper .slick-prev:before, .welcome-carousel-wrapper .slick-next:before, .welcome-section .single-feature i, .welcome-section .feature-content h6, #search-button i, .home1-slider .Modern-Slider .PrevArrow, .home1-slider .Modern-Slider .NextArrow, .transition-3s, a { -webkit-transition: all 0.3s linear; -moz-transition: all 0.3s linear; -ms-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; } .product-gallery .product-hover, .product-gallery .product-price, .product-gallery .single-product, .product-gallery .product-divider, .product-gallery .product-price h6, .product-gallery .product-hover ul { -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .transition-5s { -webkit-transition: all 0.5s linear; -moz-transition: all 0.5s linear; -ms-transition: all 0.5s linear; -o-transition: all 0.5s linear; transition: all 0.5s linear; } .nice-select { float: none; width: 100%; border-radius: 2px; margin-bottom: 10px; border: solid 1px #d1d1d1; } .nice-select:after { height: 7px; width: 7px; } .nice-select:active, .nice-select.open, .nice-select:focus { border-color: #d1d1d1; } .nice-select ul.list { width: 100%; max-height: 250px; overflow: auto; } .nice-select ul.list li { margin-bottom: 0; } /*---------------flex utility------------*/ .align-center-center { display: flex; flex-flow: column; align-items: center; justify-content: center; } .align-col-left-center { display: flex; flex-flow: column; align-items: flex-start; justify-content: center; } .align-col-left-bottom { display: flex; flex-flow: column; align-items: flex-start; justify-content: flex-end; } .align-col-right-center { display: flex; flex-flow: column; align-items: flex-end; justify-content: center; } .align-col-right-bottom { display: flex; flex-flow: column; align-items: flex-end; justify-content: flex-end; } .align-col-center-bottom { display: flex; flex-flow: column; align-items: center; justify-content: flex-end; } .align-row-left-top { display: flex; flex-flow: row wrap; align-items: flex-start; justify-content: flex-start; } .align-row-left-center { display: flex; flex-flow: row wrap; align-items: center; justify-content: flex-start; } .align-row-right-center { display: flex; flex-flow: row wrap; align-items: center; justify-content: flex-end; } .align-row-center-center { display: flex; flex-flow: row wrap; align-items: center; justify-content: center; } .align-row-spacebetween { display: flex; flex-flow: row wrap; align-items: center; justify-content: space-between; } .display-block { display: block; } .display-inline li { display: inline-block; } .site-main .inner-page .page { margin-bottom: 0; } /* --------04. End GLOBAL style css ------**/ /*--padding top bottom---*/ .ptb-50 { padding: 50px 0; }.ptb-45 { padding: 45px 0; }.ptb-40 { padding: 40px 0; }.ptb-35 { padding: 35px 0; }.ptb-30 { padding: 30px 0; }.ptb-25 { padding: 25px 0; }.ptb-20 { padding: 20px 0; }.ptb-15 { padding: 15px 0; }.ptb-10 { padding: 10px 0; }.ptb-5 { padding: 5px 0; }.p-0 { padding: 0px; } /*---padding top---*/ .pt-0 { padding-top: 0; }.pt-5 { padding-top: 5px; }.pt-10 { padding-top: 10px; }.pt-15 { padding-top: 15px; }.pt-20 { padding-top: 20px; }.pt-25 { padding-top: 25px; }.pt-30 { padding-top: 30px; }.pt-35 { padding-top: 35px; }.pt-40 { padding-top: 40px; }.pt-45 { padding-top: 45px; }.pt-40 { padding-top: 40px; } /*---padding bottom---*/ .pb-0 { padding-bottom: 0 }.pb-5 { padding-bottom: 5px; }.pb-10 { padding-bottom: 10px; }.pb-15 { padding-bottom: 15px; }.pb-20 { padding-bottom: 20px; }.pb-25 { padding-bottom: 25px; }.pb-30 { padding-bottom: 35px; }.pb-35 { padding-bottom: 35px; }.pb-40 { padding-bottom: 40px; }.pb-45 { padding-bottom: 45px; }.pb-40 { padding-bottom: 40px; } /*---padding-left---*/ .pl-0 { padding-left: 0px; }.pl-5 { padding-left: 5px; }.pl-10 { padding-left: 10px; }.pl-15 { padding-left: 15px; }.pl-20 { padding-left: 20px; }.pl-25 { padding-left: 25px; }.pl-30 { padding-left: 30px; }.pl-35 { padding-left: 35px; }.pl-40 { padding-left: 40px; }.pl-45 { padding-left: 45px; }.pl-40 { padding-left: 40px; } /*---padding-right---*/ .pr-0 { padding-right: 0px; }.pr-5 { padding-right: 5px; }.pr-10 { padding-right: 10px; }.pr-15 { padding-right: 15px; }.pr-20 { padding-right: 20px; }.pr-25 { padding-right: 25px; }.pr-30 { padding-right: 30px; }.pr-35 { padding-right: 35px; }.pr-40 { padding-right: 40px; }.pr-45 { padding-right: 45px; }.pr-40 { padding-right: 40px; } /*-----margin bottom-----*/ .mb-0 { margin-bottom: 0px; }.mb-5 { margin-bottom: 5px; }.mb-10 { margin-bottom: 10px; }.mb-15 { margin-bottom: 15px; }.mb-20 { margin-bottom: 20px; }.mb-25 { margin-bottom: 25px; }.mb-30 { margin-bottom: 30px; } /*-----margin top-------*/ .mt-0 { margin-top: 0px; }.mt-10 { margin-top: 10px; }.mt-15 { margin-top: 15px; }.mt-20 { margin-top: 20px; }.mt-25 { margin-top: 25px; }.mt-30 { margin-top: 30px; } /*-----margin left------*/ .ml-0 { margin-left: 0px; }.ml-10 { margin-left: 10px; } /*-----margin right------*/ .mr-0 { margin-right: 0px; }.mr-10 { margin-right: 10px; }