/************************************ Swatches and Colors ***************************************/

#styleguide .brand .swatch {
    display: inline-block;
    width: 100%;
    height: 45px;
    vertical-align: top;
}

#styleguide .brand .legend {
	font-size:13px;
	margin-top:5px;
	padding-left:0px;
}


.txt-white {
	color:#fff;
}

.ft-h-blue {

	background-color:#dcf0fc;
}

.ft-light-grey {

	background-color:#fafafa;
}

.frk-white-bg{

    background-color:#fff;
}


/***************************************** Spacing  ************************************************/

.mt0 {
margin-top:0px !important;
}

.mt1 {
margin-top:15px;
}

.mt2 {
margin-top:30px;
}

.mt3 {
	margin-top:40px
}

.mb3 {
    margin-bottom: 40px;
}

.mb0 {
margin-bottom:0px;
}

.mb1 {
margin-bottom:15px;
}

.mb2 {
margin-bottom:30px;
}

.mr0 {
margin-right:0px;
}

.mr1 {
margin-right:15px;
}

.mr2 {
margin-right:30px;
}

.ml0 {
margin-left:0px;
}

.ml1 {
margin-left:15px;
}

.ml2 {
margin-left:30px;
}


.p1 {
	padding:15px;
}

.p2 {
	padding:30px;
}

.mt-2 {
    margin-top: -20px;	
}

#w1454738576386 h2 {
	display:none;
}

#w1454738580500 h2 {
	display:none;
}

/**************************************  Fonts  ************************************/

#styleguide .type {
	font-size: 5em;
	line-height: 1em;
}

#styleguide .trade {
	font-family:'Trade Gothic W01 Roman',arial,sans-serif;
}
#styleguide .tradeB {
	font-family: "Trade Gothic W01 Bold_2";
}

#styleguide .trade-condensed {
	font-family:'Trade Gothic W01 Cn_18',arial,sans-serif;
}

#styleguide .trade-condensedB {
font-family: 'TradeGothicW01-BoldCn20_675334',arial,sans-serif;
}

#styleguide .minion {
	font-family: 'Minion W01 Md',georgia,serif;
}

#styleguide .list-fonts {
    font-size: 32px;
}


/*********************************** Type ****************************************/

b, strong {
    font-weight: normal !important;
    font-family: "Trade Gothic W01 Bold_2";
}


.label-type {
font-size: 14px;
    color: #00a0dc;
    margin: 15px 0 0 0;
    padding: 0;
    display: inline-block;

}


.br-top {
    border-top: 1px solid #c9c9c9;
    margin-top: 30px;
    margin-bottom: 15px;
}

code, kbd, pre, samp {
    font-family: monospace,monospace;
    font-size: 1em;
    background-color: #f6dc6b;
}

.layout-example {
    width:100%;
    height:200px;
    background-color:#fff;
}

.layout-example-grey {
    width:100%;
    height:200px;
    background-color:#e8e8e8;
}

/******************************* Buttons *****************************************/

.btn-hover {
	background-color: #003865;
    border-color: #00335b;
    color: #ffffff;
}

.btn-default-hover {
	color: #005598;
    background-color: #e6e6e6;
    border-color: #00335b;
}


.btn-default-hover:hover, .btn-default-hover:focus, .btn-default-hover.focus, .btn-default-hover:active, .btn-default-hover.active, .open>.dropdown-toggle.btn-default-hover {
	color: #005598;
}

.btn-hover:hover, .btn-hover:focus, .btn-hover.focus, .btn-hover:active, .btn-hover.active, .open>.dropdown-toggle.btn-hover {
    color: #ffffff;
}

.btn-disabled:hover, .btn-disabled:focus, .btn-disabled.focus, .btn-disabled:active, .btn-disabled.active, .open>.dropdown-toggle.btn-disabled {
    color: #fff;
    background-color: #a7a7a7;
    border-color: #9a9a9a;
}

.btn-large {
	padding: 8px 24px !important;
}

.btn-banner {
    color: #005598;
    background: #fff;
}

.btn-banner:hover, .btn-banner:focus, .btn-banner.focus, .btn-banner:active, .btn-banner.active, .open>.dropdown-toggle.btn-banner {
    background-color: #005598;
    color: #fff;
}

.btn-banner-hover {
    background-color: #005598;
    color: #fff;
}

.btn-banner-hover:hover, .btn-banner-hover:focus, .btn-banner-hover.focus, .btn-banner-hover:active, .btn-banner-hover.active, .open>.dropdown-toggle.btn-banner-hover {
    background-color: #005598;
    color: #fff;
}

.examples div[class*="col-"] {
    background-color: #fff;
    border: 1px solid #a7a7a7;
    padding: 5px 15px;
}


@media only screen and (min-width: 768px) {

[data-fti-component="rich-text"] .panel {
    margin-bottom: 22px;
    border-radius: 3px;
    border-bottom: 1px solid #a7a7a7;
    margin-top: 15px;
}

.no-padding {
    padding:0px !important;
}

.pl0 {
    padding-left:0px;
}

.pr0 {

    padding-right:0px;
}


}

@media only screen and (max-width: 768px) {

#styleguide .swatch {
    display: inline-block;
    width: auto;
    height: 32px;
    vertical-align: top;
}
}


/***************************** Spinner ************************************/
.spinner-styleguide{
  margin: 0px auto;
  font-size: 10px;
  position: relative;
  text-indent: -9999em;
  border-top: 1.1em solid rgba(51, 51, 51, 0.2);
  border-right: 1.1em solid rgba(51, 51, 51, 0.2);
  border-bottom: 1.1em solid rgba(51, 51, 51, 0.2);
  border-left: 1.1em solid #333;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: spin 1.1s infinite linear;
  animation: spin 1.1s infinite linear;
}
.spinner-styleguide,
.spinner-styleguide:after {
  border-radius: 50%;
  width: 10em;
  height: 10em;
}

@-webkit-keyframes spin {
    from { -webkit-transform: rotate(0deg);}
    to { -webkit-transform: rotate(360deg);}
}