*,
*:before,
*:after {
  -webkit-box-sizing:border-box;
  box-sizing:border-box
}
a:focus {
  -webkit-box-shadow:none !important;
  box-shadow: none !important
}
img {
  max-width:100%
}
::-webkit-input-placeholder {
  font-style: italic;
  color:#505050;
  padding-left:.625em
}
:-moz-placeholder {
  font-style: italic;
  color:#505050;
  padding-left:.625em
}
::-moz-placeholder {
  font-style: italic;
  color:#505050;
  padding-left:.625em
}
:-ms-input-placeholder {
  font-style: italic;
  color:#505050;
  padding-left:.625em
}
.left {
  float:left
}
.right{
  float:right
}
.fullwidth {
  width:100% !important;
  margin: 2em 0
}
.disabled {
  opacity: .6
}
.rm_input {
  margin:2% 2% 0 0;
  float:left
}

.clearfix{
  clear:both
}
.clearfix:before,
.clearfix:after,
.row:before,
.row:after {
  content:"";
  display:table
  }
.clearfix:after,
.row:after {
  clear:both
  }
html[xmlns] .clearfix,
html[xmlns] .row {
  display:block
  }
* html .clearfix {
  height:1%
}
.clearfix{zoom:1
}

/*------------------------------------*\
  * $FORM FIELDS CSS
\*------------------------------------*/

#ud_form input[type="text"],
#ud_form input[type="email"],
#ud_form input[type="tel"],
#ud_form textarea,
#ud_form select {
  display: block;
  padding: .438em;
  border: 1px solid #D8D8D8;
  border-radius: 5px;
  margin-bottom: 1em;
  -webkit-box-shadow:0 1px 0 rgba(255, 255, 255, .5), 0 0 3px rgba(0, 0, 0, .1) inset;
  box-shadow:0 1px 0 rgba(255, 255, 255, .5), 0 0 3px rgba(0, 0, 0, .1) inset
}
#ud_form select {
  padding:.125em
}
#ud_form input:focus:not([type="submit"]),
#ud_form textarea:focus,#ud_form select.focus{
  -webkit-box-shadow:0 1px 3px rgba(0, 0, 0, .1) inset, 0 0 8px rgba(132, 185, 211, 0.6);
  box-shadow:0 1px 3px rgba(0, 0, 0, .1) inset, 0 0 8px rgba(132, 185, 211, 0.6)
}
#ud_form input:focus, #ud_form textarea:focus{
  -webkit-box-shadow:0 1px 0 rgba(255,255,255,.1),0 1px 0 rgba(0,0,0,0.9) inset;
  box-shadow:0 1px 0 rgba(255,255,255,.1),0 1px 0 rgba(0,0,0,0.9) inset;
  text-shadow:0 2px 3px rgba(0,0,0,.1)
}

/*------------------------------------*\
  * $JQUERY UI TABS CSS
  * 270, footer and contact options in sidebar
\*------------------------------------*/

.ui-widget {
    font-family: inherit !important;
    font-size: inherit !important;
}
.ui-widget-header {
    background: none !important;
    border: none !important;
    color: transparent !important;
}
.ui-corner-all, .ui-corner-top, .ui-corner-bottom, .ui-corner-left, .ui-corner-right, .ui-corner-br, .ui-corner-bl, .ui-corner-tr, .ui-corner-tl {
  border:none !important;
}
.ui-tabs .ui-tabs-nav li {
  float:none !important;
  margin:inherit !important;
}
.ui-tabs .ui-tabs-nav .ui-tabs-anchor {
    float: none !important;
    font-weight: normal !important;
    padding: inherit !important;
    margin: inherit !important
}

#ui-tabs-panel{
  background:#F2F2F2 !important;
  padding:1em !important;
  float:left !important;
  width:100% !important
}
#ui-tabs-panel li{
  display:none
}
#ui-tabs-panel li:first-child, #udel_theme_color_option li {
  display:block
}
#ui-tabs-panel select {
  float:left
}
#udel_message {
  background-color:#FDD;
  padding:.313em;
  font-weight:bold
}
.aligncenter {
  text-align:center !important
}
.udwrap .twelvecol {
  width:100%;
  float:left
}
.last {
  margin-right:0 !important
}
.first {
  margin-left:0 !important
}
.left {
  float:left
}
.right{
  float:right
}
.row, #ud-wrap {
  width: 100%;
  max-width: 960px;
  padding:.938em
}
.column, .columns {
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
  float: left;
  margin-left: 1.81818%;
  padding:0 1.25em;
  min-height: 1px
}
.column, .columns:first-child {
  margin-left: 0
}
.columns {
  min-height: 38px
}
.row .four.columns {
  width:32.12121%
}
.row .eight.columns {
  width:66.06061%
}
.row .twelve.columns {
  width:100%
}
.blue-sidebar  {
  background-color:#002663;
  background-image: url('../images/udtheme-panel-bgd.png');
  background-origin: padding-box;
  background-position: 0 0;
  background-repeat: no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  padding:0
}
.branddiv {
  background: rgba(0, 0, 0, 0.14);
  margin-bottom: 3em;
}
#panel-wrap{
  background:#C4D8E5;
  -webkit-box-shadow: inset 0 0 10px rgba(0,0,0,.3);
  box-shadow:inset 0 0 10px rgba(0,0,0,.3)
}
#panel-wrap {
   border-radius: 1em
}
.button-primary:before {
  font-family: "dashicons";
  content: "\f100"
}
.grey-main {
 background:#FFF url('../images/ud-logo-blue-trans.png') 98% 98% no-repeat;
 background-size: 142px 62px;
 -webkit-box-shadow: 0 0 3px rgba(0, 38, 99, 0.43) inset;
 box-shadow:  0 0 3px rgba(0, 38, 99, 0.43) inset
}
#panel-wrap, .blue-sidebar {
  float: left
}
#panel-wrap, .blue-sidebar, .grey-main {
  min-height: 664px;
}
#side_menu, #side_menu li {
  padding-left:.938em !important
}
#side_menu{
  margin-right:0 !important
}
#side_menu li{
  cursor:pointer;
  background:#034179;
  border-radius: 5px 0 0 5px;
  color:#FFF;
  display: block;
  height: 42px;
  width:auto;
  line-height: 42px;
  text-shadow:0 1px 1px #AAA;
  -webkit-box-shadow: 1px 1px 2px rgba(0, 160, 223, .2) inset;
  box-shadow:1px 1px 2px rgba(0, 160, 223, .2) inset
}
#side_menu li:hover {
  background:#034987;
}
#side_menu li.ui-tabs-active{
  background-color:#00A0DF;
  background-image: -webkit-radial-gradient(50% 6%, circle cover, #00A0DF, #00539F 59%);
  background-image: radial-gradient(50% 6%, circle cover, #00A0DF, #00539F 59%);
  -webkit-box-shadow:  0 0 10px rgba(0,0,0, .3) inset !important;
  box-shadow: 0 0 10px rgba(0, 0, 0, .3) inset
}
.blue-sidebar p {
  padding:0 1.2em;
  color:gainsboro;
}
.blue-sidebar li.ui-tabs-active a{
  color:#FFF;
  text-shadow:none
}
.blue-sidebar img {
  margin:1.25em;
}
.blue-sidebar li a {
  color: #FFF !important;
  display: block;
  font-size: .875em;
  font-weight:normal  !important;
  padding: 0 0 0 2.688em;
  position: relative;
  height: 34px;
  text-decoration: none
}
.tabs h2 {
  color:#0368AC
}
  p.submit {
    text-align:center;
  }
.submit {
  border-radius:3px;
  margin: .313em 0;
  padding: 1.5em 0;
}

/*------------------------------------*\
  * $HEADER RADIOS
  * Header and Footer display Y/N radio buttons
\*------------------------------------*/

#header-state > p,
#footer-state > p {
  position:relative;
  top:-34px;
  left:127px;
  height:19px;
  width:155px;
}
.switch {
  position: relative;
  height: 26px;
  width: 120px;
  background: rgba(0, 0, 0, .25);
  border-radius: 3px;
  -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, .3), 0 1px rgba(255, 255, 255, .1);
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, .3), 0 1px rgba(255, 255, 255, .1);
}
.switch-label {
  position: relative;
  z-index: 2;
  float: left;
  width: 58px;
  line-height: 26px;
  color: rgba(255, 255, 255, .35);
  text-align: center;
  cursor: pointer;
}
.switch-label:active {
  font-weight: bold;
}

.toggles input[type="radio"], .colors input[type="radio"] {
  display: none;
}
p.green:before,
p.ftstatus.check:before {
  content:'\2714'; /* check mark */
  color:#3D9400;
}
p.red, p.green {
  display:inline-block;
}
p.red:before,
p.ftstatus:before {
  content:'\2716'; /* X */
  color:#9E0000;
}
.toggles input[type="radio"]:checked + .switch-label, #header-state input:checked + .switch-selection {
  font-weight: bold;
  color: #FFF;
}
.toggles #blankHeader:checked  ~ .switch-selection,
.toggles #blankFooter:checked  ~ .switch-selection {
  /* Note: left: 50% doesn't transition in WebKit */
  -webkit-transform:  translateX(0);
  transform:  translateX(0);
  -webkit-transition: transform .15s ease-out;
  transition: transform .15s ease-out
}

.toggles #blockHeader:checked  ~ .switch-selection,
.toggles #blockFooter:checked  ~ .switch-selection {
  /* Note: left: 50% doesn't transition in WebKit */
 -webkit-transform:  translateX(57px);
  transform:  translateX(57px);
  -webkit-transition: transform .15s ease-out;
  transition: transform .15s ease-out
}

.switch-selection {
  display: block;
  position: absolute;
  z-index: 1;
  top: 2px;
  left: 2px;
  width: 58px;
  height: 22px;
  border-radius: 3px;
  -webkit-transition: left .15s ease-out;
  transition: left .15s ease-out
}
.switch-blue .switch-selection {
  background: #8dcc59;
  background: -webkit-linear-gradient(top, #8dcc59 0%,#5da547 100%);
  background: linear-gradient(to bottom, #8dcc59 0%,#5da547 100%);
}
.toggles input[type="radio"]:disabled + .switch-label  {
  color:rgba(255,255,255,.35);
  background: rgba(0,0,0,.25);
}

/*------------------------------------*\
  * $HEADER FOOTER COLOR
  * Header and footer background color boxes
\*------------------------------------*/

.scheme_white,
.scheme_blue {
  display: inline-block;
  width:50px;
  height:50px;
  border:1px solid #CCC;
}
.scheme_white {
  background: #FFF;
}
.scheme_blue {
  background: #002663;
}
label[for="rad_white"],
label[for="rad_white_footer"]{
  padding-right:1.25em;
}
#rad_blue:checked + div,
#rad_white:checked + div,
#rad_blue_footer:checked + div,
#rad_white_footer:checked + div {
border:3px solid #00A0DF;
}
#rad_white:disabled + .scheme_white,
#rad_blue:disabled + .scheme_blue,
#rad_white_footer:disabled + .scheme_white,
#rad_blue_footer:disabled + .scheme_blue,
.switch-input:disabled + .switch-label {
  background:#E7E7E7;
  cursor: no-drop;
}
.tab-header {
    padding: 0 0 2em;
}
.tab-header h3 {
  color: #767676;
  font-size:  1em;
}

#header-color small,
#footer-color small{
  display: inline-block;
  color:#9E0000;
  font-style: italic;
}
#footer-color small.hidden {
  display: none;
}

/*------------------------------------*\
  * $MEDIA QUERIES
\*------------------------------------*/

@media only screen and (max-width:47.938em){/* 782      767 47.938em */
  .row {
      clear: both;
      display: block;
      max-width: 1200px;
      position: relative
  }
  .row .four.columns,
  .row .eight.columns,
  .row .twelve.columns{
    width:auto;
    float:none;
    margin-left:0;
    margin-right:0;
    padding-left:1.25em;
    padding-right:1.25em
  }
  .grey-main{
    min-height:415px !important;
    padding:.625em
  }
  .submit{
    padding-bottom: 2em
  }
  .blue-sidebar p {
    padding:1em
  }
  #side_menu,
  #side_menu li {
    padding:0 !important;
    text-align: center
  }
  #side_menu{
    float:none;
    background:#034179
  }
  #side_menu li {
    display:inline-block;
    border-radius: 0;
    width:32%;
    height: auto;
    margin-bottom: 0
  }
    #side_menu li:hover {
      background:rgba(00,38,99,.4)
    }
  .blue-sidebar {
    padding:0 !important
  }
  .blue-sidebar img {
    display: block;
    margin: 0 auto;
    padding:inherit
  }
  .blue-sidebar li a {
    display:inline-block;
    padding:0
  }
  #panel-wrap,
  .blue-sidebar,
  .grey-main {
    min-height: 0
  }
  .switch {
    margin:0 auto;
  }
  #header-state > p {
    position:static;
  }
  .ui-tabs-panel {
    text-align: center;
  }
}