/** * Theme Name: Always Beautiful Custom Theme * Theme URI: http://mednet-tech.com * Author: MedNet Technologies * Author URI: http://mednet-tech.com * Description: Custom HTML5 Pruduction Wordpress Theme Using thmpltfrmwrk * Template: thmpltfrmwrk * Version: 1 */ /* = Formatting -------------------------------------------------------------------------------------------------------------------- Global Styling For All Elements throughout the site ** Advice Media ** */ html {background:#ffffff;} body {font-family:Arial, Tahoma, Helvetica, sans-serif; color:#46454a; font-size:18px; line-height:33px} h1, h2, h3, h4, h5, h6 { margin:60px 0 40px; padding:0; color:#46454a; font-weight:normal; text-transform:uppercase} H1{font-size:46px;line-height:56px; /*color:#222 */} H2{font-size:34px;line-height:44px} H3{font-size:28px;line-height:38px} H4{font-size:26px;line-height:36px} H5{font-size:24px;line-height:34px; color:#7c63cf} H6{font-size:22px;line-height:32px} .topheader {margin:0 0 60px;} .topheader2 {margin:0 0 30px;} .home h2.topheader {font-size:36px; line-height:38px; border: none!important} #main h2{text-transform: capitalize; border-left: 7px solid #5e44b3;padding: 0 15px;} @media screen and (max-width: 768px) { H1,H2,H3,H4,H5,H6{margin:40px 0 10px;} H1{font-size:26px;line-height:34px} H2{font-size:24px;line-height:30px} H3{font-size:22px;line-height:28px} H4{font-size:20px;line-height:26px} H5{font-size:18px;line-height:24px} H6{font-size:16px;line-height:22px} .topheader {margin:0px 0 30px 0;} .home h2.topheader {font-size:26px; line-height:26px;} } ul, ol{ padding:0 0 0 16px; margin:0 0 40px; list-style:outside;} ul.indent, ol.indent { padding-left:30px} /* Fontawesome Icon Support */ ul.faul, ol.faul { list-style:none;} .faul li {font-family:FontAwesome;position:relative} .faul li:before { left:-18px;font-size:11px;position: absolute; color:#DE0846} a {color:#5e44b3; text-decoration:none} a:hover {color:#9884d7; text-decoration:none} /* take off the dotted outline on this elements */ a:hover, a:active, a:focus, object, embed { outline: 0; text-decoration:none; } hr {text-align: center;border:0;clear:both;margin:40px auto;border-top:1px solid #777;color:#DE0846} hr.clear { border: 0 none;height: 1px;margin: 0; clear:both} hr.spacer {border: 0 none;height: 40px;margin: 0} hr.spacer.short {height: 20px} hr.centered {max-width:400px} hr.left {max-width:150px; margin-left:0} hr.purple {border-top:2px solid #5e44b3} /* all headers followed by an HR get their margins redone */ hr + .htag {margin-top: 40px; } hr[class*="fa-"]::before { display: inline-block;font-family:FontAwesome;position:relative;padding:0 10px;top:-14px;background:#FFF;font-size:18px} /* fancy lines before/after an element */ .linetop::before{content:' ';display:block;margin:0 0 20px;max-width:150px;border-top:1px solid #777} .linebottom::after{content:' ';display:block;max-width:150px;border-top:1px solid #777} p, .rowlikep {margin:0 0 40px} /* Block Quote styling */ blockquote {border-left:10px solid #3d2786;padding:0 32px; margin:0 0 40px} blockquote cite {display:block; margin:20px 0 0; color:#db1249; font-style:normal} blockquote.large {font-size:60px; line-height:60px} blockquote.large cite {font-size:18px; line-height:18px} /* enable styled quote */ blockquote.quoted {border:0;position:relative; padding:0 0 0 70px} blockquote.quoted::before {display:block;content:open-quote;position:absolute;font-size:160px;left:0;top:30px;color:#3d2786;} /* -- Formatting classes -- */ .row.flushcolumns > * { padding:0} .img-thumbnail { background-color: #f7f7f7; border: 2px solid #333; border-radius:1px} /* Buttons */ .btn.btnc, .btn.btnc::before {background:#5e44b3; color:#FFF; padding:17px 34px; text-decoration:none; border:0; border-radius:0; cursor:pointer; text-transform:uppercase;font-weight:700;font-size:16px;letter-spacing:1px; white-space: normal!important;} .btn.btnc:hover {background:#9884d7; color:#FFF; text-decoration:none} .btn.grey {background:#d2d2d2;color:#46454a;} .btn.grey:hover {background:#5e44b3;color:#fff} /* Misc accents */ .left-border { border-left: 1px solid #d2d2d2;} .emphasisbox { padding:40px;background:#efefef} .emphasisbox .htag {color:#db1249} .btnb {padding: 140px 780px 290px;} /* accordion styling */ .tpf-ac-trigger {cursor:pointer; position:relative; padding-left:25px; margin:0 0 20px} .tpf-ac-trigger::before { position: absolute; top:35%;left:0; content: "";display: block; width: 0.4em; height: 0.4em; transform: rotate(45deg); border-right: 0.2em solid #53277C; border-top: 0.2em solid #53277C; } .tpf-ac-trigger.tpf-active::before {transform: rotate(135deg)} /* Tabs Styling */ .nav-tabs.tabsc {border-bottom:2px solid #3d2786} .nav-tabs.tabsc a { padding: 10px 20px;border-radius:0; background:#2d2b2a; color:#FFF } .nav-tabs.tabsc .dropdown-menu {background:#2d2b2a} .nav-tabs.tabsc .dropdown-menu .divider {background:#3d2786;} .nav-tabs.tabsc >.active >a, .nav-tabs.tabsc >li >a:focus, .nav-tabs.tabsc >li >a:hover {background:#3d2786; color:#FFF} .tab-content.tabsc { background:#EFEFEF; padding:20px} /* Table Styling */ .table.tablec tr th {background:#3d2786; color:#FFF} .table.tablec tr th:nth-of-type(even) {background:#eb2842} .table.tablec tr:nth-of-type(odd) {background-color: #efefef} .table.tablec tr:nth-of-type(odd) td:nth-of-type(even) {background-color: #e7e7e7} .table.tablec tr:nth-of-type(even) {background-color: #f9f9f9} .table.tablec tr:nth-of-type(even) td:nth-of-type(even) {background-color: #f0f0f0} .am-sticky-toprow {font-size:14px} .am-sticky-toprow svg {margin-top:-5px} .nobullets {list-style:none outside; padding-left:0; text-transform: uppercase} /* = Topbar -------------------------------------------------------------------------------------------------------------------- ** Advice Media ** */ #topbar {background:#eaf2f9; padding:10px;} #topbar .addresses { font-size:18px; text-transform:uppercase; text-align:right;color:#000; margin:0} #topbar .addresses li {padding-left:20px} #topbar .addresses .tel { font-weight:bold; color:#4c85c5} #topbar .addresses .bottom { font-size:14px} @media screen and (max-width: 780px) { #topbar .addresses {text-align:center} #topbar .addresses { font-size:14px;} #topbar .addresses .bottom { display:none} } .am-social-svg .svg-shape { stroke:#d2d2d2;stroke-width:2px} /* = Header -------------------------------------------------------------------------------------------------------------------- Elements in the structure/header.php file ** Advice Media ** */ #header {background:#fafafa} #header #social {padding:90px 0 0} #header #logo img {max-width:100%;padding:30px 0 0} #header .topright {padding:40px 0 25px} #header .tel {font-size:32px} #header p {margin:0} #header .btn.btnc {padding:17px 20px} #header address>a {color:#46454a;font-size:16px} #header address>a:hover {color:#5e44b3} @media screen and (max-width:1280px){ #header .tel {font-size:30px} } @media screen and (max-width:1200px){ #header address>a {font-size:15px} } @media screen and (max-width:992px){ #header .topright {padding:25px 0} #header #mobilelogo img {padding-top:15px} } @media screen and (max-width:768px){ #header #social {padding:17px 0} #header #logo img {padding:0} #header .topright {padding:0 0 25px} } /* = Main Navigation -------------------------------------------------------------------------------------------------------------------- ** Advice Media ** */ #navigation {background:#5e44b3; border-bottom:0; overflow: visible} /* Dropdown Style */ #mainmenu{margin:0; float:left;} #mainmenu>li>a{font-size:18px;line-height:18px;padding:22px 44px; color:#fff;text-transform: uppercase; font-weight:700; /* background:url(../../../../../../themes/alwaysbeautiful/images/structure/nav_divider.jpg) center right no-repeat; */} #mainmenu>li.first>a, #mainmenu>li:first-child>a{padding-left:0} #mainmenu>li.last>a, #mainmenu>li:last-child>a{background:0; padding-right:0} #mainmenu>li:hover>a{color:#d7cbfd; text-decoration:none} /* #mainmenu>li:hover {background:url(../../../../../../themes/alwaysbeautiful/images/structure/nav_underscore.png) center top}*/ /* #mainmenu>li.has-submenu {background:url(../../../../../../themes/alwaysbeautiful/images/structure/nav_sub_menu_arrow.jpg) center 45px no-repeat;} */ /* Sub-Menu*/ #mainmenu ul{width:200px;margin-top:0} #mainmenu li li a{color:#fff;font-size:14px;padding:8px 16px;margin:0;background:#5e44b3} #mainmenu li ul a:hover{color:#FFF;background:#bda8ff} /* Accordion Style */ #mainmenu_accordion, #mainmenu_accordion ul {list-style:none outside; margin: 0; padding: 0; overflow:hidden;} #mainmenu_accordion>li>a { margin:0; cursor: pointer; height:60px; line-height:60px; font-size:18px; color:#fff; display:block; padding:0; background:0;border:0;} #mainmenu_accordion>li>ul {padding: 0; margin:0 0 40px; /*border-top:1px solid #54583A;*/} #mainmenu_accordion ul li a{display:block; text-decoration:none; font-weight:normal; border-bottom:1px solid #fff; /*height:40px; line-height:40px;*/ height:auto; line-height:18px; padding-top:10px!important; padding-bottom:10px!important;} #mainmenu_accordion ul li a:hover {text-decoration:none; } /* Mobile Submenu */ #mainmenu_accordion>li>ul>li a {background:0; color:#fff; padding-left:20px} #mainmenu_accordion>li>ul>li a:hover {color:#d7cbfd;} #mainmenu_accordion>li>ul>li li a { background:#5e44b3; padding:0 0 0 40px;} #mainmenu_accordion>li>ul>li li a:hover { background:#bda8ff;color:#fff} #mainmenu_accordion>li>ul>li li li a {background:#5e44b3; padding:0 0 0 50px;} #mainmenu_accordion>li>ul>li li li a:hover { background:#bda8ff;color:#fff} #mainmenu_accordion>li>ul>li li li li a {background:#5e44b3; padding:0 0 0 60px;} #mainmenu_accordion>li>ul>li li li li a:hover { background:#bda8ff;color:#fff} /* If a menu item has an dropdown */ #mainmenu_accordion .menu-item-has-children>a:after{ /*content:"\e252"; font-family:"Glyphicons Halflings";*/ content: "▼"; margin:0 10px 0 0; display:inline-block; float:right; font-size:10px;} .am-sticky-accordion .menu-item-has-children>a:after{ content: "▼" ; } @media screen and (max-width: 1280px) { #mainmenu>li>a{padding:22px 34px} } @media screen and (max-width:1200px){ #mainmenu>li>a {padding:22px 18px} } .am-sticky-accordion>li>ul>li a { height:auto; line-height:18px; padding-top:10px!important; padding-bottom:10px!important;} /* = Banner/Graphic - Carousel -------------------------------------------------------------------------------------------------------------------- ** Advice Media ** */ #graphic {background:0;} #graphic .container {padding:0;} .carousel-inner {width:100%; margin:0 auto;} .carousel-inner > .item > img.fullwidthimg {width:100%; height:auto} .carousel-inner > .item > .constrained { height:420px; background-size:cover!important;} .carousel-inner > .item {background:#e0d7fe} @media screen and (max-width: 768px) { .carousel-inner>.item>img {max-width:135%;} } /*Img was floating left causing issues with caption box*/ #graphic .wp-post-image {float:none;} /* -- CAPTION -- */ .carousel-caption {width:100%; top:27%; right:0; left:0; bottom:0; text-align:left; padding:0; max-width:1247px; display:block; margin:0 auto;} .carousel-caption > * {color:#572600; text-shadow:none;} .carousel-caption .title {color:#000; font-size:72px; line-height:70px; margin:0 0 20px 0; text-transform:uppercase;} .carousel-caption p {font-size:18px; line-height:28px; margin:0;} .carousel-caption .btn.btnc {margin-top:23px;padding:17px 32px} @media screen and (max-width:2200px){ .carousel-caption .title {font-size:65px;line-height:65px} } @media screen and (max-width:2100px){ .carousel-caption .title {font-size:60px;line-height:60px} } @media screen and (max-width:2000px){ .carousel-caption .title {font-size:55px;line-height:55px} } @media screen and (max-width:1800px){ .carousel-caption .title {font-size:50px;line-height:50px} .carousel-caption {top:23%} } @media screen and (max-width:1500px){ .carousel-caption .title {font-size:45px;line-height:45px} .carousel-caption {top:18%} } @media screen and (max-width:1280px){ .carousel-caption .title {font-size:40px;line-height:40px} .carousel-caption {max-width:1120px} } @media screen and (max-width:1200px){ .carousel-caption .title {font-size:35px;line-height:35px} .carousel-caption {max-width:929px} .carousel-caption .btn.btnc {margin-top:10px} } @media screen and (max-width: 992px) { .carousel-caption {position:relative; text-align:center; padding:20px 20px 40px;} .carousel-caption .title {font-size:30px; line-height:30px;} .carousel-caption p {font-size:16px; line-height:24px;} .carousel-caption .btn.btnc {margin-bottom:25px} } @media screen and (max-width: 768px) { .carousel-caption .title {font-size:28px; line-height:32px;} .carousel-caption p {font-size:14px; line-height:24px;} } /* -- INDICATORS -- */ .carousel-indicators li {border:1px solid #fff; background:#fff;width:15px;height:15px} .carousel-indicators li.active {border:1px solid #5e44b3; background:#5e44b3;width:15px;height:15px} ol.carousel-indicators {margin-bottom:0;} /* -- LEFT/RIGHT FADE -- */ /* Bootstrap Carousel Fade Transition (for Bootstrap 3.3.x) */ .carousel-fade .carousel-inner .item { opacity: 0; transition-property: opacity; transition-duration: .75s; } .carousel-fade .carousel-inner .active { opacity: 1; } .carousel-fade .carousel-inner .active.left, .carousel-fade .carousel-inner .active.right { left: 0; opacity: 0; z-index: 1; } .carousel-fade .carousel-inner .next.left, .carousel-fade .carousel-inner .prev.right { opacity: 1; } .carousel-fade .carousel-control { z-index: 100; } /* WHAT IS NEW IN 3.3: "Added transforms to improve carousel performance in modern browsers." Need to override the 3.3 new styles for modern browsers & apply opacity */ @media all and (transform-3d), (-webkit-transform-3d) { .carousel-fade .carousel-inner > .item.next, .carousel-fade .carousel-inner > .item.active.right { opacity: 0; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .carousel-fade .carousel-inner > .item.prev, .carousel-fade .carousel-inner > .item.active.left { opacity: 0; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .carousel-fade .carousel-inner > .item.next.left, .carousel-fade .carousel-inner > .item.prev.right, .carousel-fade .carousel-inner > .item.active { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } /* = Highlights -------------------------------------------------------------------------------------------------------------------- ** Advice Media ** */ #highlights h1, #highlights h2, #highlights h3, #highlights h4, #highlights h5, #highlights h6 { color:#FFF } #highlights .hl_holder {border-right:1px solid #fff} #highlights span {background:#5e44b3;display:block;padding:20px 0;color:#fff;text-transform:uppercase;font-size:24px} #highlights .hl_holder:hover span {background:#3f3f3f} @media screen and (max-width:2000px){ #highlights span {font-size:22px} } @media screen and (max-width:1800px){ #highlights span {font-size:20px} } @media screen and (max-width:1500px){ #highlights span {font-size:18px} } @media screen and (max-width:1280px){ #highlights span {font-size:16px} } @media screen and (max-width:992px){ #highlights .hl_holder {width:425px;margin:0 auto} } @media screen and (max-width:380px){ #highlights span {margin-left:-35px} } .highlight { display:block;text-align:center;padding:20px;min-height:90px;background:#db1249;color:#FFF;font-size:25px;} .highlight { background: #3d2786; background: -moz-linear-gradient(left, #3d2786 0%, #db1249 100%); background: -webkit-linear-gradient(left, #3d2786 0%,#db1249 100%); background: linear-gradient(to right, #3d2786 0%,#db1249 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3d2786', endColorstr='#db1249',GradientType=1 ); } .highlight a {color:#FFF} /* = Inside Pages Highlights*/ #inside-pages-highlights h1, #inside-pages-highlights h2, #inside-pages-highlights h3, #inside-pages-highlights h4, #inside-pages-highlights h5, #inside-pages-highlights h6 { color:#FFF } #inside-pages-highlights .hl_holder {border-right:1px solid #fff} #inside-pages-highlights span {background:#5d2c87;display:block;padding:20px 0;color:#fff;text-transform:uppercase;font-size:24px} #inside-pages-highlights .hl_holder:hover span {background:#3f3f3f} @media screen and (max-width:2000px){ #inside-pages-highlights span {font-size:22px} } @media screen and (max-width:1800px){ #inside-pages-highlights span {font-size:20px} } @media screen and (max-width:1500px){ #inside-pages-highlights span {font-size:18px} } @media screen and (max-width:1280px){ #inside-pages-highlights span {font-size:16px} } @media screen and (max-width:992px){ #inside-pages-highlights .hl_holder {width:425px;margin:0 auto} } @media screen and (max-width:1200px){ #inside-pages-highlights { display: none!important} } .highlight { display:block;text-align:center;padding:20px;min-height:90px;background:#db1249;color:#FFF;font-size:25px;} .highlight { background: #3d2786; background: -moz-linear-gradient(left, #3d2786 0%, #db1249 100%); background: -webkit-linear-gradient(left, #3d2786 0%,#db1249 100%); background: linear-gradient(to right, #3d2786 0%,#db1249 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3d2786', endColorstr='#db1249',GradientType=1 ); } .highlight a {color:#FFF} /* = Main Section -------------------------------------------------------------------------------------------------------------------- ** Advice Media ** */ #main {background: #fff; padding:60px 0;} .home #main {padding:100px 0} .home #main h1.topheader {font-size:48px;margin-bottom:50px} .home #main .btn.btnc {margin-top:40px} @media screen and (max-width:1500px){ .home #main h1.topheader {font-size:45px} } @media screen and (max-width:1280px){ .home #main h1.topheader {font-size:40px;margin-bottom:35px} } @media screen and (max-width:1200px){ .home #main h1.topheader {font-size:35px;margin-bottom:30px} } @media screen and (max-width:992px){ .home #main h1.topheader {font-size:30px;margin-bottom:20px} } @media screen and (max-width:768px){ .home #main, #main {padding:50px 0} .home #main h1.topheader {font-size:26px} } /* Hide the breadcrumbs on the homepage */ .home #main #breadcrumbs {display:none;} #main #breadcrumbs {color:#7c63cf; padding: 0!important; margin: -60px 0 10px 0!important} #main #breadcrumbs a {color:#000} @media screen and (max-width: 768px) { #main #breadcrumbs { margin: -30px 0 40px 0!important} } .nosidebar #main .main_section {width:100%;} .main_aside .first {margin-top:0} .main_aside .first .htag {margin:0 0 60px} /* Adjust addthis tool box when after the H1 header */ /*h1.topheader + .addthis_toolbox {margin:-45px 0 60px}*/ /* = Doctor -------------------------------------------------------------------------------------------------------------------- ** Advice Media ** */ #hpdoc {padding:100px 0;} #hpdoc h2.topheader {font-size:48px} #hpdoc img {border-bottom:2px solid #5e44b3} #hpdoc h3.name {font-size:36px;text-transform:none;margin:20px 0 5px} #hpdoc .titles {color:#5e44b3;font-size:24px} #hpdoc .btn.btnc {margin-top:20px} @media screen and (max-width:1500px){ #hpdoc h2.topheader {font-size:45px} } @media screen and (max-width:1280px){ #hpdoc h2.topheader {font-size:40px;margin-bottom:35px} #hpdoc h3.name {font-size:34px} } @media screen and (max-width:1200px){ #hpdoc h2.topheader {font-size:35px} #hpdoc h3.name {font-size:32px} } @media screen and (max-width:992px){ #hpdoc h2.topheader {font-size:30px} #hpdoc .info {width:272px;margin:0 auto} #hpdoc h3.name {font-size:30px} } @media screen and (max-width:768px){ #hpdoc {padding:50px 0} #hpdoc h2.topheader {font-size:26px} #hpdoc h3.name {font-size:28px} } /* = Reviews -------------------------------------------------------------------------------------------------------------------- ** Advice Media ** */ #reviews {padding:80px 0 40px;background:#eeeeee} #reviews h2.topheader {font-size:48px;margin:12px 0 0} #reviews .hline_right {position:relative;z-index:0; margin:-20px 0 32px;width:46%;margin-left:62%;overflow:hidden;border-color:#fff;border-width:2px} #reviews img {display:inline-block;margin-top:-3px} #reviews .yelp {padding-left:70px;vertical-align:bottom} @media screen and (max-width:1500px){ #reviews h2.topheader {font-size:45px} } @media screen and (max-width:1280px){ #reviews h2.topheader {font-size:40px;} #reviews .hline_right {margin:-18px 0 32px 57%;} } @media screen and (max-width:1200px){ #reviews h2.topheader {font-size:35px} #reviews .yelp {padding-left:50px} #reviews .hline_right {margin:-18px 0 32px 70%;width:42%} } @media screen and (max-width:992px){ #reviews h2.topheader {font-size:30px;margin-bottom:30px} #reviews .hline_right {margin:-15px auto 30px} } @media screen and (max-width:768px){ #reviews {padding:50px 0} #reviews h2.topheader {font-size:26px} #reviews img {margin:0 auto} } @media screen and (max-width:500px){ #reviews img {display:block} #reviews .yelp {padding:20px 0 0} #reviews .hline_right {width:60%} } /* = Latest News & Current Special -------------------------------------------------------------------------------------------------------------------- ** Advice Media ** */ #latest-specials {padding:100px 0;background:#fafafa} #latest-specials h2.topheader {font-size:36px;color:#5e44b3} #latest-specials .tpf-latest-post-item {background:var(--wpr-bg-072f7a0c-a30a-4b15-9d5f-70706ef077d5) center repeat-y;padding:0 45px} #latest-specials ul.result_data {display:none} #latest-specials .wp-post-image {margin:0 0 25px -22px;border-bottom:2px solid #5e44b3} #latest-specials h3.title {font-size:34px;margin:0 0 20px} #latest-specials h3>a {color:#46454a} #latest-specials h3>a:hover {color:#5e44b3} #latest-specials .more {text-transform:uppercase;font-weight:700;display:block;margin:20px 0} #latest-specials .view-all {color:#46454a;font-size:16px;letter-spacing:1px;text-transform:uppercase;padding-left:22px} #latest-specials .view-all:hover {color:#5e44b3} @media screen and (max-width:1500px){ #latest-specials h2.topheader {font-size:45px} } @media screen and (max-width:1279px){ #latest-specials h2.topheader {font-size:40px;} #latest-specials .hline_right {margin:-18px 0 32px 57%;} #latest-specials h3.title {font-size:32px} #latest-specials .tpf-latest-post-item {padding:0 25px} #latest-specials .wp-post-image {margin:0 0 25px -20px} #latest-specials .view-all {padding-left:0} } @media screen and (max-width:1200px){ #latest-specials h2.topheader {font-size:35px} #latest-specials .hline_right {margin:-18px 0 32px 70%;width:42%} #latest-specials h3.title {font-size:27px} #latest-specials .wp-post-image {margin:0 0 25px -10px;width:106.7%} #latest-specials .tpf-latest-post-item {padding:0 10px;border-right:6px solid #fafafa} #latest-specials .view-all {margin-left:-15px} } @media screen and (max-width:992px){ #latest-specials h2.topheader {font-size:30px;margin-bottom:30px} #latest-specials .hline_right {margin:-50px 0 47px 38%} #latest-specials .wp-post-image {float:none;margin:0 0 25px -20px;width:380px} #latest-specials .tpf-latest-post-item {margin:0 auto;width:380px;padding:0 20px;border:0} #latest-specials .more {padding:0 0 25px} #latest-specials .view-all {margin:-30px 0 15px;display:block;text-align:center} } @media screen and (max-width:768px){ #latest-specials {padding:50px 0} #latest-specials h2.topheader {font-size:26px} #latest-specials .hline_right {display:none} #latest-specials .view-all {letter-spacing:0} } @media screen and (max-width:375px){ #latest-specials .tpf-latest-post-item {width:92%} #latest-specials .wp-post-image {width:113%} } @media screen and (max-width:360px){ #latest-specials .wp-post-image {width:114%} } @media screen and (max-width:320px){ #latest-specials .wp-post-image {width:115.5%} } /* = Quick Contact -------------------------------------------------------------------------------------------------------------------- ** Advice Media ** */ #quickcontact {padding:90px 0} #quickcontact h2.topheader {font-size:36px;display:inline-block;margin-bottom:30px} #quickcontact .whitebox {background:#fff;padding:60px} #quickcontact .tel {font-size:36px;vertical-align:middle} #quickcontact .phonenumber {display:inline-block;float:right} #quickcontact img {margin-top:4px} #quickcontact span {font-weight:bold;color:#5e44b3} #quickcontact address a {color:#46454a;font-size:18px} #quickcontact address a:hover {color:#5e44b3} #quickcontact p {margin:0} #quickcontact .social {margin-top:60px} /* Quick Contact Gravity Forms Overwrites*/ #quickcontact .form-control {background:#eeeeee; height:auto; padding:16.5px 15px!important; box-shadow:none;color:#707070;font-size:16px} .ie #quickcontact .form-control {padding:17px 15px!important;} #quickcontact .btn.btnc {font-size:16px} #quickcontact .gform_wrapper ul li.gfield {margin-top:10px} #quickcontact .gform2col .gform_wrapper .textarea_wrapper {margin-top:-199px} #quickcontact .gform2col .gform_wrapper .gfield {width:49.5%} #quickcontact .gform2col .gform_wrapper .textarea_wrapper textarea.form-control {width:106%!important} /*-- removes blue border glow on focus on inputs --*/ #quickcontact .form-control:focus { -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075); box-shadow: inset 0 1px 1px rgba(0,0,0,.075); -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s; -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s; } /*-- changes color of placeholder --*/ #quickcontact .gform_wrapper .ginput_container input::-webkit-input-placeholder, #quickcontact .gform_wrapper .ginput_container textarea::-webkit-input-placeholder { color: #707070; } #quickcontact .gform_wrapper .ginput_container input:-moz-placeholder, #quickcontact .gform_wrapper .ginput_container textarea:-moz-placeholder { /* Firefox 18- */ color: #707070; } #quickcontact .gform_wrapper .ginput_container input::-moz-placeholder, #quickcontact .gform_wrapper .ginput_container textarea::-moz-placeholder { /* Firefox 19+ */ color: #707070; } #quickcontact .gform_wrapper .ginput_container input:-ms-input-placeholder, #quickcontact .gform_wrapper .ginput_container textarea:-ms-input-placeholder { color: #707070; } @media screen and (max-width:1500px){ #quickcontact h2.topheader {font-size:34px} #quickcontact .tel {font-size:34px} } @media screen and (max-width:1280px){ #quickcontact h2.topheader {font-size:32px;} #quickcontact .tel {font-size:32px} } @media screen and (max-width:1200px){ #quickcontact h2.topheader {font-size:30px} #quickcontact .tel {font-size:30px;} #quickcontact .phonenumber {float:none;display:block;margin:-40px 0 15px} #quickcontact address a {font-size:16px} } @media screen and (max-width:992px){ #quickcontact h2.topheader {font-size:28px;margin-bottom:30px} #quickcontact .tel {font-size:28px;display:inline-block;float:right;margin:0} #quickcontact .contactform {border-bottom:1px solid #bcbcbc;margin-bottom:15px} } @media screen and (max-width:768px){ #quickcontact {padding:50px 0} #quickcontact h2.topheader {font-size:26px} #quickcontact .tel {font-size:26px;float:none;display:block;margin:10px 0 20px} #quickcontact .whitebox {padding:30px} } @media screen and (max-width:640px){ #quickcontact .gform2col .gform_wrapper .gfield {width:49%} #quickcontact .gform2col .gform_wrapper .textarea_wrapper {margin-top:-225px;} } @media screen and (max-width:560px){ #quickcontact .gform2col .gform_wrapper .textarea_wrapper {margin:0} #quickcontact .gform2col .gform_wrapper .gfield {width:100%} #quickcontact .gform2col .gform_wrapper .textarea_wrapper textarea.form-control {width:100%!important} } /* = Bottom Section|s -------------------------------------------------------------------------------------------------------------------- ** Advice Media ** */ #bottomlocations {background:#FFF; padding:90px 0; font-size:16px} #bottomlocations strong {color:#4c85c5; font-size:24px; font-weight:normal} #bottomlocations .mapimg {height:185px; margin:0} #bottomlocations img {display:block} #bottomlocations .flushcolumns {line-height:10px; margin:0 0 30px} #associations {padding:40px 0; background:#F3F3F3} #bottom1 {background:#ffffff; padding:60px 0; font-size:14px; line-height:26px; color:#979392;} #bottom1 a {color:#979392; font-weight:600;} #bottom1 a:hover {color:#9c600e} #bottom1 h3 {margin:0 0 20px; padding:0; font-size:20px; text-transform:uppercase; color:#9f9d9d} #bottom1 ul {list-style:none outside; margin:0; padding:0;} /* = Footer Section -------------------------------------------------------------------------------------------------------------------- ** Advice Media ** */ #footer {background:#eeeeee; padding:60px 0; color:#aeaeae; font-size:14px;} #footer a {color:#717171} #footer a:hover {color:#5e44b3} #footer ul {margin-bottom:10px} #footer ul#footermenu {margin-bottom:40px} #footer ul#footermenu>li>a{padding:22px 22px;text-transform: uppercase; font-weight:700;} /* = Back to top -------------------------------------------------------------------------------------------------------------------- ** Advice Media ** */ .backtotop.styled { position:fixed;bottom:20px;right:20px;width:55px;height:55px; color:#FFF;font-weight:bold; font-size:30px;line-height:50px; display:none; text-align:center;background-color:#5e44b3; border:1px solid #5e44b3; -webkit-border-radius: 15px;-moz-border-radius: 15px;border-radius: 15px; /* text-indent:-9999px;background: url(../../../../../../themes/alwaysbeautiful/icon_top.png) no-repeat;*/ } /* = Forms -------------------------------------------------------------------------------------------------------------------- ** Advice Media ** */ /* Gravity Forms */ .gform_wrapper .gform_heading, .gform_wrapper .top_label .gfield_label, .gform_wrapper label {display:none!important} .gform_wrapper .ginput_container input.form-control, .gform_wrapper .ginput_complex .ginput_full input.form-control, .gform_wrapper .ginput_container textarea.form-control, .gform_wrapper .ginput_container select.form-control { background:#e5e7e8; width:100%!important;padding: 6px 12px!important;text-indent: 0!important; border-radius:0 !important; border-width:0 !important; } .gfield.disclaimer {font-size:12px; font-style:italic} .gform_wrapper .gform_footer { padding:0!important; text-align:right} .gform_footer input[type=submit] {/*width:100%;*/} /* Long contact form address */ .gform_wrapper .ginput_complex .ginput_left, .gform_wrapper .ginput_complex .ginput_right { width:49%!important; min-height:1px!important; } .gform_wrapper div.ginput_container, .gform_wrapper .address_line_2, .gform_wrapper .ginput_complex > span {margin-top:10px!important;} .gform_wrapper .address_line_2 {display:block} /* Double column layout for short contact */ .gform2col .gform_wrapper .gfield { width:49.5% } .gform2col ul li {margin-bottom:0;} .gform2col .gform_wrapper .ginput_container input.form-control {height:50px;} .gform2col .gform_wrapper .textarea_wrapper { float:right; margin-top:-210px} .gform2col .gform_wrapper .textarea_wrapper textarea {max-height:186px} .gform2col .gform_button {/* display:block!important;*/max-width:300px; margin:0 auto; float:none} @media screen and (max-width: 640px) { .gform2col .gform_wrapper .textarea_wrapper {margin-top:-228px;} .gform2col .gform_wrapper .textarea_wrapper textarea {max-height:215px} .ie .gform2col .gform_wrapper .textarea_wrapper {margin-top:-210px;} .ie .gform2col .gform_wrapper .textarea_wrapper textarea {max-height:200px} } @media (max-width: 560px) { .gform2col .gform_wrapper .gfield { width:100%} .gform2col .gform_wrapper .textarea_wrapper { width:100%; margin-top:0;float:left } .ie .gform2col .gform_wrapper .textarea_wrapper { width:100%; margin-top:0;float:left } } .gform_wrapper .gform_footer input.button {margin: 0!important} @media screen and (max-width: 768px) { .space .btn {display: block!important; width: 250px!important; margin-bottom: 10px!important} } .page-id-4 #main .form-control {background-color: #FFF!important; border-radius: 3px; border: 1px solid #5e44b3!important;} .page-id-125 #main .form-control {background-color: #FFF!important; border-radius: 3px; border: 1px solid #5e44b3!important;} /* = Blog Section -------------------------------------------------------------------------------------------------------------------- ** Advice Media ** */ /*.blog.home #main article, .category #main article .archive #main article { background:#FFF; border-radius:3px; border:1px solid #ccc; padding:30px } */ /*.topheader.resultheader {margin:0 0 10px; font-size:18px;} */ .result_data { display:block; list-style: none outside; padding:10px 0 0 ; clear:both;} .result_data li { display: inline; padding:0 10px 0 0; color:#888} .wp-post-image {float:left; margin:0 25px 0 0} .pagination {display:block; float:left; width:100%; padding:10px 0; margin-top:10px;text-align:left; line-height:45px} .pagination>*{ padding:8px; border:1px solid #ccc; } .pagination .current {background:#dfdfdf} .pagination a[rel=prev] {float:left} .pagination a[rel=next] {float:right} /* = Custom Blog Section -------------------------------------------------------------------------------------------------------------------- ** Advice Media ** */ .blog article.post, .archive article.post {background:var(--wpr-bg-88218a2a-c310-4df3-ad0d-8f9efcc78462) center repeat-y;padding:0 45px} .blog .post_image img, .archive .post_image img {margin:0 0 25px -34px; border-bottom:2px solid #5e44b3; float:none; height:auto} .blog h2.topheader, .archive h2.topheader {font-size:24px;margin:0 0 20px;border:0!important;padding:0!important; font-weight:bold} .blog .result_data li.date, .archive .result_data li.date {font-size:16px;font-weight:bold;color:#bebebe;} .blog .result_data .author, .archive .result_data .author {display:none} .ng-row {float: left; width: 100%;} .blog .continue, .archive .continue {margin:20px 0 0;padding-top:10px} .blog .continue a, .archive .continue a {border-bottom:2px solid #bdbdbd;padding-bottom:5px;display:block;width:93%} .blog .comments-link, .archive .comments-link {padding-bottom:10px;padding-top:5px} .blog .continue, .blog .comments-link, .archive .continue, .archive .comments-link {text-transform:uppercase;font-weight:700;display:block;background:#d2d2d2;width:122%;margin-left:-34px;padding-left:34px} .blog .half, .archive .half {width: 50%;float: left;} @media screen and (max-width:1279px){ .blog article.post, .archive article.post{padding:0 25px;border-right:6px solid #fff} .blog .post_image img {margin:0 0 25px -20px} .blog .continue, .blog .comments-link, .archive .continue, .archive .comments-link {width:116%;margin-left:-24px;padding-left:24px} .blog .post_image img, .archive .post_image img {height:auto;width:116.2%;margin:0 0 25px -25px} } @media screen and (max-width:1200px){ .blog h2.topheader, .archive h2.topheader {font-size:27px} .blog .post_image img, .archive .post_image img {margin:0 0 25px -10px;width:107.3%} .blog article.post, .archive article.post {padding:0 10px;} .blog .continue, .blog .comments-link, .archive .continue, .archive .comments-link {width:107%;margin-left:-9px} } @media screen and (max-width:992px){ .blog .post_image img, .archive .post_image img {float:none;margin:0 0 25px -20px;width:380px} .blog article.post, .archive article.post {margin:0 auto;width:380px;padding:0 20px;border:0} .blog .half, .archive .half {float:none;width:100%} .blog .continue, .blog .comments-link, .archive .continue, .archive .comments-link {width:112%;margin-left:-21px;padding-left:21px} } @media screen and (max-width:768px){ .blog article.post, .archive article.post {margin-top:73px;background:#eeeeee;width:351px} .blog .continue, .blog .comments-link, .archive .continue, .archive .comments-link {width:113%;margin-left:-21px;padding-left:21px} .blog .post_image img, .archive .post_image img {width:113%} } @media screen and (max-width:375px){ .blog article.post, .archive article.post {width:92%} .blog .post_image img, .archive .post_image img {width:115.4%} .blog .continue, .blog .comments-link, .archive .continue, .archive .comments-link {width:115.4%} } @media screen and (max-width:360px){ .blog .post_image img, .archive .post_image img {width:116.3%} .blog .continue, .blog .comments-link, .archive .continue, .archive .comments-link {width:116.5%;margin-left:-20px;padding-left:20px} } @media screen and (max-width:320px){ .blog .post_image img, .archive .post_image img {width:118.9%} .blog .continue, .blog .comments-link, .archive .continue, .archive .comments-link {width:119%;margin-left:-20px} } /* = Maps Google Map API & InfoWindow Styles -------------------------------------------------------------------------------------------------------------------- ** Advice Media ** */ .mapcanvas {float:left; width:99%; height:500px; margin: 0 0 20px; border:0 double #ccc} .iwindow {line-height:18px;width:250px} .iwindow hr { border:0;margin:10px 0; background:0; border-top:1px solid #ddd; width:100%; clear:both } .iwindow a {font-size:12px} .iwindow.hasimg {width:350px} .iwindow.hasimg hr {float:left;} .hasimg.hasimg .infoimg {float:left;max-width:100px;margin:0 10px 0 0} .mapimg {display:block; height:100px; width:auto;} /* -- Directions form - active only on single locations -- */ .directions_form {float:left;display:block;border:1px solid #ddd; width:100%} .directions_form>div {display:block;padding:10px; overflow:hidden} .directions_form .saddr{float:left; width:75%; padding:10px} .directions_form strong {display:block} .directions_form .dbtn {float:right; width:18%; border:0; padding:10px;} /* -- map_info styles/ Bubble -- */ .map_info {clear:none!important;overflow:hidden; line-height:18px; float:left; cursor:pointer} .map_info {width:32%;margin:0 1% 10px 0} .map_info .org, .map_info .line1, .map_info .line2, .map_info .csz, .map_info .tel, .map_info .fax, .map_info .extra {display:block;} .map_info .full_address {display:block;padding-bottom:10px} @media screen and (max-width: 990px) { .directions_form .saddr{width:60%;} .directions_form .dbtn {width:30%;} } @media screen and (max-width: 768px) { .directions_form .saddr{width:100%;} .directions_form .dbtn {width:100%;} } /* = Bootstrap overwrites -------------------------------------------------------------------------------------------------------------------- ** Advice Media ** */ /* change the gutter widths to 25px. Essentially making them 50px in between columns */ .row { margin-left: -25px; margin-right: -25px; } .col-xs-25, .col-md-25, .col-lg-25, .col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 { padding-left: 25px; padding-right: 25px; } .container, .fwpadded { padding-left:25px; padding-right:25px} /* Change the width of the container for med screens*/ @media (min-width: 1280px) { .container { width: 1280px; } } /* = Framework overwrites -------------------------------------------------------------------------------------------------------------------- ** Advice Media ** */ [class*="qcol-"] { -webkit-column-gap: 50px; /* Chrome, Safari, Opera */ -moz-column-gap: 50px; /* Firefox */ column-gap: 50px; } /* Insie Pages Banner */ .iptb {background-color: #d5d5d5;} .iptb p {margin-bottom: 0!important} .page-id-123 img.aligncenter {margin-bottom: -2.4em!important} /* Gallery */ .mngallery-archive .post_image.vertical.ba-slider img {max-width:none!important} .mngallery-archive .post_image {height: auto!important; width: auto!important} .mngallery-archive article h2 {height:32px!important} .mngallery-single #imagesetcontainer {background: #ffffff!important; border: 1px solid #5e44b3!important;} /* .mngallery-archive article {max-width: 350px!important; display: inline-block!important; margin-bottom: 20px!important; border: 1px solid #5e44b3!important;} */ .post-type-archive-mngallery #breadcrumbs {display: none!important} #main .mngallery-archive #breadcrumbs {margin-top: -45px!important;} @media screen and (max-width: 768px) { #main .mngallery-archive #breadcrumbs {margin-top: -15px!important;} #main .mngallery-archive h1 {margin-top: -15px!important} } /* Responsive Video */ .video-container {position:relative;padding-bottom:56.25%;padding-top:30px;height:0;overflow:hidden;margin-bottom: 20px; } .video-container iframe, .video-container object, .video-container embed {position:absolute;top:0;left:0;width:100%;height:100%; }