d/* ---------------------------------------------------------------------------------------------------- */
/* --- Backyard Studios ------------------------------------------------------------------------------- */
/* --- Copyright 2021  -------------------------------------------------------------------------------- */
/* --- San Antonio Website Design & Development - Backyard Studios ------------------------------------ */
/* --- www.backyardstudios.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;
}
#logoArea .logoImg a img {
    max-height: 50px;
}
#logoArea .logoImg a img {
    min-height: 50px;
}
#logoArea.down.clone .logoImg a img {
    max-height: 50px;
}	
/* --- Footer Area --------------------------------------------------------------------------------- */
#copyrightContent {
    font-size: 12px;
    line-height: 16px;
}
/* --- Slider Area --------------------------------------------------------------------------------- */ 
#sliderArea .slideBox h3 {
    font-size: 24px!important;
    line-height: 26px!important;
}	
#sliderArea .slideBox h2 {
    font-size: 17px!important;
    line-height: 17px!important;
}	  
#sliderArea .slideBox h2 span {
    font-size: 22px!important;
    line-height: 22px!important;
}	
#slide-1-layer-2 {
    top: -25px;
}
.intro {
    width: 100%;
}
/* --- Single Post Area --------------------------------------------------------------------------------- */
#single #headerBgrd.fullHeader {
    height: 500px;
}
.single-used #imgContent.mainContent,
.single-system #imgContent.mainContent {
	padding-top: 50px;
	padding-bottom: 50px;
}
.single-used #formArea {
	padding: 50px 0;
}
.postNavAreaX {
    padding: 0 10px;
}
.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;
}


#single #mainContent.smallTop {
    padding-top: 30px;
}
/* --- Typography --------------------------------------------------------------------------------- */		
.subheading {
    padding: 0;
}
.single-team .post-thumbnail img {
    width: 70%;
}
/* --- Callout Area --------------------------------------------------------------------------------- */
#calloutArea .content {
    line-height: 22px;
}

#testimonial .wrapper {
    padding: 20px 0;
}	  
/* --- Footer Area --------------------------------------------------------------------------------- */
.ftCopy {
    padding: 25px 5%;
    font-size: 14px;
    line-height: 20px;
}
#footerArea {
    padding: 40px 0;
    font-size: 15px;
    line-height: 15px;
}
/* --- Product --------------------------------------------------------------------------------- */
.woocommerce div.product .woocommerce-tabs ul.tabs li {
	width: 34% !important;
    font-size: 14px !important;
}

/* --- Form Area --------------------------------------------------------------------------------- */
.wpcf7-form .wpcf7-submit {
    margin-top: 5px;
    border: 0px;
    display: block;
    width: 100%;
    padding: 15px!important;
}
span.wpcf7-list-item {
    display: block;
    margin: 10px 0 0px 5px;
    font-size: 15px;
    line-height: 15px;
}
.wpcf7-form label, .wpcf7-form h6 {
    font-size: 20px;
    line-height: 20px;
    margin-top: 20px;
}
 .wpcf7-form label, .wpcf7-form h6 {
    font-size: 21px;
    line-height: 21px;
}
/* --- Gallery Area --------------------------------------------------------------------------------- */
ul.photoList.col4 li {
    width: 49.4%;
    margin: .3%;
}
.btnsArea {
    margin: 25px 0px 0;
}
ul.photoList.col5 li {
    width: 49%;
}	  
/* --- Intro Area --------------------------------------------------------------------------------- */
#mainContent .content {
    width: 100%;
}
#pageMenu .intro {
    width: 80%;
}	  
/* --- Half Page Area --------------------------------------------------------------------------------- */
.bg-flex-holder .showTablet img {
	padding: 30px 0;
}
/* --- Secondary Content Area --------------------------------------------------------------------------------- */
.content-secondary {
    padding: 0px;
    margin-top: 30px;
}
.content-secondary table,
.content-secondary table tr,
.content-secondary table tbody,
.content-secondary table tr td {
	display: block;
	width:100%;
	padding: 0px;
}
/*------------- Navigation -------------------------------------------------------------------*/
#logoArea {
	padding: 8px 0px;
}
#logoArea .logoImg img {
	max-height: 45px;
}
#logoArea .col-lg-4 {
    -ms-flex: 0 0 80%;
    flex: 0 0 80%;
    max-width: 80%;
}
#logoArea .col-lg-8 {
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
}
a.btnMobile {
    width: 35px;
}
.navicon-line {
    margin-top: 6px;
}
/*------------- Homepage -------------------------------------------------------------------*/
ul.topList li .btnWhite {
    margin-top: 0;
}
ul.topList {
    margin: 0px 0 0px;
	vertical-align: middle;
}
ul.topList li.showTablet {
	line-height: 0px;
}
.vertCenterT {
  height: 100%;
  display: table;
  text-align: right;
  width: 100%; }
.innerT {
  display: table-cell;
  vertical-align: middle; 
}
/*------------- Search Bar -------------------------------------------------------------------*/
.searchandfilter ul li.sf-field-submit {
    width: 100%;
    display: block;
    float: none;
    text-align: center;
    margin: 0 .5%;
    padding-top: 20px;
	clear: both;
}
.searchandfilter ul li.sf-field-post-meta-_job_location:after {
	content: '';
	display: block;
	clear: both;
}
.searchandfilter ul li {
    width: 32.3333333%;
}
#page .searchandfilter ul li,
#subpage .searchandfilter ul li {
	width:100%;
	display: block;
}
/*------------- Footer Area -------------------------------------------------------------------*/
.ftLogo {
    padding-top: 0px;
}
#cityArea, #pageMenu {
    padding: 35px 20px;
}
#cityArea ul.btnList a, #cityArea ul.btnList span {
    padding: 4px 8px;
    font-size: 14px;
    line-height: 14px;
}
#cityArea ul.btnList {
    font-size: 0px;
    line-height: 0;
}
#cityArea ul.btnList li {
    margin: 5px;
}
ul.feat-container li .botBox h4 a {
    padding: 10px 20px 8px;
}
#newsArea ul.blogList li .botBox em {
    font-size: 14px;
    line-height: 14px;
}
ul.feat-container li .botBox h4 .pageDesc {
    font-size: 14px;
    line-height: 18px;
    padding: 0 5px;
}
ul.feat-container li .botBox h4 {
    font-size: 20px;
    line-height: 20px;
}
ul.feat-container.col2.hideLast li:nth-child(3) {
	display: inline-block;
}
ul.feat-container.col3.hideLast li:nth-child(4) {
	display: inline-block;
}
ul.feat-container.col4.hideLast li:nth-child(5) {
	display: inline-block;
}
ul.feat-container.col5.hideLast li:nth-child(6) {
	display: inline-block;
}	  
#teamArea {
    padding: 35px 0px;
}
.memberTitle {
    font-size: 14px;
    line-height: 14px;
}
#headerBgrd .col-lg-12 span {
    width: 65%;
}	  
#featuredArea {
    padding: 50px 0;
}
#featuredArea .bgrdColor {
    padding: 0;
}	  
#mainContent.bgrdDark .bgrdColor,#highlightArea.bgrdLight .bgrdColor,#highlightArea.bgrdDark .bgrdColor {
    padding: 60px 0;
} 
#footerArea .bgrdColor {
    padding: 10px 0 0;
    background-image: none;
}	
.ftLogo {
    text-align: center;
    margin-bottom: 25px;
} 
.footer-widget-1.rtText {
    margin-top: 40px;
    text-align: center !important;
}
  
.feat-thumbnail {
    margin-bottom: 40px;
}  
.single-system #imgContent .feat-thumbnail {
    margin-bottom: 0px;
}
.line {
    margin: 15px 30% 10px;
}

#serviceArea .wrapper {
    padding: 0px 10px 0px;
}	
ul.photoList {
    margin: 10px -.1%;
}
ul.basicIcons li {
    width: 49%;
}	
.mainContent, #pageMenu {
    padding: 50px 0px;
}
ul.feat-container.col3 li, #pageMenu ul.feat-container.col4 li {
    width: 92%;
}
#calloutArea .bgrdColor {
    padding: 30px 0%;
}
.review-thumbnail .alignleft {
    width: 30%;
    margin-bottom: 52%;
}
#testimonial .col-lg-7 {
    clip-path: circle(63% at 50% 50%);
}
#logoArea .col-lg-3 {
    flex: 0 0 70%;
    max-width: 70%;
}
#logoArea .col-lg-9 {
    flex: 0 0 30%;
    max-width: 30%;
}
#featuredArea ul.feat-container.col4 li {
    width: 92%;
}
#subpage #headerBgrd img.mainImg {
    padding: 100px 0;
	padding-top: min(100px, 15%) !important;
}
#imgContent .sp-thumbnail-container {
    height: 100px !important;
    width: 100px !important;
}
#single #headerBgrd img.mainImg, #archive #headerBgrd img.mainImg, .single-job_listing #single #headerBgrd img.mainImg {
    padding: 60px 0;
}
.single-system #imgContent .topTitles {
    margin-top: 5px;
    margin-bottom: 15px;
}
ul.basicList li {
    padding: 15px 10px 15px 10px;
}
#highlightArea .intro {
    width: 100%;
}
.single-system .mainContent {
    padding: 50px 0%;
}
#highlightArea {
    padding: 50px 0;
}
#breadCrumbs {
    padding: 35px 0px 20px;
}
ul.breadcrumbs-links {
    font-size: 0.85em;
}
.single-system .subtitle {
    font-size: 25px;
    line-height: 25px;
}
.single-system #imgContent.mainContent {
    padding: 20px 0% 50px;
}
#headerBgrd .bigTitle:after{
    margin: 3px 0;
}
#headerBgrd .bigTitle {
    font-size: 30px;
    line-height: 30px;
}
#contactArea h4 {
    font-size: 22px;
    line-height: 22px;
}
#contactArea ul.basicList li {
    width: 100%;
}
ul.blogList.col3 li {
    width: 90%;
    margin-left: 5%;
}
#newsArea ul.blogList li .botBox .content {
    display: none;
}
.home #logoArea {
    padding: 0px;
}
}
@media only screen and (max-width: 425px),
screen and (max-device-width: 425px) 
  and (-webkit-min-device-pixel-ratio: 1) {
/*------------- Typography Area -------------------------------------------------------------------*/  

/*--- Team Area -------------------------------------------------------------------*/ 
ul.team-container.col5 li {
	width: 80%;
	margin: 6px 0;
}
/*--- Blog Area -------------------------------------------------------------------*/
.overDate h6 {
    font-size: 30px;
    line-height: 30px;
}
.overDate h6 strong {
    font-size: 16px;
    line-height: 16px;
}
/*--- Single Area -------------------------------------------------------------------*/
#single ul.post-counter {
    font-size: 13px;
    line-height: 13px;
}
/*--- Header Area -------------------------------------------------------------------*/
.pageTitle .bigTitle {
    font-size: 24px;
    line-height: 24px;
    margin: 0px 0 0px 0;
}
/*--- Form Area -------------------------------------------------------------------*/
.wpcf7-text, .stec-layout-single-location .stec-layout-single-location-flex .stec-layout-single-location-right input, .log_forms input[type=text], input[type=password], .tickera_additional_info label input, .wpcf7-select, .wpcf7-textarea {
    padding: 7px 12px;
    margin: 5px 0px 0px;
}
#testimonial .wrapper {
    font-size: 20px;
    line-height: 27px;
}
ul.basicIcons li img {
    max-width: 100%;
}	  
#logoArea .logoImg a img {
    min-height: 40px;
}
#testimonial .wrapper .content {
    width: 95%;
}
#imgContent .sp-thumbnail-container {
    height: 95px !important;
    width: 95px !important;
}
.single-system #imgContent .sp-thumbnails.sp-grab {
    transform: translate3d(2%, 0px, 0px) !important;
}
ul.basicList li {
    width: 100%;
    padding: 16px;
}
h2, h1.entry-title {
    font-size: 26px;
    line-height: 26px;
}
ul.blogList.col3 li {
    width: 96%;
    margin-left: 2%;
}
}
@media only screen and (max-width: 375px),
screen and (max-device-width: 375px) 
  and (-webkit-min-device-pixel-ratio: 1) {
/*--- Footer Area -------------------------------------------------------------------*/
.ftLogo a img {
    max-height: 70px;
}
#copyrightContent {
    padding-top: 20px;
}
/*--- Testimonal Area -------------------------------------------------------------------*/
#testimonial h4 {
    font-size: 25px;
    line-height: 25px;
}
/*--- Typography -------------------------------------------------------------------*/
#mainContent .subtitle {
    width: 100%;
}
a.btnBlue, .btnBlack, .searchandfilter input[type="submit"], #subpage #calloutPage a.btnRed, .search404 form input[type="submit"], a.btnGreen, .postNav .td2 a, a.btnBrown, a.btnWhite, .postNav .td1 a, .postNav .td3 a, a.btnGreyOutline, .btnGrey, .btnBlue, .btnRed, .btnGreen, .btnYellow, .btnOrange, .btnPurple, .btnPink, .btnBrown, .searchandfilter input[type="submit"], .search404 form input[type="submit"], .wpcf7-form .wpcf7-submit, input[type="submit"], a.btnOutline {
    padding: 15px 14px;
    font-size: 13px;
    line-height: 13px;
}
/*--- Navigation -------------------------------------------------------------------*/
#logoArea .col-lg-4 {
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
}
#logoArea .col-lg-8 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
}
#logoArea {
    padding: 10px 0px;
}
  
a.btnMobile {
    width: 30px;
}
/*--- Blog Area -------------------------------------------------------------------*/
ul.blogList li .overlay,
ul.blogList .overlayColor {
	display: none;
}
ul.blogList .overContent {
    position: relative;
}
.subtitle {
    font-size: 23px;
    line-height: 26px;
}
.bigSubtitle {
    font-size: 21px;
    line-height: 21px;
}	  
ul.basicList {
    margin: 10px 0;
}	  
/*--- Single Area -------------------------------------------------------------------*/
.postNav td.td1 a, .postNav td.td3 a {
    display: block;
    max-width: 45px;
    margin: 0 auto;
    padding: 9px 12px 8px;
}
.postNav td.td1, .postNav td.td3 {
    width: 20%;
}
.postNav td.td2 {
    width: 60%;
    text-align: center;
}
.postNav td.td2 a {
    display: block;
    padding: 11px;
    margin: 0 5px;
}
#testimonial h6 {
    font-size: 19px;
    line-height: 19px;
}	  
/*--- Featured Area -------------------------------------------------------------------*/
ul.feat-container li a span.iconImg img {
    max-width: 45px;
    margin-top: 10px;
}
#cityArea ul.btnList li {
    margin: 3px;
}	
.mainContent, #pageMenu {
    padding: 40px 0px;
}
#mainContent .subheading {
    padding: 0 5%;
}
#headerBgrd .bigTitle {
    font-size: 32px;
    line-height: 32px;
}	  
#headerBgrd .col-lg-12 span {
    width: 95%;
}
#accredBgrd .lshowcase-wrap-normal {
    width: 100%;
}
.review-thumbnail .alignleft {
    width: 30%;
    margin-bottom: 0;
    margin-top: -50%;
}
.lshowcase-box-normal {
    padding: 4% !important;
}
#imgContent .imgBox img {
    max-width: 90%;
}
#imgContent .subContent {
    width: 78%;
    padding: 20px 7px 20px 12px;
}
#imgContent .subImage {
    display: inline-block;
    width: 20%;
    padding-left: 12px;
}
#imgContent .sp-bottom-thumbnails .sp-thumbnail-container:last-child {
    display: none;
}
ul.breadcrumbs-links {
    font-size: 0.8em;
}
ul.basicList li {
    padding: 10px;
}
.btnsArea {
    display: block;
}
.btnsArea li {
    display: block;
    float: none;
}
.btnsArea li a {
    display: block;
    text-align: center;
}
#formArea .intro {
    padding-bottom: 20px;
    width: 100%;
}
.single-system #imgContent.mainContent {
    padding: 0px 0 50px;
}
.single-system #imgContent .sp-thumbnails.sp-grab {
    transform: translate3d(8%, 0px, 0px) !important;
}
ul.blogList.col3 li {
    width: 100%;
    margin-left: 0%;
}
#newsArea, #galleryArea {
    padding-left: 0px;
    padding-right: 0px;
}
.single ul.blogList.col3 li, ul.blogList.col3 li {
    width: 100%;
    margin-left: 0%;
}
}
@media only screen and (max-width: 360px),
screen and (max-device-width: 360px) 
  and (-webkit-min-device-pixel-ratio: 1) { 
#logoArea .logoImg a img {
    max-height: 62px;
}	  
.single-system .subtitle {
    font-size: 25px;
    line-height: 25px;
}
}
@media only screen and (max-width: 320px),
screen and (max-device-width: 320px) 
  and (-webkit-min-device-pixel-ratio: 1) { 

body, #testimonial,.subheading {
    font-size: 16px;
    line-height: 21px;
}
.btnsArea,#cityArea ul.btnList {
    display: block;
}
.btnsArea li, #cityArea ul.btnList li {
    float: none;
    margin: 6px 0;
    display: block;
}
#cityArea ul.btnList li:first-child {
    margin-left: 0px;
}
#featuredArea ul.feat-container.col4 li,
ul.team-container.col4 li,ul.feat-container.col3 li, #pageMenu ul.feat-container.col4 li,ul.blogList.col3 li {
    width: 100%;
    margin: 6px 0;
}
.btnsArea li a,#cityArea ul.btnList a, #cityArea ul.btnList span {
    display: block;
    text-align: center;
}
.intro {
    padding-bottom: 10px;
}
ul.team-container {
    width: 85%;
    margin: 0px auto;
}
ul.breadcrumbs-links {
    display: none;
}
#breadCrumbs {
    padding: 35px 20px 0px;
}
}

@media only screen and (max-width:768px) {
	#single #headerBgrd img.mainImg, #subpage #headerBgrd.headSingle img.mainImg, #archive #headerBgrd img.mainImg {
		padding-top: 25px !important;
	}
}
