@import 'https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600,700|Volkhov:400,400i';
@import url('https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css');

@import 'nav.css';
@import 'platform.css';
@import 'contact.css';

body {
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 400;
    color: #000000;
    font-size: 1rem;
    padding-bottom: 5.75rem;
    line-height: 1.4;
}

.row {
    margin-bottom: 0;
}


.large.button:hover {
    background: #00706C;
}


.js-off-canvas-overlay {
    background: none;
}
/** OFF CANVAS ************************************************/
.off-canvas {
    background: rgba(45,51,56,0.98);  
}


/** HOMEPAGE ************************************************/

.home-panel-1 {
    width: 100%;
    background: url(../images/bg-05.jpg) no-repeat;
    background-size: cover;
    background-position: center center;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5.625rem 0; 
}

.home-panel-1 .callout {
     margin-bottom: 3.75rem;
}

#random-1,
#random-2,
#random-1 {
    display: none;
}

.home-panel-2 {
    background: url(../images/blue-pattern.png) repeat;
    width: 100%;
    padding: 5.625rem 0;
    text-align: center;
    color: #ffffff;
}

.home-panel-2 .square-brackets {
    margin-top: 2rem;
}

.logos {
    width: 100%;
    display: flex;
    justify-content: center;
}

.logos:nth-child(3) {
    margin-bottom: 2.5rem;
}

.logos a {
    opacity: 0.75;
    margin-right: 3.75rem;
}

.logos a:last-child {
    margin-right: 0;
}

.logos a:hover {
    opacity: 1;
    transition: all 0.2s ease-in-out 0.1s;
}

/** TYPOGRAPHY ************************************************/
p,
.panel { font-size: 1.25rem; }

a { color: #00857d; }
a:hover,
#customers a:hover,
a:focus { 
    color: #005670; 
    transition: all 0.2s ease-in-out 0.1s;
}
h1, h2 {
    color: #e9e186;
    font-family: 'Volkhov', serif;
    font-weight: 400;
    line-height: 1.2;
}

h2 { margin-top: 1.5rem; }

h3, h4 {
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 700;
}

h3 { font-size: 1.5rem; }

h4 {
    color: #005670;
    font-size: 1.25rem;
}

strong { font-weight: 700; }

.semi-bold {
    font-weight: 600;
}

p { line-height: 1.4; }

.lrg-text { font-size: 1.875rem; }
.med-text { font-size: 1.5rem; }

.blue { color: #005670; }
.teal { color: #00857d; }

.center-text { text-align: center; }
.left-text { text-align: left; }

hr { margin: 3.125rem 0; }

/* LIST STYLES */
.bullet {
    padding-left: 1rem;
    padding-bottom: 1rem;
}
.bullet li {
    list-style: none;
    line-height: 1.4;
}

.bullet li:before {
    content: "\2022";
    margin-left: -1rem;
    padding-right: 0.7rem;
}


ol {
    list-style-type: none;
    margin-left: 0;
}

ol > li {
    counter-increment: customlistcounter;
    margin-left: 1rem;
}

ol > li:before {
    content: counter(customlistcounter) "\00a0\00a0\007C\00a0\00a0";
    float: left;
    margin-left: -2rem;
    font-weight: 700;
}

ol:first-child {
counter-reset: customlistcounter;
}

.padding-top-2 { 
    padding-top:  2rem; 
}


/** GRID & LAYOUT ************************************************/
.row { max-width: 59rem; }

.row-456 { max-width: 28.500rem; }

.row-750 { max-width: 46.875rem; }

.row-1140 { max-width: 71.25rem; }

.row.flex-row { 
    display: flex;
    margin-bottom: 3rem;
}

.row.flex-row:last-child { 
    margin-bottom: 0;
}

.panel {
    width: 100%;
    padding: 5.625rem 0;
    text-align: center;
}

.panel.beige { background: #edeae8; }
.panel.lgt-blue { background: #d9edec; }

.interior-panel-1 {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 8.0625rem;
    padding-bottom: 5rem;
    
}

.interior-panel-1 .callout {
    margin-bottom: 0;
}

.interior-panel-1 .callout p {
    max-width: 46.875rem;
}

.interior-panel-1.bg-modeling {
    background: url(../images/bg-01.jpg) no-repeat;
    background-size: cover;
    background-position: center center;
}

.interior-panel-1.bg-applications {
    background: url(../images/bg-02.jpg) no-repeat;
    background-size: cover;
    background-position: center center;
}

.interior-panel-1.bg-general {
    background: url(../images/bg-03.jpg) no-repeat;
    background-size: cover;
    background-position: center center;
}

.interior-panel-1.bg-customers {
    background: url(../images/bg-04.jpg) no-repeat;
    background-size: cover;
    background-position: center center;
}

.interior-panel-1.bg-resources {
    background: url(../images/bg-06.jpg) no-repeat;
    background-size: cover;
    background-position: center center;
}

/** BUTTONS ************************************************/
.square-brackets {
    position: relative;
    display: inline-block;
    padding: 1rem;
}

.square-brackets:before,
.square-brackets.grey:before {
    content: " ";
    position: absolute;
    padding: 1rem;
    top: 0;
    bottom: 0;
    left: 0;
}

.square-brackets:after,
.square-brackets.grey:after {
   content: " ";
   position: absolute;
   padding:1rem;
   top: 0;
   bottom: 0;
   right: 0;
}

.square-brackets:before {
    border-left:1px solid #ffffff;
    border-top:1px solid #ffffff;
    border-bottom:1px solid #ffffff;
}

.square-brackets:after {
    border-right:1px solid #ffffff;
    border-top:1px solid #ffffff;
    border-bottom:1px solid #ffffff;
}

.square-brackets.grey:before {
    border-left:1px solid #cdd1d4;
    border-top:1px solid #cdd1d4;
    border-bottom:1px solid #cdd1d4;
}

.square-brackets.grey:after {
    border-right:1px solid #cdd1d4;
    border-top:1px solid #cdd1d4;
    border-bottom:1px solid #cdd1d4;
}

.large.button {
    font-family: 'Source Sans Pro', sans-serif;
    background: #00857d;
    font-size: 1.5rem;
    font-weight: 600;
    margin: 0;
}

.large.button:hover {
    transition: all 0.2s ease-in-out 0.1s;
    background: rgba(0,133,125,0.75);
    color: #ffffff !important;
}

.callout {
    background: rgba(27,31,33,0.8);
    color: #ffffff;
    text-align: center;
    border: none;
    padding: 4.125em;
}


/** MAIN NAV ************************************************/

.off-canvas.position-bottom.is-transition-push.is-open {
    height: 100%;
}



/** ABOUT ************************************************/

.about-team h2 {
    margin: 0 0 2rem 0;
}

.about-team p span {
    font-weight: 600;
    color: #005670;
}

.panel.beige .bullet,
.panel.beige .bullet li {
    padding-bottom: 0;
    margin-bottom: 0;
}

/** RESOURCES ************************************************/

#resource-docs .large-9.columns {
    display: flex; 
    flex-direction: column; 
    align-items: left; 
    justify-content: center;
}

#resource-videos { font-weight: 600; }


#resource-videos .row.row-750:last-child { 
    margin-top: 0; 
}

#resource-docs h2,
#resource-videos h2 {
    margin-top: 0;
    margin-bottom: 2rem;
}

.resource-form-panel {
    margin-bottom: 2rem;
}

#resource-form {
    margin: 0 auto; 
    max-width: 34.6875rem; 
    text-align: left;
}

#resource-docs img {
    border: 1px solid #ededed;
}

/** GETTING STARTED ************************************************/
#starter-kit h2,
#starter-kit h3 {
    color: #005670;
}

#starter-kit h2 {
    margin-bottom: 2rem;
    margin-top: 0;
}

/** APPLICATIONS ************************************************/
#applications-accordion :last-child:not(.is-active) > .accordion-title {
    border-bottom: none;
}
#applications-budget {
    display: flex;
}

#applications-budget > div {
    background: #f8f7f6; 
    border:1px solid #e6e6e6; 
    padding: 1.5rem; 
    margin-right: 1rem;
    width: 50%;
    flex-wrap: wrap;
}

#applications-budget h3 {
    color: #005670;
}

#applications-budget ul {
    margin-left: 0;
}




#features-accordion .accordion-title {
    display: flex;
    align-items: center;
}

#features-accordion .accordion-title h3 {
    margin-bottom: 0;
}

#features-accordion .accordion-title::before { 
    padding: 0.2rem 0.5rem; 
}


#financial-reporting h2 {
    margin-top: 0;
}
/** CUSTOMERS ************************************************/
#customers a {
    font-weight: 600;
}

#customers > .row {
    display: flex;
}

#customers > .row > .large-6.columns:first-child {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
#customers p:last-child {
    margin-bottom: 0;
}

/** NEWS ************************************************/

#news h3 {
    font-weight: 600;
    margin-bottom: 0.875rem;
}

#news h3 a:hover,
#news p a:hover,
#news-item p a:hover {
    color: #005670;
    transition: all 0.2s ease-in-out 0.1s;
}

.subtitle {
    color: #005670;
    font-weight: 600;
}

#news span,
#news-item span {
    font-weight: 600;
}

#news-item h2 {
    margin-bottom: 3rem;
    margin-top: 2rem;
}

#news-item ol {
    margin-left: 1rem;
}

#news-item img {
    max-width: 750px;
    width: 100%;
    margin: 0.5rem 0 1.5rem 0;
}

#news-item .bullet {
    padding-bottom: 0;
}

/** 404 PAGE ************************************************/
#not-found {
    display: flex; 
    width: 100%; 
    height: 100vh; 
    flex-direction: column; 
    background: url('../images/bg-05.jpg') no-repeat; 
    background-size: cover;
}
        
#not-found > div {
    margin: 20% auto 0 auto; 
    max-width: 37.5rem; 
    text-align: center; 
    background: rgba(0,0,0,0.8); 
    padding: 2rem; color: #ffffff;
}


/** EMAIL CAMPAIGNS ************************************************/

.email-panel-1 { 
    height: 100%; 
    padding-top: 5.75rem; 
    padding-bottom: 8rem;
    background: url(../images/bg-03.jpg) no-repeat;
    background-size: cover;
    background-position: center center;
}

.email-panel-1 > .row {
    max-width: 1170px; 
    display: flex;
}

.email-panel-1 > .row > .large-6.columns:first-child {
    background: rgba(0,0,0,0.65); 
    padding: 2rem; 
    color: #ffffff; 
    text-align: center;
}

.email-panel-1 > .row > .large-6.columns:last-child {
    background: rgba(255,255,255,0.95); 
    padding: 2rem; 
    color: #ffffff;
}

.email-copyright {
    background: none; 
    font-size: 0.875rem; 
    color: #0a0a0a;
}


/** MEDIA QUERIES ************************************************/
/* Small only  639px */
@media screen and (max-width: 39.9375em) {
    h1 {  font-size: 2rem; }
    h2 {  font-size: 1.75rem; }
    .lrg-text { font-size: 1.625rem; }
    .med-text { font-size: 1.25rem; }
    
    .panel,
    .home-panel-2 { padding: 4.375rem 0; }
    .home-panel-1 { 
        min-height: 40rem; 
        height: auto; 
        padding: 3rem 0; 
    }
    
    .logos:nth-child(1) a {
        flex-basis: 50%;
        margin-right: 0;
    }
    
    .interior-panel-1 { 
        padding: 3.75rem 0;
    }
    
    .breadcrumbs-container { display: none; }
    
    
    .callout { padding: 1.5rem; }
    .home-panel-1 .callout { margin-bottom: 2.5rem; }
    
    .large.button { font-size: 1.25rem; }
    
    .flex-row { 
        display: block; 
        margin-bottom: 2rem;
    }
    
    .flex-row:last-child {
        margin-bottom: 0;
    }
    
    #resource-docs .large-9.columns { 
        display: inherit; 
    }
    
    #resource-videos > .row.row-750:last-child {
        margin-bottom: 0;
    }
    
    .resource-form-panel {
        margin-bottom: 0;
    }
    
    .video-right { 
        margin-top: 2rem;
    }
    
    #customers > .row {
        display: inherit;
    }
    
    #customers > .row > .large-6.columns:first-child {
        display: inherit;
        margin-bottom: 1rem;
    }
    
}

/* Small only  800px */
@media screen and (max-width: 50em) {
    body {
        padding-bottom: 0;
    }
    
    #not-found > div {
        width: 85%;
    }
    
    #email-footer {
        padding: 1rem 0;
    }
}

/* Medium only 640px to 1023px */
@media screen and (min-width: 40em) and (max-width: 63.9375em) {
    .logos:nth-child(1) a {
        flex-basis: 30%;
        margin-right: 0;
    }
}

/* Large (1024px) and up */
@media screen and (min-width: 64em) {
    
}

/* Large only 1024px to 1199px */
@media screen and (min-width: 64em) and (max-width: 74.9375em) {
    
}


/* CUSTOM */



/* Medium 1023px */
@media screen and (max-width: 63.9375em) {
    
    .row { max-width: 87%; }
    
    hr { margin: 2rem 0; }
    
    .panel { padding: 3.75rem 0; }

    
    .square-brackets.float-right,
    .square-brackets.float-left {
        float: none !important;
        display: block;
        text-align: center;
        max-width: 16.5rem;
        margin: 0 auto;
    }
    
    .square-brackets.float-right {
        margin-bottom: 2rem;
    }
    
    .logos:nth-child(2),
    .logos:nth-child(3) {
        display: none;
    }
    
    .logos:nth-child(1) {
        margin-bottom: 1.5rem;
        flex-flow: row wrap;
        align-items: center;
        justify-content: center;
    }
    
    .email-panel-1 > .row {
        max-width: 87%;
        display: block;
    }
    
    
}



/* Vertical Spacer */
.spacer {
	width: 100%;
	height: 20px;
	background-color: #FFF;
}