.button3 {
    width: 200px;
    margin: 0px auto;
}

.button3 a {
    display: block;
    height: 50px;
    width: 200px;
    /*TYPE*/
    color: white;
    font: 17px/50px Helvetica, Verdana, sans-serif;
    text-decoration: none;
    text-align: center;
   /* text-transform: uppercase;
    /*GRADIENT*/
    
}

.shadow3{
-webkit-box-shadow: -3px -3px 10px #9E9E9E;
-moz-box-shadow: -3px -3px 10px #9E9E9E;
box-shadow: -3px -3px 10px #9E9E9E;
}
.shadow4{
background:#e7e1aa;
/*The first shadow should be the colour of the box's background, the second shadow is the shadow you see. The spread value (the 4th value) of the first shadow should be the same size as the blur (the 3rd value) in the second shadow*/
-webkit-box-shadow: 0 0 0 6px #e7e1aa, 0 10px 6px #424242;
-moz-box-shadow: 0 0 0 6px #e7e1aa, 0 10px 6px #424242;
box-shadow: 0 0 0 6px #e7e1aa, 0 10px 6px #424242;
/*To place the shadow on a different side...
top only = box-shadow: 0 0 0 6px #e7e1aa, 0 -10px 6px #424242;
left only = box-shadow: 0 0 0 6px #e7e1aa, -10px 0 6px #424242;
right only = box-shadow: 0 0 0 6px #e7e1aa, 10px 0 6px #424242;*/
}
.shadow1{
-webkit-box-shadow: 0 0 10px rgba(0,0,0, .65);
-moz-box-shadow: 0 0 10px rgba(0,0,0, .65);
box-shadow: 0 0 10px rgba(0,0,0, .65);
}
.zoom_img img{


-moz-transition:-moz-transform 0.5s ease-in; 
-webkit-transition:-webkit-transform 0.5s ease-in; 
-o-transition:-o-transform 0.5s ease-in;
}
.zoom_img img:hover{
-moz-transform:scale(1.5); 
-webkit-transform:scale(1.5);
-o-transform:scale(1.5);
}
@import url(http://fonts.googleapis.com/css?family=Roboto+Condensed:400,700);
/* written by riliwan balogun http://www.facebook.com/riliwan.rabo*/
.board{
    width: 80%;
margin: 60px auto;
height: auto;
background: #fff;
/*box-shadow: 10px 10px #ccc,-10px 20px #ddd;*/
}
.board .nav-tabs123 {
    position: relative;
    /* border-bottom: 0; */
    /* width: 80%; */
    margin: 40px auto;
    margin-bottom: 0;
    box-sizing: border-box;

}

.board > div.board-inner{
    background: #fafafa url(http://subtlepatterns2015.subtlepatterns.netdna-cdn.com/patterns/geometry2.png);
    background-size: 30%;
}

p.narrow{
    width: 60%;
    margin: 10px auto;
}

.liner{
    height: 2px;
    background: #ddd;
    position: absolute;
    width: 80%;
    margin: 0 auto;
    left: 0;
    right: 0;
    top: 50%;
    z-index: 1;
}

.nav-tabs123 > li.active > a, .nav-tabs123 > li.active > a:hover, .nav-tabs123 > li.active > a:focus {
    color: #555555;
    cursor: default;
    /* background-color: #ffffff; */
    border: 0;
    border-bottom-color: transparent;
}

span.round-tabs{
    width: 200px;
    height: 200px;
    line-height: 70px;
    display: inline-block;
    border-radius: 100px;
    background: white;
    z-index: 2;
    position: absolute;
    left: 0;
    text-align: center;
    font-size: 25px;
}

span.round-tabs.one{
    color: rgb(34, 194, 34);border: 2px solid rgb(34, 194, 34);
}

li.active span.round-tabs.one{
    background: #fff !important;
    border: 2px solid #ddd;
    color: rgb(34, 194, 34);
}

span.round-tabs.two{
    color: #febe29;border: 2px solid #febe29;
}

li.active span.round-tabs.two{
    background: #fff !important;
    border: 2px solid #ddd;
    color: #febe29;
}

span.round-tabs.three{
    color: #3e5e9a;border: 2px solid #3e5e9a;
}

li.active span.round-tabs.three{
    background: #fff !important;
    border: 2px solid #ddd;
    color: #3e5e9a;
}

span.round-tabs.four{
    color: #f1685e;border: 2px solid #f1685e;
}

li.active span.round-tabs.four{
    background: #fff !important;
    border: 2px solid #ddd;
    color: #f1685e;
}

span.round-tabs.five{
    color: #B94BCA;border: 2px solid #B94BCA;
}

li.active span.round-tabs.five{
    background: #fff !important;
    border: 2px solid #ddd;
    color: #B94BCA;
}

span.round-tabs.six{
    color: #4DCDB7;border: 2px solid #4DCDB7;
}

li.active span.round-tabs.six{
    background: #fff !important;
    border: 2px solid #ddd;
    color: #4DCDB7;
}


span.round-tabs.seven{
    color: #1AA4FC;border: 2px solid #1AA4FC;
}

li.active span.round-tabs.seven{
    background: #fff !important;
    border: 2px solid #ddd;
    color: #1AA4FC;
}

.nav-tabs123 > li.active > a span.round-tabs{
    background: #fafafa;
}
.nav-tabs123 > li {
    width: 25%;
}
/*li.active:before {
    content: " ";
    position: absolute;
    left: 45%;
    opacity:0;
    margin: 0 auto;
    bottom: -2px;
    border: 10px solid transparent;
    border-bottom-color: #fff;
    z-index: 1;
    transition:0.2s ease-in-out;
}*/
li:after {
    content: " ";
    position: absolute;
    left: 45%;
   opacity:0;
    margin: 0 auto;
    bottom: 0px;
    border: 5px solid transparent;
    border-bottom-color: #ddd;
    transition:0.1s ease-in-out;
    
}
/*li.active:after {
    content: " ";
    position: absolute;
    left: 45%;
   opacity:1;
    margin: 0 auto;
    bottom: 0px;
    border: 10px solid transparent;
    border-bottom-color: #ddd;
    
}*/
.nav-tabs123 > li a{
   width: 50px;
   height: 50px;
   margin: 20px auto;
   border-radius: 100%;
   padding: 0;
}

.nav-tabs123 > li a:hover{
    background: transparent;
}

.tab-content{
}
.tab-pane{
   position: relative;
    padding-top: 0px;
    padding-bottom: 0px;
}
.tab-content .head{
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 25px;
    text-transform: uppercase;
    padding-bottom: 10px;
}
.btn-outline-rounded{
    padding: 10px 40px;
    margin: 20px 0;
    border: 2px solid transparent;
    border-radius: 25px;
}

.btn.green{
    background-color:#5cb85c;
    /*border: 2px solid #5cb85c;*/
    color: #ffffff;
}



@media( max-width : 585px ){
    
    .board {
width: 90%;
height:auto !important;
}
    span.round-tabs {
        font-size:16px;
width: 50px;
height: 50px;
line-height: 50px;
    }
    .tab-content .head{
        font-size:20px;
        }
    .nav-tabs123 > li a {
width: 50px;
height: 50px;
line-height:50px;
}

li.active:after {
content: " ";
position: absolute;
left: 35%;
}

.btn-outline-rounded {
    padding:12px 20px;
    }
}
body.modal-open-noscroll 
{
  margin-right: 0!important;
  overflow: hidden;
}
.modal-open-noscroll .navbar-default, .modal-open .navbar-default 
{
  margin-right: 0!important;
}

body.modal-open {
    overflow: visible;
}

div.menuBar li.selected a { color: #FF0000; } 
.bw {
  -webkit-transition: all 1s ease;
     -moz-transition: all 1s ease;
       -o-transition: all 1s ease;
      -ms-transition: all 1s ease;
          transition: all 1s ease;
}

.bw:hover {
  -webkit-filter: grayscale(70%);
}

.one-edge-shadow {
	border:2px solid #fff;
        -moz-box-shadow: 10px 10px 5px #ccc;
        -webkit-box-shadow: 10px 10px 5px #ccc;
        box-shadow: 10px 10px 5px #ccc; -moz-border-radius:25px; 
        -webkit-border-radius:25px; border-radius:25px;
       
}

.effect3reduce
{
  position: relative;
}
.effect3reduce:before
{
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 15px;
  left: 10px;
  width: 50%;
  top: 80%;
  max-width:300px;
  background: #777;
  box-shadow: 0 15px 10px red;
  transform: rotate(-3deg);
}

/*@import "compass/css3";

@include keyframes(bounce) {
	0%, 20%, 50%, 80%, 100% {
    @include transform(translateY(0));
  }
	40% {
    @include transform(translateY(-30px));
  }
	60% {
    @include transform(translateY(-15px));
  }
}*/




.arrow {
  position: fixed;
  bottom: 0;
  right: 10px;
  margin-left:-20px;
  width: 32px;
  height: 32px;
  background-image: url(../img/downarrow.png);
  background-size: contain;
}
/*
.bounce {
  @include animation(bounce 2s infinite);
}*/