/* Overrides for user-agent and bootstrap styles. */
html {
/* Need this in order to get correct base font-size when using rem units */
font-size: 14px;
}
ul {
padding-left: 0;
}
ul ul,
ul ol,
ol ul {
padding-left: 20px;
}
/* //Overrides for user-agent and bootstrap styles. */
/* SlickEdit custom styles. */
/* rb - Use the "group" class on parent, instead of inserting
* after parent.
* This is the well-known "clearfix hack" that forces parent box top/bottom border to include
* child float elements. The reason for using this, instead of inserting an extra ..
,
* is to not pollute HTML content with layout, and not pollute the DOM.
*/
.group:before, .group:after {
content: "";
display: table;
}
.group:after {
clear: both;
}
.group {
zoom: 1; /* For IE6/7 (trigger hasLayout) */
}
div.se-page-content-wide, img.se-page-content-wide {
margin: 0;
/* art-Post-body enforces .5em left padding, so correct for that with -.5em left margin. */
margin-left: -.5em;
/* Span width of entire art-Post-body */
width: 985px;
}
/* scheme */
.se-scheme {
background-color: #fff;
color: #333;
/* Medium border width by default. Override with classes: border-thin, border-thick */
/* No borders by default. Turn on individual borders with classes: border-top, border-bottom, border-left, border-right */
border: medium solid #000;
border-style: none;
}
.se-scheme.border-top {
border-top-style: solid;
}
.se-scheme.no-border-top {
border-top-style: none;
}
.se-scheme.border-bottom {
border-bottom-style: solid;
}
.se-scheme.no-border-bottom {
border-bottom-style: none;
}
.se-scheme.border-left {
border-left-style: solid;
}
.se-scheme.no-border-left {
border-left-style: none;
}
.se-scheme.border-right {
border-right-style: solid;
}
.se-scheme.no-border-right {
border-right-style: none;
}
.se-scheme.border-all {
border-style: solid;
}
.se-scheme.border-none {
border-style: none;
}
.se-scheme.border-medium {
border-width: medium;
}
.se-scheme.border-thick {
border-width: thick;
}
.se-scheme.border-thin {
border-width: thin;
}
/* scheme: footer-lightblue */
.se-scheme.footer-lightblue {
background-color: #88bde7;
color: #333;
border-color: #393f4f;
border-width: thin;
border-top-style: solid;
}
.se-scheme.footer-lightblue a,
.se-scheme.footer-lightblue a:link,
.se-scheme.footer-lightblue a:visited {
color: #393f4f;
}
.se-scheme.footer-lightblue a:hover {
color: #000;
}
/* //scheme: footer-lightblue */
/* scheme: footer-darkblue */
.se-scheme.footer-darkblue {
background-color: #393f4f;
color: #eff1ef;
border-color: #000;
border-width: thin;
border-top-style: solid;
}
.se-scheme.footer-darkblue a,
.se-scheme.footer-darkblue a:link,
.se-scheme.footer-darkblue a:visited {
color: #eff1ef;
}
.se-scheme.footer-darkblue a:hover {
color: #eff1ef;
}
/* //scheme: footer-darkblue */
/* footnote */
.se-footnote {
background-color: #fff;
color: #999;
}
.se-footnote-text {
color: #999;
}
/* //footnote */
/* white */
.se-white {
background-color: #fff;
color: #333;
}
/* //white */
/* gray */
.se-gray {
background-color: #f4f4f4;
color: #333;
}
/* //gray */
/* orange (blue complement) */
.se-orange,
.se-blue-complement {
background-color: #da3b01;
color: #eff1ef;
}
.se-orange-text,
.se-blue-complement-text {
color: #da3b01;
}
/* //orange (blue complement) */
/* blue */
.se-blue {
background-color: #3782bb;
color: #eff1ef;
}
.se-blue-text {
color: #3782bb;
}
/* //blue */
/* green */
.se-green {
background-color: #73c166;
color: #eff1ef;
}
.se-green-text {
color: #73c166;
}
/* //green */
/* slickedit blue */
.se-slickedit-blue, .se-slickedit-blue a,
.se-button.slickedit-blue, .se-button.slickedit-blue a {
/* rb - Note that if you want to override border or border-bottom you MUST use !important */
background-color: #0077bb;
color: #eff1ef;
}
/* //slickedit blue */
/* slickedit lightblue */
.se-slickedit-blue-light,
.se-button.slickedit-blue-light, .se-button.slickedit-blue-light a,
.se-slickedit-lightblue,
.se-button.slickedit-lightblue, .se-button.slickedit-lightblue a {
background-color: #88bde7 !important;
color: #333;
}
/* //slickedit lightblue */
/* slickedit darkblue */
.se-slickedit-darkblue,
.se-button.slickedit-darkblue, .se-button.slickedit-darkblue a {
background-color: #393f4f !important;
color: #333;
}
/* //slickedit darkblue */
/* standard blue */
.se-standard-blue-background-color {
background-color: #dbf6f8;
}
.se-standard-blue-border-thick {
border: thick solid #32979e !important;
}
.se-standard-blue-border {
border: 2px solid #32979e !important;
}
.se-standard-blue-border-thin {
border: thin solid #32979e !important;
}
.se-standard-blue,
.se-button.standard-blue, .se-button.standard-blue a {
/* rb - Note that if you want to override border or border-bottom you MUST use !important */
background-color: #32979e;
color: #eff1ef;
}
.se-standard-blue-text {
color: #32979e;
}
/* //standard blue */
/* standard lightblue */
.se-standard-blue-light,
.se-button.standard-blue-light, .se-button.standard-blue-light a,
.se-standard-lightblue,
.se-button.standard-lightblue, .se-button.standard-lightblue a {
background-color: #dbf6f8 !important;
color: #333;
}
.se-button.standard-blue-light,
.se-button.standard-lightblue {
/* rb - Note that if you want to override border or border-bottom you MUST use !important */
/*border: 1px solid #32979e !important;*/
border: 1px solid #999 !important;
}
.se-standard-lightblue-text {
color: #dbf6f8;
}
/* //standard lightblue */
/* pro green */
.se-pro-green-background-color {
background-color: #e6f8e6;
}
.se-pro-green-border {
/*border: 2px solid #2d992d !important;*/
border: 2px solid #2d992d !important;
}
.se-pro-green-border-thick {
/*border: thick solid #2d992d !important;*/
border: thick solid #2d992d !important;
}
.se-pro-green-border-thin {
/*border: thin solid #2d992d !important;*/
border: thin solid #2d992d !important;
}
.se-pro-green, .se-pro-green a,
.se-button.pro-green, .se-button.pro-green a {
/* rb - Note that if you want to override border or border-bottom you MUST use !important */
background-color: #2d992d;/*#2d992d;*/
color: #eff1ef;
}
.se-pro-green-text {
color: #2d992d;
}
/* //pro green */
/* pro lightgreen */
.se-pro-green-light,
.se-button.pro-green-light, .se-button.pro-green-light a,
.se-pro-lightgreen,
.se-button.pro-lightgreen, .se-button.pro-lightgreen a {
background-color: #e6f8e6 !important;
color: #333;
}
.se-button.pro-green-light,
.se-button.pro-lightgreen {
/* rb - Note that if you want to override border or border-bottom you MUST use !important */
/*border: 1px solid #2d992d !important;*/
border: 1px solid #999 !important;
}
.se-pro-lightgreen-text {
color: #e6f8e6;
}
/* //pro lightgreen */
/* core purple */
.se-core-purple-border {
border: 2px solid #452663 !important;
}
.se-core-purple-border-thick {
border: thick solid #452663 !important;
}
.se-core-purple-border-thin {
border: thin solid #452663 !important;
}
.se-core-purple, .se-core-purple a,
.se-button.core-purple, .se-button.core-purple a {
/* rb - Note that if you want to override border or border-bottom you MUST use !important */
background-color: #452663;
color: #eff1ef;
}
.se-core-purple-text {
color: #452663;
}
/* //core purple */
/* core lightpurple */
.se-core-purple-light,
.se-button.core-purple-light, .se-button.core-purple-light a,
.se-core-lightpurple,
.se-button.core-lightpurple, .se-button.core-lightpurple a {
background-color: #d1ceec !important;
color: #333;
}
.se-button.core-purple-light,
.se-button.core-lightpurple {
/* rb - Note that if you want to override border or border-bottom you MUST use !important */
/*border: 1px solid #452663 !important;*/
border: 1px solid #999 !important;
}
/* //core lightpurple */
.se-box {
position: relative;
border-radius: 3px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
.se-box.no-border.no-border {
border: none;
}
.se-box.gray {
border: 1px solid #ccc;
background-color: #f4f4f4;
}
.se-box.white {
border: 1px solid #ccc;
background-color: #fff;
}
.se-caption-bar, .se-box-header, .se-box-footer {
padding: .5em .5em;
}
.se-thick-bottom {
border-bottom-width: 1em !important;
}
.se-lightgreen {
background-color: #ceeacd;
color: #333;
}
.se-slickedit-blue-text {
color: #0077bb;
}
ul.se-no-bullets.no-indent {
/* No indent for items */
margin-left: 0;
padding-left: 0;
}
ul.se-no-bullets li, .se-no-bullets ul li, .se-no-bullets ul { /* Cross-browser solution for omitting list bullet image. */
padding-left: 0;
margin-left: 0;
background-image: none;
background-repeat: no-repeat;
background-position: 0 center;
list-style: none;
}
.se-trial-box-content {
width: 80%;
padding: 5px;
}
.se-button {
border: none;
border-radius: 2px;
text-align: center;
margin: 10px;
padding: 7px 10px;
white-space: nowrap;
line-height: normal;
}
.se-button.square {
border-radius: 0;
}
span.se-button {
line-height: 3em;
}
.se-button a:hover {
text-decoration: none;
}
/*
SE-BUTTON-GROUP-V
A button grouped/stacked vertically with other buttons should all have same width.
Each se-button will be the width of the parent container (e.g. div).
*/
.se-button-group-v .se-button {
display: block;
width: 100%;
/*
Left/right margins and padding will just get you into trouble when vertically stacking
because they are not counted toward the width. If you are horizontally centering your
group of buttons (very likely), then 0 out margins/padding.
'Top margin is applied to buttons immediately preceded by sibling button
by the rule: '.se-button + .se-button'
Bottom margin is 0. The parent box of the grouped buttons should apply a bottom margin
to the last button in the group.
*/
margin: 0;
padding-left: 0;
padding-right: 0;
}
.se-button-group-v .se-button + .se-button {
margin-top: 10px;
}
/* //SE-BUTTON-GROUP-V */
/*
SE-BUTTON-GROUP-H
A button grouped/stacked horizontally with other buttons should all have same height.
Each se-button will be the height of the parent container (e.g. div).
*/
.se-button-group-h .se-button {
display: inline-block;
height: 100%;
/*
Top/bottom margins and padding will just get you into trouble when horizontally stacking
because they are not counted toward the height. If you are vertically centering your
group of buttons (very likely), then 0 out margins/padding.
'Left margin is applied to buttons immediately preceded by sibling button
by the rule: '.se-button + .se-button'
Right margin is 0. The parent box of the grouped buttons should apply a right margin
to the last button in the group.
*/
margin: 0;
padding-top: 0;
padding-bottom: 0;
}
.se-button-group-h .se-button + .se-button {
margin-left: 10px;
}
/* //SE-BUTTON-GROUP-H */
.se-button.blue, .se-button.blue a, .se-button.blue a:hover {
background-color: #0298d7;
color: #eff1ef;
text-decoration: none;
}
.se-button.blue:hover, .se-button.blue:hover a {
background-color: #0084bc;
-webkit-transition: background-color 250ms, color 250ms;
-moz-transition: background-color 250ms, color 250ms;
-o-transition: background-color 250ms, color 250ms;
transition: background-color 250ms, color 250ms;
}
.se-button.green, .se-button.green a, .se-button.green a:hover {
background-color: #73c166;
color: #eff1ef;
text-decoration: none;
}
.se-button.green:hover, .se-button.green:hover a {
background-color: #61a656;
-webkit-transition: background-color 250ms, color 250ms;
-moz-transition: background-color 250ms, color 250ms;
-o-transition: background-color 250ms, color 250ms;
transition: background-color 250ms, color 250ms;
}
.se-button.lightgreen, .se-button.lightgreen a, .se-button.lightgreen a:hover {
background-color: #ceeacd;
color: #333;
text-decoration: none;
}
.se-button.lightgreen:hover, .se-button.lightgreen:hover a {
color: #000;
text-decoration: underline;
}
.se-button.lightpurple, .se-button.lightpurple a, .se-button.lightpurple a:hover {
background-color: #d1ceec;
color: #333;
text-decoration: none;
}
.se-button.lightpurple:hover, .se-button.lightpurple:hover a {
color: #000;
text-decoration: underline;
}
.se-button.darkblue, .se-button.darkblue a, .se-button.darkblue a:hover {
background-color: #035a96;
color: #eff1ef;
text-decoration: none;
}
.se-fancy-blue-button {
border-top: 1px solid #0297d7;
background: #1c5b85;
background: -webkit-gradient(linear, left top, left bottom, from(#0297d7), to(#1c5b85));
background: -webkit-linear-gradient(top, #0297d7, #1c5b85);
background: -moz-linear-gradient(top, #0297d7, #1c5b85);
background: -ms-linear-gradient(top, #0297d7, #1c5b85);
background: -o-linear-gradient(top, #0297d7, #1c5b85);
padding: 5px 10px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
-webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
-moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
box-shadow: rgba(0,0,0,1) 0 1px 0;
text-shadow: rgba(0,0,0,.4) 0 1px 0;
color: #eff1ef;
font-family: Helvetica, Arial, Sans-Serif;
text-decoration: none;
vertical-align: middle;
}
.se-fancy-blue-button a {
color: #eff1ef;
}
.se-fancy-blue-button:hover, .se-fancy-blue-button a:hover {
border-top-color: #0297d7;
background: #0297d7;
color: #cccccc;
}
.se-fancy-blue-button:active, .se-fancy-blue-button a:active {
border-top-color: #0297d7;
background: #0297d7;
}
.se-fancy-pro-green-button {
border-top: 1px solid #2d992d;
background: #145914;
background: -webkit-gradient(linear, left top, left bottom, from(#2d992d), to(#145914));
background: -webkit-linear-gradient(top, #2d992d, #145914);
background: -moz-linear-gradient(top, #2d992d, #145914);
background: -ms-linear-gradient(top, #2d992d, #145914);
background: -o-linear-gradient(top, #2d992d, #145914);
padding: 5px 10px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
-webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
-moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
box-shadow: rgba(0,0,0,1) 0 1px 0;
text-shadow: rgba(0,0,0,.4) 0 1px 0;
color: #eff1ef;
font-family: Helvetica, Arial, Sans-Serif;
text-decoration: none;
vertical-align: middle;
}
.se-fancy-pro-green-button a {
color: #eff1ef;
}
.se-fancy-pro-green-button:hover a {
color: #eff1ef;
}
.se-fancy-pro-green-button:hover, .se-fancy-pro-green-button a:hover {
border-top-color: #2d992d;
background: #2d992d;
color: #eff1ef;
}
.se-fancy-pro-green-button:active, .se-fancy-pro-green-button a:active {
border-top-color: #2d992d;
background: #2d992d;
}
.se-fancy-core-purple-button {
border-top: 1px solid #452663;
border-top: 1px solid #452663;
background: #1d0536;
background: -webkit-gradient(linear, left top, left bottom, from(#452663), to(#1d0536));
background: -webkit-linear-gradient(top, #452663, #1d0536);
background: -moz-linear-gradient(top, #452663, #1d0536);
background: -ms-linear-gradient(top, #452663, #1d0536);
background: -o-linear-gradient(top, #452663, #1d0536);
padding: 5px 10px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
-webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
-moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
box-shadow: rgba(0,0,0,1) 0 1px 0;
text-shadow: rgba(0,0,0,.4) 0 1px 0;
color: #eff1ef;
font-family: Helvetica, Arial, Sans-Serif;
text-decoration: none;
vertical-align: middle;
}
.se-fancy-core-purple-button a {
color: #eff1ef;
}
.se-fancy-core-purple-button:hover, .se-fancy-core-purple-button a:hover {
border-top-color: #452663;
background: #452663;
color: #eff1ef;
}
.se-fancy-core-purple-button:active, .se-fancy-core-purple-button a:active {
border-top-color: #452663;
background: #452663;
}
.se-slick-table {
border-collapse: collapse;
/*border: 1px solid #cccccc;*/
border: none;
font: inherit;
width: 100%;
}
.se-slick-table img {
display: inline;
}
.se-slick-content {
line-height: normal;
}
.se-slick-col {
border-left: 1px solid #cccccc;
border-right: 1px solid #e0e0e0;
border-top: 1px solid #cccccc;
border-bottom: 1px solid #cccccc;
}
.se-slick-table tr {
border: none;
}
.se-slick-table td {
border: none;
}
tr.se-slick-row {
border-bottom: 1px solid #e0e0e0;
vertical-align: middle;
}
.se-slick-row td {
border: none;
}
.se-vertical-pad-5, .se-vertical-pad-5 td {
padding-top: 5px;
padding-bottom: 5px;
}
.se-slick-no-border {
/* This is a "mixin" class to selectively turn off borders for a row (e.g. se-compare-row) */
border-bottom: 0 none !important;
}
tr.se-slick-header-row {
border-bottom: 1px solid #006792;
vertical-align: bottom;
}
.se-slick-header-row td {
border: none;
}
.se-slick-header {
color: #006792;
font-size: 1.1em;
padding-top: 20px !important; /* rb - .art-article in template.css overrides this unless we use !important */
padding-bottom: 2px !important; /* rb - .art-article in template.css overrides this unless we use !important */
vertical-align: inherit;
}
.se-slick-subitem {
padding-top: 7px !important; /* rb - .art-article in template.css overrides this unless we use !important */
padding-bottom: 7px !important; /* rb - .art-article in template.css overrides this unless we use !important */
/*text-indent: 10px;*/
vertical-align: inherit;
}
.se-slick-item {
text-align: center;
vertical-align: inherit;
}
.se-slick-item-first {
vertical-align: inherit;
}
.se-slick-item-last {
padding-left: 7px !important; /* rb - .art-article in template.css overrides this unless we use !important */
padding-top: 7px !important; /* rb - .art-article in template.css overrides this unless we use !important */
padding-bottom: 5px !important; /* rb - .art-article in template.css overrides this unless we use !important */
vertical-align: inherit;
}
.se-toc ul li { /* Cross-browser solution for replacing list bullet image. */
background-image: url('/templates/purity_iii_slickedit/local/images/ArrowBullet.png' );
background-repeat: no-repeat;
background-position: 0px center;
list-style: none;
padding-left: 20px;
line-height: 2;
}
div.se-toc-box-first-pos {
float: left;
clear: left;
}
div.se-toc-box-middle-pos {
float: left;
}
div.se-toc-box-last-pos {
float: left;
clear: right;
}
.se-toc-header {
background-image: none !important; /* rb - .se-toc-box* in template.css overrides this unless we use !important */
padding-left: 3px !important; /* rb - .se-toc-box* in template.css overrides this unless we use !important */
}
div.se-feature-box {
position: relative;
padding: 20px 0 !important;
margin-top: 20px !important;
margin-bottom: 20px !important;
}
div.se-feature-box div.feature-box-inner {
position: relative;
display: block;
width: 100%;
border-collapse: collapse;
background-color: #f4f4f4;
border: none;/*1px solid #ccc;*/
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
div.se-feature-box div.picture-box {
display: inline-block;
width: 71%;
vertical-align: top;
padding: 1em;
border: 1px solid #ccc;/*none;*/
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
div.se-feature-box div.text-box {
position: absolute;
right: 4px;
top: 10px;
bottom: 10px;
width: 29%;
padding: 1em;
background-color: #fff;
border: 1px solid #ccc;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
box-shadow: 0 0 5px #888;
}
div.se-feature-box div.text-box p,li {
text-align: left;
}
div.se-feature-box div.item-video {
/* owlCarousel uses hqdefault.jpg key frames from img.youtube.com which are 360px high.
* Must fix the height of video preview key frames or else carousel is too tall for some
* reason (shrug).
*/
height: 360px !important;
}
div.se-feature-row {
position: relative;
width: 100%;
padding: 0 !important; /* rb - .art-contentLayout .art-content-wide overrides padding unless we use !important */
margin-top: 50px !important; /* rb - .art-contentLayout .art-content-wide overrides margin-top unless we use !important */
padding-bottom: 20px !important;
border-bottom: 3px solid #ccc;
}
div.se-feature-row .text-box h4 {
margin-top: 0;
}
div.se-feature-row .text-box,
div.se-feature-row .picture-box {
position: relative;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
@media (min-width: 768px) {
div.se-feature-row .text-box,
div.se-feature-row .picture-box {
width: 46%;
}
/* Even row left-to-right: text-box, picture-box */
div.se-feature-row .text-box {
float: left;
}
div.se-feature-row .picture-box {
float: right;
cursor: pointer;
}
/* Odd row left-to-right: picture-box, text-box */
div.se-feature-row:nth-of-type(even) .picture-box {
float: left;
}
div.se-feature-row:nth-of-type(even) .text-box {
float: right;
}
}
/* Fit IMG to container */
div.se-feature-row .picture-box img {
/* IMG can grow no larger than container size... */
max-width: 100%;
max-height: 100%;
/* ...while maintaining aspect ratio */
width: auto;
height: auto;
}
div.se-feature-row .picture-box img.magnifier {
position: absolute;
/* Do not let the responsive template override width, height */
width: 50px !important;
height: 50px !important;
left: 50%;
top: 50%;
margin-left: -25px;
margin-top: -25px;
}
div.se-feature-row .picture-box img.magnifier-multi-page {
position: absolute;
/* Do not let the responsive template override width, height */
width: 50px !important;
height: 50px !important;
left: 50%;
top: 50%;
margin-left: -25px;
margin-top: -25px;
}
div.meter {
border: 1px solid #333;
display: inline-block;
height: 10px;
margin: 0 auto;
}
div.meter span {
background: #fff;
border-left: 1px solid #333;
float: left;
height: 10px;
width: 14px;
}
div.meter span:first-child {
border: none;
}
div.meter span.filled {
background: #81b2d6;
}
/* se-*-arrow-list */
ul.se-blue-arrow-list.no-indent,
ul.se-green-arrow-list.no-indent,
ul.se-purple-arrow-list.no-indent,
ul.se-gray-arrow-list.no-indent,
ul.se-black-square-list.no-indent,
ul.se-gray-square-list.no-indent,
ul.se-blue-square-list.no-indent {
/* No indent for items */
margin-left: 0;
}
ul.se-blue-arrow-list li,
ul.se-green-arrow-list li,
ul.se-purple-arrow-list li,
ul.se-gray-arrow-list li,
ul.se-black-square-list li,
ul.se-gray-square-list li,
ul.se-blue-square-list li { /* Cross-browser solution for replacing list bullet image. */
background-repeat: no-repeat;
background-position: 0 0;
list-style: none;
padding-left: 20px;
margin-bottom: 10px;
}
ul.se-blue-arrow-list li {
background-image: url('/templates/purity_iii_slickedit/local/images/blue_arrow.png' );
}
ul.se-green-arrow-list li {
background-image: url('/templates/purity_iii_slickedit/local/images/green_arrow.png' );
}
ul.se-purple-arrow-list li {
background-image: url('/templates/purity_iii_slickedit/local/images/purple_arrow.png' );
}
ul.se-gray-arrow-list li {
background-image: url('/templates/purity_iii_slickedit/local/images/gray_arrow.png' );
}
ul.se-black-square-list li {
background-image: url('/templates/purity_iii_slickedit/local/images/black-square.png' );
}
ul.se-gray-square-list li {
background-image: url('/templates/purity_iii_slickedit/local/images/gray-square.png' );
}
ul.se-blue-square-list li {
background-image: url('/templates/purity_iii_slickedit/local/images/blue-square.png' );
}
/* //se-*-arrow-list */
/* BEGIN : SquareTabs tab-bar, tab-container */
ul.se-SquareTabs-tabbar {
margin: 0px;
border-bottom: 1px solid #000;
width: 100%;
height: 30px;
list-style-type: none;
list-style-image: none;
}
ul.se-SquareTabs-tabbar-expanding {
/* rb - Placeholder class. Make sure to include se-SquareTabs-tabbar when assigning class=... in html.
Custom Javascript looks for this class name and adjusts tab widths to take up entire width
of tabbar. */
}
li.se-SquareTabs-tab {
background-color: #fff;
position: relative;
border: 1px solid #a0a0a0;
border-bottom: 0 none;
border-top-left-radius: 2px;
border-top-right-radius: 2px;
float: left;
margin: 0px;
margin-left: -2px;
line-height: 28px;
padding: 0 5px 0 5px;
/*width: 25%;*/
min-width: 120px;
height: 29px;
text-align: center;
background-image: none !important; /* rb - .art-Post li in template.css overrides this unless we use !important */
cursor: pointer;
}
li.se-SquareTabs-tab a, li.se-SquareTabs-tab a:link, li.se-SquareTabs-tab a:visited, li.se-SquareTabs-tab a:hover {
text-decoration: none;
color: #000 !important;
}
li.se-SquareTabs-first-tab {
margin-left: 0px;
}
li.se-SquareTabs-middle-tab {
/* future */
}
li.se-SquareTabs-last-tab {
/* future */
}
li.se-SquareTabs-fake-tab {
/* Use se-fake-tab as the first/last tab to force a buffer at the beginning/end of tabbar */
border: 0 none !important;
margin-left: 0px !important;
cursor: auto !important;
}
li.se-SquareTabs-selected-tab {
height: 33px;
margin-top: -3px;
border: 1px solid #000;
border-bottom: 0 none;
z-index: 1;
font-weight: bold;
}
div.se-SquareTabs-tab-container {
border: 1px solid #000;
border-top: 0 none;
border-top-right-radius: 2px;
border-bottom-left-radius: 2px;
border-bottom-right-radius: 2px;
float: left;
margin: 0px;
padding: 0px;
width: 100%;
}
div.se-SquareTabs-tab-content {
padding: 10px;
}
/* END : SquareTabs tab-bar, tab-container */
/* BEGIN : MinimalTabs tab-bar, tab-container */
.se-MinimalTabs-tabbar-container {
box-sizing: border-box;
margin: 0;
border-bottom: 1px solid #e6e6e6;
/* Must force overflow:visible for case of art-content-wide mixin class */
overflow: visible !important;
width: 100%;
height: 1.5em;
font-size: inherit;
/* DO NOT inherit extra big line-height from body, since it causes item to overlap bottom border of container. */
line-height: normal !important;
}
ul.se-MinimalTabs-tabbar {
box-sizing: border-box;
margin: 0 auto;
width: auto;
height: 100%;
list-style-type: none;
list-style-image: none;
font-size: inherit;
text-align: center;
}
ul.se-MinimalTabs-tabbar-expanding {
/* rb - Placeholder class. Make sure to include se-MinimalTabs-tabbar when assigning class=... in html.
Custom Javascript looks for this class name and adjusts tab widths to take up entire width
of tabbar. */
}
li.se-MinimalTabs-tab {
box-sizing: border-box;
background-color: #fff;
position: relative;
border: 0 none;
float: none;
display: inline-block;
margin: 0 25px 0px 25px;
height: 100%;
padding: 0 !important;
background-image: none !important; /* rb - .art-Post li in template.css overrides this unless we use !important */
cursor: pointer;
font-size: inherit;
}
li.se-MinimalTabs-tab a, li.se-MinimalTabs-tab a:link, li.se-MinimalTabs-tab a:visited, li.se-MinimalTabs-tab a:hover {
text-decoration: none;
/*color: #e6e6e6 !important;*/
}
li.se-MinimalTabs-selected-tab a, li.se-selected-MinimalTabs-tab a:link, li.se-selected-MinimalTabs-tab a:visited, li.se-selected-MinimalTabs-tab a:hover {
text-decoration: none;
/*color: #000 !important;*/
}
li.se-MinimalTabs-first-tab {
/* future */
}
li.se-MinimalTabs-middle-tab {
/* future */
}
li.se-MinimalTabs-last-tab {
/* future */
}
li.se-MinimalTabs-fake-tab {
/* Use se-MinimalTabs-fake-tab as the first/last tab to force a buffer at the beginning/end of tabbar */
border: 0 none !important;
cursor: auto !important;
}
li.se-MinimalTabs-selected-tab, li.se-MinimalTabs-tab:hover {
/* Use content-box so that border-bottom overlaps border-bottom of se-MinimalTabs-tabbar-container */
box-sizing: content-box;
border-bottom: 1px solid #000 !important;
color: #000 !important;
}
div.se-MinimalTabs-tab-container {
border: 0 none;
float: left;
margin: 0px;
padding: 0px;
width: 100%;
}
div.se-MinimalTabs-tab-content {
padding: 10px;
}
/* END : MinimalTabs tab-bar, tab-container */
.se-headline {
color: #0077bb;
margin-top: 1.5em;
}
.se-byline {
font-size: 1.25em;
line-height: 1.45;
font-weight: normal;
margin: 0;
}
.se-intro-block {
display: block;
margin-bottom: 3em;
}
img.se-screenshot {
margin-top: 40px !important;
margin-bottom: 40px !important;
}
/* THIS IS GOLD, SO DO NOT LOSE THIS!!!
* If you have an IMG that you want to be max size while still completely contained inside a box (DIV),
* WITH THE SAME ASPECT RATIO, then put it inside a DIV as follows:
*
*
*
*
*
*