header, hgroup, nav, menu, address, article, section, hgroup, aside, content, summary, details, footer {display: block;}

a:link {color:#1a2450}
a:visited {color:#404575}
a:hover {color:#8d2825; background: #f2eed3;}
a:active {color:#404575}

a.imageLink:hover {background: none;}
#content a {font-weight: bold; padding: 3px;}
 h1, h2, h3, h4, p {padding: 6px 10px; margin: 10px 20px;}
 p.author {font-weight: bold;}
 #content p, #content3 p {line-height: 1.5em; color: #222;}

/* img */

a img {border: none;}

/* index slideshow */

 #content #my-accordion p {color: white !important; text-align: center;}

/* */

img {width: auto; max-width: 100%; height: auto;}

.clear {clear: both;}

.clearfix:after {content: ""; display: table; clear: both;}

body {font-size:14px; font-family:Verdana, Arial, sans-serif;
background: #505f5a; margin:15px 0}

#main {margin: auto; width: 984px; position: relative; border-top: 3px solid #e8ba6b;
-moz-box-shadow: 0 0 2px 2px #434f4b;
-webkit-box-shadow: 0 0 2px 2px #434f4b;
 box-shadow: 0 0 2px 2px #434f4b;
background: url(http://www.crimsondesigns.com/bg-images-new/main.jpg) repeat-x;}

/* header section */

#header, #header2, #header3 {margin: 0 auto; max-width: 984px; width: 95%; height:168px; position: relative; padding-top: 6px;}
#header , #header2, #header3 {background: url(http://www.crimsondesigns.com/bg-images-new/header-large2.jpg) no-repeat;}

#header1:after, #header2:after, #header3:after {content: ""; display: table; clear: both;}

#logoWrap {float: left; max-width:180px; width: 20%; text-align: center;}
#logoWrap a:hover {background: none;}
#titleWrap {float: left; max-width: 500px; width: 45%;}

img.logo {margin: 32px auto;border:none;}

#business-name {position:relative;width:410px;height:50px;overflow:hidden; text-indent: -3333px;
font:16px arial, serif;margin:42px auto 0;padding:10px 0 0; text-align: center;}

#business-name span {display:block;position:absolute;left:0;top:0;z-index:1;width:410px;height:50px; 
background:url(http://www.crimsondesigns.com/images-new/title-crimson-designs.png) top left no-repeat;
margin:0;padding:0;font-weight:700;color:#000;font:22px Georgia, serif;text-align:center}

#description, h2.home {font-size: 1.1em;padding-top:0;color:#222; margin: 0 0 5px 0; text-align: center;
font-family: 'Open Sans', Verdana, Tahoma, sans-serif;font-weight: 700;}

/* end header section */

/* home page */

#intro {float: left; width: 70%; text-align: center; margin-left: 20px;}
div#index1 {text-align: left;line-height:1.3em;background:#fefef6;margin: 12px auto;padding:5px 0;}
h1.introduce {margin:10px 24px 4px; padding: 6px 6px 0; text-align: left;font-size:1.6em;color:#952c29;font-family: "trebuchet ms", verdana, sans-serif; line-height: 1.4em; }
h2.first {margin:0 24px; padding: 0 6px; font-size: 1.3em;color:#505f5a;font-weight:600;font-family:arial, sans-serif;}
p.presence{color:#505f5a;}

p.our-plan {margin-top: 0;}
.highlight {font-weight:700;color:#a7353d;}
#index1 .introText {font-weight:700;color:#1a2450; font-size:1.1em; margin: 6px 20px 5px 16px; padding: 0;}

#shadow-container {position: relative;margin: 5px auto 20px;
border: 1px solid #c7c4c4; background: #fefef6; padding: 2px;
-moz-box-shadow: 0 0 3px 3px #d5ded4;
-webkit-box-shadow: 0 0 3px 3px #d5ded4;
box-shadow: 0 0 6px 3px #d5ded4;}

.container {text-align: left;background: #fefef6; margin: 4px; border: 1px solid #eee;}
 
div.border {text-align: center; margin: 10px; background: #eee; padding: 10px 6px; position: relative;
 max-width: 630px; min-height: 100px;}

#content h3 {color:#1a2450;}

ul.reasons p {margin: 0; padding: 0 0 12px; border-bottom: 1px dotted #c7c4c4;}
ul.reasons .highlight2 {position: relative; top: -2px;}
ul.reasons p.simple {border-bottom: none;}
#content ul.reasons {margin:5px 22px; padding: 0;}

/* Home Right */

#rightDiv {float: right; width: 25%; margin:22px 1% 16px 0} 
 
#packageWrap {text-align: center;}
#packageWrap p {font-size: 1em;}

.boxround {font-family:Arial, sans-serif;text-align:center; padding: 2px; background: #fefef6;
margin: 0 auto 8px; text-transform: uppercase; font-size: .9em; max-width: 195px;
-moz-box-shadow: 0 0 1px 1px #bbb;
 -webkit-box-shadow: 0 0 1px 1px #bbb;
 box-shadow:  0 0 1px 1px #bbb;
}

#content .boxround a {padding: 8px 0; display: block;}
.boxround a:link, .boxround a:visited {text-decoration:none;  color:#fefef6;}
.boxround a:hover { color:#fff; background: #333;}
  
p#package {background:#a23129; color:#f4f8e4; margin: 0 auto; padding: 0;}
p#package2 {background: #7d2620; color:#2c3757; margin: 0 auto; padding: 0;}
p#package3 { background: #661f1a;  color:#2c3757; margin: 0 auto; padding: 0;}

#blog-feed {text-align: left; max-width:195px;margin:10px auto 8px;word-wrap: break-word;padding: 15px 2px; background: #f3efd4 url(http://www.crimsondesigns.com/bg-images/bg-stripes.gif); clear: both;}
#blog-feed h3 { text-align: center;font-size: 1.1em;margin:6px 4px;padding:5px 0; color:#1a2450; text-transform: uppercase;}
#blog-feed p {text-align: center;color:#333;margin: 0 5px; padding: 5px; background: #ffffdf;}
#blog-feed a {padding: 3px; font-weight: normal;}
#blog-feed a:link, #blog-feed a:visited {color: #385042; word-wrap: break-word; display: block;}
#blog-feed a:hover, #blog-feed a:active {color: #22392c; background: #f2eed3;}
#blog-feed a.plain {padding: 0;}
#blog-feed a.plain:hover {background: none; color: #404575;}

div.social {padding: 4px 0; width: 195px;background: #f3efd4 url(http://www.crimsondesigns.com/bg-images/bg-stripes.gif);margin:16px auto;padding:6px 0 0;}
div.social p {margin: 0; padding: 0; text-align: center;}
div.social a:hover {background: none;}

/* end home */

#contentWrap { background:#e4c688 url(http://www.crimsondesigns.com/bg-images/bg-stripes3.gif); 
margin: 0; padding-top: 10px; color: #333; text-align: center;}

#content {clear: both; text-align: left; padding: 20px 0 10px; background: #f4f0d5; margin: 0 auto; clear: both; position: relative; width: 95%; }
#content2 {background: #f4f0d5 url(../bg-images/old-photo-wall.jpg) top right repeat-y; padding: 25px; margin: 0 auto; clear: both; position: relative;}
#content3 {clear: both; padding: 20px 30px 10px; background: #f4f0d5;}

#resource, #resource2, #resource3 {margin: 20px auto; padding: 15px; width: 95%;
  border: 1px solid #c7cab7; max-width: 830px;}
 #resource2 {background: #fefef6;}

#contentLeft {float: left; width: 45%;}
#contentRight {float: right; width: 45%;}
#leftDiv {float: left; width: 72%; background: #fefef6; margin: 10px 0 20px 5px;}
#rightDiv {width: 24%; float: right; margin: 10px 5px 0 0;}
#leftDiv2 {float: left; width: 48%; margin-left: 10px;}
#rightDiv2 {width: 48%; float: right; margin-right: 10px;}
#leftDiv3 {float: left; width: 68%; background: #fefef6; margin: 20px 0 20px 25px;}
#rightDiv3 {width: 155px; float: right; padding-top: 20px; margin-right: 18px;}
.infoLeft {float: left; width: 48%;border: 3px double #f3e4bd; background: #fefef6; 
margin: 10px 10px 0 0;}
.infoRight {float: right; width: 45%; background: #fefef6; 
margin: 10px 10px 0 0; border: 3px double #f3e4bd; padding: 5px;}

.shadow { -moz-box-shadow:  0 0 2px 2px #ccc;
  -webkit-box-shadow: 0 0 2px 2px #ccc;
  box-shadow:  0 0 2px 2px #ccc;}

.iframeWrap {max-width: 500px; position: relative;
  height: 0; padding-bottom: 75%; overflow: hidden;}

.iframeWrap iframe {position: absolute; top:0; left: 0;
  width: 100%; height: 100%;}
  
  /* H1 */
  
  .headerWrap {padding: 0 20px;}

h1.capitals, h1.capitals2, h1.capitals3 {font-size: 2em; 
 padding: 6px 12px 14px; color: #952c29; margin: 10px; font-family: 'Archivo Narrow', 'trebuchet ms', verdana, sans-serif; text-align: center;}

h2 {font-size: 1.2em;font-family: 'Open Sans', Verdana, Tahoma, sans-serif; color: #1a2457;}
#resource2 h3 {text-align: left;}

 #resource2 .centerAlign {text-align: center;}

h3.different {border-top: 1px solid #000; border-bottom: 1px solid #000; margin: 30px 30px 20px; padding: 6px; color: #fff; background: #a63538; font-variant: small-caps; font-size: 16px;}

#content p.tips {padding: 10px; margin: 10px 20px 10px; }
#content p.tips2 {background: #f3efd4; padding: 28px; margin: 10px 20px;  border-top: 1px dashed #dedabd;  border-bottom: 1px dashed #dedabd;}

#content p.question {font-weight: bold; color: #2c3757;}
p.toggle2 {line-height: 1.5em !important; background: #fafeea; padding: 15px !important;
-moz-box-shadow: 0 0 6px 3px #f3efd4;
-webkit-box-shadow: 0 0 6px 3px #f3efd4;
 box-shadow: 0 0 6px 3px #f3efd4;}

#resource p.find {padding: 15px 50px 35px 100px; background: #f4f8e4 url(../images/arrow.gif) 40px 0px no-repeat; margin: 10px ; width: 360px;}
.centerAlign {text-align: center; margin: 6px 0 !important; padding: 6px 0 !important;}
p.centerAlign2 {text-align: center; margin: 6px; padding: 6px;}
.justify {text-align: justify; clear: both;}

/* images */

#content p.asideImgWrap {margin: 15px 0; padding:0 !important; text-align: center;}

#content p.asideImgWrap img {margin: auto;
 -moz-box-shadow:  0 0 1px 1px #ccc;
  -webkit-box-shadow: 0 0 1px 1px #ccc;
  box-shadow:   0 0 1px 1px #ccc;}

.imgWrap { -moz-box-shadow:  0 0 1px 1px #e0d8ca;
  -webkit-box-shadow: 0 0 1px 1px #e0d8ca;
  box-shadow:  0 0 1px 1px #e0d8ca; max-width: 700px; margin: 20px auto; text-align: center;}

img.alignRight, img.alignRight2 {float: right; margin: 0 0 10px 10px; border: none;}
img.alignRight2 {display: inline;}

.socialLink {margin: 0; padding: 0 0 22px 10px; line-height: 0; float: right; position: relative; top: 20px;}
.socialLink a:hover {background: none;}
img.alignLeft, .left {float: left; margin: 0 10px 10px 0; border: none;}
img.right {float: right; margin: 5px; border: none;}
img.rightside2 {float: right; margin: 16px 30px 10px 10px; border: 1px solid black;}
img.rightside3 {float: right; margin: 0px 30px 10px 30px; border: 1px solid black;}

/* highlight */
#content .highlight { font-weight: bold;  padding: 2px 0;
color: #9a2f27; font-family: verdana, arial, sans-serif; }

.special {color: #9a2f27; font-weight: bold;}

.strongtext {color: #000; border-bottom: 1px dotted #1a2450;}

/* quick links */

div.linkFrame {padding: 0 22px;}

div.crosslinks {background: #f4f0d5; padding: 2px; margin: 8px 10px; font-size: 1.1em; font-family: "trebuchet ms", verdana, sans-serif;}
div.crosslinks p a {color: #932e27;}
div.crosslinks a {font-weight: bold; padding: 5px;}

#content div.crosslinks p, #content2 div.crosslinks p {margin: 3px; padding: 3px; text-align: center; background: url(http://www.crimsondesigns.com/bg-images/arrow-blog.png) 0 50% no-repeat;}

.sectionLinks {text-align: center;}
.sectionLinks a {display: inline-block; padding: 6px; margin: 5px; background: #952c2a; color: #fefef6 !important;}
.sectionLinks a:hover {background: #711f21; text-decoration: none;}

/* social media crosslinks */

.socialWrap {background: #fefef6; padding: 10px; margin: 10px auto; text-align: center;  width: 95%; max-width: 800px;}
.socialWrap2 {background: #fefef6; padding: 10px; margin: 10px auto; text-align: center;  width: 95%; max-width: 800px;}  
.socialWrap a {font-weight: normal !important; padding: 3px; line-height: 1.4em;}
.socialWrap a:hover {background: none;}

/* end social media links */

/* end quick links */

div.define {background: #f9fcf3; border: 1px dotted #ccc;}

#resource h2, #leftDiv3 h2{border-bottom: 3px double #404575; padding: 6px 12px; 
font-size: 1.4em; font-family: "trebuchet ms", verdana, sans-serif; text-align: center;
padding: 4px 20px 4px; margin: 12px 10px 10px; color: #1a2457;}

#content #resource2 h2 {padding: 6px 12px; background: #f4f0d5; 
text-align: center; font-size: 1.3em; font-family: "trebuchet ms", verdana, sans-serif; 
padding: 4px 20px 4px; margin: 12px 10px 10px; color: #1a2457; clear: both;
border-top: 1px dotted #1a2457; border-bottom: 1px dotted #1a2457; }

#content ul, #content2 ul {margin: 14px 20px; padding: 10px 0; text-align: left;}
#content ul li, #content2 ul li { margin: 5px 10px 5px 10px; padding: 3px 5px 3px 18px; background: url(http://www.crimsondesigns.com/web-packages/images/bullet-red.jpg) no-repeat 0% 7px; list-style-type: none;}
#content ul.list li, #content2 ul.list li {background: url(http://www.crimsondesigns.com/images-new/bullet3.png) no-repeat 0% 7px; list-style-type: none;}
#content ol, #content2 ol {margin: 14px 20px 14px 36px; padding: 10px; text-align: left;}

#content ol li, #content2 ol li { margin: 6px; padding: 6px;}

div.picture-frame {text-align: center; overflow: hidden;}

/* services */

h3 {padding: 6px 10px; margin: 10px 20px; border-top: 1px dotted #000; border-bottom: 1px dotted #000; color: #1a2457; font-size: 1.3em; font-family: "trebuchet ms", verdana, sans-serif; text-align: center;}

h3.simple {position: relative; padding-left: 65px; margin-left: 0;}
.checkmark {position: absolute; top: 3px; left: 15px;}
#content h3.steps {background: #f8f5e2 url(../images/bg-gradient4.jpg) 50% 50% repeat-x; border-top: 1px solid #bda385; border-bottom: none; margin: 22px 20px; font-size: 1.2em; text-align: left;}
h3.black {font-size: 1.1em; padding: 10px;}
h3.choice {background: #f2eed3; border-bottom: 2px solid #f2dfb1; border-top: none; text-align: left;}

#leftDiv h3.hire {padding: 10px; margin: 10px 24px;}

#content4 p.question {font-size: 1.1em; color: #2c3757;}
span.answer {font-size: .9em; color: #942e27; font-weight: bold;}
#content4 p.toggle {text-align: justify; padding-bottom: 12px; border-bottom: 1px dotted #6a8073; }


/* testimonial div */

.out {margin: 20px auto; max-width: 750px;}

#content .in, #content2 .in, #content3 .in {background: #f4f0d5 url(../images/gradient4.jpg) repeat-x;  border: 1px solid #bda385; font-weight: normal; text-align: left; padding: 5px; margin: 5px;}

 .clientTestimonial { font-weight: normal;  width: 95%; margin: 20px auto; padding-top: 10px;}
 
 .clientTestimonial h3, .clientTestimonial p {margin: 15px; padding: 0;}

 .in h3 {margin: 10px 5px; padding: 5px 0;}
.in h5, #content2 .in h5 {margin:  30px 20px; padding: 0; text-align: center; font-family: georgia, serif;}
.in p, #content2 .in p {margin: 3px 0; padding: 3px; color: #333;}

/* end testimonial */

/* lists */

#content ul li {padding: 4px 4px 4px 20px; background: url(../web-packages/images/bullet-red.jpg) no-repeat 0% 6px; list-style-type: none;}
#content ul.plain {margin: 14px 10px 14px 20px; padding: 10px 0; background: none;}
#content ul.plain li {margin: 5px 10px 5px; padding: 3px 5px 3px 20px; } 
#content ul.pros {margin: 10px 16px; background: #fefef6; padding: 10px 0;}
#content ul.pros li { margin: 10px 10px 10px 14px; padding: 3px 0 10px 24px; border-bottom: 1px dotted #222; color:#1a2450; background: url(http://www.crimsondesigns.com/bg-images/bullet2.gif) no-repeat 1% 8px; list-style-type: none; line-height: 1.5em;}
#content ul.pros li span {text-transform: uppercase; text-decoration: none; padding: 3px; color: #000;}
#content ul.pros li.last {border-bottom: none; margin-bottom: 0; padding-bottom: 0;}

#content ul.pros li p {margin: 5px 0; padding: 0;}
#content ul.plain {margin: 10px 10px 10px 60px; list-style-type: square;}
#content ul.plain li {margin: 4px; padding: 4px; font-size: .9em;}

ul.crimson li {list-style-type: none;
padding: 5px 6px 5px 30px; width: 90%;
background: url(../images/bg_bullet.gif) no-repeat 0% 7px;}

ul.crimson li ul li {list-style-type: square; background: #f4f8e4;
padding: 4px; font-size: .9em;}
/* other lists */

#content ul.plain {margin: 14px 10px 14px 10px; padding: 10px 0; background: none;}

#content ul.plain li {margin: 5px 10px 5px; padding: 3px 5px 3px 20px; } 

ul.list {margin: 20px 30px 20px;
padding: 8px 10px 10px 12px; border: 1px solid #f3efd4;
background: #c1d3c5; font-size: .9em;}

ul.list li {list-style-type: none;
padding: 5px 6px 7px 20px; width: 90%;
background: url(../bg-images/bullet-new.png) no-repeat 3px 6px;}

ul.list2 {margin: 20px 10px 10px 30px; width: 600px;
padding: 8px 10px 10px 16px; border: 1px solid #f4f0d5;
background: #cce3d7; font-size: .9em;}

ul.list2 li {list-style-type: none;
padding: 5px 6px 7px 26px; width: 90%;
background: url(../images/bullet3.gif) no-repeat 2% 20%;}

#resource ul.list3 {margin: 20px 35px 5px;
padding: 8px 10px 10px 6px; border: none;
background: #cce3d7; font-size: .9em;}

#resource ul.list3 li {list-style-type: none; padding: 5px 6px 7px 15px; 
background: url(../images/bullet3.gif) no-repeat 0 15%;}

.pricing { border: 1px dotted #e1c282;
background:#f3efd4 url(../bg-images/bg-stripes.gif); margin: 8px 15px 15px;}

.pricing h2  { font-size: 1.2em; margin: 10px 20px 6px; padding: 10px 0; border-bottom: 3px double #1a2457;}

#content .pricing p {background: url(../images/bullet-red.jpg) no-repeat 0 50%; 
padding: 6px 0 6px 15px; margin: 6px 0 6px 18px; font-weight: bold;}
#leftDiv2 h3, #leftDiv2 p, #rightDiv2 h3, #rightDiv2 p {margin: 6px 15px; padding: 6px 0;}

form#maintain {margin-left: 30px;}

div#maintainWrap {background: #f4f8e4; padding: 10px; border: 3px double #e1c282; margin: 20px;}

#contract {padding: 20px; width: 480px; margin: 40px 60px;}

#contract img {border: 1px solid black;}

img.newbury-farm {margin: 20px 0 20px 50px;}
img.portrait {margin-left: 10px;}
img.portrait2 {margin-left: 10px; border: 1px solid #000;}
img.top {border: none;}
ul.solutions {margin: 10px 60px 15px 20px; border: 1px dashed black; padding: 8px;}

ul.solutions li {list-style-type: none; font-size: .9em;
padding: 3px 6px 3px 20px; width: 90%; color: #1a2450;
background: url(../images/bullet2.gif) no-repeat 0% 7px;}

ul.faq {margin: 10px 0 15px 20px; border: 1px dashed black; 
padding: 8px; background: #cce2d5; font-size: .8em;}

ul.faq li {list-style-type: none;
padding: 5px 6px 7px 35px; width: 90%;
background: url(../images/bullet3.gif) no-repeat 2% 50%;}

#content2 ol.questions {padding: 5px 10px;}
#content2 ol.questions li {padding: 5px;}
#content2 ol.questions li p {margin: 5px 0; padding: 0;}
 
.categoryWrap {background: #fff; border: 1px solid #eee; margin-bottom: 30px; padding-top: 10px;}

/* SEO */

/* SEO services list */

#resource2 ol.web  { margin: 20px;
    padding: 20px 0 0 0; background: #fff; border: 1px dotted #000;
    list-style-type: none;}
	
#content #resource2 ol.web  li {counter-increment: step-counter;}
#content #resource2 ol.web  li p {padding: 0 5px 0 33px; margin: 0; position: relative; top: -22px;}

ol.web li::before {
    content: counter(step-counter);
    margin-right: 5px;
    font-size: 80%;
    background-color: #a5333a;
    color: white;
    font-weight: bold;
    padding: 3px 8px;
    border-radius: 3px;
}	

/* end SEO services list */

#content .extra {background: #5b6357 url(../bg-images/loon2.jpg) bottom left no-repeat; width: 200px;
 margin: 0 6px 16px; padding: 0 0 140px;}
 #content .extra img {margin: 0;}
#content .extra h5 {padding: 8px 4px 10px; margin:0; text-align: center; background: #5b6357; color: #f4f8e4; border-top: 2px solid #5b6357}
#content .extra p {margin: 0; font-size: 11px; color: #f4f8e4; padding: 10px;}

.extra a {color: #f4f8e4;}

span.go-here {background: url(../bg-images/arrow1.gif) 0 50% no-repeat; padding: 15px 5px 15px 35px; margin: 20px 5px 30px 6px;}

#content #resource2 ul.crawlers li {margin: 10px 10px 10px 20px;}
#content #resource2 ul.crawlers li p {margin: 0; padding: 0 0 10px 0; border-bottom: 1px dotted #000;}

/* packages */

div.packageTop {padding: 0 0 5px; margin: 0 0 14px 0; text-align: center;
border-bottom: 3px double #b4c8bd; width: 100%; color: #1a2457; }

div.packageTop a {padding: 6px; margin-bottom: 4px; display: inline-block;}
div.packageTop a:hover {background: #a2302d; color: #fefef6; text-decoration: none;}

#content .packageTop h2 {text-align: center; border: none;background: none; padding-bottom: 0; margin-bottom: 0;}

#resource2 h2.starter {background: #f9fde9 url(../web-packages/images/starter-button.jpg) 12px 12px no-repeat;  }
#resource2 h2.business {background: #f9fde9 url(../web-packages/images/business-button.jpg) 12px 12px no-repeat;}
#resource2 h2.premium {background: #f9fde9 url(../web-packages/images/premium-button.jpg) 12px 12px no-repeat;}
#resource2 div.price {text-align: left; font-size: 24px; font-family: Georgia, serif; color: #990000; margin: 10px 0 20px 20px; padding: 5px 0 10px 12px; width: 300px;}
#resource p.find {padding: 15px 50px 35px 100px; background: #f4f8e4 url(../images-new/arrow2.gif) 40px 0px no-repeat; margin: 10px ; width: 360px;}

#resource2 div.price {font-size: 26px; font-family: Georgia, serif; color: #990000; margin: 10px 26px; padding: 5px; width: 80%; clear: both;}

/* resource page tabs*/

#resource2 .categoryWrap h2 {background: #505f5a; color: #fff;}

p.resourceIntro {margin: 6px; padding: 6px; text-align: center;}

.resource-tab {width: 30%; min-width: 140px; background: #f3f7e3; border: 4px solid #fff; position: relative; height: 190px;  margin: 10px 0 20px 2%; float: left; text-align: center; padding-top: 10px;
 -moz-box-shadow: 0 0 2px 2px #d5ded4;
-webkit-box-shadow: 0 0 2px 2px #d5ded4;
box-shadow: 0 0 2px 2px #d5ded4;} 

#content .resource-tab h3 {margin: 2px; padding: 2px; border-top: 1px dotted #1a2457;
 border-bottom: 1px dotted #1a2457; color: #1a2457; text-align: center;}
#content .resource-tab p {margin: 2px; padding: 5px 2px; text-align: left;}
#content .resource-tab p a {font-weight: normal !important;}
#content .resource-tab h3 a:link, #content .resource-tab h3 a:visited { text-decoration: none; display: block;}
#content .resource-tab h3 a:hover {background: #f9f4d6;}

/* portfolio */

.project {text-align: center; width: 45%; float: left; padding: 5px; border: 1px solid #fefef6; max-width: 320px; margin-left: 2%;}
.project:hover {background: #fff; border: 1px solid #f5e6bb;}
.project img { margin: 8px 4px;}
.project2 {text-align: center; width: 45%; margin-left: 5px; float: right; padding: 5px; border: 1px solid #fefef6; max-width: 320px; margin-right: 2%;}
.project2:hover {background: #fff; border: 1px solid #f5e6bb;}
.project2 img { margin: 8px 4px;}


.infoWrap {background: #fefef6; margin: 20px auto; 
width: 90%; padding: 5px 0; border: 1px solid #f5e6bb; position: relative;}
.portfolioLeftText {margin-left: 8px;}
.infoWrap2 {background: #fffbf0; margin: 20px auto; background: #fefef6;
width: 95%; border: 1px solid #f5e6bb; text-align: center;  clear: both;}

.portfolioLeft {border: 3px double #f3e4bd; background: #fefef6; 
margin: 10px 10px 0 0; float: left; margin: 10px auto; width: 54%; margin-left: 1%;}	

.portfolioRight {background: #fefef6; border: 3px double #f3e4bd; padding: 12px 8px; text-align: left;
float: right; margin: 10px auto; width: 39%; max-width: 400px; margin-right: 1%;}
 
.portfolioLeft h2, .portfolioLeft p, .portfolioRight p {margin: 6px; padding: 0;}
.portfolioLeft h2 {font-size: 1.2em; padding-top: 4px;}


.siteWrap3 {width: 99%; }

h2.blue {font-weight: bold; border-top: 1px dotted #1a2450; border-bottom: 1px dotted #1a2450; clear: both;
color: #1a2450; padding: 6px 0 6px; margin: 20px 10px 10px; line-height: 1.5em; text-align: center;}

#content h3.city {clear: both; padding: 6px; margin: 6px; text-align: center !important;
border-top: 1px solid #f5e6bb; border-bottom: 1px solid #f5e6bb; background: #fffbf0}

.tnail {text-align: center; width: 192px; padding: 3px 0; margin: 5px auto;}
.tnail img {margin: 5px auto; background: #fefef6;
-moz-box-shadow: 0 0 5px #666;
-webkit-box-shadow: 0 0 5px #666;
 box-shadow: 0 0 5px #666;}
.tnail a {text-decoration: underline; color: #880000; font-weight: bold; font-size: .9em;}
#content .tnail a:hover {background: #f7f4e1;}
.tnail p {margin: 0px; padding: 12px 0; font-size: .9em; text-align: left;}


.tnail2{text-align: center; width: 25%;  height: 425px; padding: 3px 0; margin: auto;float: left; overflow: hidden; background: #fefef6}
.tnail2 img {margin: 5px auto; background: #fefef6;
-moz-box-shadow: 0 0 5px #666;
-webkit-box-shadow: 0 0 5px #666;
 box-shadow: 0 0 5px #666;}
.tnail2 a {text-decoration: underline; color: #880000; font-weight: bold;font-size: .9em;}
#content .tnail2 a:hover {background: #f7f4e1;}
.tnail2 p {margin: 0; padding: 12px 10px; text-align: left;}
.tnail2 p.name {text-align: center;}

.testimonialWrap {background: #f5e6bb; margin: 20px 3%; padding: 5px;}

.tnail3 {text-align: center; clear: both;  max-width: 800px; margin: 10px auto; 
padding: 10px 15px; background: #fefef6; border: 3px double #f5e6bb;}
#content .tnail3 h3, #content .tnail3 p {margin: 0; padding: 12px; text-align: left; }

div.logoWrap {width: 30%; float: left; text-align: center;margin-bottom: 10px;}
div.logos {background: #fff; clear: both;}
img.logo {margin-right: 5px;}
img.logo2 {margin-right: 1%;}

#main h3.testimonialTitle {background: #952c2a; color: #fefef6; padding: 4px; margin: 8px; text-align: center;}

/* responsive */

.responsive-details, .responsive-details2 {margin: 20px 2%; background: #f8fbf2; border: 3px double #ddbe7c; 
padding: 5px 5px 15px;}
.responsive-details2 {margin: 20px 1%;}
.responsive-details h3 {text-align: center;}

#content .responsive-details a.action {display: inline-block; margin: auto; width: 100px;}

.example {border: 1px dotted #000; width: 100%;  margin-bottom: 20px;}

.website-example {width: 50%; float: left; text-align: center; padding: 2% 1%;}

.website-example img {
 -moz-box-shadow: 0 0 3px 3px #ddd9c1;
  -webkit-box-shadow: 0 0 3px 3px #ddd9c1;
  box-shadow: 0 0 3px 3px #ddd9c1;}

.website-info {width: 44%; float: left; margin-left: 10px;}
.website-info p {text-align: justify;}

/* site map */

#content #resource2 ul.siteMap {font-size: .9em; margin: 6px;}
#content #resource2 ul.siteMap li {margin: 6px; list-style-type: none; background: none;}
#content  ul.siteMap ul.map1 {margin: 5px 0; padding: 5px 0 10px; border-bottom: 1px solid #c6c9b6;}
#content  ul.siteMap ul.map2 {margin: 5px 0; padding: 5px 0 10px;}
#content  ul.siteMap ul.map1 li {margin: 5px 10px 5px 20px; padding: 3px 5px 3px 20px; background: url(../web-packages/images/bullet-red.jpg) no-repeat 0% 6px !important; list-style-type: none;}
#content  ul.siteMap ul.map1 ul {margin-left: 0;}
#content  ul.siteMap ul.map1 li {margin: 0;}


/* footer */

footer {width:100%;margin: 0 auto 10px;background:#111;clear:both;border-top:6px solid #3a4b41;padding: 0;}
footer p {text-align: center;color:#f4f8e4;margin:0 auto;padding:4px 4px 12px; font-size: .9em;}

footer a:link, footer a:visited {color:#fafeea;}
.footerBlock ul {margin-left: 0;}
.footerBlock li {margin: 4px 0; display: block;}
.footerBlock a {display: inline-block;}
.footerBlock span {padding: 6px 5px;}
.footerBlock a {text-decoration: underline; padding: 5px; margin: 2px 0;}
.footerBlock a:link, .footerBlock a:visited {background: #1f1f1f;}
.footerBlock a:hover,.footerBlock a:active {color: #c1cac5; background: #942e27; text-decoration: none;}

footer p.seoInfo { margin: 0; padding: 0 0 10px;}
img.seoLink {position: relative; top: 5px;}
 
.footerBlock {width: 28%; margin-left: 5%; float: left; text-align: left;}
.footerBlock h4.topic {color: #f3efd4; text-align: left; margin: 6px 0; padding: 0; font-size: 1em;}
.footerBlock p {text-align: left; line-height: 1.3em; margin: 5px 0; padding: 0;}

#bottom {background: #3a4b41 url(http://www.crimsondesigns.com/bg-images/bg-bottom.png) repeat-x; margin: 0; clear: both; font-size: .9em; padding-top: 4px;}

#bottom a {display: inline-block; padding: 8px; margin: 2px;}

 #bottom a:link; #content #bottom a:visited {color: #552f02;}
 #bottom a:hover, #bottom a:active {background: #952c2a; color: #fefef6 ;}

footer p.seoInfo { margin: 0; padding: 0 0 10px; text-align: center;}
img.seoLink {position: relative; top: 10px;}

#navigation select {display: none;}

/* button */

.button {
display: inline-block;
outline: none;cursor: pointer;
text-align: center;
text-decoration: none !important;
font: 14px/100% Arial, Helvetica, sans-serif;
padding: 5px 10px !important;
text-shadow: 0 1px 1px rgba(0,0,0,.3);
-webkit-border-radius: .5em; 
-moz-border-radius: .5em;
border-radius: .5em;
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
box-shadow: 0 1px 2px rgba(0,0,0,.2);
}
.button:hover {text-decoration: none;}
.button:active {position: relative;top: 1px;}

/* green */
.green {
color: #f3f7e4 !important;
border: solid 1px #354c3f;background: #354c3f;
background: -webkit-gradient(linear, left top, left bottom, from(#43705d), to(#354c3f));
background: -moz-linear-gradient(top,  #43705d,  #354c3f);
}
.green:hover {
background: #bee2ce;
background: -webkit-gradient(linear, left top, left bottom, from(#618b73), to(#43705d));
background: -moz-linear-gradient(top,  #618b73,  #43705d);
}
.green:active {
color: #bee2ce;
background: -webkit-gradient(linear, left top, left bottom, from(#618b73), to(#43705d));
background: -moz-linear-gradient(top,  #618b73,  #43705d);
}

@media only screen and (max-width: 1000px) {
#main {margin: 0 auto; width: 95%;
background: url(http://www.crimsondesigns.com/bg-images-new/main.jpg) repeat-x;
}

#logoWrap {float: left; max-width:180px; width: 25%;}
#titleWrap {float: left; max-width: 500px; width: 74%;}

img.logo {margin:32px auto 0;border:0}

#business-name {position:relative;width:410px;height:50px;overflow:hidden; text-indent: -3333px;
font:16px arial, serif;margin:40px auto 0;padding:10px 0 0}

#business-name span {display:block;position:absolute;left:0;top:0;z-index:1;width:410px;height:50px; 
background:url(http://www.crimsondesigns.com/images-new/title-crimson-designs.png) top left no-repeat;
margin:0;padding:0;font-weight:700;color:#000;font:22px Georgia, serif;text-align:center}

#description, h2.home {margin: 0 0 5px 0;}

#contentWrap { background:#e4c688 url(http://www.crimsondesigns.com/bg-images/bg-stripes3.gif); padding-top: 10px;}
#content {}

#header, #header2, #header3 {margin: 0 auto; height:168px; position: relative; padding-top: 6px; width: 95%;}
#header, #header2, #header3 { background: #e1c283 url(http://www.crimsondesigns.com/bg-images-new/header-plain.jpg) no-repeat;}	

#contactBlock, #seoBlock, #resourceBlock {width: 28%; float: left;}

.portfolioLeft {width: 58%; }
.portfolioRight { width: 35%;}
#content ul.examples {margin:  10px 0;}
}

@media only screen and (max-width: 900px) {
	
#content2 {background: #f4f0d5;}
#leftDiv3 {width: 90%; float: none; margin: auto;}
#rightDiv3 {display: none;}
.website-example {width: 45%;padding: 2%;}
.website-info {width: 46%;}
.tnail2 {height: 480px;}
.portfolioLeft {width: 60%;}
.portfolioRight { width: 33%;}

}

@media only screen and (max-width: 860px) {
	/* responsive */

#content .website-example {float: none; width: 90%; padding: 10px 0 0; margin: auto;}
#content .website-example img {margin: 5px;}
#content .website-info {float: none; width: 90%; margin: auto;}
.resource-tab {height: 220px;} 	

.tnail2 {width: 48%; height: 410px;}
.infoLeft, .infoRight, .portfolioLeft, .portfolioRight {float: none; width: 90%; margin: 10px auto;}

}

@media only screen and (max-width: 800px) {
#intro {float: none; width: 90%; margin: 10px auto;}
#rightDiv {float: none; width: 90%; clear: both; margin: 10px auto;}
div#packageWrap {float:left; width: 34%; margin: 0 0 0 2%; padding-top: 10px; tex-align: center;}
div#reasonWrap {text-align: left;
word-wrap: break-word; margin: 0; float:left; width: 44%;}
div.social {float:left; width: 15%; margin: 0 0 0 4%; background: none;}
}

@media only screen and (max-width: 720px) {
	
	
#business-name {position:relative;width:410px;height:50px;overflow:hidden; text-indent: -3333px;
font:16px arial, serif;margin:42px auto 0;padding:10px 0 0; }

#business-name span {display:block;position:absolute;left:0;top:0;z-index:1;width:410px;height:50px; 
background:url(http://www.crimsondesigns.com/images-new/title-crimson-designs.png) top left no-repeat;
margin:0;padding:0;font-weight:700;color:#000;font:22px Georgia, serif;text-align:center}

#description, h2.home {margin: 0 0 5px 0;}

#main {margin: 0 auto; width: 95%; }
#contentWrap {width: 100%;}

#leftDiv, #rightDiv {width: 90%; float: none; margin: 10px auto;}
#rightDiv img {margin: auto; display: block; text-align: center;}

div#website-tip {margin: 10px auto;}	
.resource-tab {margin: 10px auto; float: none; width: 70%; height: 170px;}
#content .resource-tab h3 {margin-top: 0 !important;}
.tab-wrap {position: absolute; top: 75%; right: 4px; width: 50%; height: 50px;}
/* faq */

/* projects */

.siteWrap {margin-left: 1%;}
.siteWrap2 {margin: auto; float: none;}
.tnail-featured, .testimonial {float: none; width: 98% !important; margin: 0 auto 10px !important;}

	

/* faq */

.rightDiv3 {display: none;}

img.right {float: none; display: block; margin: 10px auto;}
#resource h4#button {display: none;}

#resource p.marginLeft {float: none; clear: both; margin: 10px 5%; padding: 0; width: 90%;}

/* resources */

#resource, #resource3 {padding-bottom: 120px;}

#leftDiv2, #rightDiv2 {float: none; width: 95%; margin: 10px;}
#rightDiv .extra {margin: auto; text-align: center;}

/* footer */

#contactBlock {float: none; width: 90%;
background: #1f1f1f; padding-bottom: 6px;}
#seoBlock, #resourceBlock {width: 40%; float: left;}
#contactBlock h4, #seoBlock h4, #resourceBlock h4 {text-align: center;}

}

@media only screen and (max-width: 650px) {
.linkWrap{margin: 0 auto; padding: 0 10px; max-width: 195px;}
 div#packageWrap, div#blogWrap, #content div.social {text-align: center; float: none; width: 90%; margin: 10px auto;}
 div.social a {display: inline-block;}
 
}

@media only screen and (max-width: 600px) {
	
#resource2 {width: 92%;}
	
#business-name {width:227px;height:85px;margin:45px auto 0;}
#business-name span {width:227px;height:90px;
background:url(http://www.crimsondesigns.com/bg-images/title-crimson-designs3.jpg) top left no-repeat;}

#description, h2.home {display: none;}

#main {margin: 0 auto; width: 95%; }
	
.infoLeft, .infoRight, .portfolioLeft, .portfolioRight {float: none; margin: 10px auto; width: 90%;}

img.alignRight {float: none; display: block; margin: 20px auto;}
img.alignRight2 {float: none; display: block; margin: 0 0 5px 5px;}
.socialLink {float: none; display: block; margin: 10px auto; text-align: center;}

h3.projectLink, h3.choice, p.our-plan {text-align: center;}

#content ul.pros {margin: 14px 0; background: #fefef6; padding: 10px 0;}
#content ul.pros li {border-left: none;}
#content ul.pros li.last {border-bottom: none;}

}

@media only screen and (max-width: 500px) {
#content ul.reasons {margin:10px 5px 10px 5px;}	
 #content div.social {display: block; width: 100%; text-align: center;}
 #my-accordion {display: none;}
 h1.introduce {margin:6px;}
h2.first {margin:6px;}
p.presence{text-align: justify;margin:6px;}
}

@media only screen and (max-width: 490px) {
#main {margin: 0 auto; width: 95%;}

#business-name {width:220px;height:85px;margin:45px auto 0;}

#business-name span {width:220px;height:90px;
background:url(http://www.crimsondesigns.com/bg-images/title-crimson-designs3.jpg) top left no-repeat;}

#logoWrap {float: left; max-width:150px; width: 30%;}
#titleWrap {float: left; max-width: 250px; width: 60%;}

#contentWrap {width: 100%;}

#content h1, #content h2, h3, h4, p {margin: 6px; padding: 0;}


.infoLeft, .infoRight, .portfolioLeft, .portfolioRight {float: none; width: 90%;}

/* faq */

#content2 {background: #f4f0d5;}
#leftDiv3 {width: 90%; float: none; margin: auto;}

/* projects */

.infoWrap2 {padding-left: 0;}

.siteWrap2 {margin: auto; float: none;}
.tnail-featured, .testimonial {float: none; width: 98% !important; margin: 0 auto 10px !important;}
.tnail2 {width: 90%; float: none;}

/* img */

img {width: auto; height: auto; max-width: 100%; height: auto;}

/* footer */

.footerBlock {float: none; width: 90%;}
footer h4 {text-align: center !important; margin: auto;}
	
}

@media only screen and (max-width: 349px) {
#main {margin: 0 auto;width: 99%;}
#contentWrap {width: 99%;}

#content {width: 99%;}

#resource2 {margin: 2%; max-width: 90%;}

/* header section */

#leftDiv {width: 90%; float: none; margin: 10px auto;}
.infoLeft, .infoRight {float: none; width: 90%;}
.resource-tab {margin: auto; float: none; width: 80%; height: 160px;}

/* faq */

#content2 {background: #f4f0d5;}
#leftDiv3 {width: 90%; float: none; margin: auto;}

/* projects */

.infoWrap2 {padding-left: 0;}
.siteWrap2 {margin: auto; float: none;}
.tnail-featured, .testimonial {float: none; width: 98% !important; margin: 0 auto 10px !important;}
.tnail2 {width: 90%; float: none; }

/* header */
img.logo {display: none;}

#business-name {width:192px; height:76px; margin-left:12px;padding:10px 0 0}
#business-name span {width:192px; height:76px;background:url(http://www.crimsondesigns.com/bg-images/title-crimson-designs4.jpg) top left no-repeat;}
#description {display: none;}

h2.home {display: none;}

img {width: auto; height: auto; max-width: 100%; height: auto;}
	
}

<!-- jetmenu -->

@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Open Sans'), local('OpenSans'), url(http://themes.googleusercontent.com/static/fonts/opensans/v7/cJZKeOuBrn4kERxqtaUH3bO3LdcAZYWl9Si6vvxL-qU.woff) format('woff');
}
.jetmenuWrap{ background:#3a4b41;}
.jetmenu{width:100%;padding:0;margin:0;position:relative;float:left;list-style:none;background:#3a4b41;}
.jetmenu li{display:inline-block; float: left;}
.jetmenu a{-o-transition:all .3s linear;-webkit-transition:all .3s linear;-moz-transition:all .3s linear;transition:all .3s linear;outline:none;z-index:10;}
.jetmenu > li > a{padding:12px 24px !important;font-family:'Open Sans', sans-serif;font-size:14px;color:#fefaea;text-decoration:none;display:inline-block;}
.jetmenu > li:hover > a,
.jetmenu > li.active > a{background:#952e27;color:#fff;}
.jetmenu ul.dropdown,
.jetmenu ul.dropdown li ul.dropdown{list-style:none;margin:0;padding:0;display:none;position:absolute;z-index:99;width:200px;background:#3a4b41;}
.jetmenu ul.dropdown{top:40px;}
.jetmenu ul.dropdown li ul.dropdown{left:140px;top:inherit;}
.jetmenu ul.dropdown li{clear:both;width:100%;font-size:14px;background:#3a4b41;}
.jetmenu ul.dropdown li a{width:100%;display:inline-block;float:left;clear:both;padding:8px 12px;font-family:'Open Sans', sans-serif;text-decoration:none;color:#fefaea;background:#3a4b41;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;border-top:1px solid #535353;}
.jetmenu ul.dropdown li:hover > a{background:#505f5a;color:#fefef6;}
.jetmenu .indicator{position:relative;left:5px;top:2px;font-size:14px;float:right;}
.jetmenu ul li .indicator{font-size:12px;top:1px;left:10px;}
.jetmenu > li.right{float:right;}
.jetmenu > li.right > .megamenu{right:0;}
.jetmenu > li.showhide{display:none;width:100%;height:50px;cursor:pointer;color:#999;background:#333;}
.jetmenu > li.showhide span.title{margin:15px 0 0 45px;font-family:'Open Sans', sans-serif;float:left;}
.jetmenu > li.showhide span.icon{margin:17px 50px;float:right;}
.jetmenu > li.showhide .icon em{margin-bottom:3px;display:block;width:20px;height:2px;background:#999;}
.black > li:hover > a, .black > li.active > a{background:#111111;color:#fff;}
.black ul.dropdown li:hover > a{background:#111111;color:#fff;}
.black li > .megamenu form input[type="text"]:focus, .black li > .megamenu form textarea:focus{border-color:#111111;}
.black li > .megamenu form input[type="submit"]:hover{background:#111111;color:#fff;}
.black li > .megamenu a:hover{color:#dedede;}
@media (max-width:1000px){
	
	.jetmenu > li > a{padding: 12px  26px !important;}	
}
@media (max-width:900px){
	.jetmenuWrap { border: 1px solid #333;}
	
	.jetmenu > li > a{padding: 12px  18px !important;}
}
@media (max-width:780px){
.jetmenuWrap {padding-left: 0;}	
	.jetmenu{}
.jetmenu > li{text-align:left;padding:0;display:block;width:100%;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;}
.jetmenu a{width:100%;background:#333;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;border-top:1px solid #535353;}
.jetmenu > li:hover ul.dropdown {display: block; }
.jetmenu ul.dropdown,
.jetmenu ul.dropdown li ul.dropdown{width:100% !important;left:0;position:static !important;border:none;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;}
.jetmenu ul.dropdown li{background:#fff !important;border:none;}
.jetmenu ul.dropdown > li > a{padding-left:60px !important;}
.jetmenu > li > ul.dropdown > li > ul.dropdown > li > a{padding-left:60px !important;}
.jetmenu > li > ul.dropdown > li > ul.dropdown > li > ul.dropdown > li > a{padding-left:80px !important;}
}