
<!-- North Brooklyn Dispatch -- copied from NY62022 theme Special fonts?
font-family: 'Playfair Display', serif;
font-family: 'Roboto', sans-serif;

EAT ALL THINGS FONTS
font-family: 'Karla', sans-serif;
font-family: 'Pacifico', cursive;

-->

<!-- 2022 STYLE Sheet based off of NoBro -->


header h1 {
font-weight: 700;
margin: 0;

font-family: 'Playfair Display', serif;
font-size: 12px;
Text-transform: uppercase;
Padding: 20px;

}

/***********************************
<!-- navigation bar is in header -->
  ************************************/

header nav {
  display: flex;
  justify-content: flex-end;
  background-size: cover;
  text-transform: uppercase;
    background-image: url("");
}

header p {
  padding: 0 20px;
  margin: 0;


}

p {
font-family: 'Roboto', sans-serif;

}

.pill-black, .pill-white {
  border: 0.5px solid;
  border-radius: 5px;
  text-align: center;
font-family: 'Roboto', sans-serif;

}

.pill-black {
  background-color: #000000;
  color: #FFFFFF;


}

.nav-item {
Text-transform: uppercase;
letter-spacing: 3px;
font-size: .8em;

}

.nav-item a {
Color: #000;

}



.jumbotron {
 background-image: url("");
background-color: #fff;
border-color: #000;
background-repeat: no-repeat;
background-size: 100%;
}

.jumbotron h1 {
color: #000;
font-family: 'Playfair Display', serif;
font-size: 5em;
text-align: center;


}

.jumbotron h2 {
color: #fff;
font-family: 'Roboto', sans-serif;
font-size: 3em;
text-align: center;

}

h1 {
color: #6ebe46;
font-family: 'Playfair Display', serif;
font-size: 2.5em;
font-weight: bold;

}


 h2
{
color: #000;
font-family: 'Roboto', sans-serif;
font-size: 2em;
font-weight: bold;
text-align: center;

}

p {
font-family: 'Roboto', sans-serif;
}



.book {

background-color: #fdf4e3;
}

.book h1 {
    color: #000;
    font-family: 'Playfair Display', serif;
font-size: 3em;
font-weight: bold;
text-align: center;
padding-top: 3px;
}

.book h2 {
    color: #000;
    font-family: 'Playfair Display', serif;
font-size: 1.8em;
font-weight: bold;
text-align: left;
padding-top: 3px;

}

.book h3 {
    color: #000;
    font-family: 'Playfair Display', serif;
font-size: 1.2em;
font-weight: bold;
text-align: left;
padding-top: 3px;

}


.prime {

    background-color: #004466;
    }

    .prime h1{
        color: #fff;
        font-family: 'Playfair Display', serif;
        font-size: 5em;
    }

    .prime h2{
        color: #fff;
        font-family: 'Playfair Display', serif;
        font-size: 2em;
        text-align: left;
    }

    .prime p {
        color: #fff;

    }

.prime a {
    color: #ccc;

}

.prime a:visited {
    color:#ccc;
}

.events {
    background-color: #052536;


}

.events h1{
    color: #fff;
    font-family: 'Playfair Display', serif;
    font-size: 5em;
}

.events h2{
    color: #fff;
    font-family: 'Playfair Display', serif;
    font-size: 2em;
    text-align: left;
}


.events h3 {

    font-family: 'Karla', sans-serif;
    text-transform: uppercase;
    color: #eb3700;
    font-size: 1.2em;
}
.events h4 {

    font-family: 'Roboto', sans-serif;
    text-transform: uppercase;
    color: #eb3700;
    font-size: .9em;
}

.events p {
    color: #fff;

}

.events a {
color: #ccc;

}

.events a:visited {
color:#ccc;
}








.publication {

    background-color: #730099;
    }

    .publication h1{
        color: #fff;
        font-family: 'Playfair Display', serif;
        font-size: 5em;
    }

    .publication h2 {
        color: #fff;
        font-family: 'Playfair Display', serif;
        font-size: 2em;
        text-align: left;
    }

    .publication h3 {
        color: #fff;
        font-family: 'Playfair Display', serif;
        font-size: 1.5em;
        text-align: left;
    }

    .publication p {
        color: #fff;

    }

.publication a {
    color: #ccc;

}

.publication a:visited {
    color:#ccc;
}






.design {

    background-color: #000;
}


.design h1{
    color: #fff;
    font-family: 'Playfair Display', serif;
    font-size: 5em;
}

.design h2 {
    color: #fff;
    font-family: 'Playfair Display', serif;
    font-size: 2em;
    text-align: left;
}

.design h3 {
    color: #fff;
    font-family: 'Playfair Display', serif;
    font-size: 1.4em;
    text-align: left;
    line-height: 1.6;
}

.design p {
    color: #fff;

}

.design a {
color: #ccc;

}

.design a:visited {
color:#ccc;
}







.print {

    background-color: #191f1b;
}


.print h1{
    color: #fff;
    font-family: 'Playfair Display', serif;
    font-size: 5em;
}

.print h2 {
    color: #fff;
    font-family: 'Playfair Display', serif;
    font-size: 2em;
    text-align: left;
}

.print h3 {
    color: #fff;
    font-family: 'Playfair Display', serif;
    font-size: 1.4em;
    text-align: left;
    line-height: 1.6;
}

.print p {
    color: #fff;

}

.print a {
color: #ccc;

}

.print a:visited {
color:#ccc;
}







.projects {

    background-color: #e65c00;
}


.projects h1{
    color: #fff;
    font-family: 'Playfair Display', serif;
    font-size: 5em;
}

.projects h2 {
    color: #fff;
    font-family: 'Playfair Display', serif;
    font-size: 2em;
    text-align: left;
}

.projects p {
    color: #fff;

}

.projects a {
color: #ccc;

}

.projects a:visited {
color:#ccc;
}





.comms {

    background-color: #fff;
}


.comms h1{
    color: #000033;
    font-family: 'Playfair Display', serif;
    font-size: 5em;
}

.comms h2 {
    color: #000033;
    font-family: 'Playfair Display', serif;
    font-size: 2em;
    text-align: left;
}


.comms h2 {
    color: #000033;
    font-family: 'Playfair Display', serif;
    font-size: 1.7em;
    text-align: left;
}

.comms p {
    color: #000033;

}

.comms a {
color: #33334d;

}

.comms a:visited {
color:#33334d;
}


.gogreen {
    background-color:  #677458;
    <!-- OLD HEX #558000 -->
}



.gogreen h1{
    color: #fff;
    font-family: 'Playfair Display', serif;
    font-size: 5em;
}

.gogreen h2 {
    color: #fff;
    font-family: 'Playfair Display', serif;
    font-size: 2em;
    text-align: left;
}

.gogreen p {
    color: #fff;

}

.gogreen a {
color: #ccc;

}

.gogreen a:visited {
color:#ccc;
}








.bigbrightyellow {
    background-color:  #ffd527;
}



.bigbrightyellow h1{
    color: #000;
    font-family: 'Playfair Display', serif;
    font-size: 5em;
}

.bigbrightyellow h2 {
    color: #292929;
    font-family: 'Playfair Display', serif;
    font-size: 2em;
    text-align: left;
}

].bigbrightyellow h3 {
  color: #292929;
  font-family: 'Playfair Display', serif;
  font-size: 1.4em;
  text-align: left;
  line-height: 1.6;
}


.bigbrightyellow p {
    color: #292929;

}

.bigbrightyellow a {
color: #3d3d3d;

}

.bigbrightyellow  a:visited {
color:#3d3d3d;
}






.tweetstyle {

    background-color:  #fff;
    padding-left: 5px;

}

.tweetstyle p {

   color:  #666;

}

.tweetstyle h4 {
    font-size: .8em;
    text-transform: uppercase;
    color: #ccc;
}







/*** <!--

font-family: 'Alfa Slab One', cursive;


    font-family: 'Playfair Display', serif;

    font-family: 'Lobster', cursive;

    font-family: 'Righteous', cursive;

    font-family: 'Roboto Condensed', sans-serif;

    font-family: 'Roboto', sans-serif;

-->

**/

.list-format {
  color: #ccc;
font-family: 'Roboto', sans-serif;
  text-transform: uppercase;

}


/***********************************
<!-- Stylings for Wordpress -->
 all the .post happens first including title of a post, while .entry is inside in the entry field **/

.post a:link {

  color:	#000000;
  text-decoration: none;
}

.post a:visited {

  color:	#000000;
  text-decoration: none;
}

.post a:hover {
  color:	#585858;
}

.post h1 {


}

/** h2 is title of a post but also titles are links **/

.post h2 {
  color:  #000000;
font-size: 3rem;
font-family: 'Playfair Display', serif;
text-align: left;
}

/** h3 is the Byline on post **/
.post h3 {
  color:  #A9A9A9;
font-family: 'Roboto', sans-serif;
             font-size: 1rem;
             font-style: normal;
             text-transform: uppercase;
             font-weight:normal;

              }

/**   h4 is formatting for the meta data -- Author - Date - time and other meta data at the top of the opst **/

.post h4 {
font-family: 'Roboto', sans-serif;
         font-size: .8rem;
         font-style: normal;
         text-transform: uppercase;

         font-weight: normal;
         color: #808080;
         margin: 0 0 5 0;
         border-bottom: 2px #E0E0E0 solid;

           }


/** the ENTRY class impacts only what is in the entry field, and inherits everthing in the Post
POST holds post title, post entry field **/

.entry a { color: #686868; }

.entry a:visited { color: #686868; }

.entry a:hover { color: #405489; }

.entry p {
      font-size: 1.7rem;
font-family: 'Roboto', sans-serif;
      color:  #000000;

      text-transform: none;
      letter-spacing: normal;
      line-height: 150%;
      text-indent: 0em;
  }


.entry blockquote {
      font-size: 1.4rem;
font-family: 'Roboto', sans-serif;
      background-image: url("http://www.ianmacallen.com/siteimages/quotes.gif");

      background-repeat: no-repeat;
      background-position: left top;
      background-color: #F8F8F8;
      margin: 10px;
      font-style: italic;
      font-weight: normal;
      text-transform: none;
      letter-spacing: normal;
      line-height: 145%;
      text-indent: 0px;
      padding: 30px;

     }
.entry h1 {
  /** inheriting .post h1 **/
}

.entry h2 {
  /** inheriting .post h2 **/
}

.entry h3 {
  /** used for PAGE subheadings inheriting .post h3 **/
  font-size: 1.9rem;
font-family: 'Roboto', sans-serif;

  line-height: 145%;
font-weight: bold;
      color: #666666;

}

/**** entry H4 is used for event meta data -- author, date, location -- at the end of every post **/
.entry h4 {
font-family: 'Roboto', sans-serif;
                font-size: .8rem;
                font-style: normal;
                text-transform: uppercase;

                color: #666666;
line-height: 145%;

                border-bottom: 2px #cccccc solid;


                }


.entry h5 {
  color: #000000;
font-family: 'Roboto', sans-serif;
  font-weight: bold;
  line-height: 1.4em;
  font-size: 20px;



}


/*** Using Data Class for information inside posts, mainly for Venue information but also formatting other data in reading series resource area **/

.data h3 {

  font-weight: bold;
  text-transform: uppercase;

  font-size: 1.5rem;
font-family: 'Roboto', sans-serif;
  color:  #666666;


  letter-spacing: normal;
  line-height: 175%;
  text-indent: 0em;


}

.data h4 {


                font-weight: bold;
                text-transform: uppercase;

                font-size: .9rem;
font-family: 'Roboto', sans-serif;
                color:  #666666;


                letter-spacing: normal;
                line-height: 175%;
                text-indent: 0em;
                border-bottom: none;

}

/*** recentpost is for adding a recent post section to the bottom of pages ****/

.recentpost  {
  padding: 5px;
  background-color: #F8F8F8;
}

.recentpost  a:link {
  color: #A8A8A8;
}

.recentpost a:visited {
  color: #A8A8A8;

}

.recentpost h1 {
  font-family: 'Roboto', sans-serif;
        font-size: 22px;
        font-style: normal;
        text-transform: uppercase;


        font-weight: normal;
        color: #666666;
        margin: 0 0 5 0;
        border-bottom: 2px #E0E0E0 solid;
        padding: 5px;
}

                /***********************************
                A division only for the navigation between past and new posts

                This should be turned into pills
                ************************************/

               .navigationbetweenposts {
                    background:#fff;
                    padding: 10px;
                    text-transform: uppercase;
                    font-size: 10px;


                    }

              .navigationbetweenposts a {
                    color:#000;
                    border: 1px solid #000;
                    padding: 14px;

                    }

                   .navigationbetweenposts a:hover {
                    color:#fff;
                    border: 1px solid #666;
                    padding: 14px;
                    background: #000;

                    }


.side  {
font-family: 'Playfair Display', serif;
  text-align: left;
  color: #105ea1;
}

.side h2 {
  text-transform: uppercase;
    color: #105ea1;
    font-size: .8em;
    text-align: left;

}


.text-cursive {
color:  #fff;
font-family: 'Crimson Text', serif;


}

.text-lowernav {
text-transform:uppercase;
font-family: 'Roboto', sans-serif;
  color: #fff;
  font-weight: bold;
  padding-bottom: 5px;

}

.text-description {
  color: #ccc;
font-family: 'Roboto', sans-serif;

  font-size: .9em;
  line-height: 3em;
}

.text-copyright {
  color: #ccc;
font-family: 'Roboto', sans-serif;
  text-transform: uppercase;
  font-size: .4em;
  line-height: 1.6;

}

.page-footer h4 {
  color: #fff;
  text-transform: uppercase;
  font-size: .9em;
  text-align: left;
  font-weight: bold; 

}

.page-footer a {
color:#fff;

}

.page-footer ul {

  text-align: left;
}

.page-footer p {
color:#fff;
}

.footer-copyright h4 {
  text-align:center;
  font-weight:normal;
  text-transform:uppercase;
  color:#ccc;
  
}


<!-- This styles the class Tagcloud for the tag cloud code" -->
.tagcloud a {
    display:block;
    float:left;
    padding:4px 10px;
    margin-right:7px;
    margin-bottom:7px;
    background:#EEE;
    color:#666;
    font-size:11px;
    font-weight:bold;
    text-transform:lowercase;
    text-shadow:1px 1px 1px #FFF;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
    border-radius:5px;
    border:1px solid #CCC;
    text-decoration:none;
}
.tagcloud a:hover{
    background:#F3F3F3;
    color:#000;
    text-decoration:none;
}





!-- For black nav pills -->

.red .active a,
.red .active a:hover {
    background-color: #000;
    color: #fff;
}