@import 'common.scss'; .container{ max-width: 1200px; width: 100%; } .no-padding{ padding-left: 0; padding-right: 0; } .no-gutter{ padding-left: 0; padding-right: 0; } .gray-bgc{ background: $(color-1); } .blue-bgc{ background: $(color-10); margin-top: 37px; } .space-top{ margin-top: 15px; } body{ background: url(../images/body-background.jpg) center top no-repeat; font-size: 16px; font-family: $(font-3); overflow-x: hidden; } header{ .patient-login-and-search{ color: $(color-1); font-size: 15px; padding-top: 5px; padding-bottom: 8px; background-color: $(color-2); span{ float: right; position: relative; display: block; margin-top: 10px; &:hover{ cursor: pointer; } &:before{ content: ""; border-left: 1px solid $(color-1); height: 45%; position: absolute; top:6px; left:-13px; display: block; } } a{ font-family: $(font-2); display: block; text-decoration: none; text-transform: uppercase; float: right; color: $(color-3); margin-right: 28px; letter-spacing: 0.3px; &:hover{ color: $(color-6); } } } .contact-details{ background-color: $(color-1); .logo{ margin-top: -34px; display: inline-block; float: left; img{ width: 100%; max-width: 349px; } } .derectory{ float: left; margin-left: 28px; margin-top: 25px; line-height: 19px; a{ font-family: $(font-3); font-weight: bold; text-decoration: none; font-size: 14px; color: #094c85; &:hover{ color: $(color-3); } } } .phone{ font-weight: bold; font-size: 24px; float: right; margin-top: 22px; letter-spacing: 1px; text-decoration: none; color: #07487c; span{ display: block; text-align: right; font-size: 14px; } } .address{ font-weight: bold; float: right; text-align: right; font-size: 14px; letter-spacing: 0.9px; line-height: 24px; margin-top: -2px; text-transform: uppercase; color: #07487c; span{ margin-left: 6px; } } } .top-menu{ ul{ display: block; list-style-type: none; margin-bottom: 0; padding-left: 35px; background-color: $(color-2); li{ float: left; padding-top: 22px; padding-bottom: 22px; position: relative; padding-right: 21px; &.down-arrow > a{ position: relative; display: block; text-align: left !important; &:before{ content: "\f107"; font-family: 'FontAwesome'; position: absolute; bottom: 0px; right: -13px; display: block; font-size: 11; } } &:last-child{ padding-right: 0; } a{ text-decoration: none; text-transform: uppercase; text-align: center; font-size: 15px; font-family: $(font-1); color: $(color-1); letter-spacing: 0.5px; &:hover,&.active{ color: $(color-3); } } ul{ width: 580px; top: 67px; left: 0; position: absolute; z-index: 500; padding-left: 32px; padding-right: 32px; padding-bottom: 20px; display: none; background: #034579; &.full-width{ width: 250px; span{ width: 100%; border-right: none; } } span{ width: 50%; padding-top: 22px; float: left; display: block; border-right: 1px solid rgba(255,255,255, 0.10); &.second-set{ font-size: 15px; text-transform: uppercase; border-right: none; li{ padding-left: 30px; ul{ left: 257px; padding-bottom: 0; top: 0; width: 100%; background: $(color-3); li{ padding-left: 10px; text-align: left; a{ &:hover, &.active{ color: $(color-2); font-weight: bold; } } } &.tooth-tale{ width: 268px; } } } } li{ padding-top: 0; padding-bottom: 0; padding-right: 0; width: 100%; border-bottom: 1px solid rgba(255,255,255, 0.10); &.arrow-d > a{ &:before{ content: "\f105"; font-family: 'FontAwesome'; position: absolute; bottom: 0px; right: -13px; display: block; font-size: 11; right: 10px !important; } } &.border-reset{ border-bottom: none; } a{ font-family: $(font-3); height: 36px; line-height: 36px; } ul{ left: 257px; padding-bottom: 0; top: 0; width: 100%; background: $(color-3); li{ a{ &:hover, &.active{ color: $(color-2); font-weight: bold; } } } } } } } &:hover > ul{ display: block; moz-animation: fadeInUp 0.5s ease-in; -webkit-animation: fadeInUp 0.5s ease-in; animation: fadeInUp 0.5s ease-in; } } } .bgc{ background-color: $(color-2); } &.isStuck{ background: #074f88; z-index: 2000; } } } .slider-imags{ position: relative; .carousel-control{ font-size: 20px; position: absolute; top: 50%; margin-top: -10px; background: none; } .carousel-indicators{ position: absolute; bottom: 90px; } img{ width: 100%; margin-bottom: 75px; } &.inner{ img{ padding: 0; margin-bottom: 49px; } } .carousel.fade { opacity: 1; } .carousel.fade .item { transition: opacity ease-out 2s; left: 0; opacity: 0; /* hide all slides */ top: 0; position: absolute; width: 100%; display: block; } .carousel.fade .item:first-child { top: auto; opacity: 1; /* show first slide */ position: relative; } .carousel.fade .item.active { opacity: 1; } /* Controllers background image remove and font size reduce */ .carousel-control.right, .carousel-control.left { background: none !important; filter: progid: none !important; outline: 0; transition: all 0.3s ease 0s; } .carousel .carousel-control { opacity: 0; } .carousel:hover .carousel-control { opacity: 1; text-shadow: 0 1px 1px rgba(0,0,0,.3); } .carousel-control{ font-size: 20px; top:50%; } } .testimonial-welcome{ background: rgba(255, 255, 255, 0.8); &.review-page{ margin-top: 55px; background-color: #CBCBCB; } .welcome{ margin-top: 49px; padding-bottom: 35px; padding-left: 39px; h1{ font-size: 36px; font-family: $(font-1); text-transform: uppercase; color: $(color-2); margin-bottom: 30px; } .welcome-wrapper{ margin-top: 20px; line-height: 24px; letter-spacing: 0.5px; &.inner{ font-weight: normal; .video{ img{ max-width: 100%; display: block; margin-left: auto; margin-right: auto; margin-top: 21px; margin-bottom: 40px; } } } .before-after-gallery{ background: $(color-1); padding-top: 33px; padding-bottom: 34px; padding-left: 78px; padding-right: 79px; margin-top: 34px; position: relative; margin-bottom: 33px; .carousel-control{ font-size: 30px; color: $(color-19); position: absolute; top: 50%; margin-top: -15px; height: 30px; width: 30px; } .carousel-control.left,.carousel-control.right{ background: none; } .carousel-control.left{ left: -33px; } .carousel-control.right{ right: -33px; } } .featured-articles{ margin-top: 30px; color: $(color-2); h2{ font-size: 18px; font-family: $(font-3-b); text-transform: uppercase; letter-spacing: 0.5px; margin-top: 30px !important; margin-bottom: 30px !important; &.article-heading{ font-size: 14px !important; } } ul{ padding-left: 0; line-height: 13px; li{ list-style-type: none; padding-bottom: 13px; a{ letter-spacing: 0.4px; color: $(color-2); span{ font-size: 10px; padding-right: 7px; } } } } } } .article{ h2{ font-size: 18px; color: $(color-2); margin-top: 25px; font-weight: bold; text-transform: uppercase; letter-spacing: 0.1px; margin-bottom: 20px; } p{ line-height: 24px; a{ color: $(color-2); } } } } .testimonials{ background: url(../images/testimonial-background.jpg) top center no-repeat; margin-top: 55px; -webkit-background-size: cover; background-size: cover; h2{ text-align: center; font-size: 18px; margin-top: 196px; padding-top: 17px; padding-bottom: 17px; text-transform: uppercase; font-weight: bold; letter-spacing: 1px; background-color: $(color-4); color: $(color-2); margin-bottom: 0; } .testimonials-text{ text-align: center; color: $(color-6); font-family: $(font-3-i); font-size: 18px; background: $(color-5); &.home{ padding-bottom: 43px; } span.quote{ margin-top: 15px; margin-bottom: 15px; display: block; } .stars{ padding-top: 15px; letter-spacing: 2px; display: block; color: #FFD700; i{ font-size: 16px; font-style: normal; } lable{ font-weight: normal; font-size: 12px; font-style: normal; } } .text-wrapper{ letter-spacing: 0.7px; padding-left: 20px; padding-right: 20px; padding-top: 10px; line-height: 24px; } } &.appointment{ background: none; margin-top: 46px; background: #0f4c85 url(../images/appointment-form-bgc.jpg) top center no-repeat; h2{ margin-top: 119px; } form{ padding-bottom: 34px; padding-top: 25px; padding-left: 40px; padding-right: 40px; color: $(color-20); input, select, textarea, button{ width: 100%; border: none; background: $(color-21); height: 30px; margin-bottom: 18px; text-align: center; font-size: 16px; font-family: $(font-3); } textarea{ height: 68px; } button{ height: 34px; width: 100px; margin-bottom: 0; background: $(color-17); &:hover{ color: $(color-6); border: 1px solid $(color-6); } } select{ -webkit-appearance: none; -moz-appearance: none; appearance: none; } } } } } .boxes-wrapper{ margin-top: 20px; margin-bottom: 20px; position: relative; a{ display: block; overflow: hidden; img{ width: 100%; max-width: 400px; transition: all .2s ease-in-out; -webkit-transition: all 0.5s linear; transition: all 0.5s linear; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } .boxes-text{ position: absolute; top:115px; left: 0; right: 0; line-height: 20px; letter-spacing: 0.5px; color: $(color-6); text-align: center; text-decoration: none; h2{ text-transform: uppercase; font-size: 18px; font-weight: bold; text-shadow: 1px 1px rgba(0,0,0,.47); } p{ margin-bottom: 0; text-shadow: 1px 1px rgba(0,0,0,.47); } h3{ margin-top: 0; margin-bottom: 0; text-transform: uppercase; font-weight: bold; font-size: 16px; text-shadow: 1px 1px rgba(0,0,0,.47); } span{ -webkit-border-radius: 50%; -moz-border-radius: 50; border-radius: 50; border: 3px solid $(color-7); width: 42px; height: 42px; background: $(color-8); display: block; margin-left: auto; margin-right: auto; text-align: center; margin-top: -4px; font-size: 14px; i{ padding-top: 12px; padding-left: 5px; } } } &:hover{ img{ -webkit-transform: scale3d(1.2, 1.2, 1); transform: scale3d(1.2, 1.2, 1); } } } } .top10-newsletter{ padding-bottom: 20px; h2{ font-size: 18px; text-transform: uppercase; font-weight: bold; margin-top: 51px; letter-spacing: 0.2px; color: $(color-2); text-align: left; margin-bottom: 20px; } .dentist-video{ float: left; padding-right: 35px; max-width: 100%; p{ padding-left: 10px; display: block; margin-top: -3px; letter-spacing: 0.7px; line-height: 24px; } } .top10{ margin-top: 46px; margin-bottom: 14px; a{ color: $(color-6); text-decoration: none; display: block; min-height: 70px; position: relative; &:before{ content: ""; display: block; position: absolute; top: 0; left: 0; height: 100%; background-color: $(color-9); width: 24.83%; } span{ font-size: 48px; font-family: $(font-3-b); display: inline-block; margin: 0; width: 24.83%; letter-spacing: -2px; background-color: $(color-9); float: left; text-align: center; position: relative; z-index: 2; } .cometic-dentist{ float: left; color: $(color-10); background-color: $(color-11); width: 75.17%; min-height: 70px; p{ float: left; display: block; letter-spacing: 0.9px; margin-bottom: 0; padding-left: 28px; margin-top: 10px; } label{ float: left; font-size: 18px; text-transform: uppercase; margin-bottom: 0; cursor: pointer; padding-left: 25px; } } } } .newsletter{ label{ text-align: center; font-size: 18px; font-weight: normal; text-transform: uppercase; letter-spacing: 0.5px; display: block; padding-top:49px; line-height: 24px; margin-bottom: 0; padding-bottom: 21px; background: $(color-10); color: $(color-6); } img{ max-width: 100%; } p{ text-align: center; margin-bottom: 0; padding-top: 20px; padding-bottom: 30px; letter-spacing: 0.7px; color: $(color-6); background: $(color-10); a{ font-weight: bold; color: $(color-12); text-decoration: none; &:hover{ color: $(color-3); } } } #newsletter-carousel{ position: relative; .carousel-control.left,.carousel-control.right{ background-image: none; font-size: 24px; position: absolute; bottom: 27px; height: 30px; width: 30px; top: auto; color: #000; } .carousel-control.left{ left: 35px; } .carousel-control.right{ right: 35px; } } } } .gallery{ position: relative; a{ display: block; height: 237px; .boxes-text{ position: absolute; top:115px; left: 0; right: 0; line-height: 20px; letter-spacing: 0.5px; color: $(color-6); text-align: center; text-decoration: none; h2{ text-transform: uppercase; font-size: 18px; font-weight: bold; } p{ margin-bottom: 0; } h3{ margin-top: 0; margin-bottom: 0; text-transform: uppercase; font-weight: bold; font-size: 16px; } span{ -webkit-border-radius: 50%; -moz-border-radius: 50; border-radius: 50; border: 3px solid $(color-7); width: 42px; height: 42px; background: $(color-8); display: block; margin-left: auto; margin-right: auto; text-align: center; margin-top: -4px; font-size: 14px; i{ padding-top: 12px; padding-left: 5px; } } } &.preschoolers-in-surgery{ background: url(../images/preschooler-in-sergery.jpg) top center no-repeat; background-size: cover; } &.two-beautiful-smiles{ background: url(../images/two-beautiful-smile.jpg) top center no-repeat; background-size: cover; } .images-gallery{ text-align: center; font-family: $(font-3-b); letter-spacing: 1px; background: $(color-24); h2{ font-size: 18px; font-family: $(font-3-b); text-transform: uppercase; margin-top: 0; margin-bottom: 0; padding-top: 36px; letter-spacing: 1px; color: $(color-6); padding-bottom: 22px; } img{ width: 100%; max-width: 335px; } h3{ font-size: 16px; color: $(color-13); margin-top: 0; margin-bottom: 0; padding-top: 15px; padding-bottom: 36px; &:hover{ color: $(color-3); } } } } } .fan-review-and-articles{ .fan-review{ padding-top: 56px; padding-bottom: 48px; background: $(color-10); a{ display: block; text-align: center; img{ max-width: 100%; padding-bottom: 12px; } } } .articles{ padding-top: 52px; padding-left: 49px; color: $(color-2); h2{ font-size: 18px; font-family: $(font-3-b); text-transform: uppercase; margin-top: 0; letter-spacing: 0.5px; margin-bottom: 16px; } ul{ padding-left: 0; li{ list-style-type: none; padding-bottom: 13px; a{ letter-spacing: 0.4px; color: $(color-2); span{ font-size: 10px; padding-right: 7px; } } } } } .featured-articles{ padding-left: 30px; h2{ font-family: $(font-3-b); font-size: 18px; letter-spacing: 0.5px; margin-top: 20px; text-transform: uppercase; color: $(color-2); } ul{ line-height: 13px; padding-left: 0; li{ list-style-type: none; padding-bottom: 13px; a{ color: #074f88; letter-spacing: 0.4px; } } } } } .memberships-brands{ padding-bottom: 57px; background: $(color-1); .memberships{ padding-left: 14px; padding-right: 14px; padding-bottom: 14px; a{ position: relative; padding-bottom: 0 !important; width: 9.68%; &:before{ content: ""; display: block; position: absolute; top: 0; right: 0; width: 1px; height: 100%; background: $(color-15); } &.ada{ width: 11.46%; } &.aadom{ width: 15.97%; } &.spear{ width: 13.76%; &:before{ display: none; } } } } .memberships, .brands{ background: $(color-15); h2{ text-align: center; font-size: 18px; text-transform: uppercase; font-family: $(font-3-b); letter-spacing: 0.6px; padding-bottom: 21px; margin-bottom: 0; margin-top: 0; padding-top: 19px; color: $(color-10); } a{ display: block; float: left; img{ max-width: 100%; } } } .brands{ background: $(color-9); padding-right: 11px; padding-left: 11px; padding-bottom: 12px; a{ padding-bottom: 0; position: relative; cursor: default; &:before{ content: ""; top: 0; right: 0; display: block; position: absolute; width: 1px; background: $(color-9); height: 100%; } &.ezlase{ width: 17.41%; } &.kor{ width: 17.07%; } &.invisalign{ width: 23.02%; } &.biolase{ width: 15.46%; } &.waterlase-dentistry{ width: 26.67%; &:before{ display: none; } } } } } footer{ background: $(color-17); .social-media{ a{ padding-top: 11px; padding-bottom: 18px; display: block; float: left; margin-right: 13px; .first{ margin-left: 24px; } } } .sign-up-mail{ p{ text-transform: uppercase; font-size: 14px; padding-top: 16px; padding-bottom: 18px; margin-bottom: 0; font-family: $(font-3-b); padding-left: 93px; letter-spacing: 1.05px; color: $(color-6); float: left; } form{ margin-left: 5px; float: left; margin-top: 15px; position: relative; max-width: 182px; input{ border: none; width: 100%; background: $(color-1); font-size: 14px; padding-left: 11px; letter-spacing: 1px; color: $(color-10); height: 24px; } button{ font-size: 14px; position: absolute; top: 0; right: 0; background: $(color-1); font-family: $(font-3-b); color: $(color-10); border: none; width: 36px; height: 100%; } } a{ text-align: center; text-transform: uppercase; font-size: 12px; margin-left: 5px; padding-left: 18px; padding-bottom: 6px; margin-top: 13px; display: inline-block; padding-top: 5px; letter-spacing: 1px; padding-right: 13px; color: $(color-16); background: $(color-17); text-decoration: none; margin-bottom: 15px; width: 182px; height: 28px; } } .footer-menu{ ul{ margin-top: 30px; text-align: center; li{ display: inline-block; list-style-type: none; margin-right: 36px; a{ text-decoration: none; color: $(color-6); &:hover,&.active{ color: $(color-18); } } } } } .address{ margin-top: 16px; color: $(color-6); p{ font-size: 14px; text-align: center; letter-spacing: 0.6px; span{ font-size: 12px; } a{ text-decoration: none; color:$(color-6); } } } .copyright{ margin-top: 2px; color: $(color-6); padding-bottom: 51px; p{ text-align: center; font-size: 14px; letter-spacing: 0.5px; margin-bottom: 0; } } } .left-column-inner{ .educational-video{ display: block; text-align: center; margin-top: 35px; position: relative; img{ max-width: 100%; } h2{ text-transform: uppercase; text-shadow: 1px 1px rgba(0,0,0,.47); font-size: 18px; font-family: $(font-3-b:); color: $(color-6); margin-bottom: 0; margin-top: 0; position: absolute; top: 57%; left: 0; right: 0; margin-left: auto; margin-right: auto; letter-spacing: 1px; } } } .review{ margin-top: 36px; padding-top: 58px; padding-bottom: 77px; background: $(color-10); a{ display: block; text-align: center; img{ max-width: 100%; padding-bottom: 12px; } } } .header-top-icons{ display: none; &.isStuck{ z-index: 2000; } } .search-wrapper{ display: none; position: fixed; top: 0; right: 0; left: 0; width: 100%; height: 100%; background: rgba(0,0,0, 0.8); z-index: 7000; span.closebtn{ width: 40px; height: 40px; position: absolute; top: 0; right: 0; background: #074f88; text-align: center; z-index: 7500; color: #fff; line-height: 40px; display: block; &:hover{ cursor: pointer; } } .search_form { width: 90%; max-width: 1000px; height: 60px; position: relative; top: 50%; margin-top: -30px; right: 0; left: 0; margin-left: auto; margin-right: auto; background: #fff; z-index: 80; border: 2px solid #074f88; &:before{ content: "SEARCH"; display: block; width: 200px; height: 58px; position: absolute; top: 0; right: 0; /*font-family: 'FontAwesome';*/ text-align: center; line-height: 58px; font-size: 20px; background: #074f88; color: #fff; font-weight: bold; } } .search_form input[type="text"] { height: 60px; margin-top: 2px; width: 100%; margin-left: 10px; border: none; background: none; font-size: 20px; text-transform: uppercase; } .search_form input[type="submit"] { display: block; top: 0; right: 0; height: 60px; width: 200px; position: absolute; border: none; background: none; } } .scrollup { bottom: 20px; display: block; height: 40px; position: fixed; right: 20px; width: 40px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; background: $(color-6); z-index: 1500; color: $(color-2) !important; border: 2px solid $(color-2); line-height: 32px; font-size: 20px; text-align: center; } .preloader { background-color: #fff; height: 100%; width: 100%; position: fixed; z-index: 999999999; margin-top: 0; top: 0 } #loading-center { width: 100%; height: 100%; position: relative } #loading-center-absolute { position: absolute; left: 50%; top: 50%; height: 200px; width: 200px; margin-top: -100px; margin-left: -100px } .videoWrapper { position: relative; padding-bottom: 56.25%; /* 16:9 */ height: 0; } .videoWrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .img-right{ margin-top: 15px; float: right; margin-left: 15px; margin-bottom: 15px; } .tac{ text-align: center; display: block; float: none; } .modal{ z-index: 10000; } .link-color{ color: $(color-22); text-decoration: underline; } .text-bold{ font-weight: bold; } .img-mb{ margin-bottom: 10px; } .patient-forms-links{ margin-top: 10px; ul{ list-style-type: none; li{ position: relative; &:before{ position: absolute; content: "\f101"; left: -15px; font-family: 'FontAwesome'; } a{ color: $(color-22); &:hover{ color: $(color-23); } } } } } .ba-smile-gallery{ max-width: 530px; margin-right: auto; margin-left: auto; position: relative; .carousel-control.left,.carousel-control.right{ background: none; position: absolute; height: 30px; width: 30px; text-align: center; top: 50%; margin-top: -15px; color: $(color-3); font-size: 26px; background: $(color-2); line-height: 30px; } .carousel-control.left{ left: -50px; } .carousel-control.right{ right: -50px; } } .img-width{ width: 480px; } iframe.gmap{ width: 100%; border: 2px solid $(color-2); } .dr-right{ margin-left: 15px; float: right; max-width: 250px; border: 2px solid #074f88; span{ padding-top: 10px; padding-bottom: 10px; display: block; color: #fff; text-align: center; padding-left: 20px; padding-right: 20px; background: #074f88; } } .page-testimonial{ padding-top: 50px; margin-top: 40px; border-top: 1px solid #8f8f8f; padding-bottom: 50px; border-bottom: 1px solid #8f8f8f; span.name{ display: block; margin-top: 25px; } h2{ font-weight: normal; font-size: 18px; text-transform: uppercase; margin-top: 0; } span.q-left{ color: $(color-2); display: inline-block; margin-right: 15px; font-size: 22px; } span.q-right{ color: $(color-2); display: inline-block; margin-left: 15px; font-size: 22px; } span.stars{ display: block; margin-bottom: 20px; color: $(color-2); } } h1.review-page { text-transform:uppercase; text-align:center; font-size:42px; margin-top: 40px; } .center { text-align:center; } .review-heading span { font-size:20px; color:#000; } .main-video-pan { padding:40px; width:85%; margin-left:auto; margin-right:auto; border-radius:30px; background:#dfdfdf; margin-top:30px; } .main-video-img .wrap { background:#333333; } .main-video-img .full { height:400px; } .main-video-img .half { height:185px; } .main-video-img img { width:100%; border:10px solid #fff; } .side-img { margin-bottom:28px; } .review-block { padding:30px; background:#e1e1e1; border-radius:10px; margin-bottom:15px; } .btn-circle { width: 30px; height: 30px; text-align: center; padding: 6px 0; font-size: 12px; line-height: 1.428571429; border-radius: 15px; } .btn-circle.btn-lg { width: 70px; height: 70px; padding: 10px 16px; font-size: 24px; line-height: 1.33; border-radius: 35px; color:#fff; background:#333333; margin-top:-160px; } .btn-circle.btn-lg1 { width: 70px; height: 70px; padding: 10px 16px; font-size: 24px; line-height: 1.33; border-radius: 35px; color:#fff; background:#333333; float:right; } .btn-circle.btn-lg2 { width: 70px; height: 70px; padding: 10px 16px; font-size: 24px; line-height: 1.33; border-radius: 35px; color:#fff; background:#333333; margin-top:-90px; } .btn-circle.btn-lg3 { width: 70px; height: 70px; padding: 10px 16px; font-size: 24px; line-height: 1.33; border-radius: 35px; color:#fff; background:#333333; position:absolute; z-index:3000; margin-left:20%; margin-top:-20px; } .btn-circle.btn-xl { width: 70px; height: 70px; padding: 10px 16px; font-size: 24px; line-height: 1.33; border-radius: 35px; color:#fff; } .btn-circle.btn-xl.blue { background:#0090ff; } .btn-circle.btn-xl.blue:hover { background:#5e5e5e; } .btn-circle.btn-xl.black:hover { background:#5e5e5e; } .img-reviwer span { font-size:15px; font-style:italic; } .testi .fa-star { color:#ffcd00; font-size:20px; } .testi strong { font-size:19px; } .review-block { display:none; list-style:none; } #cont-new li { list-style:none; } .load-more { font-size:16px; color:#fff; padding-left:30px; padding-right:30px; padding-top:7px; padding-bottom:7px; border: 1px solid #073f73; background:#073f73; border-radius:3px; float:left; margin-left: 30px; margin-bottom: 40px; } .load-more:hover,.load-more:active,.load-more:focus{ text-decoration:none; background: #fff; } .text-review-wrap{ margin-bottom: 50px; } .review-external-block { width:100%; padding-top:30px; padding-bottom:30px; background:#dfdfdf; margin-top:30px; } .part-logo .inner-wrap { width:100%; padding-top:30px; padding-bottom:30px; border: 3px solid #cbcbcb; border-radius:5px; text-align:center; } .part-logo .inner-wrap img { width:90%; } .bottom-button { color:#fff; width:95%; margin-left:auto; margin-right:auto; text-align:center; font-size:16px; text-transform:uppercase; background:#073f73; margin-top:50px; padding-top:10px; padding-bottom:10px; cursor:pointer; margin-bottom: 50px; } .bottom-button a { color:#fff; text-transform:uppercase; text-decoration:none; font-size:16px; -webkit-transition: all 500ms; -moz-transition: all 500ms; -ms-transition: all 500ms; -o-transition: all 500ms; transition: all 500ms; } .bottom-button:hover { } .review-external-block h2 { margin-top:0px; text-align:center; padding-top:0; text-transform:uppercase; color:#000; font-weight:bold; margin-bottom:12px; } .text-testi { padding-left:10px; width:96%; margin-left:auto; margin-right:auto; border:1px solid #848181; padding-top:7px; padding-bottom:7px; margin-bottom:10px; } .text-area { padding-left:10px; width:96%; margin-left:auto; margin-right:auto; border:1px solid #848181; padding-top:7px; padding-bottom:7px; margin-bottom:10px; height:100px; } .bottom-review-btns{ /*border-top: 1px solid #848181;*/ } .btn-submit { width:96%; margin-left:auto; margin-right:auto; border:1px solid #848181; padding-top:7px; padding-bottom:7px; color:#fff; background:#618535; } @media screen and (max-width: 768px) { .btn-circle.btn-lg3, .btn-circle.btn-lg2, .btn-circle.btn-lg1, .btn-circle.btn-lg { display:none; } .part-logo { margin-bottom:20px; } .main-video-img .full { height:250px; margin-bottom:20px; } .main-video-img .half { height:250px; } } .toggle-content,.toggle-content-two,.toggle-content-three,.toggle-content-four{ display: none; &.active{ display: inline !important; } } label{ font-weight: normal; } .gallery-size{ max-width: 440px; margin-bottom: 40px; } .gallery-img{ max-width: 735px; float: none; margin-bottom: 40px; margin-left: 30px; } body, body.modal { padding-right: 0 !important; } #menu{ color: #fff; } .mm-menu{ z-index: 10; } .video-mobile{ max-width: 400px; margin-left: auto; margin-right: auto; } .teeth-whitening-video{ margin-bottom: 25px; } .bottom-button{ border: 3px solid $(color-2); &:hover{ background: #fff; color: $(color-2); a{ color: $(color-2); } } } .col-sm-11.testi{ padding-left: 30px; } .appointment-form-popup{ .appointment{ background: none; padding-top: 30px; margin-top: 0 !important; background: #0f4c85; background-image: none !important; h2{ margin-top: 0; display: none; color: #fff; text-align: center; } form{ padding-bottom: 34px; padding-top: 25px; padding-left: 40px; padding-right: 40px; color: $(color-20); input, select, textarea, button{ width: 100%; border: none; background: $(color-21); height: 30px; margin-bottom: 18px; text-align: center; font-size: 16px; font-family: $(font-3); } textarea{ height: 68px; } button{ display: block; margin-left: auto; margin-right: auto; height: 34px; width: 100px; margin-bottom: 0; background: $(color-17); &:hover{ color: $(color-6); border: 1px solid $(color-6); } } select{ -webkit-appearance: none; -moz-appearance: none; appearance: none; } } } } .review-heading{ font-size: 24px; color: $(color-2); font-family: $(font-3-b); margin-bottom: 35px; margin-top: 35px; } .mm-list a:hover, .footer-snippets > a:hover, .p_number:hover, .copyright a:hover{ color: $(color-3) !important; } .hide-from-desktop{ display: none; } /*Top mobile menu Icon */ .header-top-icons { width: 100%; margin-right: auto; margin-left: auto; height: 55px; background-color: #E9EBEE; position: relative; padding:0; z-index: 99999; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; } .top-menu-mobile { margin: 0px; padding: 0px; list-style-type: none; } .top-menu-mobile li { height: 55px; width: 19.5%; display: block; float: left; text-align: center; } .top-menu-mobile li.menu { width: 16.5%; } .top-menu-mobile li.call { width: 16.5%; } .top-menu-mobile li.appointment-mobile { width: 25%; } .top-menu-mobile li.services { width: 21.5%; } .top-menu-mobile li.sms { width: 19.5%; } .top-menu-mobile li.menu, .top-menu-mobile li.call, .top-menu-mobile li.sms, .top-menu-mobile li.appointment-mobile, .top-menu-mobile li.services { border-right-width: 1px; border-right-style: solid; border-right-color: #dcddde; } .top-menu-mobile li a { height: 55px; width: 100%; display: block; color: $(color-6); font-size: 22px; text-align: center; /*text-shadow: 2px 2px 3px #969696;*/ padding-top: 5px; padding-bottom: 12px; line-height:30px; text-decoration: none; } .top-menu-mobile li a:hover { background-color: #7e95c4; text-decoration:none !important; color: #fff; } .top-menu-mobile li a div { margin-top:0px !important; font-size: 8px !important; text-transform: uppercase; font-family: 'Myriad Pro', Helvetica, sans-serif; line-height:8px !important; } a.call-mobile, a.call-mobile:link { -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; background-color: #737373; padding: 8px; } .header-top-icons.sticky1 { position: fixed; z-index: 350000; background: $(color-2); } .header-top-menu.sticky { position: fixed; z-index: 350000; background: rgba(255,255,255 0.6); } .header-top-menu.sticky ul li a{color:#fff;} .header-top-icons.sticky1 ul li{border-right:1px solid #fff;} .header-top-icons.sticky1 a{color:#4267b2;} .search_mobile { display: block; width: 91%; margin-bottom: 15px; margin-left: 4%; position: relative; } .search_mobile:before { content: "\f002"; display: block; width: 40px; height: 40px; position: absolute; top: -2px; right: 0; font-family: 'FontAwesome'; text-align: center; line-height: 40px; font-size: 20px; color: #4267b2; } .search_mobile input[type="text"] { height: 36px; width: 100%; border: none; background: #FFFFFF; color: #4267b2; padding-left: 10px; -webkit-transition: all 0.30s ease-in-out; -moz-transition: all 0.30s ease-in-out; -ms-transition: all 0.30s ease-in-out; -o-transition: all 0.30s ease-in-out; } .search_mobile input[type="text"]:focus { box-shadow: 0 0 5px black; padding: 3px 0px 3px 3px; border: 1px solid black; } .search_mobile input[type="submit"] { display: block; top: 0; right: 0; height: 38px; width: 38px; position: absolute; border: none; background: none; } /****************MMENU CUSTOMIZATION*********************/ .mm-menu{ border-color: rgba(51,32,70,0.8) !important; color: rgba(0,0,0,1); /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#8bb633+0,779f34+47,618535+100 */ background: #4267b2 !important; /* Old browsers */ background: -moz-linear-gradient(left, #4267b2 0%, #3564c5 47%, #073797 100%)!important; /* FF3.6-15 */ background: -webkit-linear-gradient(left, #4267b2 0%,#3564c5 47%,#073797 100%)!important; /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to right, #4267b2 0%,#3564c5 47%,#073797 100%)!important; /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4267b2', endColorstr='#073797',GradientType=1 )!important; /* IE6-9 */ font-family: 'Myriad Pro', Helvetica, sans-serif !important; } .mm-navbar{ background-color: $(color-2); } #menu ul li a, #menu2 ul li a, #menu3 ul li a, #menu4 ul li a, #menu5 ul li a{ font-family: 'Myriad Pro', Helvetica, sans-serif !important; color: #FFF!important; font-size:14px !important; text-transform: uppercase !important; text-decoration: none; /*font-weight: bold !important;*/ } #menu ul li a span, #menu2 ul li a span, #menu3 ul li a span, #menu4 ul li a span, #menu5 ul li a span{ padding-right:8px; font-size: 18px !important;} .mm-navbar a.mm-subtitle { font-family: 'Myriad Pro', Helvetica, sans-serif !important; text-transform: uppercase !important; text-decoration: none !important; color: #cccccc!important; } @media screen and (max-width:600px){ #menu ul li a, #menu2 ul li a, #menu3 ul li a, #menu4 ul li a { font-size:13px !important; } } .mm-navbar .mm-title{ color: $(color-1) !important; } .panel-title > .small, .panel-title > .small > a, .panel-title > a, .panel-title > small, .panel-title > small > a{ color: $(color-2); } .panel-title > .small, .panel-title > .small > a, .panel-title > a, .panel-title > small, .panel-title > small > a{ color: $(color-2); } .videoWrapper{ margin-bottom: 30px; } .right-space{ margin-right: 30px; } .bottom-space{ margin-bottom: 30px; } .articles-wrapper-slider h2{ font-size: 14px !important; } .fan-review-and-articles .featured-articles h2.article-heading{ font-size: 15px !important; text-transform: none; } .fan-review-and-articles .featured-articles h2{ margin-top: 30px !important; margin-bottom: 30px !important; } .overlay-wrapper{ display: block; position: relative; &:before{ content: ""; display: block; position: absolute; bottom: 0; right: 0; width: 100%; height: 0; background: rgba(7,79,136, 0.65); -webkit-transition: all 300ms; -moz-transition: all 300ms; -ms-transition: all 300ms; -o-transition: all 300ms; transition: all 300ms; } &:hover{ &:before{ height: 100%; } span.icon{ opacity: 1; } } span.icon{ opacity: 0; display: block; position: absolute; height: 40px; width: 40px; font-size: 26px; top: 50%; margin-top: -20px; left: 0; right: 0; margin-left: auto; margin-right: auto; z-index: 20; color: #fff; text-align: center; line-height: 38px; -webkit-transition: all 400; -moz-transition: all 400; -ms-transition: all 400; -o-transition: all 400; transition: all 400; } } .owl-theme .owl-dots .owl-dot span{ width: 15px; height: 10px; border-radius: 0; background: #40a775 !important; opacity: 0.8; /*transition: all 0.3s ease 0s;*/ -webkit-transition: all 500ms; -moz-transition: all 500ms; -ms-transition: all 500ms; -o-transition: all 500ms; transition: all 500ms; } .owl-theme .owl-dots .owl-dot.active span{ width: 35px; background: #2660a4 !important; } .testimonial-welcome .welcome h2{ font-size: 18px; text-transform: uppercase; font-family: 'Candarab'; color: #074f88; } .panel-default > .panel-heading{ background: #074f88; } .panel-title > .small, .panel-title > .small > a, .panel-title > a, .panel-title > small, .panel-title > small > a{ color: #fff; } a.la-chargers-btn{ display: block; text-align: center; width: 100%; background: $(color-2); margin-left: auto; margin-right: auto; color: $(color-6); padding-top: 15px; padding-bottom: 15px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; font-size: 20px; text-decoration: none; margin-bottom: 50px; &:hover{ background: $(color-12); } } li.la-btn{ float: none; display: inline-block; width: 100%; max-width: 250px; margin-right: 30px; text-align: center; } .nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover{ border: 2px solid $(color-2); color: $(color-2); background: $(color-6); } .nav-tabs > li > a{ &:hover{ border: 2px solid $(color-2); color: $(color-2); background: $(color-6); } } .tab-panel{ margin-left: auto; margin-right: auto; float: none; text-align: center; } span.news-video{ color: $(color-6); text-decoration: none; text-align: center; padding-left: 20px; padding-right: 20px; display: block; &:hover{ color: $(color-12); } } .top10-newsletter .newsletter #newsletter-carousel .carousel-control.left, .top10-newsletter .newsletter #newsletter-carousel .carousel-control.right{ bottom: 0; } .top10-newsletter .newsletter #newsletter-carousel .carousel-control.left{ left: 8px; } .top10-newsletter .newsletter #newsletter-carousel .carousel-control.right{ right: 8px; } .carousel.fade .item { transition: opacity ease-out 2s; left: 0; opacity: 0; /* hide all slides */ top: 0; position: absolute; width: 100%; display: block; } .carousel.fade .item:first-child { top: auto; opacity: 1; /* show first slide */ position: relative; } .carousel.fade .item.active { opacity: 1; } .office-tour{ .item{ background: #fff !important; transition: opacity ease-out 1s !important; img{ margin-bottom: 0 !important; } h2{ text-align: center; } } .carousel.fade .item:first-child { top: auto; opacity: 1; /* show first slide */ position: relative; h2{ opacity: 1; } } } .contact-page{ padding-left: 0 !important; img{ border: 15px solid #C1D3E1; } } .contact-review{ margin-top: 50px; text-align: center; float: none; position: relative; background: $(color-2); border: 15px solid $(color-25); color: #fff; padding-left: 30px; padding-right: 30px; h2.contact-heading{ font-family: $(font-1); font-size: 30px !important; position: relative; text-align: center; color: $(color-6); margin-bottom: 50px; text-transform: uppercase; margin-top: 30px; &:before{ content: ""; display: block; position: absolute; left: 47%; bottom: -5px; width: 6%; height: 1px; background: $(color-6); margin-left: auto; margin-right: auto; float: none; } } .testimonial{ text-align: center; margin: 0 20px; } .testimonial .description{ padding: 40px 30px; margin-bottom: 50px; border-top: 1px solid $(color-6); border-left: 1px solid $(color-6); font-size: 15px; color: $(color-6); line-height: 30px; text-align: left; position: relative; } .testimonial .description:before{ content: "\f10e"; font-family: fontawesome; display: inline-block; float: left; padding: 0 15px 5px 0; font-size: 30px; color: $(color-6); text-align: center; position: relative; top: 8px; left: 0; } .testimonial .description:after{ content: ""; width: 50%; height: 1px; background: $(color-6); position: absolute; bottom: 0; left: 0; } .testimonial .testimonial-content{ position: relative; } .testimonial .testimonial-content:before{ content: ""; width: 1px; height: 20px; background: $(color-6); position: absolute; top: -50px; left: 50%; } .testimonial .testimonial-content:after{ content: ""; width: 2px; height: 40px; background: $(color-6); position: absolute; top: -70px; left: 50%; transform: skewX(-45deg); transform-origin: 100% 100% 0; } .testimonial .pic{ display: inline-block; width: 80px; height: 80px; border-radius: 50%; margin-right: 7px; } .testimonial .pic img{ width: 100%; height: auto; border-radius: 50%; } .testimonial .title{ display: inline-block; font-size: 22px; font-weight: 700; color: $(color-6); letter-spacing: 1px; text-transform: capitalize; vertical-align: 30px; } .owl-theme .owl-controls{ margin-top: 30px; } .owl-theme .owl-controls .owl-page span{ width: 15px; height: 10px; border-radius: 0; background: #fff; opacity: 0.8; transition: all 0.3s ease 0s; } .owl-theme .owl-controls .owl-page.active span{ width: 35px; background: #0084ff; } } .contact-dentist{ .massage-wrapper{ margin-top: 100px; background: $(color-2); min-height: 300px; padding-left: 100px; border: 15px solid $(color-25); img{ float: right; margin-top: -83px; } .dr-msg-heading{ text-align: left; font-family: $(font-3); font-size: 36px; color: $(color-6); padding-top: 30px; padding-bottom: 20px; text-transform: uppercase; } p{ font-family: $(font-3); font-size: 18px; color: $(color-6); text-align: left; margin-bottom: 20px; } color: $(color-6); span{ color: $(color-6); float: left; display: block; margin-right: 25px; i{ font-size: 48px; } } .call-us, .mail-us{ font-size: 18px; color: #fff !important; text-align: left; line-height: 24px; a{ color: #fff !important; display: block; float: left; font-size: 16px; } } .contact-location{ font-size: 18px; margin-top: 20px; i{ margin-right: 10px; } } } } .fixing-row{ height: 60px; overflow: hidden; } .office-hour-Wrapper{ margin-top: 50px; } .office-hour{ background: $(color-2); color: $(color-2); padding-left: 50px; border: 15px solid $(color-25); padding-bottom: 45px; padding-right: 50px; h2.contact-heading{ font-family: $(font-1); font-size: 30px !important; position: relative; text-align: center; color: $(color-6); margin-bottom: 50px; text-transform: uppercase; padding-top: 20px; &:before{ content: ""; display: block; position: absolute; left: 47%; bottom: -5px; width: 6%; height: 1px; background: $(color-6); margin-left: auto; margin-right: auto; float: none; } } table{ color: $(color-6); text-align: center; width: 100%; tr{ border-bottom: 1px solid $(color-21); } th,td{ padding: 10px; } th{ text-align: center; } } } .map-wrapper{ margin-top: 50px; margin-bottom: 50px; position: relative; width: 100%; max-width: 1200px; height: 100%; margin-left: auto; margin-right: auto; border: 15px solid #C1D3E1; .contact-form-area{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; .contact-form-wrapper{ width: 100%; max-width: 600px; float: right; height: 456px; z-index: 100; background: $(color-2); padding-left: 25px; padding-right: 25px; h2{ font-family: $(font-1); font-size: 30px !important; position: relative; text-align: center; color: $(color-6); margin-bottom: 50px; text-transform: uppercase; padding-top: 20px; &:before{ content: ""; display: block; position: absolute; left: 47%; bottom: -5px; width: 6%; height: 1px; background: $(color-6); margin-left: auto; margin-right: auto; float: none; } } .social-connect{ display: block; margin-left: auto; margin-right: auto; } } } } .appointment-form{ margin-top: 30px; input,select,textarea{ width: 100%; display: block; -webkit-border-radius: 0% !important; -moz-border-radius: 0% !important; border-radius: 0% !important; border: none; background: none; height: 40px; } textarea{ height: 80px; } select{ -webkit-appearance: none; -moz-appearance: none; appearance: none; } .input{ position: relative; padding-left: 30px; margin-bottom: 15px; border-bottom: 1px solid $(color-21); color: $(color-1); &:before{ content: "\f0e5"; display: block; font-family: 'FontAwesome'; height: 40px; width: 40px; position: absolute; top: 0; left: 0; line-height: 40px; font-size: 18px; color: $(color-6); } &.name{ &:before{ content: "\f007"; } } &.mail{ &:before{ content: "\f0e0"; } } &.phone{ &:before{ content: "\f095"; } } } } .default-btn{ display: block; width: 193px; height: 43px; line-height: 43px; background: $(color-6); border: 1px solid $(color-6); color: $(color-2); -webkit-transition: all 300ms; -moz-transition: all 300ms; -ms-transition: all 300ms; -o-transition: all 300ms; transition: all 300ms; text-align: center; text-transform: uppercase; font-size: 16px; font-family: $(font-1); margin-left: auto; margin-right: auto; &:hover,&:focus,&:active{ background: $(color-2); color: $(color-1); text-decoration: none; } &.inverse{ border: 1px solid $(color-2); background: $(color-2); color: $(color-1); &:hover{ background: $(color-1); color: $(color-2); } } } a.la-chargers-banner{ margin-top: 49px; display: block; } .la-chargers-video{ text-align: center; margin-top: 30px; margin-left: -25px; } .left-side-testimonial{ width: 100%; max-width: 400px; background: $(color-2); padding-left: 20px; padding-right: 20px; padding-bottom: 12px; padding-top: 12px; text-align: center; color: $(color-6); min-height: 228px; span.stars{ color: #FFD700; } } a.ten-top{ width: 100%; max-width: 400px; height: 100px; text-decoration: none; color: $(color-6); display: block; margin-bottom: 20px; span.t10{ width: 100%; max-width: 400px; text-align: center; min-height: 40px; font-size: 20px; line-height: 40px; background: $(color-8); display: inline-block; } span.cosmetic-dentistry{ width: 100%; text-align: center; max-width: 400px; min-height: 60px; background: $(color-9); padding-top: 10px; font-size: 14px; display: inline-block; padding-left: 20px; padding-right: 20px; padding-bottom: 10px; color: $(color-2); } &:hover{ span.t10{ background: $(color-9); color: $(color-2); } span.cosmetic-dentistry{ background: $(color-8); color: $(color-6); } } } #video-testimonial{ .item{ width: 100%; a{ text-align: center; float: none; margin-left: auto; margin-right: auto; color: $(color-2); span{ display: block; } } } } #review-videos-carousel{ position: relative; .carousel-control.left,.carousel-control.right{ background-image: none; font-size: 24px; position: absolute; bottom: 0px; height: 30px; width: 30px; top: auto; color: #000; } .carousel-control.left{ left: 0px; } .carousel-control.right{ right: 0px; } a{ color: $(color-6); img{ width: 100%; } span{ float: none; display: block; margin-left: auto; margin-right: auto; } } } .left-col-review{ .testimonials-text{ text-align: center; color: $(color-6); font-family: $(font-3-i); font-size: 18px; background: $(color-5); &.home{ padding-bottom: 43px; } span.quote{ margin-top: 15px; margin-bottom: 15px; display: block; } .stars{ padding-top: 15px; letter-spacing: 2px; display: block; color: #FFD700; i{ font-size: 16px; font-style: normal; } lable{ font-weight: normal; font-size: 12px; font-style: normal; } } .text-wrapper{ letter-spacing: 0.7px; padding-left: 20px; padding-right: 20px; padding-top: 10px; line-height: 24px; } } } .left-col-app{ &.appointment{ background: none; margin-top: 46px; background: #0f4c85 url(../images/appointment-form-bgc.jpg) top center no-repeat; h2{ margin-top: 119px; } form{ padding-bottom: 34px; padding-top: 25px; padding-left: 40px; padding-right: 40px; color: $(color-20); input, select, textarea, button{ width: 100%; border: none; background: $(color-21); height: 30px; margin-bottom: 18px; text-align: center; font-size: 16px; font-family: $(font-3); } textarea{ height: 68px; } button{ height: 34px; width: 100px; margin-bottom: 0; background: $(color-17); &:hover{ color: $(color-6); border: 1px solid $(color-6); } } select{ -webkit-appearance: none; -moz-appearance: none; appearance: none; } } } } .left-col-review .testimonials-text{ background: rgba(1,75,145,.85) !important; } a.special-padding{ padding-left: 20px; } #review-text-carousel{ position: relative; .carousel-control.left,.carousel-control.right{ background-image: none; font-size: 24px; position: absolute; bottom: 0px; height: 30px; width: 30px; top: auto; color: #000; } .carousel-control.left{ left: 0px; } .carousel-control.right{ right: 0px; } } span.news-video{ margin-top: 20px; color: #000; } #review-videos-carousel a{ color: #000; } .video-testimonials{ padding-bottom: 20px; margin-bottom: 20px; padding-left: 50px; padding-right: 50px; #review-videos-carousel .carousel-control.left{ height: 40px; width: 40px; position: absolute; top: 50%; margin-top: -20px; left: -40px; font-size: 36px; color: #e1e1e1; opacity: 1; } #review-videos-carousel .carousel-control.right{ height: 40px; width: 40px; position: absolute; top: 50%; margin-top: -20px; right: -40px; font-size: 36px; color: #e1e1e1; opacity: 1; } position: relative; } #cont-new{ padding-left: 0 !important; } #review-videos-carousel a img{ border: 10px solid #e1e1e1; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; height: auto !important; width: 100% !important; display: block; } #review-videos-carousel a.video-img{ display: block; position: relative; &:before{ content: "\f16a"; font-family: 'FontAwesome'; height: 40px; width: 80px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; position: absolute; bottom: 40px; right: 40px; display: block; font-size: 50px; text-align: right; color: #29B6F6; } }