 html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {   margin:0;   padding:0;   border:0;   outline:0;   font-size:100%;   vertical-align:baseline;   background:transparent; } body { line-height: 1; } article,aside,details,figcaption,figure, footer,header,hgroup,menu,nav,section {  display:block; } nav ul {   list-style:none; } a {   margin:0;   padding:0;   font-size:100%;   vertical-align:baseline;   background:transparent; outline: none; } input, select {   vertical-align: middle; } table, tbody, tfoot, thead, tr, th, td {  vertical-align: top; } table { border-spacing: 0; }  .clearfix:before, .clearfix:after {   content: "";   display: table; } .clearfix:after {   clear: both; } .clr { clear: both; }  html {  box-sizing: border-box; } *, *:before, *:after {  box-sizing: inherit; }  .hidden { display: none; } .alignright { text-align: right !important; } .floatright { float: right !important; } .fullwidth { width: 100%; } .nowrap { white-space: nowrap; } .clickable { cursor: pointer; }  header { height: 500px;  max-width: 1170px; margin: 0 auto; position: relative; } header h1, header h2 { text-indent: -4500px; } header h2 { position: absolute; top: -30px;  height: 30px; } header h1 a { display: block; background-image: url(../_img/big_rudder_logo.png); height: 310px; background-repeat: no-repeat; background-position: 0px 70px; background-size: 580px auto; width: 600px; margin-left: -20px; } header #compass { background-image: url(../_img/compass.png); width: 335px; height: 335px; position: absolute; top: 60px; right: 115px; } #mainsite_link { width: calc((100vw - 1410px) / 2 + 1170px); text-align: right; position: absolute; top: 450px; } #mainsite_link a { display: inline-block; text-decoration: none; font-size: 0.9em; color: #222; font-weight: 600; text-transform: uppercase; background-color: rgba(255,255,255,0.65);  box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.15); padding: 3px 15px 2px 15px; }  #open_nav { width: 50px; height: 50px; border-radius: 50px; background-color: #004b4f; background-image: url(../_img/burger_lines.png); background-position: center center; background-repeat: no-repeat;  background-size: 28px auto; position: fixed; top: 10px; right: 10px; cursor: pointer; transition: all 0.2s ease-out; z-index: 20; } #open_nav:hover { background-color: #000; } #close_nav { display: block; color: #fff;  position: absolute; top: 10px; right: 10px; width: 50px; height: 50px; border-radius: 50px; background-color: #004b4f; text-align: center; font-size: 50px; line-height: 50px; cursor: pointer; z-index: 22; }  #globalnav { height: 0; width: 0; position: fixed;  right: 0px; top: 0px; background-color: rgba(62,78,79, 0.9); overflow-x: hidden;  transition: 0.5s;  opacity: 0; display: flex; justify-content: center; align-items: center; z-index: 21; } #globalnav.mob_open { height: 100%; width: 100%; top: 0; right: 0; opacity: 1; } #globalnav_inner {  box-shadow: 3px 20px 25px 0px rgba(0, 0, 0, 0.15); max-width: 900px; background: rgba(0,75,79,0.9); } #globalnav nav { color: #fff;  padding: 20px; margin: 20px; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr 1fr 1fr; grid-row-gap: 0px; grid-column-gap: 0; grid-auto-flow: column; } #globalnav nav a { box-sizing: border-box; display: block; text-decoration: none; color: #fff;  padding: 10px 20px; transition: all 0.2s ease-in-out; } #globalnav nav a:hover {  background: rgba(255,255,255,0.2); } #globalnav a h3 { font-family: Roboto Slab, sans-serif; font-size: 1.3em; } #globalnav a p { font-size: 0.85em; } @media(max-width: 1440px) { header h1 a {  background-position: 20px 85px;  background-size: 520px auto;  width: 600px;  margin-left: 0; } } @media(max-width: 1190px) {  } @media(max-width: 1000px) { header #compass {  width: 300px;  height: 300px;  top: -50px;  right: 0;  background-size: 300px auto;  background-repeat: no-repeat; } #mainsite_link {  width: auto;  text-align: left;  top: 20px;  left: 20px; } } @media(max-width:800px) { header h1 a {  background-position: center 85px;  width: 90%;  max-width: 600px;  margin: 0 auto;  background-size: contain; }  header #compass {  width: 25vw;  height: 25vw;  top: -50px;  right: auto; left: 0;  background-size: cover;  background-repeat: no-repeat; } #mainsite_link {  top: 20px;  left: auto;  right: 80px; } } @media(max-width:600px) { header {  height: auto;  margin-bottom: 30px; } header h1 a {  background-position: center 85px;  height: 50vw; } header #compass {  width: 25vw;  height: 25vw;  top: -50px;  right: auto; left: 0;  background-size: cover;  background-repeat: no-repeat; } } @media(max-width:500px) { header {  margin-bottom: 20px; } header h1 a {  background-position: left bottom;  height: 40vw;  width: 75%;  margin-left: 15px; margin-right: 0; }  header #compass {  width: 35vw;  height: 35vw;  top: -12vw;  right: 20vw; left:auto;  background-size: cover;  background-repeat: no-repeat; } #mainsite_link {  top: 20px;  left: 20px;  right: auto; } #globalnav nav {  display: block;  padding: 10px;  margin: 0px; }  #globalnav nav a {  padding: 10px 10px; } } @media(max-width:400px) { #mainsite_link {  top: 10px;  left: 10px; }  #mainsite_link a {  font-size: 0.8em;  box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.15);  padding: 3px 10px 2px 10px; } }html, body {  min-height: 100%; } body { position: relative; background-color: #ddc29e; background-image: url(../_img/BG3.jpg); background-repeat: repeat-y; background-position: center top; font-family: 'Roboto', sans-serif; font-size: 19px; line-height: 1.5; color: #444;  } .container { width: calc((100vw - 1410px) / 2 + 930px); } .blog .container { width: calc((100vw - 1410px) / 2 + 1170px); } .container.white { background-color: rgba(255,255,255,0.65);  box-shadow: 3px 20px 25px 0px rgba(0, 0, 0, 0.15); padding: 60px 0; }  aside#journey { position: absolute; left: calc((100vw - 1410px) / 2 + 930px); top: 283px; width: 480px; }  .content { max-width: 930px; margin-right: 0; margin-left: auto; padding-left: 120px; padding-right: 90px; } .blog .content { max-width: 1170px; margin-right: 0; margin-left: auto; padding-left: 120px; padding-right: 90px; } @media(max-width: 1440px) { aside#journey {  position: absolute;  left: auto;  right: 0; } .container {  width: calc((100vw - 480px)); }  .content {  padding-right: 3vw; } } @media(max-width: 1000px) { aside#journey {  display: none; } .container, .blog .container {  width: 92%; } .content {  padding-right: 3vw; } .blog .content {  padding-right: 5vw; } } @media(max-width: 740px) { .blog .content {  padding-left: 5vw; } } @media(max-width: 600px) { body {  font-size: 17px;  line-height: 1.5;  } .content {  padding-left: 20px; } .content h2 i, .content h3 i, .content h4 i, #our-name i {  background-image: none !important;  } } @media(max-width:500px) { body {  font-size: 15px;  line-height: 1.5;  } .container {  width: 100%;  width: 94%;  margin: 0 auto; } .container.white {  padding: 20px 0; } .content {  padding-right: 3vw;  padding-left: 3vw; }   .abbr_text[data-abbr]::after {  content: attr(data-abbr);   }  .abbr_text > span { display: none; } } .content h1, .content h2, .content h3, .content h4 { font-family: 'Roboto Slab', serif;  font-weight: 600; color: #000000; } .content h2 { font-size: 1.9em;  line-height: 1.2; margin-bottom: 1.2em; } .content h3, .content h4 { font-size: 1.36em; margin-bottom: 0.5em; } .content .mbnormal, .content p { margin-bottom: 1.5em; } .content .mbmedium { margin-bottom: 2em; } .content .mblarge { margin-bottom: 2.5em; } .content p.large { font-size: 1.1em; } .content p.light { font-weight: 300; } .content a { color: inherit; text-decoration: none; } .content > p:last-child, .content > hr:last-child, .content > ul:last-child, .content > ol:last-child, .content > table:last-child, .content > .video:last-child { margin-bottom: 0 !important; } .content p.read_more { line-height: 52px; margin-top: -15px; } .content p.read_more a { text-transform: uppercase; font-size: 0.9em; font-weight: 500;  position: relative; padding-right: 62px; color: #c1272d; } .content p.read_more a i { display: inline-block; height: 52px; width: 52px; background-image: url(../_img/read_more.png); background-size: 52px; position: absolute; right: 0; transform: rotate(-77deg); opacity: 0;  transition: opacity 0.5s ease-in, transform 0.5s ease-in; } .content p.read_more a:hover i { transform: rotate(0deg); opacity: 1;   transition: opacity 0.2s ease-in, transform 0.8s ease-out; } .content p.read_more.read a { color: #888; } .content p.read_more.read a i { transform: rotate(77deg); } .content p.read_more.read a:hover i { transform: rotate(180deg); } .content img.rwd { max-width: 100%; height: auto;  }  .content .panel { border: 2px solid #0385a9; border-left: none; border-top-right-radius: 12px; border-bottom-right-radius: 12px; padding: 40px 0; position: relative; } .content .panel p { padding-right: 2em; } .content .panel h3.panel-header { display: inline-block; background: #0385a9; color: #fff; font-family: Roboto, sans-serif; font-weight: 500; font-size: 1em; line-height: 1em; text-transform: uppercase; letter-spacing: 0.1em; margin: 0; padding: 7px 1.3em; border-radius: 10px; position: absolute; left: 0; top: -1em; } .content .panel hr.panel_break { margin: 0; border: none; border-bottom: 2px solid #0385a9; margin-right: 30px; } .content .panel h3.panel-header.sub-header {  border-radius: 10px; position: relative; left: 0; top: -18px; }  .content #the_terms h2 { margin-bottom: 0; height: 80px; line-height: 80px; position: relative; } .content #the_terms h2 span { color: #c1272d; } .content #the_terms h2 i { position: absolute; width: 98px; height: 80px; left: -108px; top: 0; } .content #the_terms h2#terms-marketing i { background-image: url(../_img/icons/marketing.png); } .content #the_terms h2#terms-brand i { background-image: url(../_img/icons/brand.png); } .content #the_terms h2#terms-advertising i { background-image: url(../_img/icons/advertising.png); } .content #the_terms .term-desc p { padding-right: 2em; }  #power-of-three .content:first-of-type { padding-right: 30px; } #power-of-three-intro { display: flex; } #power-of-three-intro > div { flex: 1 1 0px } #power-of-three-intro h2 { position: relative; } #power-of-three-intro h2 b { display: block; } #power-of-three-intro h2 i { position: absolute; width: 98px; height: 80px; left: -108px; top: 15px;  background-image: url(../_img/icons/three.png); } #power-of-three-intro > div.g2 { display: flex; align-items: center; justify-content: center; } #power-of-three-intro > div.g2 p { text-align: center; } #power-of-three-intro > div.g2 p img { max-width: 90%; height: auto; } .content #three_skills p:last-of-type { margin-bottom: 0; }   #what-we-do h3#h-deeper, #what-we-do h3#h-tweak { position: relative; } #what-we-do h3#h-deeper i, #what-we-do h3#h-tweak i { position: absolute; width: 98px; height: 98px; left: -108px; top: 0; } #what-we-do h3#h-deeper i { background-image: url(../_img/icons/shovel.png); } #what-we-do h3#h-tweak i { background-image: url(../_img/icons/stars.png); }  .content p#profile-intro { margin-bottom: 2.5em; } .content #profile p.read_more:last-of-type { margin-bottom: 0; }  .content #profile h4, .content h3#btl { position: relative; } .content #profile h4 i, .content h3#btl i { position: absolute; width: 98px; height: 120px; left: -108px; top: 0;  background-position: 0 0; background-repeat: no-repeat; } .content #profile h4#profile-rob i { background-image: url(../_img/team/rob.jpg); } .content #profile h4#profile-andy i { background-image: url(../_img/team/andy.jpg); } .content #profile h4#profile-steve i { background-image: url(../_img/team/steve.jpg); } .content h3#btl i { width: 98px; height: 120px; left: -108px; background-image: url(../_img/icons/btl.png); top: 2.4em; }  #testimonials .content .panel p:last-of-type { margin-bottom: 0; } #testimonials .content .client_logos { height: 120px; overflow: hidden; margin-bottom: 45px;  margin-right: 20px; }  #testimonials .content blockquote { max-width: none;  font-size: 1em; margin-bottom: 1.2em; } #testimonials .content blockquote:first-of-type { padding-top: 1.2em; } #testimonials .content blockquote:last-of-type { margin-bottom: 0.6em; } #testimonials .content blockquote p { font-family: 'Roboto', sans-serif;  color: #222; text-align: left; font-size: 1em; } #testimonials .content blockquote p span { font-family: inherit; } #testimonials .content blockquote p cite { font-style: normal; font-size: 0.9em; color: #0385a9; font-weight: 700; }  #who-are-you h3 { position: relative; } #who-are-you h3 i { position: absolute; width: 98px; height: 132px; left: -110px; top: 0;  background-position: 0 0; background-repeat: no-repeat; } #who-are-you h3#header-SMEs i { background-image: url(../_img/icons/SMEs.png); } #who-are-you h3#header-agencies i { background-image: url(../_img/icons/agencies.png); }  #our-name h3, #our-name #our-name-steer, #our-name-positive { position: relative; } #our-name h3 i, #our-name #our-name-steer i, #our-name-positive i { position: absolute; width: 98px; height: 98px; left: -108px; top: 0;  background-position: 0 0; background-repeat: no-repeat; } #our-name h3 i { background-image: url(../_img/icons/rudder.png); } #our-name #our-name-steer i { background-image: url(../_img/icons/steer.png); } #our-name-positive i { background-image: url(../_img/icons/up.png); }  @media(max-width: 1280px) { #testimonials .content .client_logos {  height: auto;  margin-bottom: 45px;  } } @media(max-width: 1170px) { #power-of-three-intro {  display: block;  } #power-of-three-intro > div.g2 {  display: block; } #power-of-three-intro > div.g2 p {  text-align: center;  } #power-of-three-intro > div.g2 p img {  max-width: 90%;  height: auto;  margin-left: -50px; }  } @media(max-width: 600px) { .content .panel {  padding: 20px 0; } #testimonials .content .panel, #who-we-are .content .panel {  padding-top: 40px;  }  #power-of-three .content:first-of-type {  padding-right: 3vw; } #power-of-three-intro > div.g2 p img {  max-width: 90%;  height: auto;  margin-left: 0 } } @media(max-width: 500px) { .content .panel {  padding: 10px 0; } .mob_hidden {  display: none;  } } @media(max-width: 400px) { .content #the_terms h2 {   height: auto;  line-height: inherit;  margin-bottom: 0.6em; } } blockquote { max-width: 630px; } blockquote p { color: #52625e; text-align: center; font-size: 24px; } blockquote p span { font-family: Paprika, serif; } blockquote p cite { font-style: normal; font-size: 19px; font-weight: 700; }  .quote_1 blockquote { max-width: 550px; } .quote_1 blockquote cite { text-align: right; display: block; padding-right: 40px; padding-top: 15px; }  .pagebreak-1 .content { padding-top: 100px; padding-bottom: 80px; text-align: right; padding-right: 45px; }  .pagebreak-2 .content, .pagebreak-3 .content, .pagebreak-4 .content { padding-top: 100px; padding-bottom: 50px; }  .pagebreak-5 .content { padding-top: 60px; padding-bottom: 40px; text-align: center; }  .pagebreak-6 .content { padding-top: 60px; padding-bottom: 40px; text-align: center; }  .pagebreak-7 .content { padding-top: 100px; padding-bottom: 100px; }  .pagebreak-8 .content { display: none; } @media(max-width: 1330px) {  .pagebreak-1 .content {  padding-right: 3vw;  padding-left: 3vw; } .pagebreak-1 .content p img {  max-width: 100%;  height: auto;  }  } @media(max-width: 1000px) {  .quote_1 {   } .quote_1 blockquote {  max-width: 550px;  margin: 0 auto;  } .quote_1 blockquote cite {  text-align: right;  display: block;  padding-right: 40px;  padding-top: 15px; }  } @media(max-width: 770px) {   .pagebreak-5 .content img {  max-width: 100%;  height: auto;  }  .pagebreak-6 .content {  padding-right: 10vw;  padding-left: 10vw;  } .pagebreak-6 .content img {  max-width: 100%;  height: auto;  }  } @media(max-width: 600px) {  blockquote p {  font-size: 21px; } blockquote p cite {  font-size: 17px; } .quote_1 blockquote {  width: 90%;  }  .pagebreak-1 .content {  padding-top: 40px;  padding-bottom: 30px; }   .pagebreak-2 .content, .pagebreak-3 .content, .pagebreak-4 .content {  padding-top: 50px;  padding-bottom: 20px; }  .pagebreak-5 .content {  padding-top: 30px;  padding-bottom: 15px; }   .pagebreak-6 .content {  padding-top: 60px;  padding-bottom: 40px;  text-align: center; }   .pagebreak-7 .content {  padding-top: 100px;  padding-bottom: 100px; } } @media(max-width:500px) { .quote_1  {  display: none; } } aside#journey {  height: calc(100% - 283px - 150px - 400px);  bottom: auto; overflow: hidden; } #journey .panel { background: rgba(0,38,43,0.6); position: absolute; top: 217px; left: 30px; width: 315px; color: #fff; padding: 15px 15px 15px 20px; border-radius: 10px; } #journey .panel h3 { color: #fbb03b; font-family: Paprika, serif;  font-weight: normal; padding: 10px 0; } #journey .panel p:first-of-type { font-size: 16px; line-height: 21px; opacity: 0.9; } #journey .panel p strong { color: #fbb03b; font-weight: normal; } #journey .panel p:last-of-type { padding-top: 10px; font-size: 15px; line-height: 23px; font-family: Paprika, serif; } #dots_holder { position: absolute; left: 56px; width: 366px; height: 100%; bottom: 0; } #dots_normal { position: absolute; width: 366px; height: calc(100% - 270px - 20px);  background-image: url(../_img/DOTS_NORMAL.png); z-index: 1; opacity:0.5; top: 0; } #dots_red { position: absolute; width: 366px; height: 100px; background-image: url(../_img/DOTS_RED.png); z-index: 2; } .poppins div { position: absolute; z-index: 3;  opacity: 0; transition: opacity 1.5s ease-out; } .poppins div.onscreen { opacity: 1; } .poppins div.offscreen { opacity: 0; } .poppins div.permanent { opacity: 1 !important; } #footer_pop { width: 480px; height: 270px; background-image: url(../_img/journey/pop_footer_v2.png); left: 0px; bottom: 0px; } #a1 { background-image: url(../_img/journey/1.png); width: 125px; height: 86px; left: 51px; top: 704px; } #a2 { background-image: url(../_img/journey/2.png); width: 247px; height: 254px; left: 129px; top: 855px; } #a3 { background-image: url(../_img/journey/3.png); width: 363px; height: 296px; left: 45px; top: 1344px; } #a4 { background-image: url(../_img/journey/4.png); width: 167px; height: 104px; left: 88px; top: 1796px; } #a5 { background-image: url(../_img/journey/5.png); width: 212px; height: 264px; left: 186px; top: 2189px; } #a6 { background-image: url(../_img/journey/6.png); width: 295px; height: 192px; left: 154px; top: 3126px; } #a7 { background-image: url(../_img/journey/7.png); width: 270px; height: 294px; left: 51px; top: 3422px; } #a8 { background-image: url(../_img/journey/8.png); width: 146px; height: 109px; left: 190px; top: 3963px; } #a9 { background-image: url(../_img/journey/9.png); width: 290px; height: 315px; left: 69px; top: 4409px; } #a10 { background-image: url(../_img/journey/10.png); width: 326px; height: 248px; left: 108px; top: 5066px; } #a11 { background-image: url(../_img/journey/11.png); width: 167px; height: 131px; left: 193px; top: 5546px; } #a12 { background-image: url(../_img/journey/12.png); width: 276px; height: 334px; left: 180px; top: 6108px; } #a13 { background-image: url(../_img/journey/13.png); width: 151px; height: 97px; left: 136px; top: 6828px; } #a14 { background-image: url(../_img/journey/14.png); width: 284px; height: 246px; left: 28px; top: 7493px; } #a15 { background-image: url(../_img/journey/15.png); width: 148px; height: 116px; left: 193px; top: 8028px; } #a16 { background-image: url(../_img/journey/16.png); width: 229px; height: 333px; left: 119px; top: 8414px; } #a17 { background-image: url(../_img/journey/17.png); width: 218px; height: 362px; left: 168px; top: 9186px; } #a18 { background-image: url(../_img/journey/18.png); width: 116px; height: 140px; left: 130px; top: 9902px; } #a19 { background-image: url(../_img/journey/19.png); width: 294px; height: 242px; left: 174px; top: 10349px; } #a20 { background-image: url(../_img/journey/20.png); width: 107px; height: 147px; left: 210px; top: 11051px; } #a21 { background-image: url(../_img/journey/21.png); width: 261px; height: 254px; left: 35px; top: 11564px; }footer { margin-bottom: 100px; } footer.container { background-color: #1b4456;  padding: 60px 0; border-top-right-radius: 500px; border-bottom-right-radius: 500px; } footer #footer_inner { display: flex; } footer #footer_inner > div.f1 { flex: auto; flex-basis: 60%; } footer #footer_inner > div.f2 { flex: auto; flex-basis: 40%; } footer #footer_inner > div.f1 p:last-of-type { margin-bottom: 0; } footer #footer_inner > div.f2 { display: flex; align-items: center; justify-content: center; } footer #footer_inner > div.f2 p { text-align: center;  margin-bottom: 0; font-size: 0; line-height: 0; } footer #footer_inner > div.f2 p img { max-width: 95%; height: auto; display: inline-block; }  footer .content, footer .content h2, footer .content h3 { color: #fff; } footer .content h2 { font-size: 1.9em;  line-height: 1.2; margin-bottom: 0.5em; position: relative; } footer .content h2 i { position: absolute; width: 98px; height: 80px; left: -110px; top: 65px;  background-repeat: no-repeat; background-image: url(../_img/icons/hello_footer.png); } footer #footer_inner > div.f1 p { padding-right: 2em; margin-bottom: 15px;  font-size: 1.02em; } footer #footer_inner > div.f1 p.cta { font-size: 1.4em; line-height: 1.3; color: #0385a9;  font-weight: 500; margin-bottom: 15px; } footer #footer_inner > div.f1 p.cta a { color: #0385a9;  transition: all 0.2s ease-in-out; } footer #footer_inner > div.f1 p.cta a:hover { color: #fff; }  .container#blog_callout { max-width: 1170px; width: auto; margin: 0 auto; } .container#blog_callout .content { max-width: 930px; margin-right: 0; margin-left: auto;  padding: 0; } .container#blog_callout .content .panel { background-image: url(../_img/icons/blog_pen.png); background-repeat: no-repeat; background-position: right 75px center; padding-bottom: 10px; border-color: #285d5b;  } .container#blog_callout .content .panel h2 { color: #990813; margin-bottom: 0.3em; } .container#blog_callout .content h2 i { position: absolute; width: 200px; height: 135px; left: -220px; top: 0; background-repeat: no-repeat; background-image: url(../_img/icons/blog.png); cursor: pointer; } .container#blog_callout .content .panel p.cursive { font-family: Paprika, serif;  color: #52625e; font-size: 1.2em; max-width: 600px; }  .container#blog_callout .content .panel p.read_more { margin-bottom: 0.5em; } @media(max-width: 1220px) { .container#blog_callout {  width: 94%; } } @media(max-width: 1160px) { .container#blog_callout .content h2 i {  display: none;  } .container#blog_callout .content {  max-width: none;  } } @media(max-width: 860px) { .container#blog_callout .content .panel {  background-image: none;   } .container#blog_callout .content .panel p.cursive {  max-width: none; } } @media(max-width: 600px) { .blog footer.container, footer.container {  width: 100%;  padding: 30px 0;  border-top-right-radius: 0;  border-bottom-right-radius: 0; } footer #footer_inner > div.f1 {  flex-basis: 70%; } footer #footer_inner > div.f2 {  flex-basis: 30%; } .container#blog_callout .content .panel {  border: none;  } .container#blog_callout .content .panel p.cursive {  color: #333; } #blog_callout .content p.read_more a {  background: #c1272d;  color: #fff;  padding: 0.5em 1.6em; } #blog_callout .content p.read_more a i {  display: none;  } } @media(max-width: 500px) { footer.container {  margin-bottom: 40px;  } footer #footer_inner {  display: block;  text-align: center; } footer #footer_inner > div.f1 {  margin-bottom: 30px; } footer #footer_inner > div.f1 p {  padding-right: 0; } footer #footer_inner > div.f2 p img {  max-width: 100px;  height: auto;  display: inline-block; } } 