@import url(http://fonts.googleapis.com/earlyaccess/droidsansethiopic.css);
body {
  font-family: "Gill Sans", sans-serif;
}

/******************************************
/* COVER IMAGE                   
/*******************************************/
/**/
.header {
  position: absolute;
}

.crop-height {
  max-height: 600px;
  overflow: hidden;
  position: relative;
}

li {
  list-style: none;
}

p {
  margin-bottom: 0;
}

img.scale {
  max-width: 100%;
  display: block;
  width: 100%;
  /* corrects obscure Firefox bug */
  /* just in case, to force correct aspect ratio */
  height: auto !important;
  /*width: auto\9; 
  /* ie8+9 - use modernizr instead of this \9 hack */
  /* lt ie8 */
  -ms-interpolation-mode: bicubic;
}
@media only screen and (max-width: 414px) {
  img.scale {
    max-width: 220%;
    width: 220%;
  }
}

img.flip {
  float: right;
}
@media only screen and (max-width: 414px) {
  img.flip {
    float: left;
  }
}

.row-videos {
  max-width: 100%;
}

@media only screen and (min-width: 1170px) {
  .large-55 {
    width: 33.3%;
  }
}

/******************************************
/* TEXT                 
/*******************************************/
/**/
.project-title {
  margin-top: 17rem;
  font-family: "Gill Sans", sans-serif;
}
@media only screen and (max-width: 414px) {
  .project-title {
    margin: 10rem 0 0 0;
  }
}
.project-title ul {
  text-align: center;
  margin: 1rem 0 2rem;
}
.project-title .date {
  font-size: .90rem;
  text-align: center;
  padding: .65rem;
  color: white;
}
@media only screen and (max-width: 414px) {
  .project-title .date {
    font-size: .65rem;
    padding: 0.25rem;
  }
}

h2 {
  color: white;
  font-size: 2rem;
  text-align: center;
  font-family: "Gill Sans", sans-serif;
}
@media only screen and (max-width: 414px) {
  h2 {
    font-size: 1rem;
    margin: 0;
  }
}

.data {
  list-style: none;
  display: inline-block;
  color: snow;
  font-size: .75rem;
  border-bottom: 3px solid;
  text-align: center;
  margin: 0 1rem;
  text-transform: uppercase;
}
.data:hover {
  background-color: #ff5de3;
}

.project-info {
  background-color: white;
  border: 6px solid black;
  padding: 3rem 3rem 3rem;
  margin-bottom: 2rem;
}
.project-info a {
  padding-bottom: .25rem;
  color: #dd1b75;
}
.project-info a:hover {
  background-color: #dd1b75;
  color: white;
}
@media only screen and (max-width: 414px) {
  .project-info {
    padding: 1.5rem;
    margin-bottom: 1rem;
    border: 4px solid black;
  }
}

.read-more {
  padding: 0;
  position: absolute;
  margin: 1.5rem 0;
}
.read-more a:active .project-para {
  height: 44rem;
  overflow: visible;
}

.project-para {
  position: relative;
  position: relative;
}
.project-para p {
  font-size: 1.05rem;
  padding-bottom: .75rem;
  text-overflow: ellipsis;
  word-wrap: break-word;
}
@media only screen and (max-width: 414px) {
  .project-para p {
    font-size: .75rem;
  }
}

.member-heading {
  color: #dd1b75;
  margin-bottom: .25rem;
  text-transform: uppercase;
  font-size: 1rem;
}
@media only screen and (max-width: 414px) {
  .member-heading {
    font-size: .75rem;
  }
}

@media only screen and (max-width: 414px) {
  .core-members {
    font-size: .75rem;
  }
}

.members li {
  list-style: none;
  display: inline-block;
  margin-right: 2rem;
}

.about {
  margin: 1rem 0 3rem 0;
}

.contributors {
  max-width: 26rem;
}

.info {
  border: 6px solid black;
}
.info h5 {
  padding: 1rem 0;
}

.reveal-modal .close-reveal-modal {
  font-size: 1.5rem;
  color: black;
}

.reveal-modal {
  max-width: 47rem;
}
.reveal-modal p {
  padding-bottom: .75rem;
}
@media only screen and (max-width: 414px) {
  .reveal-modal {
    min-height: 0;
  }
}

.modalTitle {
  font-family: "Conv_NuptialScriptLTStd";
}

/* This CSS is used for the Show/Hide functionality. */
ul.extra-info {
  margin-bottom: 6rem;
  text-align: center;
}
@media only screen and (max-width: 414px) {
  ul.extra-info {
    margin-bottom: 2rem;
  }
}
ul.extra-info li {
  font-size: 1.25rem;
  display: inline-block;
}
@media only screen and (max-width: 414px) {
  ul.extra-info li {
    font-size: .85rem;
  }
}
ul.extra-info a {
  padding: .5rem;
  border: 4px solid black;
}
ul.extra-info a:hover {
  background-color: #dd1b75;
  color: white;
}
@media only screen and (max-width: 414px) {
  ul.extra-info a {
    border: 3px solid black;
  }
}

.publication .press-links {
  border-bottom: 2px solid black;
}
.publication .press-links:hover {
  background-color: #dd1b75;
}

.pakhtun-quote {
  text-align: center;
  padding-bottom: .75rem;
}

.pakhtun-video {
  padding: 18px;
}

.donate a {
  color: #dd1b75;
  text-transform: uppercase;
  border-bottom: 1px solid #dd1b75;
  padding: .75rem 0 0 0;
  font-size: .9rem;
  text-align: center;
  margin: 0 27%;
  display: block;
}
@media only screen and (max-width: 414px) {
  .donate a {
    margin: 0;
    display: inline;
  }
}

.cv h5 {
  padding: 1rem 0;
}
@media only screen and (max-width: 414px) {
  .cv h5 {
    font-size: 1.5rem;
    text-align: center;
  }
}
.cv a {
  padding-bottom: 0;
  color: #dd1b75;
}
.cv li {
  padding-bottom: 1rem;
  line-height: 1.25rem;
  list-style: disc;
  margin-left: 1rem;
}

/******************************************
/* FLEXSLIDER                 
/*******************************************/
/**/
.map {
  float: right;
  width: 20px;
  margin: 4px;
}

#slider, #carousel {
  border: none;
}

.carousel li {
  max-width: 180px;
  margin-right: 0;
}
@media only screen and (max-width: 414px) {
  .carousel li {
    max-width: 100px;
  }
}

.slides img {
  padding-right: .25rem;
}

.flex-direction-nav a {
  opacity: 0;
}
.flex-direction-nav a:hover {
  opacity: 1;
}
@media only screen and (max-width: 414px) {
  .flex-direction-nav a {
    display: none;
  }
}

.flexslider-projections .flex-viewport {
  margin-top: 1rem;
}
.flexslider-projections .flex-direction-nav a {
  top: 70%;
}

.flex-gandi .flex-direction-nav a {
  top: 50%;
}

.flex-control-paging li a {
  background: rgba(221, 27, 117, 0.5);
}

.projections-video p {
  border-bottom: 2px solid #dd1b75;
  padding-bottom: 2px;
  display: inline;
  color: #dd1b75;
}

.grid-overlay {
  position: absolute;
  top: 0px;
  bottom: 20px;
  right: 10px;
  left: 10px;
  opacity: 0;
  background: white;
  border: 7px solid black;
  transition: 0.6s ease-out;
}
.grid-overlay .title {
  margin-top: 3rem;
  font-size: 1.5rem;
  text-align: center;
  font-family: "Conv_NuptialScriptLTStd";
  line-height: 1;
  padding-right: .15rem;
}
@media only screen and (max-width: 414px) {
  .grid-overlay .title {
    font-size: 1rem;
    padding: 0 0 .5rem 0;
    margin-top: .75rem;
  }
}
.grid-overlay .subhead, .grid-overlay .date {
  font-size: .75rem;
  text-align: center;
  margin-bottom: 0;
  color: black;
}
@media only screen and (max-width: 414px) {
  .grid-overlay .subhead, .grid-overlay .date {
    font-size: .75rem;
  }
}

.modal-gandi .title {
  margin-top: 25%;
}

.gandi-workshop li {
  list-style: decimal;
  list-style-position: inside;
}
@media only screen and (max-width: 414px) {
  .gandi-workshop li {
    font-size: .75rem;
  }
}

.small-block-grid-3 {
  margin-top: 2rem;
}

.item {
  position: relative;
  overflow: hidden;
}
.item:hover .grid-overlay {
  opacity: 1;
}

.flexslider {
  margin: 0;
  clear: both;
}

.flexslider .flex-direction-nav li a.flex-next {
  background: url("../img/arrows-02.png") no-repeat 0 0 !important;
}

.flexslider .flex-direction-nav li a.flex-prev {
  background: url("../img/arrows-01.png") no-repeat 0 0px !important;
}

.flexslider-projections .flex-direction-nav li a.flex-next {
  background: url("../img/arrows-02.png") no-repeat 0 0 !important;
  right: -60px;
  opacity: 1;
}

.flexslider-projections .flex-direction-nav li a.flex-prev {
  background: url("../img/arrows-01.png") no-repeat 0 0px !important;
  left: -40px;
  opacity: 1;
}

.flex-direction-nav a {
  color: transparent;
  text-shadow: none;
  width: 45px;
}
.flex-direction-nav a:visited {
  color: transparent;
}

.flex-direction-nav a:before {
  display: none;
  content: none;
  text-shadow: none;
  color: transparent;
}

#flex3 {
  padding: 0.5rem 0;
}

.masonry-grid {
  margin: 0 auto;
  width: 100%;
}
.masonry-grid img {
  width: 100%;
  display: block;
}

.masonry-grid:nth-child(1) {
  margin: 0;
}

.grid-item {
  padding: 1px;
  float: left;
}

.clear-float {
  clear: both;
}

.x-large-grid-item {
  width: 100%;
}

.large-grid-item {
  width: 65%;
  float: left;
}

.medium-grid-item {
  width: 50%;
}

.small-grid-item {
  margin-right: 0;
  width: 35%;
}

.x-small-grid-item {
  width: 25%;
}

.video-grid-item {
  float: right;
  width: 33.3%;
}
@media only screen and (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
  .video-grid-item {
    width: 33.3%;
  }
}
@media only screen and (max-width: 414px) {
  .video-grid-item {
    width: 100%;
  }
}

iframe {
  width: 100%;
}

.minus-margin {
  margin-top: -7px;
}

@media only screen and (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
  .mama-50 {
    width: 50%;
    margin: 0;
  }
}

@media only screen and (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
  .mama-100 {
    width: 100%;
  }
}

@media only screen and (max-width: 414px) {
  .baby-100 {
    width: 100%;
  }
}

.padding-end-page {
  padding: 2rem;
}

/******************************************
/* VIDEO                 
/*******************************************/
/**/
.flex-video {
  margin: 1rem;
}

.videos {
  padding: 2px;
  margin: 0;
}

/******************************************
/* LOCATION                 
/*******************************************/
/**/
.location-head {
  padding: 1rem;
  border: .35rem solid black;
  text-align: center;
  margin: 2rem 0;
  clear: both;
}
.location-head h3 {
  float: left;
  font-size: 1.25rem;
}

.location-text {
  font-size: 1.5rem;
  font-family: "Gill Sans", sans-serif;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
}
