﻿/*

    Notes:
    1% browsers 640px wide
    20% are 1024px wide
    80% are bigger
    2nd May 2016

So breakpoint should be around 1000px;

Fonts
Lato / sans-serif 
  Font-weights
    light: 300
    semibold: 500
    bold: 700;
    heavy: 900

Color Scheme:
    green-bg: rgb(206, 240, 216) or #CEF0D8;
    light blue: rgb(147,203,218) or #93CBDA;
    darker blue text: rgb(42, 125, 160) or #2A7DA0;
    footer-grey: rgb(109,110,113) or #6D6E71;
    purple: rgb(185,79,139) or #B94F8B;
*/
/* remove all bootstrap rounded corners */
/* Site Wide Stuff */
* {
    -webkit-border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    border-radius: 0 !important;
}

.greenblue {
    color: #CEF0D8 !important;
}

.lightblue {
    color: #93CBDA !important;
}

.darkblue {
    color: #2A7DA0 !important;
}

.darkgray {
    color: #6D6E71 !important;
}

.purple {
    color: #B94F8B !important;
}

.alert-info {
    background-color: transparent;
    border: none;
    border-left: 5px solid #B94F8B;
    color: initial;
    font-weight: 400;
}

body {
	font-family: 'Lato', sans-serif;
	font-size: 16px; /* Base font size */
	word-spacing: 0.1em;
}

h1, h2, h3, h4, h5, h6 {
    color: #B94F8B;
    font-weight: 500;
}

/* site wide */
h1 {
    font-size: 180%;
    padding: 10px 0;
    /*color:#a92966;*/
}

    h1 + article {
        margin-top: 4ex;
    }

p {
    line-height: 2.5ex;
    font-weight: 300; /* light */
	margin-bottom: 3ex;
}

a:hover, a:active {
    text-decoration: none;
    outline: 0;
}


p, ul, ol, i, label {
    font-size: 110%;
    font-weight: 300;
    line-height: 2.5ex;
}

li {
    margin-bottom: 2ex;
}

a, a:link, a:visited {
    color: #2A7DA0;
    font-weight: 500;
    outline: 0;
}

    a:hover, a:active {
        color: #2A7DA0;
    }

#page-content h1.inverse {
    background-color: #B94F8B;
    color: #fff;
    font-size: 240%;
    text-align: center;
    font-weight: 700;
}

h2.inverse {
    background-color:transparent;
    color:#B94F8B;
}

h1#subheading {
    margin: 0 0 2em 0;
}

h2 {
    background-color: #6d6e71;
    color: #fff;
    font-size: 250%;
    font-weight: 700;
    margin: 2ex 0 2ex 0;
    text-align: center;
    text-transform: none;
    width: 100%;
    padding: 0.2ex 0 0.3ex 0;
}

    h2:first-of-type {
        margin-top:0;
    }
/* utility classes */

.padded-row {
    padding: 0 50px;
}

.row-eq-height {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
}

.clear {
    clear: both;
}

.full-height {
    height: 100%;
    min-height: 100%;
}

.product-text .no-margin {
    margin: 0;
    padding: 0;
}

.prod-detail-panels h3 {
    height: 3ex;
}

a i.fa:hover {
	opacity: 0.5;
}

.text-normal-case {
    text-transform: none;
}

.color-white {
    color: #fff;
}

.text-italic {
    font-style: italic;
}

.trademark {
    font-weight: bold;
    
}

.trademark::after {
    content: "\2009\00ae"; /* thin space and registered trademark */
    position: relative;
    font-size: 60%;
    line-height: 0;
    vertical-align: baseline;
    top: -0.8em;
}

.fill {
    height: 100%;
}

w > div {
    height: 100%;
}

code {
    padding: 10px 4px 10px 20px; /* Fix for Bootstrap indenting first line one space! */
    display: block;
    line-height: 1.8em;
}

/* Main Template - sitewide */
.container-fluid {
    padding-left: 0;
    padding-right: 0;
}
/* Used  */
.highlight {
    background-color: yellow;
	color: black;
}

.download-panel {
    width: 450px !important;
    border: 1px solid #93CBDA;
    padding: 0 0 1ex 1em;
    position: relative;
    min-height: 160px;
    display: block;
    margin: 4ex auto;
}

    .download-panel h3 {
        margin-top: 0.5em !important;
    }

    .download-panel p {
        margin-bottom: 0.1em;
    }

        .download-panel p span {
            font-weight: 500;
        }

    .download-panel .dload-info {
        display: inline-block;
        width: 290px;
    }

    .download-panel .dload-link {
        text-align: center;
        display: inline-block;
        width: 120px;
        height: 70px;
        vertical-align: top;
    }


    .download-panel h3 {
        text-align: left;
        margin: 2em 0 0 0;
    }

    .download-panel .dload-info {
        margin-bottom: 30px;
    }

.download-lnk-lrg a {
    font-size: 110%;
    text-align: center;
    font-weight: normal;
    color: #B94F8B;
}

p.download-lnk-lrg a span {
    text-transform: uppercase;
    font-weight: 300;
    font-size: 100%;
}

.download-lnk-lrg i {
    font-size: 4em;
    color: #B94F8B;
}

a.chm-dload-lnk {
    position: absolute;
    bottom: 5px;
    width: 100%;
    display: block;
    outline: 0;
}

.ro#page-wrapper {
    padding: 0;
}

.main-menu {
    padding-right: 50px;
}

.navbar-default {
    background-color: #fff;
    padding: 10px 0 0 0;
    margin-bottom: 0;
}

    .navbar-default .nav li a {
        font-family: inherit;
        color: #2A7DA0;
        font-size: 130%;
        font-weight: 500;
        letter-spacing: 1px;
        text-transform: uppercase;
    }

.topbar-wrapper {
    background-color: #fff; /*#d0f3da*/
    padding-left: 0;
}

.navbar-default .nav li a:hover, .navbar-default .nav li a:focus {
    color: #777;
    outline: 0;
}

.navbar-default.navbar-shrink .navbar-brand img {
    height: 80px;
}

.nav-wrapper {
    background-color: #CEF0D8;
    display:block;
    float:right;
    width:100%;
}

ul.navbar-right {
    background-color: transparent;
    margin: 0;
}

.navbar-default.navbar-shrink {
    background-color: #fff;
    padding: 10px 0 0 0;
    margin: 0;
    border-bottom: 1px solid #777;
}

    .navbar-default.navbar-shrink #logo img {
        width: 300px;
    }

    .navbar-default.navbar-shrink #topbar-search {
        margin-top: 20px;
    }

.navbar-default .navbar-toggle, .navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
    background-color: rgb(147, 203, 218);
}

.navbar-default .navbar-toggle {
    border: #fff;
}

header {
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: center bottom;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    color: #fff;
    height: 400px;
    text-align: center;
    margin: 0;
}

    header .container {
        position: relative;
    }

    header h1 {
        margin: 0.8em 0 0.3em 0;
        font-size: 320%;
        font-weight: 700;
        color: #fff;
        text-transform:uppercase;
        letter-spacing: 0.06em;
    }

        header h1 span {
            text-transform:none;
        }

    header p {
        font-size: 120%;
        font-weight: 600;
        letter-spacing: 0.02em;
    }

span.tm {
    font-size:smaller;
    vertical-align:super;
}

#submenu a, #submenu a:link, #submenu a:visited {
    color: #fff;
    font-weight: bold;
    font-size: 110%;
}

    #submenu a:hover, #submenu a:active {
        color: #93CBDA;
        background-color: transparent;
    }

#submenu-wrapper {
    width: 100%;
    background-color: #b94f8b;
    text-align: center;
}

ul#submenu {
    background-color: #b94f8b;
    float: none;
    display: inline-block;
    height: 100%;
    text-align: center;
    height: 50px;
}

/* Search box */

/* enable absolute positioning */

.search-box {
    margin: 50px 50px 0 0;
    position: relative;
    width: 380px;
}

    /* style glyph */

    .search-box .glyphicon {
        position: absolute;
        padding: 10px;
        right: 0px;
        padding-right: 30px;
        color: #bbb;
    }

    .search-box input {
        background-color: transparent;
        -webkit-border-radius: 0 !important;
        -moz-border-radius: 0 !important;
        border-radius: 0 !important;
        border: 3px solid #dff0f5;
        height: 40px;
    }

    .search-box .glyphicon, .search-box input {
        font-size: 20px;
    }

    .search-box .glyphicon {
        cursor: pointer;
    }

.form-control::-webkit-input-placeholder { /* Chrome */
    color: #93CBDA;
    font-weight: 500;
}

.form-control:-ms-input-placeholder { /* IE 10+ */
    color: #93CBDA;
    font-weight: 500;
}

.form-control::-moz-placeholder { /* Firefox 19+ */
    color: #93CBDA;
    font-weight: 500;
    opacity: 1;
}

.form-control:-moz-placeholder { /* Firefox 4 - 18 */
    color: #93CBDA;
    font-weight: 500;
    opacity: 1;
}

#topbar-search {
    margin: 50px 0 10px 0;
}


input#query, .input-group-btn .btn {
}


.input-group-btn .btn {
    border-left: 0;
    height: 34px;
    margin-top: -1px;
}

.search-query:focus + button {
    z-index: 3;
}

section {
    margin: 0;
    padding: 0;
}

#page-header, #page-content {
    margin: 0 auto;
    padding: 0;
}

#footer {
    background-color: rgb(109, 110, 113);
    color: #fff;
    padding: 2ex;
    margin-top: 4em;
    text-align: left;
}

    #footer .panel-footer {
        background-color: transparent;
        border: 0;
        text-align: left;
        padding-top: 0;
    }

    #footer h4 {
        font-size: 90%;
        color: #fff;
        font-weight: 400;
        text-transform: uppercase;
        font-weight: 600;
        margin-bottom: 2ex;
        text-align: left;
    }

    #footer .panel-footer p, #footer .panel-footer a {
        font-size: 90%;
        font-weight: 500;
    }

    #footer a:link, #footer a:visited {
        color: #93CBDA;
    }

    #footer ul {
        list-style: none;
        padding: 0;
    }

        #footer ul li {
            margin-bottom: 1ex;
        }
/* Home page */
.home-header {
    height: 600px;
    background-repeat: no-repeat;
    background-color: transparent;
}

    .home-header p {
        text-align: left;
    }


    .home-header .btn-intro {
        margin-top: 10px;
    }

header .intro-text {
    padding-top: 10%;
    padding-bottom: 0;
}

.productPanels p {
    font-weight: 300;
}

.lrg-dload-link {
	text-align: center;
	margin-bottom: 0em;
}

    .lrg-dload-link a {
        color: #B94F8B;
        font-weight: 300;
        text-transform: uppercase;
    }

    .lrg-dload-link i {
        font-size: 300%;
        margin-right: 0.2em;
    }

    .lrg-dload-link a span {
        padding-top: 0;
        display: block;
    }

.intro-text {
    max-height: 625px;
}

.btn-intro {
    display: inline-block;
    border: 2px solid #ddd;
    border-radius: 0;
}

a.btn-intro, a:link.btn-intro, a:visited.btn-intro {
    color: #fff;
    font-size: 180%;
    font-weight: bold;
    letter-spacing: 0.03em;
}



#home-products .productPanel {
    text-align: center;
    margin-bottom: 20px;
}

#home-products .productDesc {
    min-height: 330px;
}

#home-products h1.inverse {
    font-size: 230%;
    padding: 0.65ex 1em;
    font-weight: 600;
}

#home-products .productPanel h1 {
    color: #2A7DA0;
    font-size: 140%;
    text-align: center;
    text-transform: none;
}

#home-products .productPanel p {
    line-height: 2.2ex;
    font-size: 100%;
}

#home-products .productDesc a {
    color: #2A7DA0;
}

.whatsnewpanel {
	padding: 0;
	/*margin: 0 0 100px 0;*/
}

    .whatsnewpanel h1 {
        text-align: center;
        margin: 0;
        text-transform: none;
        font-weight: 600;
        padding: 0.75ex 0;
    }

.textPanel {
    margin: 0;
    padding: 0;
}

    .textPanel p {
        padding: 50px;
        background-color: transparent;
        line-height: 2.5ex;
        font-weight: 200;
        font-size: 110%;
    }

.balloon {
    position: absolute;
    margin-bottom: 40px;
}

    .balloon blockquote {
        background-repeat: no-repeat;
        width: 492px;
        height: 233px;
        background-image: url("../img/blockquote-bg.png");
        padding: 80px 40px 0 40px;
        border: 0;
        color: #fff;
        font-size: 20px;
        font-weight: 600;
        font-style: italic;
        margin-top: 60px;
    }

/* Products page */
#products-hdr {
}

#products-page h1 {
    text-transform: none;
    color: #fff;
    background-color: #6d6e71;
    text-align: center;
    width: 100%;
    margin-top: 0;
    font-weight: 700;
    font-size: 250%;
}

h3 {
    font-size: 150%;
    line-height: 2.5ex;
    font-weight: 400;
}
    h3 a:link {
        color: #b94f8b;
    }
.btn-more {
    color: #B94F8B;
    background-color: #fff;
    border: 2px solid #B94F8B;
    -webkit-border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    border-radius: 0 !important;
    font-size: 120%;
    font-weight: 700 !important;
    text-decoration: none;
    margin-top: 35px;
}

a.btn-more, a:link.btn-more, a:visited.btn-more {
    color: #B94F8B;
}

a.focus.btn-more, a:focus.btn-more, a:hover.btn-more {
    color: #fff !important;
    background-color: #B94F8B;
}

#products-page section p {
}

/* Product Sections Common Styles */

.bg-img {
    background-repeat: no-repeat;
}

.bg-vert-goo {
    background-image: url("../img/logos/vert-goo.png");
    background-repeat: no-repeat;
    background-size: contain;
    min-height: 400px;
}

.bg-horiz-goo {
    background-image: url("../img/logos/horiz-goo.png");
    background-repeat: no-repeat;
    background-size: contain;
    min-height: 212px;
}

.footnote {
    margin: 10px 50px;
}

#product-nav {
    margin-bottom: 0;
    border: none;
}

    #product-nav .icon-bar {
        background-color: #fff;
    }

    #product-nav .navbar-toggle {
        border: 1px solid #fff;
        margin-right: 30px;
    }



.sidebar {
    background-color: #d0f3da;
    height: 100%;
    position: static;
}

    .sidebar p {
        font-size: 120%;
        color: #b94f8b;
        text-align: center;
        margin: 10% 20%;
    }

        .sidebar p i {
            font-size: 250%;
        }

section.support {
    margin-left: -8px;
}

#support-wrap {
    margin: 0 0 0 -20px;
    word-wrap: break-word;
}

section.support h1 {
    width: 100%;
    background-color: #acd8e4;
    color: #b94f8b;
    text-align: center;
    padding: 10px;
    text-transform: uppercase;
    font-size: 150%;
}

section.support p {
    margin-left: 10px;
}

.icon-btn, .icon-btn:hover, .icon-btn:active, .icon-btn:visited, .icon-btn:focus, a.icon-btn, a.icon-btn:hover, a.icon-btn:active, a.icon-btn:visited, a.icon-btn:focus {
    color: #b94f8b;
    text-decoration: none;
    text-align: center;
}

    .icon-btn i {
        color: #b94f8b;
        font-size: 300%;
        display: block;
    }

.fill {
    min-height: 100%;
    height: 100%;
}

.no-float {
    float: none;
}

section.support dl.collapsible {
    color: #2a7da0;
    padding: 20px;
    max-width: 1200px;
}


dl.collapsible dt {
    cursor: pointer;
    margin: 0 0 10px 10px;
}

dl.collapsible dd {
    margin: 0 0 30px 50px;
    color: #333;
}

.search-results a:link h2, .search-results a:visited h2 {
    font-size: 130%;
    font-weight: bold;
    text-decoration: none;
}

.search-results a:hover h2 {
    color: #777;
    text-decoration: none;
}

/* Individual Product Page Common Styles */
.prod-detail-panels div {
    text-align: center;
}

    .prod-detail-panels div i.fa {
        color: #fff;
        width: 2em;
        text-align: center;
    }

.prod-detail-panels h2 {
    color: #b94f8b;
    font-size: 2em;
}

.prod-detail-panels a {
    color: #b94f8b;
}

.prod-detail-panels h1 {
    font-size: 190%;
    text-transform: none;
    padding: 15px 0;
}


.prod-detail-panels p {
    text-align: left;
}

.circle-icon {
    margin: 30px;
    padding: 30px;
    border-radius: 50%;
}

/* for FontAwesome icons */
.bg-green {
    background-color: #CEF0D8;
}
.bg-dk-green {
    background-color: #9fe6b4;
}
.bg-blue {
	background-color: #92ccdb;
}
.bg-grey {
    background-color: #848688;
}

.blue-bg {
	background: #81b2c7;
}
.purple-bg {
	background: #B94F8B;
}

.product-page-header h1 {
    font-size: 300%;
    display: inline-block;
    margin: 0;
    padding: 100px 0 50px 0;
}

.product-page-263p {
    font-size: 150%;
}
/* Specific Product Page overrides */

.prod-intro ul {
    margin-top: 2em;
}

    .prod-intro ul li {
        list-style: disc;
        line-height: 2em;
    }

        .prod-intro ul li strong {
            color: #b94f8b;
        }

        .prod-intro ul li span {
            color: #777;
        }

.prod-intro h1 {
    font-size: 220%;
    font-weight: 600;
}

.bigquote {
    color: #B94F8B;
    font-size: 130%;
    font-weight: 800;
    font-style: italic;
}

    .bigquote p {
        line-height: 2ex;
    }

    .bigquote i.fa-quote-left, .bigquote i.fa-quote-right {
        font-size: 200%;
    }

    .bigquote i.fa-quote-left {
        margin: 0 1ex 0 0;
    }

    .bigquote i.fa-quote-right {
        margin: 0 0 0 1ex;
    }

    .bigquote span {
        font-style: normal;
        font-size: 80%;
        font-weight: 400;
        color: #81b2c7;
        float: right;
        text-transform: uppercase;
    }

.prod-detail-panels {
    margin-top: 50px;
    margin-bottom: 50px;
}

i {
}



table.download-table {
    width: 500px;
    margin: 3em;
}

    table.download-table tr td:first-of-type {
        width: 350px;
    }

    table.download-table tr td:last-of-type {
        text-align: center;
        width: 150px;
    }

    table.download-table th, .download-table td {
        padding: 10px;
    }

    table.download-table > th {
        text-align: center;
        font-size: 150%;
        font-weight: 700;
    }

    table.download-table td {
        font-weight: 500;
    }


.diptych {
    font-weight: 500;
    text-align: center;
    padding: 50px 0;
}

    .diptych h2 {
        background-color: transparent;
        font-size: 160%;
    }

    .diptych p, .diptych li {
        color: #fff;
    }

    .diptych p {
        line-height: 2.5ex;
    }

    .diptych .icons {
        margin-top: 20px;
    }

	.diptych .icons i {
		font-size: 3em;
	}

	.diptych .icons p {
		text-transform: uppercase;
	}

.tight-panels {
    padding: 0;
}

#extra-info h1 {
    font-weight: 800;
}

.extra-info > p {
    padding: 10px;
}

.heading {
    margin-bottom: 30px;
}

section#extra-info {
    margin-bottom: 30px;
}

.prod-endorsements {
    min-height: 500px;
}

    .prod-endorsements p.quote {
        color: #777;
    }

    .prod-endorsements h1 {
        color: #333;
        font-weight: 700;
    }

    .prod-endorsements .carousel, .slide {
        height: 500px;
    }

        .slide span.attrib {
            float: right;
            text-transform: uppercase;
            color: #777;
            font-weight: 300;
            font-size: 2.5ex;
        }

.carousel-indicators li {
    border: 1px solid #000;
}

.carousel-indicators .active {
    background-color: #93CBDA;
}

.carousel-control.left, .carousel-control.right {
    background: none;
    position: absolute;
    top: 50%;
}

.carousel-control.left {
    left: 20px;
}

.carousel-control.right {
    right: 20px;
}

.quote {
    color: #b94f8b;
    font-size: 180%;
    font-style: italic;
}

.slide i {
    color: #B94F8B;
    font-size: 320%;
}

/* Download.aspx */
p.prominent-box {
}

#support {
}

#fine-print {
    border-top: 1px solid #777;
    padding-top: 1em;
    margin-top: 3em;
}

    #fine-print > p {
        font-size: 0.8em;
    }

.sidebar aside p, .sidebar aside p a {
    font-weight: 700;
    color: #777;
}

    .sidebar aside p i, .sidebar aside p span {
        color: #B94F8B;
    }

#languageModal modal-content {
    text-align: left;
    padding: 20px;
}

section#extra-info {
    background-image: url('../img/goolink.png');
    background-repeat: no-repeat;
    background-position: 50% 100px;
    min-height: 400px;
}

@media screen and (max-width: 1010px) and (min-width: 100px) {
    #query {
        margin-bottom: 20px !important;
        margin-top: 20px;
    }
}
/* Quote Carousell on product pages */

.quote-container {
    position: relative;
    height: 400px;
}

.quote {
    position: absolute;
    top: 0;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    height: 100%;
    margin: 0;
    font-size: 130%;
}

blockquote.quote {
    color: #6D6E71;
    border: 0;
}

.quote-container footer {
    position: absolute;
    bottom: 60px;
    right: 0;
}

.item .fa-quote-right, .item .fa-quote-left {
    margin-top: 120px;
}
/* End Quote Carousel */

@media screen and (max-width:440px) {
    header h1 {
        font-size:250%;
    }
}



