@charset "UTF-8";
* {font-size: 1em; -webkit-tap-highlight-color: rgba(0, 0, 0, 0);}

*, *:before, *:after {
    box-sizing: inherit;
}
*{
-webkit-overflow-scrolling: touch;
}
body { 
width: 100%;
height: 100%;
overflow: auto;
margin:0;
padding:0;
font-family: 'Alegreya', serif;
color: #8a7f7b;
word-wrap: break-word;
}
.content {
/*padding: 10px 15vw;
margin-bottom: 100px;*/
}
html {
width: 100%;
height: 100%;
overflow: auto;
margin: 0;
padding: 0;
background: url(i/m_img_bkgd_site.jpg) 0 -100px no-repeat fixed;
box-sizing: border-box;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='i/img_bkgd_site.jpg', sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='i/img_bkgd_site.jpg', sizingMethod='scale')";
}
p { }
td { }
.sc{font-size: 1em;
font-weight: 400;
font-family: 'Alegreya SC', serif;
color: #8a7f7b;
}
h1 { 
color: #ca1322;
font-size: 30px;
font-family: 'Montserrat', trebuchet ms, tahoma, arial;
font-weight: 700;
font-style: normal;
line-height: 50px;
text-transform: uppercase;
padding-top: 8px;
background: url(i/m_title_eyebrow.png) no-repeat;
text-align: left;
margin-top:10px;
}
h2 { 
color: #666666;
font-size: 26px;
font-family: 'Montserrat', trebuchet ms, tahoma, arial;
font-weight: 700;
font-style: normal;
line-height: 2px;
text-transform: uppercase;
text-align: left;
}
h3 { 
color: #fff;
font-size: 24px;
font-family: 'Alegreya SC', serif;
font-weight: 400;
font-style: normal;
line-height: 30px;
text-align: left;
margin-top: -20px;
padding-bottom: 30px;
}
h4 { 
color: #fff;
font-size: 24px;
font-family: 'Alegreya SC', serif;
font-weight: 400;
font-style: normal;
line-height: 10px;
text-align: left;
margin-top: -20px;
padding-bottom: 30px;
}
a:link {
color: #0b5577;
font-size: 26px;
font-family: 'Montserrat', trebuchet ms, tahoma, arial;
font-weight: 600;
font-style: normal;
text-transform: none;
text-decoration: none;
}
a:visited {
color: #0b5577;
font-size: 26px;
font-family: 'Montserrat', trebuchet ms, tahoma, arial;
font-weight: 600;
font-style: normal;
text-transform: none;
text-decoration: none;
}
a:focus { 
color: #CA1322;
font-size: 26px;
font-family: 'Montserrat', trebuchet ms, tahoma, arial;
font-weight: 600;
font-style: normal;
text-transform: none;
text-decoration: none;
outline: none !important;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}



/* Masthead */
#mast-outer-wrapper{
width: 100%;
height: auto;
background-color: #ffffff;
position: fixed;
float: left; 
display: inline-block;
z-index: 999;
-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.4); 
box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.4);
}
#mast-top-bar{
width:100%;
height: 22px;
background-image: url(i/m_mast-palette.png);
background-position: -80px 0px;
background-repeat: no-repeat;
background-color: #CA1322;
}
#mast-logo-wrapper{
background-color: #CA1322;
width: 280px; 
height: 110px;
float: right; 
}
#mast-logo{
width: 300px; 
height: 120px;
background-image: url(i/m_mast-logo.png);
background-position: center 24px;
background-repeat: no-repeat;
}
#mast-info{
width: 100px;
height: 62px;
margin-top: 20px;
margin-left: 66px;
float: left;
padding-top: 10px;
background-image: url(i/m_ico_info.png);
background-repeat: no-repeat;
}
.info-button{
background-image: url(i/m_ico_info.png);
background-repeat: no-repeat; 
background-position: 0px 0px;
-moz-transition: all 0.2s ease; 
-ms-transition: all 0.2s ease; 
-o-transition: all 0.2s ease; 
-webkit-transition: all 0.2s ease; 
transition: all 0.2s ease;
outline:none !important;
}
.info-button:hover{
background-image: url(i/m_ico_info.png);
background-repeat: no-repeat; 
background-position: 0px -440px;
-moz-transition: all 0.2s ease; 
-ms-transition: all 0.2s ease; 
-o-transition: all 0.2s ease; 
-webkit-transition: all 0.2s ease; 
transition: all 0.2s ease;
outline:none !important;
}
.info-button:active{
background-image: url(i/m_ico_info.png);
background-repeat: no-repeat; 
background-position: 1px 8px;
-moz-transition: all 0.2s ease; 
-ms-transition: all 0.2s ease; 
-o-transition: all 0.2s ease; 
-webkit-transition: all 0.2s ease; 
transition: all 0.2s ease;
outline:none !important;
}
#info-wrapper { 
position: absolute; 
float: left; 
width: 86vw; 
height: 100px;
	padding-top: 100px;
z-index: 500; 
display: none;
background-color: #fff;
-moz-box-shadow: #000000 0px 40px 40px;
-webkit-box-shadow: #000000 0px 40px 40px;
box-shadow: #000000 0px 40px 40px;
}
#contact{
width: 555px;
height: auto;
margin-left: 80px;
margin-top: 280px;
float: left;
color: #8a7f7b;
text-align: left;
display: inline-block;
font-size: 36px;
}
#general-email{
width: auto;
height: 40px;
float: left;
background: url(i/m_ico_email.png) 0 8px no-repeat;
margin-top: 18px;
border: 0px;
font-size: 26px; 
font-family: 'Montserrat', trebuchet ms, tahoma, arial; 
font-weight: 600; 
color: #0b5577;
font-style: normal;
text-transform: uppercase;
text-decoration: none;
text-indent: 46px;
outline:none !important;
}
#btn-close{
height: 100px;
width: 100px;
margin-top: 100px;
margin-right: 40px;
float: right;
background-image: url(i/m_ico_btn-close.png);
background-repeat: no-repeat; 
}
.close{
-webkit-transition-duration: 0.4s;
-moz-transition-duration: 0.4s;
-o-transition-duration: 0.4s;
transition-duration: 0.4s;
-webkit-transition-property: -webkit-transform;
-moz-transition-property: -moz-transform;
-o-transition-property: -o-transform;
transition-property: transform;
}
.close:active{
-ms-transform: rotate(180deg);
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
.close:hover{
-ms-transform: rotate(180deg);
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
#btn-to-top{
width: 200px; 
height: 46px;
float: left;
outline:none !important;
}
.btn-top{
background-image: url(../i/ico_to-top.png); 
background-repeat: no-repeat; 
background-position: 123px 12px;
-moz-transition: all 0.1s ease; 
-ms-transition: all 0.1s ease; 
-o-transition: all 0.1s ease; 
-webkit-transition: all 0.1s ease; 
transition: all 0.1s ease;
outline:none !important;
}
.btn-top:hover{
background-image: url(../i/ico_to-top.png); 
background-repeat: no-repeat; 
background-position: 123px -493px;
-moz-transition: all 0.1s ease; 
-ms-transition: all 0.1s ease; 
-o-transition: all 0.1s ease; 
-webkit-transition: all 0.1s ease; 
transition: all 0.1s ease;
outline:none !important;
}
.btn-top:active{
background-image: url(../i/ico_to-top.png); 
background-repeat: no-repeat; 
background-position: 123px -500px;
outline:none !important;
}



/* Sections */
#section-01{
width: 100%;
height: 1500px;
margin-bottom: 200px;
z-index: 10;
position: relative;
background: url(i/m_img_home-overlay.png) 0 -60px no-repeat;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='.myBackground.jpg', sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='myBackground.jpg', sizingMethod='scale')";
}
#section-02{
width: 100%;
height: auto;
text-align: center;
background: #fff;
border-top: 6px solid #b2a8a4;
}
#section-02-inner-wrapper {
width: 100%; 
height: auto;
margin: 0 auto;
display: inline-block;
}
#section-02-inner-top{
width: auto;
height: auto;
float: left;
padding-top: 40px;
margin-bottom: 100px;
display: inline-block;
}
#section-02-inner-bottom{
width: 100%;
height: auto;
background-color: #fff;
float: left;
display: inline-block;
}
#cca-overview{
width: 100%;
height: auto;
padding-left: 60px;
padding-right: 100px;
font-size: 2.4em;
font-weight: 400;
font-family: 'Alegreya', serif;
line-height: 56px;
color: #8a7f7b;
text-align: left;
margin-top: 60px;
display: inline-block;
}
#section-03{
width: 100%;
height: auto;
background: #fff;
text-align: center;
border-bottom: 80px solid #fff;
}
#section-03-inner-wrapper{
width: 640px; 
height: auto;
padding-top: 180px;
padding-bottom: 40px;
float: left;
margin-left: 60px;
display: inline-block;
}
#section-04{
width: 100%;
height: auto;
background: #fff;
text-align: center;
border-bottom: 80px solid #fff;
}
#section-05{
width: 100%;
height: auto;
background: #fff;
text-align: center;
border-bottom: 80px solid #fff;
}
#section-06{
width: 100%;
height: auto;
background: #fff;
text-align: center;
border-bottom: 80px solid #fff;
}
#section-07{
width: 100%;
height: auto;
background: #fff;
text-align: center;
border-bottom: 80px solid #fff;
}
#section-08{
width: 100%;
height: auto;
background: #fff;
text-align: center;
padding-bottom: 200px;
border-bottom: 80px solid #fff;
}
#section-08-inner-wrapper{
width: 700px; 
height: auto;
padding-top: 180px;
padding-bottom: 40px;
float: left;
margin-left: 60px;
display: inline-block;
}
#section-09{
width: 100%;
height: auto;
background: #fff;
text-align: center;
border-bottom: 80px solid #fff;
}

/* Spacer */
#spacer{
width: 100%;
height: 300px;
text-align: center;
background: #B2A8A4;
}

/* More about CCA */
#section-10{
width: 100%;
height: auto;
text-align: center;
background: #fff;
overflow: visible;
font-size: 34px;
font-weight: 400;
font-family: 'Alegreya', serif;
line-height: 46px;
}
#about-cca-wrapper{
width: 100%; 
height: auto;
margin: 0 auto;
display: inline-block;
}
#image-christine{
width: 390px; 
height: 745px;
float: left;
margin-top: -60px;
border-top: 60px solid #CA1322;
border-bottom: 8px solid #CA1322;
background-image: url(i/m_img_christine.jpg);
background-repeat: no-repeat;
}
#cca-contact-christine{
width: 555px;
height: auto;
padding-left: 20px;
padding-top: 60px;
color: #8a7f7b;
text-align: left;
display: inline-block;
}
#christine-email{
width: auto;
height: 40px;
float: left;
background: url(i/m_ico_email.png) 10px 12px no-repeat;
margin-top: 18px;
padding-left: 22px;
border: 0px;
font-size: 22px; 
font-family: 'Montserrat', trebuchet ms, tahoma, arial; 
font-weight: 600; 
color: #0b5577;
font-style: normal;
text-transform: uppercase;
text-decoration: none;
text-indent: 46px;
outline:none !important;
}
#cca-areasofpractice{
width: 100%;
height: auto;
padding-top: 100px;
color: #8a7f7b;
text-align: left;
display: inline-block;
padding-left: 60px;
padding-right: 60px;
}
ul.list {
list-style-position: outside;
/*margin-left: -25px;*/
margin-top: 8px;
}
#cca-design-locations{
width: 100%;
height: auto;
padding-top: 60px;
padding-left: 60px;
padding-right: 60px;
color: #8a7f7b;
text-align: left;
display: inline-block;
}
#list-arizona{
height: auto;
width: 35vw;
float: left;
margin-top:40px;
}
#list-new-mexico-utah{
height: auto;
width: auto;
float: left;
margin-left: 50px;
margin-top:40px;
}
#section-11{
width: 100%;
height: 60px;
}
#section-12{
width: 100%;
height: 1300px;
padding: 0;
z-index: 15;
background: url(i/m_img_sculpture-sanctuary.png) no-repeat center center;
/*-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;*/
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='i/img_sculpture-sanctuary.png', sizingMethod='scale');
-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='i/img_sculpture-sanctuary.png', sizingMethod='scale')";
}



/* Footer */
#footer-wrapper{
width: 100%;
height: auto;
float: left;
margin-top: 140px;
background-image: url(i/m_img_footer_blend.png);
background-position: 0px -140px;
background-repeat: repeat-x;
padding-bottom: 200px;
overflow: visible;
}
#footer-copyright-bar{
width: 800px;
height: 50px;
float: left;
padding-top: 20px;
background-image: url(i/m_img_footer_bar.png);
background-position: -300px 0;
background-repeat: no-repeat;
overflow: visible;
}
#footer-copyright{
width: auto;
height: auto;
float: left;
color: #B2A8A4;
margin-top: 12px;
margin-left: 520px;
font-size: 16px;
font-family: 'Montserrat', trebuchet ms, tahoma, arial;
font-weight: 700;
font-style: normal;
text-transform: uppercase;
}
#footer-close{
width: 280px;
height: 60px;
float: right;
margin-top: 80px;
margin-bottom: 30px;
background-image: url(i/m_img_footer_close.png);
background-position: 0 0;
background-repeat: no-repeat;
overflow: visible;
}




/* Carousels / Sliders */
.slide-overview-wrapper{
width: 100%;
height: auto;
text-align: center;
background-color: #CA1322;
}
.slide-overview{
width: 1100px;
height: auto;
margin-top: 200px;
margin-bottom: 200px;
text-align: left;
background-color: rgba(202, 19, 34, .8);
color: #fff;
font-size: 24px;
font-weight: 400;
font-family: 'Alegreya', serif;
line-height: 30px;
}

.project-text{
width: auto;
height: auto;
margin-top: 5vh;
margin-left: 13vw;
margin-right: 13vw;
font-size: 28px;
font-weight: 400;
font-family: 'Alegreya', serif;
line-height: 36px;
color: #fff;
text-align: left;
display: inline-block;
}

.slider,
.slider > div {
    /* Images default to Center Center. Maybe try 'center top'? */
    background-position: center top;
    display: block;
    width: 90vw;
    height: 800px; /* height: 100vh; *//* If you want fullscreen */
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    background-color: #8A7F7B;
    overflow: hidden;
    margin-left: -45vw;
    left: 50%;
    -moz-transition: transform .3s;
    -o-transition: transform .3s;
    -webkit-transition: transform .3s;
    transition: transform .3s;
}
.slider > div {
position: absolute;
}
.slider > i {
color: #5bbd72;
position: absolute;
font-size: 60px;
margin: 20px;
top: 40%;
text-shadow: 0 10px 2px #223422;
transition: .3s;
width: 30px;
padding: 10px 13px;
background: #fff;
background: rgba(255, 255, 255, .3);
cursor: pointer;
line-height: 0;
box-sizing: content-box;
border-radius: 3px;
z-index: 4;
}
.slider > i svg {
margin-top: 3px;
}
.slider > .left {
left: -100px;
}
.slider > .right {
right: -100px;
}
.slider:hover > .left {
left: 0;
}
.slider:hover > .right {
right: 0;
}
.slider > i:hover {
background:#fff;
background: rgba(255, 255, 255, .8);
transform: translateX(-2px);
}
/*.slider > i.right:hover {
transform: translateX(2px);
}
.slider > i.right:active,
.slider > i.left:active {
transform: translateX(-2px);
}
.slider:hover > div {
transform: scale(1.01);
}*/
.hoverZoomOff:hover > div {
transform: scale(1);
}
.slider > ul {
position: absolute;
bottom: 20px;
left: 50%;
z-index: 4;
padding: 0;
margin: 0;
transform: translateX(-50%);
}
.slider > ul > li {
padding: 0;
width: 9px;
height: 9px;
border-radius: 50%;
list-style: none;
float: left;
margin: 4px 4px 0;
cursor: pointer;
border: 1px solid #fff;
-moz-transition: .4s;
-o-transition: .4s;
-webkit-transition: .4s;
transition: .4s;
}
.slider > ul > .showli {
background-color: #CA1322;
-moz-animation: boing .2s ease-in-out;
-o-animation: boing .2s ease-in-out;
-webkit-animation: boing .2s ease-in-out;
animation: boing .2s ease-in-out;
}
.slider > ul > li:hover {
background-color: #B2A8A4;
}
.slider > .show {
z-index: 1;
}
.hideDots > ul {
display: none;
}
.showArrows > .left {
left: 0;
}
.showArrows > .right {
right: 0;
}
.titleBar {
z-index: 2;
display: inline-block;
background: rgba(35,27,25,.7);
position: absolute;
width: 100%;
bottom: 0;
left: 0;
/*transform: translateY(100%);*/
padding: 0 6vw;
transition: .3s;
color: #fff;
	padding-top: 20px;
border-top: 2px rgba(255, 255, 255, .3);
-ms-transform: rotate(6deg); /* IE 9 */
-webkit-transform: rotate(6deg); /* Safari prior 9.0 */
transform: rotate(6deg) translateY(100%); /* Standard syntax */
}
.titleBar * {
transform: translate(20px, 0px);
transition: all 200ms 200ms;
opacity: 0;
}
.titleBarTop .titleBar * {
transform: translate(0px, -30px);
}
.slider:hover .titleBar,
.slider:hover .titleBar * {
transform: translate(0);
opacity: 1;
}
.titleBarTop .titleBar {
top: 0;
bottom: initial;
transform: translateY(-100%);
}
.slider > div span {
display: block;
background: rgba(0,0,0,.5);
position: absolute;
bottom: 0;
color: #fff;
text-align: center;
padding: 0;
width: 100%;
}
@keyframes boing {
0% {
transform: scale(1.2);
}
40% {
transform: scale(.6);
}
60% {
transform: scale(1.1);
}
80% {
transform: scale(.8);
}
100% {
transform: scale(1);
}
}