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

.showMobile {
	display:none;
}
/* --- Basic Elements --------------------------------------------------------------------------------- */
@media only screen and (max-width: 480px),
screen and (max-device-width: 480px) 
  and (-webkit-min-device-pixel-ratio: 1) {
.showMobile {
	display:block;
}
.hideMobile {
	display:none;
}
#logoArea .logoImg a img {
    min-height: 70px;
}
ul.topNumber li.listPhone {
    display: none;
}	
#logoArea .col-lg-3 {
    -ms-flex: 0 0 60%;
    flex: 0 0 60%;
    max-width: 60%;
}	
#logoArea .col-lg-9 {
    -ms-flex: 0 0 40%;
    flex: 0 0 40%;
    max-width: 40%;
}	  
  
.postNav td.td1 a .spanTxt, .postNav td.td3 a .spanTxt {
    display: none;
}

.postNav td.td1, .postNav td.td3 {
    vertical-align: top;
}
.postNav td.td1 a, .postNav td.td3 a {
    display: block;
    max-width: 60px;
    margin: 0 auto;
	padding: 9px 15px 8px;
    text-align: center;
}
.post-thumbnail {
    margin: 0 -15px;
}
#single .content {
    margin: 15px 0 0;
}
#headerBgrd .bigTitle:after {
    top: -10px;
}	
#headerBgrd .bigTitle {
    font-size: 34px;
    line-height: 34px;
    margin-top: 90px;
}	  
#headerBgrd .col-lg-5 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}	  
#headerBgrd .offset-lg-7 {
    margin-left: 0;
}
/* --- Typography --------------------------------------------------------------------------------- */
.bigTitle {
    font-size: 30px;
    line-height: 33px;
}
hr {
    margin: 25px 15%;
}
h2, h3, h1.entry-title {
    font-size: 35px;
    line-height: 32px;
}
h4 {
    font-size: 21px;
    line-height: 21px;
}
h5 {
    font-size: 18px;
    line-height: 22px;
}
h6 {
    font-size: 18px;
    line-height: 18px;
}
.overlayBgrd img {
    display: none;
}
#mainContent .order-1 img {
    max-width: 421px;
    min-width: unset;
}	
ul.feat-container.col3 li {
    min-height: 300px;
    width: 100%;
}	  
ul.feat-container li span.overlay h4 {
    font-size: 31px;
    line-height: 21px;
}	
ul.feat-container li span.overlay h5:after {
    width: 146px;
    height: 14px;
}
ul.feat-container li .overlay .innerT {
    padding: 10px 43% 5px 5px;
}	
ul.feat-container li .imgFeature {
    background-size: 86%;
    background-position: 102% bottom;
}	
ul.feat-container li .content {
    font-size: 17px;
    line-height: 21px;
    padding: 5px 0 0 10px;
}
ul.feat-container li span.overlay h5 {
    font-size: 37px;
    line-height: 34px;
} 
ul.feat-container li:nth-child(3) {
    background-color: #ffce07;
}
ul.feat-container li:nth-child(4) {
    background-color: #41c1c3;
}	
ul.feat-container li:nth-child(3) .content {
    color: #754c29;
}
ul.feat-container li:nth-child(3) span.overlay h5:after {
    filter: invert(73%) sepia(88%) saturate(368%) hue-rotate(125deg) brightness(84%) contrast(79%);
}
ul.feat-container li:nth-child(4) span.overlay h5:after {
    filter: invert(77%) sepia(95%) saturate(2307%) hue-rotate(351deg) brightness(100%) contrast(103%);
}
ul.feat-container li span.overlay h4 {
    font-size: 38px;
    line-height: 30px;
}
#calloutArea .col-lg-5 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
	padding-left: 0;
	padding-right: 0; 
}	  
#calloutArea .intro {
    padding: 10px 0 15px;
    background-color: rgba(65, 193, 195,.75);
}	 
#calloutArea .subtitle,.tagline {
    color: white;
}
#contactArea iframe {
    width: 410px;
    margin: 0 auto;
}	  
#contactArea {
    padding: 55px 2% 45px;
    font-size: 16px;
    line-height: 17px;
}	  
#contactArea h3 {
    font-size: 40px;
    line-height: 26px;
}	  
#contactArea .content tr {
    padding-bottom: 20px;
    display: inline-block;
    width: 100%;
}	
#contactArea .content td:first-child {
    width: 16%;
}	  
#contactArea .content tr:last-child td {
    width: 65%;
}	
#contactArea .content tr:last-child td:first-child {
    width: 17%;
}	  
#contactArea .content td {
    margin-left: 10px;
    width: 75%;
}	 
ul.officeHrs li span {
    width: 53%;
}
#formArea .col-lg-7 .content {
    padding-left: 5%;
    padding-right: 5%;
}	  
#footerCallout .col-lg-6 .subheading {
    font-size: 18px;
    line-height: 20px;
    padding: 0;
}	  
#footerCallout .bgrdColor {
    padding: 40px 3% 35px;
}	  
#footerArea .bgrdColor {
	padding: 30px 0 0px;}	  
.ftLogo a img {
    max-height: 103px;
    margin-top: 25px;
}	  
ul.socialIcons li a img {
    height: 46px;
    width: auto;
}	
}
@media only screen and (max-width: 425px),
screen and (max-device-width: 425px) 
  and (-webkit-min-device-pixel-ratio: 1) {
#mainContent .order-1 img {
    max-width: 342px;
    min-width: unset;
}
h1 {
    font-size: 32px;
    line-height: 37px;
}
ul.feat-container li .imgFeature {
    background-size: 99%;
    background-position: 102% bottom;
}
.mainContent, #mainContent {
    padding: 55px 0;
}
#mainContent .intro {
    padding: 0 3%;
}	  
.subtitle {
    font-size: 26px;
    line-height: 26px;
}
ul.officeHrs li span {
    width: 50%;
}
#contactArea .content td:first-child {
    width: 15%;
}	  
#contactArea .content tr:last-child td {
    width: 80%;
}
#contactArea .content tr:last-child td:first-child {
    width: 16%;
}	
#contactArea iframe {
    width: 350px;
    margin: 0 auto;
}	  
}
@media only screen and (max-width: 375px),
screen and (max-device-width: 375px) 
  and (-webkit-min-device-pixel-ratio: 1) {

#mainContent .order-1 img {
    max-width: 319px;
    min-width: unset;
}	
#headerBgrd .bigTitle {
    font-size: 30px;
    line-height: 34px;
    margin-top: 90px;
}	  
ul.feat-container.col3 li {
    min-height: 320px;
    width: 100%;
}
ul.feat-container li .imgFeature {
    background-size: 119%;
    background-position: 26% bottom;
}	 
#contactArea h3 {
    font-size: 34px;
    line-height: 21px;
}	  
#contactArea iframe {
    width: 310px;
    margin: 0 auto;
}
#contactArea .content td:first-child,#contactArea .content tr:last-child td:first-child {
    width: 20%;
}	
#contactArea .content tr:last-child td {
    width: 100%;
    margin-top: 10px;
}	  
#footerCallout .col-lg-6 h2 {
    font-size: 37px;
    line-height: 32px;
}	  
#footerCallout .col-lg-6 .subheading {
    font-size: 19px;
    line-height: 20px;
}	
#footerArea .col-sm-12 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}
#footerArea .widget-area {
    text-align: center!important;
}
#footerArea .widget-area .ltText {
    text-align: center!important;
}
ul.socialIcons li a img {
    height: 52px;
    width: auto;
}
.ftLogo a img {
    margin-top: 65px;
}

	  
}
@media only screen and (max-width: 360px),
screen and (max-device-width: 360px) 
  and (-webkit-min-device-pixel-ratio: 1) { 
	  
}
@media only screen and (max-width: 320px),
screen and (max-device-width: 320px) 
  and (-webkit-min-device-pixel-ratio: 1) { 

}