@font-face {
font-family: BronxShoesRegular;
src: url(//www.ripitenergy.com/wp-content/themes/RipIt/fonts/BronxShoesRegular.eot) format("embedded-opentype"), url(//www.ripitenergy.com/wp-content/themes/RipIt/fonts/BronxShoesRegular.ttf) format("truetype")
}
body {
font-weight: 500;
margin: 0;
padding: 0
}
body.page,
body.single {
font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
line-height: 1
}
a:focus,
button:focus {
outline: 0
}
img {
height: auto;
max-width: 100%
}
h1,
h2,
h3 {
font-family: BronxShoesRegular;
font-weight: 500
}
* {
box-sizing: border-box
}
a {
color: red
}
.gform_wrapper {
margin: 0 !important
}
.gform_wrapper .gform_body .top_label .gfield_label {
display: none
}
.gform_wrapper .gform_body .ginput_container input {
padding: 10px 4px !important
}
.gform_wrapper .gform_body .ginput_container input,
.gform_wrapper .gform_body .ginput_container select,
.gform_wrapper .gform_body .ginput_container textarea {
border: 3px solid red;
border-radius: 5px
}
.gform_wrapper .gform_body .ginput_container select {
color: #757575;
height: 40px
}
.gform_wrapper .gform_footer {
display: flex;
justify-content: flex-end;
padding-bottom: 0 !important;
padding-right: 15px !important
}
header.global-header {
position: fixed;
top: 0;
transition: all .2s linear;
width: 100%;
z-index: 20
}
header.global-header .top-nav {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
padding: 15px 40px
}
header.global-header .top-nav .header-icon-wrap {
display: flex;
padding-top: 10px
}
header.global-header .top-nav .buttonWrap {
display: inline-block;
padding-right: 10px;
padding-top: 3px;
width: 100%
}
header.global-header .main-nav-wrap {
display: none;
padding-left: 40px;
position: relative
}
header.global-header .main-nav-wrap ul.main-menu {
list-style: none;
margin: 0;
padding: 0
}
header.global-header .main-nav-wrap ul.main-menu li {
margin-bottom: 5px
}
header.global-header .main-nav-wrap ul.main-menu li a {
color: red;
display: block;
font-size: 27px;
font-weight: 900;
line-height: 1.1;
text-decoration: none;
text-transform: uppercase
}
header.global-header .main-nav-wrap .socialWrap .socialNav ul {
display: flex;
list-style: none;
padding: 0
}
header.global-header .main-nav-wrap .socialWrap .socialNav ul li {
margin: 0 3px
}
header.global-header .main-nav-wrap .socialWrap .socialNav ul li a {
align-items: center;
background-color: #231f20;
border-radius: 50%;
color: #fff;
display: flex;
font-size: 25px;
height: 45px;
justify-content: center;
line-height: 20px;
text-align: center;
text-decoration: none;
transition: all .2s linear;
width: 45px
}
header.global-header .main-nav-wrap .socialWrap .socialNav ul li a:hover {
background-color: red;
transition: all .2s linear
}
header.global-header .main-nav-wrap .mobileMenuBtnWrap {
display: none;
padding-top: 10px
}
.menuOverlay {
background-color: rgba(83, 174, 185, .7);
display: none;
height: 100vh;
position: fixed;
top: 0;
width: 100vw;
z-index: 10
}
header.global-header.past-banner {
transition: all .2s linear
}
.page-template-template-findRipIt header.global-header,
.page-template-template-flavors header.global-header,
header.global-header.past-banner {
background-color: hsla(0, 0%, 100%, .7)
}
.header-icon-wrap .hamburger-box,
.header-icon-wrap .hamburger-box .hamburger-inner,
.header-icon-wrap .hamburger-box .hamburger-inner:after,
.header-icon-wrap .hamburger-box .hamburger-inner:before {
width: 60px
}
.single-post header.global-header {
background-color: hsla(0, 0%, 100%, .7)
}
.page-template-template-social header.global-header.past-banner {
background-color: hsla(0, 0%, 100%, .7);
transition: all .2s linear
}
.page-template-template-social header.global-header.past-banner .hamburger-inner,
.page-template-template-social header.global-header.past-banner .hamburger-inner:after,
.page-template-template-social header.global-header.past-banner .hamburger-inner:before {
background-color: #231f20
}
.home.page-template-default header.global-header {
background-color: inherit
}
.error404 header.global-header,
.home.page-template-default header.global-header.past-banner,
.page-template-default header.global-header {
background-color: hsla(0, 0%, 100%, .7);
transition: all .2s linear
}
.error404 header.global-header .hamburger-inner,
.error404 header.global-header .hamburger-inner:after,
.error404 header.global-header .hamburger-inner:before,
.page-template-default header.global-header .hamburger-inner,
.page-template-default header.global-header .hamburger-inner:after,
.page-template-default header.global-header .hamburger-inner:before {
background-color: #231f20
}
.page-template-template-social header.global-header .top-nav .header-icon-wrap .socialWrap .socialNav ul li a:hover {
background-color: red
}
.page-template-template-social .hamburger-inner,
.page-template-template-social header.global-header .top-nav .header-icon-wrap .socialWrap .socialNav ul li a,
.single-event .hamburger-inner,
.single-event header.global-header .top-nav .header-icon-wrap .socialWrap .socialNav ul li a {
background-color: #fff;
color: #231f20
}
.page-template-template-social .hamburger-inner:after,
.page-template-template-social .hamburger-inner:before,
.page-template-template-social header.global-header .top-nav .header-icon-wrap .socialWrap .socialNav ul li a:after,
.page-template-template-social header.global-header .top-nav .header-icon-wrap .socialWrap .socialNav ul li a:before,
.single-event .hamburger-inner:after,
.single-event .hamburger-inner:before,
.single-event header.global-header .top-nav .header-icon-wrap .socialWrap .socialNav ul li a:after,
.single-event header.global-header .top-nav .header-icon-wrap .socialWrap .socialNav ul li a:before {
background-color: #fff
}
.page-template-template-MilitarySupport .hamburger-inner,
.page-template-template-MilitarySupport header.global-header .top-nav .header-icon-wrap .socialWrap .socialNav ul li a,
.page-template-template-whatsNew .hamburger-inner,
.page-template-template-whatsNew header.global-header .top-nav .header-icon-wrap .socialWrap .socialNav ul li a,
.single-flavor .hamburger-inner,
.single-flavor header.global-header .top-nav .header-icon-wrap .socialWrap .socialNav ul li a {
background-color: #fff;
color: #231f20
}
.page-template-template-MilitarySupport .hamburger-inner:after,
.page-template-template-MilitarySupport .hamburger-inner:before,
.page-template-template-MilitarySupport header.global-header .top-nav .header-icon-wrap .socialWrap .socialNav ul li a:after,
.page-template-template-MilitarySupport header.global-header .top-nav .header-icon-wrap .socialWrap .socialNav ul li a:before,
.page-template-template-whatsNew .hamburger-inner:after,
.page-template-template-whatsNew .hamburger-inner:before,
.page-template-template-whatsNew header.global-header .top-nav .header-icon-wrap .socialWrap .socialNav ul li a:after,
.page-template-template-whatsNew header.global-header .top-nav .header-icon-wrap .socialWrap .socialNav ul li a:before,
.single-flavor .hamburger-inner:after,
.single-flavor .hamburger-inner:before,
.single-flavor header.global-header .top-nav .header-icon-wrap .socialWrap .socialNav ul li a:after,
.single-flavor header.global-header .top-nav .header-icon-wrap .socialWrap .socialNav ul li a:before {
background-color: #fff
}
.page-template-template-MilitarySupport header.global-header.past-banner .hamburger-inner,
.page-template-template-MilitarySupport header.global-header.past-banner .hamburger-inner:after,
.page-template-template-MilitarySupport header.global-header.past-banner .hamburger-inner:before,
.page-template-template-whatsNew header.global-header.past-banner .hamburger-inner,
.page-template-template-whatsNew header.global-header.past-banner .hamburger-inner:after,
.page-template-template-whatsNew header.global-header.past-banner .hamburger-inner:before,
.single-flavor header.global-header .hamburger-inner,
.single-flavor header.global-header .hamburger-inner:after,
.single-flavor header.global-header .hamburger-inner:before,
.single-flavor header.global-header.past-banner .hamburger-inner,
.single-flavor header.global-header.past-banner .hamburger-inner:after,
.single-flavor header.global-header.past-banner .hamburger-inner:before {
background-color: #231f20
}
.mainFooter {
background-image: url(//www.ripitenergy.com/wp-content/themes/RipIt/images/footerBG.jpg);
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: cover;
font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
font-size: 24px;
padding: 40px 20px
}
.mainFooter .footerNav .logoContain {
display: flex;
justify-content: center;
padding-bottom: 40px;
text-align: center
}
.mainFooter .footerNav ul.footer-menu {
display: flex;
justify-content: space-between;
list-style: none;
margin: 0;
padding: 0
}
.mainFooter .footerNav ul.footer-menu li a {
color: #fbfbfa;
display: block;
text-decoration: none;
text-transform: uppercase
}
.shopbtn {
background-color: red;
border-radius: 10px;
color: #fff;
display: inline-block;
font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
font-size: 18px;
padding: 5px 35px;
text-decoration: none;
text-transform: uppercase;
} .hamburger {
background-color: transparent;
border: 0;
color: inherit;
cursor: pointer;
display: inline-block;
font: inherit;
margin: 0;
overflow: visible;
padding: 7px 15px 15px;
text-transform: none;
transition-duration: .15s;
transition-property: opacity, -webkit-filter;
transition-property: opacity, filter;
transition-property: opacity, filter, -webkit-filter;
transition-timing-function: linear
}
.hamburger:hover {
opacity: .7
}
.hamburger-box {
display: inline-block;
height: 24px;
position: relative;
width: 40px
}
.hamburger-inner {
display: block;
margin-top: -2px;
top: 50%
}
.hamburger-inner,
.hamburger-inner:after,
.hamburger-inner:before {
background-color: #000;
border-radius: 4px;
height: 4px;
position: absolute;
transition-duration: .15s;
transition-property: transform;
transition-timing-function: ease;
width: 40px
}
.hamburger-inner:after,
.hamburger-inner:before {
content: "";
display: block
}
.hamburger-inner:before {
top: -10px
}
.hamburger-inner:after {
bottom: -10px
}
.hamburger--3dx .hamburger-box {
perspective: 80px
}
.hamburger--3dx .hamburger-inner {
transition: transform .15s cubic-bezier(.645, .045, .355, 1), background-color 0s cubic-bezier(.645, .045, .355, 1) .1s
}
.hamburger--3dx .hamburger-inner:after,
.hamburger--3dx .hamburger-inner:before {
transition: transform 0s cubic-bezier(.645, .045, .355, 1) .1s
}
.hamburger--3dx.is-active .hamburger-inner {
background-color: transparent;
transform: rotateY(180deg)
}
.hamburger--3dx.is-active .hamburger-inner:before {
transform: translate3d(0, 10px, 0) rotate(45deg)
}
.hamburger--3dx.is-active .hamburger-inner:after {
transform: translate3d(0, -10px, 0) rotate(-45deg)
}
.hamburger--3dx-r .hamburger-box {
perspective: 80px
}
.hamburger--3dx-r .hamburger-inner {
transition: transform .15s cubic-bezier(.645, .045, .355, 1), background-color 0s cubic-bezier(.645, .045, .355, 1) .1s
}
.hamburger--3dx-r .hamburger-inner:after,
.hamburger--3dx-r .hamburger-inner:before {
transition: transform 0s cubic-bezier(.645, .045, .355, 1) .1s
}
.hamburger--3dx-r.is-active .hamburger-inner {
background-color: transparent;
transform: rotateY(-180deg)
}
.hamburger--3dx-r.is-active .hamburger-inner:before {
transform: translate3d(0, 10px, 0) rotate(45deg)
}
.hamburger--3dx-r.is-active .hamburger-inner:after {
transform: translate3d(0, -10px, 0) rotate(-45deg)
}
.hamburger--3dy .hamburger-box {
perspective: 80px
}
.hamburger--3dy .hamburger-inner {
transition: transform .15s cubic-bezier(.645, .045, .355, 1), background-color 0s cubic-bezier(.645, .045, .355, 1) .1s
}
.hamburger--3dy .hamburger-inner:after,
.hamburger--3dy .hamburger-inner:before {
transition: transform 0s cubic-bezier(.645, .045, .355, 1) .1s
}
.hamburger--3dy.is-active .hamburger-inner {
background-color: transparent;
transform: rotateX(-180deg)
}
.hamburger--3dy.is-active .hamburger-inner:before {
transform: translate3d(0, 10px, 0) rotate(45deg)
}
.hamburger--3dy.is-active .hamburger-inner:after {
transform: translate3d(0, -10px, 0) rotate(-45deg)
}
.hamburger--3dy-r .hamburger-box {
perspective: 80px
}
.hamburger--3dy-r .hamburger-inner {
transition: transform .15s cubic-bezier(.645, .045, .355, 1), background-color 0s cubic-bezier(.645, .045, .355, 1) .1s
}
.hamburger--3dy-r .hamburger-inner:after,
.hamburger--3dy-r .hamburger-inner:before {
transition: transform 0s cubic-bezier(.645, .045, .355, 1) .1s
}
.hamburger--3dy-r.is-active .hamburger-inner {
background-color: transparent;
transform: rotateX(180deg)
}
.hamburger--3dy-r.is-active .hamburger-inner:before {
transform: translate3d(0, 10px, 0) rotate(45deg)
}
.hamburger--3dy-r.is-active .hamburger-inner:after {
transform: translate3d(0, -10px, 0) rotate(-45deg)
}
.hamburger--3dxy .hamburger-box {
perspective: 80px
}
.hamburger--3dxy .hamburger-inner {
transition: transform .15s cubic-bezier(.645, .045, .355, 1), background-color 0s cubic-bezier(.645, .045, .355, 1) .1s
}
.hamburger--3dxy .hamburger-inner:after,
.hamburger--3dxy .hamburger-inner:before {
transition: transform 0s cubic-bezier(.645, .045, .355, 1) .1s
}
.hamburger--3dxy.is-active .hamburger-inner {
background-color: transparent;
transform: rotateX(180deg) rotateY(180deg)
}
.hamburger--3dxy.is-active .hamburger-inner:before {
transform: translate3d(0, 10px, 0) rotate(45deg)
}
.hamburger--3dxy.is-active .hamburger-inner:after {
transform: translate3d(0, -10px, 0) rotate(-45deg)
}
.hamburger--3dxy-r .hamburger-box {
perspective: 80px
}
.hamburger--3dxy-r .hamburger-inner {
transition: transform .15s cubic-bezier(.645, .045, .355, 1), background-color 0s cubic-bezier(.645, .045, .355, 1) .1s
}
.hamburger--3dxy-r .hamburger-inner:after,
.hamburger--3dxy-r .hamburger-inner:before {
transition: transform 0s cubic-bezier(.645, .045, .355, 1) .1s
}
.hamburger--3dxy-r.is-active .hamburger-inner {
background-color: transparent;
transform: rotateX(180deg) rotateY(180deg) rotate(-180deg)
}
.hamburger--3dxy-r.is-active .hamburger-inner:before {
transform: translate3d(0, 10px, 0) rotate(45deg)
}
.hamburger--3dxy-r.is-active .hamburger-inner:after {
transform: translate3d(0, -10px, 0) rotate(-45deg)
}
.hamburger--arrow.is-active .hamburger-inner:before {
transform: translate3d(-8px, 0, 0) rotate(-45deg) scaleX(.7)
}
.hamburger--arrow.is-active .hamburger-inner:after {
transform: translate3d(-8px, 0, 0) rotate(45deg) scaleX(.7)
}
.hamburger--arrow-r.is-active .hamburger-inner:before {
transform: translate3d(8px, 0, 0) rotate(45deg) scaleX(.7)
}
.hamburger--arrow-r.is-active .hamburger-inner:after {
transform: translate3d(8px, 0, 0) rotate(-45deg) scaleX(.7)
}
.hamburger--arrowalt .hamburger-inner:before {
transition: top .1s ease .1s, transform .1s cubic-bezier(.165, .84, .44, 1)
}
.hamburger--arrowalt .hamburger-inner:after {
transition: bottom .1s ease .1s, transform .1s cubic-bezier(.165, .84, .44, 1)
}
.hamburger--arrowalt.is-active .hamburger-inner:before {
top: 0;
transform: translate3d(-8px, -10px, 0) rotate(-45deg) scaleX(.7);
transition: top .1s ease, transform .1s cubic-bezier(.895, .03, .685, .22) .1s
}
.hamburger--arrowalt.is-active .hamburger-inner:after {
bottom: 0;
transform: translate3d(-8px, 10px, 0) rotate(45deg) scaleX(.7);
transition: bottom .1s ease, transform .1s cubic-bezier(.895, .03, .685, .22) .1s
}
.hamburger--arrowalt-r .hamburger-inner:before {
transition: top .1s ease .1s, transform .1s cubic-bezier(.165, .84, .44, 1)
}
.hamburger--arrowalt-r .hamburger-inner:after {
transition: bottom .1s ease .1s, transform .1s cubic-bezier(.165, .84, .44, 1)
}
.hamburger--arrowalt-r.is-active .hamburger-inner:before {
top: 0;
transform: translate3d(8px, -10px, 0) rotate(45deg) scaleX(.7);
transition: top .1s ease, transform .1s cubic-bezier(.895, .03, .685, .22) .1s
}
.hamburger--arrowalt-r.is-active .hamburger-inner:after {
bottom: 0;
transform: translate3d(8px, 10px, 0) rotate(-45deg) scaleX(.7);
transition: bottom .1s ease, transform .1s cubic-bezier(.895, .03, .685, .22) .1s
}
.hamburger--arrowturn.is-active .hamburger-inner {
transform: rotate(-180deg)
}
.hamburger--arrowturn.is-active .hamburger-inner:before {
transform: translate3d(8px, 0, 0) rotate(45deg) scaleX(.7)
}
.hamburger--arrowturn.is-active .hamburger-inner:after {
transform: translate3d(8px, 0, 0) rotate(-45deg) scaleX(.7)
}
.hamburger--arrowturn-r.is-active .hamburger-inner {
transform: rotate(-180deg)
}
.hamburger--arrowturn-r.is-active .hamburger-inner:before {
transform: translate3d(-8px, 0, 0) rotate(-45deg) scaleX(.7)
}
.hamburger--arrowturn-r.is-active .hamburger-inner:after {
transform: translate3d(-8px, 0, 0) rotate(45deg) scaleX(.7)
}
.hamburger--boring .hamburger-inner,
.hamburger--boring .hamburger-inner:after,
.hamburger--boring .hamburger-inner:before {
transition-property: none
}
.hamburger--boring.is-active .hamburger-inner {
transform: rotate(45deg)
}
.hamburger--boring.is-active .hamburger-inner:before {
opacity: 0;
top: 0
}
.hamburger--boring.is-active .hamburger-inner:after {
bottom: 0;
transform: rotate(-90deg)
}
.hamburger--collapse .hamburger-inner {
bottom: 0;
top: auto;
transition-delay: .13s;
transition-duration: .13s;
transition-timing-function: cubic-bezier(.55, .055, .675, .19)
}
.hamburger--collapse .hamburger-inner:after {
top: -20px;
transition: top .2s cubic-bezier(.333, .667, .667, 1) .2s, opacity .1s linear
}
.hamburger--collapse .hamburger-inner:before {
transition: top .12s cubic-bezier(.333, .667, .667, 1) .2s, transform .13s cubic-bezier(.55, .055, .675, .19)
}
.hamburger--collapse.is-active .hamburger-inner {
transform: translate3d(0, -10px, 0) rotate(-45deg);
transition-delay: .22s;
transition-timing-function: cubic-bezier(.215, .61, .355, 1)
}
.hamburger--collapse.is-active .hamburger-inner:after {
opacity: 0;
top: 0;
transition: top .2s cubic-bezier(.333, 0, .667, .333), opacity .1s linear .22s
}
.hamburger--collapse.is-active .hamburger-inner:before {
top: 0;
transform: rotate(-90deg);
transition: top .1s cubic-bezier(.333, 0, .667, .333) .16s, transform .13s cubic-bezier(.215, .61, .355, 1) .25s
}
.hamburger--collapse-r .hamburger-inner {
bottom: 0;
top: auto;
transition-delay: .13s;
transition-duration: .13s;
transition-timing-function: cubic-bezier(.55, .055, .675, .19)
}
.hamburger--collapse-r .hamburger-inner:after {
top: -20px;
transition: top .2s cubic-bezier(.333, .667, .667, 1) .2s, opacity .1s linear
}
.hamburger--collapse-r .hamburger-inner:before {
transition: top .12s cubic-bezier(.333, .667, .667, 1) .2s, transform .13s cubic-bezier(.55, .055, .675, .19)
}
.hamburger--collapse-r.is-active .hamburger-inner {
transform: translate3d(0, -10px, 0) rotate(45deg);
transition-delay: .22s;
transition-timing-function: cubic-bezier(.215, .61, .355, 1)
}
.hamburger--collapse-r.is-active .hamburger-inner:after {
opacity: 0;
top: 0;
transition: top .2s cubic-bezier(.333, 0, .667, .333), opacity .1s linear .22s
}
.hamburger--collapse-r.is-active .hamburger-inner:before {
top: 0;
transform: rotate(90deg);
transition: top .1s cubic-bezier(.333, 0, .667, .333) .16s, transform .13s cubic-bezier(.215, .61, .355, 1) .25s
}
.hamburger--elastic .hamburger-inner {
top: 2px;
transition-duration: .275s;
transition-timing-function: cubic-bezier(.68, -.55, .265, 1.55)
}
.hamburger--elastic .hamburger-inner:before {
top: 10px;
transition: opacity .125s ease .275s
}
.hamburger--elastic .hamburger-inner:after {
top: 20px;
transition: transform .275s cubic-bezier(.68, -.55, .265, 1.55)
}
.hamburger--elastic.is-active .hamburger-inner {
transform: translate3d(0, 10px, 0) rotate(135deg);
transition-delay: 75ms
}
.hamburger--elastic.is-active .hamburger-inner:before {
opacity: 0;
transition-delay: 0s
}
.hamburger--elastic.is-active .hamburger-inner:after {
transform: translate3d(0, -20px, 0) rotate(-270deg);
transition-delay: 75ms
}
.hamburger--elastic-r .hamburger-inner {
top: 2px;
transition-duration: .275s;
transition-timing-function: cubic-bezier(.68, -.55, .265, 1.55)
}
.hamburger--elastic-r .hamburger-inner:before {
top: 10px;
transition: opacity .125s ease .275s
}
.hamburger--elastic-r .hamburger-inner:after {
top: 20px;
transition: transform .275s cubic-bezier(.68, -.55, .265, 1.55)
}
.hamburger--elastic-r.is-active .hamburger-inner {
transform: translate3d(0, 10px, 0) rotate(-135deg);
transition-delay: 75ms
}
.hamburger--elastic-r.is-active .hamburger-inner:before {
opacity: 0;
transition-delay: 0s
}
.hamburger--elastic-r.is-active .hamburger-inner:after {
transform: translate3d(0, -20px, 0) rotate(270deg);
transition-delay: 75ms
}
.hamburger--emphatic {
overflow: hidden
}
.hamburger--emphatic .hamburger-inner {
transition: background-color .125s ease-in .175s
}
.hamburger--emphatic .hamburger-inner:before {
left: 0;
transition: transform .125s cubic-bezier(.6, .04, .98, .335), top .05s linear .125s, left .125s ease-in .175s
}
.hamburger--emphatic .hamburger-inner:after {
right: 0;
top: 10px;
transition: transform .125s cubic-bezier(.6, .04, .98, .335), top .05s linear .125s, right .125s ease-in .175s
}
.hamburger--emphatic.is-active .hamburger-inner {
background-color: transparent;
transition-delay: 0s;
transition-timing-function: ease-out
}
.hamburger--emphatic.is-active .hamburger-inner:before {
left: -80px;
top: -80px;
transform: translate3d(80px, 80px, 0) rotate(45deg);
transition: left .125s ease-out, top .05s linear .125s, transform .125s cubic-bezier(.075, .82, .165, 1) .175s
}
.hamburger--emphatic.is-active .hamburger-inner:after {
right: -80px;
top: -80px;
transform: translate3d(-80px, 80px, 0) rotate(-45deg);
transition: right .125s ease-out, top .05s linear .125s, transform .125s cubic-bezier(.075, .82, .165, 1) .175s
}
.hamburger--emphatic-r {
overflow: hidden
}
.hamburger--emphatic-r .hamburger-inner {
transition: background-color .125s ease-in .175s
}
.hamburger--emphatic-r .hamburger-inner:before {
left: 0;
transition: transform .125s cubic-bezier(.6, .04, .98, .335), top .05s linear .125s, left .125s ease-in .175s
}
.hamburger--emphatic-r .hamburger-inner:after {
right: 0;
top: 10px;
transition: transform .125s cubic-bezier(.6, .04, .98, .335), top .05s linear .125s, right .125s ease-in .175s
}
.hamburger--emphatic-r.is-active .hamburger-inner {
background-color: transparent;
transition-delay: 0s;
transition-timing-function: ease-out
}
.hamburger--emphatic-r.is-active .hamburger-inner:before {
left: -80px;
top: 80px;
transform: translate3d(80px, -80px, 0) rotate(-45deg);
transition: left .125s ease-out, top .05s linear .125s, transform .125s cubic-bezier(.075, .82, .165, 1) .175s
}
.hamburger--emphatic-r.is-active .hamburger-inner:after {
right: -80px;
top: 80px;
transform: translate3d(-80px, -80px, 0) rotate(45deg);
transition: right .125s ease-out, top .05s linear .125s, transform .125s cubic-bezier(.075, .82, .165, 1) .175s
}
.hamburger--minus .hamburger-inner:after,
.hamburger--minus .hamburger-inner:before {
transition: bottom .08s ease-out 0s, top .08s ease-out 0s, opacity 0s linear
}
.hamburger--minus.is-active .hamburger-inner:after,
.hamburger--minus.is-active .hamburger-inner:before {
opacity: 0;
transition: bottom .08s ease-out, top .08s ease-out, opacity 0s linear .08s
}
.hamburger--minus.is-active .hamburger-inner:before {
top: 0
}
.hamburger--minus.is-active .hamburger-inner:after {
bottom: 0
}
.hamburger--slider .hamburger-inner {
top: 2px
}
.hamburger--slider .hamburger-inner:before {
top: 10px;
transition-duration: .15s;
transition-property: transform, opacity;
transition-timing-function: ease
}
.hamburger--slider .hamburger-inner:after {
top: 20px
}
.hamburger--slider.is-active .hamburger-inner {
transform: translate3d(0, 10px, 0) rotate(45deg)
}
.hamburger--slider.is-active .hamburger-inner:before {
opacity: 0;
transform: rotate(-45deg) translate3d(-5.714px, -6px, 0)
}
.hamburger--slider.is-active .hamburger-inner:after {
transform: translate3d(0, -20px, 0) rotate(-90deg)
}
.hamburger--slider-r .hamburger-inner {
top: 2px
}
.hamburger--slider-r .hamburger-inner:before {
top: 10px;
transition-duration: .15s;
transition-property: transform, opacity;
transition-timing-function: ease
}
.hamburger--slider-r .hamburger-inner:after {
top: 20px
}
.hamburger--slider-r.is-active .hamburger-inner {
transform: translate3d(0, 10px, 0) rotate(-45deg)
}
.hamburger--slider-r.is-active .hamburger-inner:before {
opacity: 0;
transform: rotate(45deg) translate3d(5.714px, -6px, 0)
}
.hamburger--slider-r.is-active .hamburger-inner:after {
transform: translate3d(0, -20px, 0) rotate(90deg)
}
.hamburger--spin .hamburger-inner {
transition-duration: .22s;
transition-timing-function: cubic-bezier(.55, .055, .675, .19)
}
.hamburger--spin .hamburger-inner:before {
transition: top .1s ease-in .25s, opacity .1s ease-in
}
.hamburger--spin .hamburger-inner:after {
transition: bottom .1s ease-in .25s, transform .22s cubic-bezier(.55, .055, .675, .19)
}
.hamburger--spin.is-active .hamburger-inner {
transform: rotate(225deg);
transition-delay: .12s;
transition-timing-function: cubic-bezier(.215, .61, .355, 1)
}
.hamburger--spin.is-active .hamburger-inner:before {
opacity: 0;
top: 0;
transition: top .1s ease-out, opacity .1s ease-out .12s
}
.hamburger--spin.is-active .hamburger-inner:after {
bottom: 0;
transform: rotate(-90deg);
transition: bottom .1s ease-out, transform .22s cubic-bezier(.215, .61, .355, 1) .12s
}
.hamburger--spin-r .hamburger-inner {
transition-duration: .22s;
transition-timing-function: cubic-bezier(.55, .055, .675, .19)
}
.hamburger--spin-r .hamburger-inner:before {
transition: top .1s ease-in .25s, opacity .1s ease-in
}
.hamburger--spin-r .hamburger-inner:after {
transition: bottom .1s ease-in .25s, transform .22s cubic-bezier(.55, .055, .675, .19)
}
.hamburger--spin-r.is-active .hamburger-inner {
transform: rotate(-225deg);
transition-delay: .12s;
transition-timing-function: cubic-bezier(.215, .61, .355, 1)
}
.hamburger--spin-r.is-active .hamburger-inner:before {
opacity: 0;
top: 0;
transition: top .1s ease-out, opacity .1s ease-out .12s
}
.hamburger--spin-r.is-active .hamburger-inner:after {
bottom: 0;
transform: rotate(90deg);
transition: bottom .1s ease-out, transform .22s cubic-bezier(.215, .61, .355, 1) .12s
}
.hamburger--spring .hamburger-inner {
top: 2px;
transition: background-color 0s linear .13s
}
.hamburger--spring .hamburger-inner:before {
top: 10px;
transition: top .1s cubic-bezier(.333, .667, .667, 1) .2s, transform .13s cubic-bezier(.55, .055, .675, .19)
}
.hamburger--spring .hamburger-inner:after {
top: 20px;
transition: top .2s cubic-bezier(.333, .667, .667, 1) .2s, transform .13s cubic-bezier(.55, .055, .675, .19)
}
.hamburger--spring.is-active .hamburger-inner {
background-color: transparent;
transition-delay: .22s
}
.hamburger--spring.is-active .hamburger-inner:before {
top: 0;
transform: translate3d(0, 10px, 0) rotate(45deg);
transition: top .1s cubic-bezier(.333, 0, .667, .333) .15s, transform .13s cubic-bezier(.215, .61, .355, 1) .22s
}
.hamburger--spring.is-active .hamburger-inner:after {
top: 0;
transform: translate3d(0, 10px, 0) rotate(-45deg);
transition: top .2s cubic-bezier(.333, 0, .667, .333), transform .13s cubic-bezier(.215, .61, .355, 1) .22s
}
.hamburger--spring-r .hamburger-inner {
bottom: 0;
top: auto;
transition-delay: 0s;
transition-duration: .13s;
transition-timing-function: cubic-bezier(.55, .055, .675, .19)
}
.hamburger--spring-r .hamburger-inner:after {
top: -20px;
transition: top .2s cubic-bezier(.333, .667, .667, 1) .2s, opacity 0s linear
}
.hamburger--spring-r .hamburger-inner:before {
transition: top .1s cubic-bezier(.333, .667, .667, 1) .2s, transform .13s cubic-bezier(.55, .055, .675, .19)
}
.hamburger--spring-r.is-active .hamburger-inner {
transform: translate3d(0, -10px, 0) rotate(-45deg);
transition-delay: .22s;
transition-timing-function: cubic-bezier(.215, .61, .355, 1)
}
.hamburger--spring-r.is-active .hamburger-inner:after {
opacity: 0;
top: 0;
transition: top .2s cubic-bezier(.333, 0, .667, .333), opacity 0s linear .22s
}
.hamburger--spring-r.is-active .hamburger-inner:before {
top: 0;
transform: rotate(90deg);
transition: top .1s cubic-bezier(.333, 0, .667, .333) .15s, transform .13s cubic-bezier(.215, .61, .355, 1) .22s
}
.hamburger--stand .hamburger-inner {
transition: transform 75ms cubic-bezier(.55, .055, .675, .19) .15s, background-color 0s linear 75ms
}
.hamburger--stand .hamburger-inner:before {
transition: top 75ms ease-in 75ms, transform 75ms cubic-bezier(.55, .055, .675, .19) 0s
}
.hamburger--stand .hamburger-inner:after {
transition: bottom 75ms ease-in 75ms, transform 75ms cubic-bezier(.55, .055, .675, .19) 0s
}
.hamburger--stand.is-active .hamburger-inner {
background-color: transparent;
transform: rotate(90deg);
transition: transform 75ms cubic-bezier(.215, .61, .355, 1) 0s, background-color 0s linear .15s
}
.hamburger--stand.is-active .hamburger-inner:before {
top: 0;
transform: rotate(-45deg);
transition: top 75ms ease-out .1s, transform 75ms cubic-bezier(.215, .61, .355, 1) .15s
}
.hamburger--stand.is-active .hamburger-inner:after {
bottom: 0;
transform: rotate(45deg);
transition: bottom 75ms ease-out .1s, transform 75ms cubic-bezier(.215, .61, .355, 1) .15s
}
.hamburger--stand-r .hamburger-inner {
transition: transform 75ms cubic-bezier(.55, .055, .675, .19) .15s, background-color 0s linear 75ms
}
.hamburger--stand-r .hamburger-inner:before {
transition: top 75ms ease-in 75ms, transform 75ms cubic-bezier(.55, .055, .675, .19) 0s
}
.hamburger--stand-r .hamburger-inner:after {
transition: bottom 75ms ease-in 75ms, transform 75ms cubic-bezier(.55, .055, .675, .19) 0s
}
.hamburger--stand-r.is-active .hamburger-inner {
background-color: transparent;
transform: rotate(-90deg);
transition: transform 75ms cubic-bezier(.215, .61, .355, 1) 0s, background-color 0s linear .15s
}
.hamburger--stand-r.is-active .hamburger-inner:before {
top: 0;
transform: rotate(-45deg);
transition: top 75ms ease-out .1s, transform 75ms cubic-bezier(.215, .61, .355, 1) .15s
}
.hamburger--stand-r.is-active .hamburger-inner:after {
bottom: 0;
transform: rotate(45deg);
transition: bottom 75ms ease-out .1s, transform 75ms cubic-bezier(.215, .61, .355, 1) .15s
}
.hamburger--squeeze .hamburger-inner {
transition-duration: 75ms;
transition-timing-function: cubic-bezier(.55, .055, .675, .19)
}
.hamburger--squeeze .hamburger-inner:before {
transition: top 75ms ease .12s, opacity 75ms ease
}
.hamburger--squeeze .hamburger-inner:after {
transition: bottom 75ms ease .12s, transform 75ms cubic-bezier(.55, .055, .675, .19)
}
.hamburger--squeeze.is-active .hamburger-inner {
transform: rotate(45deg);
transition-delay: .12s;
transition-timing-function: cubic-bezier(.215, .61, .355, 1)
}
.hamburger--squeeze.is-active .hamburger-inner:before {
opacity: 0;
top: 0;
transition: top 75ms ease, opacity 75ms ease .12s
}
.hamburger--squeeze.is-active .hamburger-inner:after {
bottom: 0;
transform: rotate(-90deg);
transition: bottom 75ms ease, transform 75ms cubic-bezier(.215, .61, .355, 1) .12s
}
.hamburger--vortex .hamburger-inner {
transition-duration: .2s;
transition-timing-function: cubic-bezier(.19, 1, .22, 1)
}
.hamburger--vortex .hamburger-inner:after,
.hamburger--vortex .hamburger-inner:before {
transition-delay: .1s;
transition-duration: 0s;
transition-timing-function: linear
}
.hamburger--vortex .hamburger-inner:before {
transition-property: top, opacity
}
.hamburger--vortex .hamburger-inner:after {
transition-property: bottom, transform
}
.hamburger--vortex.is-active .hamburger-inner {
transform: rotate(765deg);
transition-timing-function: cubic-bezier(.19, 1, .22, 1)
}
.hamburger--vortex.is-active .hamburger-inner:after,
.hamburger--vortex.is-active .hamburger-inner:before {
transition-delay: 0s
}
.hamburger--vortex.is-active .hamburger-inner:before {
opacity: 0;
top: 0
}
.hamburger--vortex.is-active .hamburger-inner:after {
bottom: 0;
transform: rotate(90deg)
}
.hamburger--vortex-r .hamburger-inner {
transition-duration: .2s;
transition-timing-function: cubic-bezier(.19, 1, .22, 1)
}
.hamburger--vortex-r .hamburger-inner:after,
.hamburger--vortex-r .hamburger-inner:before {
transition-delay: .1s;
transition-duration: 0s;
transition-timing-function: linear
}
.hamburger--vortex-r .hamburger-inner:before {
transition-property: top, opacity
}
.hamburger--vortex-r .hamburger-inner:after {
transition-property: bottom, transform
}
.hamburger--vortex-r.is-active .hamburger-inner {
transform: rotate(-765deg);
transition-timing-function: cubic-bezier(.19, 1, .22, 1)
}
.hamburger--vortex-r.is-active .hamburger-inner:after,
.hamburger--vortex-r.is-active .hamburger-inner:before {
transition-delay: 0s
}
.hamburger--vortex-r.is-active .hamburger-inner:before {
opacity: 0;
top: 0
}
.hamburger--vortex-r.is-active .hamburger-inner:after {
bottom: 0;
transform: rotate(-90deg)
}
.btn {
background-color: red;
border-radius: 10px;
color: #fff;
display: inline-block;
font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
font-size: 30px;
padding: 7px 80px;
text-decoration: none;
text-transform: uppercase
}
.btn.small {
font-size: 20px;
padding: 8px
}
.btn.mainNav {
font-size: 18px;
padding: 5px 35px
}
.btn.requestBtn {
font-size: 22px;
padding: 7px 61px
}
.btn.formBtn {
font-size: 20px
}
.btn.btnInline {
background-color: #231f20;
font-size: 20px;
padding: 7px 45px;
transition: all .2s linear
}
.btn.btnInline.active {
background-color: red;
transition: all .2s linear
}
.round-button {
background-color: rgba(0, 0, 0, .5);
border: 6px solid #fff;
border-radius: 50%;
box-sizing: border-box;
color: #f5f5f5;
display: block;
font-size: 20px;
font-weight: 700;
height: 80px;
line-height: 20px;
padding-left: 8px;
padding-top: 14px;
text-align: center;
text-decoration: none;
transition: all .3s ease;
width: 80px
}
.round-button:hover {
background-color: rgba(0, 0, 0, .8);
box-shadow: 0 0 10px #ffff64;
text-shadow: 0 0 10px #ffff64
}
.homeBanner {
align-items: center;
display: flex;
height: calc(100vh - 80px);
justify-content: center;
max-width: 100%;
position: relative;
text-align: center
}
.homeBanner #canvas-parent {
width: 100%
}
canvas {
display: block
}
.scene-nav {
background: none;
border: 0;
color: var(--color-nav);
font-size: 1.15em;
padding: 1.5em;
position: fixed;
right: 0;
top: 50%;
transform: translateY(-50%);
z-index: 10
}
.scene-nav:focus {
outline: none
}
.slide-wrapper {
display: none
}
.mapOverlay {
background-image: url(//www.ripitenergy.com/wp-content/themes/RipIt/images/mapOverlay.png);
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: cover;
height: 650px;
left: 0;
position: absolute;
right: 0;
top: 0;
width: 100%
}
.wpsl-search {
background: transparent !important;
display: flex;
flex-wrap: wrap;
justify-content: flex-end;
margin-bottom: 6px !important;
margin-top: -56px;
position: relative;
width: 100%
}
.wpsl-search #wpsl-search-wrap {
float: none;
padding-right: 10%;
width: auto
}
.wpsl-search #wpsl-search-wrap #wpsl-search-input {
border: 2px solid #231f20
}
.wpsl-search #wpsl-search-wrap #wpsl-search-input::-webkit-input-placeholder {
color: #231f20;
opacity: 1
}
.wpsl-search #wpsl-search-wrap #wpsl-search-input:-ms-input-placeholder {
color: #231f20;
opacity: 1
}
.wpsl-search #wpsl-search-wrap #wpsl-search-input::-ms-input-placeholder {
color: #231f20;
opacity: 1
}
.wpsl-search #wpsl-search-wrap #wpsl-search-input::placeholder {
color: #231f20;
opacity: 1
}
.wpsl-search #wpsl-search-wrap #wpsl-search-btn {
background-color: red;
background-image: none;
border: none;
border-radius: 10px;
color: #fff;
display: inline-block;
font-size: 15px;
padding: 8px 15px;
text-decoration: none;
text-transform: uppercase !important
}
#wpsl-result-list {
margin: 6px 0 0
}
#wpsl-result-list ul {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
max-height: 285px;
overflow-y: auto;
width: 50%
}
#wpsl-result-list ul li {
margin-bottom: 5px;
margin-top: 5px;
width: 100%
}
#wpsl-stores {
background: red url(//www.ripitenergy.com/wp-content/themes/RipIt/images/mapBG.jpg);
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: cover;
display: flex;
flex-wrap: wrap;
overflow-y: inherit !important;
padding: 20px 20px 0;
width: 100%
}
#wpsl-stores .titles-contain {
display: flex;
flex-wrap: wrap;
justify-content: flex-end;
width: 50%
}
#wpsl-stores .titles-contain .title-contain {
padding: 20px 10% 0 0;
text-align: right
}
#wpsl-stores .titles-contain .title-contain h2 {
color: #fff;
font-size: calc(-45px + 13.67188vw);
font-weight: 500;
line-height: .9;
margin: 0
}
#wpsl-stores .titles-contain .title-contain h2 span {
font-size: calc(-50px + 19.53125vw)
}
#wpsl-wrap,
.wpsl-gmap-canvas {
margin-bottom: 0 !important
}
.wpsl-street {
display: inline-block !important
}
span.bullet {
display: inline-block;
font-size: 10px;
position: relative;
top: -2px
}
#wpsl-wrap #wpsl-result-list li {
border: none !important;
color: #fff;
font-family: Arial, Helvetica Neue, Helvetica, sans-serif
}
#wpsl-wrap #wpsl-result-list li p {
font-size: 18px
}
#wpsl-wrap #wpsl-result-list li strong {
display: block;
font-size: 22px;
margin-bottom: 5px
}
.scrollDown {
bottom: 0;
position: absolute;
right: 3%;
width: auto
}
.modal .checkbox {
display: none
}
.modal .modal-overlay {
background-color: rgba(0, 0, 0, .7);
display: none;
height: 100vh;
left: 0;
opacity: 0;
position: absolute;
position: fixed;
top: 0;
transform: scale(1);
transition: all .3s ease;
width: 50%;
width: 100vw;
z-index: -100
}
.modal .modal-wrap {
-ms-grid-row-align: center;
align-self: center;
background-color: #ddd;
border-radius: 2px;
box-shadow: 3px 3px 3px rgba(0, 0, 0, .2);
height: auto;
margin: 20px auto;
padding: 40px 50px;
transition: all .5s ease;
width: 80%
}
.modal .modal-wrap.small {
width: 30%
}
.modal .modal-wrap.full {
height: 100%;
width: 100%
}
.modal .modal-wrap.a-center {
-ms-grid-row-align: center;
align-self: center
}
.modal .modal-wrap.from-left {
transform: translateX(-100%)
}
.modal .modal-wrap.from-right {
transform: translateX(100%)
}
.modal .modal-wrap.from-top {
transform: translateY(-100%)
}
.modal .modal-wrap.from-bottom {
transform: translateY(100%)
}
.modal .modal-overlay .close {
color: #282c34;
font-size: 40px;
height: 30px;
position: absolute;
right: 10px;
top: 10px;
width: 30px
}
.modal .modal-overlay .close:hover {
color: #4b5361;
cursor: pointer
}
.modal .o-close {
height: 100%;
left: 0;
position: fixed;
top: 0;
width: 100%;
z-index: -100
}
.modal input:checked~.o-close {
z-index: 9998
}
.modal input:checked~.modal-overlay {
-moz-animation-duration: .5s;
-moz-animation-name: fade-in;
-webkit-animation-duration: .5s;
-webkit-animation-name: fade-in;
animation-duration: .5s;
animation-name: fade-in;
display: flex;
opacity: 1;
overflow: auto;
transform: scale(1);
z-index: 9997
}
.modal input:checked~.modal-overlay .modal-wrap {
transform: translateY(0);
z-index: 9999
}
@keyframes fade-in {
0% {
display: none;
opacity: 0
}
1% {
display: flex;
opacity: 0
}
to {
display: flex;
opacity: 1
}
}
.open-modal {
display: inline-block
}
.open-modal:hover {
cursor: pointer
}
.frameContain {
height: 0;
overflow: hidden;
padding-bottom: 56.25%;
position: relative
}
.frameContain iframe {
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%
}
.frameContain video {
height: auto;
width: 100%
}
.flavorC,
.homeD {
min-height: 60vh
}
.flavorC #storelocatorwidget .storelocator,
.homeD #storelocatorwidget .storelocator {
background-color: red;
display: flex;
flex-wrap: wrap;
position: relative;
width: 100% !important
}
.flavorC #storelocatorwidget .storelocator #storelocator-search-bar,
.homeD #storelocatorwidget .storelocator #storelocator-search-bar {
max-width: 500px;
position: absolute;
right: 10%;
top: 550px;
width: 100%;
z-index: 2
}
.flavorC #storelocatorwidget .storelocator #storelocator-search-bar #storelocator-filter_checkbox,
.homeD #storelocatorwidget .storelocator #storelocator-search-bar #storelocator-filter_checkbox {
display: none !important
}
.flavorC #storelocatorwidget .storelocator #storelocator-search-bar #storelocator-search-bar-row1,
.homeD #storelocatorwidget .storelocator #storelocator-search-bar #storelocator-search-bar-row1 {
background: transparent;
margin: 0;
width: 100%
}
.flavorC #storelocatorwidget .storelocator #storelocator-search-bar #storelocator-search-bar-row1 span,
.homeD #storelocatorwidget .storelocator #storelocator-search-bar #storelocator-search-bar-row1 span {
display: none
}
.flavorC #storelocatorwidget .storelocator #storelocator-search-bar #storelocator-search-bar-row1 input,
.homeD #storelocatorwidget .storelocator #storelocator-search-bar #storelocator-search-bar-row1 input {
border: 1px solid #231f20;
border-radius: 5px;
margin: 0
}
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper {
flex-wrap: wrap !important;
margin: 0;
order: 0;
position: relative
}
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn {
background: url(//www.ripitenergy.com/wp-content/themes/RipIt/images/mapBG.jpg), red;
background-position: 50% 50%;
background-size: cover;
display: flex;
flex-wrap: wrap;
margin-right: 0;
margin-top: 10px;
max-width: inherit !important;
order: 1;
overflow-x: hidden;
overflow-y: hidden;
width: 100%
}
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-title,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-title {
align-items: center;
color: #fff;
display: flex;
justify-content: flex-end;
padding-right: 20px;
width: 50%
}
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-title .content,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-title .content {
text-align: right
}
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-title .content h2,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-title .content h2 {
font-size: 11.71875vw;
font-weight: 500;
margin: 0;
word-spacing: -5px
}
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-title .content h2 span,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-title .content h2 span {
font-size: calc(-27.5px + 18.55469vw)
}
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-list,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-list {
height: 400px;
overflow-x: hidden;
overflow-y: auto;
padding: 5px 0;
width: 50%
}
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store {
background: transparent;
border: none;
padding: 5px 30px
}
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store p.storelocator-address,
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store p.storelocator-phone,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store p.storelocator-address,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store p.storelocator-phone {
display: inline
}
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store p.storelocator-phone,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store p.storelocator-phone {
padding-left: 15px;
position: relative;
white-space: nowrap
}
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store p.storelocator-phone:before,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store p.storelocator-phone:before {
background-color: #fff;
border-radius: 50%;
content: "";
height: 6px;
left: 5px;
position: absolute;
top: 7px;
width: 6px
}
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store p.storelocator-buttons a,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store p.storelocator-buttons a {
max-width: 150px;
min-width: inherit
}
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store p,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store p {
color: #fff;
font-size: 17px;
font-weight: 300
}
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store p a,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store p a {
color: #fff
}
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store p a.storelocator-storename,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store p a.storelocator-storename {
font-weight: 500
}
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store .storelocator-email,
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store .storelocator-website,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store .storelocator-email,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store .storelocator-website {
display: none
}
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-map_canvas,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-map_canvas {
height: 600px;
order: 0;
width: 100% !important
}
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-mapOverlay,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-mapOverlay {
background-image: url(//www.ripitenergy.com/wp-content/themes/RipIt/images/mapOverlay.png);
background-position: 50% 50%;
background-size: cover;
min-height: 600px;
position: absolute;
top: 0;
width: 100%;
z-index: 1
}
.findRipItA #storelocatorwidget #storelocatorwidget-container {
background-color: red;
color: #fff;
display: flex;
flex-wrap: wrap;
height: calc(60vh - 7px);
min-height: 620px;
position: relative
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-search-bar {
margin: -20px 0 0;
width: 70%
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-search-bar #storelocator-filter_checkbox {
display: none !important
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-search-bar #storelocator-search-bar-row1 {
background: transparent
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-search-bar #storelocator-search-bar-row1 input {
border: 1px solid #231f20;
border-radius: 5px;
padding: 10px 4px !important
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-search-bar #storelocator-search-bar-row1 span#storelocator-search-label {
display: none
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-search-bar #storelocator-search-bar-row1 #storelocator-search_address {
margin: 0
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-wrapper {
display: flex;
margin: 0;
width: 100%
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-wrapper #storelocator-map_canvas {
height: calc(60vh - 7px);
min-height: 620px;
order: 0;
width: 60%
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-wrapper #storelocator-mapOverlay {
background-image: url(//www.ripitenergy.com/wp-content/themes/RipIt/images/mapOverlay.png);
background-position: 50% 50%;
background-size: cover;
height: calc(60vh - 7px);
left: 0;
min-height: 600px;
position: absolute;
top: 0;
width: 60%;
z-index: 1
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-wrapper #storelocator-leftcolumn {
background: url(//www.ripitenergy.com/wp-content/themes/RipIt/images/list-BG.jpg), red;
background-position: 50% 50%;
background-size: cover;
height: calc(60vh - 7px);
margin: 0;
max-width: inherit;
min-height: 620px;
order: 1;
overflow-x: hidden;
overflow-y: hidden;
padding: 20px 0 0 1.5%;
width: 40%
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-wrapper #storelocator-leftcolumn #storelocator-list {
margin-top: 15px;
overflow-x: hidden;
overflow-y: auto
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store {
background: transparent;
border: none;
padding: 5px 0
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store p.storelocator-address,
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store p.storelocator-phone {
display: inline
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store p.storelocator-phone {
padding-left: 15px;
position: relative;
white-space: nowrap
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store p.storelocator-phone:before {
background-color: #fff;
border-radius: 50%;
content: "";
height: 6px;
left: 5px;
position: absolute;
top: 7px;
width: 6px
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store p.storelocator-buttons a {
max-width: 150px;
min-width: inherit;
text-transform: uppercase
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store p {
color: #fff;
font-size: 17px;
font-weight: 300
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store p a {
color: #fff
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store p a.storelocator-storename {
font-weight: 500
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store .storelocator-email,
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-wrapper #storelocator-leftcolumn #storelocator-list .storelocator-store .storelocator-website {
display: none
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-wrapper #storelocator-leftcolumn #storelocator-title .content {
text-align: left
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-wrapper #storelocator-leftcolumn #storelocator-title .content h2 {
font-size: calc(-45px + 13.67188vw);
font-weight: 500;
margin: 0;
word-spacing: -5px
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-wrapper #storelocator-leftcolumn #storelocator-title .content h2 span {
font-size: calc(-35px + 17.57813vw)
}
.hiddenMap #storelocatorwidget,
.hiddenMap #storelocatorwidget-container {
height: 500px
}
.hiddenMap #storelocator-wrapper {
height: 500px;
margin: 0 !important
}
.hiddenMap #storelocator-wrapper #storelocator-map_canvas {
height: 500px
}
.hiddenMap #storelocator-leftcolumn,
.hiddenMap #storelocator-search-bar {
display: none
}
.hiddenMap #storelocator-search-bar #storelocator-filter_checkbox {
display: none !important
}
.homeA {
-ms-grid-columns: 1fr 1fr;
background-image: url(//www.ripitenergy.com/wp-content/themes/RipIt/images/homeA-BG.jpg);
background-position: 78% 50%;
background-repeat: no-repeat;
background-size: cover;
display: -ms-grid;
display: grid;
grid-template-columns: 1fr 1fr;
min-height: 80vh
}
.homeA .left {
align-items: flex-end;
color: #fbfbfa;
display: flex;
flex-wrap: wrap;
font-family: BronxShoesRegular;
padding: 0 0 16% 60px
}
.homeA .left h1 {
font-size: calc(-30px + 11.71875vw);
margin-bottom: 40px;
text-shadow: -6px 8px 10px rgba(0, 0, 0, .76);
word-spacing: -5px
}
.homeB {
-ms-grid-columns: (minmax(1px, 1fr))[4];
-ms-grid-rows: (max-content)[2];
display: -ms-grid;
display: grid;
grid-column-gap: 20px;
grid-row-gap: 20px;
grid-template-columns: repeat(4, minmax(1px, 1fr));
grid-template-rows: repeat(2, -webkit-max-content);
grid-template-rows: repeat(2, max-content);
padding: 20px
}
.homeB .news-item {
align-items: center;
background-color: #fff;
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: cover;
display: flex;
flex-wrap: wrap;
position: relative
}
.homeB .news-item .newsOverlay {
background-color: transparent;
bottom: 0;
height: 100%;
left: 0;
overflow: hidden;
position: absolute;
right: 0;
top: 0;
width: 100%
}
.homeB .news-item .newsOverlay:hover .contentWrap {
top: 0;
transition: all .22s ease-in-out;
transition-delay: 50ms;
z-index: 10
}
.homeB .news-item .newsOverlay .contentWrap {
align-items: center;
background-color: rgba(35, 31, 32, .7);
display: flex;
flex-wrap: wrap;
height: 100%;
justify-content: center;
left: 0;
overflow-y: auto;
position: absolute;
right: 0;
text-align: center;
top: 100%;
transition: all .22s ease-in-out;
width: 100%;
z-index: -1
}
.homeB .news-item .newsOverlay .contentWrap .content {
color: #fbfbfa;
padding: 15px
}
.homeB .news-item .newsOverlay .contentWrap .content h3 {
font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
font-size: 20px;
line-height: 1.2;
margin: 0 0 15px
}
.homeB .news-item.newsHeadlineItem,
.homeB .news-item.socialHeadlineItem {
color: #fbfbfa;
padding: 10% 0 0 10%;
text-decoration: none;
text-shadow: -6px 8px 10px rgba(0, 0, 0, .76)
}
.homeB .news-item.newsHeadlineItem h2,
.homeB .news-item.socialHeadlineItem h2 {
font-size: calc(82.5px + 2.92969vw);
font-weight: 500;
margin: 0;
word-spacing: -20px;
word-spacing: -15px
}
.homeB .news-item.newsHeadlineItem {
background-image: url(//www.ripitenergy.com/wp-content/themes/RipIt/images/newsHeadline.jpg)
}
.homeB .news-item.socialHeadlineItem {
background-image: url(//www.ripitenergy.com/wp-content/themes/RipIt/images/socialHeadline.jpg)
}
.homeC {
background-image: url(//www.ripitenergy.com/wp-content/themes/RipIt/images/homeC-BG.jpg);
background-position: 78% 50%;
background-repeat: no-repeat;
background-size: cover;
justify-content: flex-end;
margin-bottom: 10px;
min-height: 80vh
}
.homeC,
.homeC .right {
display: flex;
flex-wrap: wrap
}
.homeC .right {
align-items: flex-end;
color: #fbfbfa;
font-family: BronxShoesRegular;
padding: 0 60px 16% 0
}
.homeC .right h2 {
font-size: calc(-30px + 11.71875vw);
font-weight: 500;
margin-bottom: 40px;
text-shadow: -6px 8px 10px rgba(0, 0, 0, .76);
word-spacing: -5px
}
.homeD {
border-top: 10px solid red;
margin-bottom: 20px;
min-height: 60vh
}
.flavorA {
height: 100vh;
min-height: 550px;
overflow: hidden;
position: relative;
text-align: center
}
.flavorA video {
display: inline-block;
left: 100%;
margin-left: -200%;
position: relative
}
.flavorB {
padding: 60px 0
}
.flavorB .headlineContain {
padding: 0 120px
}
.flavorB .headlineContain .content {
display: flex
}
.flavorB .headlineContain .content h1 {
color: red;
display: inline-block;
font-size: calc(-40px + 15.625vw);
margin: 0;
word-spacing: -5px
}
.flavorB .headlineContain .content .squareContain {
align-items: flex-end;
display: inline-block;
display: flex;
margin-left: 15px;
max-width: 240px
}
.flavorB .headlineContain .content .squareContain img {
bottom: 42px;
position: relative
}
.flavorB .copyContain {
display: flex;
justify-content: flex-start;
max-width: 900px;
padding: 0 0 0 120px
}
.flavorB .copyContain .content p {
font-size: 20px;
line-height: 1.3;
margin-top: 0
}
.flavorB .flavorSlider {
overflow: hidden
}
.flavorB .flavorSlider .owl-carousel .owl-stage-outer {
padding: 60px 0 80px
}
.flavorB .flavorSlider .owl-carousel .owl-item {
text-align: center;
transition: all .2s ease-in-out
}
.flavorB .flavorSlider .owl-carousel .owl-item:hover {
transform: scale3d(1.2, 1.2, 1.2);
transition: all .2s ease-in-out
}
.flavorB .flavorSlider .owl-carousel .owl-item img {
margin: auto;
width: auto
}
.flavorB .flavorSlider .owl-carousel .owl-nav {
display: flex;
justify-content: space-between;
padding: 0 35%
}
.flavorB .flavorSlider .owl-carousel .owl-nav button.owl-next,
.flavorB .flavorSlider .owl-carousel .owl-nav button.owl-prev {
max-width: 50px
}
.flavorB .flavorSlider .owl-carousel .owl-dots {
margin-top: -40px;
position: relative;
text-align: center;
z-index: 2
}
.flavorB .flavorSlider .owl-carousel .owl-dots .owl-dot {
height: 20px;
margin: 0 5px;
width: 20px
}
.flavorB .flavorSlider .owl-carousel .owl-dots .owl-dot span {
border: 1px solid #231f20;
border-radius: 50%;
display: block;
height: 20px;
width: 20px
}
.flavorB .flavorSlider .owl-carousel .owl-dots .owl-dot.active span {
background-color: #818285
}
.flavorC {
border-top: 10px solid red
}
.socialA {
align-items: center;
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: cover;
display: flex;
justify-content: center;
min-height: 65vh;
text-align: center
}
.socialB {
min-height: 80vh
}
.socialB .headline {
padding: 80px 20px 0;
text-align: center
}
.socialB .headline h2 {
color: red;
font-size: calc(22.5px + 10.74219vw);
font-weight: 500;
margin: 0;
word-spacing: -5px
}
.socialB .feedContain,
.socialB .innerPostContain {
-ms-grid-columns: (minmax(auto, 1fr))[2] minmax(auto, 2fr) (minmax(auto, 1fr))[2];
-ms-grid-rows: auto;
display: -ms-grid;
display: grid;
grid-column-gap: 0;
grid-row-gap: 0;
grid-template-columns: repeat(2, minmax(auto, 1fr)) minmax(auto, 2fr) repeat(2, minmax(auto, 1fr));
grid-template-rows: auto;
padding: 0
}
.socialB .feedContain .news-item,
.socialB .innerPostContain .news-item {
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: cover;
min-height: 100px;
overflow: hidden;
position: relative
}
.socialB .feedContain .news-item:nth-child(3),
.socialB .feedContain .news-item:nth-child(8),
.socialB .innerPostContain .news-item:nth-child(3),
.socialB .innerPostContain .news-item:nth-child(8) {
-ms-grid-column: 3;
-ms-grid-column-span: 1;
grid-column: 3/4;
height: 50vh;
min-height: 300px
}
.socialB .feedContain .news-item:nth-child(3),
.socialB .innerPostContain .news-item:nth-child(3) {
-ms-grid-row: 1;
-ms-grid-row-span: 2;
grid-row: 1/3
}
.socialB .feedContain .news-item:nth-child(8),
.socialB .innerPostContain .news-item:nth-child(8) {
-ms-grid-row: 3;
-ms-grid-row-span: 2;
grid-row: 3/5
}
.socialB .feedContain .news-item:hover .overlay,
.socialB .innerPostContain .news-item:hover .overlay {
top: 0;
transition: all .22s ease-in-out
}
.socialB .feedContain .news-item .overlay,
.socialB .innerPostContain .news-item .overlay {
align-items: center;
background-color: rgba(35, 31, 32, .7);
display: flex;
flex-wrap: wrap;
height: 100%;
justify-content: center;
left: 0;
position: absolute;
right: 0;
top: 100%;
transition: all .22s ease-in-out;
width: 100%
}
.socialB .feedContain .news-item .overlay .content,
.socialB .innerPostContain .news-item .overlay .content {
color: #fbfbfa;
padding: 15px;
text-align: center
}
.socialB .feedContain .news-item .overlay .content h3,
.socialB .innerPostContain .news-item .overlay .content h3 {
line-height: 1.4
}
.socialB .loadButtonContain {
font-family: BronxShoesRegular;
font-size: 42px;
text-align: center
}
.socialB .loadButtonContain a {
background-color: red;
color: #fff;
display: block;
padding: 20px 0 8px;
text-decoration: none
}
.socialC {
-ms-grid-columns: 1fr 1fr;
background-position: 60% 50%;
background-repeat: no-repeat;
background-size: cover;
display: -ms-grid;
display: grid;
grid-template-columns: 1fr 1fr;
min-height: 80vh
}
.socialC .left {
align-items: flex-end;
color: #fbfbfa;
display: flex;
flex-wrap: wrap;
font-family: BronxShoesRegular;
padding: 0 0 25% 20%
}
.socialC .left h2 {
font-size: calc(-60px + 15.625vw);
font-weight: 500;
margin-bottom: 10px;
text-shadow: -6px 8px 10px rgba(0, 0, 0, .76);
word-spacing: -5px
}
.socialD {
display: flex;
min-height: 60vh;
overflow: hidden;
padding-top: 20px;
position: relative
}
.socialD .owl-slider {
position: relative
}
.socialD .owl-slider,
.socialD .owl-slider .owl-stage,
.socialD .owl-slider .owl-stage .owl-item {
display: flex;
height: 60vh;
min-height: 540px;
width: 100%
}
.socialD .owl-slider .owl-stage .owl-item .slide {
align-items: center;
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: cover;
display: flex;
flex-wrap: wrap;
height: 60vh;
justify-content: center;
min-height: 540px;
text-align: center;
width: 100%
}
.socialD .owl-slider .owl-stage .owl-item .slide a.cover {
align-items: center;
display: flex;
flex-wrap: wrap;
justify-content: center;
min-height: 100%;
width: 100%
}
.socialD .owl-slider .owl-stage .owl-item .slide h2 {
color: #fff;
font-family: BronxShoesRegular;
font-size: calc(-50px + 15.625vw);
font-weight: 500;
margin: 0 0 20px;
text-shadow: -6px 8px 10px rgba(0, 0, 0, .76);
word-spacing: -5px
}
.socialD .owl-slider .owl-nav.disabled {
display: none
}
.socialD .owl-slider .owl-dots {
bottom: 20px;
position: absolute;
text-align: center;
width: 100%
}
.socialD .owl-slider .owl-dots .owl-dot {
background: transparent;
border: none;
height: 20px;
margin: 0 5px;
padding: 0;
width: 20px
}
.socialD .owl-slider .owl-dots .owl-dot span {
background-color: #fff;
border: 1px solid #231f20;
border-radius: 50%;
display: block;
height: 20px;
width: 20px
}
.socialD .owl-slider .owl-dots .owl-dot.active span {
background-color: #818285
}
.socialD .owl-slider .owl-dots.disabled {
display: none
}
.page-template-template-social footer.mainFooter {
margin-top: -5px
}
.wnA {
overflow: hidden;
position: relative
}
.wnA,
.wnA .wnSlider1,
.wnA .wnSlider1 .owl-stage,
.wnA .wnSlider1 .owl-stage .owl-item {
display: flex;
min-height: 600px;
width: 100%
}
.wnA .wnSlider1 .owl-stage .owl-item .slide-item {
align-items: center;
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: cover;
display: flex;
flex-wrap: wrap;
justify-content: center;
min-height: 600px;
padding: 0 20px;
text-align: center;
width: 100%
}
.wnA .wnSlider1 .owl-stage .owl-item .slide-item a.cover {
align-items: center;
display: flex;
flex-wrap: wrap;
justify-content: center;
min-height: 100%;
width: 100%
}
.wnA .wnSlider1 .owl-stage .owl-item .slide-item h2 {
color: #fff;
font-family: BronxShoesRegular;
font-size: calc(-15px + 9.76563vw);
font-weight: 500;
margin: 0 0 20px;
text-shadow: -6px 8px 10px rgba(0, 0, 0, .76);
word-spacing: -5px
}
.wnA .wnSlider1 .owl-nav.disabled {
display: none
}
.wnA .wnSlider1 .owl-dots {
bottom: 20px;
position: absolute;
text-align: center;
width: 100%;
z-index: 1
}
.wnA .wnSlider1 .owl-dots .owl-dot {
background: transparent;
border: none;
height: 20px;
margin: 0 5px;
padding: 0;
width: 20px
}
.wnA .wnSlider1 .owl-dots .owl-dot span {
background-color: #fff;
border: 1px solid #231f20;
border-radius: 50%;
display: block;
height: 20px;
width: 20px
}
.wnA .wnSlider1 .owl-dots .owl-dot.active span {
background-color: #818285
}
.wnA .wnSlider1 .owl-dots.disabled {
display: none
}
.wnB,
.wnC {
overflow: hidden;
padding-bottom: 20px
}
.wnB .headlineWrap,
.wnC .headlineWrap {
color: red;
padding: 80px 20px 40px;
text-align: center
}
.wnB .headlineWrap h2,
.wnC .headlineWrap h2 {
font-family: BronxShoesRegular;
font-size: calc(-19.41176px + 13.23529vw);
font-weight: 500;
margin: 0;
word-spacing: -5px
}
.wnB .headlineWrap p,
.wnC .headlineWrap p {
color: #191918;
font-size: 22px;
line-height: 1.4;
margin: 0;
padding: 0 25%
}
.wnB .wnSlider2,
.wnB .wnSlider3,
.wnC .wnSlider2,
.wnC .wnSlider3 {
display: flex;
height: 440px;
margin: auto;
overflow: hidden;
position: relative;
width: calc(100% - 40px)
}
.wnB .wnSlider2 .owl-stage-outer,
.wnB .wnSlider3 .owl-stage-outer,
.wnC .wnSlider2 .owl-stage-outer,
.wnC .wnSlider3 .owl-stage-outer {
max-height: 400px
}
.wnB .wnSlider2 .owl-stage-outer .owl-stage,
.wnB .wnSlider3 .owl-stage-outer .owl-stage,
.wnC .wnSlider2 .owl-stage-outer .owl-stage,
.wnC .wnSlider3 .owl-stage-outer .owl-stage {
display: flex;
min-height: 400px;
width: 100%
}
.wnB .wnSlider2 .owl-stage-outer .owl-stage .news-item,
.wnB .wnSlider3 .owl-stage-outer .owl-stage .news-item,
.wnC .wnSlider2 .owl-stage-outer .owl-stage .news-item,
.wnC .wnSlider3 .owl-stage-outer .owl-stage .news-item {
background-position: 50% 50%;
background-size: cover;
display: flex;
min-height: 400px;
overflow: hidden;
position: relative;
width: 100%
}
.wnB .wnSlider2 .owl-stage-outer .owl-stage .news-item:hover .newsOverlay,
.wnB .wnSlider3 .owl-stage-outer .owl-stage .news-item:hover .newsOverlay,
.wnC .wnSlider2 .owl-stage-outer .owl-stage .news-item:hover .newsOverlay,
.wnC .wnSlider3 .owl-stage-outer .owl-stage .news-item:hover .newsOverlay {
top: 0;
transition: all .2s ease-in-out
}
.wnB .wnSlider2 .owl-stage-outer .owl-stage .news-item .newsOverlay,
.wnB .wnSlider3 .owl-stage-outer .owl-stage .news-item .newsOverlay,
.wnC .wnSlider2 .owl-stage-outer .owl-stage .news-item .newsOverlay,
.wnC .wnSlider3 .owl-stage-outer .owl-stage .news-item .newsOverlay {
align-items: center;
background-color: rgba(35, 31, 32, .7);
color: #fff;
display: flex;
height: 100%;
justify-content: center;
left: 0;
position: absolute;
right: 0;
text-align: center;
top: 100%;
transition: all .2s ease-in-out;
width: 100%
}
.wnB .wnSlider2 .owl-nav.disabled,
.wnB .wnSlider3 .owl-nav.disabled,
.wnC .wnSlider2 .owl-nav.disabled,
.wnC .wnSlider3 .owl-nav.disabled {
display: none
}
.wnB .wnSlider2 .owl-dots,
.wnB .wnSlider3 .owl-dots,
.wnC .wnSlider2 .owl-dots,
.wnC .wnSlider3 .owl-dots {
bottom: -20px;
padding: 20px 0;
position: absolute;
text-align: center;
width: 100%;
z-index: 10
}
.wnB .wnSlider2 .owl-dots .owl-dot,
.wnB .wnSlider3 .owl-dots .owl-dot,
.wnC .wnSlider2 .owl-dots .owl-dot,
.wnC .wnSlider3 .owl-dots .owl-dot {
background: transparent;
border: none;
height: 20px;
margin: 0 5px;
padding: 0;
width: 20px
}
.wnB .wnSlider2 .owl-dots .owl-dot span,
.wnB .wnSlider3 .owl-dots .owl-dot span,
.wnC .wnSlider2 .owl-dots .owl-dot span,
.wnC .wnSlider3 .owl-dots .owl-dot span {
background-color: #fff;
border: 1px solid #231f20;
border-radius: 50%;
display: block;
height: 20px;
width: 20px
}
.wnB .wnSlider2 .owl-dots .owl-dot.active span,
.wnB .wnSlider3 .owl-dots .owl-dot.active span,
.wnC .wnSlider2 .owl-dots .owl-dot.active span,
.wnC .wnSlider3 .owl-dots .owl-dot.active span {
background-color: #818285
}
.wnB .wnSlider2 .owl-dots.disabled,
.wnB .wnSlider3 .owl-dots.disabled,
.wnC .wnSlider2 .owl-dots.disabled,
.wnC .wnSlider3 .owl-dots.disabled {
display: none
}
.wnC .headlineWrap {
padding-top: 40px
}
.msA {
overflow: hidden
}
.msA,
.msA .msSliderA {
display: flex;
height: 60vh;
min-height: 600px;
width: 100%
}
.msA .msSliderA {
position: relative
}
.msA .msSliderA .owl-stage,
.msA .msSliderA .owl-stage .owl-item {
display: flex;
height: 60vh;
min-height: 540px;
width: 100%
}
.msA .msSliderA .owl-stage .owl-item .msVideoContain {
align-items: center;
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: cover;
display: flex;
flex-wrap: wrap;
height: 60vh;
justify-content: center;
min-height: 600px;
text-align: center;
width: 100%
}
.msA .msSliderA .owl-nav.disabled {
display: none
}
.msA .msSliderA .owl-dots {
bottom: 20px;
position: absolute;
text-align: center;
width: 100%;
z-index: 1
}
.msA .msSliderA .owl-dots .owl-dot {
background: transparent;
border: none;
height: 20px;
margin: 0 5px;
padding: 0;
width: 20px
}
.msA .msSliderA .owl-dots .owl-dot span {
background-color: #fff;
border: 1px solid #231f20;
border-radius: 50%;
display: block;
height: 20px;
width: 20px
}
.msA .msSliderA .owl-dots .owl-dot.active span {
background-color: #818285
}
.msA .msSliderA .owl-dots.disabled {
display: none
}
.msB {
overflow: hidden
}
.msB,
.msB .msSliderB {
display: flex;
height: 60vh;
min-height: 540px;
width: 100%
}
.msB .msSliderB {
position: relative
}
.msB .msSliderB .owl-stage,
.msB .msSliderB .owl-stage .owl-item,
.msB .msSliderB .owl-stage .owl-item .slideContent {
display: flex;
height: 60vh;
min-height: 540px;
width: 100%
}
.msB .msSliderB .owl-stage .owl-item .slideContent {
align-items: center;
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: cover;
flex-wrap: wrap;
justify-content: center;
text-align: center
}
.msB .msSliderB .owl-stage .owl-item .slideContent .left,
.msB .msSliderB .owl-stage .owl-item .slideContent .right {
display: flex;
min-height: 100%
}
.msB .msSliderB .owl-stage .owl-item .slideContent .left {
align-items: flex-end;
justify-content: flex-start;
width: 50%
}
.msB .msSliderB .owl-stage .owl-item .slideContent .left .content {
max-width: 150px;
padding: 0 0 20px 20px
}
.msB .msSliderB .owl-stage .owl-item .slideContent .right {
align-items: flex-start;
align-items: center;
background-color: rgba(0, 0, 0, .6);
color: #fff;
justify-content: flex-start;
width: 50%
}
.msB .msSliderB .owl-stage .owl-item .slideContent .right .content {
padding: 0 15% 4% 5%
}
.msB .msSliderB .owl-stage .owl-item .slideContent .right .content .btn {
font-size: 22px;
margin-bottom: 10px;
margin-right: 5px;
padding: 7px 25px
}
.msB .msSliderB .owl-stage .owl-item .slideContent .right .content h2 {
font-size: calc(-10px + 7.8125vw);
font-weight: 500;
margin: 8% 0 20px;
word-spacing: -5px
}
.msB .msSliderB .owl-stage .owl-item .slideContent .right .content p {
font-size: calc(2.5px + 1.75781vw);
margin: 10px 0 40px
}
.msB .msSliderB .owl-dots,
.msB .msSliderB .owl-nav {
display: none
}
.msC {
display: flex;
flex-wrap: wrap;
padding: 60px 0 40px
}
.msC .content {
width: 100%
}
.msC .content h2 {
color: red;
font-size: calc(-37.5px + 18.55469vw);
font-weight: 500;
margin: 20px 0;
text-align: center;
word-spacing: -5px
}
.msC .content p {
color: #31312f;
font-size: 22px;
margin-top: 10px;
padding: 0 15%
}
.msC .slideContain {
display: flex;
margin: auto;
overflow: hidden;
padding: 40px 0 20px;
width: 75%
}
.msC .slideContain .iconSlider {
width: 100%
}
.msC .slideContain .iconSlider .owl-stage {
display: flex;
min-height: 100%;
width: 100%
}
.msC .slideContain .iconSlider .owl-stage .owl-item {
align-items: center;
display: flex;
justify-content: center;
min-height: 100%;
text-align: center;
width: 100%
}
.msC .slideContain .iconSlider .owl-nav {
display: none
}
.msC .slideContain .iconSlider .owl-dots {
padding-top: 40px;
text-align: center
}
.msC .slideContain .iconSlider .owl-dots .owl-dot {
height: 20px;
margin: 0 5px;
padding: 0;
width: 20px
}
.msC .slideContain .iconSlider .owl-dots .owl-dot span {
border: 1px solid #231f20;
border-radius: 50%;
display: block;
height: 20px;
width: 20px
}
.msC .slideContain .iconSlider .owl-dots .owl-dot.active span {
background-color: #818285
}
.msC .slideContain .iconSlider .owl-dots.disabled {
display: none
}
.msC .slideContain .iconSlider button {
border: none
}
.singleFlavorA {
background-attachment: fixed;
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: cover;
min-height: 80vh;
position: relative
}
.singleFlavorB {
display: flex;
flex-wrap: wrap;
min-height: 60vh
}
.singleFlavorB .left {
display: flex;
flex-wrap: wrap;
padding-bottom: 20px;
position: relative;
width: 50%
}
.singleFlavorB .left .mobileHeadline {
display: none;
margin: auto;
position: relative;
text-align: center;
width: 85%
}
.singleFlavorB .left .mobileHeadline:after {
bottom: -5px;
content: "";
height: 7px;
left: 0;
position: absolute;
width: 100%
}
.singleFlavorB .left .mobileHeadline h1 {
display: block;
font-family: BronxShoesRegular;
font-size: calc(-15px + 9.76563vw);
font-weight: 500;
margin: 0;
position: relative;
word-spacing: -5px
}
.singleFlavorB .left .backContain {
left: 0;
max-width: 200px;
position: absolute;
top: 0;
z-index: 1
}
.singleFlavorB .left .singleSlider {
overflow: hidden;
width: 100%
}
.singleFlavorB .left .singleSlider .owl-stage-outer {
width: 100%
}
.singleFlavorB .left .singleSlider .owl-stage-outer .owl-stage {
display: flex
}
.singleFlavorB .left .singleSlider .owl-stage-outer .owl-stage .singleImage {
max-height: 650px;
text-align: center
}
.singleFlavorB .left .singleSlider .owl-nav {
display: none
}
.singleFlavorB .left .singleSlider .owl-dots {
text-align: center
}
.singleFlavorB .left .singleSlider .owl-dots button {
border: none
}
.singleFlavorB .left .singleSlider .owl-dots .owl-dot {
height: 20px;
margin: 0 5px;
width: 20px
}
.singleFlavorB .left .singleSlider .owl-dots .owl-dot span {
border: 1px solid #231f20;
border-radius: 50%;
display: block;
height: 20px;
width: 20px
}
.singleFlavorB .left .singleSlider .owl-dots .owl-dot.active span {
background-color: #818285
}
.singleFlavorB .right {
overflow: hidden;
width: 50%
}
.singleFlavorB .right .content {
padding: 40px 20px
}
.singleFlavorB .right .content .headline {
display: flex;
width: 100%
}
.singleFlavorB .right .content .headline h1 {
display: block;
font-family: BronxShoesRegular;
font-size: calc(-15px + 9.76563vw);
font-weight: 500;
margin: 0;
position: relative;
word-spacing: -5px
}
.singleFlavorB .right .content .headline h1:after {
bottom: 17px;
content: "";
height: 7px;
left: -2px;
position: absolute;
width: 105%
}
.singleFlavorB .right .content .splitContent {
display: flex
}
.singleFlavorB .right .content .splitContent .nutrition {
margin-right: 20px;
min-width: 150px;
width: 15%
}
.singleFlavorB .right .content .splitContent .nutrition .content {
padding: 0
}
.singleFlavorB .right .content .splitContent .nutrition .mobileSpace {
display: none;
margin: -5px 8px 0;
min-height: 100%;
width: 5px
}
.singleFlavorB .right .content .splitContent .nutrition .calories {
padding-bottom: 12px
}
.singleFlavorB .right .content .splitContent .nutrition .calories h3 {
display: block;
font-family: BronxShoesRegular;
font-size: 30px;
line-height: .8;
position: relative;
width: 100%
}
.singleFlavorB .right .content .splitContent .nutrition .calories h3:after {
bottom: -12px;
content: "";
height: 7px;
left: -5px;
position: absolute;
width: 100%
}
.singleFlavorB .right .content .splitContent .nutrition .calories h3 span {
font-family: BronxShoesRegular;
font-size: 80px
}
.singleFlavorB .right .content .splitContent .nutrition .energy {
margin-top: -55px;
padding-bottom: 12px
}
.singleFlavorB .right .content .splitContent .nutrition .energy h3 {
display: block;
font-family: BronxShoesRegular;
font-size: 60px;
line-height: .8;
position: relative;
width: 100%
}
.singleFlavorB .right .content .splitContent .nutrition .energy h3:after {
bottom: -12px;
content: "";
height: 7px;
left: -5px;
position: absolute;
width: 100%
}
.singleFlavorB .right .content .splitContent .nutrition .energy h3 span {
font-family: BronxShoesRegular;
font-size: 80px
}
.singleFlavorB .right .content .splitContent .nutrition .carbs {
margin-top: -75px;
padding-bottom: 12px
}
.singleFlavorB .right .content .splitContent .nutrition .carbs h3 {
font-family: BronxShoesRegular;
font-size: 50px;
line-height: .8
}
.singleFlavorB .right .content .splitContent .nutrition .carbs h3 span {
font-family: BronxShoesRegular;
font-size: 80px
}
.singleFlavorB .right .content .splitContent .copy {
color: #191918;
padding-right: 45%
}
.singleFlavorB .right .content .splitContent .copy p {
font-size: 18px;
line-height: 1.4
}
.singleFlavorB .right .content .splitContent .copy .btn-contain .btn {
margin-top: 20px
}
.singleFlavorB .right .content .splitContent .copy .btn-contain .values {
font-size: 13px
}
.singleFlavorB .mobileBtnContain {
display: none
}
.singleFlavorC {
border-top: 7px solid red;
min-height: 60vh;
padding-top: 60px
}
.singleFlavorC .headline {
color: red;
text-align: center
}
.singleFlavorC .headline h2 {
font-size: calc(22.5px + 10.74219vw);
font-weight: 500;
margin: 0;
word-spacing: -5px
}
.singleFlavorC .socialFeed {
-ms-grid-columns: (minmax(1px, 1fr))[4];
display: -ms-grid;
display: grid;
grid-column-gap: 20px;
grid-template-columns: repeat(4, minmax(1px, 1fr));
padding: 0 20px 20px;
width: 100%
}
.singleFlavorC .socialFeed .FlavorNewsitem {
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: cover;
min-height: 400px;
overflow: hidden;
position: relative
}
.singleFlavorC .socialFeed .FlavorNewsitem:hover .newsOverlay {
top: 0;
transition: all .22s ease-in-out
}
.singleFlavorC .socialFeed .FlavorNewsitem .newsOverlay {
align-items: center;
background-color: rgba(35, 31, 32, .7);
color: #fff;
display: flex;
flex-wrap: wrap;
justify-content: center;
left: 0;
min-height: 100%;
padding: 0 20px;
position: absolute;
right: 0;
text-align: center;
top: 100%;
transition: all .22s ease-in-out;
width: 100%
}
.postContent {
-ms-grid-columns: (minmax(min-content, 1fr))[2];
border-top: 7px solid red;
display: -ms-grid;
display: grid;
grid-template-columns: repeat(2, minmax(-webkit-min-content, 1fr));
grid-template-columns: repeat(2, minmax(min-content, 1fr));
margin-top: 90px;
min-height: 80vh
}
.postContent .left {
-ms-grid-column: 1;
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: cover;
grid-column: 1;
position: relative
}
.postContent .left .backContain {
left: 0;
position: absolute;
top: 0
}
.postContent .right {
-ms-grid-column: 2;
grid-column: 2;
max-height: 80vh;
overflow-x: hidden;
overflow-y: auto;
padding: 60px 60px 60px 40px;
position: relative
}
.postContent .right .content h1 {
color: red;
font-size: calc(-17.5px + 10.74219vw);
margin: 0;
word-spacing: -5px
}
.postContent .right .content p.date {
font-size: calc(5px + 1.95313vw);
font-weight: 700;
margin-top: -2px;
word-spacing: -5px
}
.postContent .right .content .entry-content p {
font-size: 22px;
line-height: 1.4
}
.postContent .right .content .entry-content h2,
.postContent .right .content .entry-content h3 {
font-size: 32px
}
.postContent .right .content .entry-content h4 {
font-size: 26px
}
.postContent .right .newsScrollDown {
bottom: 0;
left: 100%;
position: -webkit-sticky;
position: sticky;
width: 40px
}
.postContent .right .newsScrollDown img {
position: absolute;
right: -40px
}
.contactA {
margin-top: 90px;
padding: 0 20px 20px;
text-align: center
}
.contactA h1 {
color: red;
font-size: calc(-40px + 15.625vw);
font-weight: 500;
margin: 0;
word-spacing: -5px
}
.contactA p {
font-size: 20px;
margin: 0 0 10px
}
.contactA p.parent {
font-weight: 700
}
.contactA .social {
padding-top: 15px
}
.contactA .social ul {
display: flex;
justify-content: center;
list-style: none;
padding: 0;
text-align: center
}
.contactA .social ul li {
margin: 0 3px
}
.contactA .social ul li a {
align-items: center;
background-color: #231f20;
border-radius: 50%;
color: #fff;
display: flex;
font-size: 25px;
height: 45px;
justify-content: center;
line-height: 20px;
text-align: center;
text-decoration: none;
transition: all .2s linear;
width: 45px
}
.contactA .social ul li a:hover {
background-color: red;
transition: all .2s linear
}
.contactA .distributor {
padding: 20px 0
}
.contactB {
background-color: #e6e6e6;
padding: 0 20px
}
.contactB,
.contactB .contactForm {
align-items: center;
display: flex;
justify-content: center
}
.contactB .contactForm {
max-width: 1200px;
width: 100%
}
.contactB .contactForm iframe {
min-height: 500px
}
.contactC {
align-items: center;
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: cover;
display: flex;
justify-content: center;
min-height: 80vh;
padding: 20px
}
.contactC .headline {
color: #fff;
text-align: center
}
.contactC .headline h2 {
font-size: calc(-80px + 19.53125vw);
font-weight: 500;
margin: 0;
text-shadow: -6px 8px 10px rgba(0, 0, 0, .76);
word-spacing: -5px
}
.contactC .buttons {
display: flex;
flex-wrap: wrap;
justify-content: space-evenly;
padding-top: 20px;
text-align: center
}
.contactC .buttons a.btn {
margin: 0 5px 10px
}
.eventA {
align-items: center;
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: cover;
display: flex;
justify-content: center;
min-height: 60vh
}
.eventA .content h1 {
color: #fff;
font-size: calc(-22.5px + 12.69531vw);
margin: 0;
text-shadow: -6px 8px 10px rgba(0, 0, 0, .76);
word-spacing: -5px
}
.eventB {
-ms-grid-columns: 200px 1fr;
display: -ms-grid;
display: grid;
grid-template-columns: 200px 1fr
}
.eventB .left {
-ms-grid-column: 1;
grid-column: 1
}
.eventB .right {
-ms-grid-column: 2;
grid-column: 2;
padding: 30px 40px 40px 60px
}
.eventB .right .content h2 {
color: red;
font-family: BronxShoesRegular;
font-size: calc(-27.5px + 8.78906vw);
word-spacing: -5px
}
.eventB .right .content h2.subHeadline {
margin: 0
}
.eventB .right .content p.date {
font-size: 25px;
font-weight: 700;
margin-top: 10px
}
.eventB .right .content .entry-content {
font-size: 20px
}
.eventB .right .content .dateGridHeadline {
display: flex;
padding: 20px 0
}
.eventB .right .content .dateGridHeadline h2 {
color: red;
font-family: BronxShoesRegular;
font-size: calc(-27.5px + 8.78906vw);
margin: 0;
word-spacing: -5px
}
.eventB .right .content .dateGridContain {
display: flex;
flex-wrap: wrap;
width: 100%
}
.eventB .right .content .dateGridContain .eventLocationTile {
align-items: center;
display: flex;
height: 1px;
margin: 0 10px 20px 0;
min-height: 150px;
width: calc(33.333% - 10px)
}
.eventB .right .content .dateGridContain .eventLocationTile:nth-child(3n) {
margin-right: 0
}
.eventB .right .content .dateGridContain .eventLocationTile .content .headline h3 {
font-size: 35px;
margin: 0
}
.eventB .right .content .dateGridContain .eventLocationTile .content ul {
list-style: none;
margin: 0;
padding: 5px 0 20px
}
.eventB .right .content .dateGridContain .eventLocationTile .content ul li {
padding: 5px 0
}
.findRipItA {
border-top: 7px solid red;
margin-top: 90px
}
.findRipItA .wpsl-store-right {
-ms-grid-columns: 2fr 1fr;
display: -ms-grid;
display: grid;
grid-template-columns: 2fr 1fr;
min-height: 50vh
}
.findRipItA .wpsl-store-right #wpsl-gmap {
height: inherit !important;
width: inherit !important
}
.findRipItA .wpsl-store-right #wpsl-result-list {
margin: 0 !important;
width: inherit !important
}
.findRipItA .wpsl-store-right #wpsl-result-list ul {
padding-left: 12px
}
.findRipItA .wpsl-store-right #wpsl-result-list ul li {
color: #fff
}
.findRipItA .wpsl-store-right #wpsl-result-list #wpsl-stores {
background: red url(//www.ripitenergy.com/wp-content/themes/RipIt/images/list-BG.jpg);
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: cover;
display: block;
height: 100% !important;
max-height: 100%;
overflow-y: auto;
padding: 40px 10px 0 20px
}
.findRipItA .wpsl-store-right #wpsl-result-list #wpsl-stores .titles-contain {
display: block;
width: inherit !important
}
.findRipItA .wpsl-store-right #wpsl-result-list #wpsl-stores .titles-contain .title-contain {
padding: 0;
text-align: left
}
.findRipItA .wpsl-store-right #wpsl-result-list #wpsl-stores .titles-contain .title-contain h2 {
color: #fff;
font-size: calc(-15px + 9.76563vw);
font-weight: 500;
line-height: .9;
margin: 0
}
.findRipItA .wpsl-store-right #wpsl-result-list #wpsl-stores .titles-contain .title-contain h2 span {
font-size: calc(40px + 7.8125vw)
}
.findRipItA .wpsl-store-right #wpsl-result-list #wpsl-stores .wpsl-search {
display: block;
margin-top: -20px
}
.findRipItA .wpsl-store-right #wpsl-result-list #wpsl-stores .wpsl-search #wpsl-search-btn {
background-color: #231f20
}
.findRipItB {
align-items: center;
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: cover;
display: flex;
justify-content: center;
min-height: 50vh
}
.findRipItB .content a {
color: #fff;
text-decoration: none
}
.findRipItB .content h2 {
font-size: calc(-30px + 11.71875vw);
font-weight: 500;
margin-bottom: 40px;
text-shadow: -6px 8px 10px rgba(0, 0, 0, .76);
word-spacing: -5px
}
#findRipItC {
background-color: #e6e6e6;
min-height: 600px;
padding: 40px 20px
}
#findRipItC .buttonGroup {
display: flex;
justify-content: center;
text-align: center
}
#findRipItC .forms {
align-items: center;
display: flex;
justify-content: center;
margin: auto;
max-width: 800px;
width: 100%
}
#findRipItC .forms #foundForm,
#findRipItC .forms #requestForm {
display: none;
opacity: 0;
transition: all .2s linear
}
#findRipItC .forms #foundForm div.ginput_container,
#findRipItC .forms #requestForm div.ginput_container {
margin: 0
}
#findRipItC .forms #foundForm .gform_wrapper ul li.gfield,
#findRipItC .forms #requestForm .gform_wrapper ul li.gfield {
margin: 0 0 15px;
padding: 0
}
#findRipItC .forms #foundForm .ginput_container input,
#findRipItC .forms #requestForm .ginput_container input {
color: #555;
font-size: 14px;
height: 34px;
padding: 7px 4px !important
}
#findRipItC .forms #foundForm .gform_wrapper .gform_footer,
#findRipItC .forms #requestForm .gform_wrapper .gform_footer {
margin: 0 !important;
padding: 0 !important
}
#findRipItC .forms #foundForm .gform_wrapper .gform_footer .btn,
#findRipItC .forms #requestForm .gform_wrapper .gform_footer .btn {
line-height: 1.42857143
}
#findRipItC .forms #foundForm.active,
#findRipItC .forms #requestForm.active {
display: flex;
flex-wrap: wrap;
opacity: 1;
transition: all .2s linear;
width: 100%
}
#findRipItC .forms #foundForm.active .headline,
#findRipItC .forms #requestForm.active .headline {
padding-top: 40px;
text-align: center;
width: 100%
}
#findRipItC .forms #foundForm.active .headline h2,
#findRipItC .forms #requestForm.active .headline h2 {
color: red;
font-family: BronxShoesRegular;
font-size: calc(-5.29412px + 5.88235vw);
font-weight: 500;
margin: 0;
word-spacing: -5px
}
#findRipItC .forms #foundForm.active .formContain,
#findRipItC .forms #requestForm.active .formContain {
width: 100%
}
#findRipItC .forms #foundForm.active .formContain input[type=text],
#findRipItC .forms #requestForm.active .formContain input[type=text] {
width: 100% !important
}
.findRipItD .headline {
border-bottom: 7px solid red;
color: red;
padding: 80px 20px 20px;
text-align: center
}
.findRipItD .headline h2 {
font-size: calc(-35px + 17.57813vw);
font-weight: 500;
margin: 0;
word-spacing: -5px
}
.findRipItD .headline p {
font-family: BronxShoesRegular;
font-size: calc(-20.5px + 6.83594vw);
margin: 0;
word-spacing: -5px
}
.findMapContain {
border-bottom: 7px solid red;
height: 500px
}
.findMapContain iframe {
height: 500px
}
.findRipItE {
display: none;
padding: 40px 0
}
.findRipItE .partnerSlideContain {
overflow: hidden
}
.findRipItE .partnerSlideContain .owl-stage {
display: flex
}
.findRipItE .partnerSlideContain .owl-stage .owl-item {
align-items: center;
display: flex;
justify-content: center;
text-align: center
}
.findRipItE .partnerSlideContain .owl-nav {
display: none
}
.findRipItE .partnerSlideContain .owl-dots {
padding-top: 40px;
text-align: center
}
.findRipItE .partnerSlideContain .owl-dots .owl-dot {
height: 20px;
margin: 0 5px;
padding: 0;
width: 20px
}
.findRipItE .partnerSlideContain .owl-dots .owl-dot span {
border: 1px solid #231f20;
border-radius: 50%;
display: block;
height: 20px;
width: 20px
}
.findRipItE .partnerSlideContain .owl-dots .owl-dot.active span {
background-color: #818285
}
.findRipItE .partnerSlideContain .owl-dots.disabled {
display: none
}
.findRipItE .partnerSlideContain button {
border: none
}
.notFound {
background-image: url(//www.ripitenergy.com/wp-content/themes/RipIt/images/404-bg.jpg);
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: cover;
margin-top: 90px;
min-height: calc(100vh - 299px)
}
.notFound h2 {
color: red;
font-family: BronxShoesRegular;
font-size: calc(-5.29412px + 5.88235vw);
font-weight: 500;
margin: 0;
word-spacing: -5px
}
.notFound .content {
-ms-grid-columns: 1fr 1fr;
display: -ms-grid;
display: grid;
grid-template-columns: 1fr 1fr
}
.notFound .content .right {
padding: 15% 0 0 5%
}
.notFound .content .right p {
font-size: 20px;
line-height: 1.3;
padding-right: 40%
}
.generalContent {
margin: 167px auto 20px;
max-width: 1200px;
min-height: calc(100vh - 167px);
padding: 20px
}
.thanksContent {
margin-top: 90px;
min-height: calc(100vh - 299px);
padding: 13% 20px 0;
text-align: center
}
.thanksContent h1 {
color: red;
font-family: BronxShoesRegular;
font-size: calc(-5.29412px + 5.88235vw);
font-weight: 500;
margin: 0;
word-spacing: -5px
}
.thanksContent p {
font-size: 20px;
line-height: 1.4;
padding: 0 13%
}
.riderA {
align-items: center;
display: flex;
flex-wrap: wrap;
justify-content: center;
margin-top: 90px;
min-height: 40vh;
padding: 0 20px;
text-align: center
}
.riderA .content h1 {
color: red;
font-size: calc(-75px + 17.57813vw);
font-weight: 500;
margin: 0;
word-spacing: -5px
}
.riderA .content p {
font-size: 20px;
line-height: 1.4;
margin-top: 5px;
padding: 0 23%
}
.riderB {
-ms-grid-columns: (1fr)[2];
-ms-grid-rows: auto;
background-color: #e6e6e6;
display: -ms-grid;
display: grid;
grid-template-columns: repeat(2, 1fr);
grid-template-rows: auto;
min-height: 50vh;
padding: 50px 0
}
.riderB .left {
display: flex;
justify-content: flex-end;
padding: 0 10% 0 20px
}
.riderB .left .content h2 {
color: red;
font-size: calc(7.5px + 4.88281vw);
font-weight: 500;
margin: 0 0 10px;
word-spacing: -5px
}
.riderB .left .content ul {
list-style: none;
margin: 0;
padding: 0
}
.riderB .left .content ul li {
font-size: 22px;
line-height: 1;
margin-bottom: 20px;
padding: 0 0 0 25px;
position: relative
}
.riderB .left .content ul li:before {
background-image: url(//www.ripitenergy.com/wp-content/themes/RipIt/images/bullet_arrow.png);
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: cover;
content: "";
height: 15px;
left: 0;
position: absolute;
top: 2px;
width: 17px
}
.riderB .right {
display: flex
}
.riderB .right .content {
width: 100%
}
.riderB .right .content .ginput_container {
display: flex
}
.riderB .right .content .ginput_container input {
width: 80%
}
.riderB .right .content .clear-multi {
justify-content: space-between;
width: 80%
}
.riderB .right .content .clear-multi .ginput_container_date {
margin: 0;
width: calc(33.333% - .5rem)
}
.riderB .right .content .clear-multi .ginput_container_date select {
width: 100%
}
.riderB .right .content .interestHeadline h3 {
color: red;
font-size: calc(-30px + 7.8125vw);
font-weight: 500;
margin: 40px 0 0;
word-spacing: -5px
}
.riderB .right .content .gfield_checkbox {
-ms-grid-columns: (1fr)[3];
-ms-grid-rows: auto;
display: -ms-grid;
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: auto;
width: 100%
}
.riderB .right .content .gfield_checkbox li {
display: block;
list-style: none;
padding: 7px 7px 7px 40px !important;
position: relative
}
.riderB .right .content .gfield_checkbox li label:after {
background: #fff;
border: 3px solid red;
border-radius: 3px;
content: "";
display: block;
height: 27px;
left: 0;
position: absolute;
top: 0;
width: 27px;
z-index: 0
}
.riderB .right .content .gfield_checkbox li label:before {
border: solid red;
border-width: 0 3px 3px 0;
content: "";
display: block;
height: 15px;
left: 9px;
opacity: 0;
position: absolute;
top: 4px;
transform: rotate(45deg);
transition: all .1s;
width: 6px;
z-index: 1
}
.riderB .right .content input[type=checkbox] {
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
cursor: pointer;
height: 27px;
left: 0;
opacity: 0;
outline: none;
position: absolute;
top: 0;
width: 27px;
z-index: 100
}
.riderB .right .content input[type=checkbox]+label {
cursor: pointer
}
.riderB .right .content input[type=checkbox]:checked+label:before {
opacity: 1;
top: 3px
}
.riderB .right .content .gform_wrapper .gform_footer {
justify-content: flex-end;
padding-right: 0 !important;
width: 80%
}
.riderC {
align-items: center;
display: flex;
justify-content: center;
padding: 60px 20px 40px;
text-align: center
}
.riderC .content h2 {
color: red;
font-size: calc(7.5px + 4.88281vw);
font-weight: 500;
margin: 0;
word-spacing: -5px
}
.riderC .content p {
font-size: 20px
}
.vet_top_section {
margin-top: 90px;
min-height: 40vh;
padding: 0 20px;
}
.vet_top_section, .vet_middle_section, .vet_middle_video_section {text-align: center;}
.vet_top_section h1, .vet_middle_section h1, .vet_middle_section h2,.vet_bottom_section h2, .vet_bottom_section h3, .vet_middle_sectio p, .vet_bottom_section p, .vet_middle_video_section h1 {font-family: Arial, Helvetica Neue, Helvetica, sans-serif; color:#5e7360;}
.vet_top_section h1, .vet_middle_section h1, .vet_middle_video_section h1 {font-size: 65px; font-weight: bold; margin-bottom:0px;}
.vet_top_section p {color:#000; font-size:22px; line-height: 1.8;}
.bottom_copy_image { margin: 60px 0 60px 0; }
.vet_middle_section h1 {margin-bottom:50px;}
.vet_middle_section {margin-bottom: 60px;}
#sb_instagram #sbi_load .sbi_load_btn {
border: 5px solid #5e7360 !important;
padding: 10px 150px !important;
font-size: 23px !important;
font-weight: bold;
text-transform: uppercase;
border-radius: 0px !important;
}
.sbi_load_btn:hover {background-color:#5e7360 !important; color:#fff !important; box-shadow: none !important; -webkit-transition: all .3s ease-in-out;
-moz-transition: all .3s ease-in-out;
-ms-transition: all .3s ease-in-out;
-o-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;}
.bottom_section_above_copy_image {text-align: center; display: block; margin: auto;}
.vet_bottom_section {padding:0 20% 0 20%; margin-bottom:60px;}
.vet_bottom_section h2 {text-align: center; font-weight: bold; font-size:36px;}
.vet_bottom_section p:nth-of-type(1) {font-size:20px;}
.vet_bottom_section p {line-height: 1.5}
@media (max-width:768px) {
header.global-header .top-nav {
padding: 15px 5px
}
header.global-header .top-nav .header-icon-wrap {
justify-content: flex-end
}
header.global-header .top-nav .header-icon-wrap .hamburger {
order: 1
}
header.global-header .top-nav .buttonWrap {
display: none
}
header.global-header .main-nav-wrap {
padding-left: 20px;
top: -20px
}
header.global-header .main-nav-wrap .socialWrap {
order: 0
}
header.global-header .main-nav-wrap .socialWrap .socialNav ul li a {
font-size: 20px;
height: 35px;
width: 35px
}
header.global-header .main-nav-wrap .mobileMenuBtnWrap {
display: block
}
.page-template-template-social header.global-header {
background-color: hsla(0, 0%, 100%, .7)
}
.error404 header.global-header .hamburger-inner,
.error404 header.global-header .hamburger-inner:after,
.error404 header.global-header .hamburger-inner:before,
.page-template-default header.global-header .hamburger-inner,
.page-template-default header.global-header .hamburger-inner:after,
.page-template-default header.global-header .hamburger-inner:before,
.page-template-template-social header.global-header.past-banner .hamburger-inner,
.page-template-template-social header.global-header.past-banner .hamburger-inner:after,
.page-template-template-social header.global-header.past-banner .hamburger-inner:before {
background-color: #231f20
}
.single-event header.global-header {
background-color: hsla(0, 0%, 100%, .7);
transition: all .2s linear
}
.page-template-template-social .hamburger-inner,
.page-template-template-social header.global-header .top-nav .header-icon-wrap .socialWrap .socialNav ul li a,
.single-event .hamburger-inner,
.single-event header.global-header .top-nav .header-icon-wrap .socialWrap .socialNav ul li a {
background-color: #231f20;
color: #fff
}
.page-template-template-MilitarySupport header.global-header.past-banner .hamburger-inner,
.page-template-template-MilitarySupport header.global-header.past-banner .hamburger-inner:after,
.page-template-template-MilitarySupport header.global-header.past-banner .hamburger-inner:before,
.page-template-template-social .hamburger-inner:after,
.page-template-template-social .hamburger-inner:before,
.page-template-template-social header.global-header .top-nav .header-icon-wrap .socialWrap .socialNav ul li a:after,
.page-template-template-social header.global-header .top-nav .header-icon-wrap .socialWrap .socialNav ul li a:before,
.page-template-template-whatsNew header.global-header.past-banner .hamburger-inner,
.page-template-template-whatsNew header.global-header.past-banner .hamburger-inner:after,
.page-template-template-whatsNew header.global-header.past-banner .hamburger-inner:before,
.single-event .hamburger-inner:after,
.single-event .hamburger-inner:before,
.single-event header.global-header .top-nav .header-icon-wrap .socialWrap .socialNav ul li a:after,
.single-event header.global-header .top-nav .header-icon-wrap .socialWrap .socialNav ul li a:before,
.single-flavor header.global-header .hamburger-inner,
.single-flavor header.global-header .hamburger-inner:after,
.single-flavor header.global-header .hamburger-inner:before,
.single-flavor header.global-header.past-banner .hamburger-inner,
.single-flavor header.global-header.past-banner .hamburger-inner:after,
.single-flavor header.global-header.past-banner .hamburger-inner:before {
background-color: #231f20
}
.btn.mainNav,
.btn.requestBtn {
padding: 7px 38px
}
.homeA {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
height: 50vh;
min-height: 300px
}
.homeA .left {
align-items: center;
padding: 0 0 0 60px
}
.homeC {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
height: 50vh;
justify-content: center;
min-height: 300px
}
.homeC .right {
align-items: center;
padding: 0
}
.flavorB .copyContain,
.flavorB .headlineContain {
padding: 0 20px
}
.socialC {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
height: 50vh;
min-height: 300px
}
.socialC .left {
align-items: center;
padding: 0 0 0 60px
}
.singleFlavorB .right .content .splitContent .nutrition {
display: flex;
justify-content: center;
margin-right: 0;
order: 1;
text-align: center;
width: 100%
}
.singleFlavorB .right .content .splitContent .nutrition .mobileSpace {
display: block
}
.singleFlavorB .right .content .splitContent .nutrition .calories {
display: flex;
justify-content: center;
padding-bottom: 0;
text-align: center
}
.singleFlavorB .right .content .splitContent .nutrition .calories h3 {
font-size: 30px;
line-height: 1;
margin: 0;
text-align: center;
width: inherit
}
.singleFlavorB .right .content .splitContent .nutrition .calories h3:after {
display: none
}
.singleFlavorB .right .content .splitContent .nutrition .calories h3 span {
font-size: 50px
}
.singleFlavorB .right .content .splitContent .nutrition .energy {
display: flex;
justify-content: center;
margin-top: inherit;
padding-bottom: 0;
text-align: center
}
.singleFlavorB .right .content .splitContent .nutrition .energy h3 {
font-size: 30px;
line-height: 1;
margin: 0;
text-align: center;
width: inherit
}
.singleFlavorB .right .content .splitContent .nutrition .energy h3:after {
display: none
}
.singleFlavorB .right .content .splitContent .nutrition .energy h3 span {
font-size: 50px
}
.singleFlavorB .right .content .splitContent .nutrition .carbs {
display: flex;
justify-content: center;
margin-top: inherit;
padding-bottom: 0;
text-align: center
}
.singleFlavorB .right .content .splitContent .nutrition .carbs h3 {
font-size: 30px;
line-height: 1;
margin: 0;
text-align: center
}
.singleFlavorB .right .content .splitContent .nutrition .carbs h3 span {
font-size: 50px
}
.singleFlavorB .right .content .splitContent .copy {
order: 0;
padding-bottom: 20px;
width: 100% !important
}
.singleFlavorB .right .content .splitContent .copy .btn-contain {
display: none
}
.singleFlavorB .mobileBtnContain {
display: flex;
flex-wrap: wrap;
justify-content: center;
padding-bottom: 40px;
text-align: center;
width: 100%
}
.singleFlavorB .mobileBtnContain .btn.small {
margin: 0 3px
}
.contactA .social ul li a {
font-size: 20px;
height: 35px;
width: 35px
}
.eventB {
-ms-grid-columns: none;
display: flex;
flex-wrap: wrap;
grid-template-columns: none
}
.eventB,
.eventB .left {
width: 100%
}
.eventB .right {
padding: 20px;
width: 100%
}
.eventB .right .content .dateGridContain .eventLocationTile {
margin: 20px 0;
width: 100% !important
}
.notFound .content {
-ms-grid-columns: 1fr;
background-color: hsla(0, 0%, 100%, .7);
grid-template-columns: 1fr;
padding: 0 20px;
text-align: center
}
.notFound .content .left {
display: none
}
.notFound .content .right {
padding: 15% 0 0
}
.notFound .content .right p {
padding-right: 0
}
}
@media (max-width:950px) {
header.global-header .top-nav .logo-wrap {
max-width: 150px
}
header.global-header .top-nav .header-icon-wrap {
margin-top: -10px
}
.mainFooter .footerNav ul.footer-menu {
flex-wrap: wrap;
justify-content: center;
text-align: center
}
.mainFooter .footerNav ul.footer-menu li {
margin-bottom: 10px;
width: 100%
}
.homeBanner {
height: inherit;
margin-top: 80px
}
#wpsl-result-list {
margin: 80px 0 0
}
#wpsl-result-list ul {
text-align: center
}
#wpsl-result-list ul,
#wpsl-stores .titles-contain {
justify-content: center;
width: 100%
}
#wpsl-stores .titles-contain .title-contain {
padding-right: 0;
text-align: center
}
.scrollDown {
height: 55px;
width: 55px
}
.homeB {
-ms-grid-columns: (minmax(auto, 1fr))[2];
-ms-grid-rows: (minmax(300px, 400px))[6];
grid-template-columns: repeat(2, minmax(auto, 1fr));
grid-template-rows: repeat(6, minmax(300px, 400px))
}
.homeB .news-item {
grid-column: auto
}
.homeB .news-item.newsHeadlineItem {
-ms-grid-column: 1;
-ms-grid-column-span: 1;
-ms-grid-row: 1;
-ms-grid-row-span: 3;
grid-column: 1/2;
grid-row: 1/4
}
.homeB .news-item.socialHeadlineItem {
-ms-grid-column: 1;
-ms-grid-column-span: 1;
-ms-grid-row: 4;
-ms-grid-row-span: 3;
grid-column: 1/2;
grid-row: 4/7
}
.homeC {
align-items: center;
justify-content: center
}
.flavorA {
height: 60vh;
min-height: 300px
}
.flavorB .copyContain,
.flavorB .headlineContain {
padding: 0 80px
}
.flavorB .flavorSlider .owl-carousel .owl-stage-outer {
padding: 60px 0 20px
}
.flavorB .flavorSlider .owl-carousel .owl-item:hover {
transform: scaleX(1);
transition: all .2s ease-in-out
}
.flavorB .flavorSlider .owl-carousel .owl-dots {
margin-top: inherit
}
.socialB .feedContain,
.socialB .innerPostContain {
-ms-grid-columns: (minmax(auto, 1fr))[2];
grid-template-columns: repeat(2, minmax(auto, 1fr))
}
.socialB .feedContain .news-item,
.socialB .innerPostContain .news-item {
min-height: 25vh
}
.socialB .feedContain .news-item:nth-child(3),
.socialB .feedContain .news-item:nth-child(8),
.socialB .innerPostContain .news-item:nth-child(3),
.socialB .innerPostContain .news-item:nth-child(8) {
grid-column: inherit;
height: inherit;
min-height: inherit
}
.socialB .feedContain .news-item:nth-child(3),
.socialB .feedContain .news-item:nth-child(8),
.socialB .innerPostContain .news-item:nth-child(3),
.socialB .innerPostContain .news-item:nth-child(8) {
grid-row: inherit
}
.wnB .headlineWrap p,
.wnC .headlineWrap p {
padding: inherit !important
}
.msA,
.msB {
min-height: 350px
}
.msB .msSliderB .owl-stage .owl-item .slideContent .left {
display: none
}
.msB .msSliderB .owl-stage .owl-item .slideContent .right {
width: 100% !important
}
.msC {
padding: 60px 20px 40px
}
.singleFlavorA {
background-attachment: inherit
}
.singleFlavorC .socialFeed {
-ms-grid-columns: (minmax(auto, 1fr))[2];
-ms-grid-rows: (max-content)[2];
grid-row-gap: 20px;
grid-template-columns: repeat(2, minmax(auto, 1fr));
grid-template-rows: repeat(2, -webkit-max-content);
grid-template-rows: repeat(2, max-content)
}
.singleFlavorC .socialFeed .FlavorNewsitem {
min-height: 25vh
}
.postContent {
-ms-grid-columns: 1fr;
-ms-grid-rows: (auto)[2];
grid-template-columns: 1fr;
grid-template-rows: repeat(2, auto)
}
.postContent .left {
min-height: 50vh
}
.postContent .right {
max-height: inherit;
overflow-y: inherit;
padding: 60px 20px
}
.postContent .right .newsScrollDown {
display: none
}
.eventB .right .content .dateGridContain .eventLocationTile {
margin: 20px 10px 20px 0;
width: calc(50% - 10px)
}
.findRipItA .wpsl-store-right {
-ms-grid-columns: 1fr;
-ms-grid-rows: (auto)[2];
grid-template-columns: 1fr;
grid-template-rows: repeat(2, auto)
}
.findRipItA .wpsl-store-right #wpsl-gmap {
min-height: 40vh
}
.findRipItA .wpsl-store-right #wpsl-result-list #wpsl-stores .titles-contain .title-contain,
.findRipItA .wpsl-store-right #wpsl-result-list ul {
text-align: center
}
.findRipItA .wpsl-store-right #wpsl-result-list #wpsl-stores .wpsl-search {
display: flex;
justify-content: center
}
.findRipItA .wpsl-store-right #wpsl-result-list #wpsl-stores .wpsl-search #wpsl-search-wrap {
padding-right: 0
}
.riderA .content p {
font-size: 16px;
padding: 0
}
}
@media (max-width:600px) {
header.global-header .main-nav-wrap {
padding-left: 0;
text-align: center;
top: -10px
}
header.global-header .main-nav-wrap ul.main-menu li a {
line-height: 1.4
}
header.global-header .main-nav-wrap .socialWrap .socialNav {
display: flex;
justify-content: center;
text-align: center
}
.btn.btnInline {
font-size: 15px;
padding: 7px 18px
}
.wpsl-search {
margin-top: -130px
}
#wpsl-result-list {
margin: 60px 0 0 !important
}
.flavorC #storelocatorwidget .storelocator #storelocator-search-bar,
.homeD #storelocatorwidget .storelocator #storelocator-search-bar {
position: static
}
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-title,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-title {
justify-content: center;
padding: 20px;
width: 100%
}
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-title .content,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-title .content {
text-align: center
}
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-list,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-list {
width: 100%
}
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-map_canvas,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-map_canvas {
height: 460px;
left: 0
}
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-mapOverlay,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-mapOverlay {
display: none
}
.findRipItA #storelocatorwidget #storelocatorwidget-container {
width: 100%
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-search-bar {
margin: 0;
padding: 0;
width: 100%
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-search-bar #storelocator-mapswitch {
display: none
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-wrapper #storelocator-map_canvas {
left: 0;
width: 100%
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-wrapper #storelocator-mapOverlay {
display: none
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-wrapper #storelocator-leftcolumn {
padding: 20px 5px 0;
width: 100%
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-wrapper #storelocator-leftcolumn #storelocator-title .content {
text-align: center
}
.hiddenMap #storelocator-wrapper #storelocator-map_canvas {
left: 0;
opacity: 1;
position: absolute !important;
width: 100%;
z-index: 1
}
.homeB {
-ms-grid-columns: 1fr;
-ms-grid-rows: auto (minmax(250px, auto))[10];
grid-template-columns: 1fr;
grid-template-rows: auto repeat(10, minmax(250px, auto));
padding: 0
}
.homeB .news-item,
.homeB .news-item.newsHeadlineItem {
-ms-grid-column: 1;
-ms-grid-column-span: 1;
grid-column: 1/2
}
.homeB .news-item.newsHeadlineItem {
-ms-grid-row: 1;
-ms-grid-row-span: 3;
grid-row: 1/4
}
.homeB .news-item.socialHeadlineItem {
-ms-grid-column: 1;
-ms-grid-column-span: 1;
-ms-grid-row: 7;
-ms-grid-row-span: 2;
grid-column: 1/2;
grid-row: 7/9
}
.singleFlavorB .left .backContain {
max-width: 150px;
top: -25px
}
.riderB .right .content .gfield_checkbox {
-ms-grid-columns: (1fr)[2];
grid-template-columns: repeat(2, 1fr)
}
}
@media (max-width:570px) {
#wpsl-result-list {
margin: 0 !important
}
}
@media screen and (min-width:1280px) {
#wpsl-stores .titles-contain .title-contain h2 {
font-size: 130px
}
#wpsl-stores .titles-contain .title-contain h2 span {
font-size: 200px
}
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-title .content h2,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-title .content h2 {
font-size: 150px
}
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-title .content h2 span,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-title .content h2 span {
font-size: 210px
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-wrapper #storelocator-leftcolumn #storelocator-title .content h2 {
font-size: 130px
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-wrapper #storelocator-leftcolumn #storelocator-title .content h2 span {
font-size: 190px
}
.homeA .left h1,
.homeB .news-item.newsHeadlineItem h2,
.homeB .news-item.socialHeadlineItem h2,
.homeC .right h2 {
font-size: 120px
}
.flavorB .headlineContain .content h1,
.socialB .headline h2 {
font-size: 160px
}
.socialC .left h2 {
font-size: 140px
}
.socialD .owl-slider .owl-stage .owl-item .slide h2 {
font-size: 150px
}
.wnA .wnSlider1 .owl-stage .owl-item .slide-item h2 {
font-size: 110px
}
.wnB .headlineWrap h2,
.wnC .headlineWrap h2 {
font-size: 150px
}
.msB .msSliderB .owl-stage .owl-item .slideContent .right .content h2 {
font-size: 90px
}
.msB .msSliderB .owl-stage .owl-item .slideContent .right .content p {
font-size: 25px
}
.msC .content h2 {
font-size: 200px
}
.singleFlavorB .left .mobileHeadline h1,
.singleFlavorB .right .content .headline h1 {
font-size: 110px
}
.singleFlavorC .headline h2 {
font-size: 160px
}
.postContent .right .content h1 {
font-size: 120px
}
.postContent .right .content p.date {
font-size: 30px
}
.contactA h1 {
font-size: 160px
}
.contactC .headline h2 {
font-size: 170px
}
.eventA .content h1 {
font-size: 140px
}
.eventB .right .content .dateGridHeadline h2,
.eventB .right .content h2 {
font-size: 85px
}
.findRipItA .wpsl-store-right #wpsl-result-list #wpsl-stores .titles-contain .title-contain h2 {
font-size: 110px
}
.findRipItA .wpsl-store-right #wpsl-result-list #wpsl-stores .titles-contain .title-contain h2 span {
font-size: 140px
}
.findRipItB .content h2 {
font-size: 120px
}
#findRipItC .forms #foundForm.active .headline h2,
#findRipItC .forms #requestForm.active .headline h2 {
font-size: 70px
}
.findRipItD .headline h2 {
font-size: 190px
}
.findRipItD .headline p {
font-size: 67px
}
.notFound h2,
.thanksContent h1 {
font-size: 70px
}
.riderA .content h1 {
font-size: 150px
}
.riderB .left .content h2,
.riderB .right .content .interestHeadline h3,
.riderC .content h2 {
font-size: 70px
}
}
@media screen and (max-width:768px) {
#wpsl-stores .titles-contain .title-contain h2 {
font-size: 60px
}
#wpsl-stores .titles-contain .title-contain h2 span {
font-size: 100px
}
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-title .content h2,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-title .content h2 {
font-size: 90px
}
.flavorC #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-title .content h2 span,
.homeD #storelocatorwidget .storelocator #storelocator-wrapper #storelocator-leftcolumn #storelocator-title .content h2 span {
font-size: 115px
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-wrapper #storelocator-leftcolumn #storelocator-title .content h2 {
font-size: 60px
}
.findRipItA #storelocatorwidget #storelocatorwidget-container #storelocator-wrapper #storelocator-leftcolumn #storelocator-title .content h2 span {
font-size: 100px
}
.homeA .left h1 {
font-size: 60px
}
.homeB .news-item.newsHeadlineItem h2,
.homeB .news-item.socialHeadlineItem h2 {
font-size: 105px
}
.homeC .right h2 {
font-size: 60px
}
.flavorB .headlineContain .content h1 {
font-size: 80px
}
.socialB .headline h2 {
font-size: 105px
}
.socialC .left h2 {
font-size: 60px
}
.socialD .owl-slider .owl-stage .owl-item .slide h2 {
font-size: 70px
}
.wnA .wnSlider1 .owl-stage .owl-item .slide-item h2 {
font-size: 60px
}
.msB .msSliderB .owl-stage .owl-item .slideContent .right .content h2 {
font-size: 50px
}
.msB .msSliderB .owl-stage .owl-item .slideContent .right .content p {
font-size: 16px
}
.msC .content h2 {
font-size: 105px
}
.singleFlavorB .left .mobileHeadline h1,
.singleFlavorB .right .content .headline h1 {
font-size: 60px
}
.singleFlavorC .headline h2 {
font-size: 105px
}
.postContent .right .content h1 {
font-size: 65px
}
.postContent .right .content p.date {
font-size: 20px
}
.contactA h1 {
font-size: 80px
}
.contactC .headline h2 {
font-size: 70px
}
.eventA .content h1 {
font-size: 75px
}
.eventB .right .content .dateGridHeadline h2,
.eventB .right .content h2 {
font-size: 40px
}
.findRipItA .wpsl-store-right #wpsl-result-list #wpsl-stores .titles-contain .title-contain h2 {
font-size: 60px
}
.findRipItA .wpsl-store-right #wpsl-result-list #wpsl-stores .titles-contain .title-contain h2 span {
font-size: 100px
}
.findRipItB .content h2 {
font-size: 60px
}
.findRipItD .headline h2 {
font-size: 100px
}
.findRipItD .headline p {
font-size: 32px
}
.riderA .content h1 {
font-size: 60px
}
.riderB .left .content h2 {
font-size: 45px
}
.riderB .right .content .interestHeadline h3 {
font-size: 30px
}
.riderC .content h2 {
font-size: 45px
}
}
@media (max-width:800px) {
.modal .modal-wrap {
padding: 45px;
width: 80%
}
}
@media (max-width:500px) {
.modal .modal-wrap {
width: 90%
}
.vet_top_section h1, .vet_middle_section h1 {font-size: 50px;}
.vet_top_section p {
font-size: 18px;
}
.vet_top_section br {display: none;}
.vet_middle_section, .vet_bottom_section {
padding:0 10% 0 10%;
}
#sb_instagram #sbi_load .sbi_load_btn {
padding: 10px 50px !important;
font-size: 18px !important;
}
}
@media (-ms-high-contrast:active), (-ms-high-contrast:none) {
.homeB {
display: flex;
flex-wrap: wrap;
padding: 20px 0
}
.homeB .news-item {
margin: 10px;
width: calc(25% - 20px)
}
.homeB .news-item.newsHeadlineItem,
.homeB .news-item.socialHeadlineItem {
padding: 5% 0 5% 20px
}
.socialA {
padding: 15% 0
}
.socialB .feedContain,
.socialB .innerPostContain {
display: flex;
flex-wrap: wrap
}
.socialB .feedContain .news-item,
.socialB .innerPostContain .news-item {
min-height: 250px !important;
width: 33.333%
}
.wnB .wnSlider2 .owl-stage-outer .owl-stage .news-item .newsOverlay,
.wnB .wnSlider3 .owl-stage-outer .owl-stage .news-item .newsOverlay,
.wnC .wnSlider2 .owl-stage-outer .owl-stage .news-item .newsOverlay,
.wnC .wnSlider3 .owl-stage-outer .owl-stage .news-item .newsOverlay {
padding: 13% 0
}
.msB .msSliderB .owl-stage .owl-item .slideContent .left {
padding-top: 19%
}
.singleFlavorC .socialFeed {
display: flex;
flex-wrap: wrap;
padding: 0 10px 20px
}
.singleFlavorC .socialFeed .FlavorNewsitem {
margin: 0 10px;
width: calc(25% - 20px)
}
}
@media (min-width:951px) and (max-width:1500px) {
.homeB {
-ms-grid-columns: 2fr (minmax(auto, 1fr))[3];
grid-template-columns: 2fr repeat(3, minmax(auto, 1fr))
}
}
@media (-ms-high-contrast:active) and (max-width:1280px), (-ms-high-contrast:none) and (max-width:1280px) {
.homeB .news-item {
width: calc(50% - 20px)
}
}
@media (-ms-high-contrast:active) and (max-width:950px), (-ms-high-contrast:none) and (max-width:950px) {
.homeB .news-item {
width: calc(100% - 20px)
}
.socialB .feedContain .news-item,
.socialB .innerPostContain .news-item {
min-height: 25vh;
width: 50%
}
.singleFlavorC .socialFeed .FlavorNewsitem {
margin: 10px;
width: calc(50% - 20px)
}
}
@media (max-width:1350px) {
.flavorB .headlineContain .content .squareContain {
display: none
}
.msB .msSliderB .owl-stage .owl-item .slideContent .left {
width: 40%
}
.msB .msSliderB .owl-stage .owl-item .slideContent .right {
align-items: center;
width: 60%
}
}
@media (-ms-high-contrast:active) and (max-width:768px), (-ms-high-contrast:none) and (max-width:768px) {
.socialB .feedContain .news-item,
.socialB .innerPostContain .news-item {
width: 100%
}
.singleFlavorC .socialFeed .FlavorNewsitem {
width: calc(100% - 20px)
}
}
@media screen and (max-width:600px) {
.wnB .headlineWrap h2,
.wnC .headlineWrap h2 {
font-size: 60px
}
#findRipItC .forms #foundForm.active .headline h2,
#findRipItC .forms #requestForm.active .headline h2,
.notFound h2,
.thanksContent h1 {
font-size: 30px
}
}
@media (max-width:1280px) {
.wnB .headlineWrap p,
.wnC .headlineWrap p {
padding: 0 15%
}
.singleFlavorB .left {
padding-top: 40px;
width: 100%
}
.singleFlavorB .left .mobileHeadline {
display: block
}
.singleFlavorB .right {
width: 100%
}
.singleFlavorB .right .content {
display: flex;
flex-wrap: wrap
}
.singleFlavorB .right .content .headline {
display: none
}
.singleFlavorB .right .content .splitContent {
flex-wrap: wrap;
justify-content: center;
width: 100%
}
.singleFlavorB .right .content .splitContent .copy {
padding-right: inherit !important;
width: 35%
}
}
@media (max-width:1500px) {
.singleFlavorB .right .content .splitContent .copy {
padding-right: 25%
}
}
@media (max-width:520px) {
.contactB .contactForm iframe {
min-height: 720px
}
}
@media (max-width:1050px) {
.riderB {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr
}
.riderB .left {
justify-content: center
}
.riderB .left,
.riderB .right {
padding: 0 20px
}
.riderB .right .content .clear-multi,
.riderB .right .content .ginput_container input {
width: 100%
}
}
*/
*/