html, body {
    padding: 0;
    margin: 0;
 }

 body{

    overflow-x: hidden;
    
}

.cc-window.cc-window.cc-floating.cc-type-info.cc-theme-block.cc-bottom.cc-right {
    z-index: 999999;
}

ul.checklist {
    list-style: none;
    padding-left: 0;
}

ul.checklist li {
    text-indent: -30px;
    margin-left: 30px;
}

ul.checklist li:before {
    content: "\f00c";  /* this is your text. You can also use UTF-8 character codes as I do here */
    font-family: "Font Awesome 5 free";
    font-weight: 900;
    color: #b3c678;
    padding-right: 10px;
}

.container-2{
    width: 1280px;
    max-width: 100%;
    margin: auto;
}

p{
    font-size: 16px;
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
}

a{
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    border-radius: 15px;
}

h1{
    font-size: 25px;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
}

h2{
    font-size: 25px;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    padding-top: 8px;
    padding-bottom: 8px;
}

h3{
    font-size: 18px;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    line-height: 1.4em;
}

h4{
   font-size: 18px;
   text-transform: uppercase;
   font-weight: 500;
   font-family: 'Roboto', sans-serif;
   margin-bottom: 15px;
}

@media (max-width: 768px){
    .container{
        max-width:100%;
    }
}

@media (max-width: 992px) {
    .container{
     max-width:1080px;
 }
}

@media (max-width: 1200px) {
    .container{
     max-width:1080px;
 }
}

.fa-bars:before{
    color: #03416a;
}



.nav-2{
    background-color: white;
    position: fixed;
    z-index: 99999999;
    width: 100%;
    height: 100px;
    
}

.nav ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    padding-top: 20px;
}

.nav li {
    float: right;
}

.nav li a {
    display: block;
    text-align: right;
    padding: 14px 16px;
    text-decoration: none;
    color:  #03416a;
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    transition: 0.3s;
}

.nav li a:hover {
 background-color: #03aade;
 color: white;

}


.nav .active {
    background-color: #4CAF50;
    
}

/* Dropdown Button */
.dropbtn {
    background-color: #4CAF50;
    color: white;
    padding: 16px;
    font-size: 16px;
    border: none;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
    position: relative;
    display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f1f1f1;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #ddd;}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {display: block;}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {background-color: #3e8e41;}


.fake-nav{
    height: 100px;
    
}

.responsive-button{
    position: fixed;
    right: 0px;
    top: 0px;
    font-size: 25px;
    padding: 15px;
}


/*-- RESPONSIVE NAV --*/
.slide-menu-open{


}

.side-menu-wrapper { /* style menu wrapper */
    overflow: hidden;
    background: rgba(0,0,0,.95);
    padding: 15px 0 0 15px;
    position: fixed; /* Fixed position */
    top: 0;
    right: -290px; /* Sidebar initial position. "right" for right positioned menu */
    height: 100%;
    z-index: 2;
    transition: 0.5s; /* CSS transition speed */
    width: 250px;
    font: 16px;
}
.side-menu-wrapper > ul{ /* css ul list style */
    list-style:none;
    padding:0;
    margin:0;
    overflow-y: auto; /* enable scroll for menu items */
    width:500px; /* this width will hide scroll bar */
    height:95%;
}
.side-menu-wrapper > ul > li > a { /* links */
    display: block;
    border-bottom: 1px solid #131313;
    padding: 6px 4px 6px 4px;
    color: white;
    transition: 0.3s;
    text-decoration: none;
}
.side-menu-wrapper > a.menu-close { /* close button */
    padding: 8px 0 4px 23px;
    color: white;
    display: block;
    margin: -30px 0 -10px -20px;
    font-size: 35px;
    text-decoration: none;
}

.side-menu-overlay { /* overlay */
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,.7);
    overflow-y: auto;
    overflow-x: hidden;
    text-align: center;
    opacity: 0;
    transition: opacity 1s;
}

.logo-container img{
    padding-top: 15px;
    width: 200px;
    float: left;
}

.home-header{
    position: relative;
    height: 600px;
    background-image: url(../images/header-background.jpg);
    background-position: 50% 50%;
    background-size: cover;

}


.loader {
    position:absolute;
    top:50%;
    left:50%;
    -webkit-transform:translate(-50%,-50%);
    transform:translate(-50%,-50%);
    width:550px;
    height:550px;
    box-sizing:border-box;
}
.loader .face {
    position:absolute;
    
}
.loader .face.face1 {
    top:0;
    left:0;
    right:0;
    bottom:0;
    background: rgba(255, 255, 255, 0.5);
    
    border-radius:50%;
    border-left:2px solid #ffff00;
    border-top:2px solid #ffff00;
    -webkit-animation:animate 8s linear infinite;
    animation:animate 8s linear infinite;
}
.loader .face.face2 {
    top:30px;
    left:30px;
    right:30px;
    bottom:30px;
    background: rgba(255, 255, 255, 0.5);
    border-radius:50%;
    border-right:2px solid #03a9f4;
    border-bottom:2px solid #03a9f4;
    animation:animate 8s linear reverse infinite;
}
.loader .face .circle {
    position:absolute;
    top:calc(50% - 1px);
    left:50%;
    width:50%;
    height:2px;
    -webkit-transform-origin:left;
    transform-origin:left;
}
.loader .face.face1 .circle {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.loader .face.face2 .circle {
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.loader .face .circle:before {
    content:'';
    position:absolute;
    width:10px;
    height:10px;
    border-radius:50%;
    background: rgba(255, 255, 255, 0.5);
    top:-4px;
    right:-6px;
    
}
.loader .face.face1 .circle:before {
    background:#ffff00;
    box-shadow: 0 0 20px #ff0,
    0 0 40px #ff0,
    0 0 60px #ff0,
    0 0 80px #ff0,
    0 0 100px #ff0,
    0 0 5px rgba(255,255,0,.1);
}
.loader .face.face2 .circle:before {
    background:#03a9f4;
    box-shadow: 0 0 20px #03a9f4,
    0 0 40px #03a9f4,
    0 0 60px #03a9f4,
    0 0 80px #03a9f4,
    0 0 100px #03a9f4,
    0 0 5px rgba(3,169,244,1);
}

@-webkit-keyframes animate {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform:rotate(360deg);
        transform:rotate(360deg);
    }
}

@keyframes animate {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    100% {
        -webkit-transform:rotate(360deg);
        transform:rotate(360deg);
    }
}


.center-header-info{
    position: relative;
    z-index: 9999;
    
    top: 25%;
    text-align: center;
    
}




.center-header-info a{
   background-color: #03416a;
   padding-right: 20px;
   padding-left: 20px;
   padding-top: 10px;
   padding-bottom: 10px;
   color: white;
   display: inline-block;
   margin-top: 15px;
   margin-bottom: 15px;

}

.center-header-info h2{
 padding-top: 15px;
 font-size: 18px;
 line-height: 1.3em;
 font-weight: 300;
 font-family: 'Roboto', sans-serif;
}

.template-section-1{
    position: relative;

}

.explore-link {
    background-color: white;
    position: absolute;
    left: 390px;
    width: 200px;
    height: 200px;
    border-radius: 50%;
    z-index: 99999;
    bottom: -100px;
    border: 15px solid #ccc;
}


.explore-link-2{
    background-color: white;
    position: absolute;

    width: 200px;
    height: 200px;
    border-radius: 50%;
    z-index: 99999;
    bottom: -100px;
    border: 15px solid #ccc;
    right: 390px;
}



.switch-sites a{
    background-color: #03416a;
    padding-right: 20px;
    padding-left: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    color: white;
    font-size: 17px;
    transition: 0.5s;
    
}

.switch-sites a:hover{
    opacity: 0.5;
    text-decoration: none;
    color: white;
}

.image-position{
    left:0;
    position: absolute;
    
}

.image-position-2{
    right:0;
    position: absolute;
    z-index: 0;
}

@media (max-width: 1380px){
    .image-position-2{
        right: -400px;
        position: absolute;
    }
    
    .image-position{
        left: -400px;
        position: absolute;
    }
    
    .explore-link-2{
        right: 100px;
    }
    
    .explore-link{
        left: 100px;
    }
    
}

.fa-briefcase-medical:before {

}

.fa-arrow-circle-down:before{
    font-size: 50px;
    position: relative;
    left: 50%;

    margin-left: -25px;
    color: #212529;
}

.center-link-content{
    position: relative;
    text-align: center;
    top: 35px;
    
} 

.arrows-direction img{
    position: absolute;
    left: 50%;
    margin-left: -313px;
    top: -94px
}

.template-section-2{
    text-align: center;
    padding-top: 125px;

    background-repeat: no-repeat;
    background-position: bottom;
    padding-bottom: 50px;
    
    
}

.template-section-2 h3{
    font-size: 18px;
    font-weight: 500;
    font-family: 'Roboto', sans-serif;
}

.template-section-2 h2{
    font-size: 35px;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    padding-bottom: 15px;
}

.template-section-3{
    padding-top: 50px;
    padding-bottom: 50px;
    background-image: url(../images/polygon-background-2.jpg);
    background-position: 50% 50%;
    background-size: cover;
}

.template-section-3 img{
 max-width: 100%;

 

}
.find-out-more a{
    background-color: #03416a;
    padding-right: 20px;
    padding-left: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    color: white;
    font-size: 16px;
    display: inline-block;
    transition: 0.5s;
    
    
}

.find-out-more a:hover{
    opacity: 0.5;
    text-decoration: none;
    color: white;
    margin-left: 15px;
}

.mid-bar-light{
    height: 30px;
    background-color: #03aade;

}

.mid-bar-dark{
    height: 30px;
    background-color: #03416a;
}

.logo-customer-container{

 border-bottom: 20px solid #03aade;
 padding-bottom: 50px;
 background-repeat: no-repeat;
}

.logo-customer-container .container{
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    padding-bottom: 15px;
    padding-top: 15px;
}

.logo-customer-container h2{
    padding-bottom: 15px;
    text-align: center;
    font-size: 18px;
    text-transform: uppercase;
    font-weight: 500;
    font-family: 'Roboto', sans-serif;

}

.services-container ul li{
    padding-top: 8px;
    padding-bottom: 8px;
    border-top: 1px solid #ccc;
    
    
}


.services-container h3{
    font-size: 18px;
    text-transform: uppercase;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
}

.services-container p{
    background-color: #03aade;
    padding: 15px;
    color: white;
}

.services-container li{
   font-family: 'Roboto', sans-serif;
   font-weight: 300;
}

.services-container h2{
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
}

.owl-carousel h3{
   font-family: 'Roboto', sans-serif;
   font-weight: 400;
}

.fa-prescription-bottle:before{
    color: yellow;
}

.services-container{
 padding-top: 25px;
 padding-bottom: 5px;
 padding-left: 25px;
 padding-right: 25px;
 background-color: #e9e9e9;
 box-shadow: 10px 10px 5px -6px rgba(0,0,0,0.14);
}

.color-2{
    background-color: #e9e9e9;
    padding: 15px;
    color: #212529;
        border-bottom: 3px solid yellow;
}

.color-1{
    background-color: #e9e9e9;
    padding: 15px;
    color: #212529;
    margin-bottom: 0px;
}

.owl-carousel h3{
    margin-bottom: 0px;
    font-size: 20px;
}

.owl-carousel a{
    background-color: #03416a;
    padding-right: 20px;
    padding-left: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    color: white;
    font-size: 16px;
    display: inline-block;
    text-transform: uppercase;
    transition: 0.5s;
}

.owl-carousel a:hover{
    text-decoration: none;
    opacity: 0.5;
    margin-left: 15px;
    color: white;
    
}

.template-section-4{
    text-align: center;
    padding-bottom: 70px;
    overflow: hidden !important;
    position: relative;

}

.template-section-4 a{
    background-color: #03aade;
    padding-right: 20px;
    padding-left: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    color: white;
    font-size: 16px;
    display: inline-block;
    margin-top: 15px;
    transition: 0.5s;
    text-transform: uppercase;
}

.template-section-4 a:hover{
    opacity: 0.5;
    text-decoration: none;
    color: white;
    margin-left: 15px;
}

.template-section-4 h2{
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    padding-top: 70px;
    color: white;
    font-size: 40px;
}

.template-section-4 h3{
    font-size: 18px;
    color: white;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
}

.services-container a li{
    display: inline;
}

.fa-mobile-alt:before{
    color: yellow;
}

.column{
    text-align: center;
}

canvas {
    display: block;
    vertical-align: bottom;
}


/* ---- particles.js container ---- */

#particles-js {
    position: absolute;
    width: 100%;
   height: auto;
    background-color: #03416a;
    background-image: url("");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50% 50%;
    z-index: -999999999;

}

.parallax{
    text-align:center;
    padding-top: 50px;
    padding-bottom: 50px;

    /* The image used */
    background-image: url(../images/section-background-contact.jpg);

    /* Set a specific height */
    

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.col-relatvie{
    position: relative;
}

.parallax h2{
    font-size: 35px;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    padding-bottom: 25px;
    text-align: center;

}

.steps{
    background-color: white;
    width: 180px;
    height: 180px;
    border-radius: 50%;
    z-index: 99999;
    margin: auto;
    margin-bottom: 15px;
    
}

.gradient-animation{
    width: 200px;
    height: 200px;
     border-radius: 50%;
    margin: auto;
    background-color: black;
    margin-bottom: 15px;
        padding: 10px;
    background: linear-gradient(-45deg, #03aade, #03416a, #6abdf4, #23D5AB);
    background-size: 400% 400%;
    -webkit-animation: Gradient 5s ease infinite;
    animation: Gradient 5s ease infinite;
}

@-webkit-keyframes Gradient {
    0% {
        background-position: 0% 50%
    }
    50% {
        background-position: 100% 50%
    }
    100% {
        background-position: 0% 50%
    }
}

@keyframes Gradient {
    0% {
        background-position: 0% 50%
    }
    50% {
        background-position: 100% 50%
    }
    100% {
        background-position: 0% 50%
    }
}


.parallax span{
    background-color: #03aade;
    color: white;
    padding-left: 10px;
    padding-right: 10px;
}

.parallax h3{
    font-size: 18px;
    text-transform: uppercase;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
}

.about-link a{
    background-color: #03416;
    border-radius: 20px;
    transition: 0.5s;
}

.about-link a:hover{
    opacity: 0.5;
    margin-left: 15px;
    text-decoration: none;
    color: white;
}

footer{
    padding-top: 25px;
    padding-bottom: 25px;
    
    
}

footer a{
    color: #03416a;
    

}


.social-icons a:hover{
    text-decoration: none;
}

.parallax h3{

    font-family: 'Roboto', sans-serif;
    font-weight: 500;
}

.owl-nav img{
    opacity: 0.8;
}

.view-link{
    color: #03416a;
}

.modal-content{
    margin-top: 130px;
}

.btn-primary{
 background-color: rgb(3, 65, 106);
 padding-right: 20px;;
 padding-left: 20px;;
 padding-top: 10px;;
 padding-bottom: 10px;
 color: white;
 font-size: 16px;;
 display: inline-block;
 text-transform: uppercase;
 font-family: 'Roboto', sans-serif;
 font-weight: 500;
 border-radius: 15px;
 border: none;
}

.modal-header{
    background-color: #03aade;
    color: white;
    font-size: 18px;
    text-transform: uppercase;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
}

.services-container p{
    background-color: white;
    color: #212529;
}

.modal-dialog{
    max-width: 50%;
}

.explore-link span{
  text-transform: uppercase;
  font-weight: 400;
  font-family: 'Roboto', sans-serif;
}

.explore-link-2 span{
  text-transform: uppercase;
  font-weight: 400;
  font-family: 'Roboto', sans-serif;
}

.client-titles h2{
    color: white;
    text-align: center;
    font-size: 35px;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
}

.client-titles p{
    color: white;
    text-align: center;
    padding-bottom: 25px;
}

.services-section{

    padding-top:25px;
    padding-bottom: 50px;
}

.services-section .col-md-4 {
    margin-bottom: 42px;
}

.services-section h2{
    font-size: 18px;
    text-transform: uppercase;
    font-weight: 500;
    font-family: 'Roboto', sans-serif;
    margin-bottom: 15px;
    padding-top: 25px;
}

.icon{
    font-size: 50px;
    position: relative;

    color: #212529;
}

.services-section a{
    background-color: #03416a;
    padding-right: 20px;
    padding-left: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    color: white;
    font-size: 16px;
    display: inline-block;
    text-transform: uppercase;
    margin-bottom: 15px;
    transition: 0.5s;
}

.services-section a:hover{
    text-decoration: none;
    color: white;
    opacity: 0.5;
    margin-left: 15px;
    
}

.push-row{
    padding-top: 25px;
}

.mid-bar-dark-2{
    background-color: #03416a;
    color: white;
    padding: 15px;
    border-bottom: 20px solid #03aade;
    padding-top: 24px;
        border-top: 5px solid yellow;
}

.mid-bar-dark-2 h2{
    font-size: 25px;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
}

.dropbtn {
    background-color: #03416a;
    color: white;
    padding: 5px;
    font-size: 13px;
    border: none;
    cursor: pointer;
    text-transform: uppercase;

}

.dropdown {
    position: relative;
    display: inline-block;
    
}

.dropdown-content {
    display: none;
    
    background-color: #f9f9f9;
    min-width: 100%;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 99999999;
    text-align: left;
    position: absolute;


}

.dropdown-content a {
    color: black;
    padding: 5px;
    text-decoration: none;
    display: block;
    font-size: 14px;
}

.dropdown-content a:hover {
  border-radius: 0px;
}

.dropdown-content a:hover {background-color: #f1f1f1}

.dropdown:hover .dropdown-content {
    display: block;
}

.dropdown:hover .dropbtn {
    background-color: #03aade
}

.language-select{
   position: absolute;
   right: 0px;
   z-index: 5;
   padding: 10px;
}

h1 span{
    background-color: #03aade ; 
    color: white;
    padding-right: 10px;
    padding-left: 10px;
    font-size: 37px;
    line-height: 1.5em;
}

.template-section-2 span{
   background-color: #03aade ; 
   color: white;
   padding-right: 10px;
   padding-left: 10px;
}

.scrollup {
    width: 50px;
    height: 45px;
    position: fixed;
    bottom: 15px;
    right: 15px;
    display: none;
    color: white;
    background-color: #03aade ; 
    font-size: 30px;
    transition: 0.5s;


}

.fa-arrow-up:before{
    padding-left: 12px;
    margin-top: 10px;
}

.border-services{
    padding-top: 15px;
    padding-bottom: 5px;
    border-top: 1px solid #ccc;

}

.scrollup:hover {
    opacity: 0.5;
    color: white;
}

.fa-prescription-bottle:before {
    content: "\f485";
    font-size: 15px;
}

header h2 span{
    color: #212529;
    font-weight: 400;
}

.circle-image{
    position: relative;
    
}

.circle-image .circle-1{

        position: absolute;
    width: 370px;
    top: 4px;
    left: 50%;
    margin-left: -150px;

}

.circle-image .circle-2{
    position: absolute;
    left: 50%;
    top: 138px;
    margin-left: -17px;
   
}

.circle-image-information p{
    text-align: center;
    color: white;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 500;
    font-family: 'Roboto', sans-serif;
}

.circle-title-1{
  padding-left: 25px;
  
}

.circle-title-2{
   padding-right: 25px;

}

.circle-title-3{
    padding-top: 100px;
    padding-left: 25px;

}

.circle-title-4{

  padding-top: 100px;
  padding-right: 25px;
}

#main {


}

#outer-circle {
 left: 50%;
 margin-left: -155px;
 border: 10px solid #03416a;
 border-top-color: yellow;

 text-align:center;
 background: linear-gradient(to bottom, #ffffff 48%, #ecebfa 49%, #ecebfa 51%, #fff 52%);
 width: 380px;
 height: 380px;
 border-radius: 220px;

 -webkit-animation:turning_cw 5s infinite;
 animation:turning_cw 5s infinite;
 position:relative;
 opacity: 0.7; 
 -webkit-transform: translateY(-50%) translateX(-50%); 
         transform: translateY(-50%) translateX(-50%);
}








@-webkit-keyframes turning_cw {
 0%{
    -webkit-transform: rotate(0deg); }
    100%{
        -webkit-transform: rotate(360deg); }
    }


        @keyframes turning_cw {
         0%{
            -webkit-transform: rotate(0deg);
                    transform: rotate(0deg); }
            100%{
                -webkit-transform: rotate(360deg);
                        transform: rotate(360deg); }
            }

            #heart {
                position: relative;
                width: 100px;
                height: 90px;
                -webkit-animation: heartbeat 2s infinite;
                        animation: heartbeat 2s infinite;
                margin:0 auto;
                    top: 17px;
            }
            #heart:before,
            #heart:after {
                position: absolute;
                content: "";
                left: 50px;
                top: 50px;
                width: 50px;
                height: 80px;
                background: #03416a;
                border-radius: 50px 50px 0 0;
                -webkit-transform: rotate(-45deg);
                transform: rotate(-45deg);
                -webkit-transform-origin: 0 100%;
                transform-origin: 0 100%;
            }
            #heart:after {
                left: 0;
                -webkit-transform: rotate(45deg);
                transform: rotate(45deg);
                -webkit-transform-origin: 100% 100%;
                transform-origin :100% 100%;
            }



            @-webkit-keyframes heartbeat
            {
              0%
              {
                -webkit-transform: scale( .75 );
                        transform: scale( .75 );
            }
            20%
            {
                -webkit-transform: scale( 1 );
                        transform: scale( 1 );
            }
            40%
            {
                -webkit-transform: scale( .75 );
                        transform: scale( .75 );
            }
            60%
            {
                -webkit-transform: scale( 1 );
                        transform: scale( 1 );
            }
            80%
            {
                -webkit-transform: scale( .75 );
                        transform: scale( .75 );
            }
            100%
            {
                -webkit-transform: scale( .75 );
                        transform: scale( .75 );
            }
        }



            @keyframes heartbeat
            {
              0%
              {
                -webkit-transform: scale( .75 );
                        transform: scale( .75 );
            }
            20%
            {
                -webkit-transform: scale( 1 );
                        transform: scale( 1 );
            }
            40%
            {
                -webkit-transform: scale( .75 );
                        transform: scale( .75 );
            }
            60%
            {
                -webkit-transform: scale( 1 );
                        transform: scale( 1 );
            }
            80%
            {
                -webkit-transform: scale( .75 );
                        transform: scale( .75 );
            }
            100%
            {
                -webkit-transform: scale( .75 );
                        transform: scale( .75 );
            }
        }

        .fa-heart:before{
            color: red;
        }

        .parallax .fa-user-plus:before{
            font-size: 50px;
            color: #03416a;

        }

        .parallax .fa-sign-in-alt:before {
           color: #03416a;
           font-size: 50px;

       }

       .fa-container{
        padding-top: 65px;
    }

    .over-label-header{
       height: 455px;
       background-image: url(../images/over-label-header-image.jpg);
       text-align: center;
       background-position: 50% 50%;
   }

   .over-label-header h1{

   }

   .over-label-header span{

    font-size: 37px;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    text-transform:uppercase;
}

.over-label-header h2{
 font-size: 25px;
 font-family: 'Roboto', sans-serif;
 font-weight: 400;
}



.service-header-circle{
    padding-top: 120px;
    position: relative;
    z-index: 9;
}

.service-header-circle h3{

    padding-top: 15px;
    font-size: 18px;
    line-height: 1.3em;
    font-weight: 300;
    font-family: Roboto, sans-serif;
}

.over-label-header{

    font-weight: 300;
    font-family: 'Roboto', sans-serif;
    border-bottom: 20px solid #03aade;
}

.over-label-header p{

    font-size: 18px;
    line-height: 1.3em;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
}

.template-section-5{
  position: relative;
  border-top: 20px solid #03416a;

  padding-bottom: 50px;
}

.template-section-5 h2{
 font-size: 25px;
 font-weight: 400;
 font-family: 'Roboto', sans-serif;
}

.template-section-5 h3{
   font-size: 18px;
   font-weight: 300;
   font-family: 'Roboto', sans-serif;
   line-height: 1.4;
}

.normal-button a{
    padding-right: 20px;
    padding-left: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    color: white;
    display: inline-block;
    margin-top: 15px;
    margin-bottom: 15px;
    background-color: #03416a;
}

.parallax-2{
   text-align:center;
   padding-top: 50px;
   padding-bottom: 50px;
   height: 300px;
   /* The image used */
   background-image: url(../images/overlabelling-service-image.jpg);

   /* Set a specific height */


   /* Create the parallax scrolling effect */
   background-attachment: fixed;
   background-position: 50% 50%;
   background-repeat: no-repeat;
   
}

.parallax-2 h2{
    font-size: 35px;
    font-family: 'Roboto', sans-serif;

    text-align: center;
    font-weight: 400;
}

.template-section-6 h2{
    padding-top: 50px;
}

.template-section-6 p{
    font-size: 18px;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
}

.template-section-6 span{
    background-color: #03aade;
    color: white;
    padding-left: 10px;
    padding-right: 10px;

    text-transform: uppercase;
}

.template-section-6 a{
    background-color: #03416a;
    padding-right: 20px;
    padding-left: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    color: white;
    display: inline-block;
    margin-top: 15px;
    margin-bottom: 15px;
}

.additional-content {
    padding-top: 32px;
    padding-bottom: 32px;
}

.additional-content .rhs {
    background-color: #e9e9e9;
    padding: 40px;
    border-bottom: 3px solid yellow;
}

.template-section-7{
   
    padding-bottom: 50px;
}

.template-section-7 h2{
 font-size: 18px;
 font-family: 'Roboto', sans-serif;
 font-weight: 500;
 background-color:#03416a;
 color: white;
 padding:15px;
}

.template-section-7 p{
 border-top: 1px solid #ccc;
 padding-top: 10px;
}

.template-section-7 img{
    max-width: 100%;
    padding-bottom: 15px;
    padding-top: 5px;
}

.center-titles{
    padding-top: 50px;
    padding-bottom: 50px;
    text-align: center;
    background-image: url(../images/polygon-background-2.jpg);
    color: white;
}

.center-titles h2{
    font-size: 30px;
}

.intro-2 h2{
    font-size: 30px;
}

.push-row-2{
    padding-top: 50px;
}

.fa-heartbeat:before{
    font-size: 30px;
    color: red;
}

.heart-container{
    padding-top: 10px;
    padding-bottom: 10px;
}

.about-us{

    padding-bottom: 50px;
}

.meet-the-team{
  background-image: url(../images/polygon-background-2.jpg);
  background-position: 50% 50%;
  padding-top: 50px;
  padding-bottom: 50px;
  background-size: cover;
}

.meet-the-team h2 {
    margin-bottom: 32px;
}

.meet-the-team img{
    max-width: 100%;
}

.about-us img{
    max-width: 100%;
}

.about-header{
    height: 455px;
    background-image: url(../images/about-header.jpg);
    text-align: center;
    background-position: 50% 50%;
    border-bottom: 20px solid #03aade;
    background-size:cover;
}

.about-header span{

    font-size: 37px;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    text-transform:uppercase;
}

.about-header h2{
 font-size: 25px;
 font-family: 'Roboto', sans-serif;
 font-weight: 400;
}

.fa-angle-right:before{
    color: yellow;
}

.about-link a{
  background-color: #03416a;
  padding-right: 20px;
  padding-left: 20px;
  padding-top: 10px;
  padding-bottom: 10px;
  color: white;
  display: inline-block;
  margin-top: 15px;
  margin-bottom: 15px;
}

.key-services {
    background-color: #e9e9e9;
    padding: 40px;
    border-bottom: 3px solid yellow; 
}

.key-services h1 {
    margin-bottom: 32px;
}

.key-services ol {
    padding: 0;
  
}

.key-services ol li {
    font-size: 20px;
    border-bottom: 1px solid #ccc;
    margin-bottom: 32px;
    padding-bottom: 32px;
    margin-left: 21px;
}

.meet-the-team img{
    width: 200px;
    height: auto;
    max-height: 200px;
    border-radius: 50%;
    text-align: center !important;
}


.team-members{
    text-align: center;
}
.team-members h3{
    color: white;
    background-color:  #03416a;
    padding-top: 5px;
    padding-bottom: 5px;
    font-weight: 400;
}

.team-members p{
    color: white;

}

.about-points li{

    padding-bottom: 15px;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
}

ul li{
  padding-left: 0px;
}

.about-images img{
    max-width: 100%;
}

.color-1{
    margin-bottom: 0px !important;
}


.color-3{
 background-color:  #03416a;
 padding: 15px;
 color: white;
 border-bottom: 5px solid #03aade;

}

.color-4{
  background-color:  #03aade;
  padding: 15px;
  color: white;

}

.intro{
    background-color:  #e9e9e9;
    padding-top: 50px;
    padding-bottom: 50px;
    text-align: center;
    border-top: 20px solid #03416a;
    text-align: left;
    position: relative;
    overflow: hidden;
}

.block-border p{
    border-top: 1px solid #ccc;
    padding-top: 10px;
    margin-top: 15px;
}


#rocket-icon {
  width: 550px;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
  position: absolute;
 bottom: -250px;
    left: 50px;
  margin-left: -60px;  
    z-index: -1;

}

.flame {
  -webkit-transform-origin: 15px 37.5px;
          transform-origin: 15px 37.5px;
}

.light-blue-container{
    text-align: center;
    padding-top: 50px;
}

.light-blue-container h2{
    background-color: #03aade;
    color: white;
    padding-right: 10px;
    padding-left: 10px;
    display: inline;
    text-align: center;
    font-size: 35px;
}

.about-section-1{
    border-bottom: 20px solid #03aade;
}

.light-blue-container h3{
    font-size: 18px;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    padding-top: 15px;
}

.fa-info-circle:before{
    color: #03aade;
}

.fa-notes-medical:before{
    color: #03aade;
}

.fa-rocket:before{
    color: yellow;
}

.mission{
   
    position: relative;
    z-index: 2;

}

.nav-link{
    display: block;
    text-align: right;
    
    text-decoration: none;
    color: #03416a;
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    transition: 0.3s;
}

.nav-link{
    padding: 0px !important;
    display: block;
    text-align: right !important;
    padding: 14px 16px !important;
    text-decoration: none !important;
    color: #03416a !important;
    font-family: 'Roboto', sans-serif !important;
    font-weight: 500 !important;
    transition: 0.3s;
}

.dropdown:hover .dropdown-menu {
   display: block;
}

.pharma-header{
   height: 455px;
   background-image: url(../images/pharma-background.jpg);
   text-align: center;
   background-position: 0% 50%;
   
    position: relative;
}

.assembly-header{
      height: 455px;
   background-image: url(../images/value-header.jpg);
   text-align: center;
   background-position: 50% 50%;
   
    position: relative;
}

.assembly-header span{
       font-size: 37px;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    text-transform:uppercase;
}

.assembly-header h2{
 font-size: 25px;
 font-family: 'Roboto', sans-serif;
 font-weight: 400;
}

.value-header{
   height: 455px;
   background-image: url(../images/value-header.jpg);
   text-align: center;
   background-position: 50% 50%;
   
    position: relative;
}

.value-header span{

    font-size: 37px;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    text-transform:uppercase;
}

.value-header h2{
 font-size: 25px;
 font-family: 'Roboto', sans-serif;
 font-weight: 400;
}


.pharma-header span{

    font-size: 37px;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    text-transform:uppercase;
}

.pharma-header h2{
 font-size: 25px;
 font-family: 'Roboto', sans-serif;
 font-weight: 400;
}

.intro-white{
    background-color:  white;
    padding-top: 50px;
    padding-bottom: 50px;
    text-align: center;
    border-top: 20px solid #03416a;
    text-align: left;
    position: relative;
}

.template-section-5 img{
    max-width: 100%;
}

.template-section-8 img{
   max-width: 100%;
}

.template-section-8{
    padding-bottom: 50px;
}

.template-section-8 h3{
    font-size: 18px;
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    background-color: rgb(3, 65, 106);
    color: white;
    padding: 15px;
}

.template-section-8{
    padding-top: 50px;
}

.border-container p{
    border-top: 1px solid #ccc;
    padding-top: 10px;
    margin-top: 15px;
}

.intro-2{
    padding-top: 50px;
    padding-bottom: 50px;
    text-align: center;
    border-top: 20px solid #03416a;
    background-image: url(../images/polygon-background-2.jpg);
    color: white;
}

.specials-header{
   height: 455px;
   background-image: url(../images/specials-background.jpg);
   text-align: center;
   background-position: 50% 50%;
   border-bottom: 20px solid #03aade;
}

.specials-header h1{

}

.specials-header span{

    font-size: 37px;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    text-transform:uppercase;
}

.specials-header h2{
 font-size: 25px;
 font-family: 'Roboto', sans-serif;
 font-weight: 400;
}

.navbar-nav .nav-link:hover{
    background-color: #03aade;
    color: white !important;
}

.fa-briefcase-medical:before{
    color: #03aade;
}

.dropdown-item:hover{
    background-color:  #03aade;
    color: white;
}

.dropdown-item:hover{
    background-color:  #03aade;
    color: white;
}

.dropdown-menu a{
    border-radius: 0px !important;
}

.full-background{
    background-image: url(../images/contact-form-background.jpg);
    
}

.brand {
  text-align: center;
  font-weight: 300;
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

.brand span {
  color: #ffffff;
}

.wrapper {
  box-shadow: 0 0 20px 0 rgba(57, 82, 163, 0.7);
}

.wrapper > * {
  padding: 1em;
}

.news-nav{
    background-color: #03416a;
}

.news-nav h2{
    margin-bottom: 0px;
    color: white;
    padding-top: 15px;
    font-size: 17px;
    padding-bottom: 15px;
}

.news-nav h2:before{
    font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f1ea";
    margin-right: 5px; 
   
}

.news-nav li a{
    color: white;
    font-size: 18px;
    font-weight:300;
    text-decoration: underline;
}

.myclass{
    margin-top: 12px;
}

/* ------------------- */
/* COMPANY INFORMATION */
/* ------------------- */

.company-info {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
    background-color: #03416a;
    color: white;
}

.company-info a{
    color: white;
}

.company-info h3,
.company-info ul {
  margin: 0 0 1rem 0;
    list-style: none;
}

/* ------- */
/* BLOG */
/* ------- */
.bloglisting {
    margin-top: 40px;
}

.bloglisting .readmore,
.blogpost .readmore {
    background-color: rgb(3, 170, 222);
    padding-right: 20px;
    padding-left: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    color: white;
    font-size: 16px;
    display: inline-block;
    margin-top: 15px;
    transition: all 0.5s ease 0s;
}

.bloglisting .readmore:hover,
.blogpost .readmore:hover {
    opacity: 0.5;
    text-decoration: none;
}

.post-meta {
    margin-bottom: 40px;
}

/* ------- */
/* CONTACT */
/* ------- */

.contact {
  background: white;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}

/* ---- */
/* FORM */
/* ---- */

/*.contact form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-gap: 20px;
}

.contact form label {
  display: block;
}

.contact form p {
  margin: 0;
}

.contact form .full {
  grid-column: 1 / 3;
}

.contact form button,
.contact form input,
.contact form textarea {
  width: 100%;
  padding: 1em;
  border: solid 1px #03aade;
  border-radius: 4px;
}*/

.contact form button,
.contact form a,
.contact form input[type="submit"] {
    cursor: pointer;
}

.contact form textarea {
  resize: none;
}

.contact form button {
  background: #03416a;
  border: 0;
  color: #e4e4e4;
  text-transform: uppercase;
  font-size: 14px;
  font-weight: bold;
}

.contact form button:hover,
.contact form button:focus {
  background: #03aade;
  color: #ffffff;
  outline: 0;
  transition: background-color 2s ease-out;
}

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

@media only screen and (min-width: 700px) {
  .wrapper {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 2fr;
        grid-template-columns: 1fr 2fr;
}

.wrapper > * {
    padding: 2em;
}

.company-info {
    border-radius: 4px 0 0 4px;
    
    color: white;
}

.company-info a {
    color: #fff;
}

.contact {
    border-radius: 0 4px 4px 0;
   
}

.company-info h3,
.company-info ul,
.brand {
    text-align: left;
    list-style: none;
}
}

.contact-header{
    padding-top: 50px;
    padding-bottom: 50px;
}

.contact-header h1{
 color: white;
 padding-bottom: 15px;
}

.mission h3{
    font-weight:300;
}

.intro-2 h3{
    font-weight:300;
}

.company-info p{
    padding-top: 15px;
}

.company-info h4{
    font-size: 16px;
    padding-top: 15px;

}

.cloud-background img{
 position: absolute;
 z-index: 1;
 bottom: 0px;
}

.template-section-8 h4{
    border-bottom: 1px solid #ccc;
    padding-bottom: 15px;
}

.center-content h2{
    padding-bottom: 10px;
}


p{
    font-size: 17px !important;
}
.responsive-button{
    display: none;
}

.navbar-toggler{
    display: none;
}

.switch-sites-2 a{
    background-color: #03416a;
    padding-right: 20px;
    padding-left: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    color: white;
    font-size: 20px;
    transition: 0.5s;
    position: absolute;
    z-index: 1;
    font-size: 14px;
    margin: 10px;
    display: none;
    
}

.switch-sites-2 a:hover{
    opacity: 0.5;
    text-decoration: none;
    color: white;
}

nav ul a{
    text-transform:capitalize;
}

.service-title h2:before{
    font-family: "Font Awesome 5 Free"; 
    font-weight: 900; 
    content: "\f485";
    padding-right: 5px;
    color: #03aade;
}

.additional-content ul li{
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
}

.nav-border{
    position: absolute;
}

@media (max-width: 1192px){
    .navbar-expand-lg .navbar-collapse{
        display: none !important;
    }
    
    .responsive-button{
        display: block;
    }
    .switch-sites{
        position: absolute;
        left: 250px;
    }

}


@media (max-width: 420px){
    .language-select{
        display: none;
    }
    .image-position-2{
        right: -200px;
        position: absolute;
    }
    
    .image-position{
        left: -200px;
        position: absolute;
    }
    
    .explore-link-2{
        width: 120px;
        height: 120px;
        right: 0px;
        bottom: 20px;
    }
    
    
    .explore-link{
      width: 120px;
      height: 120px;
      left: 0px;
      bottom: 20px;
  }

    .clear-image{
        display:none;
    }
    
    .parallax-2{
        height: auto;
    }
    
   

  .arrows-direction img{
    display: none;
}

.fa-arrow-circle-down::before {
    font-size: 25px;
    margin-left: -12px;
}

.center-link-content{
    top: 25px;
}

.explore-link p{
    margin-bottom: 0px;
    font-size: 13px !important;
}

.explore-link-2 p{
   margin-bottom: 0px;
   font-size: 13px !important;

}

.center-header-info{
    width: 75%;
    margin: auto;
    top: 20%;
}

h1 span{
    font-size: 30px;
}
    
    h1{
        font-size: 30px;
    }
    
    .home-header h1{
        font-size: 20px;
    }
    
    .home-header h1 span{
        font-size: 35px;
    }
    
    .about-header span{
        font-size: 30px;
    }
    
    .pharma-header{
        height: auto;
        padding-bottom: 25px;
    }
    
    .about-header{
        height: auto;
        padding-bottom: 25px;
    }
    
    .over-label-header{
        height: auto;
        padding-bottom: 25px;
    }
    
    .specials-header{
        height: auto;
        padding-bottom: 25px;
    }
    
    .template-section-4{
        height: auto;
        background-color: rgb(3, 65, 106);
        padding-bottom: 50px;
    }
    
    .template-section-4 h2 {
        padding-top: 50px;
    }
    
    #particles-js{
        display: none;
    }

.template-section-2 span{
    font-size: 30px;
}

.template-section-2 {
    padding-top: 50px;
}

.image-position{
    display: none;
}

.image-position-2{
    display: none;
}

.parallax h2{
    font-size: 30px;
}

.client-titles h2 {
    font-size: 30px;
}

.over-label-header span {
    font-size: 30px;
}

.service-header-circle {
    padding-top: 65px;
}

.template-section-6 h2 {
    font-size: 30px;
    
}

.pharma-header span{
    font-size: 30px;
}
    
    .assembly-header span{
         font-size: 30px;
    }

.specials-header span {
    font-size: 30px;
}

.switch-sites{
    display: none;
}

.switch-sites-2 a{
    display: block;
}

    .news-nav{
        display: none;
    }
    
    .about-header{
        height: auto;
    }
   
     .template-section-8 h1{
        font-size: 25px;
         padding-top: 50px;
         
    }
    
    .contact-header h1{
         font-size: 25px;
         padding-top: 50px;
    }
    
}

@media (max-width: 768px){
    .padding-top{
        padding-top: 15px;
    }
    
    .push-row{
        padding-top: 0px;
    }
    
}


    
    .new-section-2{
        padding-top: 50px;
    }

.additional-content-2{
        background-color: rgb(233, 233, 233);
    padding: 40px;
    border-bottom: 3px solid yellow;
}

.overflow-wrap{
    overflow: hidden;
}

@media (max-width: 700px){
          .circle-image .circle-1 {
    position: absolute;
    width: 260px;
    top: 20px;
    left: 50%;
    margin-left: -131px;
}
    
    #outer-circle {
    left: 50%;
    margin-left: -141px;
    border: 10px solid #03416a;
    border-top-color: yellow;
    text-align: center;
    background: linear-gradient(to bottom, #ffffff 48%, #ecebfa 49%, #ecebfa 51%, #fff 52%);
    width: 280px;
    height: 280px;
    border-radius: 220px;
    -webkit-animation: turning_cw 5s infinite;
    animation: turning_cw 5s infinite;
    position: relative;
    opacity: 0.7;
    -webkit-transform: translateY(-50%) translateX(-50%);
    transform: translateY(-50%) translateX(-50%);
        top: 10px;
}
   
    .circle-image .circle-2 {
    position: absolute;
    left: 50%;
    top: 106px;
    margin-left: -37px;
    width: 70px !important;
}
    
}

.clear-image {
    position: absolute;
    /* left: 0px; */
    margin-left: 122px;
    left: 50%;
    margin-left: -409px;
}

.additional-border{
    height: 20px;
    background-color:  #03aade;
}

.small-gap{
    margin-top: 25px;
}

.values{
    padding: 15px;
    position: relative;
    z-index: 9999;

}

.testimonial-section{
    padding-top: 50px;
}

.testimonial-section .container{
    border: 1px solid #ccc;
}

#owl-two{
    
    padding-top: 20px;
}

.owl-carousel h6{
    color: #03aade;
}

.dropdown-menu{
    margin: 0px;
}

.about-section-1 img{
    max-width: 100%;
}

.table-value{
    padding-bottom: 50px;
}

.sorting_asc{
    background-color: #03416a !important;
    color: #fff;
}
td a{
   color: #03aade; 
}

table, th, td{
    border: 1px solid #eee;
}

p{
    font-size: 18px !important;
}

.playwrite-cu {
    font-family: "Playwrite CU", cursive;
    font-optical-sizing: auto;
    font-style: normal;
}