@import url(https://fonts.googleapis.com/css?family=Lato);

/*------------------------------------------------------------------
                        BOOTSTRAP STYLES
-------------------------------------------------------------------*/
.nav > li > a:hover, .nav > li > a:focus{
  background-color:#B5C3D5;
  outline:none;
  border-radius: 25px;
}



.navbar{
  margin-bottom:0;
  background-color: #B5C3D5;
  border-radius: 25px;
}
.bold{
  
  font-style: italic;
}


.btn-primary{
  font-size: x-large;
  color: whitesmoke;
  border-radius: 25px;
  background-color: #B5C3D5;
  
}

.btn-tool{
  font-size: xx-large;
  color: whitesmoke;
  border-radius: 25px;
  background-color: orangered;
  margin-left: 40%;
  
}

.list{
  font-size: 24px;
  
}
  .live2{
    display: inline-block;
    background-color: orangered;
    border-radius: 25px;
    padding: 2px;
    padding-left: 7px;
    padding-right: 8px;
   } 
    
   .live{
    display: inline-block;
    border-radius: 25px;
    background-color: #B5C3D5;
    padding: 2px;
    padding-left: 5px;
    padding-right: 6px;
   }
  
  

.list2{
  font-size: larger;
  display: inline-block;
  
}


.list4{
  font-size: x-large;
  display: inline-block;
  
}

.list5{
  font-size: xx-large;
  display: inline-block;
  font-style: italic;
}


.navbar button{
  background:#B5C3D5;
  background-color: #B5C3D5;
  
}

.navbar header{
  
  
}

.navbar span{
  background:#ededed;
  
}

.navbar a{
  text-align:center;
  background-color: #B5C3D5;
  border-radius: 25px;
  
}

#mynav{
  font-size: xx-large;
  margin-top: -80px;
  position: relative;
  font-style: italic;
  border-radius: 25px;
  
  
}

.about-wrap p{
  font-size: 24px;
  
}

.about-wrap h4{
  font-size: 20px;
  
}

/*------------------------------------------------------------------
                        DEFAULT STYLES
-------------------------------------------------------------------*/
body{
  font-family: 'Lato', sans-serif;
  background:white;
  overflow-x: hidden;
  width: 100%;
  
}

section{
  margin:100px 0;
  background-color: white;
}

hr{
  margin:10px 0;
  background-color: white;
}

h3,h4{
  text-align:center;
  font-weight:bold;
  background-color: white;
}

section h2{
  text-align:left;
  position:relative;
  margin-bottom:40px;
  background-color: white;
}

section h2:after{
	margin-top:20px;
  display:inline-block;
  content:'';
  width:45px;
  height:10px;
  border-top:5px solid #B5C3D5;
  position:absolute;
  bottom:-10px;
  left:0;
  background-color: white;
}

a, a:hover{
  color:black;
}

a:hover{
   -webkit-transition:background-color,color .3s ease-in-out;
   transition:background-color,color .3s ease-in-out;
}

/*------------------------------------------------------------------
                        HEADER STYLES
-------------------------------------------------------------------*/
header{
  background-color: white;
  
}

.banner{
  background:#B5C3D5;
  height:280px;
}

.banner>h2, 
.banner .info{
  height:50px;
  line-height:50px;
  position:relative;
  top:85px;
  margin:0 auto;
  margin-top: -25px;
  text-align:center;
  width:50%;
}

.banner>h2{
  font-size:3em;
  color:#25271E;
  margin-top: -25px;
}

.banner>h1{
  font-size:4em;
  color:#25271E;
  margin-top: -5px;
}


.banner .info{
  display:none;
}

.banner a{
  height:150px;
  width:200px;
  font-size:2.3em;
  display:inline-block;
  width:48%;
  text-decoration:none;
  border:2px solid rgba(0,0,0,.3);
  margin-right:-4px;
  -webkit-transition:all .3s ease-in-out;
  transition:all .3s ease-in-out;
}

.banner a:last-child{
 	margin-left:2%;
}

.banner a:hover{
  background:orangered;
}

.ninja-face{
  
  background-color: white;
  box-sizing: border-box;
}

.ninja-face img{
    width: 100%;
   
}

.gif-logo{
  
  width: 100%;
  margin-top: -210px;
  position: relative;
  
  
}
.gif-logo img{
  
  
}


.sait-logo{
   
}

.new{
  
  
  
}


.saica{
  

}

.tax-ninja{
  margin-top:60px;
  padding-left:25px;
}


.container{
  background-color: white;
}

.about-wrap{
  margin-top: -101px;
  background-color: white;
  width:100%;
}

/*------------------------------------------------------------------
                        SECTION.CLIENTS STYLES
-------------------------------------------------------------------*/


.clients .clients-info{
  padding:7px;
  box-shadow:1px 1px 3px gray, -1px -1px 3px gray;
  margin-bottom:20px;
  
  height:0;
  line-height:0;
  opacity:0;
  margin:15px auto 10px;
  background-color: white;
}

.clients .method{
  background-color: #B5C3D5;
  text-align:center;
  padding:10px;
  margin-bottom:30px;
  border-radius:5px;
  opacity:0;
}

.clients .clients-info h3{
  margin:0;
  line-height:180px;
  background-color: white;
}

.client-wrap{
  margin-top: -201px;
  background-color: white;
}

.clients .method h4{
  color:white;
  width:60px;
  height:60px;
  font-size:2em;
  font-weight:bold;
  border-radius:50%;
  line-height:60px;
  margin:0 auto;
  position:relative;
  top:30px;
}

/*------------------------------------------------------------------
                        SECTION.PROCESS STYLES
-------------------------------------------------------------------*/
.process {
  margin-top: -40px;
}

.process .method{
  background-color: #B5C3D5;
  text-align:center;
  padding:10px;
  margin-bottom:30px;
  border-radius:5px;
  opacity:0;
}

.process2 .method{
  background-color: #B5C3D5;
  text-align:center;
  padding:10px;
  margin-bottom:30px;
  border-radius:5px;
  opacity:0;
}

.process .method h3{
  font-style:italic;
  
}


.process2 .method h3{
  font-style:italic;
  
}

.process .method p{
  margin:0;
  
}

.process2 .method p{
  margin:0;
  
}

.process .method h4{
  color:white;
  width:60px;
  height:60px;
  font-size:2em;
  font-weight:bold;
  border-radius:50%;
  line-height:60px;
  margin:0 auto;
  position:relative;
  top:30px;
}


/*------------------------------------------------------------------
                        SECTION.BLOGS STYLES
-------------------------------------------------------------------*/
.blogs{
  margin-bottom:0;
  background-color: yellow;
  }

.blogs p{
  position: relative;
  opacity: 0;
  left:-750px;
  background-color: white;
}

.blogs button{
	position:relative;
  bottom:-50px;
  opacity:0;
  margin-bottom:20px;
  color: white;
  background-color: #fa3380;
}

.col-lg-4{
  position: relative;
  background-color: white;
}

.blogs img{
	position:absolute;
  
	margin-top:10px;
  opacity:0;
  background-color: white;


}

.blogs h2{
  font-size: 3em;
  background-color: white;

}


.firstAnimation {
  opacity: 1;
  height: 180px;
  width: 250px;
  background-color: white;
}

.testimonialsA {
  margin-top: -87px;

}


.testimonials {
  margin-top: -30px;
  
  
}
.testimonialsT {
  margin-top: -30px;
  background-color: #B5C3D5;
}

/*------------------------------------------------------------------
                        FOOTER STYLES
-------------------------------------------------------------------*/
footer{
  text-align:center;
  height:52px;
  background-color: white;
  line-height:52px;
}



/*------------------------------------------------------------------
                        MEDIA QUERIES STYLES
-------------------------------------------------------------------*/
@media only screen and (max-width: 2050px) and (min-width:1001px){
  .gif-logo{
    margin-top: -180px;
        
    }

@media only screen and (max-width: 1000px) and (min-width:600px){
  .banner>h2, .banner .info{
    
    
    
  } 
  .banner>h2{
    
  }

  .gif-logo{
    margin-top: -270px;
        
    }
}

@media only screen and (max-width: 599px) and (min-width:350px){	
  
  .gif-logo{
    margin-top: -360px;
        
    }
  
  
  
  .banner a{
    font-size:1em;
    background-color: white;
  }  
  .banner>h2, .banner .info{
    width:80%;
    margin-top: -25px;
    white-space: nowrap;
    overflow: hidden;
    
  }  
  .banner>h2{
    font-size:3em;
    margin-top: -25px;
    white-space: nowrap;
    overflow: hidden;
    
  }
  #mynav{
    font-size: xx-large;
    margin-top: -80px;
    position: relative;
  
  }
  .tax-ninja{
    margin-top:70px;
  }
}

@media only screen and (max-width: 349px){
	.banner .info{
    height:auto;
    background-color: white;
  }
  .banner a{
    font-size:1em;
    width:50%;
    display:block;
    background-color: white;
  }
  .banner a:first-child{
    margin:0 auto;
    background-color: white;
  }  
  .banner a:last-child{
    margin:10px auto 0;
    background-color: white;
  } 
	.banner>h2, .banner .info{
    width:80%;
    margin-top: -25px;
    white-space: nowrap;
    overflow: hidden;
    
  }	
  .banner>h2{
    font-size:3em;
    margin-top: -25px;
    white-space: nowrap;
    overflow: hidden;
    
  }
  #mynav{
    font-size: xx-large;
    margin-top: 0px;
  }
  .tax-ninja{
    margin-top:170px;
  }
}

@media only screen and (max-width: 768px) and (min-width:550px){		
  .process .row:first-child .col-xs-12,
  .process2 .row:first-child .col-xs-12{
      width:100%;
      background-color: white;
 	} 	
  .process .col-xs-12,
  .process2 .col-xs-12{
      width:50%;
      background-color: white;
  }
  
  #mynav{
    font-size: xx-large;
    margin-top: 0px;
  }

  .gif-logo{
  margin-top: -350px;
      
  }

  .navbar a{
    height: 90px;
    font-size: xx-large;
    
  }
  .tax-ninja{
    margin-top:70px;
  }

  

}