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

/* ---------------------------------------------------------------------------------------------------- */
/* --- Basic Elements --------------------------------------------------------------------------------- */
/* ---------------------------------------------------------------------------------------------------- */


/*---------------------------------------------------------------------------------------------*/
/*------------- iPad Tablet -------------------------------------------------------------------*/
/*---------------------------------------------------------------------------------------------*/
@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;
}
#mainNav {
	display:none;
}*/
}
/* 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),
screen and (max-device-width: 800px) 
  and (-webkit-min-device-pixel-ratio: 1){
  
#logoArea.down.clone .logoImg:after {
    background-size: 75%;
}
.container {
    max-width: 720px;
}
#sliderArea .sliderContent {
    transform: translate(0%, 70%);
}
#footerArea .col-md-4 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
    text-align: center;
}	  
#footerArea .container, #logoArea .container {
    max-width: 1000px;
}	  
#badgeArea {
    padding: 15px 15%;	
}	
.ftLogo {
    text-align: center;
}
#colThird {
    text-align: center;
}
#footerArea ul.socialIcons {
    margin: 20px 0;
}

#footerArea .widget-area {
    font-size: 15px;
    line-height: 17px;
}
#footerArea .order-2 {
    -ms-flex-order: 3!important;
    order: 3!important;
}
#footerArea .order-3 {
    -ms-flex-order: 2!important;
    order: 2!important;
}
  
#badgeArea {
    margin-top: 25px;
}	  
/* --- Navigation --------------------------------------------------------------------------------- */   
a.btnMobile {
    width: 36px;
}
#sliderArea p {
    font-size: 20px !important;
    line-height: 20px !important;
} 
/* --- Featured Area --------------------------------------------------------------------------------- */  
#featuredArea .col-lg-12 {
	line-height: 0;
}
#featuredArea ul.feat-container li .responsiveFeat {
    display: block;
}

ul.feat-container, .woocommerce ul.products, .woocommerce-page ul.products {
    margin: 0px -.5% 10px
}	  
.subheading {
    font-size: 20px;
    line-height: 28px;
}
ul.feat-container.col5 > li {
    width: 49%;
}	  
/* --- Type Area --------------------------------------------------------------------------------- */
ul.feat-container li .botBox h4 .pageDesc {
    font-size: 16px;
    line-height: 22px;
}
h2 {
    font-size: 45px;
    line-height: 45px;
}	  
h3, h1.entry-title {
    font-size: 35px;
    line-height: 35px;
}	  
h4 {
    font-size: 26px;
    line-height: 26px;
}
h5 {
    font-size: 17px;
    line-height: 21px;
}
h6 {
    font-size: 17px;
    line-height: 17px;
}
#headerBgrd .bigTitle {
    font-size: 60px;
    line-height: 60px;
}  
.mainContent {
    padding: 60px 0;
}
.bigTitle {
    font-size: 38px;
    line-height: 40px;
}
.bigSubtitle {
    font-size: 26px;
    line-height: 28px;
}
.dividerYes:before {
    padding: 50px 0 0;
}
ul.col4.basicList li {
    width: 49%;
    font-size: 20px;
    line-height: 27px;
}
ul.col4.basicList li:nth-child(n+3) {
    margin-top: 60px;
}
ul.feat-container.col3 > li {
    width: 49%;
}	  
ul.basicList li {
    padding: 0 3%;
}
ul.storyList li {
    width: 48.33%;
}	  
#itemArea ul.itemList {
    columns: 2;
    -webkit-columns: 2;
    -moz-columns: 2;
}
#single #mainContent.smallTop {
    padding-top: 40px;
}
.wpcf7-form {
    margin-top: 10px;
}
.wpcf7-select {
    height: 41px;
}
.sliderBar ul.basicList {
    width: 100%;
}
.intro .content table thead th {
    font-size: 11px;
    line-height: 11px;
}
#staffArea h5 {
    font-size: 26px;
    line-height: 28px;
}
.home ul.blogList.col3 li.news1 {
    margin-right: 20px;
    padding-right: 20px;
}	  
/* --- News Area --------------------------------------------------------------------------------- */
.post-thumbnail {
    margin-top: 0;
    text-align: center;
}
.single-team .post-thumbnail {
    margin-top: 20px;
}
.single-team .post-thumbnail img {
    margin: 0 auto;
    width: 45%;
}
#featuredArea ul.feat-container.col4 li {
    width: 42%;
}
/* --- Callout Area --------------------------------------------------------------------------------- */
#calloutArea .col-lg-5 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}
/* --- Footer Area --------------------------------------------------------------------------------- */
.ftCopy {
    padding: 25px 10%;
}
#footerArea .widget-area span {
    padding: 0 15px;
    color: #4A4A4D;
    display: block;
    font-size: 0;
    line-height: 4px;
}
#footerArea .widget-area {
    font-size: 16px;
    line-height: 26px;
}
/* --- Gallery Area --------------------------------------------------------------------------------- */
ul.photoList.col4 li, ul.photoList.col5 li {
    width: 33.1%;
}
ul.photoList .overlay i {
    font-size: 30px;
}	  
/* --- Testimonials Area --------------------------------------------------------------------------------- */
#testimonial .bgrdColor {
    padding: 70px 50px;
}
/* --- Team Area --------------------------------------------------------------------------------- */
ul.team-container.col5 li {
    width: 33.1%;
}
.memberTitle {
    font-size: 17px;
    line-height: 17px;
}
#importantMessage .alert-danger {
    padding: 5px 8%;
}
.alert-dismissible .close {
    margin: 0;
    padding: 12px 10px;
}	  
ul.feat-container li a span.overContent h4 span {
    padding: 5px 14px;
}
ul.feat-container li a span.overContent h4, ul.feat-container.col5 li h4 {
    padding: 0 2%;
}
#featuredArea h4 {
    font-size: 24px;
    line-height: 1em;
    margin-bottom: 0px;
}
#featuredArea ul.feat-container.col3 li {
    width: 31%;
}
ul.feat-container {
    margin: .5% 0%;
}
#sliderArea:after {
    left: 6vw;
    bottom: -170px;
}
ul.feat-container li a span.overContent h6 {
    display: none;
}
#calloutArea .innerCircle {
    clip-path: circle(55% at 50% 50%);
    background-color: #f1a566;
}
#calloutArea .outerCircle {
    clip-path: circle(59% at 50% 50%);
    background-color: #ee954b;
}
#imgContent .subtitle:after {
    margin: 20px auto 20px 0;
}
#accredBgrd h4 {
    font-size: 38px;
    line-height: 1em;
}
#footerArea .newsSignUp .col-lg-5 {
    display: flex;
    justify-content: center;
}
#footerArea .container.signup {
    max-width: 720px;
}
#footerArea .order-2, #footerArea .order-3 {
    align-items: flex-start;
}
#footerArea .order-2 .widget-area, #footerArea .order-3 .widget-area {
    margin-top: 25%;
}
#footerArea .row {
    padding-bottom: 25px;
}
#footerArea .row.footer,
#footerArea .row.signup {
    padding-bottom: 0px;
}
#featuredArea {
    padding: 100px 0 60px;
}
#logoArea .navLogo {
    height: 19vw;
    width: 30vw;
}
#sliderArea .sliderBox {
    height: 34vw;
    width: 34vw;
    transform: translate(-13%, -6%);
}
#staffArea ul.col5 li {
    width: 29.7%;
}
#highlightArea ul.basicList li {
    height: 530px;
    width: 530px;
}
#highlightArea ul.basicList li:nth-child(even) {
    margin: 5% 0 5% auto;
}
#highlightArea ul.basicList li:nth-child(2),
#highlightArea ul.basicList li:nth-child(3) {
    height: 450px;
    width: 450px;
}
#highlightArea ul.basicList li .highContent {
    padding-top: 25px;
}
#secondaryArea h2 {
    font-size: 45px;
    line-height: 45px;
}
#headerBgrd img.mainImg {
    padding: 70px 0;
}
}
@media only screen and (max-width: 640px),
screen and (max-device-width: 640px) 
  and (-webkit-min-device-pixel-ratio: 1){

ul.feat-container.col2 > li {
    width: 96%;
}
#sliderArea:after {
    left: 6vw;
    bottom: -111px;
    width: 29%;
    height: 90%;
}
#sliderArea .sliderBox {
    height: 42vw;
    width: 42vw;
    transform: translate(-28%, -23%);
}
/* --- Type Area --------------------------------------------------------------------------------- */ 
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, .postNav .td2 a, .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: 12px 18px 10px;
    font-size: 17px;
    line-height: 17px;
}
.sliderBar ul.basicList li h3 {
    font-size: 42px;
    line-height: 52px;
}
.sliderBar ul.basicList li h5 {
    font-size: 16px;
    line-height: 20px;
}
.sliderBar ul.basicList {
    margin: 10px 0 7px;
}
#sliderArea p {
    font-size: 18px !important;
    line-height: 18px !important;
}	  
/* --- Contact Area --------------------------------------------------------------------------------- */
#contactArea table.col2,
#contactArea table.col2 tbody,
#contactArea table.col2 tr,
#contactArea table.col2 td {
	display: block;
	width:100%;
}
#imgContent {
    text-align: center;
}	
#imgContent .feat-thumbnail {
    padding: 0;
    display: inline-block;
}	  
/* --- Half Photo Area --------------------------------------------------------------------------------- */
.itemSection .content .wrapper {
    margin-top: 15px;
}
/* --- Page Menu Area --------------------------------------------------------------------------------- */
#pageMenu ul.feat-container li .responsiveFeat {
    display: block;
}
#pageMenu ul.feat-container li .mainFeat {
    display: none;
}
ul.feat-container li a span.overContent h6,
ul.feat-container li a:hover span.overContent h6 {
	display: inline-block;
}
ul.basicList {
    margin: 20px 0;
}	  
/* --- Callout Area --------------------------------------------------------------------------------- */

/* --- Type --------------------------------------------------------------------------------- */
.bigTitle {
    font-size: 35px;
    line-height: 37px;
}
.subheading {
    margin: 15px 0 0 0;
}	  
#testimonial .bgrdColor {
    padding: 60px 45px;
}
#testimonial h4 {
    font-size: 34px;
    line-height: 34px;
}
#featuredArea ul.feat-container.col4 li {
    width: 49%;
}
#calloutArea .content {
    line-height: 25px;
    font-size: 21px;
}
ul.feat-container.col3 li,
#pageMenu ul.feat-container.col4 li {
    width: 49%;
}
hr {
    margin: 40px 25%;
}
.content table td {
	width: 100%;
    display: block;;
}
.content-secondary {
    margin-top: 25px;
}	  
.intro .content table tbody td::before {
    content: attr(data-label);
    color:#005191;
	display: block;
	font-weight: bold;
}  
#imgContent .feat-thumbnail {
    padding: 0 5%;
}
.home ul.blogList.col3 li.news1,
.home ul.blogList.col3 li.news2, .home ul.blogList.col3 li.news3 {
    width: 100%;
    margin-right: 0;
    padding-right: 0;
	border-right: 0px dashed rgba(170, 170, 170, 0.4);
}
.home ul.blogList.col3 li.news2 {
    border-top: 1px dashed rgba(170, 170, 170, 0.4);
	margin-top: 10px;
    padding-top: 20px;	
}	  
#newsArea ul.blogList {
    width: 90%;
	margin: 0 5%;
}
ul.basicList li {
    font-size: 16px;
    line-height: 22px;
}
ul.basicList li img {
    max-width: 70px;
}
ul.basicList li h3 {
    font-size: 50px;
    line-height: 50px;
}
.intro .content table thead {
    display: none;
}
.intro {
    padding-bottom: 20px;
}
ul.storyList li .content {
    font-size: 16px;
    line-height: 23px;
}	
#single #mainContent.mainContent.smallTop {
    padding-top: 20px;
}
#single #mainContent .content {
    margin-top: 0;
}
#newsArea.mainContent {
    padding-top: 50px;
}	  
#featuredArea ul.feat-container.col3 {
    display: inline-block;
}
#featuredArea ul.feat-container.col3:before {
    display: none;
}
#featuredArea ul.feat-container.col3 li {
    width: 52%;
}
#featuredArea ul.feat-container li a.imgLink:before {
    width: 108%;
    height: 108%;
}
.videoWrapper {
    width: 83vw;
    height: calc(83vw * 0.6);
}
h2 {
    font-size: 40px;
    line-height: 40px;
}
#accredBgrd .lshowcase-thumb > div {
    padding: 0 !important;
}
#footerArea .order-1,
#footerArea .order-4 {
    justify-content: center;
}
#footerArea .order-2 .widget-area, 
#footerArea .order-3 .widget-area {
    margin: 15% 0;
}
#footerArea .signupText {
    text-align: center;
    padding: 0px;
}
#footerArea .newsSignUp .row.signup {
    padding: 30px 0;
}
#footerArea .row.footer {
    justify-content: center;
}
#footerArea .row.footer .order-2 {
    justify-content: center;
}
#featuredArea ul.feat-container.col3 li:first-child{
    margin-top: 0;
}
ul.feat-container > li {
    margin: 4% 0%;
}
#footerArea .container.signup .btnsArea {
    margin: 25px 0px 0;
}
}
@media only screen and (max-width: 600px),
screen and (max-device-width: 600px) 
  and (-webkit-min-device-pixel-ratio: 1) {

#logoArea .navLogo {
    height: 20vw;
    width: 32vw;
}
#sliderArea:after {
    left: 5vw;
    bottom: -129px;
}
ul.topNumber li.listPhone {
    display: none;
}  
/* --- Search Bar --------------------------------------------------------------------------------- */
.searchandfilter ul li {
    width: 100%;
	margin: 12px 0 0;
}
.searchandfilter ul li:first-child {
	margin-top: 0px;
}
.searchandfilter ul li.sf-field-submit {
    margin: 0;
    padding-top: 12px;
}
/* --- Featured Area --------------------------------------------------------------------------------- */

#featuredArea ul.feat-container li .mainFeat {
    display: block;
}
#featuredArea ul.feat-container li .responsiveFeat {
    display: none;
}

#pageMenu ul.feat-container li .responsiveFeat {
    display: none;
}
#pageMenu ul.feat-container li .mainFeat {
    display: block;
}
/* --- News Area --------------------------------------------------------------------------------- */
#newsArea, #galleryArea {
    padding-left: 15px;
    padding-right: 15px;
}
ul.photoList.col5 li {
    width: 32%;
}	  
/* --- Callout Area --------------------------------------------------------------------------------- */
#calloutArea .col-lg-5 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
}
/* --- Typography --------------------------------------------------------------------------------- */  
#mainContent .intro, #contactArea .intro {
    width: 100%;
}
body {
    font-size: 16px;
    line-height: 24px;
}
 ul li, ol li {
    line-height: 21px;
}
/* --- Half Photo Area --------------------------------------------------------------------------------- */
.itemSection .content {
    padding: 40px 15px;
}
.itemSection .content .btnsArea {
    margin-top: 15px;
}
/* --- Team Area --------------------------------------------------------------------------------- */
ul.team-container.col5 li {
    width: 49.8%;
}
ul.team-container.col5 li {
    width: 49.4%;
    margin: .3%;
}
#featuredArea ul.feat-container li a.imgLink:before {
    width: 112%;
    height: 112%;
}
#calloutArea .outerCircle {
    clip-path: circle(58% at 50% 50%);
}
#copyrightContent {
    padding: 40px 0 0;
}
}