/* 
*  CSS TABLE OF CONTENTS
*   
*  1.0 - Homepage
*   1.1 - Header
*   1.2 - Contact
*   1.3 - Values
*  2.0 - Fonts
*  3.0 - Globals
*  4.0 - Color Palette
*  5.0 - Header
*  6.0 - Body
*    6.1 - Sliders
*    6.2 - Imagery
*  7.0 - Footer
*  8.0 - Animation
*/


/*** 1.0 - Homepage ***/

/*** 1.1 - Header ***/
.hm-hero {
    background-image: url(../images/hm-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

.constellation-group {
    height: 100vh;
    width: 100%;
    top: 0;
    left: 0;
}

.constellation-bg {
    background-image: url(../images/hm-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    border-radius: 100%;
    margin: -15vmax;
    position: absolute;
    height: 30vmax;
    width: 30vmax;
    transform: translate(-50%, -50%);
    animation: infinite-rotate 60s linear infinite;
    top: 50%;
    left: 50%;
    z-index: 1;
}

.constellation-fg {
    background-image: url(../images/hm-constellation.svg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    border-radius: 100%;
    margin: -16.75vmax;
    position: absolute;
    height: 33.5vmax;
    width: 33.5vmax;
    transform: translate(-50%, -50%);
    animation: infinite-rotate 15s linear infinite;
    top: 50%;
    left: 50%;
    z-index: 2;
}

.hero-heading {
    position: absolute;
    height: 100%;
    width: 100%;
    bottom: 0;
    left: 0;
    z-index: 2;
    padding: 10%;
}

.hero-heading-h1 {
    color: var(--cas-light);
    font-size: 16vw;
    font-weight: 700;
    line-height: 1.3;
    text-align: center;
    text-transform: uppercase;
}

.hero-heading-h5 {
    color: var(--cas-secondary-muted);
    font-size: 6vw;
    font-weight: 500;
    padding: 10% 10% 0 10%;
    text-align: center;
}

/* Secondary pages header  */
.secondary-page-hero{
    background-image: url(../images/hm-bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
}

.secondary-pages-header-section{
    position: relative;
    height: 50vh;
    width: 100%;
    min-height: 400px;
}

.secondary-pages-heading {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);    
    z-index: 2;
    padding: 10%;
}

.hero-sec-page-h1{
    font-size: 10vw; 
    font-weight: 700;
    line-height: 1.3;
    text-transform: uppercase;
}

/*** 1.2 - Values ***/

.hm-values-block{
    padding: 40%  0;
}

.hm-values-h4{
    font-size: 1.75rem;
    font-weight: 700;
}

.hm-values-p{
    font-size: 1.15rem;
    padding: 0 15%;
}

.hm-values-img{
    height: 70vh;   
    width: 100%;    
    background-image: url(../images/hm-values.jpg);
    background-repeat: no-repeat;
    background-position: center left;
    background-size: cover;
}
/*** 1.3 - About ***/
.hm-about{
    padding: 12%;
}

.hm-about-img{
    padding:  0 10%;
}

.hm-about-h3{
    font-size: 2rem;
    font-weight: 700;
}

.hm-about-p{
    font-size: 1.2rem;
}

/*** 1.3 - Featured Services ***/
.hm-services{
    padding:8%;
}
.hm-services .card{
    border:0;
}

.hm-services-card{
    padding: 15%;    
}

.hm-services-img{
    padding: 0 30%;
    margin-bottom: 8%;
}

.hm-services-card-body{
    padding: 0 2%;
}

.hm-services-h3{
    font-weight: 700;
}

/*** 1.3 - Contact ***/
.hm-contact-typography {
    padding: 40% 20%;
}

.hm-contact-block {
    height: 70vh;
    background-image: url(../images/hm-contact.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    position: relative;
}

.hm-compass-bg,
.hm-compass-middle,
.hm-compass-fg {
    height: 35vmax;
    width: 35vmax;
    transform: translate(-50%, -50%);
    margin: -17.5vmax;
    position: absolute;
    left: 50%;
    top: 50%;
}

.hm-compass-bg {
    z-index: 3;
    animation: infinite-rotate 15s linear infinite;
}

.hm-compass-middle {
    z-index: 1;
    animation: infinite-rotate 40s linear infinite;
}

.hm-compass-fg {
    z-index: 2;
    animation: infinite-rotate 50s linear infinite;
}

/* Vacancies */

.vacancies{
    padding:8%;
}
.vacancies .card{
    border:0;
}

.vacancies-card{
    padding: 15%;    
}

.vacancies-img{
    padding: 0 20%;
    margin-bottom: 8%;
    border-radius: 100%;
}

.vacancies-card-body{
    padding: 0 2%;
}

.vacancies-h3{
    font-weight: 700;
}

.vacancies-p{
    font-size: 1.25rem;
}

/*** Vacancies contact ***/

.vacancies-contact-typography {
    padding: 40% 20%;
}

.vacancies-contact-block {
    height: 100%;
    background-image: url(../images/hm-contact.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    position: relative;
}

.vacancies-compass-bg,
.vacancies-compass-fg {
    height: 35vmax;
    width: 35vmax;
    transform: translate(-50%, -50%);
    margin: -17.5vmax;
    position: absolute;
    left: 50%;
    top: 50%;
}

.vacancies-compass-bg {
    z-index: 3;
    animation: infinite-rotate 15s linear infinite;
}

.vacancies-compass-fg {
    z-index: 2;
    animation: infinite-rotate 50s linear infinite;
}-contact-typography {
    padding: 40% 20%;
}

.vacancies-contact-block {
    height: 60vh;
    background-image: url(../images/vacancies.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    position: relative;
}

.vacancies-compass-bg,
.vacancies-compass-fg {
    height: 35vmax;
    width: 35vmax;
    transform: translate(-50%, -50%);
    margin: -17.5vmax;
    position: absolute;
    left: 50%;
    top: 50%;
}

.vacancies-compass-bg {
    z-index: 3;
    animation: infinite-rotate 15s linear infinite;
}

.hm-compass-vacancies {
    z-index: 2;
    animation: infinite-rotate 50s linear infinite;
}

/* News */
.news-thumb{
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
    height: 40vh;
}
.mask{
    background: rgb(177,169,159);
    background: linear-gradient(0deg, rgba(177,169,159,1) 0%, rgba(177,169,159,0) 100%);
}

.news-h3{
    font-weight: 600;
    font-size: 1.7rem;
}

/* Office in Office */
.office-in-office {
    height: 100vh;
    background-image: url(../images/office-in-office.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    position: relative;
}

/*** 4.3 - Financial ***/
.financial-img{
    height: 70vh;   
    width: 100%;    
    background-image: url(../images/financial.jpg);
    background-repeat: no-repeat;
    background-position: center left;
    background-size: cover;
}


/*** 8.0 - Animation ***/

@keyframes infinite-rotate {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}