@charset "UTF-8";

/*----
@font-face {
  font-family: 'Eras-Normal';
  src: url('/css/Eras-Normal.eot?#iefix') format('embedded-opentype'),  url('/css/Eras-Normal.woff') format('woff'), url('/css/Eras-Normal.ttf')  format('truetype'), url('/css/Eras-Normal.svg#Eras-Normal') format('svg');
  font-weight: normal;
  font-style: normal;
}
-----*/

svg.crc {
    width: 80%;
    height: auto;
    margin-top: 18vw;
    margin-left: 20px;
    max-width: 800px;
}
a.anchor {
    font-size: 0px;
    line-height: 0px;
    height: 0px;
    margin: 0;
    padding: 0;
    width: 0px;
    position: relative;
    top: -40px;
}
/*----
@font-face {
  font-family: 'Eras-Normal';
  src: url('/css/Eras-Normal.eot?#iefix') format('embedded-opentype'),  url('/css/Eras-Normal.woff') format('woff'), url('/css/Eras-Normal.ttf')  format('truetype'), url('/css/Eras-Normal.svg#Eras-Normal') format('svg');
  font-weight: normal;
  font-style: normal;
}
-----*/

svg.crc21 {
    width: 90%;
    height: auto;
    margin-top: 12vw;
    /* [disabled]max-width: 800px; */
}

p.crclogo {
    font-family: 'Eras-Normal', 'Cairo', Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
    width: 80%;
    height: auto;
    margin-top: 20vw;
    margin-left: 20px;
    max-width: 800px;
    font-weight: 300;
    word-spacing: 0.2em;
    letter-spacing: 0.05em;
}
svg.flow {
    width: 100%;
    height: auto;
    margin: 40px 0 0px;
}
svg.flowbelow {
    width: 100%;
    height: auto;
    margin: 20px 0 -80px;
    position: relative;
    top: 0px;
    left: 0px;
    z-index: 9000;
}
h1, h2, h3, h4, h5, h6 {
    font-family: 'Quicksand', Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
    letter-spacing: -0.01em;
}
h1 {
    padding: 40px 20px 20px;
    color: #FFFFFF;
    font-weight: 600;
    font-size: 40px;
    line-height: 1.1em;
}
p.greeting {
    padding: 40px 20px 20px;
    font-weight: 600;
    font-size: 45px;
    line-height: 1.1em;
    max-width: none;
}
h2 {
    padding: 20px 10px 10px 20px;
    font-weight: 600;
    font-size: 28px;
    line-height: 1.1em;
}
h3 {
    padding: 10px 20px;
    color: #FFFFFF;
    font-weight: 600;
    font-size: 24px;
    line-height: 1.1em;
}
.pfrow {
    display: flex;
	justify-content: center;
	flex-wrap: wrap;
}
.pfrow .pfbox {
    width: 32%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    padding: 10px;
    box-sizing: border-box;
}
.pofo h3 {
    padding: 5px;
    font-weight: 300;
    font-size: 20px;
}
.pofo p {
    max-width: none;
    margin-bottom: 6px;
    font-size: 14px;
}
.pofo img {
    width: 100%;
}
.ctr h3 {
    padding-top: 10px;
    padding-right: 10px;
    padding-left: 10px;
    padding-bottom: 10px;
    font-size: 22px;
}
.main.big3 h3  {
    font-size: 32px;
}
h4 {
    padding: 8px 20px 15px;
    font-weight: 600;
    font-size: 30px;
    line-height: 1.1em;
}
h5 {
    padding: 20px 20px 10px;
    font-weight: 600;
    font-size: 20px;
    line-height: 1.2em;
}
h6 {
    padding: 20px 10px 10px 20px;
    font-weight: 600;
    font-size: 22px;
    line-height: 1.1em;
}
p {
    margin: 0;
    padding: 5px 20px;
    font-family: 'Saira Condensed', Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 1.4em;
}
.content .tests {
    display: flex;
justify-content: space-around
}
.testimonial p {
    font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
    font-style: italic;
    font-size: 18px;
    line-height: 1.5em;
    color: #60336E;
}
.testimonial p a {
    color: #902AB0;
}
.testimonial p:last-child {
	font-family:Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
	font-style: normal;
	font-weight: 400;
	font-size: 15px;
	line-height: 1.3em;
	color:#494949;
}
.testimonial {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    padding: 30px 30px 30px 90px;
    box-sizing: border-box;
    border-radius: 20px;
    background-color: #fff;
    background-image: url(../images/quoteleft.png);
    background-repeat: no-repeat;
    background-position: 15px 15px;
    background-size: 80px auto;
    margin: 5px 10px!important;
}
.survey form {
    height: 600px;
}
#about {
    background-color: #120a1d;
    padding: 8vh 5vw 4vh;
    background-image: -webkit-linear-gradient(270deg,rgba(18,10,29,1.00) 0%,rgba(96,51,110,1.00) 100%);
    background-image: -moz-linear-gradient(270deg,rgba(18,10,29,1.00) 0%,rgba(96,51,110,1.00) 100%);
    background-image: -o-linear-gradient(270deg,rgba(18,10,29,1.00) 0%,rgba(96,51,110,1.00) 100%);
    background-image: linear-gradient(180deg,rgba(18,10,29,1.00) 0%,rgba(96,51,110,1.00) 100%);
}
#about .content {
	display: flex;
	align-items: center;
}
#about img.ron {
    width: 30%;
    margin-right: 6%;
}
#about p {
    font-family: 'Quicksand', sans-serif;
    font-weight: 400;
    line-height: 1.3em;
    color: #CCC;
}
#about p a, #about p strong {
	color: #FFF;font-weight: 500;
}
#about p a:hover {
	color: #9C5DB6;
}

#contact {
	background: #15032B;
	padding: 20px 0;
}
#contact iframe {
	width: 100% !important;
}

ul {
    margin: 0;
    padding: 5px 20px;
    font-family: 'Saira Condensed', Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 1.4em;
}
ul.fcol {
    list-style-type: none;
}
ul.fcol a {
    color: #9FD9FF;
}
ul.fcol a:hover  {
    color: #fff;
}
p.phone {
    font-family: 'Saira Condensed', Impact, Haettenschweiler, "Franklin Gothic Bold", "Arial Black", sans-serif;
    font-size: 50px;
	padding: 5px 20px;
		
	}	
p.phone a {
    text-decoration: none;
    font-weight: 600;
}
	p.c {
    color: #CDDC29;
    font-size: smaller;
    text-align: right;
    padding-top: 4vh;
	}
p.c a {
    color: #D5D5D5;
}
a.col33 p {
    color: #333;
}
.caps {
    text-transform: uppercase;
}
.white {
    color: #FFFFFF;
}
.white a {
    color: #9FD9FF;
}
.blue {
    color: #1f86c8;
}
.liteblue {
    color: #49b7fe;
}
.purple {
    color: #60336E;
}
.green {
    color: #cddc29;
}
.green2 {
    color: #b5c31f;
}
.gray {
    color: #333;
}
.blurple {
    background: -webkit-linear-gradient(270deg,rgba(96,51,110,1.00) 0%,rgba(72,80,142,1.00) 53.37%,rgba(31,134,200,1.00) 100%);
    background: -moz-linear-gradient(270deg,rgba(96,51,110,1.00) 0%,rgba(72,80,142,1.00) 53.37%,rgba(31,134,200,1.00) 100%);
    background: linear-gradient(180deg,rgba(96,51,110,1.00) 0%,rgba(72,80,142,1.00) 53.37%,rgba(31,134,200,1.00) 100%);
    background-repeat: no-repeat;
    /* [disabled]background-attachment: fixed; */
}
.blurple2 {
    background: -webkit-linear-gradient(270deg,rgba(71,37,81,1.00) 0%,rgba(44,50,95,1.00) 53.37%,rgba(21,92,138,1.00) 100%);
    background: -moz-linear-gradient(270deg,rgba(71,37,81,1.00) 0%,rgba(44,50,95,1.00) 53.37%,rgba(21,92,138,1.00) 100%);
    background: linear-gradient(180deg,rgba(71,37,81,1.00) 0%,rgba(44,50,95,1.00) 53.37%,rgba(21,92,138,1.00) 100%);
    background-repeat: no-repeat;
    /* [disabled]background-attachment: fixed; */
}
.purblue {
    background: -webkit-linear-gradient(270deg,rgba(31,134,200,1.00) 0%,rgba(72,80,142,1.00) 53.37%,rgba(96,51,110,1.00) 100%);
    background: -moz-linear-gradient(270deg,rgba(31,134,200,1.00) 0%,rgba(72,80,142,1.00) 53.37%,rgba(96,51,110,1.00) 100%);
    background: linear-gradient(180deg,rgba(31,134,200,1.00) 0%,rgba(72,80,142,1.00) 53.37%,rgba(96,51,110,1.00) 100%);
    background-repeat: no-repeat;
    /* [disabled]background-attachment: fixed; */
}
.blarple {
	background: rgb(0,0,0);
background: -webkit-linear-gradient(rgba(0,0,0,1) 0%, rgba(96,51,110,1) 100%);
background: -o-linear-gradient(rgba(0,0,0,1) 0%, rgba(96,51,110,1) 100%);
background: linear-gradient(rgba(0,0,0,1) 0%, rgba(96,51,110,1) 100%);
    background-repeat: no-repeat;
}
.grnwht {
    background: #cbdb2a;
    background-repeat: no-repeat;
    background: -webkit-linear-gradient(90deg,rgba(255,255,255,1.00) 0%,rgba(203,219,42,1.00) 100%);
    background: -moz-linear-gradient(90deg,rgba(255,255,255,1.00) 0%,rgba(203,219,42,1.00) 100%);
    background: linear-gradient(0deg,rgba(255,255,255,1.00) 0%,rgba(203,219,42,1.00) 100%);
}
.whtgrn {
    background: #cbdb2a;
    background-repeat: no-repeat;
    background: -webkit-linear-gradient(270deg,rgba(255,255,255,1.00) 0%,rgba(205,220,41,1.00) 100%);
    background: -moz-linear-gradient(270deg,rgba(255,255,255,1.00) 0%,rgba(205,220,41,1.00) 100%);
    background: -o-linear-gradient(270deg,rgba(255,255,255,1.00) 0%,rgba(205,220,41,1.00) 100%);
    background: linear-gradient(180deg,rgba(255,255,255,1.00) 0%,rgba(205,220,41,1.00) 100%);
    background-position: 0%;
}
.blugrn {
    background: -webkit-linear-gradient(270deg,rgba(31,134,200,1.00) 0.12%,rgba(205,220,41,1.00) 100%);
    background: -moz-linear-gradient(270deg,rgba(31,134,200,1.00) 0.12%,rgba(205,220,41,1.00) 100%);
    background: -o-linear-gradient(270deg,rgba(31,134,200,1.00) 0.12%,rgba(205,220,41,1.00) 100%);
    background: linear-gradient(180deg,rgba(31,134,200,1.00) 0.12%,rgba(205,220,41,1.00) 100%);
}
.whtblu {
    background-image: -webkit-linear-gradient(270deg,rgba(255,255,255,1.00) 0%,rgba(0,114,186,1.00) 100%);
    background-image: -moz-linear-gradient(270deg,rgba(255,255,255,1.00) 0%,rgba(0,114,186,1.00) 100%);
    background-image: linear-gradient(180deg,rgba(255,255,255,1.00) 0%,rgba(0,114,186,1.00) 100%);
}
.bluwht {
    background-image: -webkit-linear-gradient(270deg,rgba(0,114,186,1.00) 0%,rgba(255,255,255,1.00) 100%);
    background-image: -moz-linear-gradient(270deg,rgba(0,114,186,1.00) 0%,rgba(255,255,255,1.00) 100%);
    background-image: linear-gradient(180deg,rgba(0,114,186,1.00) 0%,rgba(255,255,255,1.00) 100%);
}
.grnblue {
    background-image: -webkit-linear-gradient(270deg,rgba(205,220,41,1.00) 0%,rgba(31,134,200,1.00) 100%);
    background-image: -moz-linear-gradient(270deg,rgba(205,220,41,1.00) 0%,rgba(31,134,200,1.00) 100%);
    background-image: -o-linear-gradient(270deg,rgba(205,220,41,1.00) 0%,rgba(31,134,200,1.00) 100%);
    background-image: linear-gradient(180deg,rgba(205,220,41,1.00) 0%,rgba(31,134,200,1.00) 100%);
}
.bscreen {
    background-color: rgba(0,0,0,0.60);
}
.whiteline {
    border: 1px solid #FFFFFF !important;
    background-color: transparent;
}
.whiteline:hover {
	border: 1px solid #CDDD02 !important;
	opacity: 1;
}
.chriv {
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;
    background-size: cover;
}
.longf {
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(../images/boston-longfellow-bridge.png);
    background-attachment: fixed;
    background-size: cover;
}
.rcharles {
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(../images/boston-river-charles.png);
    background-attachment: fixed;
    background-size: cover;
}
.work {
    background-image: url("../images/is-your-brand-working-hard-enough.jpg");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.bigsmall {
    background-image: url(../images/big-business-small-business-branding.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}
.fishie {
    background-image: url(../images/attract-customers-with-branding.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}
.ducks {
    background-image: url(../images/get-your-ducks-in-a-row.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.schooling {
    background-image: url(../images/schooling.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.deflated {
    background-image: url(../images/wasted-effort.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}
.fishv {
    background-image: url(../images/fishing-lure.png);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: contain;
}

.dogsm, .fishm, .allstarm {
    width: 100%;
    text-align: center;
}
.rainbow {
    background-image: url(../images/apparel/rainbow.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.people {
    background-image: url(../images/some-people.png);
    background-repeat: no-repeat;
    background-position: right center;
    background-size: cover;
}
header.political {
    background-image: url(../images/campaign-with-creativity.webp);
    background-position: center 20%;
}
.politicalsign {
    background-image: url(../images/political-campaign-advertising.webp);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.politicalsign .content {
    padding-top: 8vw;
    padding-bottom: 8vw;
    padding-left: 55vw;
}
.politicalsign p {
    font-size: 2.5vw;
}
.politicalsign h4 {
    font-size: 6vw;
}
.completesolution {
    background-image: url(../images/get-it-all-products.png);
    background-repeat: no-repeat;
    background-position: right center;
    background-size: cover;
}
.mind {
    background-image: url(../images/mind-control.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.perfs {
    background-image: url(../images/perforated-window-graphics-pizza-shop.webp);
    background-repeat: no-repeat;
    background-position: left center;
    background-size: cover;
}
.restuff {
    background-image: url(../images/real-estate-signs-brochures.png);
    background-repeat: no-repeat;
    background-position: right top;
    background-size: auto 100%;
}
.restuff .content {
    width: auto;
    margin-right: 425px;
    min-height: 480px;
    padding-left: 5%;
}
.help {
    background-image: url(../images/help-your-business-succeed.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.time {
    background-image: url(../images/save-time.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.cartoon {
    background-image: url(../images/cartoon-illustration.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.trust {
    background-image: url(../images/branding-builds-trust.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}
.character {
    background-image: url(../images/character-design.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: cover;
}
.realtorbrand {
    background-image: url(../images/real-estate-marketing-brand-package.png);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: contain;
}
.dancestudio {
    background-image: url(../images/vinyl-window-decals-dance-studio.jpg);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: contain;
}
.concept {
    background-image: url(../images/prototype-design-artwork.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.brandconcierge {
    background-image: url(../images/brand-concierge-service.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.glassdoor {
    background-image: url(../images/glass-storefront-door-graphics.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.message {
    background-image: url(../images/message-matters.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.guide {
    background-image: url(../images/we-guide-you.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.code {
    background-image: url(../images/web-code.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.accs {
    background-image: url(../images/web-accessibility.webp);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.closed {
    background-image: url(../images/covid-19-business-strategy.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.dull {
    background-image: url(../images/dull-business-card.jpg);
    background-repeat: no-repeat;
    background-position: 40% center;
    background-size: cover;
}
.nfc {
    background-image: url(../images/nfc-technology.jpg);
    background-repeat: no-repeat;
    background-position: 40% center;
    background-size: cover;
}
.better {
    background-image: url(../images/better-business-cards.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.thicker {
    background-image: url(../images/thicker-business-cards.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.metal {
    background-image: url(../images/metal-business-cards.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.shiny {
    background-image: url(../images/shiny-foil-business-cards.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.digcard {
    background-image: url(../images/digital-business-card.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.boston2021 {
    background-image: url("../images/bg-boston-graphic-design-2021m.jpg");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.pro1 {
    background-image: url(../images/process1.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.pro2 {
    background-image: url(../images/process2.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.pro3 {
    background-image: url(../images/process3.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.pro4 {
    background-image: url(../images/process4.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.pro5 {
    background-image: url(../images/process5.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.wearyourbrand {
    background-image: url(../images/apparel/wear-your-brand.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.print {
    background-image: url(../images/full-color-printing.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}
.greenbg {
    background-color: #cddc29;
}
.bluebg {
    background-color: #1f86c8;
}
.purplebg {
    background-color: #60336E;
}
.mapbg {
    background-image: url(../images/charles-river-creative-office-location.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}


/*---BUTTONS---*/


a.button:hover {
    opacity: 0.7;
    /* [disabled]color: #1f86c8; */
}



/*-------------*/

header {
    width: 100%;
    position: relative;
    top: 0px;
    left: 0px;
    background-size: cover;
    background-repeat: no-repeat;
    height: 45vh;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-top: 15vh;
    background-position: center center;
}
/*-------------*/

header.full {
    width: 100%;
    position: relative;
    top: 0px;
    left: 0px;
    background-size: cover;
    background-repeat: no-repeat;
    height: 95vh;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-top: 15vh;
    background-position: center center;
}
header.full .right50 {
    width: 46%;
    margin-left: 52%;
    margin-top: 40vh;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
header.full .right50 .htitle2 {
    width: 100%;
    text-align: center;
    font-family: "Saira Condensed", Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 700;
    font-size: 5vw;
    line-height: 1.1em;
}
/*-------------*/

header.alt1 {
    width: 100%;
    position: relative;
    top: 0px;
    left: 0px;
    background-size: cover;
    background-repeat: no-repeat;
    height: auto;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding-top: 5vh;
    background-position: center center;
}
header.full.realestate {
    background-size: cover;
    height: 80vh;
    padding-top: 5vh;
    background-position: 15% bottom;
    background-image: url(../images/real-estate-marketing.jpg);
}
header.full.windows {
    background-size: cover;
    height: 80vh;
    padding-top: 5vh;
    background-image: url(../images/storefront-window-graphics.jpg);
    background-position: center center;
}
#realestate .realestate {
    background-image: url(../images/real-estate-marketing.webp);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: auto 100% !important;
	background-size: cover;
}	
header.emojis {
    background-image: url(../images/business-branding-identity-crisis.jpg);
}
header.brain {
    background-image: url(../images/mind-control-2.jpg);
}
header.gia {
    background-image: url(../images/get-it-all-with-just-one-call.jpg);
    background-position: center 20%;
}
header.why {
    background-image: url(../images/why-choose-crc.jpg);
}
header.art {
    background-image: url(../images/map-illustration.jpg);
}
header.stup {
    background-image: url(../images/packages/startup.jpg);
}
header.portfolio {
    background-image: url(../images/murano-portfolio.jpg);
}
header.websites {
    background-image: url(../images/website-design-boston-2.jpg);
}
header.works {
    background-image: url(../images/schematic.jpg);
}
header.powder {
    background-image: url(../images/commercial-printing-boston-area.jpg);
}
header.dbcs {
    background-image: url(../images/digital-business-cards.png);
}
header.fish {
    background-image: url(../images/branding-fish.jpg);
}
header.tradesmen {
    background-image: url(../images/packages/tradesmans-tools-graphics-package.jpg);
}
header.basics {
    background-image: url(../images/packages/business-basics-brand-package.jpg);
    background-position: center 20%;
}
header.essentials {
    background-image: url(../images/packages/startup-essentials-graphics-package.jpg);
    background-position: center 20%;
}
header.workout {
    background-image: url(../images/brand-workout.jpg);
    height: 38vh;
}
header .htitleeeee {
    margin-left: auto;
    margin-right: auto;
    width: 70%;
    text-align: center;
    font-family: "Saira Condensed", Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 700;
    font-size: 5vw;
    line-height: 1.1em;
    padding-top: 10px;
    padding-bottom: 10px;
}
header .htitle {
    margin-left: auto;
    margin-right: auto;
    width: 80%;
    text-align: center;
    font-family: "Saira Condensed", Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 700;
    font-size: 5vw;
    line-height: 1.1em;
    padding-top: 10px;
    padding-bottom: 20px;
    position: absolute;
    bottom: 0px;
    left: 10%;
}
header .htitle.blk , header .htitle2.blk{
    background-color: rgba(255,255,255,0.70);
    border-radius: 10px;
}
header .htitle.wht  , header .htitle2.wht2{
    color: #fff;
    text-shadow: 0px 2px 3px #000, 0px 2px 10px #000;

}
header .htitle.wht2  , header .htitle2.wht2{
    color: #fff;
    text-shadow: 0px 2px 10px #000, 0px 2px 15px #000;
}
.flag {
    width: 100%;
}
footer img.flogo {
    width: 30%;
}
footer p {
    max-width: none;
}
.about p.yes {
    font-size: 40px;
    padding-top: 25px;
}
.about p.wedo {
    font-size: 16px;
}


/*--ANCHOR lINK MARGIN--*/
.productrows .content::before { 
  display: block; 
  content: " "; 
  margin-top: -50px; 
  height: 50px; 
  visibility: hidden; 
  pointer-events: none;
}
.about p {
    font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 13px;
    display: block;
    margin-left: auto;
    margin-right: auto;
}
svg.talk {
    margin: 20px auto 0;
    width: 150px;
    display: block;
}

.crc2021 {
    background-image: url(../images/bg-boston-graphic-design-2021.jpg);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: cover;
}
.teameffort {
    background-image: url(../images/star-branding-athletes.jpg);
    background-repeat: no-repeat;
    background-position: center top;
    padding-top: 200px;
    background-size: auto 200px;
}


/*====NAVIGATION====*/

.topnav {
    width: 100%;
    background-color: rgba(0,0,0,0.70);
    /* [disabled]overflow: hidden; */
    position: fixed;
    top: 0;
    z-index: 99999;
    transition: all .3s;
}

.topnav a {
    float: left;
    display: block;
    color: #f2f2f2;
    text-align: center;
    padding: 10px 13px;
    text-decoration: none;
    font-size: 16px;
    text-transform: uppercase;
    font-family: 'Saira Condensed', Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
    transition: all .3s;
}

/* Hide the hamburger */
.topnav .icon {
  display: none;
}

/* Dropdown container */
.dropdown {
  float: left;
  overflow: hidden;
}

/* Dropdown button style */
.dropdown .dropbtn {
    /* [disabled]font-size: 17px; */
    border: none;
    outline: none;
    /* [disabled]color: white; */
    /* [disabled]padding: 14px 16px; */
    /* [disabled]background-color: rgba(0,0,0,0.70); */
    /* [disabled]font-family: inherit; */
    margin: 0;
}

/* Dropdown content Style */
.dropdown-content {
    display: none;
    position: absolute;
    background-color: rgba(0,0,0,0.70);
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 11111;
	top: 44px;
}

/* Dropdown links Style */
.dropdown-content a {
  float: none;
  color: white;
  padding: 8px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

/* Hover BG on topnav links */
.topnav a:hover, .dropdown:hover .dropbtn {
  background-color: #1f86c8;
  color: #cddc29;
}

/* HOverBG to dropdown links */
.dropdown-content a:hover {
  background-color: #1f86c8;
  color: #cddc29;
}

/* Show the dropdown menu */
.dropdown:hover .dropdown-content {
  display: block;
}

	.topnav a.hphone {
	font-weight: 700;
		
}
div.c80 {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
}

.pkgrid {
text-align: center;
}
.pkgrid div {
    display: inline-block;
    width: 33.3%;
    padding-bottom: 25px;
}
span.pkgprice {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    font-family: "Saira Condensed", Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 700;
    font-size: 50px;
    line-height: 1.1em;
	color: #fff;
    text-shadow: 0px 2px 15px #000;
    padding-top: 10px;
    padding-bottom: 20px;
}
.pkgrid div img {
	width: 100%;
}
.pkgrid div p {
    text-transform: uppercase;
    color: #FFFFFF;
    font-weight: 700;
}

.restuff {
    background-image: url(../images/real-estate-brand-signs-brochures.png);
	background-size: 45% auto;
}
.restuff .content {
    margin-right: 45%;
    width: 50%;
}	


@media screen and (max-width: 1100px) {

	#about h1 {
		font-size: 32px;
	}
	#about img.ron {
	width: 40%;
}	
}

@media screen and (min-width: 1000px) {

	.topnav a.hphone {
		float: right;
	}
	.topnav a.social {
    padding: 10px;
    float: right;
	}
	.topnav a.social img {
		width: 16px;
	}
header {
    min-height: 450px;
}	
}


@media screen and (max-width: 1000px) {



	.topnav {
		  background-color: rgba(0,0,0,0.40);

	}
	
	.topnav a, .topnav a.icon { 
		background-color: transparent;
	}
 .topnav a:not(:first-child), .dropdown .dropbtn {
    display: none;
  } 
	
 /* .topnav a,.dropdown .dropbtn   {
    display: none;

  }  */
	
	.topnav a {
    padding: 5px 12px;
	font-size: 18px;		

}
  .topnav a.icon {
    float: right;
    display: block;
  }
		.topnav a.social img {
		width: 32px;
	}	

/* The "responsive" class is added to the topnav with links vertically */
.topnav {
	width: auto;
	right: 0;
    top: 0;
}	
  .topnav.responsive {
  background-color: rgba(0,0,0,0.60);
	position: fixed;
width: auto;
    padding-right: 24px;
	  right: 0;
    top: 0;}

  .topnav.responsive a.icon {
    position: absolute;
    right: 0;
    top: 0;
  }
	
  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }
  .topnav.responsive .dropdown {float: none;}
  .topnav.responsive .dropdown-content {
	  position: absolute;
	  left: -160px;
	}
  .topnav.responsive .dropdown .dropbtn {
    display: block;
    width: 100%;
    text-align: left;
  }
/*====NAVIGATION END====*/
	
	#about .content {
		align-items: flex-start;
	}
	#about p {
	font-size: 16px;
}	
	
.pfrow .pfbox {
    width: 48%;
}	
}

@media screen and (min-width: 801px) and (max-width: 1000px) {
	
	#about img.ron {
		margin-top:35px;
	}
}


@media screen and (min-width: 1001px) {
.chriv {
    background-image: url(../images/charles-river-creative-2021.jpg);
}	
}




@media screen and (min-width: 801px) {
	
h2 {
    font-size: 35px;
}	
	.dogsm, .fishm, .allstarm {
		display: none;
	}	
	.flexcontent.homesplash div {
		position: relative;
		padding-top: 220px;
	}	
svg.crc21 {
    position: absolute;
	top: -20px;
	left: 50px;
	z-index: 8001;
	width: 100%;
    height: auto;

}	
.allstar {
    background-image: url(../images/all-star-branding.png);
    background-repeat: no-repeat;
    background-position: 120% top;
    background-size: 60% auto;
	padding: 20px 0;
}	

}

@media screen and (max-width: 1325px) {

	.greeting span {
		display: block;
	}
}


@media screen and (max-width: 1200px) {

header.full {
    background-position: 25% center;
}

}

@media screen and (min-width: 768px) {

.introright {
    padding-top: 75px;
}
	
}

@media screen and (max-width: 1000px) {

svg.crc {
    width: 88%;

}	
.chriv {
    background-image: url("../images/boston-blend-m.jpg");
	background-attachment: scroll; 
}		
	
	.productrows div {
		margin-top:-20px;
	}	
	
footer img.flogo {
    width: 50%;
}	
	
	
	}

@media screen and (max-width: 800px) {
	
header {
    height: 100vh;
    padding-top: 0vh;
}	
header .htitle {
		bottom: 30vh;
   font-size: 6vw;
	}
	
	h1 	{
		font-size: 34px;
		text-align: center;
	}

.content div, .flexcontent div {
  		text-align: center;
	}
.content .tests {
    display: block;
}	
.testimonial {
    background-size: 60px auto;
    padding: 30px 20px 30px 70px;
}
	
#realestate .realestate {
    background-image: none;
}	

header.full.realestate {
    background-size: cover;
    height: 80vh;
    padding-top: 5vh;
    background-position: 15% bottom;
    background-image: url(../images/real-estate-marketing.jpg);
}
header.full .right50 {
    margin-top: 38vh;
}
header.full .right50 .htitle2 {
    width: 100%;
    text-align: center;
    font-family: "Saira Condensed", Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 700;
    font-size: 6vw;
    line-height: 1.1em;
}

header.workout {
    height: 30vh;
}	
	
header.brain {
    background-image: url(../images/mind-control-2m.jpg);
}	
header.full.windows {
    height: 60vh;
    padding-top: 5vh;
    background-image: url(../images/storefront-window-graphics.jpg);
    background-position: 55% center;
}	
	
header.political {
    height: 50vh;
	background-image: url("../images/campaign-with-creativity-m.webp");
    background-position: center center;
}
header.political .htitle {
		bottom: 0px;
}

#impress2 img.campaigns {
	position: relative;
	top: 25px;
	width: 86%;
}	
.mobile.polsign	{
		background-color: white;
		display: block;
	}
.mobile.polsign	.content {
	text-align: center;
	}
	

.allstar {
	padding: 0 0 20px;
}		
	
.bigsmall {
    background-position: center center;
    background-size: 80%;
}
	
.pkgrid div {
	width:33.3%;
}		
	

.restuff {
    background-image: none;

}
.restuff .content {
    width: 100%;
	min-height: none;
    margin-right: 0px;
    padding-left: 5%;
	padding-right: 5%;
	box-sizing: border-box;
}
	

#about .content {
	display: block;
	padding-top: 5vw;
	padding-bottom: 5vw;
	
}
#about {
	text-align:center; 
	}

#about img.ron {
	width: 70%;
	margin: auto;
}	
#about h1 {
    font-size: 6vw;
}
#about h5 {
    font-size: 5vw;
}

#about p {
    font-size: 3vw;
	width: auto;
	text-align: center;
}
#about a.button {
		margin:35px auto;
	}	

}


@media screen and (max-width: 500px) {

header .htitle {
	font-size: 7vw;
	}
header.powder {
    background-image: url(../images/commercial-printing-boston-area-m.jpg);
}
header.dbcs {
    background-image: url(../images/digital-business-cards.png);
}
footer img.flogo {
    width: 65%;
}	
.pkgrid div   {
	width:50%;
}	
div.c80 {
    width: 94%;
	}

header.full.realestate {
    background-image: url(../images/boston-real-estate-marketing-m.jpg);
    background-size: cover;
    height: 80vh;
    padding-top: 5vh;
    background-position: 15% bottom;	
	}
header.full .right50 {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 41vh;
}
#about img.ron {
    width: 80%;
}
	#about h1 {
		font-size: 7vw;
	}	
#about p {
    font-size: 4vw;
}
.pfrow .pfbox {
    width: 96%;
}	
}
