* {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
body.page-id-82 .flex-direction-nav .flex-prev,body.page-id-82 .metaslider.outreach-edit .flexslider:hover .flex-prev {
left: -50px !important;
}
body.page-id-82 .flex-direction-nav .flex-next, body.page-id-82 .metaslider.outreach-edit .flexslider:hover .flex-next, body.page-id-82 .metaslider .flexslider:focus-within .flex-next{
right: -50px !important;
}
.team_list_1, .team_list_5 {
float: right;
margin: 0 0px 20px 25px;
clear: right;
}
.team_list_3,.team_list_7 {
float: left;
margin: 0 5.5% 2.5% 0;
clear: left;
}
.right,
.img-right {
margin: 0 0px 20px 25px;
}
.left,
.img-left {
margin: 0 5.5% 2.5% 0;
}
.fa,
.fas,
.fab,
.far,
.fal {
vertical-align: middle;
}
.embed-video {
width: 0;
display: block;
padding: 30% 50%;
position: relative;
margin-bottom: 30px;
}
.embed-video iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
} .caps {
text-transform: uppercase;
}
.lowercase {
text-transform: lowercase;
}
.normalcase, .no-caps {
text-transform: none !important;
}
.rel {
position: relative;
}
.w300 {
font-weight: 300 !important;
}
.w400 {
font-weight: 400 !important;
}
.w500 {
font-weight: 500 !important;
}
.w600 {
font-weight: 600 !important;
}
.w700 {
font-weight: 700 !important;
}
.w900 {
font-weight: 900 !important;
}
.w800 {
font-weight: 800 !important;
}
.w900 {
font-weight: 900 !important;
}
.em {
font-style: italic !important;
}
.round {
-webkit-border-radius: 999em;
-moz-border-radius: 999em;
border-radius: 999em;
}
@-webkit-keyframes mymove {
from {
left: 300px;
opacity: 0;
}
to {
left: 0;
opacity: 1;
}
}
@-moz-keyframes mymove {
from {
left: 300px;
opacity: 0;
}
to {
left: 0;
opacity: 1;
}
}
@-o-keyframes mymove {
from {
left: 300px;
opacity: 0;
}
to {
left: 0;
opacity: 1;
}
}
@keyframes mymove {
from {
left: 300px;
opacity: 0;
}
to {
left: 0;
opacity: 1;
}
} h1, h2, h3, h4, h5, h6 {
margin: 0;
padding: 0;
font-weight: normal;
}
p {
margin: 0;
}
p, ul {
-webkit-column-break-inside: avoid;
page-break-inside: avoid;
break-inside: avoid;
} ul li {
list-style: disc;
}
li {
line-height: 1.5;
}
.hr {
visibility: hidden;
}
.img-right {
max-width: 100%;
}
#content ul {
margin: 0 0 1.8em 39px;
}
#ft ul, #subnav {
margin: 0;
padding: 0;
}
#bd-callouts li, #ft ul li, #subnav li, body.sitemap #content ul li {
list-style: none;
}
#main-nav nav.horizontal ul li {
float: none;
} table.office-hours {
background: rgba(0, 0, 0, 0.008);
padding: 17px;
border: 1px solid rgba(0, 0, 0, 0.1);
border-collapse: collapse;
font-size: .95em;
line-height: 1.45em;
}
table.office-hours td {
padding: 10px 10px;
border: 1px solid rgba(0, 0, 0, 0.1);
padding-right: 12px;
font-size: .96em;
}
table.office-hours td.time {
opacity: .8;
}
table.office-hours td.title {
font-size: 1.07em;
}
.slideshow-nav .slideshow-active-page a {
color: #79a51f !important;
} body.sitemap .content-text {
width: 100%;
}
body.sitemap #content ul {
margin: 0 0 1.8em 0;
}
body.sitemap #content ul li {
margin-top: 21px;
list-style: none;
}
body.sitemap #content ul li a {
font-size: 1.125em;
color: #79a51f;
display: inline-block;
text-decoration: none;
}
body.sitemap #content ul ul {
padding-left: 0;
margin: 0 0 0 38px;
}
body.sitemap #content ul ul li {
margin: 0;
list-style: none;
}
body.sitemap #content ul ul li a {
display: inline-block;
font-size: 1em;
color: #333333;
text-transform: capitalize;
}
body.sitemap #content ul li a:hover,
body.sitemap #content ul ul li a:hover {
color: #9fc455;
}
.office_tour {
display: block;
position: relative;
}
.office_tour .cycle-slideshow {
display: block;
width: 96%;
max-width: 800px;
margin-left: auto;
margin-right: auto;
}
.office_tour .cycle-slide {
margin-left: auto !important;
margin-right: auto  !important; 
}
.office_tour .controls {
width: 100%;
display: block;
position: absolute;
top: 50%;
margin: 0 auto;
-webkit-transform: translate(0, -50%);
-moz-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
-o-transform: translate(0, -50%);
transform: translate(0, -50%);
left: 0;
z-index: 400;
}
.office_tour .controls > div {
color: #79a51f;
font-size: 50px;
display: inline-block;
-webkit-transition-duration: 0.35s;
-moz-transition-duration: 0.35s;
-o-transition-duration: 0.35s;
transition-duration: 0.35s;
-webkit-transition-timing-function: ease-in-out;
-moz-transition-timing-function: ease-in-out;
-o-transition-timing-function: ease-in-out;
transition-timing-function: ease-in-out;
}
.office_tour .controls > div:hover {
cursor: pointer;
-webkit-transform: scale(1.44);
-moz-transform: scale(1.44);
-ms-transform: scale(1.44);
-o-transform: scale(1.44);
transform: scale(1.44);
opacity: 0.5;
}
.office_tour .controls > div[id^="prev"] {
float: left;
}
.office_tour .controls > div[id^="next"] {
float: right;
direction: rtl;
} form button {
background: #79a51f;
color: #fff;
text-transform: uppercase;
padding: 15px 37px;
text-align: center;
font-size: 0.9285714285714286em;
display: inline-block;
border: none;
-webkit-transition-duration: 0.5s;
-moz-transition-duration: 0.5s;
-o-transition-duration: 0.5s;
transition-duration: 0.5s;
}
form button:hover {
background: #3a4f0f;
} .stButton {
margin-left: 0 !important;
margin-right: 0 !important;
}
.st_plusone_large {
top: 9px;
position: relative;
}
.share-article-links {
text-align: center;
}
.share-text {
color: #79a51f;
font-size: 1.5em;
margin: 0 0 0.8em;
font-weight: 400;
text-align: center;
}
form#blog_search {
background: #79a51f;
color: #333333;
margin: 10px 0 0;
position: relative;
text-align: center;
width: 100%;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
padding: 20px 0 30px;
}
form#blog_search label {
color: #fff;
text-transform: uppercase;
font-size: 18px;
margin: 0px;
text-align: center;
margin: 0 0 3px;
}
form#blog_search input {
background: #fff;
color: #333333;
border: 1px solid rgba(0, 0, 0, 0.4);
width: 70%;
margin: 6px auto;
-webkit-transition: all .15s linear;
-o-transition: all .15s linear;
-moz-transition: all .15s linear;
transition: all .15s linear;
}
form#blog_search input:hover {
background: #ebebeb;
}
form#blog_search button {
display: block;
background: #9fc455;
color: #fff;
text-transform: uppercase;
font-size: 13px !important;
padding: 11px 21px !important;
-webkit-transition: all .25s linear;
-o-transition: all .25s linear;
-moz-transition: all .25s linear;
transition: all .25s linear;
margin: 5px auto 0;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
form#blog_search button:active,
form#blog_search button:hover {
background: #68852e;
}  .ie8 nav.horizontal ul li a {
max-width: none;
}
.ie8 .slideshow-item {
display: none;
}
.ie8 .slideshow-active {
display: block;
}
.shift {
position: relative;
}
.columns {
display: inline;
float: left;
}
.genie {
opacity: 1.0;
filter: alpha(opacity=100);
}
.genie:hover {
opacity: 0.4;
filter: alpha(opacity=40);
}
.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.video-container iframe, .video-container object, .video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
input[type="text"], input[type="email"], input[type="search"], input[type="tel"], input[type="file"], textarea {
width: 80%;
}
body.office-tour .video-sleeve {
margin: 0 auto;
max-width: 600px;
}
#invisalign-before-after {
max-width: 464px;
width: 100%;
}
#invisalign-before-after ul {
margin: 0;
}
#invisalign-before-after p.caption {
position: relative;
}
#damon-before-after {
max-width: 539px;
width: 100%;
}
.test-cred {
display: block;
font-weight: bold;
font-size: smaller;
}
.flash {
margin: 20px 0;
} body.types-of-appliances div.hr, body.ortho-dictionary div.hr {
display: none;
}
#hide-stock {
display: none;
}
body[class^='meet-dr-'] #hide-stock,
body[class^='about-dr-'] #hide-stock,
body[class^='meet-the-doctor'] #hide-stock {
display: block !important;
text-align: center;
margin: 1em auto;
}
form p {
height: auto;
}
.page-template-meet-dr-pepper > #inner-page > div.banner-section {
height: 30vw;
}
.page-template-meet-dr-pepper > #inner-page > div.banner-section > img {
top: -200px;
}
.banner-section {
min-height: 23vw;
}
.banner-section img {
position: relative;
width: 100%;
max-width: 100%;
}
@media only screen and (min-width: 48em) {
.row > .col {
border: 0px solid rgba(0, 0, 0, 0);
display: block;
float: left;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-moz-background-clip: padding-box !important;
-o-background-clip: padding-box !important;
background-clip: padding-box !important;
margin-left: 5%;
}
.row > .col:first-child {
margin-left: 0%;
}
#staff-array .row > .col {
margin-left: 0;
}
#staff-array .row > .col:first-child {
margin-left: 5%;
} .row > .col.span1 {
width: 3.75%;
}
.row > .col.span2 {
width: 12.5%;
}
.row > .col.span3, .row > .col.quarter {
width: 21.25%;
}
.row > .col.span4, .row > .col.third {
width: 30%;
}
.row > .col.span5 {
width: 38.75%;
}
.row > .col.span6, .row > .col.half {
width: 47.5%;
}
.row > .col.span7 {
width: 56.25%;
}
.row > .col.span8 {
width: 65%;
}
.row > .col.span9 {
width: 73.75%;
}
.row > .col.span10 {
width: 82.5%;
}
.row > .col.span11 {
width: 91.25%;
}
.row > .col.span12, .row > .col.full {
width: 100%;
}
.row > .col.offset1 {
margin-left: 8.75%;
}
.row > .col.offset2 {
margin-left: 17.5%;
}
.row > .col.offset3 {
margin-left: 26.25%;
}
.row > .col.offset4 {
margin-left: 35%;
}
.row > .col.offset5 {
margin-left: 43.75%;
}
.row > .col.offset6 {
margin-left: 52.5%;
}
.row > .col.offset7 {
margin-left: 61.25%;
}
.row > .col.offset8 {
margin-left: 70%;
}
.row > .col.offset9 {
margin-left: 78.75%;
}
.row > .col.offset10 {
margin-left: 87.5%;
}
.row > .col.offset11 {
margin-left: 96.25%;
}
body.sitemap #content .width1 {
width: 50%;
display: inline;
float: left;
}
#hide-stock {
display: block;
margin: 0 0 1em 0;
}
body[class^='meet-dr-'] #hide-stock {
margin: 0 0 1em 0;
}
.video-sleeve {
width: 100%;
max-width: 80%;
}
.video-sleeve-60 {
width: 100%;
max-width: 60%;
} table.office-hours {
font-size: 1em;
}
table.office-hours td {
padding: 9px 15px;
padding-right: 30px;
}
table.office-hours td.title {
padding: 11px 15px;
}
}
body {
font: normal normal 18px/33px 'Montserrat', Helvetica, Arial, sans-serif;
background: #fff;
color: #333333;
overflow-x: hidden;
-webkit-transition-duration: 0.3s;
-moz-transition-duration: 0.3s;
-o-transition-duration: 0.3s;
transition-duration: 0.3s;
}
.font1,
.main-content-section h1,
.main-content-section h2,
.main-content-section h3,
.main-content-section h4,
.main-content-section h5 {
font-family: 'Oswald', Helvetica, Arial, sans-serif;
}
.font2 {
font-family: 'Shadows Into Light Two', Helvetica, Arial, sans-serif;
} a {
color: #79a51f;
-webkit-transition-duration: 0.31s;
-moz-transition-duration: 0.31s;
-o-transition-duration: 0.31s;
transition-duration: 0.31s;
text-decoration: none;
}
a:hover {
color: #9fc455;
}
hr {
color: #c7c6c7;
background-color: #c7c6c7;
border: none;
height: 1px;
clear: both;
margin: 36px 0;
} .section-container,
section, #ft {
padding: 40px 0;
}
.section-container,
section, #ft, #hd {
position: relative;
}
.ie8 .container {
width: 1000px;
}
.container {
margin: 0 4.5%;
width: auto !important;
max-width: 1000px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
ul, ol {
margin: 0 0 1.8em 2em;
} #hd {
z-index: 90;
text-align: center;
background: #fff;  }
#hd .container {
margin: 0 auto;
}
#hd .logo {
display: block;
text-align: center;
margin: 0 auto;
padding: 17px 38px 20px;
}
#hd .logo span {
display: inline-block;
position: relative;
}
#hd .logo img {
display: inline-block;
width: 76% !important;
height: auto;
padding-top: .33em;
-webkit-transition: .35s;
-o-transition: .35s;
-moz-transition: .35s;
transition: .35s;
}
#hd .logo .icon {
margin-bottom: 5px;
}
#hd .logo .icon img {
max-width: 150px;
}
#hd .logo:hover img {
-webkit-transform: scale(0.97);
-moz-transform: scale(0.97);
-ms-transform: scale(0.97);
-o-transform: scale(0.97);
transform: scale(0.97);
opacity: .9;
}
#hd .extra {
margin: 10px 0 0;
line-height: 20px;
font-size: 17px;
line-height: 17px;
}
#hd .extra a {
background: #73952b;
display: inline-block;
position: relative;
color: #fff;
padding: 3px 12px;
margin: 2px 0;
letter-spacing: 0.0em;
-webkit-transition: .3s;
-o-transition: .3s;
-moz-transition: .3s;
transition: .3s;
vertical-align: top;
}
#hd .extra a:hover {
background: #66881f;
}
#hd .extra .phone-outer {
display: inline-block;
background: #73952b;
padding: 3px 12px;
margin: 2px 0;
}
#hd .extra .phone-outer .phone,
#hd .extra .phone-outer .phone a {
color: #fff;
display: inline-block;
background: none;
padding: 0;
margin: 0;
}
#hd #main-nav {
z-index: 100;
text-align: center;
margin: 0;
height: 0;
position: absolute;
top: 0;
right: 0;
width: 100%;
}
#hd #main-nav .trigger {
color: #fff;
padding: 1px 8px 0;
font-size: 17px;
display: inline-block;
width: auto;
position: absolute;
top: 0;
right: -2px;
z-index: 9000;
}
#hd #main-nav .trigger .label {
display: none;
}
#hd #main-nav .trigger:hover .nav-icon {
-webkit-transform: scale(0.9);
-moz-transform: scale(0.9);
-ms-transform: scale(0.9);
-o-transform: scale(0.9);
transform: scale(0.9);
}
#hd #main-nav .open .trigger {
background: #fff;
}
#hd #main-nav .open .trigger .nav-icon {
-webkit-transform: scale(1.16);
-moz-transform: scale(1.16);
-ms-transform: scale(1.16);
-o-transform: scale(1.16);
transform: scale(1.16);
}
#hd #main-nav .extra {
display: none;
}
#hd #main-nav .nav-icon {
width: 21px;
height: 14px;
position: relative;
display: inline-block;
top: -.14em;
z-index: 900;
-webkit-transition: .35s;
-o-transition: .35s;
-moz-transition: .35s;
transition: .35s;
}
#hd #main-nav .nav-icon span {
display: block;
position: absolute;
height: 2px;
width: 100%;
background: #555;
-webkit-border-radius: 1px;
-moz-border-radius: 1px;
border-radius: 1px;
opacity: 1;
left: 0;
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-transition: .35s;
-o-transition: .35s;
-moz-transition: .35s;
transition: .35s;
}
#hd #main-nav .nav-icon span:nth-child(1) {
top: 0px;
}
#hd #main-nav .nav-icon span:nth-child(2), #hd #main-nav .nav-icon span:nth-child(3) {
top: 50%;
}
#hd #main-nav .nav-icon span:nth-child(4) {
top: 100%;
}
#hd #main-nav .open .nav-icon span:nth-child(1) {
top: 50%;
width: 0%;
left: 50%;
}
#hd #main-nav .open .nav-icon span:nth-child(2) {
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}
#hd #main-nav .open .nav-icon span:nth-child(3) {
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
}
#hd #main-nav .open .nav-icon span:nth-child(4) {
top: 50%;
width: 0%;
left: 50%;
}
#hd #main-nav .collapsible {
-webkit-transition: .7s;
-o-transition: .7s;
-moz-transition: .7s;
transition: .7s;
width: 100%;
}
#hd #main-nav .collapsible ul {
position: relative;
-webkit-transition: opacity 1s;
-o-transition: opacity 1s;
-moz-transition: opacity 1s;
transition: opacity 1s;
padding: 10px 0;
z-index: 0;
}
#hd #main-nav .collapsible ul li a {
font-size: 15px;
line-height: 16px;
margin: 0 0 1px;
color: #fff;
display: none;
-webkit-transition: .3s;
-o-transition: .3s;
-moz-transition: .3s;
transition: .3s;
}
#hd #main-nav .collapsible ul ul {
padding: 0;
-webkit-transition: .5s;
-o-transition: .5s;
-moz-transition: .5s;
transition: .5s;
display: block;
}
#hd #main-nav .collapsible ul ul li {
height: 0;
overflow: hidden;
-webkit-transition: .4s;
-o-transition: .4s;
-moz-transition: .4s;
transition: .4s;
opacity: 0;
}
#hd #main-nav .collapsible.open {
background: rgba(97, 96, 96, 0.975);
position: absolute;
height: auto;
padding: 20px 0;
}
#hd #main-nav .collapsible.open .extra {
display: block;
}
#hd #main-nav .collapsible.open ul li a {
display: block;
}
#hd #main-nav .collapsible.open ul li a:hover,
#hd #main-nav .collapsible.open ul li.open > a {
color: #fff;
background: rgba(5, 5, 5, 0.22);
}
#hd #main-nav .collapsible.open ul .open ul {
background: rgba(5, 5, 5, 0.15);
padding-bottom: 10px;
}
#hd #main-nav .collapsible.open ul .open ul li {
height: 43px;
opacity: 1;
} .home-slideshow-section {
padding: 0;
height: auto;
overflow: hidden;
z-index: 1;
text-align: center;
background: #fff;
background: url(https://vargosmile.com/wp-content/uploads/2025/12/homepage-banner.webp) center center / cover no-repeat #fff;
aspect-ratio: 40 / 27;
}
.home-slideshow-section video {
margin: 0 -10%;
z-index: 10;
position: relative;
display: block;
width: 120%;
height: 100%;
aspect-ratio: 16 / 9;
object-fit: cover;
}
.home-slideshow-section .caption {
font-size: 16px;
line-height: 26px;
color: #fff;
padding: 21% 15px 15%;
letter-spacing: .00em;
z-index: 50;
position: absolute;
top: 50%;
-webkit-transform: translateX(-50%) translateY(-50%);
-moz-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
-o-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
left: 50%;
}
.home-slideshow-section .caption .btn {
margin-top: 30px;
display: inline-block;
font-size: 18px;
line-height: 18px;
padding: 18px 30px;
border: 1px solid #fff;
background: rgba(255, 255, 255, 0.32);
color: #fff;
letter-spacing: .06em;
-webkit-transition: .4s;
-o-transition: .4s;
-moz-transition: .4s;
transition: .4s;
}
.home-slideshow-section .caption .btn:hover {
background: rgba(255, 255, 255, 0.22);
-webkit-transform: scale(1.2);
-moz-transform: scale(1.2);
-ms-transform: scale(1.2);
-o-transform: scale(1.2);
transform: scale(1.2);
} .subnav-section {
text-align: center;
background: url(https://vargosmile.com/wp-content/themes/vargoorthodontics/images/texture.jpg) center top repeat #e9e5e5;
padding: 25px 0;
}
.subnav-section p,
.subnav-section a {
color: #fff;
}
.subnav-section p {
font-size: 14px;
line-height: 19px;
letter-spacing: 0.0em;
color: #fff;
}
.subnav-section p a {
text-decoration: none;
display: inline-block;
color: #363434;
margin: 0px 5px;
}
.subnav-section p a.active, .subnav-section p a:hover {
color: #79a51f;
-webkit-transform: scale(1.15);
-moz-transform: scale(1.15);
-ms-transform: scale(1.15);
-o-transform: scale(1.15);
transform: scale(1.15);
}
h1 {
font-size: 40px;
line-height: 40px;
font-weight: 400;
color: #363434;
margin-bottom: 30px;
padding-bottom: 0;
letter-spacing: 0.0em;
text-transform: uppercase;
}
.home h1 {
text-align: center;
} .main-content-section {
z-index: 9;
background: #fff;   }
.main-content-section h2 {
color: #79a51f;
text-transform: uppercase;
font-size: 30px;
font-weight: 400;
}
.main-content-section h3 {
color: #79a51f;
text-transform: uppercase;
font-size: 28px;
font-weight: 400;
}
.main-content-section h4 {
font-size: 26px;
font-weight: 400;
}
.main-content-section h5,
.main-content-section h6 {
font-size: 24px;
font-weight: 400;
}
.main-content-section .staff-photo {
margin: 0 auto 20px;
display: block;
}
.main-content-section #sidebar img {
max-width: 100%;
width: auto;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.main-content-section .content-text {
text-align: left;
min-height: 270px;
}
.home .main-content-section .content-text {
min-height: 170px;
}
.main-content-section .content-text a { }
.main-content-section .content-text h2, .main-content-section .content-text h3, .main-content-section .content-text h4, .main-content-section .content-text h5, .main-content-section .content-text h6,
.main-content-section header h2,
.main-content-section header h3,
.main-content-section header h4,
.main-content-section header h5,
.main-content-section header h6 {
margin: 0.2em 0 0.7em;
text-align: left;
}
.office-tour .main-content-section .content-text h2,
.before-and-after .main-content-section .content-text h2, .office-tour .main-content-section .content-text h3,
.before-and-after .main-content-section .content-text h3, .office-tour .main-content-section .content-text h4,
.before-and-after .main-content-section .content-text h4, .office-tour .main-content-section .content-text h5,
.before-and-after .main-content-section .content-text h5, .office-tour .main-content-section .content-text h6,
.before-and-after .main-content-section .content-text h6, .office-tour
.main-content-section header h2,
.before-and-after
.main-content-section header h2, .office-tour
.main-content-section header h3,
.before-and-after
.main-content-section header h3, .office-tour
.main-content-section header h4,
.before-and-after
.main-content-section header h4, .office-tour
.main-content-section header h5,
.before-and-after
.main-content-section header h5, .office-tour
.main-content-section header h6,
.before-and-after
.main-content-section header h6 {
text-align: center;
}
.main-content-section .content-text p,
.main-content-section header p {
margin: 0 0 1.58em;
}
.main-content-section .content-text ul li,
.main-content-section header ul li {
margin: 0 0 8px;
}
.sitemap .main-content-section .content-text ul, .sitemap
.main-content-section header ul {
margin: 0 0 20px;
font-size: 1.25em;
}
.sitemap .main-content-section .content-text ul li, .sitemap
.main-content-section header ul li {
margin: 3px 0;
list-style: none;
}
.sitemap .main-content-section .content-text ul li ul, .sitemap
.main-content-section header ul li ul {
font-size: .85em;
margin: 0 0 20px 15px;
}
.sitemap .main-content-section .subnav,
.blog .main-content-section .subnav {
display: none;
} .section1 {
z-index: 10;
padding: 50px 0;
text-align: center;
background: url(https://vargosmile.com/wp-content/themes/vargoorthodontics/images/section1.jpg) center center #444;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
color: #fff;
padding: 0;
}
.section1 .container {
padding: 0;
margin: 0;
}
.section1 .side1,
.section1 .side2 {
padding: 30px 20px;
}
.section1 .side1 {
background: url(https://vargosmile.com/wp-content/themes/vargoorthodontics/images/section2.jpg) center center #679013;
}
.section1 .side2 {
background: url(https://vargosmile.com/wp-content/themes/vargoorthodontics/images/section3.jpg) center center #424141;
}
.section1 .icon {
margin: 0 0 13px;
}
.section1 .icon img {
height: 100px;
width: auto;
}
.section1 h2 {
font-size: 40px;
line-height: 42px;
letter-spacing: .0em;
margin: 0 0 10px;
}
.section1 p {
font-size: 18px;
line-height: 30px;
margin: 10px 0 0;
}
.section1 .btn {
margin-top: 30px;
display: inline-block;
font-size: 18px;
line-height: 18px;
padding: 19px 30px;
border: 1px solid #fff;
background: rgba(255, 255, 255, 0.32);
color: #fff;
letter-spacing: .06em;
-webkit-transition: .4s;
-o-transition: .4s;
-moz-transition: .4s;
transition: .4s;
}
.section1 .btn:hover {
background: rgba(255, 255, 255, 0.15);
-webkit-transform: scale(1.2);
-moz-transform: scale(1.2);
-ms-transform: scale(1.2);
-o-transform: scale(1.2);
transform: scale(1.2);
} .callout-section1 {
z-index: 10;
text-align: center;
background: #f6f2f2;
padding: 35px 0;
}
.callout-section1 h2 {
color: #616060;
margin-bottom: 30px;
}
.callout-section1 .callout {
display: inline-block;
width: 100%;
vertical-align: top;
padding: 10px 0;
}
.callout-section1 .callout a {
padding: 0;
color: #363434;
position: relative;
-webkit-transition: .45s;
-o-transition: .45s;
-moz-transition: .45s;
transition: .45s;
display: block;
letter-spacing: .00em;
}
.callout-section1 .callout a p {
display: none;
}
.callout-section1 .callout a h4 {
text-transform: uppercase;
font-size: 23px;
line-height: 23px;
margin: 0;
padding: 0;
}
.callout-section1 .callout a .photo img {
width: 100%;
max-width: 200%;
}
.callout-section1 .callout a .icon {
padding: 10px;
display: none;
}
.callout-section1 .callout a .icon img {
width: 63px;
}
.callout-section1 .callout a .info {
position: relative;
background: #fff;
text-align: left;
}
.callout-section1 .callout a .main {
padding: 20px;
}
.callout-section1 .callout a:hover {
-webkit-transform: scale(1.04);
-moz-transform: scale(1.04);
-ms-transform: scale(1.04);
-o-transform: scale(1.04);
transform: scale(1.04);
}
.callout-section1 .callout.callout1 a .icon {
background: #79a51f;
}
.callout-section1 .callout.callout2 a .icon {
background: #616060;
}
.callout-section1 .callout.callout3 a .icon {
background: #a3a4a5;
}
.callout-section1 .callout.callout4 a .icon {
background: #9ec847;
}
.callout-section1 .callout.callout5 a .icon {
background: #c4e67d;
}
.callout-section1 .callout.callout6 a .icon {
background: #cdcbcb;
} .testimonials-section {
z-index: 10;
padding: 50px 0;
text-align: center;
background: #545454;
color: #fff;
}
.testimonials-section ul, .testimonials-section li {
margin: 0;
padding: 0;
}
.testimonials-section h2 {
margin: 0 0 20px;
font-size: 35px;
line-height: 35px;
letter-spacing: .0em;
margin: 10px 0 0;
}
.testimonials-section p {
font-size: 18px;
line-height: 30px;
margin: 10px 0 0;
}
.testimonials-section .btn {
margin-top: 30px;
display: inline-block;
font-size: 18px;
line-height: 18px;
padding: 19px 28px;
border: 1px solid #fff;
background: rgba(255, 255, 255, 0.32);
color: #fff;
letter-spacing: .06em;
-webkit-transition: .4s;
-o-transition: .4s;
-moz-transition: .4s;
transition: .4s;
}
.testimonials-section .btn:hover {
background: rgba(255, 255, 255, 0.15);
-webkit-transform: scale(1.2);
-moz-transform: scale(1.2);
-ms-transform: scale(1.2);
-o-transform: scale(1.2);
transform: scale(1.2);
}
.testimonials-section .social-icons {
display: none;
}
.section2 {
text-align: center;
}
.section2 h2 {
margin: 0 0 20px;
font-size: 35px;
line-height: 35px;
letter-spacing: .0em;
margin: 10px 0 0;
color: #363434;
}
.section2 p {
font-size: 18px;
line-height: 30px;
margin: 10px 0 0;
}
.section2 .btn {
margin-top: 30px;
display: inline-block;
font-size: 18px;
line-height: 18px;
padding: 19px 28px;
background: #79a51f;
color: #fff;
letter-spacing: .06em;
-webkit-transition: .4s;
-o-transition: .4s;
-moz-transition: .4s;
transition: .4s;
}
.section2 .btn:hover {
background: #658d13;
-webkit-transform: scale(1.2);
-moz-transform: scale(1.2);
-ms-transform: scale(1.2);
-o-transform: scale(1.2);
transform: scale(1.2);
}
.section2 .video {
display: none;
} #ft {
background: url(https://vargosmile.com/wp-content/themes/vargoorthodontics/images/ft-location.jpg) center center #545454;
text-align: center;
z-index: 10;
}
#ft .map {
display: none;
}
#ft .markers {
display: none;
}
#ft .logo {
display: block;
margin: 0 0 10px;
}
#ft .logo:hover {
-webkit-transform: scale(0.95);
-moz-transform: scale(0.95);
-ms-transform: scale(0.95);
-o-transform: scale(0.95);
transform: scale(0.95);
}
#ft .title {
color: #333333;
font-size: 35px;
line-height: 34px;
display: block;
letter-spacing: .1em;
margin-bottom: 10px;
}
#ft .title:hover {
color: #769f23;
}
#ft .main {
color: #333333;
font-size: 15px;
line-height: 16px;
display: block;
letter-spacing: .1em;
}
#ft .main:hover {
color: #769f23;
}
#ft .phone-outer,
#ft .phone-desk {
font-size: 25px;
line-height: 25px;
display: block;
margin: 8px 0 0px;
color: #769f23;
}
#ft .phone-outer .phone,
#ft .phone-outer .phone a,
#ft .phone-desk .phone,
#ft .phone-desk .phone a {
color: #769f23;
display: inline-block;
}
#ft .btns {
display: none;
} .ft-design-credit {
z-index: 20;
background: #f6f2f2;
font-size: 10px;
line-height: 27px;
text-align: center;
padding: 25px 0;
}
.ft-design-credit .sesame {
color: #333333;
letter-spacing: .1em;
}
.ft-design-credit .sesame .div {
padding: 0 5px;
display: none;
}
.ft-design-credit .sesame a {
color: #333333;
display: block;
}
.ft-design-credit .sesame a img {
margin: -2px 6px 0 0;
}
.ft-design-credit .sesame a:hover {
color: #556d24;
}
.ft-design-credit .back-to-top {
display: inline-block;
position: relative;
font-size: 28px;
line-height: 28px;
color: #87cc36;
padding: 4px;
margin: 10px 0 0;
letter-spacing: 0.0em;
-webkit-transition: .4s;
-o-transition: .4s;
-moz-transition: .4s;
transition: .4s;
}
.ft-design-credit .back-to-top:hover {
-webkit-transform: scale(1.4);
-moz-transform: scale(1.4);
-ms-transform: scale(1.4);
-o-transform: scale(1.4);
transform: scale(1.4);
}
.video-center-vid{
max-width:300px;
width:300px;
height:175px;
position:relative;
float:left;
margin-right:15px;
margin-bottom:15px;
}
.video-center-vid .mask{
position:absolute;
width:100%; height:175px;
top:0;
left:0;
z-index:1;
overflow:hidden;
}
.video-center-vid .fg{
position:absolute;
width:100%;
height:100%;
top:0;
left:0;
z-index:10;
}
body.vargo-video-center .page-content #video-center{
width:255px;
margin:0 auto;
} @media only screen and (min-width: 48em) {
.container {
margin: 0 2.5%;
}
body.smile-gallery #sidebar,
body.vargo-video-center #sidebar,
body.double-cola #sidebar,
body.oraverse #sidebar,
body.somnodent-sleep-apnea-appliance #sidebar,
body.tap-appliance #sidebar,
body.juvederm-xc #sidebar,
body.clarity-sl #sidebar,
body.palatal-expander #sidebar,
body.retainer-instructions #sidebar,
body.acceledent-aura #sidebar,
body.common-procedures #sidebar,
body.solea-dental-laser #sidebar,
body.home #sidebar,
body.sitemap #sidebar,
body.double-cola #sidebar,
body.meet-the-staff #sidebar,
body.meet-our-staff #sidebar,
body.our-staff #sidebar,
body.our-team #sidebar,
body.the-staff #sidebar,
body.the-team #sidebar,
body.meet-the-team #sidebar,
body.community-outreach #sidebar,
body.types-of-braces #sidebar,
body.types-of-appliances #sidebar,
body.common-orthodontic-issues #sidebar,
body.common-procedures #sidebar,
body.office-tour #sidebar,
body.before-and-after #sidebar,
body.invisalign #sidebar,
body.i-cat #sidebar,
body.itero-element #sidebar,
body.in-ovation #sidebar,
body[class^='suresmile-'] #sidebar,
body[class^='damon-'] #sidebar,
body[class^='invisalign-'] #sidebar,
body[class^='in-ovation-'] #sidebar,
body.which-is-right-for-me #sidebar,
body.your-child-s-first-orthodontic-checkup #sidebar,
body.aao-testimonials #sidebar,
body.ortho-tv #sidebar,
body.what-s-the-real-cost #sidebar,
body.braces-aren-t-braces #sidebar,
body.my-life-my-smile-my-orthodontist #sidebar {
display: none;
}
body.smile-gallery .content-text,
body.smile-gallery header,	
body.vargo-video-center .content-text,
body.vargo-video-center header,	
body.double-cola .content-text,
body.double-cola header,
body.oraverse .content-text,
body.oraverse header,
body.somnodent-sleep-apnea-appliance .content-text,
body.somnodent-sleep-apnea-appliance header,
body.tap-appliance .content-text,
body.tap-appliance header,
body.juvederm-xc .content-text,
body.juvederm-xc header,
body.clarity-sl .content-text,
body.clarity-sl header,
body.palatal-expander .content-text,
body.palatal-expander header,
body.retainer-instructions .content-text,
body.retainer-instructions header,
body.acceledent-aura .content-text,
body.acceledent-aura header,
body.common-procedures .content-text,
body.common-procedures header,
body.solea-dental-laser .content-text,
body.solea-dental-laser header,
body.home .content-text,
body.home header,
body.sitemap .content-text,
body.sitemap header,
body.double-cola .content-text,
body.double-cola header,
body.meet-the-staff .content-text,
body.meet-the-staff header,
body.meet-our-staff .content-text,
body.meet-our-staff header,
body.our-staff .content-text,
body.our-staff header,
body.our-team .content-text,
body.our-team header,
body.the-staff .content-text,
body.the-staff header,
body.the-team .content-text,
body.the-team header,
body.meet-the-team .content-text,
body.meet-the-team header,
body.community-outreach .content-text,
body.community-outreach header,
body.types-of-braces .content-text,
body.types-of-braces header,
body.types-of-appliances .content-text,
body.types-of-appliances header,
body.common-orthodontic-issues .content-text,
body.common-orthodontic-issues header,
body.common-procedures .content-text,
body.common-procedures header,
body.office-tour .content-text,
body.office-tour header,
body.before-and-after .content-text,
body.before-and-after header,
body.invisalign .content-text,
body.invisalign header,
body.i-cat .content-text,
body.i-cat header,
body.itero-element .content-text,
body.itero-element header,
body.in-ovation .content-text,
body.in-ovation header,
body[class^='suresmile-'] .content-text,
body[class^='suresmile-'] header,
body[class^='damon-'] .content-text,
body[class^='damon-'] header,
body[class^='invisalign-'] .content-text,
body[class^='invisalign-'] header,
body[class^='in-ovation-'] .content-text,
body[class^='in-ovation-'] header,
body.which-is-right-for-me .content-text,
body.which-is-right-for-me header,
body.your-child-s-first-orthodontic-checkup .content-text,
body.your-child-s-first-orthodontic-checkup header,
body.aao-testimonials .content-text,
body.aao-testimonials header,
body.ortho-tv .content-text,
body.ortho-tv header,
body.what-s-the-real-cost .content-text,
body.what-s-the-real-cost header,
body.braces-aren-t-braces .content-text,
body.braces-aren-t-braces header,
body.my-life-my-smile-my-orthodontist .content-text,
body.my-life-my-smile-my-orthodontist header {
width: 100%;
}
body.meet-dr-joseph-vargo #sidebar .caption,
body.birthday-club #sidebar .caption,
body.what-sets-us-apart  #sidebar .caption {
display: none;
}
.main-content-section .staff-photo {
float: right;
margin: 0 0 25px 25px;
} body {
font-size: 19px;
line-height: 36px;
} #hd {
padding: 0;
}
#hd .container {
padding: 0 2.5%;
}
#hd .logo {
display: inline-block;
padding: 20px 0 20px;
width: auto;
}
#hd .top {
position: absolute;
top: 0;
right: 0;
vertical-align: top;
padding-right: 45px;
}
#hd .info,
#hd .social-icons,
#hd .callouts {
margin: 0;
clear: none;
display: inline-block;
vertical-align: top;
}
#hd .info .address {
margin: 0;
padding: 0;
display: inline-block;
}
#hd .info .address .phone-outer {
display: inline-block;
margin: 0;
vertical-align: top;
}
#hd #main-nav {
margin: 0;
width: 300px;
} .home-slideshow-section {
aspect-ratio: 32 / 27;
}
.home-slideshow-section video {
display: block;
margin: 0 -25%;
width: 150%;
}
.home-slideshow-section .caption {
display: inline-block;
position: absolute;
top: 50%;
-webkit-transform: translateX(-50%) translateY(-50%);
-moz-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
-o-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
left: 50%;
width: 50%;
font-size: 37px;
padding: 0;
width: 100%;
line-height: 50px;
} .callout-section1 h2 {
font-size: 60px;
line-height: 60px;
}
.callout-section1 .callout {
padding: 15px;
margin: 0 !important;
width: 50% !important;
max-width: 100%;
}
.callout-section1 .callout a {
margin: 0 auto;
}
.callout-section1 .callout a .icon {
display: inline-block;
padding: 20px 25px;
}
.callout-section1 .callout a .main {
position: absolute;
top: 0;
height: 100%;
width: 100%;
right: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.callout-section1 .callout a h4 {
position: absolute;
top: 50%;
left: 0;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
padding-left: 130px;
}
h1 {
font-size: 45px;
line-height: 45px;
}
.home h1 {
text-align: left;
} .main-content-section {
padding: 50px 0 30px; }
.main-content-section h2 {
font-size: 35px;
line-height: 35px;
}
.main-content-section h3 {
font-size: 30px;
line-height: 30px;
}
.main-content-section h4 {
font-size: 30px;
line-height: 30px;
}
.main-content-section h5 {
font-size: 26px;
line-height: 26px;
}
.main-content-section #sidebar {
width: 34%;
display: inline-block;
text-align: right;
margin: 7px 0 35px 35px;
padding: 0;
float: right;
}
.main-content-section .content-text,
.main-content-section header {
width: 61%;
float: left;
}
.home .main-content-section .content-text, .home
.main-content-section header {
width: 100%;
float: none;
}
.main-content-section .content-text {
text-align: justify;
} .section1 {
padding: 0;
}
.section1 .container {
height: 550px;
}
.section1 .side1,
.section1 .side2 {
width: 50%;
display: block;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
float: left;
height: 100%;
position: relative;
}
.section1 .side1 .inner,
.section1 .side2 .inner {
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
width: 100%;
left: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0 20px;
} .testimonials-section {
padding: 140px 0 100px;
background: url(https://vargosmile.com/wp-content/themes/vargoorthodontics/images/section4.jpg) center top #eaf3f2;
}
.testimonials-section h2 {
font-size: 45px;
line-height: 45px;
}
.section2 {
text-align: left;
padding: 60px 0;
background: url(https://vargosmile.com/wp-content/themes/vargoorthodontics/images/section5.jpg.png) left center #fff;
}
.section2 .container {
max-width: 600px;
margin: 0 auto;
} #ft {
padding: 0;
background: url(https://vargosmile.com/wp-content/themes/vargoorthodontics/images/ft-map.jpg) center 0 repeat-x #fff;
}
#ft .container {
height: 461px;
margin: 0;
padding: 0;
}
#ft .markers {
display: block;
}
#ft .markers .marker {
position: absolute;
left: 50%;
top: 238px;
margin-left: 201px;
display: inline-block;
padding: 2px;
-webkit-transition: .4s;
-o-transition: .4s;
-moz-transition: .4s;
transition: .4s;
width: 69px;
-webkit-transform-origin: center 83%;
-moz-transform-origin: center 83%;
-ms-transform-origin: center 83%;
-o-transform-origin: center 83%;
transform-origin: center 83%;
}
#ft .markers .marker:hover {
-webkit-transform: scale(1.2);
-moz-transform: scale(1.2);
-ms-transform: scale(1.2);
-o-transform: scale(1.2);
transform: scale(1.2);
}
#ft .title {
margin-bottom: 20px;
padding-bottom: 20px;
position: relative;
}
#ft .title:after {
content: "";
position: absolute;
bottom: 0;
left: 50%;
width: 48px;
height: 3px;
background: #779f23;
z-index: -1;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
}
#ft .locations {
width: 500px;
height: 100%;
position: absolute;
padding: 0;
margin: 0;
background: url(https://vargosmile.com/wp-content/themes/vargoorthodontics/images/ft-location.jpg) center center #535353;
top: 0;
left: 0px;
}
#ft .locations .location {
position: absolute;
width: 100%;
top: 25%;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
padding: 0 20px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
#ft .btns {
display: block;
bottom: 14%;
left: 50%;
position: absolute;
padding: 0 20px;
text-align: center;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
}
#ft .btns a {
display: block;
background: #77a023;
color: #fff;
padding: 8px 20px;
width: 100%;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
margin: 1.5px;
float: left;
}
#ft .btns a:hover {
background: #699118;
}
#ft .btns .social-icons {
clear: both;
}
#ft .btns .social-icons a {
font-size: 14px;
line-height: 14px;
width: 100px;
padding: 20px 0;
display: block;
}
#ft .btns .social-icons a i {
display: block;
font-size: 41px;
line-height: 41px;
margin-top: 10px;
} .ft-design-credit {
padding: 28px 0 23px;
border-top: 35px solid #fff;
}
.ft-design-credit .sesame .div {
display: inline-block;
}
.ft-design-credit .sesame a {
display: inline-block;
}
.ft-design-credit .back-to-top {
margin: 0;
}
}  @media only screen and (min-width: 64em) {
.container {
padding: 0;
margin: 0 auto;
}
body {
font-size: 20px;
line-height: 38px;
} #hd {
position: fixed;
background: #fff;
top: 0;
left: 0;
width: 100%;
height: 114px;
z-index: 900; }
#hd .container {
max-width: 100%;
}
#hd .logo {
width: 450px;
padding: 17px 0;
position: relative;
z-index: 900;
}
#hd .extra {
width: 290px;
text-align: center;
margin: 30px auto 18px;
}
#hd .extra .phone-outer,
#hd .extra .rewards {
width: 136px;
padding: 5px 0;
}
#hd .address {
line-height: 1.5;
}
#hd .get-started {
position: absolute;
top: 0;
left: 0;
color: #363434;
font-size: 19px;
line-height: 20px;
padding: 27px 25px;
cursor: pointer;
-webkit-transition: .5s;
-o-transition: .5s;
-moz-transition: .5s;
transition: .5s;
letter-spacing: .03em;
z-index: 90;
}
#hd .get-started i {
color: #79a51f;
font-size: 20px;
position: relative;
top: -2px;
margin-left: 6px;
-webkit-transition: .5s;
-o-transition: .5s;
-moz-transition: .5s;
transition: .5s;
}
#hd .get-started:hover {
color: #79a51f;
}
#hd .get-started.open {
color: #79a51f;
}
#hd .get-started.open i {
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg);
}
#hd .top-callouts {
position: absolute;
top: 114px;
left: -5%;
width: 110%;
background: url(https://vargosmile.com/wp-content/themes/vargoorthodontics/images/texture.jpg) center center #e3e0e0;
display: none;
opacity: 0;
-webkit-transition: opacity .5s;
-o-transition: opacity .5s;
-moz-transition: opacity .5s;
transition: opacity .5s;
padding: 35px 0;
z-index: 100;
}
#hd .top-callouts .callout {
width: 22%;
max-width: 310px;
display: inline-block;
padding: 0 0;
}
#hd .top-callouts .callout a {
position: relative;
display: inline-block;
text-transform: uppercase;
color: #fff;
background: #090909;
}
#hd .top-callouts .callout a .main {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
padding: 10px 0;
font-size: 20px;
}
#hd .top-callouts .callout a .bg {
-webkit-transition: .9s;
-o-transition: .9s;
-moz-transition: .9s;
transition: .9s;
opacity: .85;
}
#hd .top-callouts .callout a:hover .bg {
opacity: .6;
}
#hd .top-callouts.open {
opacity: 1;
}
#hd:after {
content: "";
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 0;
background: rgba(255, 255, 255, 0.6);
z-index: 0;
opacity: 0;
-webkit-transition: opacity 1.2s;
-o-transition: opacity 1.2s;
-moz-transition: opacity 1.2s;
transition: opacity 1.2s;
}
.open-get-started #hd:after {
opacity: 1;
height: 100%;
}
#hd .social-icons {
text-align: center;
clear: both;
text-align: center;
display: inline-block;
}
#hd .social-icons a {
color: #fff;
background: #72952b;
font-size: 15px;
height: 35px;
width: 35px;
line-height: 33px;
display: inline-block;
margin: 2px 0;
z-index: 10;
padding: 0;
}
#hd .social-icons a.hg i {
font-weight: 400;
}
#hd .social-icons a:hover {
background: #668526;
z-index: 20;
}
#hd #main-nav {
margin: 0;
position: absolute;
top: 114px;
right: 0;
width: 360px;
background: #666;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
text-align: left;
}
#hd #main-nav .trigger {
position: absolute;
top: -114px;
right: 0;
padding: 0;
margin: 23px 25px 0;
}
#hd #main-nav .nav-icon {
width: 34px;
height: 24px;
}
#hd #main-nav .nav-icon span {
height: 3px;
}
#hd #main-nav .collapsible.open,
#hd #main-nav .collapsible {
height: auto;
background: none;
padding: 0 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
#hd #main-nav .collapsible.open ul,
#hd #main-nav .collapsible ul {
height: 0;
}
#hd #main-nav .collapsible.open ul li,
#hd #main-nav .collapsible ul li {
display: block;
width: 100%;
float: none;
margin: 0;
padding: 0 40px;
}
#hd #main-nav .collapsible.open ul li a,
#hd #main-nav .collapsible ul li a {
letter-spacing: .05em;
font-size: 16px;
line-height: 35px;
-webkit-transform-origin: 0 center ;
-moz-transform-origin: 0 center ;
-ms-transform-origin: 0 center ;
-o-transform-origin: 0 center ;
transform-origin: 0 center ;
}
#hd #main-nav .collapsible.open ul li a:hover,
#hd #main-nav .collapsible ul li a:hover {
background: none;
color: #8caf45;
-webkit-transform: scale(1.8);
-moz-transform: scale(1.8);
-ms-transform: scale(1.8);
-o-transform: scale(1.8);
transform: scale(1.8);
}
#hd #main-nav .collapsible.open ul ul,
#hd #main-nav .collapsible.open ul .open ul,
#hd #main-nav .collapsible ul ul,
#hd #main-nav .collapsible ul .open ul {
text-align: left;
background: rgba(97, 96, 96, 0.9);
padding: 20px 25px;
margin: 0 0 0 0px;
width: auto;
width: 210px;
display: none;
position: absolute;
left: -211px;
top: -10px;
}
#hd #main-nav .collapsible.open ul ul li,
#hd #main-nav .collapsible.open ul .open ul li,
#hd #main-nav .collapsible ul ul li,
#hd #main-nav .collapsible ul .open ul li {
padding: 0;
margin: 0px 0;
height: auto;
-webkit-animation: none;
-moz-animation: none;
-o-animation: none;
animation: none;
opacity: 1;
}
#hd #main-nav .collapsible.open ul ul li a,
#hd #main-nav .collapsible.open ul ul li.active a,
#hd #main-nav .collapsible.open ul .open ul li a,
#hd #main-nav .collapsible.open ul .open ul li.active a,
#hd #main-nav .collapsible ul ul li a,
#hd #main-nav .collapsible ul ul li.active a,
#hd #main-nav .collapsible ul .open ul li a,
#hd #main-nav .collapsible ul .open ul li.active a {
font-weight: 400;
letter-spacing: .05em;
font-size: 14px;
line-height: 25px;
color: #fff !important;
padding: 0 0;
height: auto;
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
background: none;
margin: 0;
border: none !important;
white-space: nowrap;
display: inline-block;
position: relative;
-webkit-transition: .4s;
-o-transition: .4s;
-moz-transition: .4s;
transition: .4s;
}
#hd #main-nav .collapsible.open ul ul li a:hover,
#hd #main-nav .collapsible.open ul ul li.active a,
#hd #main-nav .collapsible.open ul .open ul li a:hover,
#hd #main-nav .collapsible.open ul .open ul li.active a,
#hd #main-nav .collapsible ul ul li a:hover,
#hd #main-nav .collapsible ul ul li.active a,
#hd #main-nav .collapsible ul .open ul li a:hover,
#hd #main-nav .collapsible ul .open ul li.active a, body #hd #main-nav .collapsible ul li.current-menu-item a {
color: #8caf45 !important;
-webkit-transform: scale(1.5);
-moz-transform: scale(1.5);
-ms-transform: scale(1.5);
-o-transform: scale(1.5);
transform: scale(1.5);
}
#hd #main-nav .collapsible.open ul li:hover ul,
#hd #main-nav .collapsible ul li:hover ul {
display: block;
}
#hd #main-nav .collapsible.open {
background: rgba(97, 96, 96, 0.9);
padding: 20px 0;
}
#hd #main-nav .collapsible.open ul {
position: relative;
height: auto;
padding: 0;
}
#hd #main-nav .collapsible.open ul li:after {
position: absolute;
top: 0;
left: -3rem;
width: 3rem;
height: 100%;
content: '';
} .home-slideshow-section {
margin-top: 114px;
}
.home-slideshow-section .caption {
top: 50%;
width: 100%;
padding: 0;
}
.home-slideshow-section .caption h3 {
font-size: 80px;
line-height: 80px;
font-weight: normal;
}
.home-slideshow-section .caption .btn {
margin-top: 46px;
} .subnav-section {
margin-top: 0;
padding: 28px 0;
}
.subnav-section .container {
max-width: 520px;
} .banner-section {
height: 506px;
margin-top: 114px;
position:relative;
}
.actula-title{
position: absolute;
bottom: 5%;
color: #fff;
font-family: 'Oswald', Helvetica, Arial, sans-serif;
font-size: 20px;
font-weight: bold;
right: 5%;
line-height:50px;
}
.banner-section img {
width: 2000px;
max-width: none;
left: 50%;
margin-left: -1000px;
}
body.meet-the-team  .banner-section img {
margin-left: auto;
}
h1 {
line-height: 45px;
font-size: 45px;
padding-bottom: 40px;
margin-bottom: 30px;
}
h1:after {
content: "";
position: absolute;
bottom: 30px;
left: 0;
width: 84px;
height: 6px;
background: #c7c6c7;
z-index: -1;
}
.home h1 {
margin-bottom: 26px;
padding-bottom: 0;
}
.home h1:after {
display: none;
} .main-content-section {
padding: 95px 0 60px;
}
.home .main-content-section {
padding: 100px 0 93px;
background: url(https://vargosmile.com/wp-content/themes/vargoorthodontics/images/section1.jpg) center center #fff repeat-x;
}
.home .main-content-section .container {
width: 630px;
padding-left: 320px;
}
.main-content-section #sidebar {
margin: 8px 0 0;
width: 36%;
} .section1 .container {
max-width: 100%;
height: 718px;
}
.section1 h2 {
margin: 0 0 25px;
}
.section1 .side1 .inner,
.section1 .side2 .inner {
padding: 0 10%;
}
.section1 .icon {
margin: 0 0 43px;
}
.section1 .icon img {
height: auto;
}
.section1 .btn {
margin-top: 53px;
} .callout-section1 {
padding: 102px 0;
}
.callout-section1 .container {
max-width: 1070px;
}
.callout-section1 h2 {
margin-bottom: 60px;
}
.callout-section1 .callout {
padding: 40px 15px;
}
.callout-section1 .callout a {
max-width: 463px;
}
.callout-section1 .callout a .main {
padding: 40px 0;
padding-left: 130px;
}
.callout-section1 .callout a h4 {
position: relative;
top: 0;
left: 0;
padding: 0;
margin: 0;
}
.callout-section1 .callout a p {
display: block;
font-size: 15px;
line-height: 18px;
} .vargo-video-center .container{
max-width: 90%;
width:90%;
}
.vargo-video-center .content-text #video-center {
text-align: center;
}
.vargo-video-center .video-center-vid {
display: inline-block;
float: none;
} .testimonials-section {
padding: 176px 0 80px;
}
.testimonials-section .container {
max-width: 800px;
}
.testimonials-section h2 {
margin: 10px 0 27px;
}
.testimonials-section p {
font-size: 25px;
text-align: left;
line-height: 45px;
}
.testimonials-section p .caps {
font-size: 20px;
}
.testimonials-section .social-icons {
display: block;
width: 100%;
position: absolute;
bottom: 90px;
left: 0;
}
.testimonials-section .social-icons a {
color: #fff;
font-size: 30px;
line-height: 30px;
display: inline-block;
-webkit-transition: .42s;
-o-transition: .42s;
-moz-transition: .42s;
transition: .42s;
}
.testimonials-section .social-icons a i {
font-size: 75px;
line-height: 75px;
display: block;
margin-bottom: 10px;
}
.testimonials-section .social-icons a:hover {
-webkit-transform: scale(1.18);
-moz-transform: scale(1.18);
-ms-transform: scale(1.18);
-o-transform: scale(1.18);
transform: scale(1.18);
}
.testimonials-section .social-icons .social1 {
position: absolute;
top: 0;
left: 0;
}
.testimonials-section .social-icons .social15 {
position: absolute;
top: 0;
right: 15%;
}
.testimonials-section .social-icons .social2 {
position: absolute;
top: 0;
right: 0;
}
.testimonials-section .testimonials-pager {
text-align: center;
margin-top: 47px;
}
.testimonials-section .testimonials-pager a {
margin: 3px;
display: inline-block;
width: .72em;
height: .72em;
-webkit-border-radius: 999em;
-moz-border-radius: 999em;
border-radius: 999em;
border: 1px solid #fff;
}
.testimonials-section .testimonials-pager a.cycle-pager-active, .testimonials-section .testimonials-pager a:hover {
background: #60880e;
}
.section2 {
background-position: center center;
padding: 85px 0;
}
.section2 .container {
margin: 0 auto;
padding: 0;
max-width: 1000px;
}
.section2 .main {
width: 40%;
float: left;
padding: 0 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.section2 h2 {
margin-bottom: 30px;
font-size: 45px;
line-height: 45px;
}
.section2 p {
font-size: 20px;
line-height: 38px;
}
.section2 .video {
width: 50%;
display: block;
position: absolute;
top: 55%;
right: 20px;
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
transform: translateY(-50%);
}
.section2 .video ul {
margin: 0;
padding: 0;
}
.section2 .video iframe {
width: 520px;
height: 291px;
}
.section2 .video .video-pager {
text-align: center;
margin-top: 15px;
}
.section2 .video .video-pager a {
margin: 4px;
display: inline-block;
width: .72em;
height: .72em;
-webkit-border-radius: 999em;
-moz-border-radius: 999em;
border-radius: 999em;
border: 1px solid #60880e;
}
.section2 .video .video-pager a.cycle-pager-active, .section2 .video .video-pager a:hover {
background: #60880e;
} #ft .container {
margin: 0 auto;
max-width: 1000px;
}
#ft .locations {
width: 500px;
padding-left: 2000px;
left: auto;
right: 46%;
}
#ft .locations .location {
width: 500px;
right: 0;
top: 29%;
}
#ft .locations .btns {
left: auto;
width: 555px;
right: 0;
-webkit-transform: none;
-moz-transform: none;
-ms-transform: none;
-o-transform: none;
transform: none;
text-align: center;
} } @media only screen and (min-width: 75em) {
.home-slideshow-section {
aspect-ratio: 16 / 9;
}
.home-slideshow-section video {
display: block;
margin: 0;
width: 100%;
}
}
.back-to-top .fa-caret-up {
background-color: #77a023;
padding: 0px 5px;
color: #fff;
border-radius: 3px;
line-height: 25px;
}
.page-template .container {
width: 100% !important;
}
.content-text.content-home-rk p {
font-size: 20px;
padding-bottom: 20px;
}
.main-content-section .content-text p{
font-size: 20px;
}
.subnav-section li {
list-style: none;
float: left;
line-height: 10px !important;
border-right: 2px solid #fff;
margin-bottom: 5px;
}
.subnav-section li a {
font-size: 14px;
line-height: 19px;
letter-spacing: 0.0em;
color: #fff;
text-decoration: none;
display: inline-block;
color: #363434;	
padding: 0px 10px;
line-height: 14px;
-webkit-transition-duration: 0.31s;
-moz-transition-duration: 0.31s;
-o-transition-duration: 0.31s;
transition-duration: 0.31s;
text-decoration: none;
}
.subnav-section ul{
margin: 0px;
}
.subnav-section .current-menu-item a,  .subnav-section .current-menu-item a:hover{
color: #79a51f;
-webkit-transform: scale(1.10);
-moz-transform: scale(1.10);
-ms-transform: scale(1.10);
-o-transform: scale(1.10);
transform: scale(1.10);
}
.subnav-section li:last-child a {	
border-right: 0px !important;
}
.main-content-section .actual_full{
display: none;
}
.main-content-section .content-text.content-text-full{
width: 100%;
}
.img-text.left{
max-width: 250px;
width: 100%;
}
.img-text.right {
float: right;
width: 100%;
max-width: 420px;
}
.main-content-section .content-text ul li{
font-size: 20px;
}
form label.required {
font-weight: normal !important;
}
.wpcf7-form-control.wpcf7-submit.submit-request {
background: transparent;
border: 0px;
color: #fff;	
text-transform: uppercase;
}
.rateyour .wpcf7-list-item {	
display: block;	
margin-left: 8px;
}
.wpcf7-form-control.wpcf7-submit {
background: transparent;
border: 0px;
text-transform: unset;
color: #fff;
}
.subnav-section li a:hover {
color: #79a51f;
-webkit-transform: scale(1.15);
-moz-transform: scale(1.15);
-ms-transform: scale(1.15);
-o-transform: scale(1.15);
transform: scale(1.15);
}
.metaslider.outreach-edit .flexslider .flex-direction-nav li a {
width: 32px;
height: 43px;
background-image: url(https://vargosmile.com/wp-content/themes/vargoorthodontics/images/next-prev.png);	
opacity: 1;	
}
.metaslider.outreach-edit .flexslider:hover .flex-next {
opacity: 1;
right: -50px;
}
.alignright.alignright-edit {
text-align: right;
float: right;
margin-left: 30px;
}
.metaslider.outreach-edit .flexslider:hover .flex-prev {
opacity: 1;
left: -50px;
}
.metaslider.outreach-edit .caption-wrap {
position: relative;
bottom: -5px;
left: 0;
background: transparent;
color:#000;
opacity: 1;
}
.meet-the-team .font2 {  
font-size: 20px;
}
.meet-the-team hr{
margin-bottom: 40px;
margin-top: 30px
}
.testimonial-rk {
margin-top: 30px;
}
.testimonial-box{
margin-bottom: 70px;
}
.testimonial-box p {
margin-bottom: 16px !important;
}
#close-btn { 
background: url(https://vargosmile.com/wp-content/themes/vargoorthodontics/images/close-btn.png) no-repeat top left !important;
}
#video-cont { 
margin-top: 0% !important;  
}
.page-id-41 .caption.alignright {
display: none;
}
.page-id-84 .section-container.subnav-section.caps.font1, .page-id-111 .section-container.subnav-section.caps.font1, .page-id-141 .section-container.subnav-section.caps.font1 {
margin-top: 114px;
}
.page-id-84 .banner-section, .page-id-111 .banner-section, .page-id-141 .banner-section {
display: none;
}
.home h1 {
text-align: left;
font-size: 45px;
}
@media (min-width: 768px) and (max-width: 1024px) {
body .main-content-section #sidebar {
width: 32%;
}
}
@media screen and (max-width:1024px){
#ft .container .locations {  
right: 46% !important;
}
body.page-id-82 .flex-direction-nav .flex-prev,body.page-id-82 .metaslider.outreach-edit .flexslider:hover .flex-prev {
left: 0px !important;
}
body.page-id-82 .flex-direction-nav .flex-next, body.page-id-82 .metaslider.outreach-edit .flexslider:hover .flex-next, body.page-id-82 .metaslider .flexslider:focus-within .flex-next{
right: 0px !important;
}
.team_list_1, .team_list_5, .team_list_3, .team_list_7 {
max-width: 300px;
}
}
@media screen and (max-width:992px){
.video-faq iframe {
width: 100% !important;
}
#ft .btns {
display: block;
bottom: 14%;
left: 50%;
position: absolute;
padding: 0 16px;
text-align: center;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
-o-transform: translateX(-50%);
transform: translateX(-50%);
top: 40%;
width: 100%;
}
#ft .btns .social-icons a {
font-size: 14px;
line-height: 14px;
width: 90px;
padding: 10px 0;
display: block;
}
#ft .btns .social-icons a i {
display: block;
font-size: 30px;
line-height: 41px;
margin-top: 10px;
}
.main-content-section {
padding: 50px 20px 30px;
}
.testimonials-section {
padding: 100px 20px 100px;  
}
.subnav-section {  
padding: 25px 20px;
}
body.page-id-82 .flex-direction-nav .flex-prev,body.page-id-82 .metaslider.outreach-edit .flexslider:hover .flex-prev {
left: 0px !important;
}
body.page-id-82 .flex-direction-nav .flex-next, body.page-id-82 .metaslider.outreach-edit .flexslider:hover .flex-next, body.page-id-82 .metaslider .flexslider:focus-within .flex-next{
right: 0px !important;
}
}
@media screen and (max-width:767px){
.callout-section1 {  
padding: 35px 20px;
}
.section-container.section2 .w300 {
padding: 0px 15px;
}
#ft .btns {
display: none;
}
body.page-id-82 .flex-direction-nav .flex-prev,body.page-id-82 .metaslider.outreach-edit .flexslider:hover .flex-prev {
left: 0px !important;
}
body.page-id-82 .flex-direction-nav .flex-next, body.page-id-82 .metaslider.outreach-edit .flexslider:hover .flex-next, body.page-id-82 .metaslider .flexslider:focus-within .flex-next{
right: 0px !important;
}
.team_list_1, .team_list_5, .team_list_3, .team_list_7 {
float: none;
margin: 10px auto;
clear: right;
display: block;
}
}
.callout-section1 .callout.callout1:nth-child(2n-1) a .icon{
background: #616060 !important ;
}
.page-id-815 .caption.alignright {
display: none;
} .mystery-reads-container {
display: flex; 
flex-wrap: wrap; 
justify-content: space-evenly;
width: 100%;
}
.mystery-read-container {
width: 200px; 
height: 200px; 
border: 3px solid #79a51f; 
margin: 50px
}
.mystery-read-link {
text-align: center; 
width: 100%; 
height: 100%;
display: flex; 
align-items: center;
} .sg-show-popup.sgpb-popup-id-872 {
right: 0;
position: absolute;
top: 95px;
}
ul.no-bullet-list li {
list-style: none;
}
.page-id-1038 .rows {
display:flex;
justify-content:space-between;
}
.page-id-1038 .rows label {
margin-top:0;
}
.page-id-1038 .control-form3,
.page-id-1038 input.wpcf7-form-control.wpcf7-text.wpcf7-validates-as-required.control-form {
width: 100% !important;
}
.page-id-1038 input.wpcf7-form-control.has-spinner.wpcf7-submit.control-submit {
background: #77a023;
font-size: 16px;
padding: 16px 0;
border-radius: 25px;
width: 14%;
}
.page-id-1038 form br {
display:none;
}
.page-id-1038 span.wpcf7-form-control-wrap {
margin-top: 6px;
}
textarea.wpcf7-form-control.wpcf7-textarea.control-form3 {
height: 40px;
}
select.wpcf7-form-control.wpcf7-select.wpcf7-validates-as-required.control-form2 {
width: 50%;
}
label.upload-files {
position: relative;
}
span.max50 {
position: absolute;
left: 60%;
top: 50%;
}
@media only screen and (max-width:1024px) {
.page-id-1038 .rows {
display:block;
}
.actula-title{
position: absolute;
bottom: 5%;
color: #fff;
font-family: 'Oswald', Helvetica, Arial, sans-serif;
font-size: 20px;
font-weight: bold;
right: 5%;
line-height:50px;
}
.banner-section{
position:relative;
}
}
@media (max-width:767px) {
.actula-title {
position: relative;
bottom: 0;
color: #000;
font-family: 'Oswald', Helvetica, Arial, sans-serif;
font-size: 20px;
text-align: center;
right: 0;
line-height: 50px;letter-spacing: 2px;        text-shadow: inherit;
}
}
@media only screen and (max-width:599px) {
.page-id-1038 input.wpcf7-form-control.has-spinner.wpcf7-submit.control-submit {
font-size: 20px;
width: 44%;
}
select.wpcf7-form-control.wpcf7-select.wpcf7-validates-as-required.control-form2 {
width: 100%;
}
section.join-form {
padding-top: 0;
}
span.max50 {
position: relative;
left: 0;
top: 0;
}	
}
.join-form form label {
margin: 25px 0 0 0;
min-height: 0;
}
section.join-form {
padding-top: 0;
}
.page-id-60 .metaslider.outreach-edit .flexslider .flex-prev {
opacity: 1;
left: -50px !important;
}
.page-id-60 .metaslider.outreach-edit .flexslider .flex-next { right: -50px !important;
}
@media screen and (max-width: 992px) {
.page-id-60 .metaslider.outreach-edit .flexslider .flex-prev {
opacity: 1;
left: 0px !important;
}
.page-id-60 .metaslider.outreach-edit .flexslider .flex-next { right: 0px !important;
}
}
#hd .phone-outer .call-us{
z-index:9999;
}
._2ph- {
padding: 4px !important;
}
.call-us {
border-radius: 8px;
}