#wrap { max-width: 1600px; margin: auto; border-left: 1px #003870 solid; border-right: 1px #003870 solid; }

/* HEADER */
header { background-color: #003870; color:white; display: grid; width: 100%;
    grid-template-columns: 50% 50%; }
.h-partnership { text-align: center; font-weight: bold; font-size: 1.5rem;}
#hName { text-transform: none; }
.h-cData { display: inline-block; vertical-align: top; margin: .3rem .9rem 0 0; font-weight: normal; }
#hcCntnr { text-align: center; line-height: 1; }
#hcCntnr:hover #hName { text-transform: uppercase; }
#hcCntnr:hover #hcLine { margin-right: 0; }
#hPhone { cursor: pointer; }
#hPhone:hover > .h-cData { font-weight: bold; margin-right: .5rem; }
#hEmail a { color: white; }
#hEmail:hover .h-cData { font-weight: bold; margin-right: 0; }

/* Generic */
.text-center { text-align: center; }
.margin-b0 { margin-bottom: 0; }
.margin-t0 { margin-top: 0; }
.display-inblck { display: inline-block; }

/* COLUMN 1 */
main { display: grid; width: 100%; grid-template-columns: 50% 50%; }
section { margin: 1rem 2rem 1rem 2rem; line-height: 1.1; }
#c1-title { text-align: center; font-size: 2.5rem; margin-bottom: .6rem; line-height: 1.1; }
#c1-multiPic { display:grid; max-width: 570px; grid-template-columns: 70% 30%; border: 4px black solid; grid-template-rows: 1fr 1fr;
    margin: 1.5rem auto 1.5rem auto; }
#c1-mP1 { grid-row: 1 / 3; grid-column: 1; background-image: url("img/mobile_clinic_2.webp"); background-size: cover; }
#c1-mP2 { grid-column: 2; grid-row: 1; background-image: url("img/puppy_1.webp"); background-size: cover;
    border-left: 4px black solid; border-bottom: 4px black solid; }
#c1-mP3 { grid-column: 2; grid-row: 2; background-image: url("img/dog_owner_1.webp"); background-size: cover; 
    border-left: 4px black solid; }
#c1-descr { width:80%; text-align: left; display: inline-block; }
#c1-addr { display: inline-block; text-align: left; margin-top: 1rem; padding: .2rem; border: solid 2px transparent; }
#c1-addr:hover { border-color: #003870; font-weight: bold; }
#c1-addr div { display: inline-block; vertical-align: top; }
#c1-addr img { margin-right: .5rem; }
#c1-look4 { background-color: #e9f1fe; text-align: center; margin: 1.5rem 0 1rem 0; 
    padding: .5rem; border-radius: .5rem; }
p { margin-top: 0; }
#c1-ndInfoWrap { background-color: #eeee; border-radius: 10px; }
#c1-ndInfoTitle { font-size: 1.3rem; font-weight: bold; text-align: center; cursor: pointer;
    padding: .5rem 1.5rem .5rem 1.5rem; border-radius: 10px; border: 1px #eeee solid; }
#c1-dspTog { padding: 0 1.5rem .5rem 1.5rem; }
#c1-ndInfoTitle:hover { background-color: #e9f1fe; border-color:#003870; }
#c1-ndInfoTitle:hover #c1-chevIcon { transform: scale(1.3); }
#c1-wPicBx { max-width:550px; display:grid; grid-template-columns: 60% 40%; margin: 1rem auto 1.5rem auto; }
#c1-wPic1 { background-image: url("img/Williston_1.jpg"); background-size: cover; }
#c1-wPic2 { background-image: url("img/Williston_2.jpg"); background-size: cover; }
#c1-ndPicBx { max-width:550px; display:grid; grid-template-columns: 1fr 1fr 1fr; margin: 1.5rem auto 1.5rem auto; }
#c1-ndPic1 { background-image: url("img/ND_1.webp"); background-size: cover; }
#c1-ndPic2 { background-image: url("img/ND_2.webp"); background-size: cover; }
#c1-ndPic3 { background-image: url("img/ND_3.webp"); background-size: cover; }
#c1-cCntnr { text-align: left; display: inline-block; font-size: 1.3rem; }
#c1-cCntnr:hover #c1-cName { text-transform: uppercase; }
#c1-cCntnr:hover #c1-cName:after { content: url('data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="24" height="24" viewBox="0 0 24 24"%3E%3Cpath fill="currentColor" d="M19 3a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2zm-.5 15.5v-5.3a3.26 3.26 0 0 0-3.26-3.26c-.85 0-1.84.52-2.32 1.3v-1.11h-2.79v8.37h2.79v-4.93c0-.77.62-1.4 1.39-1.4a1.4 1.4 0 0 1 1.4 1.4v4.93zM6.88 8.56a1.68 1.68 0 0 0 1.68-1.68c0-.93-.75-1.69-1.68-1.69a1.69 1.69 0 0 0-1.69 1.69c0 .93.76 1.68 1.69 1.68m1.39 9.94v-8.37H5.5v8.37z"%2F%3E%3C%2Fsvg%3E');}
#c1-cName { text-transform: none; font-weight: bold; color:black; text-decoration: none; }
#c1-cName:after { content: none; }
.c1-cData { display: inline-block; vertical-align: top; margin: .1rem 1.1rem 0 0; font-weight: normal; }
#c1-Phone { margin-top: .1rem; cursor: pointer; }
#c1-Phone:hover > .i-Bphone::before { content: url('data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="24" height="24" viewBox="0 0 24 24"%3E%3Cpath fill="none" stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 4h4l2 5l-2.5 1.5a11 11 0 0 0 5 5L15 13l5 2v4a2 2 0 0 1-2 2A16 16 0 0 1 3 6a2 2 0 0 1 2-2m10 3a2 2 0 0 1 2 2m-2-6a6 6 0 0 1 6 6"%2F%3E%3C%2Fsvg%3E'); }
#c1-Phone:hover > .c1-cData { font-weight: bold; }
#c1-Email a { color: black; }
#c1-Email:hover .i-Bemail::before { content: url('data:image/svg+xml,%3Csvg xmlns="http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg" width="24" height="24" viewBox="0 0 24 24"%3E%3Cg fill="none" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"%3E%3Cpath d="M0 0h24v24H0z"%2F%3E%3Cpath fill="black" d="M22 7.535V17a3 3 0 0 1-2.824 2.995L19 20H5a3 3 0 0 1-2.995-2.824L2 17V7.535l9.445 6.297l.116.066a1 1 0 0 0 .878 0l.116-.066z"%2F%3E%3Cpath fill="black" d="M19 4c1.08 0 2.027.57 2.555 1.427L12 11.797l-9.555-6.37a2.999 2.999 0 0 1 2.354-1.42L5 4z"%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E');}
#c1-Email:hover .c1-cData { font-weight: bold; margin-right: 0; }
#c1-OR { font-size: 1.2em; font-weight: bold; }
#c1-ORdiv { margin: 1.4em 0 1em 0; }

/* FORM */
#c1-formCon { margin: 1.4em 0 1em 0; text-align: center; }
#c1-formText { font-size: 1.3rem; display: inline-block; margin-right: 1rem; }
#c1-fileName { display: inline-block; margin-top: .3rem; vertical-align: top; }
.inpfilelabel { font-size:1rem; display:inline-block; padding:2px 10px 2px 5px; color:white; background-color:#003870; 
    cursor:pointer; max-width:250px; }
input[type="submit"] { color:#fff; background-color:#003870; font-size:1.3rem; text-transform: uppercase; 
    border-radius:10px; padding:3px 15px; margin-top: 1rem; cursor:pointer; }
input[type="file"] { display: none; }

/* COLUMN 2 */
/* PhotoCollage */
#c2-multiPic { display: grid; width: 100%; border: 4px black solid; grid-template-columns: 46% 54%; 
    grid-template-rows: 1fr 1fr; max-width: 800px; margin: 2.6rem auto 2rem auto; }
#c2-mP1 { grid-row: 1 / 3; grid-column: 1; background-image: url("img/bakken_1.jpg"); background-size: cover; }
#c2-m2P { display: grid; grid-template-columns: 70% 30%; grid-row: 1; grid-column: 2; }
#c2-mP2 { background-image: url("img/mobile_clinic.jpg"); background-size: cover; border: 4px black solid; border-top: 0; }
#c2-mP3 { background-image: url("img/pink_glasses.jpg"); background-size: cover; border-bottom: 4px black solid; }
#c2-m3P { display: grid; grid-template-columns: 1fr 1fr; grid-row: 2; grid-column: 2;}
#c2-mP4 { background-image: url("img/beagle.jpg"); background-size: cover; border-left: 4px black solid; }
#c2-mP5 { background-image: url("img/cat_1.jpg"); background-size: cover; border-left: 4px black solid; }

/* Williston & ND Info */
#c2-wInfoWrap { background-color: #eeee; padding: 1.5rem; }
#c2-wPicBx { max-width:740px; display:grid; grid-template-columns: 60% 40%; margin: 1rem auto 1.5rem auto; }
#c2-wPic1 { background-image: url("img/Williston_1.jpg"); background-size: cover; }
#c2-wPic2 { background-image: url("img/Williston_2.jpg"); background-size: cover; }
#c2-ndPicBx { max-width:740px; display:grid; grid-template-columns: 1fr 1fr 1fr; margin: 1.5rem auto 1.5rem auto; }
#c2-ndPic1 { background-image: url("img/ND_1.webp"); background-size: cover; }
#c2-ndPic2 { background-image: url("img/ND_2.webp"); background-size: cover; }
#c2-ndPic3 { background-image: url("img/ND_3.webp"); background-size: cover; }

/* FOOTER */
footer { background-color: #003870; color:white; width: 100%; text-align: center; margin: 1.2rem 0 0 0; padding: 0; }
#ft-copy { font-size: .9rem; }

/* RESPONSIVE */
@media (max-width: 1100px) {
    #c1-descr { width:90%; }
}
@media (max-width: 1000px) {
    section { margin: 1rem 1rem 1rem 1rem; line-height: 1.1; }
}
@media (max-width: 900px) {
    #c1-descr { width:100%; }
    #c2-multiPic { grid-template-rows: 65% 35%; }
    #c2-m2P {  grid-template-columns: 1fr; }
    #c2-mP2 { border-right:0; }
    #c2-mP3 { display: none; }
    #c2-wPicBx { grid-template-columns: 1fr; }
    #c2-wPic2 { display: none; }
    #c2-ndPicBx { grid-template-columns: 1fr 1fr; }
    #c2-ndPic2 { display: none; }
}
@media (min-width: 760px) {
    #c1-multiPic { display: none; }
    #c1-ndInfoWrap { display: none; }
}
@media (max-width: 759px) {
    header { grid-template-columns: 1fr; }
    #hcCntnr { display: none; }
    main { grid-template-columns: 1fr; }
    #c2-section { display: none; }
    #c1-descr { width:90%; }
}
@media (max-width: 680px) {
    #c1-title { font-size: 2.3rem; }
}
@media (max-width: 430px) {
    .h-partnership { font-size: 1.3rem; }
    #c1-multiPic { grid-template-columns: 1fr; grid-template-rows: 1fr; }
    #c1-mP1 { grid-row: 1; }
    #c1-mP2 { display: none; }
    #c1-mP3 { display: none; }
    #c1-descr { width:100%; }
    #c1-wPicBx { grid-template-columns: 1fr; }
    #c1-wPic2 { display: none; }
    #c1-ndPicBx { grid-template-columns: 1fr 1fr; }
    #c1-ndPic2 { display: none; }
}