﻿body {
    padding-top: 50px;
    padding-bottom: 20px;
    background-color: #f8f9fa;
}

/* Font color */
h1, h2, h3, h4, h5, h6, p, td, th  {
    color: #353A4F;
}

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 280px;
}


.CountryBlock {
    text-align: center;
}

/*Below is just playing with animations...*/
/* Slide-in animation */
.animated-slide-left {
    animation: slideInLeft 1s ease-in-out;
}

@keyframes slideInLeft {
    from {
        transform: translateX(-100%);
    }

    to {
        transform: translateX(0);
    }
}

/* Fade-in animation */
.animated-fade-in-normal {
    animation: fadeIn 2s ease-in-out;
}

.animated-fade-in-fast {
    animation: fadeIn 1s ease-in-out;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

.fade {
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
}

    .fade.show {
        opacity: 1;
    }

/*Above is just playing with animations...*/