@import url("https://fonts.googleapis.com/css?family=Cairo");
p {
  padding: 0;
  margin-bottom: 12px;
  font-weight: 300;
  line-height: 24px;
  color: #696E74;
  margin-top: 10px;
}

h1,h2,h3,h4,h5,h6,p,li a,.btn,.contact_form .form-control{
    
   font-family: 'Cairo', sans-serif !important; 
}

.head-top-w3ls {
    margin: 0 auto;
    text-align: center;
}

@media(max-width:1680px){
p { font-size: 20px;}
}
@media(max-width:1440px){
    
}
@media(max-width:1280px){
    
}
@media(max-width:1080px){
   p { font-size: 19px;} 
}
@media(max-width:1050px){
    
}
@media(max-width:991px){
    
}
@media(max-width:900px){
    p { font-size: 18px;}
}
@media(max-width:800px){
    
}
@media(max-width:768px){
    
}
@media(max-width:767px){
    p { font-size: 17px;}
}
@media(max-width:736px){
    
}
@media(max-width:667px){
    
}
@media(max-width:640px){
    p { font-size: 16px;}
}
@media(max-width:600px){
    
}
@media(max-width:480px){
    
    
}
@media(max-width:414px){
    p { font-size: 15px;}
    
}
@media(max-width:384px){
    
    
}

@media(max-width:375px){
    
    
}

@media(max-width:320px){
    
    p { font-size: 14px;}
    
}




#loader-wrapper {
        direction: ltr;
  position: fixed;
  background: rgba(105, 108, 112, 0.61);
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10000;
}

#loader-wrapper #loader {
  display: block;
  position: relative;
  left: 50%;
  top: 30%;
  width: 150px;
  height: 150px;
  margin: -75px 0 0 -75px;
  border-radius: 50%;
  border: 8px solid transparent;
  border-top-color: #ff0000;
  
  -webkit-animation: spin 2s linear infinite; 
          animation: spin 2s linear infinite; 
}

#loader-wrapper  #loader:before {
  content: "";
  position: absolute;
  top: 8px;
  left: 8px;
  right: 8px;
  bottom: 8px;
  border-radius: 50%;
  border: 8px solid transparent;
  border-top-color: #ffffff;
  
  -webkit-animation: spin 3s cubic-bezier(0.4, 0.0, 0.6, 1) infinite; 
          animation: spin 3s cubic-bezier(0.4, 0.0, 0.6, 1) infinite;
}

#loader-wrapper  #loader:after {
  content: "";
  position: absolute;
  top: 24px;
  left: 24px;
  right: 24px;
  bottom: 24px;
  border-radius: 50%;
  border: 8px solid transparent;
  border-top-color: #000000;
  
  -webkit-animation: spin 1.5s cubic-bezier(0.4, 0.0, 0.6, 1) infinite; 
          animation: spin 1.5s cubic-bezier(0.4, 0.0, 0.6, 1) infinite; 
}

#loader-wrapper  #ball {
    height: 47px;
    width: 46px;
  position: fixed;
  bottom: 55px;
  right: 55px;
left: 45px;
    top: 40px;
}

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

#loader-wrapper  #label {
  display: block;
  position: relative;
  top: 33%;
  margin: 24px 0 0 0px;
}

#loader-wrapper  p {
  color: #ffffff;
  font-size: .889em;
  line-height: 1.2;
  font-family: 'Inconsolata', sans-serif;
  text-align: center;
  
}

#loader-wrapper span{
 color: #ffffff;   
    
}
#loader-wrapper  h2 {
  color: #fae472;
  font-size: 1.777em;
  line-height: 1.2;
    text-transform: uppercase;
  font-family: 'Montserrat', sans-serif;
  text-align: center;
}