/* 
	
This is to quickly build a stylesheet for a section for the CMS	
	
---------------------------------------------------------------------*/
/* Dark/Rhino colour
@buttText: #fff;
@buttHoverText: #323b40;
@buttBg: #323b40;
@buttHoverBg: #dce1df;
@buttActiveText: #323b40;
@buttActiveBg: #dce1df;

Rhino: #323b40
Pebble: #dce1df
Teal: #008c9b
*/
/* 1. Button Colours
-----------------------------------------------------------------------------------------------
===============================================================================================*/
body.rhino-dc.subSubSection1 li.subSubSectionLink1 a.button,
body.rhino-dc.subSubSection1 li.subSubSectionLink1 a.buttonIcon,
body.rhino-dc.subSubSection1 li.subSubSectionLink1 a.buttonIcon span.icon,
body.rhino-dc.subSubSection1 li.subSubSectionLink1 a.button span.icon,
body.rhino-dc.subSubSection1 li.subSubSectionLink1 a.button span.label,
body.rhino-dc.subSubSection2 li.subSubSectionLink2 a.button,
body.rhino-dc.subSubSection2 li.subSubSectionLink2 a.buttonIcon,
body.rhino-dc.subSubSection2 li.subSubSectionLink2 a.buttonIcon span.icon,
body.rhino-dc.subSubSection2 li.subSubSectionLink2 a.button span.icon,
body.rhino-dc.subSubSection2 li.subSubSectionLink2 a.button span.label,
body.rhino-dc.subSubSection3 li.subSubSectionLink3 a.button,
body.rhino-dc.subSubSection3 li.subSubSectionLink3 a.buttonIcon,
body.rhino-dc.subSubSection3 li.subSubSectionLink3 a.buttonIcon span.icon,
body.rhino-dc.subSubSection3 li.subSubSectionLink3 a.button span.icon,
body.rhino-dc.subSubSection3 li.subSubSectionLink3 a.button span.label,
body.rhino-dc.subSubSection4 li.subSubSectionLink4 a.button,
body.rhino-dc.subSubSection4 li.subSubSectionLink4 a.buttonIcon,
body.rhino-dc.subSubSection4 li.subSubSectionLink4 a.buttonIcon span.icon,
body.rhino-dc.subSubSection4 li.subSubSectionLink4 a.button span.icon,
body.rhino-dc.subSubSection4 li.subSubSectionLink4 a.button span.label,
body.rhino-dc.subSubSection5 li.subSubSectionLink5 a.button,
body.rhino-dc.subSubSection5 li.subSubSectionLink5 a.buttonIcon,
body.rhino-dc.subSubSection5 li.subSubSectionLink5 a.buttonIcon span.icon,
body.rhino-dc.subSubSection5 li.subSubSectionLink5 a.button span.icon,
body.rhino-dc.subSubSection5 li.subSubSectionLink5 a.button span.label,
body.rhino-dc.subSubSection6 li.subSubSectionLink6 a.button,
body.rhino-dc.subSubSection6 li.subSubSectionLink6 a.buttonIcon,
body.rhino-dc.subSubSection6 li.subSubSectionLink6 a.buttonIcon span.icon,
body.rhino-dc.subSubSection6 li.subSubSectionLink6 a.button span.icon,
body.rhino-dc.subSubSection6 li.subSubSectionLink6 a.button span.label,
body.rhino-dc.subSubSection7 li.subSubSectionLink7 a.button,
body.rhino-dc.subSubSection7 li.subSubSectionLink7 a.buttonIcon,
body.rhino-dc.subSubSection7 li.subSubSectionLink7 a.buttonIcon span.icon,
body.rhino-dc.subSubSection7 li.subSubSectionLink7 a.button span.icon,
body.rhino-dc.subSubSection7 li.subSubSectionLink7 a.button span.label,
body.rhino-dc.subSubSection8 li.subSubSectionLink8 a.button,
body.rhino-dc.subSubSection8 li.subSubSectionLink8 a.buttonIcon,
body.rhino-dc.subSubSection8 li.subSubSectionLink8 a.buttonIcon span.icon,
body.rhino-dc.subSubSection8 li.subSubSectionLink8 a.button span.icon,
body.rhino-dc.subSubSection8 li.subSubSectionLink8 a.button span.label,
body.rhino-dc.subSubSection9 li.subSubSectionLink9 a.button,
body.rhino-dc.subSubSection9 li.subSubSectionLink9 a.buttonIcon,
body.rhino-dc.subSubSection9 li.subSubSectionLink9 a.buttonIcon span.icon,
body.rhino-dc.subSubSection9 li.subSubSectionLink9 a.button span.icon,
body.rhino-dc.subSubSection9 li.subSubSectionLink9 a.button span.label,
body.rhino-dc.subSSubection10 li.subSubSectionLink10 a.button,
body.rhino-dc.subSubSection10
  li.subSubSectionLink10
  a.buttonIcon
  body.rhino-dc.subSubSection10
  li.subSubSectionLink10
  a.buttonIcon
  span.icon,
body.rhino-dc.subSubSection10 li.subSubSectionLink10 a.button span.icon,
body.rhino-dc.subSubSection10 li.subSubSectionLink10 a.button span.label {
  color: #323b40;
}
.rhino-dc.greenUI a.button,
.rhino-dc.greenUI a.buttonIcon,
.rhino-dc .buttonIconInner,
.rhino-dc .buttonInner,
.rhino-dc .buttonIconInner,
.rhino-dc .buttonInner {
  /*color: @buttText;*/
}
.rhino-dc .s4cContent div.masonryItemInfo a,
.rhino-dc .s4cContent div.masonryItemInfo a span.icon {
  color: #323b40;
}
.rhino-dc .s4cContent div.masonryItemInfo a:hover,
.rhino-dc .s4cContent div.masonryItemInfo a span.icon:hover {
  color: #fff;
}
.rhino-dc .s4cContent a.button,
.rhino-dc .s4cContent a.buttonIcon {
  background: #323b40;
  color: #fff;
}
.rhino-dc .s4cContent a.button span.skew,
.rhino-dc .s4cContent a.buttonIcon span.skew {
  background: #dce1df;
  color: #323b40;
}
.rhino-dc .buttonIconInner:hover,
.rhino-dc .buttonInner:hover {
  color: #323b40;
}
.rhino-dc.greenUI a.button:hover span.icon,
.rhino-dc.greenUI a.buttonIcon:hover span.icon {
  color: #323b40;
}
.rhino-dc a.button span.icon,
.rhino-dc a.buttonIcon span.icon {
  color: #fff;
}
.rhino-dc .lightBG a,
.rhino-dc .darkBG a {
  color: #323b40;
}
.rhino-dc .lightBG a:hover,
.rhino-dc .darkBG a:hover {
  color: #dce1df;
}
.rhino-dc .actions a.button,
.rhino-dc .actions a.buttonIcon {
  background: #323b40;
  color: #fff;
}
.rhino-dc .s4cContent a.button,
.rhino-dc .s4cContent a.buttonIcon {
  background: #323b40;
  color: #fff;
}
.rhino-dc .s4cContent a.button span.skew,
.rhino-dc .s4cContent a.buttonIcon span.skew {
  background: #dce1df;
  color: #323b40;
}
.rhino-dc .buttonIconInner:hover,
.buttonInner:hover {
  color: #323b40;
}
.rhino-dc.greenUI a.button:hover span.icon,
.rhino-dc.greenUI a.buttonIcon:hover span.icon {
  color: #323b40;
}
.rhino-dc strong {
  font-weight: bold;
}
.rhino-dc a.button span.icon,
.rhino-dc a.buttonIcon span.icon {
  color: #fff;
}
.rhino-dc.greenUI a.carouselControl {
  background: #323b40;
}
.rhino-dc.s4cSection2 ul.feedLinks span.icon {
  color: #323b40;
}
.rhino-dc.s4cSection2 .masonryGridItem a:hover {
  color: #323b40;
}
.rhino-dc.s4cSection2 ul.feedLinks a:hover span.icon,
.rhino-dc.s4cSection2 ul.feedLinks a:focus span.icon {
  color: #323b40;
}
ul.feedLinks a:hover,
ul.feedLinks a:focus {
  -webkit-box-shadow: inset -30px 0 0 0 #323b40;
  -moz-box-shadow: inset -30px 0 0 0 #323b40;
}
/* Custom Styles */
.rhino-dc.darkBG .carouselControls a.carouselControl,
.rhino-dc.lightBG .carouselControls a.carouselControl {
  color: #fff;
}
.rhino-dc.greenUI a.carouselControl:hover {
  background: #dce1df;
}
.rhino-dc hr {
  background: #323b40;
}
.rhino-dc .s4cContent div.masonryItemInfo h2 a,
.rhino-dc .s4cContent div.masonryItemInfo h2 a:hover {
  color: #33312d;
}
.rhino-dc strong {
  font-weight: bold;
}
.rhino-dc {
  background-attachment: fixed;
  background-position: center top;
  background-repeat: repeat-x;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  position: relative;
  z-index: 0;
}
.rhino-dc .hero {
  margin-bottom: 0;
  border-top: 1px solid #fff;
}
.rhino-dc .explore-main .masonryGridItemContent {
  background: none;
  color: #fff;
}
.music-4.rhino-dc .subSectionMenu,
.cerddoriaeth-4.rhino-dc .subSectionMenu,
.drama-2.rhino-dc .subSectionMenu,
.drama-3.rhino-dc .subSectionMenu,
.ffeithiol-2.rhino-dc .subSectionMenu,
.factual-2.rhino-dc .subSectionMenu,
.adloniant-3.rhino-dc .subSectionMenu,
.entertainment-3.rhino-dc .subSectionMenu {
  padding-bottom: 5%;
}
.rhino-dc .explore-main .masonryItemInfo,
.rhino-dc .explore-main .masonryItemInfo p {
  font-size: 1.9rem;
}
body.subSection.pori-10.rhino-dc .sectionHeading,
body.subSection.explore-10.rhino-dc .sectionHeading {
  padding: 2% 20px 0;
}
.pori-10.rhino-dc h1.largeHeading,
.explore-10.rhino-dc h1.largeHeading {
  padding: 4% 0 0;
}
.rhino-dc .sponsor {
  padding: 5.5% 0;
}
.rhino-dc div.masonryItemInfo ul li {
  list-style: outside none disc;
  list-style-type: disc;
  display: list-item;
  margin: 0 0 0.5em 1em;
}
.rhino-dc #contact-form {
  padding: 25px 0 20px;
}
.rhino-dc #contact-form div {
  margin-bottom: 25px;
}
.rhino-dc #contact-form label span {
  cursor: pointer;
  display: block;
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 2.4rem;
  margin: 5px 0;
}
.rhino-dc #contact-form input[type='text'],
.rhino-dc #contact-form input[type='email'],
.rhino-dc #contact-form input[type='tel'],
.rhino-dc #contact-form input[type='url'],
.rhino-dc #contact-form textarea,
.rhino-dc #contact-form select {
  background: none repeat scroll 0 0 #fff;
  border: 1px solid #ccc;
  border-radius: 5px;
  box-shadow: 0 1px 2px #ddd inset, 0 1px 0 #fff;
  margin: 0 0 5px;
  padding: 10px;
  width: 100%;
}
.rhino-dc #contact-form select {
  height: 50px;
}
.rhino-dc #contact-form input[type='text']:hover,
.rhino-dc #contact-form input[type='email']:hover,
.rhino-dc #contact-form input[type='tel']:hover,
.rhino-dc #contact-form input[type='url']:hover,
.rhino-dc #contact-form textarea:hover,
.rhino-dc #contact-form select:hover {
  border: 1px solid #aaa;
  transition: border-color 0.3s ease-in-out 0s;
}
.rhino-dc #contact-form input[type='checkbox'] {
  background: none repeat scroll 0 0 #fff;
  border: 1px solid #ccc;
  border-radius: 5px;
  box-shadow: 0 1px 2px #ddd inset, 0 1px 0 #fff;
  margin: 0 0 5px;
  padding: 10px;
}
.rhino-dc #contact-form input[type='checkbox']:hover {
  border: 1px solid #aaa;
  transition: border-color 0.3s ease-in-out 0s;
}
.rhino-dc #contact-form textarea {
  height: 100px;
  max-width: 100%;
}
.rhino-dc #contact-form select {
  height: 50px;
  max-width: 100%;
}
.rhino-dc #contact-form button[type='submit'] {
  background: #323b40;
  border: medium none;
  border-radius: 5px;
  color: #fff;
  cursor: pointer;
  margin: 0 0 5px;
  max-width: 250px;
  padding: 10px;
  text-align: center;
  width: 100%;
}
.rhino-dc #contact-form button[type='submit']:hover {
  background: none repeat scroll 0 0 #dce1df;
  transition: background-color 0.3s ease-in-out 0s;
}
.rhino-dc #contact-form button[type='submit']:active {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5) inset;
}
.rhino-dc #contact-form input:focus,
.rhino-dc #contact-form textarea:focus {
  border: 1px solid #999;
  outline: 0 none;
}
.rhino-dc #name_trp {
  display: none;
}

.rhino-dc li ul,
.rhino-dc li ol {
  font-size: 0.9rem;
}

.rhino-dc .heroText {
  font-size: 1.4rem;
}

.rhino-dc .fullWidthVideo {
  margin-bottom: 10%;
}

.rhino-dc .fullWidthVideo .holder {
  border: solid #323b40 1px;
}

.rhino-dc .textBlock ul li {
  list-style-position: inside;
}

.rhino-dc .s4cContent div.masonryItemInfo a:hover,
.rhino-dc .s4cContent div.masonryItemInfo a span.icon:hover {
  color: #0f818d;
}

body.rhino-dc.subSection div.sectionHeading {
  border: 0;
  /*padding: 2% 20px 5%;*/
  padding: 0px;
}

.rhino-dc div.subSectionMenu {
  margin-bottom: 2%;
}

.rhino-dc .heroText {
  text-align: left;
}

.rhino-dc .lightBG a,
.rhino-dc .darkBG a {
  color: #008c9b;
  font-weight: 500;
}

.rhino-dc .lightBG a:hover,
.rhino-dc .darkBG a:hover {
  color: #128e9b;
}

.rhino-dc .lightBG a:visited,
.rhino-dc .darkBG a:visited {
  color: #008c9b;
}
.sectionHeading h1.largeHeading {
  font-size: 72px;
  font-weight: bold;
}
@media only screen and (max-width: 1600px) {
  .sectionHeading h1.largeHeading {
    font-size: 44px;
  }
}

@media only screen and (min-width: 768px) {
  .rhino-dc.dysgu-cymraeg .two-column {
    margin: 0;
  }

  .rhino-dc.dysgu-cymraeg .two-column + div,
  .rhino-dc.dysgu-cymraeg .two-column + div + div,
  .rhino-dc.dysgu-cymraeg .two-column + div + ul {
    padding: 4% 0;
    width: 48% !important;
    display: inline-block !important;
    float: left;
  }

  .rhino-dc.dysgu-cymraeg .two-column + div + div,
  .rhino-dc.dysgu-cymraeg .two-column + div + ul {
    margin-left: 2%;
  }

  .rhino-dc.dysgu-cymraeg .two-column + div + div + div.heroText,
  .rhino-dc.dysgu-cymraeg .two-column + div + div + ul {
    clear: both;
  }
}

/*custom css*/
.rhino-dc .lightBG {
  padding-bottom: 2%;
}

.how-to-watch
  .masonryGrid:nth-of-type(4)
  .masonryGridItem
  .masonryGridItemContent,
.sut-i-wylio
  .masonryGrid:nth-of-type(4)
  .masonryGridItem
  .masonryGridItemContent {
  height: 250px !important;
}

.rhino-dc div.pageSubTitle,
div.pageSubSubTitle,
.heroText {
  margin: auto;
  max-width: 1280px;
}

.rhino-dc .textBlock {
  margin: auto;
  max-width: 1280px;
  padding: 20px 0px;
}

.dysgu-cymraeg h1.largeHeading,
.rhino-dc.subtitles h1.largeHeading,
.rhino-dc.isdeitlau h1.largeHeading,
.rhino-dc.how-to-watch h1.largeHeading,
.rhino-dc.sut-i-wylio h1.largeHeading,
.rhino-dc.where-should-i-start h1.largeHeading,
.rhino-dc.ble-dylwn-i-ddechrau h1.largeHeading,
.rhino-dc.content-for-you h1.largeHeading,
.rhino-dc.cynnwys-i-chi h1.largeHeading,
.rhino-dc.anything-else h1.largeHeading,
.rhino-dc.unrhywbeth-arall h1.largeHeading {
  font-size: 92px;
}




.dysgu-cymraeg h1.largeHeading,
.rhino-dc.subtitles h1.largeHeading,
.rhino-dc.isdeitlau h1.largeHeading,
.rhino-dc.how-to-watch h1.largeHeading,
.rhino-dc.sut-i-wylio h1.largeHeading,
.rhino-dc.where-should-i-start h1.largeHeading,
.rhino-dc.ble-dylwn-i-ddechrau h1.largeHeading,
.rhino-dc.content-for-you h1.largeHeading,
.rhino-dc.cynnwys-i-chi h1.largeHeading,
.rhino-dc.anything-else h1.largeHeading,
.rhino-dc.unrhywbeth-arall h1.largeHeading {
 margin-top:0px;
 margin-bottom:0px;
}

@media only screen and (max-width: 1600px) {
  .dysgu-cymraeg h1.largeHeading,
  .rhino-dc.subtitles h1.largeHeading,
  .rhino-dc.isdeitlau h1.largeHeading,
  .rhino-dc.how-to-watch h1.largeHeading,
  .rhino-dc.sut-i-wylio h1.largeHeading,
  .rhino-dc.where-should-i-start h1.largeHeading,
  .rhino-dc.ble-dylwn-i-ddechrau h1.largeHeading,
.rhino-dc.content-for-you h1.largeHeading,
.rhino-dc.cynnwys-i-chi h1.largeHeading,
  .rhino-dc.anything-else h1.largeHeading,
  .rhino-dc.unrhywbeth-arall h1.largeHeading {
    font-size: 52px;
  }
}

.rhino-dc .textBlock ul li {
  margin: 0 0 1em 2em;
  list-style-position: initial;
}

.dysgu-cymraeg .layoutBlockFluidMax1280Inner {
  max-width: 1280px;
  margin: auto;
}

.dysgu-cymraeg .textBlock {
  padding: 20px 0px;
}

.rhino-dc .pageSubTitle,
.rhino-dc .pageSubSubTitle {
  padding: 24px 12px 0px 0px;
}

.rhino-dc .pageSubTitle h2 {
  margin-bottom: 0px;
  font-size: 2.6rem;
}

.rhino-dc .pageSubSubTitle h3 {
  margin-bottom: 0px;
  font-size: 1.6rem;
}

.masonry-card-height-overide {
  height: auto !important;
}

@media only screen and (max-width: 1000px) {
  .rhino-dc .pageSubTitle,
  .rhino-dc .pageSubSubTitle {
    padding: 20px 20px 0px;
  }

  .rhino-dc .pageSubTitle h2 {
    font-size: 2rem;
  }

  .rhino-dc .pageSubSubTitle h3 {
    font-size: 1.6rem;
  }

  .rhino-dc .textBlock {
    line-height: 1.4;
    font-size: 16px;
    padding: 20px;
  }
}

.dysgu-accordion {
  position: relative;
  padding: 18px 50px 18px 18px;
  background-color: #f3f4f4;
  cursor: pointer;
  width: 100%;
  border: none;
  outline: none;
  text-align: left;
  line-height: 1.4;
  font-size: 18px;
}

.dysgu-accordion.active,
.dysgu-accordion:hover {
  background-color: #eee;

}

.dysgu-accordion + .panel {
  padding: 0;
  display: none;
  overflow: hidden;
  background-color: #f3f4f4;
}

.dysgu-accordion:after {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 10px;
  content: '\02795'; /* Unicode character for "plus" sign (+) */
  font-size: 13px;
  color: #777;
  margin-right: 15px;
}

.dysgu-accordion.active:after {
  content: '\2796'; /* Unicode character for "minus" sign (-) */
}

.pageSubSubTitle + button.dysgu-accordion:first-of-type {
  margin-top: 15px;
}

/*# sourceMappingURL=style-rhino.css.map */