@font-face {
font-family: WolfsRain;
src:url(../fonts/WolfsRain.ttf);
}

h1, h2, h3, h4 {
	font-family: 'Special Elite';
}

/*heya */

#andy-grading {
  margin-left: auto;
  margin-right: auto;
}

h2 {
  text-align:center;
}

h4 {
  text-align:center;
}

.subheading {
  display: block;
  float:right
}

.container h2 {
	font-family: 'Special Elite';
	margin: auto, 0;
}


.navbar-inner {
	text-align: center;
}

.center-block {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

div.btn.btn-warning.btn-lg {
	position: relative;
	left: 90%;
	bottom: 66px;
	background-color: #b7383c;
	border-color: #262022;
	font-size: 14px;
	font-style: bold;
}

div.btn.btn-warning.btn-lg a {
	color: white;
	text-decoration: none;

}

div.btn.btn-warning.btn-lg:hover {
	background-color: #333;
}
.main-img {
	background:url("img/karate.JPG") no-repeat;
	height: 450px;
	display: block;
    margin-left: auto;
    margin-right: auto;
}

footer {
	background-color: #262022;
	width: 100%;
	color:#4E4D4A;
	overflow: hidden;
	padding-top: 40px;
}


nav {
background-color: #262022;
padding-top: 20px;
padding-bottom: 20px;
font-size: 25px;
position: relative;
bottom: 65px;
border-radius: 5px;

}

.navbar {
	background-color: #262022;

}

.logo {
	width: 130px;
	height: 130px;
	border-radius: 65px;
	box-shadow: 0 0 8px rgba(0, 0, 0, .8);
	position: relative;
	top: 80px;
}

.skif {
  display: inline-block;
  float: right;
}

.container h1 {
	position: relative;
	bottom: 3px;
	left: 20%;
	font-family: 'Special Elite';
	font-size: 65px;
	color: black;
  padding-bottom: 45px;

}

.gallery-cont {
padding-bottom:11px;
}

.title {
	background-color: #262022;
}

.title-box {
  overflow: hidden;
}

nav.nav-tabs.nav-justified.navbar-fixed {
	border-radius: 0;
	color: #F9B931;
	padding: 10px 15px;

} 

nav a {
	color: #F9B931;
	border-radius: 5px;
}

nav a:hover {
	color: white;
}


.navbar-inverse .navbar-brand {
	color: #F9B931;
}

.nav li a {
	font-family: 'Cabin';
	font-size: 18px;
}

.nav li a:hover{
	background-color: #b7383c;
	
}

.container .title-box {
background-image:url('img/paper-texture.jpg');
overflow: hidden;

}

.nav-tabs > li > a {
	border:none;
	border-radius: 5px;

	}


.nav-tabs.nav-justified li a {
	border-bottom: none;
	border-radius:0;

}

.nav-tabs li a {
border-radius: none;

}


.lg-glyph {
	font-size: 3em;
	display: block;
	text-align: center;
}


.footer-glyph {
	font-size: 1em;
	color: #EC9320;
}


.belt {
	width: 200px;
	margin-left: 20px;
}

.belt-nav {

}

.zero-gradient {
  height:500px;
  background: -webkit-linear-gradient(#FFFFCC, white); 
  background: -o-linear-gradient(#FFFFCC, white);
  background: -moz-linear-gradient(#FFFFCC, white);
  background: linear-gradient(#FFFFCC, white);

}

.first-gradient {
  height:500px;
  background: -webkit-linear-gradient(white, lightyellow); 
  background: -o-linear-gradient(white, lightyellow);
  background: -moz-linear-gradient(white, lightyellow);
  background: linear-gradient(white, lightyellow);
}
.second-gradient {
  height:500px;
  background: -webkit-linear-gradient(lightyellow, #fbc97f);
  background: -o-linear-gradient(lightyellow, #fbc97f);
  background: -moz-linear-gradient(lightyellow, #fbc97f);
  background: linear-gradient(lightyellow, #fbc97f);
}
.third-gradient {
  height:500px;
  background: -webkit-linear-gradient(#fbc97f, lightgreen); 
  background: -o-linear-gradient(#fbc97f, lightgreen);
  background: -moz-linear-gradient(#fbc97f, lightgreen);
  background: linear-gradient(#fbc97f, lightgreen); 
}

.fourth-gradient {
  height:500px;
  background: -webkit-linear-gradient(lightgreen, lightblue); 
  background: -o-linear-gradient(lightgreen, lightblue);
  background: -moz-linear-gradient(lightgreen, lightblue);
  background: linear-gradient(lightgreen, lightblue);
}

.fifth-gradient {
  height:500px;
  background: -webkit-linear-gradient(lightblue, purple);
  background: -o-linear-gradient(lightblue, purple);
  background: -moz-linear-gradient(lightblue, purple);
  background: linear-gradient(lightblue, purple);
}

.six-gradient {
	height:500px;
  background: -webkit-linear-gradient(purple, brown);
  background: -o-linear-gradient(purple, brown);
  background: -moz-linear-gradient(purple, brown);
  background: linear-gradient(purple, brown);
}

.seventh-gradient {
height:500px;
  background: -webkit-linear-gradient(brown,black);
  background: -o-linear-gradient(brown, black);
  background: -moz-linear-gradient(brown, black);
  background: linear-gradient(brown, black); 
}


.eighth-gradient {
height:300px;
  background: -webkit-linear-gradient(black, white);
  background: -o-linear-gradient(black, white);
  background: -moz-linear-gradient(black, white);
  background: linear-gradient(black, white);
}

.article {
	height:500px;
	width: 750px;
	background-color: #333;
	margin-top: 100px;
	margin-left: auto;
	color: white;
}


.article-classes {
  width: 750px;
  height: 750px;
  background-color: #333;
  margin-top: 20px;
  margin-left: auto;
  color: white;
  margin-bottom: 50px;
  border-radius: 5px;
  padding-bottom: 25px;
}

.article-classes-news {
  width: 750px;
  background-color: #333;
  margin-top: 20px;
  margin-left: auto;
  color: white;
  margin-bottom: 50px;
  border-radius: 5px;
  padding-bottom: 25px;
}

.article-grad {
  height:500px;
  width: 750px;
  background-color: #333;
  margin-top: 20px;
  margin-left: auto;
  color: white;
  margin-bottom: 50px;
  border-radius: 5px;
}

#main {
  height:425px;
  }

.main1 {
  margin-left: auto;
  margin-right: auto;
}

#green-belt{
height:675px;
}

#blue-belt{
height:615px;
}

#purple-belt{
height:615px;
}

#brown1-belt {
  height:675px;
}

#brown2-belt {
  height:615px;
}

#brown3-belt {
  height:615px;
}

.article p {
	padding: 75px;
}

.article-classes h2 {
	text-align:center;
	padding-bottom: 10px;
	font-family: 'Special Elite';
}

.article-classes h3 {
	font-family: 'Special Elite';
}


body { 
margin:0px; 
background-color: #FFFFCC;
padding:0px;

}

.body-copy:hover {
	border-color:#333;
	border-width:2px;


}


*, *:after, *:before {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

header{
  z-index: 1;
  position:fixed; 
  width:100%; 
  height:60px; 
  background:rgba(0,0,0,0.1);
}

header a{
  color:white;
  background:rgba(0,0,0,0.1); 
  display:inline-block; 
  padding:0px 30px; 
  height:60px;
  line-height:60px; 
  text-align:center;
  font-family: 'Special Elite', serif; 
  text-decoration:none;
  text-transform:uppercase; 
  letter-spacing:2px; 
  font-weight:700;
}
#hero1{
 background:url(http://farm5.staticflickr.com/4080/4799984545_490d7a867f_o.jpg);
  background-size:cover;
  background-position:center center;
  background-attachment:fixed;
}
#hero2{background: url(http://upload.wikimedia.org/wikipedia/commons/4/4b/Karate_ShuriCastle.jpg);
  background-size:cover;
  background-position:center center;
  background-attachment:fixed;
}
.hero, .content{
  text-align:center; 
  position:relative;
  width: 100%;
}

.inner{
   position: relative;
}

.hero .inner{
  background: rgba(0,0,0,0.7) url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAACCAYAAACddGYaAAAAD0lEQVQIW2NkQABjRmQOAAM+AGkQsDBSAAAAAElFTkSuQmCC) repeat;}



.hero h1, .hero p, .hero h2{ 
  color:#fff;
  font-family: 'Special Elite';
}

.hero p {
	font-size: 30px;
	font-weight: bold;
}

.hero h2 {
	font-size: 30px;
}

.content h1, .content p{
  color:#333;
}
.home-copy {
	margin: 75px 0;
}
h1{
  margin:0px;
  font-family: 'Special Elite';
  font-weight:400;
  font-size:32px;
  padding:0px 20px;
}

p{
  font-family: 'Noto Sans', sans-serif; 
  font-size:14px;
  padding:0px 20px;
}

.google-maps {
        position: relative;
        padding-bottom: 50%; // This is the aspect ratio
        height: 0;
        overflow: hidden;
    }

.google-maps iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100% !important;
        height: 500px;
        overflow: hidden;
    }

   .div-belt {
   	height: 600px;
   	width:100px;
   	background-color: black;
   	position: relative;
	left: 295px;
	top: 52px;

   }

   #white-belt {
   border-left-style: solid;
    border-left-color: white;
    border-width: 15px;
   }

   #yellow-belt {
   	border-left-style: solid;
    border-left-color: yellow;
    border-width: 15px;
   }

    #orange-belt {
   	border-left-style: solid;
    border-left-color: orange;
    border-width: 15px;
   }

   #green-belt {
   	border-left-style: solid;
    border-left-color: green;
    border-width: 15px;
   }

   #blue-belt {
   	border-left-style: solid;
    border-left-color: blue;
    border-width: 15px;
   }

    #purple-belt {
   	border-left-style: solid;
    border-left-color: purple;
    border-width: 15px;
   }

    #brown1-belt {
    border-left-style: solid;
    border-left-color: brown;
    border-width: 15px;
   }

    #brown2-belt {
   border-left-style: solid;
    border-left-color: brown;
    border-width: 15px;
   }

 	#brown3-belt {
   	border-left-style: solid;
    border-left-color: brown;
    border-width: 15px;
   }

    #black-belt {
   	border-left-style: solid;
    border-left-color: black;
    border-width: 15px;
   }

   .classes-div {
   		height: 600px;
   		width:100px;
   		background-color: black;
   		position: relative;
		left: 295px;
		top: 52px;
   }

   .gallery-img ul {         
          padding:0 0 0 0;
          margin:0 0 0 0;
      }

     .gallery-img ul li {     
          list-style:none;
          margin-bottom:25px;      
      }
    
    .gallery-img ul  ul li img {
          cursor: pointer;
      }
   .gallery-img img {
   	width: 100%;
   	height: auto;

   }


   .sensei-img {
   	padding:20px;
   }

   .sensei {
   	padding-top:60px;
   }