/*
 * Start Bootstrap - Agency Bootstrap Theme (http://startbootstrap.com)
 * Code licensed under the Apache License v2.0.
 * For details, see http://www.apache.org/licenses/LICENSE-2.0.
 * Enhanced to work with liveSite v9.1 and provided as-is, without support.
 */

/* STEP 1: let's add some Bootstrap 3 defaults overrides for this theme.
Be sure to include startup.js file in your Page Styles when using this theme */

.software_input_checkbox,
.software_input_radio {
	margin-right: .5em !important;
    margin-top: 0 !important;
}

.software_input_text.form-control,
.software_input_password.form-control, 
.software_select.form-control {
	width: inherit;
}

div[class*="software_"] label {
	font-weight: normal !important;
	display: inline !important;
}
#lightbox-container-image-data-box {
	box-sizing: content-box;
}
.products td, .products th {
	padding-right: .5em !important;
	padding-left: .5em !important;
}
.product_selection td {
	vertical-align: middle !important;
}

.software_fieldset {
    border: 1px solid !important;
    padding: 1em !important;
}
.software_legend {
    font-size: inherit !important;
    color: inherit !important;
    border: none !important;
    margin-bottom: 0 !important;
    width: auto !important;
}

td .software_input_text,
td .software_input_password,
td .software_select,
td .software_textarea,
td .software_input_checkbox,
td .software_input_radio {
	margin-left: .5em !important;
}

.software_input_text.query {
	margin-left: 0 !important;
}

@media only screen and (max-width:767px) {
	td .software_input_text,
	td .software_input_password,
	td .software_select,
	td .software_textarea,
	td .software_input_checkbox,
	td .software_input_radio {
		margin-left: 0 !important;
	}
	table,
	.software_input_text,
	.software_input_password,
	.software_select {
		width: 100% !important;
	}
	td.browse_cell .software_select {
		width: auto !important;
	}
}

.software_error {
    text-align: left !important;
}


/* STEP 2: let's update built-in frontend.min.css overrides for this theme */


input.software_input_text,
input.software_input_password,
select.software_select {
    display: inline-block !important; /* allow along side buttons */
    width: 14em; /* make all form fields the same size for looks */
    padding: 1em;
    height: auto;
    margin-bottom: .25em;
}

.software_comments textarea.software_textarea {
    width: 100%;
}

.software_form_list_view .browse_toggle,
.software_form_list_view .advanced_toggle
{
    color: #fff !important;
    background: #222 !important;
    border: 1px solid: #222 !important;
}

.software_pagination a,
.software_pagination span
{
margin-right: 0.5em;
text-decoration: none;
border: 1px solid #444;
background: #444;
}
.software_pagination span {
    cursor: default;
}
.software_pagination a:hover,
.software_pagination a.previous:hover,
.software_pagination a.next:hover
{
border: 1px solid #222;
background: #222;
}
.software_pagination .current
{
border: 1px solid #444;
font-weight: bold;
}
.software_pagination a.previous,
.software_pagination a.next
{
border: 1px solid #444;
}


/* STEP 3: let's add styling for this bootstrap 3 theme itself */


body {
    overflow-x: hidden;
    font-family: "Roboto Slab","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 16px;
    line-height: 1.75;
}

.text-muted {
    color: #777;
}
.text-primary {
    color: #ff7056;
}

p.large {
    font-size: 18px;
}

a,
a:hover,
a:focus,
a:active,
a.active {
    outline: 0;
}

a {
    color: #444;
}

a:hover,
a:focus,
a:active,
a.active {
    color: #777;
}

nav a,
section#contact a {
    color: #fed136;
}

nav a:hover,
section#contact a:hover,
nav a:focus,
section#contact a:focus,
nav a:active,
section#contact a:active,
nav a.active,
section#contact a.active {
    color: #fec503;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: 700;
}

h1 { font-size: 48px; }
h2 { font-size: 40px; }
h3 { font-size: 32px; }
h4 { font-size: 24px; }
h5 { font-size: 18px; }
h6 { font-size: 16px; }

.img-centered {
    margin: 0 auto;
}

.img-circle {
    height: 97%;
}

.bg-light-gray {
    background-color: #f7f7f7;
}

.bg-darkest-gray {
    background-color: #222;
}

.btn-primary {
    text-transform: uppercase;
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: 700;
    color: #fff;
    background-color: #fed136;
    border-color: #fed136;
}

.btn-default {
    border-color: #222;
    text-transform: uppercase;
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: 700;
    color: #fff;
    background-color: #222;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.open .dropdown-toggle.btn-primary {
    border-color: #f6bf01;
    color: #fff;
    background-color: #fec503;
}

.btn-default:hover,
.btn-default:focus,
.btn-default:active,
.btn-default.active,
.open .dropdown-toggle.btn-default {
    border-color: #444;
    color: #fff;
    background-color: #444;
    text-decoration: none;
}

.btn-primary:active,
.btn-primary.active,
.open .dropdown-toggle.btn-primary {
    background-image: none;
    text-decoration: none;
}
.btn-default:active,
.btn-default.active,
.open .dropdown-toggle.btn-default {
    background-image: none;
    text-decoration: none;
}

.btn-primary.disabled,
.btn-primary[disabled],
fieldset[disabled] .btn-primary,
.btn-primary.disabled:hover,
.btn-primary[disabled]:hover,
fieldset[disabled] .btn-primary:hover,
.btn-primary.disabled:focus,
.btn-primary[disabled]:focus,
fieldset[disabled] .btn-primary:focus,
.btn-primary.disabled:active,
.btn-primary[disabled]:active,
fieldset[disabled] .btn-primary:active,
.btn-primary.disabled.active,
.btn-primary[disabled].active,
fieldset[disabled] .btn-primary.active {
    border-color: #fed136;
    background-color: #fed136;
}

.btn-default.disabled,
.btn-default[disabled],
fieldset[disabled] .btn-default,
.btn-default.disabled:hover,
.btn-default[disabled]:hover,
fieldset[disabled] .btn-default:hover,
.btn-default.disabled:focus,
.btn-default[disabled]:focus,
fieldset[disabled] .btn-default:focus,
.btn-default.disabled:active,
.btn-default[disabled]:active,
fieldset[disabled] .btn-default:active,
.btn-default.disabled.active,
.btn-default[disabled].active,
fieldset[disabled] .btn-default.active {
    border-color: #444;
    background-color: #444;
}

.btn-primary .badge {
    color: #fed136;
    background-color: #fff;
}

.btn-primary.btn-xl {
    padding: 20px 40px;
    border-color: #fed136;
    border-radius: 3px;
    text-transform: uppercase;
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    background-color: #fed136;
}

.btn-default.btn-xl {
    padding: 20px 40px;
    border-color: #444;
    border-radius: 3px;
    text-transform: uppercase;
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 18px;
    font-weight: 700;
    color: #fff;
    background-color: #444;
}

.btn-xl:hover,
.btn-xl:focus,
.btn-xl:active,
.btn-xl.active,
.open .dropdown-toggle.btn-xl {
    border-color: #f6bf01;
    color: #fff;
    background-color: #fec503;
    text-decoration: none;
}

.btn-default.btn-xl:hover,
.btn-default.btn-xl:focus,
.btn-default.btn-xl:active,
.btn-default.btn-xl.active,
.btn-default .open .dropdown-toggle.btn-xl {
    border-color: #f6bf01;
    color: #fff;
    background-color: #fec503;
}

.btn-xl:active,
.btn-xl.active,
.open .dropdown-toggle.btn-xl {
    background-image: none;
}

.btn-xl.disabled,
.btn-xl[disabled],
fieldset[disabled] .btn-xl,
.btn-xl.disabled:hover,
.btn-xl[disabled]:hover,
fieldset[disabled] .btn-xl:hover,
.btn-xl.disabled:focus,
.btn-xl[disabled]:focus,
fieldset[disabled] .btn-xl:focus,
.btn-xl.disabled:active,
.btn-xl[disabled]:active,
fieldset[disabled] .btn-xl:active,
.btn-xl.disabled.active,
.btn-xl[disabled].active,
fieldset[disabled] .btn-xl.active {
    border-color: #fed136;
    background-color: #fed136;
}

btn-default.btn-xl.disabled,
btn-default.btn-xl[disabled],
fieldset[disabled] btn-default.btn-xl,
btn-default.btn-xl.disabled:hover,
btn-default.btn-xl[disabled]:hover,
fieldset[disabled] btn-default.btn-xl:hover,
btn-default.btn-xl.disabled:focus,
btn-default.btn-xl[disabled]:focus,
fieldset[disabled] btn-default.btn-xl:focus,
btn-default.btn-xl.disabled:active,
btn-default.btn-xl[disabled]:active,
fieldset[disabled] btn-default.btn-xl:active,
btn-default.btn-xl.disabled.active,
btn-default.btn-xl[disabled].active,
fieldset[disabled] btn-default.btn-xl.active {
    border-color: #444;
    background-color: #444;
}

.btn-xl .badge {
    color: #fed136;
    background-color: #fff;
}

.navbar-default {
    border-color: transparent;
    background-color: #222;
}

.navbar-default .navbar-brand {
    font-family: "Kaushan Script","Helvetica Neue",Helvetica,Arial,cursive;
    color: #fed136;
}

.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus,
.navbar-default .navbar-brand:active,
.navbar-default .navbar-brand.active {
    color: #fec503;
}

.navbar-default .navbar-collapse {
    border-color: rgba(255,255,255,.02);
}

.navbar-default .navbar-toggle {
    border-color: #fed136;
    background-color: #fed136;
}

.navbar-default .navbar-toggle .icon-bar {
    background-color: #fff;
}

.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
    background-color: #fed136;
}

.navbar-default .nav li a {
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: 400;
    letter-spacing: 1px;
    color: #fff;
}

.navbar-default .nav li a:hover,
.navbar-default .nav li a:focus {
    outline: 0;
    color: #fed136;
}

.navbar-default .navbar-nav>.active>a {
    border-radius: 0;
    color: #fff;
    background-color: #fed136;
}

.navbar-default .navbar-nav>.active>a:hover,
.navbar-default .navbar-nav>.active>a:focus {
    color: #fff;
    background-color: #fec503;
}

@media only screen and (min-width:768px) {
    .navbar-default {
        padding: 25px 0;
        border: 0;
        background-color: transparent;
        -webkit-transition: padding .3s;
        -moz-transition: padding .3s;
        transition: padding .3s;
    }

    .navbar-default .navbar-brand {
        font-size: 2em;
        -webkit-transition: all .3s;
        -moz-transition: all .3s;
        transition: all .3s;
    }

    .navbar-default .navbar-nav>.active>a {
        border-radius: 3px;
    }

    .navbar-default.navbar-shrink {
        padding: 10px 0;
        background-color: #222;
    }

    .navbar-default.navbar-shrink .navbar-brand {
        font-size: 1.5em;
    }
}

header {
    text-align: center;
    color: #fff;
    background-attachment: scroll;
    background-image: url(/Completing_Paperwork.jpg);
    background-position: center center;
    background-repeat: none;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}

header .intro-text {
    padding-top: 300px;
    padding-bottom: 50px;
}

header .intro-text .intro-lead-in {
    margin-bottom: 25px;
    font-family: "Droid Serif","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 22px;
    font-style: italic;
    line-height: 22px;
}

header .intro-text .intro-heading {
    margin-bottom: 25px;
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 50px;
    font-weight: 700;
    line-height: 50px;
}

@media only screen and (max-width:1000px) {
    nav li a {font-size: 12px;}
}

@media only screen and (min-width:768px) {
    header .intro-text {
        padding-top: 300px;
        padding-bottom: 200px;
    }

    header .intro-text .intro-lead-in {
        margin-bottom: 25px;
        font-family: "Droid Serif","Helvetica Neue",Helvetica,Arial,sans-serif;
        font-size: 40px;
        font-style: italic;
        line-height: 40px;
    }

    header .intro-text .intro-heading {
        margin-bottom: 50px;
        font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
        font-size: 75px;
        font-weight: 700;
        line-height: 75px;
    }
}

@media only screen and (max-width:319px) {
    header .intro-text .intro-lead-in {font-size: 20px;}
    header .intro-text .intro-heading {font-size: 40px;}
	header .btn-xl {font-size: 14px !important;}
}

section {
    padding: 100px 0;
}

section p {
	color: #777;
}

section h1 {
    margin-top: 0;
    margin-bottom: 15px;
    font-size: 48px;
}

section h2 {
    margin-top: 0;
    margin-bottom: 15px;
    font-size: 40px;
}

section h3 {
    margin-bottom: 75px;
    text-transform: none;
    font-family: "Droid Serif","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 16px;
    font-style: italic;
    font-weight: 400;
    color: #777;
}

@media only screen and (min-width:768px) {
    section {
        padding: 150px 0;
    }
}

@media only screen and (max-width:559px) {
    section h1 {font-size: 24px;}
    section h2 {font-size: 20px;}
}

#portfolio .portfolio-item {
    right: 0;
    margin: 0 0 15px;
}

#portfolio .portfolio-item .portfolio-link {
    display: block;
    position: relative;
    margin: 0 auto;
    max-width: 400px;
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover {
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
    background: rgba(254,209,54,.9);
    -webkit-transition: all ease .5s;
    -moz-transition: all ease .5s;
    transition: all ease .5s;
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover:hover {
    opacity: 1;
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content {
    position: absolute;
    top: 50%;
    width: 100%;
    height: 20px;
    margin-top: -12px;
    text-align: center;
    font-size: 20px;
    color: #fff;
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content i {
    margin-top: -12px;
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content h3,
#portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content h4 {
    margin: 0;
}

#portfolio .portfolio-item .portfolio-caption {
    margin: 0 auto;
    padding: 25px;
    max-width: 400px;
    text-align: center;
    background-color: #fff;
}

#portfolio .portfolio-item .portfolio-caption h4 {
    margin: 0;
    text-transform: none;
}

#portfolio .portfolio-item .portfolio-caption p {
    margin: 0;
    font-family: "Droid Serif","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 16px;
    font-style: italic;
}

#portfolio * {
    z-index: 2;
}

@media only screen and (min-width:767px) {
    #portfolio .portfolio-item {
        margin: 0 0 30px;
    }
}

.timeline {
    position: relative;
    padding: 0;
    list-style: none;
}

.timeline:before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 40px;
    width: 2px;
    margin-left: -1.5px;
    background-color: #f1f1f1;
}

.timeline>li {
    position: relative;
    margin-bottom: 50px;
    min-height: 50px;
}

.timeline>li:before,
.timeline>li:after {
    content: " ";
    display: table;
}

.timeline>li:after {
    clear: both;
}

.timeline>li .timeline-panel {
    float: right;
    position: relative;
    width: 100%;
    padding: 0 20px 0 100px;
    text-align: left;
}

.timeline>li .timeline-panel:before {
    right: auto;
    left: -15px;
    border-right-width: 15px;
    border-left-width: 0;
}

.timeline>li .timeline-panel:after {
    right: auto;
    left: -14px;
    border-right-width: 14px;
    border-left-width: 0;
}

.timeline>li .timeline-image {
    z-index: 100;
    position: absolute;
    left: 0;
    width: 80px;
    height: 80px;
    margin-left: 0;
    border: 7px solid #f1f1f1;
    border-radius: 100%;
    text-align: center;
    color: #fff;
    background-color: #fed136;
}

.timeline>li .timeline-image h4 {
    margin-top: 12px;
    font-size: 10px;
    line-height: 14px;
}

.timeline>li.timeline-inverted>.timeline-panel {
    float: right;
    padding: 0 20px 0 100px;
    text-align: left;
}

.timeline>li.timeline-inverted>.timeline-panel:before {
    right: auto;
    left: -15px;
    border-right-width: 15px;
    border-left-width: 0;
}

.timeline>li.timeline-inverted>.timeline-panel:after {
    right: auto;
    left: -14px;
    border-right-width: 14px;
    border-left-width: 0;
}

.timeline>li:last-child {
    margin-bottom: 0;
}

.timeline .timeline-heading h4 {
    margin-top: 0;
    color: inherit;
}

.timeline .timeline-heading h4.subheading {
    text-transform: none;
}

.timeline .timeline-body>p,
.timeline .timeline-body>ul {
    margin-bottom: 0;
}

@media only screen and (min-width:768px) {
    .timeline:before {
        left: 50%;
    }

    .timeline>li {
        margin-bottom: 100px;
        min-height: 100px;
    }

    .timeline>li .timeline-panel {
        float: left;
        width: 41%;
        padding: 0 20px 20px 30px;
        text-align: right;
    }

    .timeline>li .timeline-image {
        left: 50%;
        width: 100px;
        height: 100px;
        margin-left: -50px;
    }

    .timeline>li .timeline-image h4 {
        margin-top: 16px;
        font-size: 13px;
        line-height: 18px;
    }

    .timeline>li.timeline-inverted>.timeline-panel {
        float: right;
        padding: 0 30px 20px 20px;
        text-align: left;
    }
}

@media only screen and (min-width:992px) {
    .timeline>li {
        min-height: 150px;
    }

    .timeline>li .timeline-panel {
        padding: 0 20px 20px;
    }

    .timeline>li .timeline-image {
        width: 150px;
        height: 150px;
        margin-left: -75px;
    }

    .timeline>li .timeline-image h4 {
        margin-top: 30px;
        font-size: 18px;
        line-height: 26px;
    }

    .timeline>li.timeline-inverted>.timeline-panel {
        padding: 0 20px 20px;
    }
}

@media only screen and (min-width:1200px) {
    .timeline>li {
        min-height: 170px;
    }

    .timeline>li .timeline-panel {
        padding: 0 20px 20px 100px;
    }

    .timeline>li .timeline-image {
        width: 170px;
        height: 170px;
        margin-left: -85px;
    }

    .timeline>li .timeline-image h4 {
        margin-top: 40px;
    }

    .timeline>li.timeline-inverted>.timeline-panel {
        padding: 0 100px 20px 20px;
    }
}

.team-member {
    margin-bottom: 50px;
    text-align: center;
}

.team-member img {
    margin: 0 auto;
    border: 7px solid #fff;
}

.team-member h4 {
    margin-top: 25px;
    margin-bottom: 0;
    text-transform: none;
}

.team-member p {
    margin-top: 0;
}

aside.clients img {
    margin: 50px auto;
}

section#contact {
    color: #fff;
    background-color: #333;
    background-image: url({path}map-image-startup.png);
    background-position: center;
    background-repeat: no-repeat;
}

section#contact .section-heading {
    color: #fff;
}

section#contact .form-group {
    margin-bottom: 25px;
}

section#contact .form-group input,
section#contact .form-group textarea {
    padding: 20px;
}

section#contact .form-group input.form-control {
    height: auto;
}

section#contact .form-group textarea.form-control {
    height: 236px;
}

section#contact .form-control:focus {
    border-color: #fed136;
    box-shadow: none;
}

section#contact::-webkit-input-placeholder {
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: 700;
    color: #bbb;
}

section#contact:-moz-placeholder {
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: 700;
    color: #bbb;
}

section#contact::-moz-placeholder {
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: 700;
    color: #bbb;
}

section#contact:-ms-input-placeholder {
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: 700;
    color: #bbb;
}

section#contact .text-danger {
    color: #e74c3c;
}

footer {
    padding: 25px 0;
    text-align: center;
}

footer span.copyright {
    text-transform: none;
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    line-height: 40px;
}

footer ul.quicklinks {
    margin-bottom: 0;
    text-transform: none;
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    line-height: 40px;
}

ul.social-buttons {
    margin-bottom: 0;
}

ul.social-buttons li a {
    display: block;
    width: 40px;
    height: 40px;
    border-radius: 100%;
    font-size: 20px;
    line-height: 40px;
    outline: 0;
    color: #fff;
    background-color: #222;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    transition: all .3s;
}

ul.social-buttons li a:hover,
ul.social-buttons li a:focus,
ul.social-buttons li a:active {
    background-color: #fed136;
}

.btn:focus,
.btn:active,
.btn.active,
.btn:active:focus {
    outline: 0;
}

.portfolio-modal .modal-content {
    padding: 100px 0;
    min-height: 100%;
    border: 0;
    border-radius: 0;
    text-align: center; text-align: top
    background-clip: border-box;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.portfolio-modal .modal-content h2 {
    margin-bottom: 15px;
    font-size: 3em;
}

.portfolio-modal .modal-content p {
    margin-bottom: 30px;
}

.portfolio-modal .modal-content p.item-intro {
    margin: 20px 0 30px;
    font-family: "Droid Serif","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 16px;
    font-style: italic;
}

.portfolio-modal .modal-content ul.list-inline {
    margin-top: 0;
    margin-bottom: 30px;
}

.portfolio-modal .modal-content img {
    margin-bottom: 30px;
}

.portfolio-modal .close-modal {
    position: absolute;
    top: 25px;
    right: 25px;
    width: 75px;
    height: 75px;
    background-color: transparent;
    cursor: pointer;
}

.portfolio-modal .close-modal:hover {
    opacity: .3;
}

.portfolio-modal .close-modal .lr {
    z-index: 1051;
    width: 1px;
    height: 75px;
    margin-left: 35px;
    background-color: #222;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.portfolio-modal .close-modal .lr .rl {
    z-index: 1052;
    width: 1px;
    height: 75px;
    background-color: #222;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
}

.portfolio-modal .modal-backdrop {
    display: none;
    opacity: 0;
}

::-moz-selection {
    text-shadow: none;
    background: #fed136;
}

::selection {
    text-shadow: none;
    background: #fed136;
}

img::selection {
    background: 0 0;
}

img::-moz-selection {
    background: 0 0;
}

body {
    webkit-tap-highlight-color: #fed136;
}


/* STEP 4: let's add additional styling to make the contact form responsive and styled to match the theme */


/* Convert CONTACT custom form into 2 columns w/o labels for bootstrap-sized desktops */

form.f_CONTACT input { height: auto; }
form.f_CONTACT input, form.f_CONTACT textarea { padding: 20px; }

form.f_CONTACT table { width: 100%; }
form.f_CONTACT tr td { width: auto; padding-bottom: 25px; }

form.f_CONTACT tr td:first-child { display: none; }

form.f_CONTACT input, form.f_CONTACT textarea {margin: 0 !important; }

form.f_CONTACT tr td + td { width: 48.9%; }

form.f_CONTACT tr.ff_subject td {
	width: 178%;
}
form.f_CONTACT tr.ff_details textarea {
    width: 87%;
    height: 23.1em;
}

form.f_CONTACT tr.captcha_row td { display: block; width: 100%; }
form.f_CONTACT tr td .software_captcha_label,
form.f_CONTACT tr td .software_captcha_question { display: none; }
form.f_CONTACT tr.captcha_row td input { width:98%; }


form.f_CONTACT tr.spacing_row td { display: none; }
form.f_CONTACT tr.submit_button_row td { 
    display: block;
    position: relative;
    width: 100%;
    padding: 0 !important;
    text-align: center; 
}

form.f_CONTACT input.submit_button { padding: 20px 40px; }

@media only screen and (min-width:990px) {
    form.f_CONTACT tr.ff_subject,
	form.f_CONTACT tr.ff_details {
   		left: 51.5%;
   		position: absolute;
   		width: 100%;
	}
    form.f_CONTACT tr.ff_subject {
  		margin-top: -27.2em;
	}
	form.f_CONTACT tr.ff_details {
    	margin-top: -21.8em;
	}
}

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

    form.f_CONTACT tr.ff_subject td { width: 147%; }
    form.f_CONTACT tr.ff_details textarea { width: 72%; }
    form.f_CONTACT tr.captcha_row td input { width: 98%; }
}

@media only screen and (max-width: 990px) {
    form.f_CONTACT tr td + td { width: 100%; }
    form.f_CONTACT tr.ff_subject td { width: 100%; }
    form.f_CONTACT tr.ff_details textarea { width: 100%; }
    form.f_CONTACT tr.captcha_row td input { width: 100%; }
}


/* Convert MAILING-LIST custom form into 2 columns w/o labels for bootstrap-sized desktops */

form.f_MAILING-LIST input { height: auto; }
form.f_MAILING-LIST input { padding: 20px; }

form.f_MAILING-LIST table { width: 100%; }
form.f_MAILING-LIST tr td { width: auto; padding-bottom: 8px; }

form.f_MAILING-LIST tr td:first-child { display: none; }

form.f_MAILING-LIST input {margin: 0 !important; }

form.f_MAILING-LIST tr td + td { width: 48.9%; }

form.f_MAILING-LIST tr.ff_email td {
	width: 50%;
    text-align: center;
    padding-top: 1em;
    float: none !important;
}

form.f_MAILING-LIST tr.captcha_row td { display: block; text-align: center;}
form.f_MAILING-LIST tr td .software_captcha_label,
form.f_MAILING-LIST tr td .software_captcha_question { display: none; }
form.f_MAILING-LIST tr.captcha_row td input { width: 40.9em; }

form.f_MAILING-LIST tr.spacing_row td { display: none; }
form.f_MAILING-LIST tr.submit_button_row td { 
    display: block;
    text-align: center;
    float: none !important;
}

form.f_MAILING-LIST input.submit_button { padding: 20px 40px; }

@media only screen and (max-width:1200px) {
    form.f_MAILING-LIST tr.captcha_row td input { width: 33.6em; }
}

@media only screen and (max-width:990px) {
    form.f_MAILING-LIST tr.captcha_row td input { width: 25.7em; }
}

@media only screen and (max-width:768px) {
    form.f_MAILING-LIST tr td + td { width: 100%; }
    form.f_MAILING-LIST tr.ff_email td { width: 100%; }
    form.f_MAILING-LIST tr.captcha_row td { width: 100%; }
    form.f_MAILING-LIST tr.captcha_row td input { width: 33.6em; }
}


/* STEP 5: Miscellaneous Software Updates for this theme */


/* recolor software edit mode grid lines  if too dark sto see in some sections of the pages */
nav div.edit_mode, header div.edit_mode { border: 1px dashed red !important; }

/* allow software edit buttons to function over top of this theme's fixed nav (of z-index: 1030) */
div.edit_mode a { z-index: 1031 !important; }

/* remove paragraph spacing in nav area since RTE will add p tags when editing the regions */
nav p, header p { font: inherit; line-height: inherit; margin: 0; padding: 0; }

/* style interior nav for all pages other than the home page */
body.interior nav.navbar-default { background: #222; }

/* STEP 6: define all the Custom Formats (shortcodes) that the site editors can use to style their content.

IMPORTANT: Make sure this css file is designated as a "Theme" and the software will find all css elements inside the 
<custom_format>...</custom_format> or <add_custom_format>...</add_custom_format> comments and include them to the Rich Text Editor 
"Custom Formats" picklist

/* define the Custom Formats required for the Accordion/Tabbed List features to the Rich-Text Editor.
    (These are already styled in the software's frontend.min.css file included in all pages.) */

/* <custom_formats> */
ul.list-accordion{}
ul.list-accordion-expanded{}
ul.list-tabs{}
/* </custom_formats> */

/* Customize these for this theme */

ul.list-accordion a.item_heading {
 	padding: 1em;
}

ul.list-tabs li a {
    color: #222;
    text-decoration: none;
    padding: 1em;
}
.ui-tabs-panel {
	padding: 2em;
}

/* Now for all the other Custom Formats which are styled below these definitions */

/* <add_custom_formats> */
.background-primary{}
.background-secondary{}
.color-primary{}
.color-secondary{}
.heading-primary{}
.heading-secondary{}
img.image-primary{}
img.image-secondary{}
img.image-left-primary{}
img.image-left-secondary{}
img.image-right-primary{}
img.image-right-secondary{}
a.link-button-primary-large{}
a.link-button-primary-small{}
a.link-button-secondary-large{}
a.link-button-secondary-small{}
a.link-menu-item{}
a.link-content-more{}
p.paragraph-box-primary{}
p.paragraph-box-secondary{}
p.paragraph-box-example{}
p.paragraph-box-notice{}
p.paragraph-box-warning{}
p.paragraph-no-margin{}
p.paragraph-no-margin-top{}
p.paragraph-no-margin-bottom{}
p.paragraph-indent{}
table.table-primary{}
table.table-secondary{}
table.table-left{}
table.table-right{}
table.table-center{}
thead.table-row-header{}
tbody.table-row-body{}
tfoot.table-row-footer{}
th.table-cell-header{}
td.table-cell-data{}
span.text-box-primary{}
span.text-box-secondary{}
span.text-box-example{}
span.text-box-notice{}
span.text-box-warning{}
span.text-highlighter{}
span.text-fine-print{}
span.text-annotate{}
span.text-quote{}
.video-primary{}
.video-secondary{}
.video-left-primary{}
.video-left-secondary{}
.video-right-primary{}
.video-right-secondary{}

/* And let's define the Custom Formats for responsive content. These are styled for you in the {path}{software_directory}/responsive.min.css file you will include in your Page Styles. */

a.link-mobile-fill{}
a.link-desktop-hide{}
a.link-mobile-hide{}
img.img-responsive{}
img.image-mobile-fill{}
img.image-desktop-hide{}
img.image-mobile-hide{}
p.paragraph-desktop-hide{}
p.paragraph-mobile-hide{}
span.text-desktop-hide{}
span.text-mobile-hide{}
table.table-desktop-hide{}
table.table-mobile-hide{}
td.table-cell-mobile-hide{}
td.table-cell-desktop-hide{}
td.table-cell-mobile-fill{}
td.table-cell-mobile-wrap{}
td.table-cell-width10{}
td.table-cell-width15{}
td.table-cell-width20{}
td.table-cell-width25{}
td.table-cell-width33{}
td.table-cell-width40{}
td.table-cell-width50{}
td.table-cell-width75{}
td.table-cell-width80{}
td.table-cell-width90{}
.video-mobile-fill{}
.video-desktop-hide{}
.video-mobile-hide{}
.video-responsive{}
/* </add_custom_formats> */


/*	Now let's style all the default custom formats
	The default custom formats use "Primary Color" and "Secondary Color" concept so search and replace the colors 
    in all the custom format code below with your own that match your design */

.background-primary
{
	background-color: #fed136;
}
.background-secondary
{
	background-color: #777;
}
.color-primary
{
	color: #fed136;
}
.color-secondary
{
	color: #777;
}
h1.heading-primary,
h2.heading-primary,
h3.heading-primary,
h4.heading-primary,
h5.heading-primary,
h6.heading-primary 
{
	border-bottom: 1px solid;
	padding-bottom: 0.5em;
}
h1.heading-secondary,
h2.heading-secondary,
h3.heading-secondary,
h4.heading-secondary,
h5.heading-secondary,
h6.heading-secondary 
{
	background-color: #777;
	color: #fff !important;
    margin-left: -30px !important;
    margin-right: -30px !important;
    padding: 0.5em 1em;
}
img.image-primary
{
	margin-right: auto;
	margin-left: auto;
}
img.image-left-primary,
.video-left-primary object,
.video-left-primary iframe,
.video-left-primary video
{
	float: left;
	margin-left: 0em;
	margin-top: 0em;
	margin-right: 1em;
}
img.image-right-primary,
.video-right-primary object,
.video-right-primary iframe,
.video-right-primary video
{
	float: right;
	margin-right: 0em;
	margin-top: 0em;
	margin-left: 1em;
}
img.image-primary,
img.image-left-primary,
img.image-right-primary,
.video-primary object,
.video-primary iframe,
.video-primary video,
.video-left-primary object,
.video-left-primary iframe,
.video-left-primary video,
.video-right-primary object,
.video-right-primary iframe,
.video-right-primary video
{
	padding: .5em;
	box-shadow: inset 0px 0px 0px 0px rgba(0, 0, 0, 0.75),
                inset 0px 2px 0px 0px rgba(255, 255, 255, 0.5),
                inset 0px 0px 0px 2px rgba(255, 255, 255, 0.85),
                0px 0px 4px 1px rgba(0, 0, 0, 0.15);
}
.video-secondary object,
.video-secondary iframe,
.video-secondary video
{
	display: block;
}
img.image-secondary
{
	margin-right: auto;
	margin-left: auto;
}
img.image-left-secondary,
.video-left-secondary object,
.video-left-secondary iframe,
.video-left-secondary video
{
	float: left;
	margin-top: 0em;
	margin-left: 0em;
	margin-right: 1em;
}
img.image-right-secondary,
.video-right-secondary object,
.video-right-secondary iframe,
.video-right-secondary video
{
	float: right;
	margin-top: 0em;
	margin-right: 0em;
	margin-left: 1em;
}
img.image-secondary,
img.image-left-secondary,
img.image-right-secondary,
.video-secondary object,
.video-secondary iframe,
.video-secondary video,
.video-left-secondary object,
.video-left-secondary iframe,
.video-left-secondary video,
.video-right-secondary object,
.video-right-secondary iframe,
.video-right-secondary video
{
	padding: 10px;
	background-color: #aaa;
}
.video-primary object,
.video-primary iframe,
.video-primary video
{
	display: block;
}


.video-responsive {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; 
    height: 0; 
    overflow: hidden;
}
.video-responsive iframe,
.video-responsive object,
.video-responsive embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

a.link-button-primary-large,
a.link-button-primary-large:link,
a.link-button-primary-large:visited,
a.link-button-primary-large:active, 
a.link-button-primary-small,
a.link-button-primary-small:link,
a.link-button-primary-small:visited,
a.link-button-primary-small:active,
/* override all other software generated buttons to match */
.software_input_submit,
.software_input_submit_primary,
a.software_input_submit_primary:link,
a.software_input_submit_primary:visited,
a.software_input_submit_primary:active,
.software_input_submit_small_primary,
a.software_input_submit_small_primary:link,
a.software_input_submit_small_primary:visited,
a.software_input_submit_small_primary:active,
.software_button_primary,
a.software_button_primary:link,
a.software_button_primary:visited,
a.software_button_primary:active,
.software_button_small_primary,
a.software_button_small_primary:link,
a.software_button_small_primary:visited,
a.software_button_small_primary:active,
.more_detail a
{
    color: #0d0d0c;
    background-color: #fed136;
    border-color: #fed136;
    padding: 20px 40px;
}


a.link-button-primary-large:hover,
a.link-button-primary-large:focus,
a.link-button-primary-small:hover,
a.link-button-primary-small:focus,
/* override all other software generated buttons to match */
.software_input_submit:hover,
.software_input_submit:focus,
.software_input_submit_primary:hover,
.software_input_submit_primary:focus,
a.software_input_submit_primary:hover,
a.software_input_submit_primary:focus,
.software_input_submit_small_primary:hover,
.software_input_submit_small_primary:focus,
a.software_input_submit_small_primary:hover,
a.software_input_submit_small_primary:focus,
.software_button_primary:hover,
.software_button_primary:focus,
a.software_button_primary:hover,
a.software_button_primary:focus,
.software_button_small_primary:hover,
.software_button_small_primary:focus,
a.software_button_small_primary:hover,
a.software_button_small_primary:focus,
.more_detail a:hover,
.more_detail a:focus
{
    border-color: #f6bf01;
    color: #fff;
    background-color: #fec503;
}

a.link-button-secondary-large,
a.link-button-secondary-large:link,
a.link-button-secondary-large:visited,
a.link-button-secondary-large:active, 
a.link-button-secondary-small,
a.link-button-secondary-small:link,
a.link-button-secondary-small:visited,
a.link-button-secondary-small:active,
/* override all other software generated buttons to match */
.software_input_submit_secondary,
a.software_input_submit_secondary:link,
a.software_input_submit_secondary:visited,
a.software_input_submit_secondary:active,
.software_input_submit_small_secondary,
a.software_input_submit_small_secondary:link,
a.software_input_submit_small_secondary:visited,
a.software_input_submit_small_secondary:active,
.software_button_secondary,
a.software_button_secondary:link,
a.software_button_secondary:visited,
a.software_button_secondary:active,
.software_button_small_secondary,
a.software_button_small_secondary:link,
a.software_button_small_secondary:visited,
a.software_button_small_secondary:active,
.software_button_tiny_secondary,
a.software_button_tiny_secondary:link,
a.software_button_tiny_secondary:visited,
a.software_button_tiny_secondary:active,
.software_input_submit_tiny_secondary,
a.software_input_submit_tiny_secondary:link,
a.software_input_submit_tiny_secondary:visited,
a.software_input_submit_tiny_secondary:active,
.software_menu_sequence a
{   text-transform: uppercase;
    border-color: #444;
    color: #fff;
    background-color: #444;
    padding: 20px 40px;
}

a.link-button-secondary-large:hover,
a.link-button-secondary-large:focus,
a.link-button-secondary-small:hover,
a.link-button-secondary-small:focus,
/* override all other software generated buttons to match */
.software_input_submit_secondary:hover,
.software_input_submit_secondary:focus,
a.software_input_submit_secondary:hover,
a.software_input_submit_secondary:focus,
.software_input_submit_small_secondary:hover,
.software_input_submit_small_secondary:focus,
a.software_input_submit_small_secondary:hover,
a.software_input_submit_small_secondary:focus,
.software_button_secondary:hover,
.software_button_secondary:focus,
a.software_button_secondary:hover,
a.software_button_secondary:focus,
.software_button_small_secondary:hover,
.software_button_small_secondary:focus,
a.software_button_small_secondary:hover,
a.software_button_small_secondary:focus,
.software_button_tiny_secondary:hover,
.software_button_tiny_secondary:focus,
a.software_button_tiny_secondary:hover,
a.software_button_tiny_secondary:focus,
.software_input_submit_tiny_secondary:hover,
.software_input_submit_tiny_secondary:focus,
a.software_input_submit_tiny_secondary:hover,
a.software_input_submit_tiny_secondary:focus,
.software_menu_sequence a:hover,
.software_menu_sequence a:focus
{
    border-color: #222;
    background-color: #222;
}

a.link-button-primary-small,
a.link-button-primary-small:link,
a.link-button-primary-small:visited,
a.link-button-primary-small:active,
a.link-button-secondary-small,
a.link-button-secondary-small:link,
a.link-button-secondary-small:visited,
a.link-button-secondary-small:active,
/* override all other software generated buttons to match */
.software_input_submit_small_primary,
a.software_input_submit_small_primary:link,
a.software_input_submit_small_primary:visited,
a.software_input_submit_small_primary:active,
.software_button_small_primary,
a.software_button_small_primary:link,
a.software_button_small_primary:visited,
a.software_button_small_primary:active,
.software_input_submit_small_secondary,
a.software_input_submit_small_secondary:link,
a.software_input_submit_small_secondary:visited,
a.software_input_submit_small_secondary:active,
.software_button_small_secondary,
a.software_button_small_secondary:link,
a.software_button_small_secondary:visited,
a.software_button_small_secondary:active
{
	font-size: 77%;
    padding: 6px 12px;
}

/* override all other software generated buttons to match */
.software_button_tiny_secondary,
a.software_button_tiny_secondary:link,
a.software_button_tiny_secondary:visited,
a.software_button_tiny_secondary:active,
.software_input_submit_tiny_secondary,
a.software_input_submit_tiny_secondary:link,
a.software_input_submit_tiny_secondary:visited,
a.software_input_submit_tiny_secondary:active
{
	font-size: 60%;
	font-weight: normal !important; /* needed since some tiny buttons are in .heading and we don't want them bold */
    letter-spacing: 1px;
    padding: 3px 6px;
}


.watcher_container .software_input_submit_small_secondary,
.apply_gift_cards .software_input_submit_small_secondary {
   padding: 1.55em 1em;
   vertical-align: top;
}
li.link-menu-item,
p.link-menu-item,
a.link-menu-item
{
	display: block;
	padding: 1em 1em;
	margin: 0em 0em .5em 0em;
	font-size: 100%;
	font-weight: normal;
	font-style: normal;
	text-decoration: none;
	color: #000;
	background: #ddd;
    border-radius: 3px;
}
a.link-menu-item:hover,
a.link-menu-item:focus
{
	color: #fff;
	background: #222;
}
a.link-content-more,
a.link-content-more:link,
a.link-content-more:active,
a.link-content-more:visited
{
	font-size: 80%;
	text-decoration: none;
	padding: 0.2em 0.8em;
	border: 1px solid;
    color: #222;
    border-radius: 4px;
    text-transform: uppercase;
}
a.link-content-more:hover,
a.link-content-more:focus
{
	color: #fed136;
	border: 1px solid #444;
    background: #222;
}
td.paragraph-indent,
p.paragraph-indent
{
	text-indent: 5%;
}
td.paragraph-no-margin,
p.paragraph-no-margin,
span.paragraph-no-margin,
p.paragraph-no-margin
{
	margin-top: 0px;
	margin-bottom: 0px;
}
td.paragraph-no-margin-top,
p.paragraph-no-margin-top, 
span.paragraph-no-margin-top,
p.paragraph-no-margin-top
{
	margin-top: 0px;
}
td.paragraph-no-margin-bottom,
p.paragraph-no-margin-bottom,
span.paragraph-no-margin-bottom,
p.paragraph-no-margin-bottom
{
	margin-bottom: 0px;
}
table.table-primary
{
	border: 5px solid #000;
	border-width: 5px;
	vertical-align: top;
	border-collapse: separate;
}
table.table-primary th
{
	border-bottom: 5px solid #000;
	border-width: 5px;
	vertical-align: top;
}
table.table-secondary 
{
	border: 1px solid #ddd;
	border-width: 1px;
	vertical-align: top;
	border-collapse: separate;
}
table.table-secondary th
{
	border-bottom: 1px solid #ddd;
	border-width: 1px;
	vertical-align: top;
}
table.table-left
{
	float: left;
	width: auto;
	margin-right: 1em;
	margin-bottom: .2em;
}
table.table-right
{
	float: right;
	width: auto;
	margin-left: 1em;
	margin-bottom: .2em;
}
table.table-center
{
	width: auto;
	margin-right: auto;
	margin-left: auto;
}
thead.table-row-header
{
	background: #000;
	color: #ddd;
}
tbody.table-row-body
{
}
tfoot.table-row-footer
{
	background: #000;
	color: #ddd;
}
th.table-cell-header
{
	background: #000;
	color: #ddd;
}
td.table-cell-data
{
}
td.text-annotate,
p.text-annotate,
span.text-annotate
{
	font-size: 8pt;
	text-decoration: none;
	padding: 2px 5px;
	border: 1px solid;
	line-height: 1.4em;
}
td.text-fine-print,
p.text-fine-print,
span.text-fine-print
{
	font-size: 75%;
	text-decoration: none;
	line-height: 1.5em;
}
td.text-box-primary,
p.text-box-primary,
span.text-box-primary,
p.paragraph-box-primary
{
	margin: .5em 0em;
	padding: .5em;
	border: 1px solid #000;
	line-height: 1.5em;
}
td.text-box-secondary,
p.text-box-secondary,
span.text-box-secondary,
p.paragraph-box-secondary
{
	margin: .5em 0em;
	padding: .5em;
	border: 1px solid #ddd;
	line-height: 1.5em;
}
td.text-box-warning,
p.text-box-warning,
span.text-box-warning,
p.paragraph-box-warning
{
	color: red;
	line-height: 1.4em;
	text-decoration: none;
	padding: 10px;
	border: 1px solid red;
}
.text-box-notice,
p.text-box-notice,
span.text-box-notice, 
p.paragraph-box-notice
{
	line-height: 1.4em;
	text-decoration: none;
	padding: 10px;
	border: 1px solid;
	margin: .5em 0em;
}
td.text-box-example,
p.text-box-example,
span.text-box-example,
p.paragraph-box-example
{
	font-family: courier;
	line-height: 1.4em;
	word-spacing: normal;
	text-decoration: none;
	border-top: 1px dashed #000;
	border-bottom: 1px dashed #000;
	margin: 10px 0px;
	padding: .5em;
}
td.text-highlighter,
p.text-highlighter,
span.text-highlighter
{
	color: #000;
	background-color: yellow;
	text-decoration: none;
	padding: 2px;
}
td.text-highlighter a,
p.text-highlighter a,
span.text-highlighter a
{
	color: #000;
}
td.text-quote,
p.text-quote,
span.text-quote
{
	font-size: 150%;
	line-height: 150%;
	font-style: oblique;
	margin: 0px;
	padding: 0px;
	border: none;
}