a,
button a,
.price p,
.section5  p ,.section5 span,
.pricing-area ul li,
.section5 ul li,
.section4  p,
.cap1,
.cap2,
.cap3,
.cap4,
.section6  p ,.section6 span,
.section6 ul li
{
   font-family: 'Mirza', cursive;
   
   

}
button a{
    font-family: normal;
}
.pricing-area h2,
.price .circle,
.pricing-area ul li h2,
.section5 h1,
.section6 h1,
.social .social-mod h3,
.social .social-mod h3
{
     font-family: 'Mirza', cursive;
    
}
.carousel-caption h2,
.carousel-caption .text1{
    font-family: 'Roboto', sans-serif;

}

a{
    text-decoration: none;
  
    
    
}
a:hover{
    text-decoration: none;
    color:white;
}
button a{
  
    color:white;
}
*{
    margin: 0;
    padding: 0
        
}
body{
    overflow-x: hidden;
     
    align-items: center;
    justify-content: center;
    background-color: transparent;
    direction: rtl;
   
   
}
/*start navbar */
.navbar-inverse {
    background-color: #2187b7;
    border-color: #2187b7;
    color:white;
    
    
}

.navbar-inverse img{
    margin-top: -20px;
}
.navbar-inverse .navbar-nav>li>a{
    color:white;
    
}
.navbar-inverse .navbar-nav>.active>a,
.navbar-inverse .navbar-nav>.active>a:focus, 
.navbar-inverse .navbar-nav>.active>a:hover
{
    background-color: #0d5056;
}
 header .container-fluid {
     padding-right: 0; 
     padding-left: 0; 
    margin-top: -20px;
   
    
    
}
/*end navbar*/
/*start carousel */
header .carousel-caption{
    bottom:200px;
  
 background-color: rgba(29, 30, 30 ,.1);
  border-radius: 20%;
    line-height: 50px;
    
    
}

.carousel-control.right {
    
     background-image:none;
   
}

.carousel-control.left {
    
     background-image:none;
   
}
.carousel-caption h2{
    font-size:70px;


     color:#2187b7;
    
   
}
.carousel-caption .btn-primary{
    height: 60px;
    width:200px;
    font-size: 30px;
    box-shadow: 2px 2px 4px 4px rgba(29, 30, 30 ,.1) ;
}
.carousel-caption .btn-primary a{
    color:white;
    text-decoration: none;
}
.carousel-caption .btn-primary:hover{
    background-color: blue;
}
.carousel-caption .text1 {
   font-size:60px;
    
     color:white;
    margin: auto;
   text-align: center;
    white-space: nowrap;
     overflow: hidden;
 
    animation: type 5s steps(60, end);

    
}
.carousel-caption .text3{
    color:white;
}

@keyframes type{ 
  from { width: 0; } 
    to{ width:100%;
        text-align: center;
    
    
    
    }
} 

.carousel-caption .text2{
    font-size: 25px;
     white-space: nowrap;
     overflow: hidden;
    margin: auto;
  
    animation: type2 8s steps(80, end);
    
}
.carousel-caption p{
    font-size: 25px;
     
    
}
@keyframes type2{
    0%{
        width:0;
    }
      
    50%{
        width:0;
    }
    
    100%{
        width:100%;
         text-align: center;
    }
}

.carousel-caption .btn-primary{
    background-color: #2187b7;
    border-color: #2187b7;
    
    
}


header a span {
    background-color: rgba(247, 250, 252,0.1 );
   
    
    border-radius: 50%;
    border:.25px solid white;
   
}

header a span:hover{
    background-color: #2187b7;
}

.carousel-indicators .active{
    
    background-color: #2187b7;
}
/*end carousel */
/*start our main services*/

.price .circle {
    height: 80px;
    width: 250px;
    border-radius: 50%;
  


    margin:auto;
    padding-top:20px;
    text-align: center;
   color:white;
    text-shadow: 2px 2px #9da0a0;
     background: linear-gradient(#0BA9F9, rgba(77, 197, 204 ,.5), #0BA9F9);
    box-shadow: 2px 2px 4px 4px white;
    
   
}
.price .circle h2{
    margin-top: 10px;
     
}
.plan{
    border-radius: 50%;
}
.price .circle:hover{
        background: linear-gradient(#2187b7 , #17d1c8, #118a91);

    cursor: pointer;
  
}
.price p{
    margin-top:20px;
    font-size: 20px;


    

}

#pricing {
	padding-top:90px;
	background-color:white;;
	padding-bottom:40px;
   
}
#pricing{
    margin-left: 0;
    margin-right: 0
}
#pricing .text-center p {		
	margin-bottom:50px;
	padding-bottom:20px;
}
/*start first section of our main services*/
.pricing-area{
    margin-bottom: 100px;
}

.pricing-area h2 {
  
  font-weight: 300;
  margin-top: 0;
  margin-bottom: 15px;
  font-size:30px;
  color:#fff;
    


}

.pricing-area span {
   font-weight: 700;
   font-size: 18px;
   color:#fff;
}

.plan {
  position: relative;
  margin-bottom: 70px;
}

.pricing-area ul {
  background:;
  padding: 0;
  margin: 0;
}

.pricing-area ul li {
  list-style: none;
    
  padding: 15px 0;
  font-size: 20px;
  font-weight: 400;
    line-height: 20px;
    




}
.div1{
    background-color: white;
}
.div1 ul li:nth-child(even){
    border-radius:5px;
    background-color: rgba(221, 221, 217 ,.2);
}






.pricing-area .price-three img, 
.pricing-area .price-six img {
  position: absolute;
  right: 15px;
  top: 0;
}

.pricing-area .heading-one, 
.pricing-area .heading-two, 
.pricing-area .heading-three {
  padding:17px 0;
} 
.pricing-area .heading-one, 
.pricing-area .heading-two, 
.pricing-area .heading-three, 
.pricing-area .heading-four, 
.pricing-area .heading-five,
.pricing-area .heading-six,
.pricing-area .heading-seven,
.pricing-area .heading-eight,
.pricing-area .heading-nine,
.pricing-area .heading-ten
{
  margin-left: -10px;
  border-radius:10px;
}

.pricing-area .heading-one:hover, 
.pricing-area .heading-two:hover, 
.pricing-area .heading-three:hover, 
.pricing-area .heading-four:hover, 
.pricing-area .heading-five:hover, 
.pricing-area .heading-six:hover, 
.pricing-area .heading-seven:hover,

.pricing-area .heading-eight:hover,
.pricing-area .heading-nine:hover,
.pricing-area .heading-ten:hover

{
	background-color:#111;
	 -webkit-transition: color 300ms, background-color 300ms;
  -moz-transition: color 300ms, background-color 300ms;
  -o-transition:  color 300ms, background-color 300ms;
  transition:  color 300ms, background-color 300ms;
    cursor:pointer
}

.pricing-area .heading-one, 
 .pricing-area .price-one .plan-action .btn-primary {
  background:#0BA9F9;
     box-shadow: 2px 2px 4px 4px rgba(229, 232, 232 ,.3);
     border-color:white;
     font-size: 17px;
     
}

.pricing-area .heading-two, 
.pricing-area .price-two .plan-action .btn-primary {
  background:#0BA9F9;
       box-shadow: 2px 2px 4px 4px rgba(229, 232, 232 ,.3);
     border-color:white;
     font-size: 17px;
   
}

.pricing-area .heading-three,
.pricing-area .price-three .plan-action .btn-primary {
  background: #0BA9F9;
       box-shadow: 2px 2px 4px 4px rgba(229, 232, 232 ,.3);
     border-color:white;
     font-size: 17px;
}

.pricing-area .heading-four, 
.pricing-area .price-four .plan-action .btn-primary {
  background: #0BA9F9;
     box-shadow: 2px 2px 4px 4px rgba(229, 232, 232 ,.3);
     border-color:white;
     font-size: 17px;
    
}
.pricing-area .price-four .plan-action .btn-primary{
   
}

.pricing-area .price-one .plan-action .btn-primary{
  
}

.pricing-area .price-three .plan-action .btn-primary{
    
}
.pricing-area .price-two .plan-action .btn-primary
{
   
}

.pricing-area .bg{
 background: #0BA9F9;
    
}
/*end first section of our main services*/
/*start second section of our main services*/

.section5{
    margin-top: 30px;
    padding-top: 40px;
    background-color: rgba(227, 228, 229,0.5) ;
      padding-bottom: 40px;
}

.section5  p ,.section5 span{
    color:gray;
  
    
   
    
}
.section5 h1{
   
    color:blue;
    margin-top: 2px;


}
.section5 ul{
    border-bottom:1px dashed  gray;
    
        
}
.section5 .btn-primary{
    box-shadow: 2px 2px 2px 2px gray;
    margin-top: 10px;
        
}
.section5 ul li{
     font-size: 20px;
    line-height: 15px;
     
   

}
.section5 .news-mod{
    background-color: rgba(234, 235, 237,.4);
    padding-top: 10px;
    padding-bottom: 20px;
   
    height:520px;
    margin-left: -5px;
    
    margin-left: 15px;
    border-radius: 10px;
    box-shadow: 2px 2px 4px 2px  gray;
     
    
    transition: all 1s ease
        
   
   
}
.section5 .news-mod:hover{
    transform: translate3d(10px,10px,10px )
    
}

.section5 .news-mod img{
    border-radius: 20%;
    margin-top: 30px;
     box-shadow: 4px 4px 4px 4px  gray;
    
}

.section5 .btn-primary{
    box-shadow: 4px 4px white;
    font-size: 16px;
    
}

/*end second section of our main services*/


.second-section .carousel-indicators{
    position: relative;
    
    
    margin-top: 50px;
}
.carousel-indicators li{
    border-color:gray;
    
}


/*start fourth section of our main services*/

.section4{
    margin-top: 60px;
    padding-bottom: 150px;
    background-color:rgba(217, 218, 219,.5)
}
.section4 h2{
    color:#2187b7;
  
    
}
.section4 .div-mod{
    transition: all 1s ease;
    margin-top: 30px;
   
}
.section4 .div-mod :hover{
   border-radius: 40px;
border:.5 solid gray;
    
   
   
   
}
.section4  .title{
    padding-bottom: 50px;
}
.section4  h1{
  
       color:#118ab2; 
    border-radius: 50%;
    
    
     
     
}
.section4 .div-mod:hover{
        

}
.section4 .div-mod .pic{
     border-radius: 10px;
    position: absolute;
    margin-top: -30px;
  left:33%;
    background-color: rgba(15, 149, 173 ,.5);
    transform: rotate(40deg);
   width:150px;
    height: 150px;
   
  
}
.section4 .div-mod .fa{
   
    position: relative;
    border-radius: 10px;
    color:white;
       bottom:20px ;
  
    background-color:#0BA9F9 ;
    font-size: 30px;
  
    padding: 50px;
    transition: all .5s ease;
  
    border:2px solid white;
    box-shadow: 2px 2px  2px 2px gray;
   
    
   
    
}
.section4 img{
    border:4px solid white;
   width:150px;
    height:150px;
    display:none;
      box-shadow: 2px 2px  2px 2px gray;
    margin-top: -10px;
}


.section4  .btn-primary{
    box-shadow: 2px 2px 4px 4px white;
    
}

.section4  p{
    font-size: 18px;
   
}
.cap1,
.cap2,
.cap3,
.cap4{

    
    
}
/*end fourth section of our main services*/



/*start spinner */
.loader,
.loader:before,
.loader:after {
  background: #2187b7;
  -webkit-animation: load1 1s infinite ease-in-out;
  animation: load1 1s infinite ease-in-out;
  width: 1em;
  height: 4em;
}
.loader {
  color: #2187b7;
  text-indent: -9999em;
  margin: 88px auto;
  position: relative;
  font-size: 11px;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}
.load-bac{
    background-color: white;
   
    width:100%;
    height: 100%;
  position: fixed;
    z-index: 99999999;
  
    
  
   
    
}
.loader{
    top:30%;
}

.loader:before,
.loader:after {
  position: absolute;
  top: 0;
  content: '';
    
}
.loader:before {
  left: -1.5em;
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}
.loader:after {
  left: 1.5em;
}
@-webkit-keyframes load1 {
  0%,
  80%,
  100% {
    box-shadow: 0 0;
    height: 4em;
  }
  40% {
    box-shadow: 0 -2em;
    height: 5em;
  }
}
@keyframes load1 {
  0%,
  80%,
  100% {
    box-shadow: 0 0;
    height: 4em;
  }
  40% {
    box-shadow: 0 -2em;
    height: 5em;
  }
}
/*end spinner*/
/*start third secction */
.section6{
    margin-top: 100px;
    padding-top: 40px;
    background-color: rgba(33, 135, 183 ,0.8) ;
      padding-bottom: 20px;
    padding-right: 20px;
}

.section6  p ,.section6 span{
    color:gray;
    
    
   
    
}
.section6 h1{
    
    color:blue;
    margin-top: 5px;
    
}
.section6 ul{
    margin-top:10px;
    border-bottom:.5px solid  gray;
    border-top:.25px solid gray
    
        
}
.section6 .btn-primary {
    box-shadow: 2px 2px 2px 2px gray;
    margin-top: 10px;
   
        
}
.section6 .btn-primary a{
      font-family: 17px;
}
.section6 ul li{
     font-size: 18px;
    line-height: 10px;
    
}
.section6 .news-mod{
    background-color: white;
    padding-top: 20px;
    padding-bottom: 20px;
    line-height: 40px;
   
   
    border-radius: 10px;
    box-shadow: 2px 2px 2px 2px  gray;
    
    
    transition: all 1s ease
        
   
   
}
.section6 .news-mod:hover{
    transform: translate3d(10px,10px,10px )
    
}

.section6 .news-mod img{
  
    border-radius: 50%;
     box-shadow: 4px 4px 4px 4px  gray;
    transition: all .5s ease;
    
}
.section6 .news-mod img:hover{
    transform: rotate(180deg);
}
.section6 .foot-div{
    text-align: left;
    margin-left: 10px;
    
    
    
}
.section6 .foot-div img{
    border-radius: 50%;
}
.section6 .foot-div .text-right{
    margin-left:50px;
}

/*end third section*/


/*start social  media section */
.social {
  
 margin-top: -20px;
    background-size: cover;
    padding-bottom: 80px;
    
        
}
.social h1{
    color:rgb(33, 135, 183 );
    padding-bottom: 80px;
     
}
.social .social-mod h3{
    
    color:rgb(33, 135, 183 );
    
    
}
.social .social-mod img{
   
    border-radius: 20%;
    box-shadow: 2px 2px gray;
    border :1px solid rgb(33, 135, 183 )
}



.foot{
   
    
}
.foot p{
    
    
}
/*end social media section */
/*start wave*/
.wave{
      height: 420px;
    position: relative;
    background: white;
    margin-top: 100px;
    
}
.wave:before{
    content:"";
    position: absolute;
   top: 0;
    left: 0;
   width:100%;
    height: 100%;
    background: url(wave.PNG);
    background-size: 100%;
    background-repeat: no-repeat;
    
}
.foot{
   background-color:black;
    height: 300px;
}
.foot img{
    margin-top: 80px;
    margin: auto;
    text-align: center;
}
/*end wave*/