﻿/*GLOBAL*/
h1, h2, h3, h4, h5, h6 {
    color: #333;
    font-family: 'Open Sans', sans-serif;
}

section {
    padding: 90px 0;
}

@media (max-width:768px) {
    section {
        padding: 30px 0;
    }
}

section.section-gray {
    background-color: #fbfbfb;
    border-top: solid 1px #e5e5e5;
}

section.section-light {
    background-color: #fff;
    color: #818d98;
}

    section.section-light .heading-light {
        color: #233138;
    }

section.section-dark {
    background-color: #233138;
    color: #818d98;
}

    section.section-dark .heading-light {
        color: #fff;
    }


section.section-blue {
    color: #fff;
    background-color: #419ef7;
}

section .section-title {
    color: #666;
    font-weight: 300;
    text-align: center;
    font-family: 'Open Sans', sans-serif;
    margin-bottom: 30px;
    line-height: 1.25;
}

    section .section-title strong {
        color: #F79900;
    }

section .section-sub-title {
    font-weight: 300;
    text-align: center;
    font-size: 22px;
    margin-bottom: 20px;
}

section .heading-light {
    color: #fff;
    font-weight: 300;
    font-size: 50px;
    margin: 0 0 30px 0;
    text-align: center;
}

    section .heading-light strong {
        color: #419ef7;
        font-weight: 400;
    }

section h1.heading-light {
    font-size: 41px;
}

section h2.heading-light {
    font-size: 34px;
}

.box-shadow {
    /*box-shadow: 0 1px 1px rgba(0,0,0,.2);*/
    /*box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14),0 1px 5px 0 rgba(0,0,0,0.12),0 3px 1px -2px rgba(0,0,0,0.2);*/
    box-shadow: 0 2px 1px 0 #d6d6d6;
    border-radius: 2px;
}

.grid-box {
    background-color: #fff;
    border-radius: 2px;
    box-shadow: 0 2px 1px 0 #d6d6d6;
    transition-delay: .4s;
    transition: transform .4s cubic-bezier(.25,.46,.45,.94),opacity .4s cubic-bezier(.25,.46,.45,.94),box-shadow 300ms cubic-bezier(.25,.46,.45,.94),background-color 300ms cubic-bezier(.25,.46,.45,.94);
}

    .grid-box:hover {
        background-color: #eee;
        border-radius: 4px;
        box-shadow: 0 2px 1px 0 #d6d6d6;
        transition-delay: .4s;
    }

    .grid-box.gray {
        background-color: #fafafa;
        border-radius: 2px;
        box-shadow: 0 2px 1px 0 #d6d6d6;
        transition-delay: .4s;
        transition: transform .4s cubic-bezier(.25,.46,.45,.94),opacity .4s cubic-bezier(.25,.46,.45,.94),box-shadow 300ms cubic-bezier(.25,.46,.45,.94),background-color 300ms cubic-bezier(.25,.46,.45,.94);
    }

        .grid-box.gray:hover {
            background-color: #f4f4f4;
        }

img.grayscale {
    filter: url("data:image/svg+xml;utf8,&lt;svg xmlns=\'http://www.w3.org/2000/svg\'&gt;&lt;filter id=\'grayscale\'&gt;&lt;feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/&gt;&lt;/filter&gt;&lt;/svg&gt;#grayscale"); /* Firefox 10+, Firefox on Android */
    filter: #eee; /* IE6-9 */
    -webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
    opacity: .6;
    -webkit-transition: all .25s ease-in-out;
    -o-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out;
}

    img.grayscale:hover {
        -webkit-filter: grayscale(0); /* Chrome 19+, Safari 6+, Safari 6+ iOS */
        opacity: 1;
    }

.checkbox label, .radio label {
    line-height: 16px;
    font-size: 14px;
}

.no-padding {
    padding: 0 !important;
}

.no-margin {
    margin: 0 !important;
}

.svg-icons {
    fill: #233138;
}

.icon-space {
    margin-right: 6px;
}

/*MARGIN BOTTOM*/
.mb-10 {
    margin-bottom: 10px;
}

.mb-20 {
    margin-bottom: 20px;
}

.mb-30 {
    margin-bottom: 30px;
}

.mb-40 {
    margin-bottom: 40px;
}

.mb-50 {
    margin-bottom: 50px;
}

.mb-60 {
    margin-bottom: 60px;
}

.mb-70 {
    margin-bottom: 70px;
}

.mb-80 {
    margin-bottom: 80px;
}

.mb-90 {
    margin-bottom: 90px;
}

.mb-100 {
    margin-bottom: 100px;
}
/*PADDING BOTTOM*/
.pb-10 {
    padding-bottom: 10px;
}

.pb-20 {
    padding-bottom: 20px;
}

.pb-30 {
    padding-bottom: 30px;
}

.pb-40 {
    padding-bottom: 40px;
}

.pb-50 {
    padding-bottom: 50px;
}

.pb-60 {
    padding-bottom: 60px;
}

.pb-70 {
    padding-bottom: 70px;
}

.pb-80 {
    padding-bottom: 80px;
}

.pb-90 {
    padding-bottom: 90px;
}

.pb-100 {
    padding-bottom: 100px;
}
