400 lines
15 KiB
CSS
400 lines
15 KiB
CSS
|
|
.rescue-all {
|
|
font-family: inherit;
|
|
}
|
|
|
|
/*----------------------------------------------------*/
|
|
/* Clear Floats
|
|
/*----------------------------------------------------*/
|
|
.rescue-clear-floats { clear: both }
|
|
.rescue-clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
|
|
|
|
/*----------------------------------------------------*/
|
|
/* Spacing
|
|
/*----------------------------------------------------*/
|
|
.rescue-spacing { display: block; height: auto; margin: 0 !important; padding: 0 !important; background: none !important; border: none !important; outline: none !important; }
|
|
|
|
/*----------------------------------------------------*/
|
|
/* Columns
|
|
/*----------------------------------------------------*/
|
|
.rescue-one-half { width: 48% }
|
|
.rescue-one-third { width: 30.66% }
|
|
.rescue-two-third { width: 65.33% }
|
|
.rescue-one-fourth { width: 22% }
|
|
.rescue-three-fourth { width: 74% }
|
|
.rescue-one-fifth { width: 16.8% }
|
|
.rescue-two-fifth { width: 37.6% }
|
|
.rescue-three-fifth { width: 58.4% }
|
|
.rescue-one-sixth { width: 13.33% }
|
|
.rescue-one-half, .rescue-one-third, .rescue-two-third, .rescue-three-fourth, .rescue-one-fourth, .rescue-one-fifth, .rescue-two-fifth, .rescue-three-fifth, .rescue-one-sixth { position: relative; margin-right: 4%; margin-bottom: 2em; float: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
|
|
.rescue-column-last { margin-right: 0!important; clear: right; }
|
|
.rescue-column-last:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
|
|
|
|
/*----------------------------------------------------*/
|
|
/* Buttons
|
|
/*----------------------------------------------------*/
|
|
.rescue-button {
|
|
margin: 20px 5px 5px 0;
|
|
cursor: pointer;
|
|
display: inline-block;
|
|
white-space: nowrap;
|
|
text-align: center;
|
|
outline: none;
|
|
border-radius: 3px;
|
|
background: #aaaaaa;
|
|
text-decoration: none !important;
|
|
-o-transition: all 0.2s ease-in-out 0s;
|
|
-ms-transition: all 0.2s ease-in-out 0s;
|
|
-moz-transition: all 0.2s ease-in-out 0s;
|
|
-webkit-transition: all 0.2s ease-in-out 0s;
|
|
transition: all 0.2s ease-in-out 0s;
|
|
}
|
|
.rescue-button span.rescue-button-inner {
|
|
font-family: inherit;
|
|
display: block;
|
|
color: #fff;
|
|
font-weight: inherit;
|
|
font-size: 14px;
|
|
padding: 0.625rem 1.25rem 0.6875rem;
|
|
line-height: normal;
|
|
text-decoration: none;
|
|
text-align: center;
|
|
white-space: nowrap;
|
|
}
|
|
.rescue-button:focus, .rescue-button:hover, .rescue-button:active { opacity: 0.8; }
|
|
|
|
.rescue-button.black { background: #3c5166; }
|
|
.rescue-button.red { background: #e74c3c; }
|
|
.rescue-button.orange { background: #e67e22; }
|
|
.rescue-button.blue { background: #3498db;}
|
|
.rescue-button.green { background: #2ecc71; }
|
|
.rescue-button.white { background: #ecf0f1; }
|
|
.rescue-button.white span.rescue-button-inner { color: #95a5a6;}
|
|
|
|
.rescue-button.large { font-size: 16px }
|
|
.rescue-button.giant { font-size: 18px }
|
|
.rescue-button.left { float: left }
|
|
.rescue-button.right { float: right; margin-right: 0; margin-left: 5px; }
|
|
|
|
/*----------------------------------------------------*/
|
|
/* Highlights
|
|
/*----------------------------------------------------*/
|
|
.rescue-highlight-yellow, .rescue-highlight-yellow a { background-color: #FFF7A8; color: #695D43; }
|
|
.rescue-highlight-blue, .rescue-highlight-blue a { color: #5091b2; background: #e9f7fe; }
|
|
.rescue-highlight-green, .rescue-highlight-green a { color: #5f9025; background: #ebf6e0; }
|
|
.rescue-highlight-red, .rescue-highlight-red a { color: #de5959; background: #ffe9e9; }
|
|
.rescue-highlight-gray, .rescue-highlight-gray a { color: #666; background: #f9f9f9; }
|
|
|
|
/*----------------------------------------------------*/
|
|
/* Boxes
|
|
/*----------------------------------------------------*/
|
|
.rescue-box { display: block; padding: 10px 20px; margin: 10px 0px; font-size: 14px; font-weight: 600;
|
|
-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
|
|
-webkit-border-radius: 3px;
|
|
-moz-border-radius: 3px;
|
|
border-radius: 3px;
|
|
}
|
|
.rescue-box p:last-child { margin: 0 }
|
|
|
|
.rescue-box.left { float: left }
|
|
.rescue-box.right { float: right }
|
|
|
|
.rescue-box.gray { color: #666; background: #f9f9f9; border: 1px solid #ddd; }
|
|
.rescue-box.red { color: #de5959; background: #ffe9e9; border: 1px solid #fbc4c4; }
|
|
.rescue-box.green { color: #5f9025; background: #ebf6e0; border: 1px solid #b3dc82; }
|
|
.rescue-box.blue { color: #5091b2; background: #e9f7fe; border: 1px solid #b6d7e8; }
|
|
.rescue-box.yellow { color: #c4690e; background: #fffdf3; border: 1px solid #f2dfa4; }
|
|
|
|
/*----------------------------------------------------*/
|
|
/* Toggle
|
|
/*----------------------------------------------------*/
|
|
.rescue-toggle .rescue-toggle-trigger {
|
|
display: block;
|
|
color: #333333;
|
|
display: block;
|
|
padding: 15px 15px 15px 37px;
|
|
border: 1px solid #DFDFDF;
|
|
position: relative;
|
|
background: #fbfbfb;
|
|
outline: 0;
|
|
text-transform: none;
|
|
letter-spacing: normal;
|
|
font-weight: normal;
|
|
font-size: 14px;
|
|
line-height: 1.5em;
|
|
margin: 0;
|
|
margin-top: 10px;
|
|
cursor: pointer;
|
|
}
|
|
.rescue-toggle .rescue-toggle-trigger:before {
|
|
content: "\f067";
|
|
font-family: FontAwesome;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
color: #cccccc;
|
|
font-size: 15px;
|
|
padding-left: 1em;
|
|
position: absolute;
|
|
top: 15px;
|
|
left: 0;
|
|
}
|
|
.rescue-toggle .rescue-toggle-trigger:hover { border: 1px solid #c5c5c5; text-decoration: none; }
|
|
.rescue-toggle .rescue-toggle-trigger.active, .rescue-toggle .rescue-toggle-trigger.active:hover {
|
|
color: #333333;
|
|
background-color: #fbfbfb;
|
|
position: relative;
|
|
text-decoration: none;
|
|
}
|
|
.rescue-toggle .rescue-toggle-trigger.active:before {
|
|
content: "\f068";
|
|
font-family: FontAwesome;
|
|
font-style: normal;
|
|
font-weight: normal;
|
|
color: #cccccc;
|
|
font-size: 15px;
|
|
padding-left: 1em;
|
|
position: absolute;
|
|
top: 15px;
|
|
left: 0;
|
|
}
|
|
.rescue-toggle .rescue-toggle-container {
|
|
display: none;
|
|
overflow: hidden;
|
|
padding: 15px;
|
|
border: 1px solid #ddd;
|
|
border-top: 0px;
|
|
font-size:14px;
|
|
}
|
|
.rescue-toggle .rescue-toggle-container p {font-size:14px;padding:10px 20px 0;}
|
|
|
|
/*----------------------------------------------------*/
|
|
/* Tabs
|
|
/*----------------------------------------------------*/
|
|
.rescue-tabs ul.ui-tabs-nav { display: block; margin: 0; padding: 0; border-bottom: solid 1px #ddd; margin-left: 1px; }
|
|
.rescue-tabs ul.ui-tabs-nav li { display: block; width: auto; height: 40px; padding: 0 !important; float: left !important; margin: 0 !important; outline: none; }
|
|
.rescue-tabs ul.ui-tabs-nav li a {
|
|
display: block;
|
|
text-decoration: none;
|
|
width: auto;
|
|
height: 40px;
|
|
padding: 0px 20px;
|
|
line-height: 40px;
|
|
border: solid 1px #ddd;
|
|
border-width: 1px 1px 0 0;
|
|
margin: 0;
|
|
background-color: #FBFBFB;
|
|
font-size: 14px;
|
|
color: #444;
|
|
outline: none;
|
|
}
|
|
.rescue-tabs ul.ui-tabs-nav li a:hover { color: #373737; background: #ffffff; }
|
|
.rescue-tabs ul.ui-tabs-nav .ui-state-active a {
|
|
background: #fff;
|
|
height: 40px;
|
|
position: relative;
|
|
top: 1px;
|
|
padding-top: 0px;
|
|
border-left-width: 1px;
|
|
margin: 0 0 0 -1px;
|
|
color: #111 !important;
|
|
-moz-border-radius-topleft: 2px;
|
|
-webkit-border-top-left-radius: 2px;
|
|
border-top-left-radius: 2px;
|
|
-moz-border-radius-topright: 2px;
|
|
-webkit-border-top-right-radius: 2px;
|
|
border-top-right-radius: 2px;
|
|
}
|
|
.rescue-tabs ul.ui-tabs-nav .ui-state-active a:hover { background: #fff }
|
|
.rescue-tabs ul.ui-tabs-nav li:first-child .ui-state-active a { margin-left: 0 }
|
|
.rescue-tabs ul.ui-tabs-nav li:first-child a { border-width: 1px 1px 0 1px }
|
|
.rescue-tabs .tab-content { background: #fff; padding: 30px 20px 0; border-left: solid 1px #ddd; border-right: solid 1px #ddd; border-bottom: solid 1px #ddd; font-size: 14px; }
|
|
.rescue-tabs ul.tabs:before, ul.tabs:after { content: '\0020'; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; }
|
|
.rescue-tabs ul.tabs:after { clear: both }
|
|
.rescue-tabs ul.tabs { zoom: 1 }
|
|
.rescue-tabs .ui-tabs-hide { display: none }
|
|
.rescue-tabs:before, ul.rescue-tabs:after { content: '\0020'; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; }
|
|
.rescue-tabs:after { clear: both }
|
|
.rescue-tabs { zoom: 1 }
|
|
.rescue-tabs .ui-tabs-hide { display: none }
|
|
|
|
.rescue-tabs .ui-widget-header {
|
|
background: none;
|
|
border: none;
|
|
}
|
|
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
|
|
border: none;
|
|
background: none;
|
|
font-weight: 300;
|
|
color: #333;
|
|
}
|
|
|
|
|
|
/*----------------------------------------------------*/
|
|
/* Donation Tabs
|
|
/*----------------------------------------------------*/
|
|
.ui-widget-content {
|
|
border:none;
|
|
}
|
|
.rescue-donation-tabs {
|
|
width: 310px;
|
|
}
|
|
.rescue-donation-tabs p {
|
|
margin-bottom: .5rem;
|
|
}
|
|
.rescue-donation-tabs .rescue_donation_header{
|
|
height: 65px;
|
|
background-color: #34495e;
|
|
text-align: center;
|
|
text-transform: uppercase;
|
|
color: #ffffff;
|
|
font-size: 18px;
|
|
padding-top: 18px;
|
|
border-radius: 3px 3px 0 0;
|
|
}
|
|
.rescue-donation-tabs ul.ui-tabs-nav {
|
|
display: block;
|
|
margin: 0;
|
|
padding: 0;
|
|
margin-left: 1px;
|
|
border-top: 1px solid #ffffff;
|
|
}
|
|
.rescue-donation-tabs ul.ui-tabs-nav li {
|
|
display: block;
|
|
width: 33.333333333%;
|
|
height: 75px;
|
|
padding: 0 !important;
|
|
float: left !important;
|
|
margin: 0 !important;
|
|
outline: none;
|
|
}
|
|
.rescue-donation-tabs ul.ui-tabs-nav li a {
|
|
font-size: 14px;
|
|
color: #34495e;
|
|
display: block;
|
|
text-decoration: none;
|
|
text-transform: uppercase;
|
|
text-align: center;
|
|
background-color: #f9fafc;
|
|
width: auto;
|
|
height: 75px;
|
|
padding: 0 0;
|
|
margin: 0;
|
|
outline: none;
|
|
}
|
|
|
|
.rescue-donation-tabs ul.ui-tabs-nav li a span {
|
|
position: relative;
|
|
top: 30px;
|
|
}
|
|
|
|
.rescue-donation-tabs ul.ui-tabs-nav .ui-state-active a {
|
|
background: #dcdcdc;
|
|
height: 75px;
|
|
position: relative;
|
|
padding-top: 0px;
|
|
color: #34495e !important;
|
|
font-weight: 300;
|
|
}
|
|
.rescue-donation-tabs ul.ui-tabs-nav li a:hover {
|
|
background: #e4e4e4;
|
|
color: #34495e;
|
|
}
|
|
.rescue-donation-tabs ul.ui-tabs-nav .ui-state-active a:hover { }
|
|
.rescue-donation-tabs ul.ui-tabs-nav li:first-child .ui-state-active a { margin-left: 0 }
|
|
.rescue-donation-tabs ul.ui-tabs-nav li:first-child a { border-width: 1px 1px 0 1px }
|
|
.rescue-donation-tabs .tab-content {
|
|
height: 320px;
|
|
overflow: hidden;
|
|
background: #f6f6f6;
|
|
padding: 30px 20px 0;
|
|
font-size: 14px;
|
|
}
|
|
.rescue-donation-tabs ul.tabs:before, ul.tabs:after { content: '\0020'; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; }
|
|
.rescue-donation-tabs ul.tabs:after { clear: both }
|
|
.rescue-donation-tabs ul.tabs { zoom: 1 }
|
|
.rescue-donation-tabs .ui-tabs-hide { display: none }
|
|
.rescue-donation-tabs:before, ul.rescue-donation-tabs:after { content: '\0020'; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; }
|
|
.rescue-donation-tabs:after { clear: both }
|
|
.rescue-donation-tabs { zoom: 1 }
|
|
.rescue-donation-tabs .ui-tabs-hide { display: none }
|
|
|
|
/* force a height so the tabs don't jump as content height changes */
|
|
.rescue-donation-tabs .tabs-spacer { float: left; height: 200px; }
|
|
.tabs-bottom .ui-tabs-nav { clear: left; padding: 0 .2em .2em .2em;border:none; }
|
|
.tabs-bottom .ui-tabs-nav li { top: auto; bottom: 0; margin: 0 .2em 1px 0; border:none; }
|
|
.tabs-bottom .ui-tabs-nav li.ui-tabs-active { margin-top: -1px; padding-top: 1px; }
|
|
|
|
.rescue-donation-tabs .button {
|
|
border-radius: 4px;
|
|
font-size: 13px;
|
|
padding: 0.3rem 1.25rem 0.4rem;
|
|
display: inline-block;
|
|
background-color: #1ABC9C;
|
|
color: #FFFFFF;
|
|
cursor: pointer;
|
|
margin: 1.25rem 0;
|
|
position: relative;
|
|
float: right;
|
|
text-align: center;
|
|
text-decoration: none;
|
|
transition: background-color 300ms ease-out 0s;
|
|
}
|
|
.rescue-donation-tabs .button:focus, .rescue-donation-tabs .button:hover {
|
|
background-color: #15967D;
|
|
}
|
|
|
|
/*----------------------------------------------------*/
|
|
/* Google Map
|
|
/*----------------------------------------------------*/
|
|
.googlemap { position: relative; max-width: inherit; }
|
|
.googlemap .map_canvas { width: 100%; height: 100%; }
|
|
.googlemap .map_canvas h3 { margin: 0 0 10px; font-size: 14px; }
|
|
.map_canvas img { max-width: none !important }
|
|
|
|
/*----------------------------------------------------*/
|
|
/* Progress Bar
|
|
/*----------------------------------------------------*/
|
|
.rescue-progressbar { position: relative; display: block; margin-bottom: 15px; width: 100%; background: #eee; height: 35px; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; -webkit-transition: 0.4s linear; -moz-transition: 0.4s linear; -ms-transition: 0.4s linear; -o-transition: 0.4s linear; transition: 0.4s linear; -webkit-transition-property: width, background-color; -moz-transition-property: width, background-color; -ms-transition-property: width, background-color; -o-transition-property: width, background-color; transition-property: width, background-color; }
|
|
.rescue-progressbar-title { position: absolute; top: 0; left: 0; font-weight: bold; font-size: 13px; color: #fff; background: #6adcfa; -webkit-border-top-left-radius: 3px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-topleft: 3px; -moz-border-radius-bottomleft: 3px; border-top-left-radius: 3px; border-bottom-left-radius: 3px; }
|
|
.rescue-progressbar-title span { display: block; background: rgba(0,0,0,0.1); padding: 0 20px; height: 35px; line-height: 35px; -webkit-border-top-left-radius: 3px; -webkit-border-bottom-left-radius: 3px; -moz-border-radius-topleft: 3px; -moz-border-radius-bottomleft: 3px; border-top-left-radius: 3px; border-bottom-left-radius: 3px; }
|
|
.rescue-progressbar-bar { height: 35px; width: 0px; background: #6adcfa; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
|
|
.rescue-progress-bar-percent { position: absolute; right: 10px; top: 0; font-size: 11px; height: 35px; line-height: 35px; color: #444; color: rgba(0,0,0,0.4); }
|
|
|
|
/*----------------------------------------------------*/
|
|
/* Icons
|
|
/*----------------------------------------------------*/
|
|
.fa.pull-center {
|
|
margin:0 auto;
|
|
display: table!important;
|
|
}
|
|
|
|
/*----------------------------------------------------*/
|
|
/* Responsive
|
|
/*----------------------------------------------------*/
|
|
@media only screen and (max-width: 520px) {
|
|
.rescue-one-half, .rescue-one-third, .rescue-two-third, .rescue-three-fourth, .rescue-one-fourth, .rescue-one-fifth, .rescue-two-fifth, .rescue-three-fifth, .rescue-one-sixth { width: 100%; float: none; margin-right: 0; margin-bottom: 20px; }
|
|
.rescue-box, .rescue-box.left, .rescue-box.right { float: none; width: 100% !important; }
|
|
.rescue-tabs ul.ui-tabs-nav { margin-left: 0 }
|
|
.rescue-tabs ul.ui-tabs-nav li { width: 100% }
|
|
.rescue-tabs ul.ui-tabs-nav li a { border-left-width: 1px }
|
|
.rescue-tabs ul.ui-tabs-nav .ui-state-active a, .rescue-tabs ul.ui-tabs-nav .ui-state-active a:hover { height: 39px; padding-top: 0; margin-left: 0; top: auto; background-color: #eee; color: #000; font-weight: bold; }
|
|
|
|
}
|
|
.rescue-hidden-desktop,
|
|
.rescue-visible-phone,
|
|
.rescue-visible-tablet { display: none }
|
|
@media only screen and (max-width: 959px) {
|
|
.rescue-hidden-desktop { display: block }
|
|
.rescue-visible-desktop { display: none }
|
|
}
|
|
@media only screen and (min-width: 768px) and (max-width: 959px) {
|
|
.rescue-hidden-desktop { display: block }
|
|
.rescue-visible-desktop { display: none }
|
|
.rescue-hidden-tablet { display: none }
|
|
}
|
|
@media only screen and (max-width: 767px) {
|
|
.rescue-hidden-desktop { display: block }
|
|
.rescue-visible-desktop { display: none }
|
|
.rescue-hidden-phone { display: none }
|
|
}
|