assets/css/gobblin.css

/********************************
* Body
*********************************/ 

/********************************
* Navigation Bar
*********************************/ 
.fa-external-link {
    font-size: 12px;
}
/********************************
* Primary container 
*********************************/ 
.primary-container-header h1 {
    margin-top: 0px;
}

.gobblin-logo-h1 {
    width: 1.8em;
    
}
/********************************
* News Items
*********************************/ 
.latest-news-panel {
    border: none;
    border-radius: 2px;
    -webkit-box-shadow: 0 1px 4px rgba(0,0,0,0.3);
    box-shadow: 0 1px 4px rgba(0,0,0,0.3);
}
.latest-news-header {
    font-size: 24px;
    margin-top: 10px;
    margin-bottom: 5px;
}
.latest-news-item {
    font-size: 15px;
    line-height: 18px;
    margin-bottom: 10px;
}
/********************************
* Animated Gobblin
*********************************/ 
#apache-gobblin-gobbling-container	{ 
	width: 100%; 
	height: 115px; 
	background-image: url('../images/stripe_work.png');
	background-position: 0px 0px;
	background-repeat: repeat-x;
	animation: animatedBackground 30s linear infinite;
}

.apache-gobblin-gobbling {
    margin: 0px 0px;
    background-color: #fff; 
    width: 60px; 
    padding-left: 0px; 
    margin-left: 0px;
}

.apache-gobblin-gobbling-upper {
  background-color: #cc6600; 
  background: linear-gradient(to right, #cc6600 , #cc6600, #cc9900);
  height: 55px;
  width: 110px;
  border-radius: 100px 100px 0px 0px;
  animation: mouthOpen 0.5s infinite linear;
  font-size: 40px;
  text-align: right;
}

.apache-gobblin-gobbling-lower {
  background-color: #cc6600;
  background: linear-gradient(to right, #cc6600 , #cc6600, #cc9900);
  height: 55px;
  width: 110px;
  border-radius: 0 0 100px 100px;
  animation: mouthClose 0.5s infinite linear;
}

@keyframes animatedBackground {
	from { background-position: 4500px 25px; }
	to   { background-position: 0 25px; }
}

@keyframes mouthOpen {
	0%  {transform: rotate(0deg);}
	50% {transform: rotate(-35deg);}
}

@keyframes mouthClose {
	0%  {transform: rotate(0deg);}
    50% {transform: rotate(35deg);}	
}

@-moz-keyframes mouthOpen {
	0%  {transform: rotate(0deg);}
	50%{transform: rotate(-35deg);}
  
}
@-moz-keyframes mouthClose {
	0%  {transform: rotate(0deg);}
    50% {transform: rotate(35deg);}	
}

@-webkit-keyframes mouthOpen {
	0%  {transform: rotate(0deg);}
	50% {transform: rotate(-35deg);}
  
}
@-webkit-keyframes mouthClose {
	0%  {transform: rotate(0deg);}
    50% {transform: rotate(35deg);}	
}

/********************************
* Animated Button
*********************************/ 
.btn-outline {
    background-color: transparent;
    color: inherit;
    transition: all .5s;
}

.btn-primary.btn-outline {
    color: #111;
}

.btn-primary.btn-outline:hover,
.btn-success.btn-outline:hover,
.btn-info.btn-outline:hover,
.btn-warning.btn-outline:hover,
.btn-danger.btn-outline:hover {
    color: #fff;
}
.btn-animated {
  -webkit-animation-name: gobblinPulse;
  -webkit-animation-duration: 2s;
  -webkit-animation-iteration-count: infinite;
  font: 300 1em/1.5 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
}
@-webkit-keyframes gobblinPulse {
  from { -webkit-box-shadow: 0 0 9px #333; }
  50% { -webkit-box-shadow: 0 0 18px #2daebf; }
  to { -webkit-box-shadow: 0 0 9px #333; }
}
/********************************
* Misc
*********************************/ 
.header-link {
    padding-left: 5px;
    opacity: 0;
    -webkit-transition: opacity 0.2s ease-in-out 0.1s;
    -moz-transition: opacity 0.2s ease-in-out 0.1s;
    -ms-transition: opacity 0.2s ease-in-out 0.1s;
}