body {
margin: 0;
font-family: synthese,sans-serif;
background: transparent linear-gradient(
180deg
,#053354 0,#006aa5 100%) 0 0 no-repeat padding-box;
}

/* ***************** PRELOADER ******************* */
#bg{
background: transparent linear-gradient(
180deg
,#053354 0,#006aa5 100%) 0 0 no-repeat padding-box;
}
#loader {
position: absolute;
left: 45%;
top: 40%;
z-index: 1;
width: 30px;
height: 30px;
border: 16px solid #053354;
border-radius: 50%;
border-top: 16px solid #11e2e2;
-webkit-animation: spin 2s linear infinite;
animation: spin 2s linear infinite;
}

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

@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
/* Add animation to "page content" */
.animate-bottom {
position: relative;
-webkit-animation-name: animatebottom;
-webkit-animation-duration: 1s;
animation-name: animatebottom;
animation-duration: 1s
}

@-webkit-keyframes animatebottom {
from { bottom:-60px; opacity:0 }
to { bottom:0px; opacity:1 }
}

@keyframes animatebottom {
from{ bottom:-60px; opacity:0 }
to{ bottom:0px; opacity:1 }
}

h1,h2,h3 {
/* font-family: "'Times New Roman', Times, serif"; */
line-height: 1.5;
word-spacing: 4px;
letter-spacing: 1px;
font-weight:bold;
color: goldenrod;
}

h4{
font-family: Arial, sans-serif;
padding-top: 4px;
line-height: 35px;
word-spacing: 5px;
letter-spacing: 0.5px;
font-weight:normal;
font-size: 17px;
}
p{
font-family: Arial, sans-serif;
line-height: 35px;
word-spacing: 3px;
letter-spacing: 0.5px;
}
.header{
display: flex;
background-color: white;
/* background-color: #053354; */
font-weight: normal;
width: 100%;
height: fit-content;
position: fixed;
z-index: 100;
top: 0;
}
.logo{
/* width: 100%; */
width: 290px;
}

.bgImage{
overflow: hidden;
width: 100%;
/* margin-top: 20px; */
}

/************** topnav ****************/

.topnav {
overflow: hidden;
font-size: larger;
margin-top: 20px;
margin-left: auto;
margin-right: 20px;
}

.topnav a {
float: left;
display: block;
color: #053354;
text-align: center;
padding: 14px 5px;
text-decoration: none;
font-size: 1rem;
letter-spacing: .11px;
font-weight: normal;
}

/************* DropDown **************/
.dropdown {
float: left;
overflow: hidden;
}

.dropdown .dropbtn {
font-size: 20px;
border: none;
outline: none;
color: #053354;
padding: 14px 16px;
background-color: inherit;
font-family: inherit;
margin: 0;
font-size: 1rem;
letter-spacing: .11px;
font-weight: normal;

}

.dropdown-content {
display: none;
/* background: transparent linear-gradient(180deg,#053354 0,#006aa5 100%) 0 0 no-repeat padding-box; */
background-color: white;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1;
position: fixed;
margin-left: -22px;
}

.dropdown-content a {
float: none;
color: #053354;
padding: 12px 16px;
text-decoration: none;
display: block;
text-align: left;
font-size: 1rem;
letter-spacing: .11px;
font-weight: normal;
}

.topnav a:hover, .dropdown:hover .dropbtn {
color: goldenrod
/* color: #00feff; */
}

.dropdown-content a:hover {
background: transparent linear-gradient(
180deg
,#053354 0,#006aa5 100%) 0 0 no-repeat padding-box;
color: goldenrod;
}

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

/***************************** Content *****************************/

.content{
width: 100%;
height: fit-content;
background: transparent linear-gradient(
180deg
,#053354 0,#006aa5 100%) 0 0 no-repeat padding-box;
margin: 0;
display: flex;
}

.content-block{
z-index: 1;
position: relative;
padding-bottom: 22px;
}

.content-block h1{
color: white;
}

.content-block h1 span{
color: white;
font-size: 10px;
}

.content-block h2{
color: white;
line-height: 1.4;
word-spacing: 3px;
letter-spacing: 1px;
font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
font-weight:lighter;
font-size: 26px;
margin: 0;
}

.container h2{
margin: 0;
padding-left: 12px;
padding-top: 20px;
}

.container h4{
margin: 0;
padding-top: 12px;
padding-left: 12px;
padding-right: 12px;
}

.container{
height: fit-content;
background-color: white;
color: black;
padding: 15px;
}

.cImgs{
margin: auto;
padding: 10px;
}
.site-footer
{
position: absolute;
background-color:#26272b;
padding:20px 0 20px;
font-size:15px;
line-height:24px;
color:#737373;
width: 100%;
/* width: -webkit-fill-available; */
}

/********************************* Media Queries *************************************/

/* Media Query for Large screens */
/* @media (min-width: 1201px) */
@media (min-width: 1201px) {

.topnav a {
padding: 14px 35px;
}
.topnav .icon {
display: none;
}

.dropdown {
float: left;
overflow: hidden;
}

.content{
width: 100%;
height: fit-content;
background: transparent linear-gradient(
180deg
,#053354 0,#006aa5 100%) 0 0 no-repeat padding-box;
margin: 0;
margin-top: 80px;
}

.content-block{
z-index: 1;
position: relative;
padding: 35px;
width: 1000px;
}

.topnav .contact{
border-radius: 25px;
border: #053354 solid 2px;
color: #053354;
padding: 8px;
padding-left: 10px;
padding-right: 10px;
margin-left: 20px;
margin-top: 3px;
}

.topnav .contact:hover{
border: white solid 2px;
border-radius: 30px;
background-color: #053354;
color: goldenrod;
}

.clients-imgs{
/* margin-left: 50px; */
text-align: center;
}
}
/* (min-width: 1025px) and (max-width: 1200px) */
@media only screen and (min-width: 1025px) and (max-width: 1200px){
    .bgImage{
        margin-top: 15px;
    }

.topnav a {
padding: 14px 25px;
}
.topnav .icon {
display: none;
}

.dropdown {
float: left;
overflow: hidden;
}

.content{
width: 100%;
height: fit-content;
background: transparent linear-gradient(
180deg
,#053354 0,#006aa5 100%) 0 0 no-repeat padding-box;
margin: 0;
margin-top: 80px;
}

.content-block{
z-index: 1;
position: relative;
padding: 35px;
width: 600px;
}

.topnav .contact{
border-radius: 25px;
border: #053354 solid 2px;
color: #053354;
padding: 8px;
padding-left: 10px;
padding-right: 10px;
margin-left: 20px;
margin-top: 3px;
}

.topnav .contact:hover{
border: white solid 2px;
border-radius: 30px;
background-color: #053354;
color: goldenrod;
}
.clients-imgs{
/* margin-left: 50px; */
text-align: center;
}
}

/* @media screen and (max-width: 1024px) */
@media screen and (max-width: 1024px) {
    .bgImage{
        margin-top: 15px
    }
.topnav{
background-color: none;
}
.topnav{
margin-top: 8px;
}
.topnav a:not(:first-child), .dropdown .dropbtn {
display: none;
}
.topnav a.icon {
float: right;
display: block;
position: fixed;
right: 20px;
top: 10px;
color: #053354;
}
.topnav.active {
background-color: #04AA6D;
color: white;
}
.topnav .icon:hover{
color: #053354;
}
.topnav.responsive {
width: 100%;
margin-top: 80px;
float: right;
padding-bottom: 20px;
background: transparent linear-gradient(180deg,#053354 0,#006aa5 100%) 0 0 no-repeat padding-box;
position: absolute;
}
.topnav.responsive .icon {
float: right;
display: block;
position: fixed;
right: 20px;
top: 10px;
}

.topnav.responsive a.icon{
background: transparent linear-gradient(180deg,#006aa5 0,#053354 100%) 0 0 no-repeat padding-box;
color: white;
top: 0;
right: 0;
padding: 24px 25px;
}
.topnav.responsive a {
float: none;
display: block;
text-align: center;
color: white;
}
.topnav a:hover, .dropdown:hover .dropbtn {
    color: goldenrod;
}
.topnav.responsive .dropdown {float: none;}
.topnav.responsive .dropdown-content {
    position: relative;
    color: white;
background: transparent linear-gradient(180deg,#006aa5 0,#053354 100%) 0 0 no-repeat padding-box;
margin-left: 0;
}
.topnav.responsive .dropdown .dropbtn {
display: block;
width: 100%;
color: white;
}

.topnav .contact{
color: white;
border: solid 2px;
border-radius: 25px;
width: 90px;
margin: auto ;
padding: 5px;
padding-left: 1px;
padding-right: 1px;
}

.topnav .contact:hover{
border: white solid 2px;
border-radius: 30px;
background-color: goldenrod;
color: white;
}

.content{
width: 100%;
height: fit-content;
background: transparent linear-gradient(
180deg
,#053354 0,#006aa5 100%) 0 0 no-repeat padding-box;
margin: 0;
margin-top:80px;
}

.content-block{
z-index: 1;
position: relative;
padding-bottom: 35px;
padding: 35px;
width: 500px;
}

.clients-imgs{
/* margin-left: 35px; */
text-align: center;
}
.site-footer
{
position: absolute;
background-color:#26272b;
padding:20px 0 20px;
font-size:15px;
line-height:24px;
color:#737373;
/* margin-top: 810px; */
width: -webkit-fill-available;
}
}
/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
.a-bgImage{
    display: none;
} 
.bgImage{
display: none;
}
.logo{
width: 290px;
}
.content{
margin-top: 80px;
}
.content-block{
padding-top: 0px;
width: auto;
}

.topnav a.icon{
    top: 0;
    /* padding: 6px 14px; */
    padding: 24px 25px;

    right: 0;
}
.topnav.responsive {
margin-top: 80px;
}
.topnav.responsive a.icon{
    /* padding: 6px 14px; */
}
}

@media only screen and (min-device-width : 540px) and (max-device-width : 720px) {
    .a-bgImage{
        display: none;
    } 
.bgImage{
display: none;
}
.logo{
width: 290px;
}
.content{
margin-top: 80px;
}
.content-block{
padding-top: 0px;
width: auto;
}
.topnav a.icon{
    top: 0;
    /* padding: 9px 14px; */
    padding: 24px 25px;

    right: 0;
}
.topnav.responsive {
margin-top: 80px;
}
.topnav.responsive a.icon{
    /* padding: 9px 14px; */
}

}

/****************************** Footer ***************************/

footer .contact {
float: right;
width: 21%;
}

footer .heading{
text-align: center;
height: 20px;
width: 100%;
font-size: 18px;
text-transform: uppercase;
color: #006bca;
font-family: "Roboto Medium",Arial, Helvetica, sans-serif;
}
footer.contacts ul {
list-style-image: none;
list-style-type: none;
margin-top: 5px;
}

footer .contacts ul li {
display: block;
background-attachment: scroll;
background-image: url(../images/phone.png);
background-repeat: no-repeat;
background-position: left top;
padding-left: 30px;
height: 30px;
font-family: "Roboto Medium", Arial, Helvetica, sans-serif;
font-size: 14px;
color: #525252;
margin-top: 0px;
line-height: 30px;
}

.cont {
margin-top: 5px;
}

.cont ul {
list-style-image: none;
list-style-type: none;
}

.cont ul li {
float: left;
display: inline-block;
margin-right: 8px;
}

.site-footer hr
{
border-top-color:#bbb;
opacity:0.5
}
.site-footer hr.small
{
margin:20px 0
}
.site-footer h6
{
color:#fff;
font-size:16px;
text-transform:uppercase;
margin-top:5px;
letter-spacing:2px;
margin-bottom: 5px;
}
.site-footer a
{
color:#737373;
}
.site-footer a:hover
{
color:#3366cc;
text-decoration:none;
}
.footer-links
{
padding-left:0;
list-style:none
}
.footer-links li
{
display:block
}
.footer-links a
{
color:#737373
}
.footer-links a:active,.footer-links a:focus,.footer-links a:hover
{
color:#3366cc;
text-decoration:none;
}
.footer-links.inline li
{
display:inline-block
}
.site-footer .social-icons
{
text-align:right
}
.site-footer .social-icons a
{
width:40px;
height:40px;
line-height:40px;
margin-left:6px;
margin-right:0;
border-radius:100%;
background-color:#33353d
}
.copyright-text
{
margin:0
}
@media (max-width:991px)
{

.site-footer  .row .col-xs-6 .col-md-3{
        padding: auto;
    }
.site-footer [class^=col-]
{
margin-bottom:30px;
padding-right: 2px;

}
}
@media (max-width:767px)
{
     .row .col-xs-6 .col-md-3{
    padding: auto;
}
.site-footer
{
padding-bottom:0
}
.site-footer .copyright-text,.site-footer .social-icons
{
text-align:center
}
}
.social-icons
{
padding-left:0;
margin-bottom:0;
list-style:none
}
.social-icons li
{
display:inline-block;
margin-bottom:4px
}
.social-icons li.title
{
margin-right:15px;
text-transform:uppercase;
color:#96a2b2;
font-weight:700;
font-size:13px
}
.social-icons a{
background-color:#eceeef;
color:#818a91;
font-size:16px;
display:inline-block;
line-height:44px;
width:44px;
height:44px;
text-align:center;
margin-right:8px;
border-radius:100%;
-webkit-transition:all .2s linear;
-o-transition:all .2s linear;
transition:all .2s linear
}
.social-icons a:active,.social-icons a:focus,.social-icons a:hover
{
color:#fff;
background-color:#29aafe
}
.social-icons.size-sm a
{
line-height:34px;
height:34px;
width:34px;
font-size:14px
}
.social-icons a.facebook:hover
{
background-color:#3b5998
}
.social-icons a.twitter:hover
{
background-color:#00aced
}
.social-icons a.linkedin:hover
{
background-color:#007bb6
}
.social-icons a.google:hover
{
background-color:#e40f0f
}
@media (max-width:767px)
{
.social-icons li.title
{
display:block;
margin-right:0;
font-weight:600
}
}