/* All Devices */
    /**
     * The default font-family.
     */
    body {
        font-weight: 300;
        font-family: 'Roboto', Arial, Helvetica, sans-serif;
    }

    /**
     * The default link color.
     */
    a {
        color: #1450C8;
    }

    /**
     * The default hover styles for links.
     */
    a:hover {
        text-decoration: none;
    }

    /**
     * The -page- BG color/image of the enclosed design.
     */
    body.enclosed {
        background: url('../images/bg.png');
        background-color: #aaa;
    }

    /**
     * The -footer- BG color of the full-width design.
     */
    body.full {
        background-color: #222;
    }

    /**
     * The -page- BG color of the isolated design.
     */
    body.isolated {
        background: url('../images/bg.png');
        background-color: #aaa;
    }

    /**
     * The BG color of the top bar.
     */
    #top {
        background-color: #f8f8f8;
        border-top: 5px solid #333;
        border-bottom: 1px solid #eee;
    }

    /**
     * The BG color of the header area.
     */
    #header {
        background-color: #fff;
    }

    /**
     * The BG color and outer border colors of the navigation menu.
     */
    #header #nav {
        border-top: 0;
        border-bottom: 1px solid #fff;
        background-color: #2764a8;
        font-family: "Open Sans", "Helvetica Neue", Arial, Sans-Serif;
    }

    /**
     * The BG color of the sub-menu items in the navigation menu.
     */
    #header #nav ul ul {
        border-top: 1px solid #fff;
        background-color: #3498db;
    }

    /**
     * The link color of the items in the navigation menu.
     */
    #header #nav a {
        color: #fff;
        font-weight: bold;
    }

    /**
     * The link color of the sub-menu items in the navigation menu.
     */
    #header #nav ul ul a {
        color: #fff;
    }

    /**
     * The hover BG color of the root menu items in the navigation menu.
     * This setting does not affect the mobile navigation menu.
     */
    #header #nav li.active a.hover {
        background-color: #3498db;
        color: #fff;
    }

    /**
     * The hover BG color of the sub menu items in the navigation menu.
     * This setting does not affect the mobile navigation menu.
     */
    #header #nav ul ul li.active a.hover {
        background-color: #2764a8;
        color: #fff;        
    }

    /**
     * The colors of the lines that separate each menu item.
     * These can be a tad tricky to get right.
     */
    #header #nav li:first-child { border-left: 0; }
    #header #nav li:last-child { border-right: 1px solid #eee; }
    #header #nav li a { border-right: 0; border-left: 1px solid #eee; }
    #header #nav ul ul li { border-left: 1px solid transparent; }

    /**
     * The BG color and text color of the content area.
     * This will rarely need changed.
     */
    .content,
    #isolated {
        background-color: #fff;
        color: #333;
    }

    /**
     * The BG color and text color of the "standout" sections
     * in the content area.
     */
    .contrast {
        background-color: #eee;
        color: #000;
    }

    /**
     * The BG color and text color of the alternate "standout" sections
     * in the content area.
     */
    .contrast.alternate {
        background-color: #444;
        color: #fff;
    }

    /**
     * The color of all header tags inside a contrast area.
     */
    .contrast h2, .contrast .h2,
    .contrast h3, .contrast .h3,
    .contrast h4, .contrast .h4,
    .contrast h5, .contrast .h5,
    .contrast h6, .contrast .h6 {
        color: #555;
    }

    /**
     * The color of all header tags inside an alternate contrast area.
     */
    .contrast.alternate h2, .contrast.alternate .h2,
    .contrast.alternate h3, .contrast.alternate .h3,
    .contrast.alternate h4, .contrast.alternate .h4,
    .contrast.alternate h5, .contrast.alternate .h5,
    .contrast.alternate h6, .contrast.alternate .h6 {
        color: #fff;
    }

    /**
     * Slider & title text background. Change image to change background color.
     */
    #slider .inside.overlay,
    #title .inside.overlay {
        background: url('images/transparent.png');
    }

    /**
     * Slider & title text color when text overlay background is NOT being used.
     */
    #slider .inside *,
    #title .inside * {
        color: #000;
        text-shadow: 3px 3px 2px rgba(70, 70, 70, 1);
    }

    /**
     * Slider & title text color when text overlay background is being used.
     */
    #slider .inside.overlay *,
    #title .inside.overlay * {
        color: #fff;
        text-shadow: 3px 3px 2px rgba(0, 0, 0, 1);
    }

    /**
     * The styles of the home-page slogan for desktops & laptops.
     * You can only have one slogan per page.
     */
    #slogan {
        color: #777;
        vertical-align: middle;
        text-align: center;
        font-weight: 300;   /* 300, 400 */
        font-style: italic; /* normal, italic */
        font-size: 4.25em;
        font-family: 'Roboto', sans-serif;
        line-height: 1.8;
    }

    /**
     * The text color of the captions below images.
     */
    .image-left span,
    .image-right span ,
    .image-center span {
        color: #555;
    }

    /**
     * The BG color and text color of the footer.
     */
    #footer {
        border-top: 1px solid #FFF;
        background-color: #3082D4;
        color: #fff;
    }

    /**
     * Some misc styles to tidy up the <ul> menus in the footer.
     */
    #footer ul {
        margin: 0;
        padding: 0;
        list-style: none;
        font-size: 0.9em;
    }

    /**
     * Some misc styles to tidy up the <ul> menus in the footer.
     */
    #footer ul a {
        color: #fff;
        text-decoration: none;
    }

    /**
     * Some misc styles to tidy up the <ul> menus in the footer.
     */
    #footer ul a:hover {
	        color: #fff;
        text-decoration: underline;
    }

    /**
     * Footer header/title tags.
     */
    #footer h1,
    #footer h2,
    #footer h3,
    #footer h4,
    #footer h5,
    #footer h6 {
        border-bottom: 1px solid #fff;
        color: #fff;
        font-weight: normal;
        font-size: 1em;
    }

    /**
     * Footer <h1> tag. Will likely never get used.
     */
    #footer h1 {
        font-size: 2em;
    }

    /**
     * Footer <h2> tag. Will likely never get used.
     */
    #footer h2 {
        font-size: 1.6em;
    }

    /**
     * Footer <h3> tag.
     */
    #footer h3 {
        font-size: 1.4em;
    }

    /**
     * Footer <h4> tag. This tag is most common.
     */
    #footer h4 {
        font-size: 1.3em;
    }

    /**
     * Newsletter text field styles.
     */
    #newsletter input[type="text"] {
        border: 1px solid #222;
        background-color: #777;
        color: #fff;
    }

    /**
     * Newsletter button styles.
     */
    #newsletter button {
        border: 1px solid #222;
        background-color: #333;
        color: #fff;
    }

    /**
     * The BG color and text color of the copyright area in the footer.
     */
    #bottom {
        border-top: 1px solid #ffffff;
        background-color: #2764A8;
        color: #eee;
    }

    /**
     * Copyright link styles.
     */
    #bottom a {
        text-decoration: none;
    }

    /**
     * Copyright Link Styles.
     */
    #bottom a:hover {
        color: #ddd;
    }

    /**
     * Price grid header BG color and border-color.
     */
    .price-grid .name,
    .price-grid .price,
    .price-grid .desc {
        border-bottom: 1px solid #fff;
        background-color: #ccc;        
    }

    /**
     * Price name styles.
     */
    .price-grid .name {
        font-size: 1.3em !important;
    }

    /**
     * Price value styles.
     */
    .price-grid .price {
        font-size: 4.5em !important;
    }

    /**
     * Price description styles.
     */
    .price-grid .desc {
        font-size: 1.2em !important;
    }

    /**
     * Price grid item BG color and border-color.
     */
    .price-grid .info {
        border-bottom: 1px solid #ccc;
        background-color: #eee;
    }
/* End All Devices */

/* Desktops & Laptops Only */
@media (min-width: 1025px) {
    body.enclosed #footer a,
    body.enclosed #bottom a {
        color: #eee;
    }

    body.enclosed #header {
        border-right: 1px solid #656565;
        border-left: 1px solid #656565;
    }

    body.enclosed.margins #header {
        border-top: 1px solid #656565;
    }

    body.enclosed .content,
    body.enclosed #slider,
    body.enclosed #title {
        border-right: 1px solid #656565;
        border-left: 1px solid #656565;
    }
    
    body.enclosed #footer {
        border-right: 1px solid #333;
        border-left: 1px solid #333;
    }

    #intro {
        padding: 20px 0 40px;
        background-image: url('../images/index-image-title.jpg');
        background-position: center center;
        background-repeat: no-repeat;
    }

    #demo-video {
        float: right;
        margin-top: 20px;
        width: 60%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    #demo-video img {
        width: 100%;
    }

    #quick-signup {
        float: left;
        padding: 20px 40px 0 0;
        width: 40%;
        position: relative;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    #quick-signup #quick-1 {
        font-size: 2.5em;
        line-height: 1.5;
        margin: 0.40em 0 0;
        color: #fff;
        text-shadow: 1px 1px 2px rgba(0, 0, 0, 1);
    }

    #quick-signup #quick-2 {
        margin: 1em 0 0;
        font-size: 1.5em;
        line-height: 1.25;
        color: #f2f2f2;
        text-shadow: 1px 1px 2px rgba(0, 0, 0, 1);
    }

    #quick-signup #quick-1 span {
        display: block;
        line-height: 1.5;
    }

    #quick-signup #quick-3 {
        margin: 2em auto 0 auto;
        width: 100%;
    }
    
    #quick-signup #quick-3 input[type="text"] {
        border: 1px solid #555;
        zoom: 1; 
        -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
        filter: alpha(opacity=80);
        -moz-opacity:0.8;
        -khtml-opacity: 0.8;
        opacity: 0.8;
    }

    #quick-signup #quick-3 a {
        line-height: 40px;
        height: 40px;
        display: block;
        text-align: center;
        font-size: 1.1em;
    }

    #quick-signup #quick-first-name {
        float: left;
        padding: 0 0.469em 0 0;
        width: 50%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    #quick-signup #quick-last-name {
        float: left;
        padding: 0 0 0 0.469em;
        width: 50%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
}
/* End Desktops & Laptops Only */

/* Tablets & Phablets Only */
@media (min-width: 768px) and (max-width: 1024px) {
    /**
     * This is the color of the footer and copyright links on tablets.
     */
    #footer a,
    #bottom a {
        color: #eee;
    }

    #footer {
        font-size: 0.8em;
    }

    #footer ul {
        font-size: 1em;
    }

    #intro {
        padding: 20px 0 40px;
        background-image: url('../images/index-image-title.jpg');
        background-position: center center;
        background-repeat: no-repeat;
    }

    #demo-video {
        float: right;
        margin-top: 20px;
        width: 60%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    #demo-video img {
        width: 100%;
    }

    #quick-signup {
        float: left;
        padding: 20px 20px 0 0;
        width: 40%;
        position: relative;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    #quick-signup #quick-1 {
        font-size: 2.2em;
        line-height: 1.5;
        margin: -0.2em 0 0;
        color: #fff;
        text-shadow: 1px 1px 2px rgba(0, 0, 0, 1);
    }

    #quick-signup #quick-1 span {
        display: block;
        line-height: 1.5;
    }

    #quick-signup #quick-2 {
        margin: 1em 0 0;
        font-size: 1.2em;
        line-height: 1.25;
        color: #f2f2f2;
        text-shadow: 1px 1px 2px rgba(0, 0, 0, 1);
    }

    #quick-signup #quick-3 {
        margin: 1.7em auto 0 auto;
        width: 100% !important;
    }

    #quick-signup #quick-3 input[type="text"] {
        border: 1px solid #555;
        zoom: 1; 
        -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
        filter: alpha(opacity=80);
        -moz-opacity:0.8;
        -khtml-opacity: 0.8;
        opacity: 0.8;
    }

    #quick-signup #quick-3 a {
        line-height: 32px;
        height: 32px;
        display: block;
        text-align: center;
    }

    #quick-signup #quick-first-name {
        float: left;
        padding: 0 0.469em 0 0;
        width: 50%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    #quick-signup #quick-last-name {
        float: left;
        padding: 0 0 0 0.469em;
        width: 50%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
}
/* End Tablets & Phablets Only */

/* Phones Only */
@media (max-width: 767px) {
    /**
     * This is the color of the "Menu" text on phones.
     */
    #mobile-menu .text {
        color: #fff;
        font-weight: bold;
    }

    /**
     * This is the color of the little 3-bar menu icon.
     */
    #mobile-menu .bar {
        background-color: #fff;
    }

    /**
     * Menu font size for mobile phones.
     */
    #header #nav #menu,
    #header #nav #menu {
        font-size: 1.2em;
    }

    /**
     * This is the BG color of the menu dropdown on mobile phones.
     */
    #header #nav #menu,
    #header #nav #menu ul {
        background-color: #ccd8e1;
    }

    /**
     * This is the text color of the sub-menu items on mobile phones.
     */
    #header #nav #menu li a {
        color: #405050;
    }

    /**
     * This is the color of the line that separates the menu items on phones.
     */
    #header #nav #menu li {
        border-top: 1px solid #fff;
    }

    /**
     * This is the color of the line that separates sub-menu items on phones.
     * This style is not used by default. See developer/designer if needed.
     */
    #header #nav #menu ul li {
        border: 0;
    }

    /**
     * The hover BG color of the menu items in the navigation menu.
     */
    #header #nav a.hover {
        background-color: #3498db !important;
        color: #fff !important;
    }

    /**
     * This is the color of the footer and copyright links on phones.
     */
    #footer a,
    #bottom a {
        color: #eee;
    }

    #top .inner {
        height: auto;
    }

    #tab-call {
        border-right: 0 !important;
        display: block !important;
    }

    #demo-video {
        margin-top: 20px;
        width: 100%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    #demo-video img {
        width: 100%;
    }

    #quick-signup {
        padding-top: 20px;
        width: 100%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        overflow: hidden;
    }

    #quick-signup #quick-1 {
        font-size: 2.0em;
        line-height: 1.5;
        margin: -0.2em 0 0;
        text-align: center;
    }

    #quick-signup #quick-2 {
        margin: 0.8em 0 0;
        font-size: 1.2em;
        line-height: 1.25;
        color: #555;
        text-align: center;
    }

    #quick-signup #quick-3 {
        margin: 1.5em 0 0 0;
        width: auto !important;
    }

    #quick-signup #quick-3 a {
        line-height: 32px;
        height: 32px;
        display: block;
        text-align: center;
    }

    #quick-signup .row {
        float: left;
        width: 100%;
    }

    #quick-signup a {
        float: left;
        width: 100%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    #quick-signup #quick-first-name {
        float: left;
        padding: 0 0.469em 0 0;
        width: 50%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    #quick-signup #quick-last-name {
        float: left;
        padding: 0 0 0 0.469em;
        width: 50%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }

    #twitter-button {
        float: left;
        margin-top: 10px !important;
        width: 100%;
    }
}
/* End Phones Only */

/* Button Styles */
    /**
     * Default button colors.
     */
    .button { border: 1px solid #ccc; background-color: #fff; }
    .button:hover, .button:focus { border: 1px solid #bbb; background-color: #eee; }
    .button:active { border-color: #aaa; background-color: #eee; }

    /**
     * Fixated button colors. These are usually "submit", "yes", or "OK" buttons.
     */    
    .button.fixate { border-color: #226491; background-color: #378cd2; color: #fff; }
    .button.fixate:hover, .button.fixate:focus { background-color: #3282be; }

    /**
     * Link button colors. These are usually "read more", "order now", and "continue" buttons.
     */
    .button.link { border-color: #ccc; background-color: #f2f2f2; color: #333; }
    .button.link:hover, .button.link:focus { background-color: #eee; }

    /**
     * Success button colors. These are usually "confirm", "thank you", "I understand" type buttons.
     */
    .button.success { border-color: #2d963c; background-color: #3cb950; color: #fff; }
    .button.success:hover, .button.success:focus { background-color: #37aa4a; }

    /**
     * Cautionary button colors. These are usually "confirm", "thank you", "I understand" type buttons.
     */    
    .button.caution { border-color: #e6a555; background-color: #f5af5f; color: #fff; }
    .button.caution:hover, .button.caution:focus { border-color: #d28c46; background-color: #eba055; }

    /**
     * Failure button colors. These are usually "cancel", "try again", or "confirm delete" type buttons.
     */
    .button.failure { border-color: #c34646; background-color: #eb5a5a; color: #fff; }
    .button.failure:hover, .button.failure:focus { border-color: #962323; background-color: #cd4646; }
/* End Button Styles */

/* Project Specific Styles */

    #top .inner * {
        line-height: 22px;
    }

    #demo-video img {
        cursor: pointer;
    }

    #demo-video iframe {
        display: block;
    }

    #tab-call {
        border-right: 1px solid #eee;
        line-height: 42px !important;
        padding-right: 10px;
        color: #777;
    }

    #tab-call span {
        color: #555;
        margin: 0 !important;
        font-weight: bold;
    }

    #twitter-button {
        display: inline-block;
        margin-top: 0;
    }

    .cs-button-green {
        padding: 0 10px;
        color: #fff;
        font-weight: bold;
        text-shadow: 1px 1px #555;
        box-shadow: 0 1px #30e300 inset;
        /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#53c60f+0,299a0b+100 */
        background: #53c60f; /* Old browsers */
        background: -moz-linear-gradient(top,  #53c60f 0%, #299a0b 100%); /* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#53c60f), color-stop(100%,#299a0b)); /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top,  #53c60f 0%,#299a0b 100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top,  #53c60f 0%,#299a0b 100%); /* Opera 11.10+ */
        background: -ms-linear-gradient(top,  #53c60f 0%,#299a0b 100%); /* IE10+ */
        background: linear-gradient(to bottom,  #53c60f 0%,#299a0b 100%); /* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#53c60f', endColorstr='#299a0b',GradientType=0 ); /* IE6-9 */
        border: 1px solid #186d01;
    }

    .cs-button-green:hover {
        /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#4bb50e+0,22890b+100 */
        background: #4bb50e; /* Old browsers */
        background: -moz-linear-gradient(top,  #4bb50e 0%, #22890b 100%); /* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4bb50e), color-stop(100%,#22890b)); /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top,  #4bb50e 0%,#22890b 100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top,  #4bb50e 0%,#22890b 100%); /* Opera 11.10+ */
        background: -ms-linear-gradient(top,  #4bb50e 0%,#22890b 100%); /* IE10+ */
        background: linear-gradient(to bottom,  #4bb50e 0%,#22890b 100%); /* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4bb50e', endColorstr='#22890b',GradientType=0 ); /* IE6-9 */
    }

    .cs-button-blue {
        padding: 0 10px;
        color: #fff;
        font-weight: bold;
        box-shadow: 0 1px #a3d1ff inset;
        text-shadow: 1px 1px #077aed;
        background: #7abcff;
        background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzdhYmNmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjQ0JSIgc3RvcC1jb2xvcj0iIzYwYWJmOCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM0MDk2ZWUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
        background: -moz-linear-gradient(top,  #7abcff 0%, #60abf8 44%, #4096ee 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#7abcff), color-stop(44%,#60abf8), color-stop(100%,#4096ee));
        background: -webkit-linear-gradient(top,  #7abcff 0%,#60abf8 44%,#4096ee 100%);
        background: -o-linear-gradient(top,  #7abcff 0%,#60abf8 44%,#4096ee 100%);
        background: -ms-linear-gradient(top,  #7abcff 0%,#60abf8 44%,#4096ee 100%);
        background: linear-gradient(to bottom,  #7abcff 0%,#60abf8 44%,#4096ee 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7abcff', endColorstr='#4096ee',GradientType=0 );
        font-family: "Open Sans", "Helvetica Neue", Arial, Sans-Serif;
        border: 1px solid #077aed;
    }

    .cs-button-blue:hover {
        background: #59acff;
        background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzU5YWNmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjQ0JSIgc3RvcC1jb2xvcj0iIzRmYTNmNyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMxMjgwZWQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
        background: -moz-linear-gradient(top,  #59acff 0%, #4fa3f7 44%, #1280ed 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#59acff), color-stop(44%,#4fa3f7), color-stop(100%,#1280ed));
        background: -webkit-linear-gradient(top,  #59acff 0%,#4fa3f7 44%,#1280ed 100%);
        background: -o-linear-gradient(top,  #59acff 0%,#4fa3f7 44%,#1280ed 100%);
        background: -ms-linear-gradient(top,  #59acff 0%,#4fa3f7 44%,#1280ed 100%);
        background: linear-gradient(to bottom,  #59acff 0%,#4fa3f7 44%,#1280ed 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#59acff', endColorstr='#1280ed',GradientType=0 );
    }

    .cs-button-orange {
        padding: 0 10px;
        color: #fff;
        font-weight: bold;
        box-shadow: 0 1px #ffb480 inset;
        text-shadow: 1px 1px #ff4100;
        background: #ffa84c;
        background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmYTg0YyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZjdiMGQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
        background: -moz-linear-gradient(top,  #ffa84c 0%, #ff7b0d 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffa84c), color-stop(100%,#ff7b0d));
        background: -webkit-linear-gradient(top,  #ffa84c 0%,#ff7b0d 100%);
        background: -o-linear-gradient(top,  #ffa84c 0%,#ff7b0d 100%);
        background: -ms-linear-gradient(top,  #ffa84c 0%,#ff7b0d 100%);
        background: linear-gradient(to bottom,  #ffa84c 0%,#ff7b0d 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffa84c', endColorstr='#ff7b0d',GradientType=0 );
        font-family: "Open Sans", "Helvetica Neue", Arial, Sans-Serif;
        border: 1px solid #ff4100;
        text-decoration: none !important;
    }

    .cs-button-orange:hover {
        background: #ff9328;
        background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmOTMyOCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZjcyMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
        background: -moz-linear-gradient(top,  #ff9328 0%, #ff7200 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ff9328), color-stop(100%,#ff7200));
        background: -webkit-linear-gradient(top,  #ff9328 0%,#ff7200 100%);
        background: -o-linear-gradient(top,  #ff9328 0%,#ff7200 100%);
        background: -ms-linear-gradient(top,  #ff9328 0%,#ff7200 100%);
        background: linear-gradient(to bottom,  #ff9328 0%,#ff7200 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff9328', endColorstr='#ff7200',GradientType=0 );
    }

/* End Project Specific Styles */

/* Begin Error/Success/Notice Messages */

    #wsc-success {
        margin: 0 0 20px;
        padding: 10px 32px 10px 10px;
        background: #cfa url('wsc-success.gif');
        background-position: 99% 8px;
        background-repeat: no-repeat;
        border: 1px solid #090;
        color: #060;
        font-weight: bold;
    }

    #wsc-error {
        margin: 0 0 20px;
        padding: 10px 32px 10px 10px;
        background: #ffe8e8 url('wsc-error.gif');
        background-position: 99% 8px;
        background-repeat: no-repeat;
        border: 1px solid #e11;
        color: #e11;
        font-weight: bold;
    }

    #wsc-error ul {
        margin: 0;
        padding: 10px 0 0;
        list-style-type: disc;
        list-style-position: inside;
        font-weight: normal;
    }

    #wsc-error a {
        color: #e11;
    }

    #wsc-success a {
        color: #060;
    }

    .wsc-notice {
        margin: 0 0 15px;
        padding: 10px;
        background: #eee;
        border: 1px solid #e11;
        color: #000;
    }

    .wsc-notice ul {
        margin: 0 !important;
        padding: 10px 0 0 !important;
        list-style-type: disc;
        list-style-position: inside;
    }

/* End Error/Success Messages */