dear-anon/wp-content/plugins/powerpress/css/subscribe-widget.css

611 lines
16 KiB
CSS

.pp-ssb-widget {
width: 100%;
margin: 0 auto;
}
.pp-ssb-widget-modern {
font: Roboto;
color: #707070;
}
.pp-ssb-widget-classic {
font-family: Sans-serif;
color: #FFFFFF;
}
/*Styling for round buttons*/
a.pp-ssb-btn {
width: 100%;
height: 48px;
display: inline-block;
text-decoration: none;
vertical-align: middle;
line-height: 48px;
overflow: hidden;
border-radius: 50px;
}
.pp-ssb-widget-include a.pp-ssb-btn {
text-align: left;
}
.pp-ssb-widget-modern a.pp-ssb-btn {
color: #707070;
margin: 6px 0 6px 0;
border: 1px solid #C4C4C4;
font: 15px arial, sans-serif;
padding-right: 20px;
background-position: center;
transition: background 0.8s;
background-color: #fff;
font-size: 80%;
}
.pp-ssb-widget-modern.pp-ssb-widget-include a.pp-ssb-btn {
font-size: 80% !important;
}
.pp-ssb-widget-classic a.pp-ssb-btn {
padding: 0;
color: #FFFFFF;
margin: 10px 0 10px 0;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
font-size: 90%;
font-weight: bold;
}
.pp-ssb-widget-classic.pp-ssb-widget-include a.pp-ssb-btn {
font-size: 90% !important;
font-weight: bold !important;
}
/*Styling for square buttons*/
.pp-ssb-btn-sq {
width: 100%;
height: 48px;
display: inline-block;
text-decoration: none;
vertical-align: middle;
line-height: 48px;
overflow: hidden;
}
.pp-ssb-btn-include .pp-ssb-btn-sq {
text-align: left;
}
body .pp-ssb-widget-modern a.pp-ssb-btn-sq {
color: #707070;
margin: 6px 0 6px 0;
border: 1px solid #C4C4C4;
font: 15px arial, sans-serif;
background-position: center;
transition: background 0.8s;
background-color: #fff;
font-size: 80%;
}
body .pp-ssb-widget-modern.pp-ssb-widget-include a.pp-ssb-btn-sq {
font-size: 80% !important;
}
body .pp-ssb-widget-classic a.pp-ssb-btn-sq {
padding: 0;
color: #FFFFFF;
margin: 10px 0 10px 0;
border-radius: 1px;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
font-size: 90%;
font-weight: bold;
}
body .pp-ssb-widget-classic.pp-ssb-widget-include a.pp-ssb-btn-sq {
font-size: 90% !important;
font-weight: bold !important;
}
/*Responsive rules, so that buttons don't wrap and the Subscribe Page button is always displayed*/
@media (max-width: 663px) and (min-width: 611px) {
a.pp-ssb-btn-sq.horizontal:nth-child(n + 11) {
display: none;
}
}
@media (max-width: 611px) and (min-width: 559px) {
a.pp-ssb-btn-sq.horizontal:nth-child(n + 10) {
display: none;
}
}
@media (max-width: 559px) and (min-width: 507px) {
a.pp-ssb-btn-sq.horizontal:nth-child(n + 9) {
display: none;
}
}
@media (max-width: 507px) and (min-width: 455px) {
a.pp-ssb-btn-sq.horizontal:nth-child(n + 8) {
display: none;
}
}
@media (max-width: 455px) and (min-width: 403px) {
a.pp-ssb-btn-sq.horizontal:nth-child(n + 7) {
display: none;
}
}
@media (max-width: 403px) and (min-width: 351px) {
a.pp-ssb-btn-sq.horizontal:nth-child(n + 6) {
display: none;
}
}
@media (max-width: 351px) and (min-width: 299px) {
a.pp-ssb-btn-sq.horizontal:nth-child(n + 5) {
display: none;
}
}
@media (max-width: 299px) and (min-width: 247px) {
a.pp-ssb-btn-sq.horizontal:nth-child(n + 4) {
display: none;
}
}
@media (max-width: 247px) and (min-width: 195px) {
a.pp-ssb-btn-sq.horizontal:nth-child(n + 3) {
display: none;
}
}
@media (max-width: 195px) {
a.pp-ssb-btn-sq.horizontal:nth-child(n + 2) {
display: none;
}
}
/*Responsive rules for square buttons*/
@media (max-width: 992px) and (min-width: 721px) {
a.pp-ssb-btn.horizontal:nth-child(n + 11) {
display: none;
}
}
@media (max-width: 721px) and (min-width: 659px) {
a.pp-ssb-btn.horizontal:nth-child(n + 10) {
display: none;
}
}
@media (max-width: 659px) and (min-width: 597px) {
a.pp-ssb-btn.horizontal:nth-child(n + 9) {
display: none;
}
}
@media (max-width: 597px) and (min-width: 535px) {
a.pp-ssb-btn.horizontal:nth-child(n + 8) {
display: none;
}
}
@media (max-width: 535px) and (min-width: 473px) {
a.pp-ssb-btn.horizontal:nth-child(n + 7) {
display: none;
}
}
@media (max-width: 473px) and (min-width: 411px) {
a.pp-ssb-btn.horizontal:nth-child(n + 6) {
display: none;
}
}
@media (max-width: 411px) and (min-width: 349px) {
a.pp-ssb-btn.horizontal:nth-child(n + 5) {
display: none;
}
}
@media (max-width: 349px) and (min-width: 287px) {
a.pp-ssb-btn.horizontal:nth-child(n + 4) {
display: none;
}
}
@media (max-width: 287px) and (min-width: 225px) {
a.pp-ssb-btn.horizontal:nth-child(n + 3) {
display: none;
}
}
@media (max-width: 225px) {
a.pp-ssb-btn.horizontal:nth-child(n + 2) {
display: none;
}
}
a.pp-ssb-btn-sq.horizontal:last-child,
a.pp-ssb-btn.horizontal:last-child
{
display:inline-block;
}
body .sidebar .widget .pp-ssb-widget-classic a:link,
body .sidebar .widget .pp-ssb-widget-classic a:visited,
body .sidebar .widget .pp-ssb-widget-classic a:active,
body .sidebar .widget .pp-ssb-widget-classic a:hover,
body .pp-ssb-widget-classic a.pp-ssb-btn:link,
body .pp-ssb-widget-classic a.pp-ssb-btn:visited,
body .pp-ssb-widget-classic a.pp-ssb-btn:active,
body .pp-ssb-widget-classic a.pp-ssb-btn:hover {
text-decoration: none;
color: #FFFFFF;
}
body .sidebar .widget .pp-ssb-widget-classic.pp-ssb-widget-include a:link,
body .sidebar .widget .pp-ssb-widget-classic.pp-ssb-widget-include a:visited,
body .sidebar .widget .pp-ssb-widget-classic.pp-ssb-widget-include a:active,
body .sidebar .widget .pp-ssb-widget-classic.pp-ssb-widget-include a:hover,
body .pp-ssb-widget-classic.pp-ssb-widget-include a.pp-ssb-btn:link,
body .pp-ssb-widget-classic.pp-ssb-widget-include a.pp-ssb-btn:visited,
body .pp-ssb-widget-classic.pp-ssb-widget-include a.pp-ssb-btn:active,
body .pp-ssb-widget-classic.pp-ssb-widget-include a.pp-ssb-btn:hover {
text-decoration: none !important;
color: #FFFFFF !important;
}
/*Background colors for classic buttons*/
.pp-ssb-widget-dark a,
.pp-ssb-widget-classic a {
background-color: #222222;
}
.pp-ssb-widget-classic a.pp-ssb-itunes {
background-color: #732BBE;
}
.pp-ssb-widget-classic a.pp-ssb-email {
background-color: #337EC9;
}
.pp-ssb-widget-classic a.pp-ssb-stitcher {
background-color: #197195;
}
.pp-ssb-widget-classic a.pp-ssb-tunein {
background-color: #2CB6A8;
}
.pp-ssb-widget-classic a.pp-ssb-gp {
background-color: #db3236;
}
.pp-ssb-widget-classic a.pp-ssb-spotify {
background-color: #1db954;
}
.pp-ssb-widget-classic a.pp-ssb-android {
background-color: #6AB344;
}
.pp-ssb-widget-classic a.pp-ssb-iheartradio {
background-color: #960d16;
}
.pp-ssb-widget-classic a.pp-ssb-deezer {
background-color: #007feb;
}
.pp-ssb-widget-classic a.pp-ssb-pandora {
background-color: #3668ff;
}
.pp-ssb-widget-classic a.pp-ssb-blubrry {
background-color: #2278cf;
}
.pp-ssb-widget-classic a.pp-ssb-rss {
background-color: #FF8800;
}
.pp-ssb-widget-modern a .pp-ssb-text {
position: relative;
top: 4px;
}
/*Ripple effect in modern buttons*/
.pp-ssb-widget-modern a.pp-ssb-btn:hover, .pp-ssb-widget-modern a.pp-ssb-btn-sq:hover {
background: #ebebeb radial-gradient(circle, transparent 1%, #ebebeb 1%) center/15000%;
color: #444444;
}
/*Background rules for modern buttons*/
.pp-ssb-widget-modern .pp-ssb-itunes.pp-ssb-btn:active, .pp-ssb-widget-modern .pp-ssb-itunes.pp-ssb-btn-sq:active {
background-color: #AB42DF;
background-size: 100%;
transition: background 0s;
}
.pp-ssb-widget-modern .pp-ssb-android.pp-ssb-btn:active, .pp-ssb-widget-modern .pp-ssb-android.pp-ssb-btn-sq:active {
background-color: #75BA26;
background-size: 100%;
transition: background 0s;
}
.pp-ssb-widget-modern .pp-ssb-email.pp-ssb-btn:active, .pp-ssb-widget-modern .pp-ssb-email.pp-ssb-btn-sq:active {
background-color: #018C8B;
background-size: 100%;
transition: background 0s;
}
.pp-ssb-widget-modern .pp-ssb-gp.pp-ssb-btn:active, .pp-ssb-widget-modern .pp-ssb-gp.pp-ssb-btn-sq:active {
background-color: #F9BA01;
background-size: 100%;
transition: background 0s;
}
.pp-ssb-widget-modern .pp-ssb-stitcher.pp-ssb-btn:active, .pp-ssb-widget-modern .pp-ssb-stitcher.pp-ssb-btn-sq:active {
background-color: #2B91C9;
background-size: 100%;
transition: background 0s;
}
.pp-ssb-widget-modern .pp-ssb-tunein.pp-ssb-btn:active, .pp-ssb-widget-modern .pp-ssb-tunein.pp-ssb-btn-sq:active {
background-color: #1C1F3D;
background-size: 100%;
transition: background 0s;
}
.pp-ssb-widget-modern .pp-ssb-spotify.pp-ssb-btn:active, .pp-ssb-widget-modern .pp-ssb-spotify.pp-ssb-btn-sq:active {
background-color: #3EB559;
background-size: 100%;
transition: background 0s;
}
.pp-ssb-widget-modern .pp-ssb-iheartradio.pp-ssb-btn:active, .pp-ssb-widget-modern .pp-ssb-iheartradio.pp-ssb-btn-sq:active {
background-color: #960d16;
background-size: 100%;
transition: background 0s;
}
.pp-ssb-widget-modern .pp-ssb-deezer.pp-ssb-btn:active, .pp-ssb-widget-modern .pp-ssb-deezer.pp-ssb-btn-sq:active {
background-color: #007feb;
background-size: 100%;
transition: background 0s;
}
.pp-ssb-widget-modern .pp-ssb-pandora.pp-ssb-btn:active, .pp-ssb-widget-modern .pp-ssb-pandora.pp-ssb-btn-sq:active {
background-color: #3668ff;
background-size: 100%;
transition: background 0s;
}
.pp-ssb-widget-modern .pp-ssb-blubrry.pp-ssb-btn:active, .pp-ssb-widget-modern .pp-ssb-blubrry.pp-ssb-btn-sq:active {
background-color: #2278cf;
background-size: 100%;
transition: background 0s;
}
.pp-ssb-widget-modern .pp-ssb-rss.pp-ssb-btn:active, .pp-ssb-widget-modern .pp-ssb-rss.pp-ssb-btn-sq:active {
background-color: #FF6600;
background-size: 100%;
transition: background 0s;
}
.pp-ssb-widget-modern .pp-ssb-more.pp-ssb-btn:active, .pp-ssb-widget-modern .pp-ssb-more.pp-ssb-btn-sq:active {
background-color: #333333;
background-size: 100%;
transition: background 0s;
}
.horizontal .pp-ssb-text {
display: none;
}
a.pp-ssb-btn.horizontal, a.pp-ssb-btn-sq.horizontal {
width: auto;
}
a.pp-ssb-btn.horizontal, a.pp-ssb-btn-sq.horizontal {
padding-right: 0;
}
.pp-ssb-widget-include a.pp-ssb-btn.horizontal, .pp-ssb-widget-include a.pp-ssb-btn-sq.horizontal {
padding-right: 0 !important;
}
a.pp-ssb-btn.horizontal {
margin-right: 10px;
}
/*Settings for buttons, including which sprite to use for the icons*/
.pp-ssb-ic {
display: inline-block;
width: 50px;
height: 38px;
margin-top: 2px;
border: 0;
vertical-align: middle;
padding-left: 15px;
background-repeat: no-repeat;
background-size: 50px;
}
.pp-ssb-widget-modern a .pp-ssb-ic {
background-image: url('../images/modern_icon_sprite.svg');
}
.pp-ssb-widget-classic a .pp-ssb-ic {
margin-right: 2px;
background-image: url('../images/white_logos.svg');
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
/* IE10+ CSS styles go here */
.pp-ssb-widget-modern a .pp-ssb-ic {
background-image: url('../images/modern-icon-sprite.png');
}
.pp-ssb-widget-classic a .pp-ssb-ic {
background-image: url('../images/white_logos.png');
width: 50px;
background-size: 50px;
}
}
/*Sprite background positions for classic buttons*/
.pp-ssb-widget-classic .pp-ssb-itunes .pp-ssb-ic {
background-position: 0 -10px;
}
.pp-ssb-widget-classic .pp-ssb-rss .pp-ssb-ic {
background-position: 0 -360px;
}
.pp-ssb-widget-classic .pp-ssb-email .pp-ssb-ic {
background-position: 0 -110px;
}
.pp-ssb-widget-classic .pp-ssb-android .pp-ssb-ic {
background-position: 0 -60px;
}
.pp-ssb-widget-classic .pp-ssb-stitcher .pp-ssb-ic {
background-position: 0 -210px;
}
.pp-ssb-widget-classic .pp-ssb-tunein .pp-ssb-ic {
background-position: 0 -260px;
}
.pp-ssb-widget-classic .pp-ssb-spotify .pp-ssb-ic {
background-position: 0 -310px;
}
.pp-ssb-widget-classic .pp-ssb-gp .pp-ssb-ic {
background-position: 0 -160px;
}
.pp-ssb-widget-classic .pp-ssb-more .pp-ssb-ic {
background-position: 0 -410px;
}
.pp-ssb-widget-classic .pp-ssb-iheartradio .pp-ssb-ic {
background-position: 0 -460px;
}
.pp-ssb-widget-classic .pp-ssb-deezer .pp-ssb-ic {
background-position: 0 -510px;
}
.pp-ssb-widget-classic .pp-ssb-pandora .pp-ssb-ic {
background-position: 0 -560px;
}
.pp-ssb-widget-classic .pp-ssb-blubrry .pp-ssb-ic {
background-position: 0 -610px;
}
/*Sprite background positions for modern buttons*/
.pp-ssb-widget-modern .pp-ssb-itunes.pp-ssb-btn-sq:not(.horizontal) {
border-left: 3px solid #AB42DF;
padding-right: 10px;
}
.pp-ssb-widget-modern .pp-ssb-itunes .pp-ssb-ic {
background-position: 0 -5px;
}
.pp-ssb-widget-modern .pp-ssb-android.pp-ssb-btn-sq:not(.horizontal) {
border-left: 3px solid #75BA26;
padding-right: 10px;
}
.pp-ssb-widget-modern .pp-ssb-android .pp-ssb-ic {
background-position: 0 -55px;
}
.pp-ssb-widget-modern .pp-ssb-email.pp-ssb-btn-sq:not(.horizontal) {
border-left: 3px solid #018C8B;
padding-right: 10px;
}
.pp-ssb-widget-modern .pp-ssb-email .pp-ssb-ic {
background-position: 0 -106px;
}
.pp-ssb-widget-modern .pp-ssb-gp.pp-ssb-btn-sq:not(.horizontal) {
border-left: 3px solid #F9BA01;
padding-right: 10px;
}
.pp-ssb-widget-modern .pp-ssb-gp .pp-ssb-ic {
background-position: 0 -155px;
}
.pp-ssb-widget-modern .pp-ssb-stitcher.pp-ssb-btn-sq:not(.horizontal) {
border-left: 3px solid #2B91C9;
padding-right: 10px;
}
.pp-ssb-widget-modern .pp-ssb-stitcher .pp-ssb-ic {
background-position: 0 -205px;
}
.pp-ssb-widget-modern .pp-ssb-tunein.pp-ssb-btn-sq:not(.horizontal) {
border-left: 3px solid #1C1F3D;
padding-right: 10px;
}
.pp-ssb-widget-modern .pp-ssb-tunein .pp-ssb-ic {
background-position: 0 -255px;
}
.pp-ssb-widget-modern .pp-ssb-spotify.pp-ssb-btn-sq:not(.horizontal) {
border-left: 3px solid #3EB559;
padding-right: 10px;
}
.pp-ssb-widget-modern .pp-ssb-spotify .pp-ssb-ic {
background-position: 0 -307px;
}
.pp-ssb-widget-modern .pp-ssb-iheartradio.pp-ssb-btn-sq:not(.horizontal) {
border-left: 3px solid #960d16;
padding-right: 10px;
}
.pp-ssb-widget-modern .pp-ssb-iheartradio .pp-ssb-ic {
background-position: 0 -456px;
}
.pp-ssb-widget-modern .pp-ssb-deezer.pp-ssb-btn-sq:not(.horizontal) {
border-left: 3px solid #007feb;
padding-right: 10px;
}
.pp-ssb-widget-modern .pp-ssb-deezer .pp-ssb-ic {
background-position: 0 -507px;
}
.pp-ssb-widget-modern .pp-ssb-pandora.pp-ssb-btn-sq:not(.horizontal) {
border-left: 3px solid #3668ff;
padding-right: 10px;
}
.pp-ssb-widget-modern .pp-ssb-pandora .pp-ssb-ic {
background-position: 0 -555px;
}
.pp-ssb-widget-modern .pp-ssb-blubrry.pp-ssb-btn-sq:not(.horizontal) {
border-left: 3px solid #2278cf;
padding-right: 10px;
}
.pp-ssb-widget-modern .pp-ssb-blubrry .pp-ssb-ic {
background-position: 0 -603px;
}
.pp-ssb-widget-modern .pp-ssb-rss.pp-ssb-btn-sq:not(.horizontal) {
border-left: 3px solid #FF6600;
padding-right: 10px;
}
.pp-ssb-widget-modern .pp-ssb-rss .pp-ssb-ic {
background-position: 0 -355px;
}
.pp-ssb-widget-modern .pp-ssb-more.pp-ssb-btn-sq:not(.horizontal) {
border-left: 3px solid #333333;
padding-right: 10px;
}
.pp-ssb-widget-modern .pp-ssb-more .pp-ssb-ic {
background-position: 0 -405px;
}
.pp-ssb-widget-classic .pp-ssb-btn::after,
.pp-ssb-widget-classic .pp-ssb-btn-sq::after {
content: none;
}
.pp-ssb-widget-modern .pp-ssb-btn::after,
.pp-ssb-widget-modern .pp-ssb-btn-sq::after {
content: url("../images/arrow.svg");;
width: 20px;
display: inline-block;
float: right;
margin-top: 16px;
}
.horizontal.pp-ssb-btn::after, .horizontal.pp-ssb-btn-sq::after {
content: none;
}
.pp-ssb-nm {
line-height: 46px;
padding-left: 10px;
}
.go img {
height: 8px;
width: 30px;
float: right;
margin-top: 20px;
margin-right: 10px;
}
/* Retina-specific stuff here */
@media only screen and (-webkit-min-device-pixel-ratio: 2.0),
only screen and (min--moz-device-pixel-ratio: 2.0),
only screen and (-o-min-device-pixel-ratio: 200/100),
only screen and (min-device-pixel-ratio: 2.0) {
.pp-sub-ic {
background-image: url('../images/spriteRetina2.png');
}
}