/* ---------------------------------------------------------------------------------------------------- */
/* --- San Antonio Website Design & Development - Backyard Studios ------------------------------------ */
/* --- www.backyardstudios.com ------------------------------------------------------------------------ */
/* ---------------------------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------------------- */

@media only screen and (max-width: 768px),
(-webkit-min-device-pixel-ratio: 2) and (min-resolution: 192dpi),
(max-width: 980px) and (orientation : landscape) {
.hideTablet {
	display:none;
}
.showTablet {
	display:block;
}
.mobileBtn {
	display:block;
}
.hideItem {
    display: block;
}	
#mainNav {
	display:none;
}	
.bigTitle {
    font-size: 45px;
    line-height: 49px;
}
h4 {
    font-size: 21px;
    line-height: 23px;
}	
.bgrdWave.top.blue-shadow {
    height: 66px;
    margin-bottom: -2px;
}
.bgrdWave.top.white-shadow, .bgrdWave.top.white-dark-blue-shadow {
    margin-top: -61px;
}
#headerBgrd img.mainImg {
    padding: 95px 0;
}	
#headerBgrd .pageTitle {
    max-width: 353px;
}	
#mapArea .col-md-5 {
	-ms-flex: 0 0 100%;
	flex: 0 0 100%;
	max-width: 100%;
	order: 1;
	margin-bottom: 30px;
	padding: 25px 8% 0;
}	
#mapArea .offset-md-1 {
    order: 2;
}
#headerBgrd.headSingle .pageTitle {
    padding-bottom: 0;	
}
.single-service .post-thumbnail {
    margin: 0 0 20px;
}
.single-service .bgrdBtn .btnsArea li {
    display: inline-block;
    margin: 0 9px 12px 0;
    width: 47%;
}	
.single-service .bgrdBtn .btnsArea {
    margin: 10px 0 25px;
    padding: 0;
    display: inline-block;
    width: 100%;
}
.single-service #mainContent, .single-service #faqArea {
    padding-left: 30px;
    padding-right: 30px;
}
.faqHalf .col-lg-7.order-1 {
    order: 2;
}	
.faqHalf .col-lg-5.order-2 {
    order: 1;
}
#faqArea .col-lg-7 h4.catTitle {
    margin-top: 40px;
}	
.listingArea .col-md-5,
.listingArea .col-md-7 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}
.listingArea .feat-thumbnail {
    text-align: center;
    margin-bottom: 15px;
}
#serviceArea .wrapper {
    padding: 0px 70px 0px;
}
.listingArea .order-2 {
    order:1;
}
.listingArea .order-1 {
    order:2;
}	
#imgContent.alignLeft .order-1 {order: 2;}
#imgContent.alignLeft .order-2 {order: 1;}	
}
/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 1) {

}

/* Portrait */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1) {

}

/* Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 1) {

}
@media only screen and (max-width:800px), (max-device-width:800px) and (-webkit-min-device-pixel-ratio:1) {
.hideTablet {
	display:none;
}
.showTablet {
	display:block;
}
.mobileBtn {
	display:block;
}  
#mainNav {
	display:none;
}
#logoArea {
    padding: 10px 15px 10px;
}	
#headerBgrd .offset-lg-1 {
    -ms-flex: 0 0 60%;
    flex: 0 0 60%;
    max-width: 60%;
}
body {
    font-size: 17px;
    line-height: 30px;
}	
h3.main-title {
    font-size: 42px;
    line-height: 42px;
}
.subheading {
    font-size: 19px;
    line-height: 24px;
}
.subtitle {
    font-size: 25px;
    line-height: 30px;
}	
h1 {
    font-size: 36px;
    line-height: 38px;
}	
h5 {
    font-size: 20px;
    line-height: 23px;
}
h3.catTitle {
    font-size: 35px;
    line-height: 38px;
}	
#headerBgrd .pageTitle {
    max-width: 396px;
}	
#headerBgrd.headHalf .layerTwo {
    background-position: 121% bottom;
}
#headerBgrd.headHalf .layerTwo {
    background-size: 80%;
}	
#headerBgrd.headHalf .layerTwo {
    background-position: 145% bottom;
}
#headerBgrd .content {
    font-size: 16px;
    line-height: 25px;
}	
#headerBgrd .offset-lg-1 {
    -ms-flex: 0 0 80%;
    flex: 0 0 80%;
    max-width: 80%;
}	
.page-template-homepage #imgContent.alignLeft.standard {
    background-position: -66% 214%;
    background-size: 105%;
}	
.page-template-homepage #headerBgrd.headHalf .layerTwo {
    background-position: 113% bottom;
}	
.page-template-homepage #headerBgrd .pageTitle {
    max-width: unset;
    padding-bottom: 80px;
}	
.bgrdWave {
	height: 59px;	
    background-size: 150%;
}
.bgrdWave.top.green {
    margin-top: -56px;
    margin-bottom: -2px;
}
.bgrdWave.bottom.light-teal {
    margin-top: -5px;
}
.bgrdWave.bottom.green {
    margin-bottom: 150px;
}
.bgrdWave.top.white {
    margin-bottom: -55px;
}
.bgrdWave.top.light-teal, .page-template-homepage .bgrdWave.top.purple,
.bgrdWave.top.light-blue {
    margin-bottom: -2px;
}
.bgrdWave.bottom.purple {
    margin-top: -2px;
}
.page-template-homepage .bgrdWave.top.purple {
    margin-top: -12px;
}
.bgrdWave.top.purple {
    margin-top: -51px;
}
.page-template-homepage .bgrdWave.bottom.green {
    margin-bottom: 150px;
}	
#pageMenu ul.feat-container.col4 li {
    width: 48%;
    margin-bottom: 10px;	
}	
ul.feat-container li.itemBox {
    width: 24%;
}
ul.blogList.col3 li {
    width: 48%;
    margin-bottom: 20px;	
}
ul.blogList .overlayColor em {
    font-size: 22px;
    line-height: 22px;
}	
#calloutArea .intro, #calloutArea h3.main-title {
    width: 85%;
}	
#secondaryArea .imgArea img {
        max-width: 150px;}	
#secondaryArea.postWidth .intro {
    width: 80%;
}	
#secondaryArea.dividerYes {
    background-position: 227% 181%;
    background-size: 68%;
}
#newsArea .intro {
    width: 78%;
}
#imgContent img.mainImg {
    max-width: 400px;
}	
.page-template-homepage #newsArea.mainContent {
    background-position: -29px top;
    padding-bottom: 60px;
    background-size: 66%;
}	
ul.feat-container.col4 li {
    width: 48%;
	margin-bottom: 5px;
}
#pageMenu ul.feat-container.col5 li {
    width: 31.5%;
}
#pageMenu ul.feat-container li .botBox h4 {
    font-size: 24px;
    line-height: 26px;
}	
#teamSingle {
    padding-left: 50px;
    padding-right: 50px;
}	
#faqArea {
    background-position: -51px 147%;
    padding-bottom: 114px;
    background-size: 60%;
}	
#faqArea .container {
    max-width: inherit;
}	
#map_canvasR {
    height: 510px;
}	
#mapArea table h3.main-title, #mapContent table h3.main-title {
        font-size: 71px;
        line-height: 71px;
}
#mapArea table td, #mapContent table td {
    padding: 0 8px 0;
}
#locArea .col-lg-5 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
    padding: 0 12%;
}	
#locArea .col-lg-7 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
    margin-top: 50px;
    padding: 0 12%;
}
table.locPeeps td:last-child {
    width: 46%;
}	
.single-service #mainContent .col-md-8,
.single-service #mainContent .col-md-4 {
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
 }	
.single #newsArea ul.blogList li:nth-child(3) {
    display: none;
}
.single #newsArea ul.blogList li {
    width: 48%;
}
.single-service #faqArea .col-lg-4 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
    order: 2;
    display: none;	
}	
.single-service #mainContent, .single-service #faqArea {
    padding-left:0;
    padding-right: 0;
}	
.single-service #faqArea .col-md-8 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
    order: 1;
}	
#footerArea .col-md-6 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}	
.ftLogo {
    text-align: center;
    margin-bottom: 0;
    margin: 50px 0 20px;
}	
#colFirst .ltText, #footerArea .rtText, #footerArea .footer-widget-2.ltText {
    text-align: center;
}	
.textwidget img {
    text-align: center;
    float: none;
    margin: 0 auto;
}	
#colThird, #copyrightContent.col-md-5 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}	
#copyrightContent {
    padding: 30px 15px;
}	
#footerArea {
    padding-left: 80px;
    padding-right: 80px;
}	
.page-template-homepage #newsArea ul.blogList {
    padding: 0 7%;
}	
#testimonial.noPadBoth .mainImg {
    margin-bottom: 0;
    z-index: 200;
    position: relative;
    max-width: 344px;
}	
#testimonial .wrapper {
    padding: 0 8% 0;
}	
#testimonial .content img {
    margin-bottom: 10px;
    max-width: 245px;
}	
#testimonial .col-md-6 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}	
.bgrdWave.top.white-shadow, .bgrdWave.top.white-dark-blue-shadow, .bgrdWave.top.teal-shadow {
    height: 70px;
    margin-top: -61px;
    margin-bottom: -8px;
}	
.page-template-homepage #imgContent.alignRight.standard {
    background-position: -156% bottom;
    background-size: 111%;
}	
 #single.lsPage #headerBgrd img.mainImg {
    padding: 200px 0;
}	
.lsPage #headerBgrd .overContent .content {
    font-size: 18px;
    line-height: 25px;
    margin-top: 10px;
}	 
.lsPage #headerBgrd .overContent .bigTitle {
    font-size: 33px;
    line-height: 35px;
}
#single.pageLanding #servicesListing ul.basicList li,
 #single.lsPage #secondaryArea ul.basicList li {
    width: 33.33%;
}
.pageLanding #imgContent .topTitles .subtitle, 
.lsPage #imgContent .topTitles .subtitle {
    font-size: 28px;
    line-height: 30px;
}	
	
}
@media only screen and (max-width: 640px),
screen and (max-device-width: 640px) 
  and (-webkit-min-device-pixel-ratio: 1){
ul > li, ol > li {
    margin: 0px 0 0 30px;
    padding: 9px 0 0;
    font-size: 16px;
    line-height: 18px;
}	  
h1 {
    font-size: 40px;
    line-height: 42px;
}
h3.main-title {
    font-size: 37px;
    line-height: 39px;
}
.bigTitle {
    font-size: 36px;
    line-height: 40px;
}	  
#single h1.entry-title, .single-service h3.main-title, .single-location h3.main-title {
    font-size: 35px;
    line-height: 38px;
}	  
.bgrdWave {
    height: 57px;
    background-size: 183%;
}
.bgrdWave.top.white {
    margin-bottom: -49px;
}	  
#headerBgrd .offset-lg-1 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}	
#headerBgrd .pageTitle {
    max-width: 100%;
}	
#headerBgrd.headHalf .layerTwo {
    background-size: 100%;
}	
#headerBgrd.headHalf img.mainImg {
    padding: 220px 0;
}	
#headerBgrd .pageTitle {
    padding-bottom: 50%;
}
#headerBgrd.headStandard .pageTitle,
#headerBgrd.headSubpage .pageTitle  {
    padding-bottom: 25%;
}	  
.page-template-homepage #headerBgrd.headHalf img.mainImg {
    padding: 280px 0;
}	  
.page-template-homepage #headerBgrd .pageTitle {
    max-width: unset;
    padding-bottom: 40%;
}
.page-template-homepage #headerBgrd.headHalf .layerTwo {
	background-position: 110% bottom;
}
.page-template-homepage #headerBgrd.headHalf .layerTwo {
	background-size: 75%;
}
.page-template-homepage #imgContent.alignLeft.standard {
    background-position: -10% 190%;
    background-size: 132%;
}	  
ul.feat-container li .iconImg img {
    max-height: 80px;
}	  
#headerBgrd.headHalf .bgrdBtn {
    max-width: 286px;
    padding: 0 24px;
    margin: 17px 10px;
}	
.page-id-8584 #headerBgrd.headHalf .bgrdBtn {
    max-width: 349px;
}	  
#secondaryArea.postWidth.indYes .intro {
    padding: 80px 30px 30px 30px;
}	
#secondaryArea .imgArea img {
    float: none;
    text-align: center;
    margin: 0 auto -75px;
}	
#secondaryArea.dividerYes {
  background-position: 227% 130%;
}	
.page-template-homepage #newsArea.mainContent {
    background-position: -29px 5%;
}	
.page-template-homepage #newsArea ul.blogList {
    padding: 0 2%;
}
ul.list-columns.col2 > li {
    width: 99%;
}	  
#locArea .col-lg-5, #locArea .col-lg-7 {
    padding: 0 4%;
}
#pageMenu ul.feat-container.col5 li {
    width: 48%;
}
ul.feat-container li .botBox h4 {
    font-size: 24px;
    line-height: 27px;
}
ul.feat-container li .botBox .subtitle {
    font-size: 16px;
    line-height: 20px;
}	
#secondaryArea.postWidth .intro {
    width: 90%;
}
#testimonial h3.main-title {
    font-size: 33px;
    line-height: 35px;
}
#testimonial p {
    font-size: 17px;
    line-height: 25px;
}	
#newsArea h3.main-title {
    font-size: 32px;
    line-height: 38px;
} 
#serviceArea .serviceList ul.basicList li {
    width: 32.5%;
}
ul.locDets li {
    font-size: 16px;
    line-height: 19px;
}	  
.locList h6 a {
    font-size: 23px;
    line-height: 24px;
}
#mapContent .wrapper h3 {
    font-size: 37px;
    line-height: 40px;
}	  
article.locList {
    padding: 0 10px;
}	  
#footerArea {
    background-size: 29%;	
    padding-left: 30px;
    padding-right: 30px;
}
ul.blogList li .botBox .btnOutline {
    padding: 9px 15px 10px;
}
.ftCopy {
    font-size: 38px;
    line-height: 40px;
}	  
.ftCopy span {
    font-size: 24px;
    line-height: 26px;
}	
ul.feat-container li.itemBox {
    width: 32%;
}
ul.feat-container li.itemBox .wrapIt {
    padding: 15px;
}	
#pageMenu ul.feat-container.col3 li {
    width: 48%;
}
.lsPage #headerBgrd .overContent span {
    padding: 0;
    display: block;
    background-color: rgba(34, 133, 250, 0);
}
#single.lsPage #headerBgrd .overContent {
    background-color: rgba(34, 133, 250, 0.7);
}
#single.lsPage #headerBgrd .col-lg-6 {
    -ms-flex: 0 0 70%;
    flex: 0 0 70%;
    max-width: 70%;
}	
.lsPage #headerBgrd .overContent .bigTitle {
    font-size: 27px;
    line-height: 35px;
}
.lsPage #headerBgrd .overContent .content {
    font-size: 17px;
    line-height: 24px;
}
#single.pageLanding #servicesListing ul.basicList li,
#single.lsPage #secondaryArea ul.basicList li {
    width: 50%;
}	  
      .searchArea {
          padding: 0 0 60px;
      }
}
@media only screen and (max-width: 600px),
screen and (max-device-width: 600px) 
  and (-webkit-min-device-pixel-ratio: 1) {
table.locPeeps td:last-child {
    width: 49%;
}
.single-service .bgrdBtn {
    padding: 10px 0px;
}
.page-template-homepage #imgContent.alignLeft.standard {
    background-position: -10% 143%;
    background-size: 132%;
}	  
}