styles/3rd.css
/***
Spectrum Colorpicker v1.7.1
https://github.com/bgrins/spectrum
Author: Brian Grinstead
License: MIT
***/
.sp-container {
position:absolute;
top:0;
left:0;
display:inline-block;
*display: inline;
*zoom: 1;
/* https://github.com/bgrins/spectrum/issues/40 */
z-index: 9999994;
overflow: hidden;
}
.sp-container.sp-flat {
position: relative;
}
/* Fix for * { box-sizing: border-box; } */
.sp-container,
.sp-container * {
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}
/* http://ansciath.tumblr.com/post/7347495869/css-aspect-ratio */
.sp-top {
position:relative;
width: 100%;
display:inline-block;
}
.sp-top-inner {
position:absolute;
top:0;
left:0;
bottom:0;
right:0;
}
.sp-color {
position: absolute;
top:0;
left:0;
bottom:0;
right:20%;
}
.sp-hue {
position: absolute;
top:0;
right:0;
bottom:0;
left:84%;
height: 100%;
}
.sp-clear-enabled .sp-hue {
top:33px;
height: 77.5%;
}
.sp-fill {
padding-top: 80%;
}
.sp-sat, .sp-val {
position: absolute;
top:0;
left:0;
right:0;
bottom:0;
}
.sp-alpha-enabled .sp-top {
margin-bottom: 18px;
}
.sp-alpha-enabled .sp-alpha {
display: block;
}
.sp-alpha-handle {
position:absolute;
top:-4px;
bottom: -4px;
width: 6px;
left: 50%;
cursor: pointer;
border: 1px solid black;
background: white;
opacity: .8;
}
.sp-alpha {
display: none;
position: absolute;
bottom: -14px;
right: 0;
left: 0;
height: 8px;
}
.sp-alpha-inner {
border: solid 1px #333;
}
.sp-clear {
display: none;
}
.sp-clear.sp-clear-display {
background-position: center;
}
.sp-clear-enabled .sp-clear {
display: block;
position:absolute;
top:0px;
right:0;
bottom:0;
left:84%;
height: 28px;
}
/* Don't allow text selection */
.sp-container, .sp-replacer, .sp-preview, .sp-dragger, .sp-slider, .sp-alpha, .sp-clear, .sp-alpha-handle, .sp-container.sp-dragging .sp-input, .sp-container button {
-webkit-user-select:none;
-moz-user-select: -moz-none;
-o-user-select:none;
user-select: none;
}
.sp-container.sp-input-disabled .sp-input-container {
display: none;
}
.sp-container.sp-buttons-disabled .sp-button-container {
display: none;
}
.sp-container.sp-palette-buttons-disabled .sp-palette-button-container {
display: none;
}
.sp-palette-only .sp-picker-container {
display: none;
}
.sp-palette-disabled .sp-palette-container {
display: none;
}
.sp-initial-disabled .sp-initial {
display: none;
}
/* Gradients for hue, saturation and value instead of images. Not pretty... but it works */
.sp-sat {
background-image: -webkit-gradient(linear, 0 0, 100% 0, from(#FFF), to(rgba(204, 154, 129, 0)));
background-image: -webkit-linear-gradient(left, #FFF, rgba(204, 154, 129, 0));
background-image: -moz-linear-gradient(left, #fff, rgba(204, 154, 129, 0));
background-image: -o-linear-gradient(left, #fff, rgba(204, 154, 129, 0));
background-image: -ms-linear-gradient(left, #fff, rgba(204, 154, 129, 0));
background-image: linear-gradient(to right, #fff, rgba(204, 154, 129, 0));
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType = 1, startColorstr=#FFFFFFFF, endColorstr=#00CC9A81)";
filter : progid:DXImageTransform.Microsoft.gradient(GradientType = 1, startColorstr='#FFFFFFFF', endColorstr='#00CC9A81');
}
.sp-val {
background-image: -webkit-gradient(linear, 0 100%, 0 0, from(#000000), to(rgba(204, 154, 129, 0)));
background-image: -webkit-linear-gradient(bottom, #000000, rgba(204, 154, 129, 0));
background-image: -moz-linear-gradient(bottom, #000, rgba(204, 154, 129, 0));
background-image: -o-linear-gradient(bottom, #000, rgba(204, 154, 129, 0));
background-image: -ms-linear-gradient(bottom, #000, rgba(204, 154, 129, 0));
background-image: linear-gradient(to top, #000, rgba(204, 154, 129, 0));
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00CC9A81, endColorstr=#FF000000)";
filter : progid:DXImageTransform.Microsoft.gradient(startColorstr='#00CC9A81', endColorstr='#FF000000');
}
.sp-hue {
background: -moz-linear-gradient(top, #ff0000 0%, #ffff00 17%, #00ff00 33%, #00ffff 50%, #0000ff 67%, #ff00ff 83%, #ff0000 100%);
background: -ms-linear-gradient(top, #ff0000 0%, #ffff00 17%, #00ff00 33%, #00ffff 50%, #0000ff 67%, #ff00ff 83%, #ff0000 100%);
background: -o-linear-gradient(top, #ff0000 0%, #ffff00 17%, #00ff00 33%, #00ffff 50%, #0000ff 67%, #ff00ff 83%, #ff0000 100%);
background: -webkit-gradient(linear, left top, left bottom, from(#ff0000), color-stop(0.17, #ffff00), color-stop(0.33, #00ff00), color-stop(0.5, #00ffff), color-stop(0.67, #0000ff), color-stop(0.83, #ff00ff), to(#ff0000));
background: -webkit-linear-gradient(top, #ff0000 0%, #ffff00 17%, #00ff00 33%, #00ffff 50%, #0000ff 67%, #ff00ff 83%, #ff0000 100%);
background: linear-gradient(to bottom, #ff0000 0%, #ffff00 17%, #00ff00 33%, #00ffff 50%, #0000ff 67%, #ff00ff 83%, #ff0000 100%);
}
/* IE filters do not support multiple color stops.
Generate 6 divs, line them up, and do two color gradients for each.
Yes, really.
*/
.sp-1 {
height:17%;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0000', endColorstr='#ffff00');
}
.sp-2 {
height:16%;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffff00', endColorstr='#00ff00');
}
.sp-3 {
height:17%;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ff00', endColorstr='#00ffff');
}
.sp-4 {
height:17%;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffff', endColorstr='#0000ff');
}
.sp-5 {
height:16%;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0000ff', endColorstr='#ff00ff');
}
.sp-6 {
height:17%;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff00ff', endColorstr='#ff0000');
}
.sp-hidden {
display: none !important;
}
/* Clearfix hack */
.sp-cf:before, .sp-cf:after { content: ""; display: table; }
.sp-cf:after { clear: both; }
.sp-cf { *zoom: 1; }
/* Mobile devices, make hue slider bigger so it is easier to slide */
@media (max-device-width: 480px) {
.sp-color { right: 40%; }
.sp-hue { left: 63%; }
.sp-fill { padding-top: 60%; }
}
.sp-dragger {
border-radius: 5px;
height: 5px;
width: 5px;
border: 1px solid #fff;
background: #000;
cursor: pointer;
position:absolute;
top:0;
left: 0;
}
.sp-slider {
position: absolute;
top:0;
cursor:pointer;
height: 3px;
left: -1px;
right: -1px;
border: 1px solid #000;
background: white;
opacity: .8;
}
/*
Theme authors:
Here are the basic themeable display options (colors, fonts, global widths).
See http://bgrins.github.io/spectrum/themes/ for instructions.
*/
.sp-container {
border-radius: 0;
background-color: #ECECEC;
border: solid 1px #f0c49B;
padding: 0;
}
.sp-container, .sp-container button, .sp-container input, .sp-color, .sp-hue, .sp-clear {
font: normal 12px "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
.sp-top {
margin-bottom: 3px;
}
.sp-color, .sp-hue, .sp-clear {
border: solid 1px #666;
}
/* Input */
.sp-input-container {
float:right;
width: 100px;
margin-bottom: 4px;
}
.sp-initial-disabled .sp-input-container {
width: 100%;
}
.sp-input {
font-size: 12px !important;
border: 1px inset;
padding: 4px 5px;
margin: 0;
width: 100%;
background:transparent;
border-radius: 3px;
color: #222;
}
.sp-input:focus {
border: 1px solid orange;
}
.sp-input.sp-validation-error {
border: 1px solid red;
background: #fdd;
}
.sp-picker-container , .sp-palette-container {
float:left;
position: relative;
padding: 10px;
padding-bottom: 300px;
margin-bottom: -290px;
}
.sp-picker-container {
width: 172px;
border-left: solid 1px #fff;
}
/* Palettes */
.sp-palette-container {
border-right: solid 1px #ccc;
}
.sp-palette-only .sp-palette-container {
border: 0;
}
.sp-palette .sp-thumb-el {
display: block;
position:relative;
float:left;
width: 24px;
height: 15px;
margin: 3px;
cursor: pointer;
border:solid 2px transparent;
}
.sp-palette .sp-thumb-el:hover, .sp-palette .sp-thumb-el.sp-thumb-active {
border-color: orange;
}
.sp-thumb-el {
position:relative;
}
/* Initial */
.sp-initial {
float: left;
border: solid 1px #333;
}
.sp-initial span {
width: 30px;
height: 25px;
border:none;
display:block;
float:left;
margin:0;
}
.sp-initial .sp-clear-display {
background-position: center;
}
/* Buttons */
.sp-palette-button-container,
.sp-button-container {
float: right;
}
/* Replacer (the little preview div that shows up instead of the <input>) */
.sp-replacer {
margin:0;
overflow:hidden;
cursor:pointer;
padding: 4px;
display:inline-block;
*zoom: 1;
*display: inline;
border: solid 1px #91765d;
background: #eee;
color: #333;
vertical-align: middle;
}
.sp-replacer:hover, .sp-replacer.sp-active {
border-color: #F0C49B;
color: #111;
}
.sp-replacer.sp-disabled {
cursor:default;
border-color: silver;
color: silver;
}
.sp-dd {
padding: 2px 0;
height: 16px;
line-height: 16px;
float:left;
font-size:10px;
}
.sp-preview {
position:relative;
width:25px;
height: 20px;
border: solid 1px #222;
margin-right: 5px;
float:left;
z-index: 0;
}
.sp-palette {
*width: 220px;
max-width: 220px;
}
.sp-palette .sp-thumb-el {
width:16px;
height: 16px;
margin:2px 1px;
border: solid 1px #d0d0d0;
}
.sp-container {
padding-bottom:0;
}
/* Buttons: http://hellohappy.org/css3-buttons/ */
.sp-container button {
background-color: #eeeeee;
background-image: -webkit-linear-gradient(top, #eeeeee, #cccccc);
background-image: -moz-linear-gradient(top, #eeeeee, #cccccc);
background-image: -ms-linear-gradient(top, #eeeeee, #cccccc);
background-image: -o-linear-gradient(top, #eeeeee, #cccccc);
background-image: linear-gradient(to bottom, #eeeeee, #cccccc);
border: 1px solid #ccc;
border-bottom: 1px solid #bbb;
border-radius: 3px;
color: #333;
font-size: 14px;
line-height: 1;
padding: 5px 4px;
text-align: center;
text-shadow: 0 1px 0 #eee;
vertical-align: middle;
}
.sp-container button:hover {
background-color: #dddddd;
background-image: -webkit-linear-gradient(top, #dddddd, #bbbbbb);
background-image: -moz-linear-gradient(top, #dddddd, #bbbbbb);
background-image: -ms-linear-gradient(top, #dddddd, #bbbbbb);
background-image: -o-linear-gradient(top, #dddddd, #bbbbbb);
background-image: linear-gradient(to bottom, #dddddd, #bbbbbb);
border: 1px solid #bbb;
border-bottom: 1px solid #999;
cursor: pointer;
text-shadow: 0 1px 0 #ddd;
}
.sp-container button:active {
border: 1px solid #aaa;
border-bottom: 1px solid #888;
-webkit-box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee;
-moz-box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee;
-ms-box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee;
-o-box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee;
box-shadow: inset 0 0 5px 2px #aaaaaa, 0 1px 0 0 #eeeeee;
}
.sp-cancel {
font-size: 11px;
color: #d93f3f !important;
margin:0;
padding:2px;
margin-right: 5px;
vertical-align: middle;
text-decoration:none;
}
.sp-cancel:hover {
color: #d93f3f !important;
text-decoration: underline;
}
.sp-palette span:hover, .sp-palette span.sp-thumb-active {
border-color: #000;
}
.sp-preview, .sp-alpha, .sp-thumb-el {
position:relative;
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAIAAADZF8uwAAAAGUlEQVQYV2M4gwH+YwCGIasIUwhT25BVBADtzYNYrHvv4gAAAABJRU5ErkJggg==);
}
.sp-preview-inner, .sp-alpha-inner, .sp-thumb-inner {
display:block;
position:absolute;
top:0;left:0;bottom:0;right:0;
}
.sp-palette .sp-thumb-inner {
background-position: 50% 50%;
background-repeat: no-repeat;
}
.sp-palette .sp-thumb-light.sp-thumb-active .sp-thumb-inner {
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAIVJREFUeNpiYBhsgJFMffxAXABlN5JruT4Q3wfi/0DsT64h8UD8HmpIPCWG/KemIfOJCUB+Aoacx6EGBZyHBqI+WsDCwuQ9mhxeg2A210Ntfo8klk9sOMijaURm7yc1UP2RNCMbKE9ODK1HM6iegYLkfx8pligC9lCD7KmRof0ZhjQACDAAceovrtpVBRkAAAAASUVORK5CYII=);
}
.sp-palette .sp-thumb-dark.sp-thumb-active .sp-thumb-inner {
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAadEVYdFNvZnR3YXJlAFBhaW50Lk5FVCB2My41LjEwMPRyoQAAAMdJREFUOE+tkgsNwzAMRMugEAahEAahEAZhEAqlEAZhEAohEAYh81X2dIm8fKpEspLGvudPOsUYpxE2BIJCroJmEW9qJ+MKaBFhEMNabSy9oIcIPwrB+afvAUFoK4H0tMaQ3XtlrggDhOVVMuT4E5MMG0FBbCEYzjYT7OxLEvIHQLY2zWwQ3D+9luyOQTfKDiFD3iUIfPk8VqrKjgAiSfGFPecrg6HN6m/iBcwiDAo7WiBeawa+Kwh7tZoSCGLMqwlSAzVDhoK+6vH4G0P5wdkAAAAASUVORK5CYII=);
}
.sp-clear-display {
background-repeat:no-repeat;
background-position: center;
background-image: url(data:image/gif;base64,R0lGODlhFAAUAPcAAAAAAJmZmZ2dnZ6enqKioqOjo6SkpKWlpaampqenp6ioqKmpqaqqqqurq/Hx8fLy8vT09PX19ff39/j4+Pn5+fr6+vv7+wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEAAP8ALAAAAAAUABQAAAihAP9FoPCvoMGDBy08+EdhQAIJCCMybCDAAYUEARBAlFiQQoMABQhKUJBxY0SPICEYHBnggEmDKAuoPMjS5cGYMxHW3IiT478JJA8M/CjTZ0GgLRekNGpwAsYABHIypcAgQMsITDtWJYBR6NSqMico9cqR6tKfY7GeBCuVwlipDNmefAtTrkSzB1RaIAoXodsABiZAEFB06gIBWC1mLVgBa0AAOw==);
}
@media only screen and (max-width:60em){.pws_tabs_container.pws_tabs_responsive{width:100%!important}.pws_tabs_container.pws_tabs_responsive ul.pws_tabs_controll{width:100%}.pws_tabs_container.pws_tabs_responsive ul.pws_tabs_controll li{vertical-align:top;text-align:center}.pws_tabs_container.pws_tabs_responsive ul.pws_tabs_controll li a{margin:0;font-size:1em;line-height:1.125em;overflow:hidden}.pws_tabs_container.pws_tabs_responsive ul.pws_tabs_controll li a i{display:block;margin:0 0 5px}.pws_tabs_container.pws_tabs_responsive.pws_tabs_vertical{display:block;position:relative}.pws_tabs_container.pws_tabs_responsive.pws_tabs_vertical:after{display:block;content:'';clear:both}.pws_tabs_container.pws_tabs_responsive.pws_tabs_vertical ul.pws_tabs_controll{width:100%;position:relative;float:none}.pws_tabs_container.pws_tabs_responsive.pws_tabs_vertical ul.pws_tabs_controll li{display:inline-block}.pws_tabs_container.pws_tabs_responsive.pws_tabs_vertical ul.pws_tabs_controll li a{margin:0}.pws_tabs_container.pws_tabs_responsive.pws_tabs_vertical .pws_tabs_list{position:relative;float:none}}@media only screen and (max-width:37.5em){.pws_tabs_container.pws_tabs_responsive{width:100%!important;position:relative}.pws_tabs_container.pws_tabs_responsive .pws_responsive_small_menu{width:100%;height:40px;background-color:#9bd7d5;display:block}.pws_tabs_container.pws_tabs_responsive .pws_responsive_small_menu a{width:40px;height:40px;display:block;overflow:hidden;color:#fff;font-size:32px;font-size:2em;text-align:center;padding:3px 0 0;cursor:pointer;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box}.pws_tabs_container.pws_tabs_responsive .pws_responsive_small_menu a:hover{background-color:#70c5c2}.pws_tabs_container.pws_tabs_responsive ul.pws_tabs_controll.pws_tabs_menu_popup{display:block;position:absolute;overflow:hidden;top:40px;left:0;z-index:99;margin:0;padding:0;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box}.pws_tabs_container.pws_tabs_responsive ul.pws_tabs_controll.pws_tabs_menu_popup li{display:block;float:none}.pws_tabs_container.pws_tabs_responsive ul.pws_tabs_controll.pws_tabs_menu_popup li a i{display:inline-block;margin:0 .1875em 0 0}.pws_tabs_container.pws_tabs_responsive.pws_tabs_rtl ul.pws_tabs_controll.pws_tabs_menu_popup li a i{display:inline-block;margin:0 0 0 .1875em}}.pws_tabs_container{width:100%}.pws_tabs_container ul.pws_tabs_controll{list-style:none;margin:0;padding:0}.pws_tabs_container ul.pws_tabs_controll li{display:inline-block}.pws_tabs_container ul.pws_tabs_controll li a{display:block;background-color:#9bd7d5;padding:.9375em 1.25em;text-decoration:none;color:#fff;margin-right:3px;cursor:pointer}.pws_tabs_container ul.pws_tabs_controll li a:hover{background-color:#70c5c2}.pws_tabs_container ul.pws_tabs_controll li a i{margin-right:8px}.pws_tabs_container ul.pws_tabs_controll li a.pws_tab_noname i{margin-right:0;margin-left:0}.pws_tabs_container ul.pws_tabs_controll li a.pws_tab_active{background-color:#fff;color:#505050}.pws_tabs_list{display:block;background-color:#fff;height:auto;padding:1.25em;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-webkit-transition:all .3s ease-in-out .3s;-o-transition:all .3s ease-in-out .3s;transition:all .3s ease-in-out .3s;overflow:hidden;position:relative}.pws_tab_single{position:absolute;top:20px;padding-right:1.25em;-webkit-transition:all .3s ease-in-out 0;-o-transition:all .3s ease-in-out 0;transition:all .3s ease-in-out 0}.pws_tabs_container.pws_tabs_rtl{text-align:right;direction:rtl}.pws_tabs_container.pws_tabs_rtl ul.pws_tabs_controll li a{margin-right:0;margin-left:3px}.pws_tabs_container.pws_tabs_rtl ul.pws_tabs_controll li a i{margin-left:8px;margin-right:0}.pws_tabs_container.pws_tabs_rtl .pws_tab_single{padding-right:0;padding-left:1.25em}.pws_tabs_container.pws_tabs_vertical{display:block;position:relative}.pws_tabs_container.pws_tabs_vertical:after{display:block;content:'';clear:both}.pws_tabs_container.pws_tabs_vertical ul.pws_tabs_controll{width:auto;position:relative;float:left}.pws_tabs_container.pws_tabs_vertical ul.pws_tabs_controll li{display:block}.pws_tabs_container.pws_tabs_vertical ul.pws_tabs_controll li a{margin-right:0;margin-left:0;margin-bottom:3px}.pws_tabs_container.pws_tabs_vertical .pws_tabs_list{position:relative;float:left}.pws_tabs_container.pws_tabs_responsive.pws_theme_violet .pws_responsive_small_menu{background-color:#c72c66}.pws_tabs_container.pws_tabs_responsive.pws_theme_violet .pws_responsive_small_menu a:hover{background-color:#a6164c}.pws_tabs_container.pws_theme_violet ul.pws_tabs_controll li a{background-color:#c72c66}.pws_tabs_container.pws_theme_violet ul.pws_tabs_controll li a:hover{background-color:#a6164c}.pws_tabs_container.pws_theme_violet ul.pws_tabs_controll li a.pws_tab_active{background-color:#fff}.pws_tabs_container.pws_tabs_responsive.pws_theme_green .pws_responsive_small_menu{background-color:#86c447}.pws_tabs_container.pws_tabs_responsive.pws_theme_green .pws_responsive_small_menu a:hover{background-color:#539312}.pws_tabs_container.pws_theme_green ul.pws_tabs_controll li a{background-color:#86c447}.pws_tabs_container.pws_theme_green ul.pws_tabs_controll li a:hover{background-color:#539312}.pws_tabs_container.pws_theme_green ul.pws_tabs_controll li a.pws_tab_active{background-color:#fff}.pws_tabs_container.pws_tabs_responsive.pws_theme_yellow .pws_responsive_small_menu{background-color:#fdb813}.pws_tabs_container.pws_tabs_responsive.pws_theme_yellow .pws_responsive_small_menu a:hover{background-color:orange}.pws_tabs_container.pws_theme_yellow ul.pws_tabs_controll li a{background-color:#fdb813}.pws_tabs_container.pws_theme_yellow ul.pws_tabs_controll li a:hover{background-color:orange}.pws_tabs_container.pws_theme_yellow ul.pws_tabs_controll li a.pws_tab_active{background-color:#fff}.pws_tabs_container.pws_tabs_responsive.pws_theme_gold .pws_responsive_small_menu{background-color:#f89827}.pws_tabs_container.pws_tabs_responsive.pws_theme_gold .pws_responsive_small_menu a:hover{background-color:#fa7b00}.pws_tabs_container.pws_theme_gold ul.pws_tabs_controll li a{background-color:#f89827}.pws_tabs_container.pws_theme_gold ul.pws_tabs_controll li a:hover{background-color:#fa7b00}.pws_tabs_container.pws_theme_gold ul.pws_tabs_controll li a.pws_tab_active{background-color:#fff}.pws_tabs_container.pws_tabs_responsive.pws_theme_orange .pws_responsive_small_menu{background-color:#f15b42}.pws_tabs_container.pws_tabs_responsive.pws_theme_orange .pws_responsive_small_menu a:hover{background-color:#fd2e0b}.pws_tabs_container.pws_theme_orange ul.pws_tabs_controll li a{background-color:#f15b42}.pws_tabs_container.pws_theme_orange ul.pws_tabs_controll li a:hover{background-color:#fd2e0b}.pws_tabs_container.pws_theme_orange ul.pws_tabs_controll li a.pws_tab_active{background-color:#fff}.pws_tabs_container.pws_tabs_responsive.pws_theme_red .pws_responsive_small_menu{background-color:#e41937}.pws_tabs_container.pws_tabs_responsive.pws_theme_red .pws_responsive_small_menu a:hover{background-color:#d70726}.pws_tabs_container.pws_theme_red ul.pws_tabs_controll li a{background-color:#e41937}.pws_tabs_container.pws_theme_red ul.pws_tabs_controll li a:hover{background-color:#d70726}.pws_tabs_container.pws_theme_red ul.pws_tabs_controll li a.pws_tab_active{background-color:#fff}.pws_tabs_container.pws_tabs_responsive.pws_theme_purple .pws_responsive_small_menu{background-color:#672e8d}.pws_tabs_container.pws_tabs_responsive.pws_theme_purple .pws_responsive_small_menu a:hover{background-color:#470871}.pws_tabs_container.pws_theme_purple ul.pws_tabs_controll li a{background-color:#672e8d}.pws_tabs_container.pws_theme_purple ul.pws_tabs_controll li a:hover{background-color:#470871}.pws_tabs_container.pws_theme_purple ul.pws_tabs_controll li a.pws_tab_active{background-color:#fff}.pws_tabs_container.pws_tabs_responsive.pws_theme_grey .pws_responsive_small_menu{background-color:#4d4d4f}.pws_tabs_container.pws_tabs_responsive.pws_theme_grey .pws_responsive_small_menu a:hover{background-color:#000}.pws_tabs_container.pws_theme_grey ul.pws_tabs_controll li a{background-color:#4d4d4f}.pws_tabs_container.pws_theme_grey ul.pws_tabs_controll li a:hover{background-color:#000}.pws_tabs_container.pws_theme_grey ul.pws_tabs_controll li a.pws_tab_active{background-color:#fff}.pws_tabs_container.pws_tabs_responsive.pws_theme_dark_violet .pws_responsive_small_menu{background-color:#c72c66}.pws_tabs_container.pws_tabs_responsive.pws_theme_dark_violet .pws_responsive_small_menu a:hover{background-color:#a6164c}.pws_tabs_container.pws_theme_dark_violet .pws_tabs_list{background-color:#fafafa}.pws_tabs_container.pws_theme_dark_violet ul.pws_tabs_controll li a{background-color:#c72c66}.pws_tabs_container.pws_theme_dark_violet ul.pws_tabs_controll li a:hover{background-color:#a6164c}.pws_tabs_container.pws_theme_dark_violet ul.pws_tabs_controll li a.pws_tab_active{background-color:#fafafa}.pws_tabs_container.pws_tabs_responsive.pws_theme_dark_green .pws_responsive_small_menu{background-color:#86c447}.pws_tabs_container.pws_tabs_responsive.pws_theme_dark_green .pws_responsive_small_menu a:hover{background-color:#539312}.pws_tabs_container.pws_theme_dark_green .pws_tabs_list{background-color:#fafafa}.pws_tabs_container.pws_theme_dark_green ul.pws_tabs_controll li a{background-color:#86c447}.pws_tabs_container.pws_theme_dark_green ul.pws_tabs_controll li a:hover{background-color:#539312}.pws_tabs_container.pws_theme_dark_green ul.pws_tabs_controll li a.pws_tab_active{background-color:#fafafa}.pws_tabs_container.pws_tabs_responsive.pws_theme_dark_yellow .pws_responsive_small_menu{background-color:#fdb813}.pws_tabs_container.pws_tabs_responsive.pws_theme_dark_yellow .pws_responsive_small_menu a:hover{background-color:orange}.pws_tabs_container.pws_theme_dark_yellow .pws_tabs_list{background-color:#fafafa}.pws_tabs_container.pws_theme_dark_yellow ul.pws_tabs_controll li a{background-color:#fdb813}.pws_tabs_container.pws_theme_dark_yellow ul.pws_tabs_controll li a:hover{background-color:orange}.pws_tabs_container.pws_theme_dark_yellow ul.pws_tabs_controll li a.pws_tab_active{background-color:#fafafa}.pws_tabs_container.pws_tabs_responsive.pws_theme_dark_gold .pws_responsive_small_menu{background-color:#f89827}.pws_tabs_container.pws_tabs_responsive.pws_theme_dark_gold .pws_responsive_small_menu a:hover{background-color:#fa7b00}.pws_tabs_container.pws_theme_dark_gold .pws_tabs_list{background-color:#fafafa}.pws_tabs_container.pws_theme_dark_gold ul.pws_tabs_controll li a{background-color:#f89827}.pws_tabs_container.pws_theme_dark_gold ul.pws_tabs_controll li a:hover{background-color:#fa7b00}.pws_tabs_container.pws_theme_dark_gold ul.pws_tabs_controll li a.pws_tab_active{background-color:#fafafa}.pws_tabs_container.pws_tabs_responsive.pws_theme_dark_orange .pws_responsive_small_menu{background-color:#f15b42}.pws_tabs_container.pws_tabs_responsive.pws_theme_dark_orange .pws_responsive_small_menu a:hover{background-color:#fd2e0b}.pws_tabs_container.pws_theme_dark_orange .pws_tabs_list{background-color:#fafafa}.pws_tabs_container.pws_theme_dark_orange ul.pws_tabs_controll li a{background-color:#f15b42}.pws_tabs_container.pws_theme_dark_orange ul.pws_tabs_controll li a:hover{background-color:#fd2e0b}.pws_tabs_container.pws_theme_dark_orange ul.pws_tabs_controll li a.pws_tab_active{background-color:#fafafa}.pws_tabs_container.pws_tabs_responsive.pws_theme_dark_red .pws_responsive_small_menu{background-color:#e41937}.pws_tabs_container.pws_tabs_responsive.pws_theme_dark_red .pws_responsive_small_menu a:hover{background-color:#d70726}.pws_tabs_container.pws_theme_dark_red .pws_tabs_list{background-color:#fafafa}.pws_tabs_container.pws_theme_dark_red ul.pws_tabs_controll li a{background-color:#e41937}.pws_tabs_container.pws_theme_dark_red ul.pws_tabs_controll li a:hover{background-color:#d70726}.pws_tabs_container.pws_theme_dark_red ul.pws_tabs_controll li a.pws_tab_active{background-color:#fafafa}.pws_tabs_container.pws_tabs_responsive.pws_theme_dark_purple .pws_responsive_small_menu{background-color:#672e8d}.pws_tabs_container.pws_tabs_responsive.pws_theme_dark_purple .pws_responsive_small_menu a:hover{background-color:#470871}.pws_tabs_container.pws_theme_dark_purple .pws_tabs_list{background-color:#fafafa}.pws_tabs_container.pws_theme_dark_purple ul.pws_tabs_controll li a{background-color:#672e8d}.pws_tabs_container.pws_theme_dark_purple ul.pws_tabs_controll li a:hover{background-color:#470871}.pws_tabs_container.pws_theme_dark_purple ul.pws_tabs_controll li a.pws_tab_active{background-color:#fafafa}.pws_tabs_container.pws_tabs_responsive.pws_theme_dark_grey .pws_responsive_small_menu{background-color:#4d4d4f}.pws_tabs_container.pws_tabs_responsive.pws_theme_dark_grey .pws_responsive_small_menu a:hover{background-color:#000}.pws_tabs_container.pws_theme_dark_grey .pws_tabs_list{background-color:#fafafa}.pws_tabs_container.pws_theme_dark_grey ul.pws_tabs_controll li a{background-color:#4d4d4f}.pws_tabs_container.pws_theme_dark_grey ul.pws_tabs_controll li a:hover{background-color:#000}.pws_tabs_container.pws_theme_dark_grey ul.pws_tabs_controll li a.pws_tab_active{background-color:#fafafa}.pws_tabs_container.pws_tabs_responsive.pws_theme_dark_cyan .pws_responsive_small_menu{background-color:#9bd7d5}.pws_tabs_container.pws_tabs_responsive.pws_theme_dark_cyan .pws_responsive_small_menu a:hover{background-color:#70c5c2}.pws_tabs_container.pws_theme_dark_cyan .pws_tabs_list{background-color:#fafafa}.pws_tabs_container.pws_theme_dark_cyan ul.pws_tabs_controll li a{background-color:#9bd7d5}.pws_tabs_container.pws_theme_dark_cyan ul.pws_tabs_controll li a:hover{background-color:#70c5c2}.pws_tabs_container.pws_theme_dark_cyan ul.pws_tabs_controll li a.pws_tab_active{background-color:#fafafa}.pws_tabs_noeffect .pws_tabs_list{-webkit-transition:all .1s ease-in-out 0;-o-transition:all .1s ease-in-out 0;transition:all .1s ease-in-out 0}.pws_tabs_noeffect .pws_tab_single{-webkit-transition:none;-o-transition:none;transition:none}.pws_tabs_container.pws_none .pws_hide{display:none}.pws_tabs_container.pws_none .pws_show{display:block}.pws_tabs_container.pws_scale .pws_hide{-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter:alpha(opacity=0);opacity:0;-webkit-transform:scale(.9);-o-transform:scale(.9);-ms-transform:scale(.9);transform:scale(.9);-webkit-transition:all .3s ease-in-out .3s;-o-transition:all .3s ease-in-out .3s;transition:all .3s ease-in-out .3s}.pws_tabs_container.pws_scale .pws_show{z-index:1;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";filter:alpha(opacity=100);opacity:1;-webkit-transform:scale(1);-o-transform:scale(1);-ms-transform:scale(1);transform:scale(1);-webkit-transition:all .3s ease-in-out .3s;-o-transition:all .3s ease-in-out .3s;transition:all .3s ease-in-out .3s}.pws_tabs_container.pws_slideleft .pws_hide{-webkit-transform:translateX(-100%);-o-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter:alpha(opacity=0);opacity:0;-webkit-transition:all .3s ease-in-out .3s;-o-transition:all .3s ease-in-out .3s;transition:all .3s ease-in-out .3s}.pws_tabs_container.pws_slideleft .pws_show{-webkit-transform:translateX(0);-o-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";filter:alpha(opacity=100);opacity:1;-webkit-transition:all .3s ease-in-out .3s;-o-transition:all .3s ease-in-out .3s;transition:all .3s ease-in-out .3s}.pws_tabs_container.pws_slideright .pws_hide{-webkit-transform:translateX(200%);-o-transform:translateX(200%);-ms-transform:translateX(200%);transform:translateX(200%);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter:alpha(opacity=0);opacity:0;-webkit-transition:all .3s ease-in-out .3s;-o-transition:all .3s ease-in-out .3s;transition:all .3s ease-in-out .3s}.pws_tabs_container.pws_slideright .pws_show{-webkit-transform:translateX(0);-o-transform:translateX(0);-ms-transform:translateX(0);transform:translateX(0);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";filter:alpha(opacity=100);opacity:1;-webkit-transition:all .3s ease-in-out .3s;-o-transition:all .3s ease-in-out .3s;transition:all .3s ease-in-out .3s}.pws_tabs_container.pws_slidetop .pws_hide{-webkit-transform:translateY(-100%);-o-transform:translateY(-100%);-ms-transform:translateY(-100%);transform:translateY(-100%);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter:alpha(opacity=0);opacity:0;-webkit-transition:all .3s ease-in-out .3s;-o-transition:all .3s ease-in-out .3s;transition:all .3s ease-in-out .3s}.pws_tabs_container.pws_slidetop .pws_show{-webkit-transform:translateY(0);-o-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";filter:alpha(opacity=100);opacity:1;-webkit-transition:all .3s ease-in-out .3s;-o-transition:all .3s ease-in-out .3s;transition:all .3s ease-in-out .3s}.pws_tabs_container.pws_slidedown .pws_hide{-webkit-transform:translateY(200%);-o-transform:translateY(200%);-ms-transform:translateY(200%);transform:translateY(200%);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter:alpha(opacity=0);opacity:0;-webkit-transition:all .3s ease-in-out .3s;-o-transition:all .3s ease-in-out .3s;transition:all .3s ease-in-out .3s}.pws_tabs_container.pws_slidedown .pws_show{-webkit-transform:translateY(0);-o-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";filter:alpha(opacity=100);opacity:1;-webkit-transition:all .3s ease-in-out .3s;-o-transition:all .3s ease-in-out .3s;transition:all .3s ease-in-out .3s}
/*
* Skeleton V2.0.4
* Copyright 2014, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 12/29/2014
*/
/* Table of contents
––––––––––––––––––––––––––––––––––––––––––––––––––
- Grid
- Base Styles
- Typography
- Links
- Buttons
- Forms
- Lists
- Code
- Tables
- Spacing
- Utilities
- Clearing
- Media Queries
*/
/* Grid
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.container {
position: relative;
width: 100%;
max-width: 960px;
margin: 0 auto;
padding: 0 20px;
box-sizing: border-box; }
.column,
.columns {
width: 100%;
float: left;
box-sizing: border-box; }
/* For devices larger than 400px */
@media (min-width: 400px) {
.container {
width: 85%;
padding: 0; }
}
/* For devices larger than 550px */
@media (min-width: 550px) {
.container {
width: 80%; }
.column,
.columns {
margin-left: 4%; }
.column:first-child,
.columns:first-child {
margin-left: 0; }
.one.column,
.one.columns { width: 4.66666666667%; }
.two.columns { width: 13.3333333333%; }
.three.columns { width: 22%; }
.four.columns { width: 30.6666666667%; }
.five.columns { width: 39.3333333333%; }
.six.columns { width: 48%; }
.seven.columns { width: 56.6666666667%; }
.eight.columns { width: 65.3333333333%; }
.nine.columns { width: 74.0%; }
.ten.columns { width: 82.6666666667%; }
.eleven.columns { width: 91.3333333333%; }
.twelve.columns { width: 100%; margin-left: 0; }
.one-third.column { width: 30.6666666667%; }
.two-thirds.column { width: 65.3333333333%; }
.one-half.column { width: 48%; }
/* Offsets */
.offset-by-one.column,
.offset-by-one.columns { margin-left: 8.66666666667%; }
.offset-by-two.column,
.offset-by-two.columns { margin-left: 17.3333333333%; }
.offset-by-three.column,
.offset-by-three.columns { margin-left: 26%; }
.offset-by-four.column,
.offset-by-four.columns { margin-left: 34.6666666667%; }
.offset-by-five.column,
.offset-by-five.columns { margin-left: 43.3333333333%; }
.offset-by-six.column,
.offset-by-six.columns { margin-left: 52%; }
.offset-by-seven.column,
.offset-by-seven.columns { margin-left: 60.6666666667%; }
.offset-by-eight.column,
.offset-by-eight.columns { margin-left: 69.3333333333%; }
.offset-by-nine.column,
.offset-by-nine.columns { margin-left: 78.0%; }
.offset-by-ten.column,
.offset-by-ten.columns { margin-left: 86.6666666667%; }
.offset-by-eleven.column,
.offset-by-eleven.columns { margin-left: 95.3333333333%; }
.offset-by-one-third.column,
.offset-by-one-third.columns { margin-left: 34.6666666667%; }
.offset-by-two-thirds.column,
.offset-by-two-thirds.columns { margin-left: 69.3333333333%; }
.offset-by-one-half.column,
.offset-by-one-half.columns { margin-left: 52%; }
}
/* Base Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/* NOTE
html is set to 62.5% so that all the REM measurements throughout Skeleton
are based on 10px sizing. So basically 1.5rem = 15px :) */
html {
font-size: 62.5%; }
body {
font-size: 1.5em; /* currently ems cause chrome bug misinterpreting rems on body element */
line-height: 1.6;
font-weight: 400;
font-family: "Raleway", "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
color: #222; }
/* Typography
–––––––––––––––––––––––––––––––––––––––––––––––––– */
h1, h2, h3, h4, h5, h6 {
margin-top: 0;
margin-bottom: 2rem;
font-weight: 300; }
h1 { font-size: 4.0rem; line-height: 1.2; letter-spacing: -.1rem;}
h2 { font-size: 3.6rem; line-height: 1.25; letter-spacing: -.1rem; }
h3 { font-size: 3.0rem; line-height: 1.3; letter-spacing: -.1rem; }
h4 { font-size: 2.4rem; line-height: 1.35; letter-spacing: -.08rem; }
h5 { font-size: 1.8rem; line-height: 1.5; letter-spacing: -.05rem; }
h6 { font-size: 1.5rem; line-height: 1.6; letter-spacing: 0; }
/* Larger than phablet */
@media (min-width: 550px) {
h1 { font-size: 5.0rem; }
h2 { font-size: 4.2rem; }
h3 { font-size: 3.6rem; }
h4 { font-size: 3.0rem; }
h5 { font-size: 2.4rem; }
h6 { font-size: 1.5rem; }
}
p {
margin-top: 0; }
/* Links
–––––––––––––––––––––––––––––––––––––––––––––––––– */
a {
color: #1EAEDB; }
a:hover {
color: #0FA0CE; }
/* Buttons
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
display: inline-block;
height: 38px;
padding: 0 30px;
color: #555;
text-align: center;
font-size: 11px;
font-weight: 600;
line-height: 38px;
letter-spacing: .1rem;
text-transform: uppercase;
text-decoration: none;
white-space: nowrap;
background-color: transparent;
border-radius: 4px;
border: 1px solid #bbb;
cursor: pointer;
box-sizing: border-box; }
.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
.button:focus,
button:focus,
input[type="submit"]:focus,
input[type="reset"]:focus,
input[type="button"]:focus {
color: #333;
border-color: #888;
outline: 0; }
.button.button-primary,
button.button-primary,
input[type="submit"].button-primary,
input[type="reset"].button-primary,
input[type="button"].button-primary {
color: #FFF;
background-color: #33C3F0;
border-color: #33C3F0; }
.button.button-primary:hover,
button.button-primary:hover,
input[type="submit"].button-primary:hover,
input[type="reset"].button-primary:hover,
input[type="button"].button-primary:hover,
.button.button-primary:focus,
button.button-primary:focus,
input[type="submit"].button-primary:focus,
input[type="reset"].button-primary:focus,
input[type="button"].button-primary:focus {
color: #FFF;
background-color: #1EAEDB;
border-color: #1EAEDB; }
/* Forms
–––––––––––––––––––––––––––––––––––––––––––––––––– */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea,
select {
height: 38px;
padding: 6px 10px; /* The 6px vertically centers text on FF, ignored by Webkit */
background-color: #fff;
border: 1px solid #D1D1D1;
border-radius: 4px;
box-shadow: none;
box-sizing: border-box; }
/* Removes awkward default styles on some inputs for iOS */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none; }
textarea {
min-height: 65px;
padding-top: 6px;
padding-bottom: 6px; }
input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="text"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
border: 1px solid #33C3F0;
outline: 0; }
label,
legend {
display: block;
margin-bottom: .5rem;
font-weight: 600; }
fieldset {
padding: 0;
border-width: 0; }
input[type="checkbox"],
input[type="radio"] {
display: inline; }
label > .label-body {
display: inline-block;
margin-left: .5rem;
font-weight: normal; }
/* Lists
–––––––––––––––––––––––––––––––––––––––––––––––––– */
ul {
list-style: circle inside; }
ol {
list-style: decimal inside; }
ol, ul {
padding-left: 0;
margin-top: 0; }
ul ul,
ul ol,
ol ol,
ol ul {
margin: 1.5rem 0 1.5rem 3rem;
font-size: 90%; }
li {
margin-bottom: 1rem; }
/* Code
–––––––––––––––––––––––––––––––––––––––––––––––––– */
code {
padding: .2rem .5rem;
margin: 0 .2rem;
font-size: 90%;
white-space: nowrap;
background: #F1F1F1;
border: 1px solid #E1E1E1;
border-radius: 4px; }
pre > code {
display: block;
padding: 1rem 1.5rem;
white-space: pre; }
/* Spacing
–––––––––––––––––––––––––––––––––––––––––––––––––– */
button,
.button {
margin-bottom: 1rem; }
input,
textarea,
select,
fieldset {
margin-bottom: 1.5rem; }
pre,
blockquote,
dl,
figure,
table,
p,
ul,
ol,
form {
margin-bottom: 2.5rem; }
/* Utilities
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.u-full-width {
width: 100%;
box-sizing: border-box; }
.u-max-full-width {
max-width: 100%;
box-sizing: border-box; }
.u-pull-right {
float: right; }
.u-pull-left {
float: left; }
/* Misc
–––––––––––––––––––––––––––––––––––––––––––––––––– */
hr {
margin-top: 3rem;
margin-bottom: 3.5rem;
border-width: 0;
border-top: 1px solid #E1E1E1; }
/* Clearing
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Self Clearing Goodness */
.container:after,
.row:after,
.u-cf {
content: "";
display: table;
clear: both; }
/* Media Queries
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/*
Note: The best way to structure the use of media queries is to create the queries
near the relevant code. For example, if you wanted to change the styles for buttons
on small devices, paste the mobile query code up in the buttons section and style it
there.
*/
/* Larger than mobile */
@media (min-width: 400px) {}
/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {}
/* Larger than tablet */
@media (min-width: 750px) {}
/* Larger than desktop */
@media (min-width: 1000px) {}
/* Larger than Desktop HD */
@media (min-width: 1200px) {}