#intro , #morals-intro {
    
    width:100%;background:white;color:black;font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}


#intro h1, #morals-intro h1{

/* font-family: 'Lato', sans-serif !important;*/
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
font-size:32px !important;margin:15px;margin-top:25px;
background:white ;
color:black;

}


#intro p , #morals p, #morals-intro p{


   background: white;
                color:black;
                margin:40px !important;
                padding:20px;padding-top:10px;font-size:14px !important;line-height:20px !important;
                 text-align: justify;
/* font:12px/19px Arial, sans-serif !important;
 margin-bottom:15px;*/

}
#intro p span{
    font-weight :bold !important;
}



  

#morals-intro p {
   background:white ;
color:black; 
}

 .modal {
                display: none; /* Hidden by default */
                position: fixed; /* Stay in place */
                z-index: 1; /* Sit on top */
                padding-top: 100px; /* Location of the box */
                left: 0;
                top: 0;
                width: 100%; /* Full width */
                height: 100%; /* Full height */
                overflow: auto; /* Enable scroll if needed */
                background-color: rgb(0,0,0); /* Fallback color */
                background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
            }

            /* Modal Content */
            .modal-content {
                position: relative;
                background-color: #fefefe;
                margin: auto;
                padding: 0;
                border: 1px solid #888;
                width: 80%;
                box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
                -webkit-animation-name: animatetop;
                -webkit-animation-duration: 0.4s;
                animation-name: animatetop;
                animation-duration: 0.4s
            }     
            /* Add Animation */
            @-webkit-keyframes animatetop {
                from {top:-300px; opacity:0}
                to {top:0; opacity:1}
            }

            @keyframes animatetop {
                from {top:-300px; opacity:0}
                to {top:0; opacity:1}
            }
            /* The Close Button */
            .close {
                color: black !important;
                float: right;
                font-size: 35px;
                font-weight: bold;
                opacity: .2;
            }

            .close:hover,
            .close:focus {
                color: black;
                text-decoration: none;
                cursor: pointer;
              
            }

            .modal-header {
                padding: 2px 16px;
                background-color: #5cb85c;
                background-color: orange;
                color: white;
            }

            .modal-body {padding: 12px 16px;}