
/*////////////////////////////////////////////////////////////////////////////*/
/* GLOBAL STYLES                                                              */
/*////////////////////////////////////////////////////////////////////////////*/

body {
    font-family: "Roboto";
    font-size: 18px;
    line-height: 26px;
}

section p, section li {
    font-size: 22px;
    line-height: 30px;
    font-weight: 300;
}

section {
    display: block;
    padding: 100px 10px;
    background: white;
}

footer {
    display: block;
    padding: 40px 0;
    font-weight: 300;
    font-size: 14px;
    color: #999;
}

footer a {
    color: #333;
    text-decoration: underline;
}

h1, h2 {
    margin-top: 0;
}

h3 {
    font-size: 42px;
    line-height: 50px;
    font-weight: 300;
}

acronym {
    border-bottom: 1px dotted;
}

section a {
    
}



.panel-heading small {
    font-weight: 100;
    font-size: 14px;
    line-height: 16px;
    padding: 0 15%;
    display: block;
}

.bg-grey { background: #F8F8F8; }
.bg-grey-light { background: #f3f3f3; }

.hero {
    /* margin-top: 70px; */
    /* padding-top: 2%; */
    padding-bottom: 1%;
}

.hero h1 {
    font-size: 144px;
    line-height: 144px;
    font-weight: 900;
}

h2 {
    font-size: 72px;
    line-height: 72px;
}

.hero span {
    color: #DD3232;
}

.hero p {
    font-size: 36px;
    line-height: 42px;
    font-weight: 100;
    color: #868686;
}

.hero small {
    font-weight: 100;
    color: #868686;
    font-size: 32px;
    line-height: 1.4;
    display: block;
    margin-top: 30px;
}

.hero a {
    text-decoration: underline;
    color: #222;
}

.navbar-safe .navbar-brand {
    font-weight: 900;
    font-size: 24px;
    color: white;
    margin-right: 10px;
    padding: 30px;
    height: auto;
}

.navbar-safe .navbar-toggle {
    margin: 20px;
}

.navbar-safe {
    font-weight: 300;
    border-radius: 0;
}

.navbar-safe .navbar-nav>li>a {
    padding-top: 30px;
    padding-bottom: 30px;
}

.navbar-safe .navbar-btn {
    margin-top: 20px;
    margin-bottom: 20px;
}

section.red {
    background: #DD3232;
    padding: 70px inherit;
    color: white;
    text-align: center;
}

section.red h2 {
    margin-bottom: 60px;
    font-weight: 300;
}

section.red strong {
    font-weight: 500;
}

section.red p,p.readable  {
    font-weight: 300;
    max-width: 750px;
    margin: 0 auto;
}

.navbar-btn.btn-action {
    color: #333;
    font-size: 18px;
    font-weight: 300;
}

.btn-action {
    background: white;
    color: #DD3232;
    font-weight: 300;

    -webkit-transition: all 0.2s;
        -ms-transition: all 0.2s;
         -o-transition: all 0.2s;
            transition: all 0.2s;
}
.btn-action:hover {
    opacity: 0.8;
    filter: alpha(opacity=80);
}
.btn-action-blue {
    background: #4AC5E2;
    border: 1px solid #4AC5E2;
    color: white;

    -webkit-transition: all 0.2s;
        -ms-transition: all 0.2s;
         -o-transition: all 0.2s;
            transition: all 0.2s;
}

.btn {
    -webkit-transition: all 0.2s;
        -ms-transition: all 0.2s;
         -o-transition: all 0.2s;
            transition: all 0.2s;
}
.btn-separator {
    line-height: 5px;
}
.btn-red {
    color: #fff;
    background-color: #DD3232;
    border-color: #DD3232
}

.btn-red:hover,.btn-red:focus,.btn-red:active,.btn-red.active,.open .dropdown-toggle.btn-red {
    color: #fff;
    background-color: #F54B4B;
    border-color: #DD3232
}

.btn-action-blue:hover { background: #04C0EC; border-color: #04C0EC; color: white; }
.btn-action-red {
    background: #DD3232;
    border: 1px solid #DD3232;
    color: white !important;
}
.btn-action-red:hover { background: #E60F0F; border-color: #E60F0F; color: white !important; }

.btn-outline {
    border: 1px solid white;
    border: 1px solid rgba(255,255,255, 0.7);

    color: white !important;
    color: rgba(255,255,255, 0.9) !important;

    background: transparent !important;
}
.btn-outline:hover {
    background: white !important;
    color: #333 !important;
    filter: alpha(opacity=100);
    opacity: 1;
}

.btn-lg {
    font-size: 22px;
    padding: 10px 20px;
}

section.feature {}
section.feature h2 {
    line-height: 72px;
    margin-bottom: 30px;
    font-weight: 300;
}
section.feature p {
}
section .feature-left {
    float: left;
    width: 60%;
}
section .feature-right {
    float: left;
    width: 40%;
}


#faq-accordion {
    max-width: 750px;
    padding: 5% 20px;
    margin: 0 auto;
}

#faq-accordion .panel-heading {
    padding: 0;
}

#faq-accordion .panel-title>a {
    padding: 18px 20px;
    display: block;
    font-weight: 300;
    font-size: 18px;
    line-height: 26px;
    position: relative;
    background: #DBE2E7;
    text-decoration: none;

    padding-right: 60px;
    /*padding-left: 70px; */
}

#faq-accordion .panel-title>a.collapsed { background: white; }

#faq-accordion .panel-title>a.collapsed:before {
    -ms-transform: rotate(0); /* IE 9 */
    -webkit-transform: rotate(0); /* Chrome, Safari, Opera */
    transform: rotate(0);
}

/* right arrow */
#faq-accordion .panel-title>a:before {
    content: "\e805";
    font-family: "safe";
    position: absolute;
    font-size: 20px;
    line-height: 20px;
    background: white;
    top: 50%;
    right: 25px;
    margin-top: -9px;
    background: transparent;

    -ms-transform: rotate(90deg); /* IE 9 */
    -webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */
    transform: rotate(90deg);

    -webkit-transition: transform 0.1s;
        -ms-transition: transform 0.1s;
            transition: transform 0.1s;
}

#faq-accordion .panel-title>a:hover:before {
    -webkit-transition: transform 0.2s ease;
        -ms-transition: transform 0.2s ease;
            transition: transform 0.2s ease;

    -ms-transform: rotate(90deg); /* IE 9 */
    -webkit-transform: rotate(90deg); /* Chrome, Safari, Opera */
    transform: rotate(90deg);
}

#faq-accordion .panel-safe {
    margin-bottom: 10px;
    border: 1px solid #DBE2E7;
}

#faq-accordion .panel-body {
    padding: 40px;
    font-weight: 300;
    border: none;
}


.panel-red, .panel-blue {
    border: 1px solid #ccc;
}
.panel-red .panel-heading {
    background: #DD3232;
    color: white;
}
.panel-blue .panel-heading {
    background: #4AC5E2;
    color: white;
}

.list-group li {
    text-align: left;
    font-size: 16px;
    line-height: 24px;
    font-weight: 300;
}

.text-success { color: #7ED321; }

.benefits-list {
    list-style: none;
}
.benefits-list li {
    padding: 10px;
    border-top: 1px solid #ECECEC;
    position: relative;
    font-size: 18px;
    line-height: 24px;
}
.benefits-list li:first-child {
    border: none;
}
.benefits-list li:before {
    content: '\e803';
    color: #7ED321;
    position: absolute;
    top: 14px;
    left: -25px;
    font-size: 18px;
    line-height: 18px;
    width: 20px;
    height: 18px;

    font-family: "safe";
    font-style: normal;
    font-weight: normal;
    background: white;
}

.no-border {
    border: none !important;
}

.modal-body h2 {
    font-weight: 700;
    margin-bottom: 30px;
}
.modal-body h3 {
    font-size: 26px;
    line-height: 26px;
    font-weight: 700;
    margin-top: 50px;
    margin-bottom: 20px;
}

.modal-body ol,
.modal-body ul {
    margin: 20px 0;
}

.modal-body p {
    font-size: 18px;
    line-height: 28px;
    font-weight: 300;

}

.modal-body ol > li,
.modal-body ul > li {
    font-size: 18px;
    line-height: 28px;
    font-weight: 300;
}

.no-margin {
    margin: 0 !important;
}

/* Scroll to top */
.scroll-top-wrapper {
    position: fixed;
    opacity: 0;
    visibility: hidden;
    overflow: hidden;
    text-align: center;
    z-index: 99999999;
    background: #777777;
    color: #eeeeee;
    width: 50px;
    height: 50px;
    line-height: 48px;
    right: 30px;
    bottom: 30px;
    padding-top: 2px;
    border-radius: 25px;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}
.scroll-top-wrapper:hover {
    background-color: #888888;
}
.scroll-top-wrapper.show {
    visibility:visible;
    cursor:pointer;
    opacity: 1;
}


/*////////////////////////////////////////////////////////////////////////////*/
/* HELPERS                                                                    */
/*////////////////////////////////////////////////////////////////////////////*/
.italic { font-style: italic; }
.uppercase { text-transform: uppercase; }
.thin { font-weight: 100 !important; }
.lead { font-weight: 300; }


/*////////////////////////////////////////////////////////////////////////////*/
/* MEDIA QUERIES                                                              */
/*////////////////////////////////////////////////////////////////////////////*/

@media(max-width:767px) {
    body {text-align:center;}
    .hero {margin-top: 0; padding-bottom: 60px;}
    .hero h1 {font-size: 114px;line-height: 114px;}
    .hero p { font-size: 26px; line-height: 32px; }
    .red .btn-action { width: 100%;}
    section.feature h2 {line-height: 42px;margin-bottom: 30px;font-weight: 700;font-size: 42px;}
    .navbar-safe .navbar-nav>li>a {padding-top: 20px;padding-bottom: 20px;}
    .modal, li {text-align: left;}
    .modal-body h2 { font-size: 42px; }
    .modal-body h3 { font-size: 22px; }
    #faq-accordion .panel-body { padding: 20px; }

    section { padding: 80px 10px; }
    section.feature { padding-bottom: 0; }
    section.feature#vantaggi { padding-bottom: 50px; }
    section.red h2 { margin-bottom: 40px;font-size: 42px;line-height: 42px; }

    #faq-accordion {
        max-width: 750px;
        padding: 5% 0;
    }
}
@media(min-width:768px) {
    .modal .modal-body { padding: 70px; }
}

@media(max-width:991px) {
    .nav>li>a { padding: 10px; }
}
@media(min-width:992px) {}

@media(max-width:1200px) {}
@media(min-width:1200px) {}

.stats p {
    font-size: 32px;
    line-height: 42px;
    font-weight: 100;
    color: #868686;
	text-align: center;
}
