body{
    background-color: #000;
    color: #fbfbfb;
}
h1{
    font-size: 3.5rem;
}
h2{
    color: #e97b17;
}

.btn-warning{
    background-color: #e97b17;
}


header p{
    font-size: 1.20rem;
}

header p span{
    color: #fffcfa;
}

header .sign-up-btn{
    font-size: 0.8rem !important;
    padding: 5px;
}

.subscription-form {
    /* width: 60%; */
    display: flex;
    flex-direction: row;
    border: 1px solid grey;
    padding: 2px;
    border-radius: 50px; /*you can remove this to avoid rounded corners on the form*/
}

.subscription-form input {
    flex-grow: 2;
    border: none;
    border-radius: 50px;
}
.subscription-form input:focus {
    box-shadow: none;
}
.subscription-form  button{
    margin: 0.3rem;
    width: 15rem;
    font-size: 1rem;
}




@media only screen and (min-width: 720px) {
    .left-col{
        padding-right: 3rem;
    }
    /* .right-col{
        padding-left: 3rem;
    } */
}

@media only screen and (max-width: 572px) {
    .container {
        padding: 3rem;
    }

    nav .container {
        padding: 0rem;
    }
}

@media only screen and (max-width: 720px) {
    .subscription-form {
        width: 80%;
    }
}

@media only screen and (max-width: 440px) {
    .subscription-form {
        width: 90%;
    }
}

@media only screen and (min-width: 320px) and (max-width: 425px)  {
    header p{
        font-size: 1.8rem !important;
    }
    header .sign-up-btn{
        font-size: 1.8rem !important;
        padding: 5px;
    }
    .subscription-form  button{
        margin: 0.3rem;
        width: 15rem;
        font-size: 1.8rem;
    }
    .dashboard-section p,       .dashboard-section ul,
    .portfolio-section p,       .portfolio-section ul,
    .risk-section p,            .risk-section ul,
    .optimization-section p,    .optimization-section ul,
    .prix-section p ,
    .contact-section p{
        font-size: 1.8rem !important;
    }
}
@media only screen and (min-width: 426px) and (max-width: 571px) {
    header p{
        font-size: 1.60rem !important;
    }
    header .sign-up-btn{
        font-size: 1.3rem !important;
        padding: 5px;
    }
    .subscription-form  button{
        margin: 0.3rem;
        width: 15rem;
        font-size: 1.3rem !important;
    }
    .dashboard-section p,       .dashboard-section ul,
    .portfolio-section p,       .portfolio-section ul,
    .risk-section p,            .risk-section ul,
    .optimization-section p,    .optimization-section ul,
    .prix-section p ,
    .contact-section p{
        font-size: 1.60rem !important;
    }
}
@media only screen and (min-width: 572px) {
    .dashboard-section,
    .portfolio-section,
    .risk-section,
    .optimization-section,
    .contact-section,
    .prix-section
    {
        margin: 6rem 0;
    }
}



.dashboard-section img, 
.portfolio-section img,
.risk-section img,
.optimization-section img{
    max-width: 100%;
}

.dashboard-section p,       .dashboard-section ul,
.portfolio-section p,       .portfolio-section ul,
.risk-section p,            .risk-section ul,
.optimization-section p,    .optimization-section ul,
.prix-section p ,
.contact-section p{
    font-size: 1rem;
}

.dashboard-section .logo{
    max-width: 100%;
}

.contact-section p{
    margin-top: 3rem;
}

.contact-section .row img{
    max-width: 6rem;
}
.contact-section .row .youtube-logo{
    padding: 0.7rem;
}


footer {
    margin: 5rem;
}
footer p, footer a{
    color: #e97b17;
}
footer a:hover{
    color: #e97b17AA;
}


/* PRICING */
.prix-section h2{
    text-align: left !important;
}
.prix-section p img{
    max-width: 9rem;
}
.prix-section p .text-black{
    color: black;
    font-weight: bold;
}
.text-orange{
    color: #e97b17;
}
thead tr{
    border-top-width: 0 !important;
}
thead tr .left-block{
    border-left-width: 0;
}
thead tr .right-block{
    border-top-width: 1px;
}
thead .free{
    font-size: 1.35rem;
}
thead .price{
    margin-bottom: 0;
}
thead .price .price-text{
    color: black !important;
    font-size: 3rem;
    margin-bottom: 0 !important;
}
thead .user{
    color: black !important;
}
thead .limited{
    font-size: 1rem !important;
    font-weight: normal;
}
.form-control:focus{
    box-shadow: none;
    transition: all .1s linear;
    border-color: #e97b17;
    box-shadow: inset 0 0 0 1px #e97b17;
}
.form-outline .form-control{
    color: #fff;
}
.form-control:focus ~ .form-notch div {
    border-color: #e97b17 !important;
  }
  
  .form-control:focus ~ .form-label {
    color: #e97b17 !important;
  }
  .form-outline .form-control~.form-label {
    color: #fff !important;
  }

.success_msg, .errors_msg{
    display: none;
    margin-top: 0 !important;
    font-size: 0.8rem !important;
    font-weight: bold;
}
.success_msg{
    color: green;
}
.errors_msg{
    color: red;
}
div.pricing-card{
    background-color: #fff;
    color: #000;
    border-radius: 25px;
}
span.per-month{
    font-size: 0.80rem;
    color: #000;
}
.number{
    font-weight: bold;
    color: #000;
}
.striped{
    list-style: none;
    text-align: left;
}
.head-card-price{
    text-align: center;
}