/******************************************  
 CUSTOM STYLESHEET
*******************************************/

/*
* You can place your custom CSS statements in this file, after this message.
* It is better to write everything custom here
* because this file won't be replaced during updates.
* 
* Simply copy an existing style from style.css to this file, 
* and modify it to your liking.
*/

/*
img {
max-width: 100%;
}
*/

h2 a:hover {
  color: #009fd0;
}

#slider li h2 {
  line-height: 26px;
}

#container {
  width: 92%;
}

#header {
  padding: 0;
}


/*
 SETS COLOURED BACKGROUND AND WIDTH ON FEATURE SLIDER
*/

#featPosts {
  background: #fff;
  float: left;
  width: 72%
}
#content {
  margin: 0 auto;
  width: 76%;
}

#content div.postmetadata {
  width: 14%;
  margin-right: 5px;
}

#content div.singlepost {
  width: 81%;
}
#content div.single-page {
  width: 96.5%;
}

.zoomvideo iframe {
  display: block;
  margin-left:auto;
  margin-right: auto;
}

/*
 PAGE TITLES
*/

.singlepost h1 {
  background-color: #ff8f00;
  color: #fff;
  font-size: 29px;
  padding-left: 3%;
  padding-right: 4%;
  padding-top: 1%;
  border-bottom: none;
  margin-bottom: 3%;

  -webkit-border-top-left-radius: 4px;
  -webkit-border-top-right-radius: 4px;
  -webkit-border-bottom-right-radius: 4px;
  -webkit-border-bottom-left-radius: 4px;

  -moz-border-radius-topleft: 4px;
  -moz-border-radius-topright: 4px;
  -moz-border-radius-bottomright: 4px;
  -moz-border-radius-bottomleft: 4px;

  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
}

/*
 POST TITLES
*/

.singlepost h1 a{
  padding-left: 0;
}

/*
 SIDEBAR
*/

#sidebar {
  float: right;
  width: 23%; 
  margin: 0 0 30px 0;
  background-color: #FFF;
  /* padding-left: 2%; */
  /* padding-right: 1%; */
  padding-top: 1%;
  padding-bottom: 2%;

  -webkit-border-top-left-radius: 6px;
  -webkit-border-top-right-radius: 6px;
  -webkit-border-bottom-right-radius: 6px;
  -webkit-border-bottom-left-radius: 6px;

  -moz-border-radius-topleft: 6px;
  -moz-border-radius-topright: 6px;
  -moz-border-radius-bottomright: 6px;
  -moz-border-radius-bottomleft: 6px;

  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
  border-bottom-left-radius: 6px;
}

/*
 LINE UNDER TOP NAV
*/

#topNav {
  border-bottom: 1px solid rgb(255, 255, 255);
}

/*
 LINE UNDER BANNER IMAGE AND ABOVE MAIN MENU
*/

#header {
  border-bottom: 0;
}

/*
 COLOUR AND ROUNDED CORNERS ON TOP MENU
*/

#topMenu li{
  background: #009fd0;
  font-size: 12px;
  font-style: arial;
  margin-left: 10px;
  width: 15%;

  -webkit-border-top-left-radius: 3px;
  -webkit-border-top-right-radius: 3px;
  -webkit-border-bottom-right-radius: 3px;
  -webkit-border-bottom-left-radius: 3px;

  -moz-border-radius-topleft: 3px;
  -moz-border-radius-topright: 3px;
  -moz-border-radius-bottomright: 3px;
  -moz-border-radius-bottomleft: 3px;

  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
  border-bottom-left-radius: 3px;
}


/*
 HOMEPAGE FEATURE BODY TEXT FORMATTING AND 'READ MORE' BUTTON TEXT FORMATTING
*/

#slider li p {
  font-size: 18px;
  text-align: left;
  line-height: 135%;
  color: #000;
}


/*
 HOMEPAGE FEATURE TITLE ROLLOVER COLOUR
*/

#featPosts h2 a:hover {
  color: #009fd0;
}

/*
 READ MORE' BUTTON COLOUR ORIGINAL
*/

p.more a {
  background: #b0307f;
}

/*
 READ MORE' BUTTON COLOUR WHEN HOVER
*/
p.more a:hover {
  background: #009fd0;
  color: #fff;
  text decoration: underline;
}

/*
 MENU
*/

#menu {
  width: 100%;
  height: 36px;
  float: none;
  background-color: #b0307f;
  padding-top: 4px;
  margin-top: none;
  margin-bottom: 30px;
}

#menu ul{
  width: 100% !important;
  list-style: none;
  background-color: #b0307f;
  margin: 0 auto;
  padding: 0;
}

#nav {
  width: 100%;
  float: left;
  background: none;
}


.dropdown li {
  width: 16%;
  margin-bottom: 4px;
  margin-left: 3px;
}

.dropdown a {
  text-shadow: none;
  color: #fff;
  font-size: 1.4em;
}

#nav.dropdown li:first-child {
  margin-left: 0.5%;
}

ul.sub-menu {
  background-color: none;
}

ul.sub-menu li{
  float: none;
}

/*Search box colouring*/

#searchform input#searchsubmit {
  color: #fff;
  background: #b0307f;
  border: none;
}

/* MENU BAR ON LANDING PAGES FOR POSTS
*/
#postFuncs {
  background: #ff8f00;
  margin-right: 3%;
}

#postFuncs h2 {
  background-color: #ff8f00;
}

#archive {
  margin-right: 3%;
}

#main {
  margin-bottom: 10px;
}

#search-2 {
  float: right;
}

.entry {
  background-color: #FFF;
  padding-left: 3%;
  padding-right: 3%;
  padding-top: 3%;
  padding-bottom: 1%;
}

/*
 POST LANDING PAGE COPY
*/

#content ul.list p {
  font-size: 16px;
  line-height: 22px;
}

/*
 POST AND PAGE LINK COLOUR
*/

.entry {
  max-width: 100%;
}

.entry a {
  color: #009fd0;
}

/*
 POST AND PAGE HEADER
*/

#content ul.posts h2 a {
 font-size: 20px;
}

/*
BOX SHADOW WOULD HAVE NEEDED THIS ADDED  -moz-box-shadow: 0 4px 3px rgba(0,0,0,0.5); -webkit-box-shadow: 0 4px 3px rgba(0,0,0,0.5); -box-shadow: 0 4px 3px rgba(0,0,0,0.5);
*/

.widget_text {
  font-size: 16px;
  line-height: 135%;
}

.widget {
  margin-left: 6%;
  margin-right: 5%;
  font-size: 14px;
}

.widget h3 {
  /*margin-left: -10px;*/
  background-color: #ff0000;
  font-size: 20px;
  padding-left: 4%;
  padding-right: 4%;
  padding-top: 3%;
  padding-bottom: 3%;
  border-bottom: none;

  -webkit-border-top-left-radius: 4px;
  -webkit-border-top-right-radius: 4px;
  -webkit-border-bottom-right-radius: 4px;
  -webkit-border-bottom-left-radius: 4px;

  -moz-border-radius-topleft: 4px;
  -moz-border-radius-topright: 4px;
  -moz-border-radius-bottomright: 4px;
  -moz-border-radius-bottomleft: 4px;

  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
}

.textwidget {
  font-size: 16px;
  line-height: 135%;
margin-left: 2%;
}

/*
 FOOTER WIDGETS
*/

#footWidgets{
  margin: 0;
}

#footWidgets div.column {
  width: 23.35%;
  display: inline;
  background-color: #FFF;
  font-size: 10px;
  margin-left: 0px;
  margin-right: 2.2%;
  /*padding-left: 1%;*/
  /*padding-right: 0.8%;*/
  /*padding-top: 1.5%;*/
  padding-top: 15px;
  padding-bottom: 0;

  -webkit-border-top-left-radius: 6px;
  -webkit-border-top-right-radius: 6px;
  -webkit-border-bottom-right-radius: 6px;
  -webkit-border-bottom-left-radius: 6px;

  -moz-border-radius-topleft: 6px;
  -moz-border-radius-topright: 6px;
  -moz-border-radius-bottomright: 6px;
  -moz-border-radius-bottomleft: 6px;

  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
  border-bottom-left-radius: 6px;
}

#footWidgets div.column.last {
  float: right;
  margin-right: 0;
}

.column h3 {
  background-color: #ff8f00;
}

#wpzoom-flickr-3.widget.flickr {
	margin-left: 10%;
	margin-right: auto;
}

.widget .twitter-list li {
  font-family: Lato, sans-serif;
  font-style: normal;
  font-size: 14px;
}



/*
 MEDIA QUERIES
*/

@media all and (max-width: 1024px) {
  #featPosts,
  #content,
  #sidebar,
  #content div.singlepost {
    width: 100%;
  }

  #sidebar {
    padding-top: 20px;
  }

  #slider li div.cover iframe {
    position: relative !important;
    width: inherit !important;
    min-height: 200px;
  }

  #footWidgets .column .widget {
    width: auto;
  }

  .widget h3 {
    text-align: center;
    padding: 7px 14px;
  }

  #footWidgets div.column {
    float: left !important;
    width: 49%;
    margin: 0 2% 15px 0;
    min-height: 340px;
  }

  #footWidgets div.column:nth-child(even) {
   margin-right: 0;
  }

  .fluid-width-video-wrapper {
    padding-top: 0 !important;
  }

  .dropdown a {
    font-size: 1em;
  }

  .dropdown li {
    width: 32%;
  }

  #menu li ul,
  .dropdown li .downarrowclass {
   display: none !important;
  }

  #topMenu li {
    width: 32%;
    margin-left: 0;
  }
}

@media (max-width: 639px) {
  #slider li .postcontent p {
    display: block;
  }
}

@media all and (max-width: 600px) {
  #slider li .postcontent p {
    float: left;
  }

  #sidebar {
    margin: 0;
  }

  #footWidgets div.column {
    width: 100%;
    min-height: auto;
  }

  .dropdown li {
    width: 45%;
  }  
}

@media all and (max-width: 300px) {
  .dropdown li {
     width: 100%;
  }
}