____ ____ ___  ____ ___  _ _    _    ____
| __ |__| |__] |__| |  \ | |    |    |__|
|__] |  | |__] |  | |__/ | |___ |___ |  |

/* Design + Code by Gabe Abadilla / www.gabadilla.com / gabadilla@gmail.com */

/* RESETS */
html,button,input,select,textarea {color: #222;}
body {font-size: 1em; line-height: 1.4;}
::-moz-selection {background: #b3d4fc;text-shadow: none;}
::selection {background: #b3d4fc; text-shadow: none;}
hr {display: block;height: 1px;border: 0;border-top: 1px solid #ccc;margin: 1em 0;padding: 0;}
img {vertical-align: middle;}
fieldset {border: 0;margin: 0;padding: 0;}
textarea {resize: vertical;}
.chromeframe {margin: 0.2em 0;background: #ccc;color: #000;padding: 0.2em 0;}

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin:0; padding:0;}
table { border-collapse:collapse;border-spacing:0;}
fieldset,img { margin:0; padding:0; border:0;}
address,caption,cite,code,dfn,em,strong,th,var {font-style:normal;font-weight:normal;}
ol,ul {list-style:none;}
caption,th {text-align:left;}
h1,h2,h3,h4,h5,h6 {font-size:100%;font-weight:normal;}
q:before,q:after {content:'';}
abbr,acronym { border:0;}

/* COMMON */
html{background:#fff}
body{color:#000; font-family:"articulat-cf", sans-serif; font-weight: 500;  -webkit-font-smoothing:antialiased}
a, a img, a:hover, a:hover img, .animate{ -webkit-transition: all .3s ease-out; -moz-transition: all .3s ease-out; -ms-transition: all .3s ease-out;-o-transition: all .3s ease-out; transition: all .3s ease-out; text-decoration: none;}
a.quick, a.quick img, a.quick:hover, a.quick:hover img, .animate:hover{ -webkit-transition: all .2s ease-out; -moz-transition: all .2s ease-out; -ms-transition: all .2s ease-out;-o-transition: all .2s ease-out; transition: all .2s ease-out;}
img.imageScale{max-width:100%;}
div.wrapper{position:relative; margin:0 auto;}

div.container{width:75%; margin:0 auto;}
a.contactButton{}
div.fullWidth{width: 100%}
.reveal{transform: translateY(50px)}

div.nav{position:absolute; top:40px; width:100%; z-index:100; display: flex; justify-content:space-between; align-items:center;}
div.nav div.logo{margin-left: 40px; vertical-align: middle; }
div.nav div.logo span.name{display:block; font-size: 125%; font-weight: 800; line-height: 110%; letter-spacing: -.025rem; color:#000}
div.nav div.logo span.title{display:block; font-size: 125%; font-weight: 600; line-height: 110%; letter-spacing: -.025rem; color:#444}
div.nav div.logo span.title span.plus{color:#888}
div.nav div.email{margin-right: 40px}
div.nav div.email a.button{display:inline-block; background: #000; color:#fff; font-size:115%; line-height: 100%; font-weight: 700; padding:16px 26px; border-radius: 50px; border:2px solid #000 }
div.nav div.email a.button:hover{background:#fff; color:#000; border:2px solid #000}


/* INTRO */
div.topIntro{position: relative;}
div.intro div.topIntro div.introContent{padding:250px 0}
div.intro div.topIntro div.introContent h1{font-size: 350%; font-weight: 600; letter-spacing: -.1rem}
div.intro div.topIntro div.videoContainer{background:#000; position: relative}
div.intro div.topIntro div.videoContainer div.videoControl{position:absolute; bottom:0; right:0; width:50px; height:50px; background:none; z-index:10; cursor: pointer; }
div.intro div.topIntro div.videoContainer div.videoControl span.videoControlPlay{}
div.intro div.topIntro div.videoContainer div.videoControl span.videoControlPause{}
.videoControl:not(.playing) .videoControlPause, .videoControl.playing .videoControlPlay {display: none;}
div.intro div.topIntro div.videoContainer video{display: block}

/* WORK */
div.caseStudy{padding:250px 0 150px}
div.caseStudyDescription{margin:0 0 150px 0; width:100%}
div.caseStudyDescription div.container{margin: 0 auto;}
div.caseStudyDescription div.logoContainer{margin:0 0 25px 0; height:40px;}
div.caseStudyDescription div.logoContainer img{height:100%}
div.caseStudyDescription div.descriptionContainer{width:47%; margin-right:6%; float:left; padding:6px 0 0 0;}
div.caseStudyDescription div.descriptionContainer p.description{font-size: 115%}
div.caseStudyDescription div.descriptionContainer p.credit{margin-top: 20px; font-size:87.5%; opacity: .5}
div.caseStudyDescription div.servicesContainer{width:47%; float:left; }
div.caseStudyDescription div.servicesContainer ul.servicesList{width: 100%; column-count: 2;text-align: left}
div.caseStudyDescription div.servicesContainer ul.last{margin-right: 0;}
div.caseStudyDescription div.servicesContainer ul.servicesList li{font-size:100%; padding:8px 0; border-bottom: 1px solid rgb(255 255 255 / 0.15);}
div.caseStudyDescription div.servicesContainer ul.servicesList li.skipper{border-bottom: 0px}
div.caseStudyDescription div.servicesContainer ul.servicesList li:last-child{border-bottom: 0px}
div.caseStudyImages{width:90%; margin:0 auto}
div.caseStudyImagesMobile{display: none}
div.caseStudyImage{margin:0 0 60px 0}
div.caseStudyImage:last-child{margin:0}

/* OUTRO */
div.outro{padding:200px 0 100px}
div.outro div.outroTitleFirst{width:30%; float:left; font-size: 115%; font-weight:700; ;line-height: 150%; margin-top: 12px}
div.outro div.outroTitle{width:30%; float:left; font-size: 115%; font-weight:700; ;line-height: 150%;}
div.outro div.sectionContent{width:70%; float:left;}

div.outro div.overview{margin-bottom: 80px}
div.outro div.overview h2{font-size: 250%; font-weight: 600; line-height: 130%; margin-bottom: 30px; width:90%}
div.outro div.overview p{font-size: 115%; line-height: 150%; margin-bottom: 20px; width:90%}
div.outro div.overview div.contact{margin-top: 40px;}
div.outro div.overview div.contact a{margin-right: 25px; display:inline-block; background: #000; color:#fff; font-size:115%; line-height: 100%; font-weight: 700; padding:16px 26px; border-radius: 50px; border:2px solid #000 }
div.outro div.overview div.contact a:hover{background:#fff; color:#000; border:2px solid #000}
div.outro div.overview div.contact div.availability{display:inline-block; font-size: 115%; line-height: 100%; font-weight: 600;}
div.outro div.overview div.contact div.availability div.blinky{vertical-align: middle;display:inline-block; width:8px; height:8px; background-color: #0CAB8C; border-radius: 100px; margin-right: 12px; animation-name: blink; animation-duration: 2s; animation-iteration-count: infinite;}
@keyframes blink {50% {opacity: .25;}}

div.outro div.brands{margin-bottom: 100px}
div.outro div.brands ul.brandList{}
div.outro div.brands ul.brandList li{float:left; width:16.666%; margin-bottom: 0px;}

div.outro div.skillset{margin-bottom: 100px}
div.outro div.skillset ul.skillsetList{}
div.outro div.skillset ul.skillsetList li{float:left; font-size:115%; width:33.333%; margin-bottom: 12px;}

div.outro div.experience{margin-bottom: 100px}
div.outro div.experience ul.experienceList{}
div.outro div.experience ul.experienceList li{float:left; font-size:115%; width:33.333%; margin-bottom: 12px;}

div.outro div.references{margin-bottom: 100px}
div.outro div.references ul li.quote{margin-bottom: 50px;}
div.outro div.references ul li:last-child{margin-bottom: 0px}
div.outro div.references ul li.quote p{font-size: 115%; line-height: 150%;}
div.outro div.references ul li.quote div.source{margin-top: 15px}
div.outro div.references ul li.quote div.source span.sourceName{display: block; font-size:100%; font-weight: 700}
div.outro div.references ul li.quote div.source span.sourceTitle{display: block; font-size:100%; color:#444}

div.outro div.connect{}
div.outro div.connect ul.links{}
div.outro div.connect ul.links li{float:left; margin-right: 30px; }
div.outro div.connect ul.links li a{font-size: 115%; color:#000; font-weight: 600}
div.outro div.connect ul.links li a:hover{color:#999}

div.outro div.sectionDivider{margin:100px 0;}
div.outro div.sectionDivider div.divider{margin:0 200px; height:1px; background-color:rgba(0, 0, 0, 0.1);}


/* SPECIFIC STYLING */
#workTonal {background: #0A0A0B; color:#fff }
#workTonal ul.servicesList li{border-bottom: 1px solid rgb(255 255 255 / 0.15)}
#workTonal ul.servicesList li.skipper{border-bottom: 0px}
#workTonal ul.servicesList li:last-child{border-bottom: 0px}
#workNourished {background: #E8E6E3; color:#505662}
#workNourished ul.servicesList li{border-bottom: 1px solid rgb(0 0 0 / 0.10)}
#workNourished ul.servicesList li.skipper{border-bottom: 0px}
#workNourished ul.servicesList li:last-child{border-bottom: 0px}
#workNike {background: #FAFAFA; color:#000}
#workNike ul.servicesList li{border-bottom: 1px solid rgb(0 0 0 / 0.10)}
#workNike ul.servicesList li.skipper{border-bottom: 0px}
#workNike ul.servicesList li:last-child{border-bottom: 0px}
#workACapital {background: #0C121D; color:#fff}
#workACapital ul.servicesList li{border-bottom: 1px solid rgb(255 255 255 / 0.15)}
#workACapital ul.servicesList li.skipper{border-bottom: 0px}
#workACapital ul.servicesList li:last-child{border-bottom: 0px}
#workTamaraMellon {background: #FFF; color:#333}
#workTamaraMellon ul.servicesList li{border-bottom: 1px solid rgb(0 0 0 / 0.10)}
#workTamaraMellon ul.servicesList li.skipper{border-bottom: 0px}
#workTamaraMellon ul.servicesList li:last-child{border-bottom: 0px}
#workAccelRobotics {background: #161618; color:#fff}
#workAccelRobotics ul.servicesList li{border-bottom: 1px solid rgb(255 255 255 / 0.10)}
#workAccelRobotics ul.servicesList li.skipper{border-bottom: 0px}
#workAccelRobotics ul.servicesList li:last-child{border-bottom: 0px}
#workAmplitude {background: #EAEFF5; color:#333}
#workAmplitude ul.servicesList li{border-bottom: 1px solid rgb(0 0 0 / 0.10)}
#workAmplitude ul.servicesList li.skipper{border-bottom: 0px}
#workAmplitude ul.servicesList li:last-child{border-bottom: 0px}


/* MEDIA QUERIES*/

@media only screen and (max-width : 767px) and (min-width : 320px) {
  /* mobile */
  div.container{width:90%;}
  div.nav{top:25px;}
  div.nav div.logo{margin-left: 5%; vertical-align: middle; }
  div.nav div.logo span.name{display:block; font-size: 106.25%; font-weight: 800; line-height: 110%; letter-spacing: -.02rem; color:#000}
  div.nav div.logo span.title{display:block; font-size: 106.25%; font-weight: 600; line-height: 110%; letter-spacing: -.02rem; color:#444}
  div.nav div.email{margin-right: 5%}
  div.nav div.email a.button{font-size:100%; padding:12px 18px;}
  div.intro div.topIntro div.introContent{padding:125px 0 60px}
  div.intro div.topIntro div.introContent h1{font-size: 200%; letter-spacing: -.03rem; width:100%; line-height: 130%; font-weight: 700}
  div.caseStudy{padding:100px 0 75px}
  div.caseStudyDescription{margin:0 0 30px 0;}
  div.caseStudyDescription div.descriptionContainer{width:100%; float:left; margin:0 0 20px 0; padding:0;}
  div.caseStudyDescription div.logoContainer{margin:0 0 20px 0; height:30px;}
  div.caseStudyDescription div.descriptionContainer p.description{font-size: 100%;}
  div.caseStudyDescription div.descriptionContainer p.credit{margin-top: 8px; font-size:81.25%; opacity: .6}
  div.caseStudyDescription div.servicesContainer{width:100%; float:left; }
  div.caseStudyDescription div.servicesContainer ul.servicesList{width: 100%; column-count: 1;}
  div.caseStudyDescription div.servicesContainer ul.servicesList li{display: inline; font-size:87.5%; padding:0; border-bottom: 0px; opacity: .8; line-height: 125%}
  div.caseStudyDescription div.servicesContainer ul.servicesList li:after {content: ", ";}
  div.caseStudyDescription div.servicesContainer ul.servicesList li:last-child:after{content: "";}
  div.caseStudyImage{margin:0 0 3% 0}
  div.caseStudyImages{width:100%; margin:0 auto; display: none;}
  div.caseStudyImagesMobile{display: block; width:100%;margin:0 auto}

  #workTonal ul.servicesList li{border-bottom: 0px}
  #workTonal ul.servicesList li.skipper{border-bottom: 0px}
  #workTonal ul.servicesList li:last-child{border-bottom: 0px}
  #workNourished ul.servicesList li{border-bottom: 0px}
  #workNourished ul.servicesList li.skipper{border-bottom: 0px}
  #workNourished ul.servicesList li:last-child{border-bottom: 0px}
  #workNike ul.servicesList li{border-bottom: 0px}
  #workNike ul.servicesList li.skipper{border-bottom: 0px}
  #workNike ul.servicesList li:last-child{border-bottom: 0px}
  #workACapital ul.servicesList li{border-bottom: 0px}
  #workACapital ul.servicesList li.skipper{border-bottom: 0px}
  #workACapital ul.servicesList li:last-child{border-bottom: 0px}
  #workTamaraMellon ul.servicesList li{border-bottom: 0px}
  #workTamaraMellon ul.servicesList li.skipper{border-bottom: 0px}
  #workTamaraMellon ul.servicesList li:last-child{border-bottom: 0px}
  #workAccelRobotics ul.servicesList li{border-bottom: 0px}
  #workAccelRobotics ul.servicesList li.skipper{border-bottom: 0px}
  #workAccelRobotics ul.servicesList li:last-child{border-bottom: 0px}
  #workAmplitude ul.servicesList li{border-bottom: 0px}
  #workAmplitude ul.servicesList li.skipper{border-bottom: 0px}
  #workAmplitude ul.servicesList li:last-child{border-bottom: 0px}

  div.outro{padding:100px 0 75px}
  div.outro div.outroTitleFirst{width:100%; font-size: 100%; margin: 0 0 20px 0}
  div.outro div.outroTitle{width:100%; font-size: 100%;margin: 0 0 20px 0}
  div.outro div.sectionContent{width:100%; float:left;}
  div.outro div.overview{margin-bottom: 50px}
  div.outro div.overview h2{font-size: 180%; line-height: 130%; letter-spacing: -.03rem; margin-bottom: 15px; font-weight: 700}
  div.outro div.overview p{font-size: 100%; line-height: 150%; margin-bottom: 20px}
  div.outro div.overview div.contact{margin-top: 25px;}
  div.outro div.overview div.contact a{margin:0 20px 20px 0; font-size:100%; padding:12px 18px;}
  div.outro div.overview div.contact div.availability{font-size: 100%; }
  div.outro div.overview div.contact div.availability div.blinky{width:6px; height:6px;margin-right: 8px;}
  div.outro div.services{margin-bottom: 75px;}
  div.outro div.services .marquee {font-size:300%; line-height: 120%; letter-spacing: -.125rem;}
  div.outro div.services .marquee__part {padding: 0 18px;}
  
  div.outro div.brands{margin-bottom: 75px}
  div.outro div.brands ul.brandList li{width:33.3%; font-size: 100%; margin-bottom: 0px;}

  div.outro div.skillset{margin-bottom: 75px}
  div.outro div.skillset ul.skillsetList li{width:50%; font-size:100%; margin-bottom: 10px;}
  
  div.outro div.experience{margin-bottom: 75px}
  div.outro div.experience ul.experienceList li{width: 50%; font-size:100%; margin-bottom: 10px;}
  
  
  div.outro div.references{margin-bottom: 75px}
  div.outro div.references ul li.quote{margin-bottom: 30px;}
  div.outro div.references ul li.quote p{font-size: 100%; line-height: 150%;}
  div.outro div.references ul li.quote div.source{margin-top: 10px}
  div.outro div.references ul li.quote div.source span.sourceName{font-size:87.5%;}
  div.outro div.references ul li.quote div.source span.sourceTitle{font-size:87.5%}
  div.outro div.references ul li:last-child{margin-bottom: 0px}
  div.outro div.connect ul.links li{margin-right: 20px; }
  div.outro div.connect ul.links li a{font-size: 100%;}
}
@media only screen and (max-width : 1023px) and (min-width : 768px) {
    /* tablet portrait */
    div.container{width:94%;}
    div.nav{position:absolute; top:40px;}
    div.nav div.logo{margin-left: 3%; vertical-align: middle; }
    div.nav div.logo span.name{display:block; font-size: 125%; font-weight: 800; line-height: 110%; letter-spacing: -.02rem; color:#000}
    div.nav div.logo span.title{display:block; font-size: 125%; font-weight: 600; line-height: 110%; letter-spacing: -.02rem; color:#444}
    div.nav div.email{margin-right: 3%}
    div.nav div.email a.button{display:inline-block; background: #000; color:#fff; font-size:112.5%; line-height: 100%; font-weight: 700; padding:16px 26px; border-radius: 50px; border:2px solid #000 }
    div.nav div.email a.button:hover{background:#fff; color:#000; border:2px solid #000}
    div.intro div.topIntro div.introContent{padding:200px 0 150px}
    div.intro div.topIntro div.introContent h1{font-size: 200%; letter-spacing: -.075rem; width:90%;}
    div.caseStudy{padding:100px 0 100px}
    div.caseStudyDescription{margin:0 0 50px 0;}
    div.caseStudyDescription div.descriptionContainer{width:100%; float:left; margin:0 0 20px 0; padding:0;}
    div.caseStudyDescription div.logoContainer{margin:0 0 20px 0; height:30px;}
    div.caseStudyDescription div.descriptionContainer p.description{font-size: 112.5%; width:90%}
    div.caseStudyDescription div.descriptionContainer p.credit{margin-top: 15px; font-size:81.25%; opacity: .6}
    div.caseStudyDescription div.servicesContainer{width:100%; float:left; }
    div.caseStudyDescription div.servicesContainer ul.servicesList{width: 100%; column-count: 2;}
    div.caseStudyDescription div.servicesContainer ul.servicesList li{font-size:100%; padding:10px 0; border-bottom: 1px solid rgb(255 255 255 / 0.15);}
    div.caseStudyImages{width:94%; margin:0 auto; max-width: 1800px}
    div.caseStudyImage{margin:0 0 3% 0}
    div.outro{padding:100px 0 100px}
    div.outro div.outroTitleFirst{width:100%; font-size: 112.5%; margin: 0 0 25px 0}
    div.outro div.outroTitle{width:100%; font-size: 112.5%;margin: 0 0 25px 0}
    div.outro div.sectionContent{width:100%; float:left;}
    div.outro div.overview{margin-bottom: 75px}
    div.outro div.overview h2{font-size: 200%; line-height: 130%; margin-bottom: 25px}
    div.outro div.overview p{font-size: 112.5%; line-height: 150%; margin-bottom: 25px}
    div.outro div.overview div.contact{margin-top: 30px;}
    div.outro div.overview div.contact a{margin-right: 20px; font-size:112.5%;}
    div.outro div.overview div.contact div.availability{font-size: 112.5%;}
    div.outro div.overview div.contact div.availability div.blinky{width:6px; height:6px;}
    div.outro div.services{margin-bottom: 100px;}
    div.outro div.services .marquee {font-size:600%; line-height: 120%; letter-spacing: -.125rem;}
    div.outro div.services .marquee__part {padding: 0 40px;}
    div.outro div.brands{margin-bottom: 100px}
    div.outro div.brands ul.brandList li{font-size: 112.5%; margin-bottom: 12px;}
    div.outro div.references{margin-bottom: 100px}
    div.outro div.references ul li.quote{margin-bottom: 30px;}
    div.outro div.references ul li.quote p{font-size: 112.5%; line-height: 150%;}
    div.outro div.references ul li.quote div.source{margin-top: 10px}
    div.outro div.references ul li.quote div.source span.sourceName{font-size:100%;}
    div.outro div.references ul li.quote div.source span.sourceTitle{font-size:100%}
    div.outro div.references ul li:last-child{margin-bottom: 0px}
    div.outro div.connect ul.links li{margin-right: 25px; }
    div.outro div.connect ul.links li a{font-size: 112.5%;}
}
@media only screen and (max-width : 1279px) and (min-width : 1024px) {
    /* small desktop/tablet landscape */
    div.container{width:90%;}
    div.intro div.topIntro div.introContent{padding:200px 0 150px}
    div.intro div.topIntro div.introContent h1{font-size: 300%; letter-spacing: -.1rem; }
    div.caseStudy{padding:200px 0 150px}
    div.caseStudyDescription div.logoContainer{margin:0 0 20px 0; height:35px;}
    div.caseStudyDescription{margin:0 0 100px 0;}
    div.caseStudyDescription div.descriptionContainer p.credit{margin-top: 15px;}
    div.caseStudyImages{width:90%; margin:0 auto; max-width: 1800px}
    div.caseStudyImage{margin:0 0 40px 0}
    div.outro{padding:200px 0 100px}
    div.outro div.overview{margin-bottom: 100px}
    div.outro div.services{margin-bottom: 150px;}
    
    div.outro div.brands{margin-bottom: 100px}
    div.outro div.brands ul.brandList li{margin-bottom: 0px;}
    div.outro div.skillset{margin-bottom: 100px}
    div.outro div.skillset ul.skillsetList li{font-size:115%; margin-bottom: 10px;}
    div.outro div.experience{margin-bottom: 100px}
    div.outro div.experience ul.experienceList li{font-size:115%; margin-bottom: 10px;}
    
    div.outro div.references{margin-bottom: 100px}
}
@media only screen and (max-width : 1799px) and (min-width : 1280px) {
    /* typical desktop */
}
@media only screen and (min-width : 1800px) {
    /* giant desktop */
    div.container{width:1400px; margin:0 auto;}
    div.intro div.topIntro div.introContent h1{font-size: 400%;letter-spacing: -.1rem; width:90%}
    div.caseStudy{padding:300px 0 200px}
    div.caseStudyDescription div.descriptionContainer p.description{font-size: 150%}
    div.caseStudyDescription div.descriptionContainer p.credit{margin-top: 20px; font-size:100%; opacity: .5}
    div.caseStudyDescription div.servicesContainer ul.servicesList li{font-size:125%; padding:10px 0; border-bottom: 1px solid rgb(255 255 255 / 0.15);}
    div.caseStudyImages{width:90%; margin:0 auto; max-width: 1800px}
    div.caseStudyImage{margin:0 0 60px 0}
    div.outro{padding:250px 0 150px}
    div.outro div.outroTitleFirst{font-size: 150%; margin-top: 26px}
    div.outro div.outroTitle{font-size: 150%;}
    div.outro div.overview{margin-bottom: 150px}
    div.outro div.overview h2{font-size: 350%; line-height: 130%; margin-bottom: 25px}
    div.outro div.overview p{font-size: 150%; line-height: 150%; margin-bottom: 25px}
    div.outro div.overview div.contact{margin-top: 40px;}
    div.outro div.overview div.contact a{margin-right: 25px; font-size:150%;}
    div.outro div.overview div.contact div.availability{font-size: 150%;}
    div.outro div.overview div.contact div.availability div.blinky{width:8px; height:8px;}
    div.outro div.services{margin-bottom: 200px;}
    div.outro div.services .marquee {font-size:800%; line-height: 120%; letter-spacing: -.125rem;}
    div.outro div.services .marquee__part {padding: 0 40px;}
    
    div.outro div.brands{margin-bottom: 125px}
    div.outro div.brands ul.brandList li{margin-bottom: 20px;}
    div.outro div.skillset{margin-bottom: 125px}
    div.outro div.skillset ul.skillsetList li{font-size:150%; margin-bottom: 15px;}
    div.outro div.experience{margin-bottom: 125px}
    div.outro div.experience ul.experienceList li{font-size:150%; margin-bottom: 15px;}
    
    div.outro div.references{margin-bottom: 125px}
    div.outro div.references ul li.quote{margin-bottom: 60px;}
    div.outro div.references ul li.quote p{font-size: 150%; line-height: 150%;}
    div.outro div.references ul li.quote div.source{margin-top: 15px}
    div.outro div.references ul li.quote div.source span.sourceName{font-size:112%;}
    div.outro div.references ul li.quote div.source span.sourceTitle{font-size:112%}
    div.outro div.references ul li:last-child{margin-bottom: 0px}
    div.outro div.connect ul.links li{margin-right: 40px; }
    div.outro div.connect ul.links li a{font-size: 150%;}
}

@media print {
    * {background: transparent !important; color: #000 !important; /* Black prints faster: h5bp.com/s */ box-shadow: none !important; text-shadow: none !important;}
    a, a:visited { text-decoration: underline;}
    a[href]:after { content: " (" attr(href) ")";}
    abbr[title]:after { content: " (" attr(title) ")";}
    .ir a:after,a[href^="javascript:"]:after,a[href^="#"]:after {content: "";}
    pre, blockquote { border: 1px solid #999; page-break-inside: avoid;}
    thead {display: table-header-group; /* h5bp.com/t */}
    tr, img {page-break-inside: avoid;}
    img {max-width: 100% !important;}
    @page {margin: 0.5cm;}
    p, h2, h3 { orphans: 3; widows: 3;}
    h2, h3 { page-break-after: avoid;}
}

/* CLEARFIX */
.clearfix:after {content: ".";display: block;clear: both;visibility: hidden;line-height: 0;height: 0;}
.clearfix {display: inline-block;}
html[xmlns] .clearfix {display: block;}
* html .clearfix {height: 1%;}