.category-navbar li a {opacity: .9; position: relative; color: #fff !important; display: block; font-weight: bold; text-transform: uppercase;}
.category-navbar li a i {float: left; margin: 0 5px 0 0;}
.category-navbar li a:hover {opacity: 1;}
.category-navbar li a:focus {opacity: 1;}
.category-navbar {marginb: 0 0 25px 0;}
.whale-grid-gallery .category-navbar {display: none !important;}

.header-whale {text-align: center;}
.header-whale h1 {font-size: 52px;}

.whale-grid-gallery {margin-top: 10px;}
.whale-grid-gallery .box-inner {padding: 0 10px 10px 10px;}
.whale-grid-gallery .box img {width: calc(100% - 20px); margin: 0 0 0 10px;}
.whale-grid-gallery .box h3 {font-size: 19px; margin: 10px 0;}
.whale-grid-gallery .box p {font-size: 14px; line-height: 18px; margin-bottom: 20px;}

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
.header-whale h1 {font-size: 100px; margin: -25px 0 0 0; text-shadow: 3px 3px 0 #FFFFFF;}

}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
.header-whale h1 {font-size: 120px;}

.image-tabs.category-navbar li a {margin: 0; min-height: 90px; padding: 40px 5px 5px 5px; border-bottom: 5px solid #fff;}
.image-tabs.category-navbar li a i {position: absolute; left: 50%; top: 10px; color: #fff; margin: 0 0 0 -10px; font-size: 20px;}
.image-tabs.category-navbar li a:after {position: absolute; left: 50%; bottom: -20px; margin-left: -20px; content: ""; opacity: 0;border-left: 20px solid transparent;border-right: 20px solid transparent;border-top: 20px solid #c98638;}
.image-tabs.category-navbar li a.active {opacity: 1; border-color: #c98638;}
.image-tabs.category-navbar li a.active:after {opacity: 1;}

.whale-grid-gallery .centered {width: 100% !important; height: auto !important;}
.whale-grid-gallery-container {display: flex !important; flex-wrap: wrap !important; justify-content: space-between !important; width: 100% !important;}
.whale-grid-gallery-container .box {position: relative !important; left: 0 !important;top: 0 !important; width: 48% !important; margin: 1%;}
.whale-grid-gallery-container .box h3 {position: absolute; left: 0; top :0; display: inline-block; background: #880011; color: #fff; padding: 10px 15px; margin: 0; font-size: 16px; z-index: 5; overflow: hidden;}
.whale-grid-gallery .box img {width: 100%; margin: 0;}

.whale-grid-gallery-container .text {position: absolute; left: 0; top: 100%; width: 100%; bottom: 0; display: flex; flex-direction: column; justify-content: center; background: none; opacity: 0;}
.whale-grid-gallery-container .text:after {position: absolute; left: 0; top: 0; width: 100%; bottom: 0; background: #880011; opacity: .8; display: block; content: "";}
.whale-grid-gallery-container .text p {font-size: 16px; line-height: 24px; z-index: 5; color: #fff; padding: 50px 25px 0 25px;}
.whale-grid-gallery-container .text p strong {margin: 10px 0; line-height: 30px; font-size: 2em; color: #fff;}

.whale-grid-gallery-container .box:hover .text {top: 0; opacity: 1;}
.whale-grid-gallery-container .box:hover h3 {background: #d3902f;}
.whale-grid-gallery-container .box:hover img {transform: scale(1.1,1.1);}
.whale-grid-gallery-container .box:nth-of-type(even) .text {top: 0; left: 100%;}
.whale-grid-gallery-container .box:nth-of-type(even):hover .text {top: 0; left: 0;}

.whale-grid-gallery-container .box:nth-of-type(2n) .text:after {background: #d3902f !important; opacity: .9 !important;}
.whale-grid-gallery-container .box:nth-of-type(2n):hover h3 {background: #880011 !important;}
.whale-grid-gallery-container .box:nth-of-type(3n) .text:after {background: #111 !important; opacity: .8 !important;}
.whale-grid-gallery-container .box:nth-of-type(3n):hover h3 {background: #880011 !important;}

.whale-grid-gallery-container .box:nth-of-type(4) .text:after {background: #111 !important; opacity: .8 !important;}
.whale-grid-gallery-container .box:nth-of-type(4):hover h3 {background: #880011 !important;}
.whale-grid-gallery-container .box:nth-of-type(5) .text:after {background: #d3902f !important; opacity: .9 !important;}
.whale-grid-gallery-container .box:nth-of-type(5):hover h3 {background: #880011 !important;}
}