/* ---------------------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------------------- */
/* --- Texan Tea 2021 --------------------------------------------------------------------------------- */
/* --- New Braunfels Website Design & Development - NBTX Marketing ------------------------------------ */
/* --- nbtxmarketing.com ------------------------------------------------------------------------------ */
/* ---------------------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------------------- */

/* --- Basic Elements --------------------------------------------------------------------------------- */
.mobileBtn {
	display:none;
}
.showTablet {
	display:none;
}
@media only screen and (max-width: 1538px),
screen and (max-device-width: 1538px) 
  and (-webkit-min-device-pixel-ratio: 1) {
.overlayBgrd img {
    top: 3%;
    right: 10%;
    height: 825px;
}	  
#mainContent .order-1 img {
    min-width: 743px;
    margin-left: -40px;
}	  
#headerBgrd .bigTitle {
    font-size: 55px;
    line-height: 55px;
}
#headerBgrd .bigTitle:after {
    left: -26px;
    top: -81px;
}	  
/* --- Featured Area --------------------------------------------------------------------------------- */
ul.feat-container li .content {
    font-size: 20px;
    line-height: 23px;
}
ul.feat-container li .overlay .innerT {
    padding: 30px 49% 5px 5px;
}	 
ul.feat-container li span.overlay h5 {
    font-size: 41px;
    line-height: 39px;
    margin-left: 35px;
}	  
/* --- Main Elements --------------------------------------------------------------------------------- */
.mainContent, #mainContent {
    padding: 75px 0;
}
#calloutArea {
    padding: 90px 0;
	overflow: hidden;
}
#calloutArea .intro {
    padding: 35px 15px 25px;
}	
#calloutArea .bigTitle {
    font-size: 63px;
    line-height: 68px;
}	  
/* --- Header Area --------------------------------------------------------------------------------- */
#headerBgrd img.mainImg {
    padding: 150px 0;
}
#footerCallout .col-lg-6 h2 {
    width: 100%;
    font-size: 58px;
    line-height: 58px;
}	  
#footerArea .bgrdColor {
    padding: 80PX 0 0px;
}

ul.feat-container li .imgFeature {
    background-size: 101%;
    min-height: inherit;	
}	  
ul.feat-container.col3 li {
	min-height: 380px;
}
}
@media only screen and (max-width: 1446px),
screen and (max-device-width: 1446px) 
  and (-webkit-min-device-pixel-ratio: 1) {
h1 {
    font-size: 52px;
    line-height: 52px;
}	  
#headerBgrd .bigTitle {
    font-size: 53px;
    line-height: 53px;
}	  
.overlayBgrd img {
    top: 3%;
    right: 7%;
	height: 744px;
}	  

#sliderArea .slideBox a.btnBlue {
	padding: 15px 24px 13px!important;
}	
#mainContent .order-1 img {
    min-width: 708px;
    margin-left: 0;
}	  
#mainContent .intro {
    padding: 0 8%;
}
ul.feat-container li .content {
    font-size: 17px;
    line-height: 19px;
}	  
#contactArea {
    padding: 75px 3%;
}	  
#footerCallout .bgrdColor {
    padding: 65px 10% 80px;
}
ul.feat-container.col3 li {
	min-height: 330px;
}	  
}
@media only screen and (max-width: 1260px),
screen and (max-device-width: 1260px) 
  and (-webkit-min-device-pixel-ratio: 1) {
/* --- Navigation --------------------------------------------------------------------------------- */
#mainNav {
    margin-top: 10px;
	margin-bottom: 0px;
}
#mainNav > div > ul > li > a {
	padding: 8px 19px 9px;
    font-size: 20px;
    line-height: 20px;
}
#logoArea .logoImg img {
    min-height: 80px;
}
#logoArea.down.clone .wraplogo {
    padding: 0 0px;
}
#logoArea.down.clone .showScroll a {
    padding: 12px 15px 9px;
    font-size: 16px;
    line-height: 16px;
}
ul.topNumber {
    margin: 0px 0 0px;
}
ul.topList li .btnWhite {
    padding: 8px 15px 8px;
    margin-top: 4px;
}
#mainNav > div > ul > li {
    margin: 0px 0 0 6px;
}
/* --- Navigation - Dropdown Area --------------------------------------------------------------------------------- */
#mainNav ul.sub-menu {
	top: 32px;
}
#mainNav ul.sub-menu li a {
    font-size: 15px;
    line-height: 15px;
    padding: 10px 10px;
} 
h1 {
    font-size: 45px;
    line-height: 45px;
}	  
h3 {
    font-size: 40px;
    line-height: 38px;
}
#headerBgrd .bigTitle {
    font-size: 46px;
    line-height: 46px;
}
#headerBgrd .bigTitle:after {
    left: -30px;
    top: -91px;
}	  
#contactArea h3 {
    font-size: 62px;
    line-height: 50px;
}	
#mainContent .order-1 img {
    min-width: 645px;
    margin-left: 0;
}
.overlayBgrd img {
    top: 3%;
    right: 7%;
	height: 744px;
}
ul.feat-container.col3 li {
    min-height: 300px;
}	  
ul.feat-container li .overlay .innerT {
    padding: 20px 48% 5px 5px;
}	  
ul.feat-container li .content {
    font-size: 15px;
    line-height: 18px;
}	
ul.feat-container li span.overlay h4 {
    font-size: 38px;
    line-height: 23px;
}	
ul.feat-container li span.overlay h5 {
    font-size: 35px;
    line-height: 29px;
    margin-left: 30px;
}
ul.feat-container li span.overlay h5:after {
    width: 163px;
    margin: 0 auto 0 -17px;
}
ul.feat-container li img.mainFeat {
    margin-right: -38px;
}
#footerCallout .bgrdColor {
    padding: 50px 4% 55px;
}	  
.ftLogo a img {
    max-height: 150px;
}
ul.socialIcons li a img {
    height: 63px;
    width: auto;
}
#footerCallout .col-lg-6 h2 {
    width: 100%;
    font-size: 56px;
    line-height: 47px;
}	  
#footerCallout .col-lg-6 .subheading {
    font-size: 25px;
    line-height: 26px;
}	  
#footerArea .bgrdColor {
    padding: 60px 0 0px;
    background: -webkit-linear-gradient(rgba(64, 192, 195, 0) 14%, #40c0c3 100%);
    background: -o-linear-gradient(rgba(64, 192, 195, 0) 14%, #40c0c3 100%);
    background: linear-gradient(rgba(64, 192, 195, 0) 14%, #40c0c3 100%);
}	  
}
@media only screen and (max-width: 1200px),
screen and (max-device-width: 1200px) 
  and (-webkit-min-device-pixel-ratio: 1) {
.mainContent {
    padding: 60px 20px;
}
.btnBlack, a.btnWhite, .btnGrey, .btnBlue, .container .caldera-grid .btn-default, .btnRed, .btnGreen, .btnYellow, .btnOrange, .btnPurple, .btnPink, .btnBrown, .search404 form input[type="submit"], .wpcf7-form .wpcf7-submit, input[type="submit"], .postNav .td2 a, .postNav .td1 a, .postNav .td3 a {
    padding: 12px 20px 9px;
    font-size: 16px;
    line-height: 16px;
}
#headerBgrd .col-lg-5 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
}	
#headerBgrd .offset-lg-7 {
    margin-left: 50%;
}
#headerBgrd .bigTitle {
    font-size: 52px;
    line-height: 50px;
}	
#headerBgrd .bigTitle:after {
    left: -56px;
    top: -91px;
}	  
/* --- Half Page Area --------------------------------------------------------------------------------- */
.itemSection .content {
    padding: 60px 45px;
}
.itemSection .content .wrapper {
    margin-top: 25px;
}
/* --- Secondary Content Area --------------------------------------------------------------------------------- */
.content-secondary {
    padding: 0 60px;
}
/* --- Logo Area --------------------------------------------------------------------------------- */
#logoArea .col-lg-4 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
}
#logoArea .col-lg-8 {
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
}
#mainNav > div > ul > li {
    margin: 0px 0 0 5px;
}
ul.topNumber li {
    line-height: 18px;
    font-size: 18px;
}
/* --- Page Menu Area --------------------------------------------------------------------------------- */ 
#pageMenu ul.feat-container.col4 li {
    width: 32%;
} 
ul.feat-container.col3 li {
    min-height: 270px;
}	 
#contactArea iframe {
    width: 500px;
}
#contactArea h3 {
    font-size: 52px;
    line-height: 40px;
}
#contactArea h6.main-title {
    font-size: 26px;
    line-height: 26px;
}	
#contactArea {
    font-size: 18px;
    line-height: 19px;
}
#calloutArea .intro {
    padding: 10px 5px 15px;
}
.tagline {
    font-size: 24px;
    line-height: 24px;
    padding: 0;
}	  
#footerCallout .col-lg-6 h2 {
    font-size: 54px;
    line-height: 45px;
}	  
}
@media only screen and (max-width: 1024px),
(max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 1){ 
/* --- Navigation --------------------------------------------------------------------------------- */
#mainNav > div > ul > li > a {
    padding: 8px 15px 9px;
}
#logoArea.down.clone .showScroll {
    display: none;
}
/* --- Slider --------------------------------------------------------------------------------- */
#sliderArea a.btnYellow {
    font-size: 30px;
    line-height: 30px;
}
/* --- Type --------------------------------------------------------------------------------- */
h1 {
    font-size: 37px;
    line-height: 40px;
}
h2,h3, h1.entry-title {
    font-size: 33px;
    line-height: 35px;
}
ul.feat-container li .botBox h4 {
    font-size: 23px;
    line-height: 23px;
}
.subtitle {
    font-size: 24px;
    line-height: 21px;
}
.intro {
	font-size: 98%;
    line-height: 28px;
	width: 100%;
}
.bigTitle {
    font-size: 42px;
    line-height: 44px;
}
#headerBgrd .offset-lg-7 {
    margin-left: 40%;
}
#headerBgrd .col-lg-5 {
    -ms-flex: 0 0 60%;
    flex: 0 0 60%;
    max-width: 60%;
}	
ul li, ol li {
    line-height: 25px;
}
#mainContent .order-1 img {
    min-width: 525px;
    margin-left: 0;
}
.overlayBgrd img {
    top: 3.5%;
    right: 7%;
    height: 475px;
}	
ul.feat-container.col3 li {
    width: 50%;
}	
.hideYes li:last-child {
    display: inline-block;
}
ul.feat-container.col3 li {
    min-height: 370px;
}	
ul.feat-container li:nth-child(3) {
    background-color: #41c1c3;
}	
ul.feat-container li:nth-child(3) .content {
    color: #fff;
}
ul.feat-container li:nth-child(3) span.overlay h5:after {
    filter: invert(77%) sepia(95%) saturate(2307%) hue-rotate(351deg) brightness(100%) contrast(103%);
}	
ul.feat-container li:nth-child(4) span.overlay h5:after {
    filter:invert(73%) sepia(88%) saturate(368%) hue-rotate(125deg) brightness(84%) contrast(79%);
}	
ul.feat-container li span.overlay h4 {
    font-size: 64px;
    line-height: 57px;
}	
ul.feat-container li span.overlay h5 {
    font-size: 46px;
    line-height: 39px;
    margin-left: 39px;
}
ul.feat-container li .content {
    font-size: 18px;
    line-height: 21px;
    padding: 5px 0 22px 24px;	
}	
ul.feat-container li span.overlay h5:after {
    width: 265px;
    margin: 0 auto 0 -37px;
}
#calloutArea .bigTitle {
    font-size: 55px;
    line-height: 58px;
}
#calloutArea .bigTitle:after {
    margin: 8px auto 10px auto;
}
#calloutArea .intro img {
    max-width: 185px;
}
#contactArea iframe {
    width: 450px;
}	
#footerCallout .col-lg-6 .subheading {
    font-size: 22px;
    line-height: 24px;
    padding: 0 0 0 2%;
}	
}
@media only screen and (max-width: 992px),
(max-device-width: 992px) and (-webkit-min-device-pixel-ratio: 1) {
/*------------- Navigation -------------------------------------------------------------------*/
#logoArea .wraplogo {
    padding: 15px 10px 0px;
}
#logoArea .logoImg img {
	max-height: 65px;
}
#logoArea .col-lg-4,
#logoArea .col-lg-8 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
}
#logoArea .col-lg-3 {
    -ms-flex: 0 0 30%;
    flex: 0 0 30%;
    max-width: 30%;
}
#logoArea  .col-lg-9 {
    -ms-flex: 0 0 70%;
    flex: 0 0 70%;
    max-width: 70%;
}
#logoArea {
	background: -webkit-linear-gradient(bottom, rgba(64,192,195,0) 0%, rgba(64,192,195,.9)53%);
	background: -o-linear-gradient(bottom, rgba(64,192,195,0) 0%, rgba(64,192,195,.9) 53%);
	background: linear-gradient(to top, rgba(64,192,195,0) 0%, rgba(64,192,195,.9) 53%);
}	
ul.topNumber {
    margin: 0px 0 0px;
	vertical-align: middle;
}
ul.topNumber li.listPhone {
    padding-top: 4px;
}
ul.topNumber li {
    font-size: 22px;
}
ul.topList li .btnWhite {
    margin-top: 0;
}
ul.topList li.showTablet {
	line-height: 0px;
}
.vertCenterT {
  height: 100%;
  display: table;
  text-align: right;
  width: 100%; }

.innerT {
  display: table-cell;
  vertical-align: middle;
  line-height: 0px;
}
#logoArea .logoImg a img {
    min-height: 85px;
}
#headerBgrd .bigTitle:after {
    left: -47px;
    top: -88px;
}	
/* --- Half Page Area --------------------------------------------------------------------------------- */
.bg-flex {
    position: relative !important;
}
.bg-flex-holder {
	position: relative;
}
.itemSection .content .wrapper {
    margin-top: 25px;
}
.itemSection .col-lg-6 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
} 
.itemSection .offset-lg-6 {
    margin-left: 0%;
}
/* --- Typography --------------------------------------------------------------------------------- */

/* --- News Area --------------------------------------------------------------------------------- */
ul.blogList.col3 li {
    width: 48%;
}
ul.blogList.col3 li.news3 {
	display:none;
}
.blog ul.blogList.col3 li.news3 {
	display:block;
}
#testimonial h4 {
    font-size: 40px;
    line-height: 40px;
}
#footerCallout .bgrdColor {
    padding: 50px 0 55px;
}	
.ftLogo a img {
    max-height: 140px;
    margin-top: 20px;
}	
.subheading {
    font-size: 22px;
    line-height: 34px;
}
.subtitle {
    font-size: 24px;
    line-height: 24px;
}
.itemSection .content .subtitle {
    margin-bottom: 6px;
}
#mainContent .order-1 img {
    min-width: 485px;
    margin-left: 0;
}	
#copyrightContent {
    padding-top: 0;
    margin-top: 30px;
    font-size: 12px;
    line-height: 12px;
    padding-bottom: 13px;
}	
#contactArea h3 {
    font-size: 48px;
    line-height: 34px;
}	
#contactArea .content tr {
    padding-bottom: 20px;
    display: block;
}	
.emList {
    margin-bottom: 0;
}	
#calloutArea .content {
    line-height: 27px;
    font-size: 24px;
}
#calloutArea .col-lg-5 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
}	
#logoArea.clone ul.topNumber {
    display: inline-block;
}
#logoArea.down.clone {
    padding: 10px;
}
#logoArea.down.clone ul.topNumber {
    margin: 0;
    vertical-align: middle;
}
}