/***
 *    ╔═╗╔═╗╔╗╔╔═╗╦═╗╔═╗╦  
 *    ║ ╦║╣ ║║║║╣ ╠╦╝╠═╣║  
 *    ╚═╝╚═╝╝╚╝╚═╝╩╚═╩ ╩╩═╝                                               
 */

* {
    box-sizing: border-box;
}

html {
    font-size: 16px;
}

body { 
    font-family: 'Roboto', sans-serif;
    color: #292f33;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    background: #ededed;
    word-wrap: break-word
}

a {
    color: #292f34;
    -webkit-transition: all 0.25s;
    -moz-transition: all 0.25s;
    -o-transition: all 0.25s;
    transition: all 0.25s;
    text-decoration: none;
    max-width: 100%;
}

a:hover,
a:focus,
a:active  {
    color: #e35001;
}

.content {
    max-width: 1050px;
    margin: 0 auto;
    padding: 0 25px;
}


.clearfix:before, 
.clearfix:after { 
    content: " "; 
    display: table; 
} 

.clearfix:after { 
    clear: both; 
}

.button {
    padding: 20px 15px;
    border-radius: 3px;
    background: #292f32;
    color: #fffffc;
    display: inline-block;
    letter-spacing: 0.7px;
    font-weight: 700;
    position:relative;
    font-size: 1.1rem;
    -webkit-transition: all 0.25s;
    -moz-transition: all 0.25s;
    -o-transition: all 0.25s;
    transition: all 0.25s;
    opacity: 1;
}

a.button:hover,
a.button:active,
a.button:focus {
    color: #fffffc;
    opacity: 0.8;
}

a.button:after,
a.button:before {
    position:relative;
    font-family: FontAwesome;
    margin: 0 15px;
    opacity: 0;
    -webkit-transition: all 0.25s;
    -moz-transition: all 0.25s;
    -o-transition: all 0.25s;
    transition: all 0.25s;
}

a.button:before {
    content: "\f105";
}

a.button:after {
    content: "\f104";
}

a.button:hover:after,
a.button:hover:before {
    opacity: 1;
}

.primary {
    background: #f55b01;
}

.pricing__01 {
    background: #292f31;
}

.pricing__02 {
    background: #f55b07;
}

.pricing__03 {
    background: #292f39;
}

.header__logo {
    padding: 20px 0 17px;
}

.header__nav__container {
    display: block;
    text-align: center;
    padding: 0 0 30px 0;
}

.header__nav,
.footer__nav {
    display: inline-block;
    padding: 15px 0;
    margin: 15px 0 0;
}

.nav__item {
    list-style: none;
    display: inline-block;
    font-weight: 700;
    margin: 0 12px 15px;
    letter-spacing: 0.6px;
    max-width: 85px;
    vertical-align: top;
    text-align: center;
}

/***
 *    ╦ ╦╔═╗╔═╗╔╦╗╔═╗╦═╗
 *    ╠═╣║╣ ╠═╣ ║║║╣ ╠╦╝
 *    ╩ ╩╚═╝╩ ╩═╩╝╚═╝╩╚═
 */

.header {
    background: #FDFDFD;
    text-align: center;
}

.header .button {
    padding: 15px;
    max-width: 190px;
    margin: 15px 0;
}

.header .button:after,
.header .button:before {
    content: '';
    margin: 15px 6px;
    padding: 0;
}

.header .button:hover:after,
.header .button:hover:before {
    padding: 0;
}

.banner {
    padding: 32px 0;
    background: #909090;
}

.banner__background {
    position: absolute;
    z-index: -100;
    width: 1px;
    height: 1px;
}

.banner__title {
    color: #fffffb;
    text-align: center;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: 2.5px;
    font-family: 'Muli', sans-serif;
    font-size: 2.225rem;
    margin: 18px 0 21px;
}

/***
 *    ╔╦╗╔═╗╦╔╗╔  ╔═╗╔═╗╔╗╔╔╦╗╔═╗╔╗╔╔╦╗
 *    ║║║╠═╣║║║║  ║  ║ ║║║║ ║ ║╣ ║║║ ║ 
 *    ╩ ╩╩ ╩╩╝╚╝  ╚═╝╚═╝╝╚╝ ╩ ╚═╝╝╚╝ ╩ 
 */

.content__main {
    max-width: 1084px;
    margin: 0 auto;
    padding: 0 25px;
    text-align: center;
}

.main {
   margin: 40px 0 0;
}

.option__container {
    position: relative;
    text-align: center;
    display: inline-block;
    margin: 21px 1.75%;
    vertical-align: top;
    width: auto;
    max-width: 450px;
}

.option__container--holdheight h4 {
    color: #fafafa;
    letter-spacing: 1px;
    margin: 7px 0;
}

.price__option__header--one,
.price__option__header--two,
.price__option__header--three {
    background: #000001;
    border: 3px solid #000001;
    width: 100%;
    float: left;
    padding: 0 15px;
}

.price__option__header--two {
    border: 3px solid #e35000;
    background: #e35000;
}

.price__option__header--three {
    border: 3px solid #000002;
    background: #000002;
}

.price__option {
    float: left;
}

.option__container--holdheight {
    min-height: 39px;
}

.price__option--one,
.price__option--two,
.price__option--three {
    border: 3px solid #292f35;
    background: #fdfcfc;
    font-weight: 700;
    float: left;
    width: 100%;
}

.price__option--two {
    border: 3px solid #f55b09;
}

.price__option--three {
    border: 3px solid #292f37;
}

.option__title--one,
.option__title--two,
.option__title--three {
    font-size: 1.6rem;
    margin: 0;
    color: #fafafa;
    background: #292f35;
    font-weight: 400;
    padding: 21px 10px 18px;
    letter-spacing: 0.5px;
}

.option__title--two {
    background: #f55b09;
}

.option__title--three {
    background: #292f37;
}

.price--current__one,
.price--current__two,
.price--current__three {
    font-size: 4rem;
    font-weight: 400;
    margin: 0;
    color: #292f35;
    margin: 20px 0 0;
    letter-spacing: 0.4px;
}

.price--permonth__one,
.price--permonth__two,
.price--permonth__three {
    font-size: 1.25rem;
    padding: 0 5px 19px 0;
    margin: 0;
    color: #292f35;
}

.price--current__two,
.price--permonth__two {
    color: #f55b09;
}

.price--current__three,
.price--permonth__three {
    color: #292f37;
}

.price--was,
.price--slashed,
.price--save {
    display: inline-block;
    font-weight: 900;
    margin: 0;
    font-size: 1.25rem;
    letter-spacing: 0.5px;
    line-height: 1.6;
    max-width: 100%;
}

.price--slashed * {
    text-decoration: line-through;
    display: inline-block;
    max-width: 100%;
}

.price--slashed u {
    text-decoration: underline;
}

.option__image {
    width: 100%;
}

.price--save {
    background: #ededee;
    padding: 5px 13px;
    color: #009cf5;
    margin: 10px;
    font-size: 1rem;
}

.pricing__container {
    margin: 15px;
}

.price__container {
    display: block;
    margin: 0 0 9px;
    padding: 0 0 20px 0;
}

.price__text {
    background: #f7f7f7;
    border-top: 2px solid #e8e8e8;
    padding: 31px 26px;
    margin: 0;
    line-height: 1.8;
}

.price__includes {
    background: #fafafa;
    margin: 0;
    padding: 0;
}

.price__includes li {
    background: #fdfdfe;
    border-top: 2px solid #e8e8e8;
    list-style: none;
    padding: 17px;
    font-size: 1.2rem;
    line-height: 1.1;
}

.item--grey {
    color: #e8e8e9;
}

.price__cta {
    display: inline-block;
    width: 100%;
    border-top: 2px solid #e8e8e8;
}

.pricing,
.pricing__01,
.pricing__02,
.pricing__03 {
    width: 85%;
    margin: 20px 10px;
}

.disclaimer {
    margin: 0 0 20px;
    text-align: center;
}

.disclaimer__container {
    text-align: center;
}

.testimonial__container {
    max-width: 450px;
    margin: 67px auto;
    padding: 0;
}

.testimonial__text {
    padding: 18px 25px;
    background: #fffffa;
    border-radius: 3px;
    font-weight: 700;
    line-height: 1.8;
    position: relative;
    top: 0;
    max-width: 450px;
    display: block;
    margin: 31px 0 0 0;
    font-size: 1.1rem;
}

.testimonial__text:before {
    content:" ";
    border-style: solid;
    position: absolute;
    border-width: 0 15px 15px 15px;
    border-color: transparent transparent #fffffa transparent;
    left: 47%;
    top: -15px;
}

.testimonial__image {
    display: inline-block;
    vertical-align: top;
}

/***
 *    ╔═╗╔═╗╔═╗╔╦╗╔═╗╦═╗
 *    ╠╣ ║ ║║ ║ ║ ║╣ ╠╦╝
 *    ╚  ╚═╝╚═╝ ╩ ╚═╝╩╚═
 */

 .footer {
    background: #FDFDFD;
 }

 .footer__nav {
    padding: 30px 0 16px;
    width: 100%;
    text-align: center;
 }

 .footer__nav .nav__item {
    margin: 0 12px 24px;
    max-width: 150px;
 }

 .copyright {
    background: #292f30;
    padding: 20px;
    width: 100%;
    color: #fffff0;
    font-weight: 700;
 }

 .copyright a {
    color: #f55b08;
 }

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

.copyright__text {
    float: left;
    margin: 11px 0;
    text-align: center;
    width: 100%;
    max-width: 100%;
}

.social__container {
    float: right;
    width: 100%;
    text-align: center;
    margin: 12px 0;
}

a.share {
    background: #435234;
    display: inline-block;
    text-align: center;
    padding: 11px;
    min-width: 42px;
    border-radius: 3px;
    margin: 0 6px;
    color: #fafafa;
    opacity: 1;
}

a.share.facebook {
    background: #3460a1;
}

a.share.twitter {
    background: #28aae1;
}

a.share.linkedin {
    background: #136d9d;
}

a.share.googleplus {
    background: #de5543;
}

a.share:hover,
a.share:active,
a.share:focus {
    opacity: 0.8;
    color: #fafafa;
}


/*  ╔╦╗╔═╗╔╦╗╦╔═╗  ╔═╗ ╦ ╦╔═╗╦═╗╦╔═╗╔═╗ */
/*  ║║║║╣  ║║║╠═╣  ║═╬╗║ ║║╣ ╠╦╝║║╣ ╚═╗ */
/*  ╩ ╩╚═╝═╩╝╩╩ ╩  ╚═╝╚╚═╝╚═╝╩╚═╩╚═╝╚═╝ */

@media (min-width: 60.3125rem) { /*965*/
    .option__container {
        width: 29.5%;
    }

    .header__nav__container {
        float: right;
        display: inline-block;
    }

    .header {
        text-align: left;
    }

    .header__nav__container {
        padding: 0;
    }

    .disclaimer {
        text-align: left;
    }

    .testimonial__text {
        max-width: 588px;
        margin: 0 0 0 31px;
        display: inline-block;
        vertical-align: top;
    }

    .testimonial__text:before {
        border-width: 15px 15px 15px 0;
        border-color: transparent #fffffa transparent transparent;
        left: -15px;
        top: 35px;
    }

    .testimonial__container {
        max-width: 777px;
    }

    .copyright__text {
        text-align: left;
        width: auto;
    }

    .social__container {
        float: right;
        width: auto;
        text-align: left;
        margin: 0;
    }

}