.BoxSizingIgnored {
    box-sizing:content-box;
}

/*
 * margins
 */
.TopGapTiny {
    margin-top:5px;
}

.TopGapSmall {
    margin-top:20px;
}

.TopGapMedium {
    margin-top:50px;
}

.TopGapBig {
    margin-top:100px;
}

.TopGapHuge {
    margin-top:200px;
}

.BottomGapBig {
    margin-bottom:100px;
}

.BottomGapMedium {
    margin-bottom:50px;
}

.BottomGapSmall {
    margin-bottom:20px;
}

.BottomGapTiny {
    margin-bottom:5px;
}

/*
 * paddings
 */

.PaddedLightly {
        padding:5px 7px 6px 7px;
}

.PaddedAmply {
        padding:15px 20px 16px 20px;
}

.TopPaddingTiny {
    padding-top:5px;
}

.TopPaddingSmall {
    padding-top:20px;
}

.TopPaddingMedium {
    padding-top:50px;
}

.TopPaddingBig {
    padding-top:100px;
}

.BottomPaddingTiny {
    padding-bottom:5px;
}

.BottomPaddingSmall {
    padding-bottom:20px;
}

.BottomPaddingMedium {
    padding-bottom:50px;
}

.BottomPaddingBig {
    padding-bottom:100px;
}

.RightPaddingTiny {
    padding-right:5px;
}

.RightPaddingSmall {
    padding-right:20px;
}

.RightPaddingMedium {
    padding-right:50px;
}

.RightPaddingBig {
    padding-right:100px;
}

.LeftPaddingTiny {
    padding-left:5px;
}

.LeftPaddingSmall {
    padding-left:20px;
}

.LeftPaddingMedium {
    padding-left:50px;
}

.LeftPaddingBig {
    padding-left:100px;
}

.SidePaddingSmall {
    padding-left:20px;
    padding-right:20px;
}

.SidePaddingTiny {
    padding-left:5px;
    padding-right:5px;
}






.BlockHighlighted {
    padding-left:12px;
    border-left:5px solid;
}

.Flex {
    display:flex;
}

.NoBullet {
    list-style:none;
}

.Block {
    display:block;
}

.Centered {
    margin-left:auto;
    margin-right:auto;
}

.CenterAligned {
    text-align:center;
}

.LeftAligned {
    text-align:left;
}

.RightAligned {
    text-align:right;
}

.CommonWidth {
    width:1024px;
}

.ModestWidth {
    width:850px;
}

.NarrowWidth {
    width:700px;
}

.SerifFaced {
    font-family:georgia;
}

.Big {
    font-size:1.4em;
    line-height:1.3em;
}

.Huge {
    font-size:2.3em;
    line-height:1.5em;
}

.LightFg {
    color:#ddd;
}

.LightBg {
    background-color:#eee;
}

.DarkFg {
    color:#333;
}

.DarkBg {
    background-color:#333;
    color:#ccc;
}

.DarkBg a {
    color:#fff;
}

.LightBg strong {
    color:#000;
    background-color:rgb(240,210,66, 0.5);
}

.DarkBg strong {
    color:#000;
    background-color:rgb(240,210,66);
}

.CardCheckOut:hover {
    filter:brightness(1.2);
}



ol.ShowNumbers > li {
    list-style:decimal;
}

ul.ShowDot > li,
ul.ShowDots > li {
    list-style:disc;
}

/*
 * Forms
 */
button.Rounded {
    border-radius:3px;
}

label.Padded {
    padding:5px 5px 5px 5px;
}

button.Padded {
    padding:10px 10px 11px 10px;
}

input.Padded {
    padding:5px 7px 3px 7px;
}

input[type=checkbox]:not(old),
input[type=radio   ]:not(old){
  width     : 2em;
  margin    : 0;
  padding   : 0;
  font-size : 1em;
  opacity   : 0;
}

input[type=checkbox]:not(old) + label,
input[type=radio   ]:not(old) + label{
  display      : inline-block;
  margin-left  : -2em;
  line-height  : 1.5em;
}

input[type=checkbox]:not(old) + span,
input[type=radio]:not(old) + span{
  display          : inline-block;
  width            : 1.85em;
  height           : 1.85em;
  margin           : 0px 5px 1px -2em;
  
  vertical-align   : bottom;
}

input[type=checkbox]:not(old):checked + span,
input[type=radio   ]:not(old):checked + span {
}


input[type=radio]:not(old):checked + span > span:before
,input[type=checkbox]:not(old):checked + span > span:before {
    content     : '✓';
  display          : block;
  width            : 100%;
  height           : 83%;
  text-align  : center;
    font-size:1.75em;
  font-weight : bold;
    padding-top:17%;
}


.DarkBg input[type=radio]:not(old):checked + span > span:before
,.DarkBg input[type=checkbox]:not(old):checked + span > span:before {
    background       : rgba(255, 255, 255, 0.3);
    color:#ccc;
 }

input[type=radio]:not(old):checked + span > span:before
,input[type=checkbox]:not(old):checked + span > span:before {
     background       : rgba(100, 100, 100, 0.3);
     color:#333;
}

/*
 * Cursor
 */
.ShowsPointer {
    cursor:pointer;
}

/*
 * Widths
 */
.FullWidth {
    width:100%;
}

.FullHeight {
    height:100%;
}

/*
 * Backgrounds
 */
.Transparent {
    background-color:transparent;
}


.LightlyTransparent {
    background-color:rgba(255, 255, 255, 0.1);
}


.DarkBg .LightlyTransparent {
    color:#ddd;
}

.DarkBg input.LightlyTransparent:placeholder {
    color:#999;
}

.DarkBg input.LightlyTransparent:invalid {
    transition: background-color 1s linear;
    background-color:rgba(255, 255, 255, 0.1);
}

.DarkBg input.LightlyTransparent:valid {
    background-color:rgba(255, 255, 255, 0.3);
transition: background-color .5s linear;
}

.DarkBg button {
    background-color:rgba(255, 255, 255, 0.3);
    color:#ddd;
}



.Highlighted {
    background-color:rgb(240, 210, 66);
    color:#000;
}

/*
 * Borders
 */
.LightBordered {
    border-color:#333;
}

.DarkBg .LightBordered {
    border-color:#fff;
}

.RoundBordered {
    border-radius:3px;
}

.Underdotted {
    border-width:0px;
    border-bottom-width:1px;
    border-style:dotted;
}



/*
 *
 */
.TrackedLittle {
    letter-spacing:0.05em;
}

.NonBreaking {
    white-space:nowrap;
}




/*
 *
 */
.Bolded {
    font-weight:bold;
}

.Unbolded {
    font-weight:normal;
}




.LeftQuoted::before {
    content:"“ ";
    margin-left:-.5em;
}

.LeftIndentedContent {
    padding-left:1em;
}