@charset "UTF-8"; /* CSS Document */ /*==================== GENERAL ====================*/ .no-padding { padding: 0; } body { font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans; font-size: 1em; line-height: 1.5em; font-weight: 300; color: #333; -webkit-text-size-adjust: 100%; overflow-wrap: break-word; word-wrap: break-word; } h1 { padding-bottom: 20px; } h2, h3, h4, h5, h6 { padding-bottom: 10px; } h1 { font-weight: 700; font-size: 2.25em; line-height: 1em; } h2, h2 span { font-weight: 700; font-size: 1.75em; } h3 { font-weight: 700; font-size: 1.5em; } h4 { font-weight: 700; font-size: 1.25em; } h5 { font-weight: 500; font-size: 1.25em; } h6 { font-weight: 700; } section h2 { padding: 10px 0; } .firstpara { font-size: 1.25em; line-height: 1.35em; } p { font-size: 1em; } a:link, a:visited { text-decoration: none; } .main-content a, aside a, footer a:hover, .sys_straight-to a, .sys_straight-to a:hover, .sys_more a:hover, .alert p a, .sys_accordion-content a, #maincontent a { text-decoration: underline; text-underline-offset: .2em; } aside a:hover, .language a:hover, .sys_straight-to a, .sys_more a, .sys_whereilive a, .sys_newscarousel a, .logowrap a:hover .button-green, .button-blue, .button-yellow, .button-red, .button-blac, .button-grey, .button-green a:hover, .button-blue a:hover, .button-yellow a:hover, .button-red a:hover, .button-black a:hover, .button-grey a:hover { text-decoration: none; } .main-content a:hover { color: #2A631C; text-decoration-thickness: 3px; } a:hover { color: #333; /*text-decoration: none;*/ } h1 a, h2 a, h3 a, h4 a, h6 a { font-weight: 700; text-decoration: none; } aside a, aside a:hover { color: #333!important; } .backup { background-color: #ccc; width: 40px; height: 40px; color: #fff; border-radius: 6px 0 0 6px; } .sys_newsslide a.icon-newspaper { overflow: auto; height: 2.2em; } /* BUTTONS */ .button-grey, .button-green, .button-black, .button-red, .button-blue, .button-yellow { } a.button-grey, a.button-green, a.button-black, a.button-red, a.button-blue, a.button-yellow, a.button-grey:visited, a.button-green:visited, a.button-black:visited, a.button-red:visited, a.button-blue:visited, a.button-yellow:visited { display: block; margin-bottom: 10px; text-align: center; background: #ccc; border-radius: 6px; height: 2.5em; height: 2.5rem; line-height: 2.5em; line-height: 2.5rem; padding: 0 10px; text-decoration: none !important; font-weight: 700; color: #fff!important; border-bottom: none; } a.button-green, a.button-green:visited { background-color: #408627; } a.button-black, a.button-black:visited { background-color: #333; } a.button-red, a.button-red:visited { background-color: #b0283c; } a.button-blue, a.button-blue:visited { background-color: #00829b; } a.button-yellow, a.button-yellow:visited { background-color: #946F00; } /*Oedd yn #b98b00 cyn newidiadau hygyrchedd*/ a.button-grey:hover, a.button-green:hover, a.button-black:hover, a.button-red:hover, a.button-blue:hover, a.button-yellow:hover { background-color: #666; } /* textarea, input, select { outline: none; } */ /*================== Calendar ==================*/ #calendr { width: 22em; } #calendr .fc-content .fc-time { display: none; } #calendr .fc-title, #calendr .fc-more { font-size: 0.7em; white-space: normal; line-height: 0.9em; word-wrap: break-word; } #calendr .fc-more, #calendr .fc-event-container a { height: 3.325em; line-height: 1.1em; overflow: hidden; } #calendar-wrapper .fc-content, #calendar-wrapper .fc-event { border: 1px solid #408627; background-color: #408627; color: white; } #calendar-wrapper .fc-scroller { min-height: 16em !important; } #calendar-wrapper table { margin-bottom: 0px; } #calendar-wrapper .fc-toolbar { margin-bottom: 0em; } #calendar-wrapper .fc-toolbar .fc-center > h2 { font-size: 1.25em; padding-bottom: 0em; } #calendar-wrapper .fc-toolbar .fc-left .fc-button-group > button { padding: 0em; } #calendar-wrapper .fc-more { display: block; border-radius: 3px; font-weight: normal; border: 1px solid #408627; background-color: #408627; color: white; text-decoration: none !important; } div.flex { display: flex; } #calendr { order: 2; flex: 0 0 auto; margin-bottom: 2em; } div.testun { flex-shrink: 1; order: 1; flex-basis: auto; padding-right: 0.5em; } #calendr:not(.calendr-empty) > h3, #calendr:not(.calendr-empty) > br { display: none; } .calendr-empty { border: 1px solid gainsboro; border-radius: 0.25em; padding: 0.25em; box-sizing: border-box; } @media (max-width: 980px) { div.flex { flex-wrap: wrap; } #calendr:not(.calendr-empty) > h3, #calendr:not(.calendr-empty) > br { display: block; } .calendr-empty { border: none; padding: 0; } } @media (max-width: 438px) { #calendar-wrapper .fc-toolbar > div { display: block; } #calendar-wrapper .fc-toolbar .fc-right, #calendar-wrapper .fc-toolbar .fc-center { clear: both; padding-top: 0.2em; } #calendar-wrapper .fc-toolbar .fc-left, #calendar-wrapper .fc-toolbar .fc-right { float: none; } #calendar-wrapper .fc-toolbar .fc-center > h2 { width: 100%; } th.fc-day-header { font-size: 0.9em; } } @media (max-width: 410px) { #calendr { width: 18em; } } @media (max-width: 340px) { #calendr { width: 15.5em; } th.fc-day-header { font-size: 0.75em; } } /*==================== HEADER ====================*/ header { background-color: #404040; padding-bottom: 15px; } header .sys_container { width: auto; } header header { padding-bottom: 40px; border-bottom: none; } .logowrap { clear: both; padding: 20px 0 5px 5px; font-size: 1.4em; font-size: 1.4rem; text-transform: uppercase; } .logowrap img { padding-right: 5px; float: left; } .logowrap a, .logowrap a:visited, .logowrap a:hover { color: #fff !important; font-weight: 700; text-decoration: none; /*line-height: 50px;*/ } .icon-cyngor-gwynedd { height: 30px; } header .icon-cyngor-gwynedd:before { font-size: 3.5em; position: relative; top: -.35em; } .settings, .settings a { color: #fff; } .login { font-size: 1.1em; float: left; width: 120px; line-height: 1.2em; padding-top: 5px; } .login [class*="icon-"]:before { font-size: 1.2em; margin-right: 5px; background-color: #ccc; color: #333; padding: 4px 5px 6px 5px; border-radius: 16px; } .language a { display: block; background-color: #ccc; color: #333; padding: 0 10px; border-radius: 0 0 6px 6px; line-height: 2em; height: 2em; float: right; font-size: 1.125em; font-weight: 700; text-decoration: none; } .language a:hover { border: none; color: #fff; } /*==================== FOOTER ====================*/ footer { background-color: #666; padding: 30px 0; } footer li { list-style-type: none; position: relative; line-height: 1em; padding-bottom: 10px; } footer li:last-of-type:after { content: ""; } footer a, footer a:visited { padding-bottom: 0; color: #fff !important; text-decoration: none; } .sys_copyright { color: #fff; text-align: left; font-size: .8em; } footer ul { overflow:hidden; } /*==================== PRIMARY NAVIGATION ====================*/ .sys_nav-tab a, .sys_nav-tab a:visited { background-color: #fff; font-size: 19px; color: #333; display: block; font-weight: 700; border-radius: 9px; text-align: center; line-height: 40px; width: 50%; border: solid 5px #404040; float: left; text-decoration: none; -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ -moz-box-sizing: border-box; /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */ } .sys_nav-tab a.residents:hover { background-color: #408627; color: #fff; } .sys_nav-tab a.business:hover { background-color: #00829b; color: #fff; } .sys_nav-tab a.council:hover { background-color: #946F00; color: #fff; } .sys_nav-tab a.visitors:hover { background-color: #b0283c; color: #fff; } .sys_nav-tab a.grey:hover { background-color: #ccc; color: #000; }/*temporary*/ /*==================== FORM ELEMENTS ====================*/ input { height: 40px; background-color: #fff; border: solid 1px #b3b3b3; line-height: 2em; padding: 0 10px; border-radius: 6px; font-size: 1.2em; margin-bottom: 20px; width: 100%; color: #333333; -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ -moz-box-sizing: border-box; /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */ -webkit-appearance: none; } input[type='button'] { color: #fff; font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans; font-weight: 600; border: none; text-align: center; width: 100%; } input[type="text"]:focus { color: #333; /* outline: none; */ } input[type='button']:hover { background-color: #b3b3b3; } .styled-select select { background: transparent; width: 115%; font-size: 1.25em; line-height: 1.25em; border: 0; border-radius: 0; height: 2em; -webkit-appearance: none; -moz-appearance: none; text-indent: 0.01px; text-overflow: ''; padding: .3em; vertical-align: bottom !important; padding-right: 0; padding-left: 10px; } .styled-select { width: 100%; height: 2.5em; overflow: hidden; background: url(/SiteElements/Images/downarrowselect.png) no-repeat right #ddd; border: 1px solid #ccc; border-radius: 6px; margin: 10px 0; overflow: hidden; } @media \0screen\,screen\9 { .styled-select select { width: 368px; padding-top: 5px; padding-right: 0px; vertical-align: top !important; text-align: left; line-height: 10px; height: auto; } .styled-select { width: 348px; } } /*SEARCH*/ .sys_search-query-control input { border: solid 5px #404040; float: left; height: 46px; } .sys_search-query-control input[type='text'] { width: 80%; border-radius: 9px 0 0 9px; border-right: none; } .sys_search-query-control input[type='submit'] { width: 20%; border-radius: 0 9px 9px 0; border-left: none; font-size: 0; position: relative; cursor: pointer; /*background: url(/SiteElements/Images/search.png) #fff no-repeat;*/ background: url(/SiteElements/Images/search.png) #408627 no-repeat; } .sys_search-query-control input[type='submit']:hover { /*background-color: #ccc;*/ background-color: #666666; } .sys_search-query-control { position: relative; } .sys_search-query-control label { color: #ffffff; position: absolute; left: -999em; width: 1em; overflow: hidden; } /* Cuddiad blwch lle nid oes canlyniadau */ div.sys_search-control div.sys_search-control { display: none; } /*==================== MAIN CONTENT ====================*/ .sys_content { padding: 20px; } section { clear: both; padding-top: 20px; } section h2 { padding: 10px 0; } section.content-and-section li { list-style-type: initial; display: list-item; position: initial; list-style-position: inside; } section.content-and-section li:after { content: none; } section li { list-style-type: none; display: inline; position: relative;/*line-height: 1em;*/ } section li:after { content: " |"; font-weight: 700; top: 0; padding: 0 0 0 0; position: relative; } section li:last-of-type:after { content: " "; } section li a { padding-bottom: 0; } .gen-content ul, .gen-content ol { padding: 0 40px 10px 40px; } .gen-content li { display: list-item; padding-bottom: 10px; position: relative; line-height: 1.5em; } .gen-content ul li:before { content: "•"; font-size: 2.25em; top: 0px; left: -25px; position: absolute; } .gen-content ul ul li:before { content: "°"; font-size: 1em; font-size: 1.75rem; padding-top: 5px; } .gen-content { overflow: hidden; padding: 0 10px; } .gen-content ol li { list-style-type: decimal; } .gen-content li:after { display: none; } .gen-content h2 a:link, .gen-content h2 a:visited, .gen-content h3 a:link, .gen-content h3 a:visited, .gen-content h4 a:link, .gen-content h4 a:visited, .gen-content h5 a:link, .gen-content h5 a:visited, .gen-content h6 a:link, .gen-content h6 a:visited { text-decoration: none; } .gen-content h2 a:hover, .gen-content h3 a:hover, .gen-content h4 a:hover, .gen-content h5 a:hover, .gen-content h6 a:hover { text-decoration: none; } section li a { padding-bottom: 0; } .sys_more { padding: 0 0 20px 0; } .sys_more li { clear: left; display: block; height: auto; padding: 10px 0; } .sys_more li:after { display: none; } .sys_flex { padding: 10px 0; } aside { background-color: #f7f7f7; padding: 20px; border-radius: 6px; margin-bottom: 20px; } aside a[href^="mailto"] { /*force word wrapping for long email addresses*/ -ms-word-break: break-all; /* Be VERY careful with this, breaks normal words wh_erever*/ word-break: break-all; /* Non standard for webkit */ word-break: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; hyphens: auto; } aside section { padding-bottom: 10px; } aside section p { padding: 0; } aside li { display: block; padding-bottom: 10px; line-height: 1.25em; } aside li:after { display: none; } aside li a { /*display: block; margin-left: 30px;*/ } .sharethis { display: none; } .stBubble { display: none !important; } .intro p { font-size: 1.3em; line-height: 1.3em; } /*=================== ALERTS ===================*/ .amberAlert, .priorityAlert, .mini-priorityAlert, .mini-amberAlert { position: relative; margin-top: 20px; min-height: 24px; } .amberAlert, .mini-amberAlert { background: #fbf7e5; padding: 20px 40px 20px 20px; } .low-priority-alert-color { background-color:#f7f7f7; border: 5px solid #7862a2; } .priorityAlert, .mini-priorityAlert { background: #f7f7f7; border: solid 5px #bb0534; padding: 15px 35px 15px 15px; } .closeAlert:before, .mini-closeAlert:before { font-family: 'gwynedd'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; color: #333; content: "\e706"; position: absolute; top: 20px; right: 20px; } .priorityAlert .closeAlert:before, .mini-priorityAlert .mini-closeAlert:before { top: 15px; right: 15px; } .mini-closeAlert:focus-visible::before { outline: -webkit-focus-ring-color auto 1px; outline-offset: 1px; } /*=================== ACCORDIAN ====================*/ .sys_accordion-content { padding: 0 0 20px 0; } .sys_accordion-content.default { display: block; } div.sys_trigger, h4.sys_trigger { display: block; background-color: #f2f2f2; padding: 10px!important; margin-bottom: 10px; position: relative; border-radius: 4px; cursor: pointer; } div.sys_trigger:hover, h4.sys_trigger:hover { background-color: #666; color: #fff; } div.sys_trigger:after, h4.sys_trigger:after { content: ""; display: block; position: absolute; top: 20px; right: 20px; border-left: solid 6px transparent; border-right: solid 6px transparent; border-top: solid 8px #333; border-bottom: solid 8px transparent; } div.open:after, h4.open:after { top: 10px; border-top: solid 8px transparent; border-bottom: solid 8px #333; } /*==================== STRAIGHT TO... ====================*/ .sys_straight-to, .sys_more_home { padding: 10px; background-color: #f7f7f7; border-radius: 6px; transition: background .25s ease-in-out; -moz-transition: background .25s ease-in-out; -webkit-transition: background .25s ease-in-out; } .sys_straight-to:hover , .sys_more_home:hover { background-color: #ebebeb; } .sys_flex:empty { display: none; } /* Icon reference */ .sys_iconReference li { float: left; margin-left: 6px; height: 90px; padding-bottom: 0; margin-bottom: 10px; margin-right: 6px; margin-top: 10px; } ul.sys_iconReference { list-style: none; } .sys_iconReference li:before { display: none; } /*=================== TABLES ====================*/ .table-borderless, .table-clear-header, .table-borderless-clear-header, .table-borderless-no-header, .table-complex, .table-complex-borderless, .table-complex-clear-header, .table-complex-borderless-clear-header, .table-complex-borderless-no-header { } .table-no-header, .table-complex-borderless-no-header { border-left: solid 1px #babcbf; } table { font-size: 1em; border-collapse: collapse; border-spacing: 0; margin-bottom: 20px; } th, td { margin: 0; padding: 10px; vertical-align: top; border: 1px solid #babcbf; background: #fff; } .table-borderless th, .table-borderless td, .table-borderless-no-header th, .table-borderless-no-header td, .table-borderless-clear-header th, .table-borderless-clear-header td, .table-complex-borderless th, .table-complex-borderless td, .table-complex-borderless-no-header th, .table-complex-borderless-no-header td, .table-complex-borderless-clear-header th, .table-complex-borderless-clear-header td { border: none; } th { text-align: left; background: #666; color: #fff; font-weight: 700; } thead { background-color: #f2f2f2; font-weight: 700; } .table-borderless thead, .table-borderless-clear-header thead, .table-complex-borderless thead, .table-complex-borderless-clear-header thead { border-bottom: 5px solid #f2f2f2; } .table-borderless th, .table-borderless-clear-header th, .table-clear-header th, .table-complex-borderless th, .table-complex-borderless-clear-header th, .table-complex-clear-header th { background-color: #fff; color: #333; } .table-no-header thead, .table-borderless-no-header thead, .table-complex-no-header thead, .table-complex-borderless-no-header thead { position: absolute !important; top: -9999px !important; left: -9999px !important; } caption { position: absolute !important; top: -9999px !important; left: -9999px !important; } .dangos-border td { background: none repeat scroll 0% 0% transparent; } /*=================== Tabl Cwcis ====================*/ #tablCwcis tr { border-bottom: 1px solid #c2bfbf !important; } @media only screen and (max-width: 778px) { #tablCwcis tr td:nth-of-type(1) { max-width: 10em; word-wrap: break-word; } #tablCwcis tr td:nth-of-type(2) { max-width: 10em; word-wrap: break-word; } #tablCwcis tr td:nth-of-type(3) { min-width: 25em; } } /*=================== MAPS ====================*/ .map300 { height: 228px; } .map380, .map300 { margin-left: 20px; margin-bottom: 10px; width:100%; height: 400px; } .mapFull { height: 400px; } .mapNeges { height: auto; margin-bottom: 2em; } .clirioMap { clear: both; } .mapOchrWrthOchr { margin-bottom: 10px; width: 100%; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; } .mapOchrWrthOchr #map1, .mapOchrWrthOchr #map2 { min-width: 245px !important; width: calc(50% - 0.5em) !important; margin-bottom: 1em; margin-left: 0.5em; } @media(max-width: 560px) { .mapOchrWrthOchr #map1, .mapOchrWrthOchr #map2 { width: 380px !important; } } .mapOchrWrthOchr.mapNeges { text-align: center; } /*=================== jCALENDAR OVER-RIDES ====================*/ #dp-popup { width: 212px!important; font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans!important; } #dp-popup div.dp-nav-prev a.dp-nav-prev-month { background-image: url(/SiteElements/Images/prevMonth.png)!important; } #dp-popup div.dp-nav-prev a.dp-nav-prev-month:hover { background-image: url(/SiteElements/Images/prevMonthOver.png)!important; } #dp-popup div.dp-nav-prev a.dp-nav-prev-year { background-image: url(/SiteElements/Images/prevYear.png)!important; } #dp-popup div.dp-nav-prev a.dp-nav-prev-year:hover { background-image: url(/SiteElements/Images/prevYearOver.png)!important; } #dp-popup div.dp-nav-next a.dp-nav-next-month { background-image: url(/SiteElements/Images/nextMonth.png)!important; } #dp-popup div.dp-nav-next a.dp-nav-next-month:hover { background-image: url(/SiteElements/Images/nextMonthOver.png)!important; } #dp-popup div.dp-nav-next a.dp-nav-next-year { background-image: url(/SiteElements/Images/nextYear.png)!important; } #dp-popup div.dp-nav-next a.dp-nav-next-year:hover { background-image: url(/SiteElements/Images/nextYearOver.png)!important; } table.jCalendar { margin-bottom: 0; } table.jCalendar td { text-align: center; } @media only screen and (max-width: 778px) { .tfixed { overflow:auto; } /* table:not(.jCalendar):not(.table-complex):not(.table-complex-borderless):not(.table-complex-no-header):not(.table-complex-clear-header):not(.table-complex-borderless-clear-header):not(.table-complex-borderless-no-header) { max-width: 100%; display: block; position: relative; width: 100%; } TABLE FIX*/ /* table:not(.jCalendar):not(.table-complex):not(.table-complex-borderless):not(.table-complex-no-header):not(.table-complex-clear-header):not(.table-complex-borderless-clear-header):not(.table-complex-borderless-no-header) thead { margin-right: 0; display: block; float: left; } TABLE FIX*/ .table-borderless thead, .table-borderless-clear-header thead { border-bottom: none; border-right: 5px solid #f2f2f2; } /* table:not(.jCalendar):not(.table-complex):not(.table-complex-borderless):not(.table-complex-no-header):not(.table-complex-clear-header):not(.table-complex-borderless-clear-header):not(.table-complex-borderless-no-header) tbody { display: block; width: auto; } TABLE FIX*/ /* table:not(.jCalendar) tbody { position: relative; overflow-x: scroll; white-space: nowrap; } TABLE FIX*/ /* table:not(.jCalendar):not(.table-complex):not(.table-complex-borderless):not(.table-complex-no-header):not(.table-complex-clear-header):not(.table-complex-borderless-clear-header):not(.table-complex-borderless-no-header) thead tr { display: block; } TABLE FIX*/ /* table:not(.jCalendar):not(.table-complex):not(.table-complex-borderless):not(.table-complex-no-header):not(.table-complex-clear-header):not(.table-complex-borderless-clear-header):not(.table-complex-borderless-no-header) tbody tr { display: inline-block; vertical-align: top; border-right: 1px solid #babcbf; margin-left: -4px; } TABLE FIX*/ /* table:not(.jCalendar):not(.table-complex):not(.table-complex-borderless):not(.table-complex-no-header):not(.table-complex-clear-header):not(.table-complex-borderless-clear-header):not(.table-complex-borderless-no-header) td { display: block; min-height: 1.25em; border-left: 0; border-right: 0; border-bottom: 0; } TABLE FIX*/ /* table:not(.jCalendar):not(.table-complex):not(.table-complex-borderless):not(.table-complex-no-header):not(.table-complex-clear-header):not(.table-complex-borderless-clear-header):not(.table-complex-borderless-no-header) th { border-bottom: 0; display: block; width: 100px; } TABLE FIX*/ /* table:not(.jCalendar):not(.table-complex):not(.table-complex-borderless):not(.table-complex-no-header):not(.table-complex-clear-header):not(.table-complex-borderless-clear-header):not(.table-complex-borderless-no-header) th:last-child, table:not(.jCalendar):not(.table-complex):not(.table-complex-borderless):not(.table-complex-no-header):not(.table-complex-clear-header):not(.table-complex-borderless-clear-header):not(.table-complex-borderless-no-header) td:last-child { border-bottom: 1px solid #babcbf; } TABLE FIX*/ /* table:not(.jCalendar):not(.table-complex):not(.table-complex-borderless):not(.table-complex-no-header):not(.table-complex-clear-header):not(.table-complex-borderless-clear-header):not(.table-complex-borderless-no-header) tbody tr:first-of-type { margin-left: 0; } TABLE FIX*/ .table-borderless tr, .table-borderless th:last-child, .table-borderless td:last-child, .table-borderless-clear-header tr, .table-borderless-clear-header th:last-child, .table-borderless-clear-header td:last-child, .table-borderless-no-header tr, .table-borderless-no-header th:last-child, .table-borderless-no-header td:last-child { border: none; } /* table:not(.jCalendar):not(.table-complex):not(.table-complex-borderless):not(.table-complex-no-header):not(.table-complex-clear-header):not(.table-complex-borderless-clear-header):not(.table-complex-borderless-no-header) tbody tr:first-of-type { border-left: 1px solid #babcbf; } TABLE FIX*/ } @media (min-width: 360px) { .login { width: auto; } } @media (min-width: 768px) { a.button-grey, a.button-green, a.black, a.button-red, a.button-blue, a.button-yellow, a.button-grey:visited, a.button-green:visited, a.button-black:visited, a.button-red:visited, a.button-blue:visited, a.button-yellow:visited { display: inline-block; } header { padding-bottom: 0; } header .sys_container { padding: 0 10px; } .settings { width: 362px; float: right; } .login { width: 251px; text-align: right; } .logowrap { clear: none; font-size: 2.15em; font-size: 2.15rem; padding: 20px 0; } .logowrap img { padding-right: 5px; } .icon-cyngor-gwynedd { height: 30px; position: relative; } header .icon-cyngor-gwynedd:before { font-size: 20em; font-size: 20rem; position: absolute; top: -.4em; } .sys_straight-to { padding: 20px; } .sys_straight-to h3 a, .sys_straight-to h3 { height: 3.5em; } .sys_straight-to ul { min-height: 9em } .sys_more { padding: 0 10px 10px 10px; } .sys_more li, .sys_more li:after { display: inline; } /*SEARCH*/ .sys_search-query-control { float: right; } .sys_search-query-control input { border: none; height: 40px; } .sys_search-query-control input[type='text'] { border-radius: 6px 0 0 6px; } .sys_search-query-control input[type='submit'] { border-radius: 0 6px 6px 0; border: 1px solid transparent; } footer { padding: 0; } footer li { display: inline; height: 1em; padding: 0; } footer li:after { content: "|"; font-size: 120%; font-weight: 700; color: #fff; top: 0em; padding: 0 1px 0 5px; position: relative; } input[type='button'], input[type='submit'] { width: auto; } .sys_accordion-content { padding: 0 20px 20px 20px; } /* ==================== STICKY FOOTER =====================*/ footer .sys_container { padding: 30px 10px 30px 10px; } * { margin: 0; } html, body, form { height: 100%; } .sys_wrapper { min-height: 100%; height: auto !important; height: 100%; margin: 0 auto -140px; /* should be a negative of the footer depth */ } footer, .sys_push { height: 130px; } /* depth of footer */ /*==================== PRIMARY NAVIGATION ====================*/ header nav { height: 50px; } .sys_nav-tab { display: inline-block; } .sys_nav-tab a:hover { border-bottom: none; } .sys_nav-tab a:link, .sys_nav-tab a:visited { background-color: #fff; line-height: 50px; font-size: 18px; color: #333; display: block; height: 50px; font-weight: 700; width: 120px; border-radius: 6px 6px 0 0; text-align: center; border: none; text-decoration: none; } .tab-active a { color: #fff !important; cursor: default !important; } .tab-active a:hover { color: #fff; } input { height: 40px; background-color: #fff; border: solid 1px #b3b3b3; line-height: 2em; padding: 0 10px; border-radius: 6px; font-size: 1.2em; margin-bottom: 20px; -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */ -moz-box-sizing: border-box; /* Firefox, other Gecko */ box-sizing: border-box; /* Opera/IE 8+ */ } .no-boxsizing .sys_nav-tab { width: 120px; float: left; padding-right: 5px; } .no-boxsizing .sys_nav-tab { width: 120px; float: left; padding-right: 5px; } /*==================== MAIN CONTENT ====================*/ .sys_content { padding: 30px 0; } .sys_flexwrap { display: table; width: 100%; table-layout: fixed; } .sys_flex { display: table-cell; height: 100%; width: 2%; table-layout: fixed; padding: 10px; } .sys_more_home { margin: 10px; padding-top: 20px; } .no-display-table .sys_flex {/* MODERNIZR */ display: block; float: left; width: 300px; } section h2.hometitle { padding: 0 10px 10px 10px } .fb_iframe_widget { height: 20px !important; margin-top: -4px; } .sharethis .icon { width: 40px; } /*ALerts*/ .amberAlert:before, .mini-amberAlert:before, .priorityAlert:before, .mini-priorityAlert:before { font-family: 'gwynedd'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; position: absolute; top: 20px; left: 20px; font-size: 2em; font-size: 3rem; line-height: 1em; } .amberAlert:before, .mini-amberAlert:before { content: "\e6b2"; top: 20px; left: 20px; } .priorityAlert:before, .mini-priorityAlert:before { content: "\e608"; top: 15px; left: 15px; } .amberAlert, .mini-amberAlert, .priorityAlert, .mini-priorityAlert { min-height: 48px; } .amberAlert, .mini-amberAlert { padding: 20px 50px 20px 90px; } .priorityAlert, .mini-priorityAlert { padding: 15px 45px 15px 85px; } .amberAlert:before, .mini-amberAlert:before .priorityAlert:before, .mini-priorityAlert:before { } /*=================== MAPS ====================*/ .map300 { width: 228px; height: 400px; } .map380 { width: 290px; height: 400px; } .mapNeges { height: auto; margin-top: 0; margin-bottom: 2em; } } @media (max-width:979px) and (min-width:768px) { .sys_search-query-control { width: 228px; } .sys_straight-to h3 a { padding-left: 30px; min-height: 1em; } .sys_straight-to h3 a.icon:before { font-family: 'gwynedd'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; position: absolute; left: 0px; color: #666; } } @media (min-width: 979px) { header .sys_container { width: 940px; } .sys_search-query-control { width: 220px; } .sys_straight-to h3 a { padding-left: 60px; min-height: 2em; } .sys_straight-to ul { min-height: 6em } input.right, input.left, .sys_textBoxWithRedirect input[type='text'], .sys_textBoxWithRedirect input[type='submit'] { float: left; width: 50%; } input.right, .sys_textBoxWithRedirect input[type='submit'] { border-radius: 0 6px 6px 0; border-left: none; } input.left, .sys_textBoxWithRedirect input[type='text'] { border-radius: 6px 0 0 6px; border-right: none; } .map300 { width: 300px; float:right; height: 300px; } .map380 { width: 380px; height: 380px; float:right } .mapOchrWrthOchr { width: 100%; height: 400px; } .mapNeges { margin-top: 0.5em; margin-bottom: 1em; height: auto; } #mapholder { line-height: normal; } #mapHawlfraint { padding-right: 0.5em; bottom: 80px; } .no-boxsizing input.left { width: 150px; } /*MODERNIZR*/ .no-boxsizing input.right { width: 170px; } /*MODERNIZR*/ } /*==================== PWYLLGORAU ====================*/ @media (max-width: 600px) { .pwyllgorauFullWidthItem { /*display:inline-block;*/ width:100% !important; } } /*==================== ICONS SOCIAL NETWORKS ====================*/ .social-icons-bottom{ float: right; margin-left: 20px; width: 58px; height: 58px; border: 0; } .social-icons-bottom:hover{ border-bottom: none; } /*==================== MANYLION YSGOLION ====================*/ table.manylionYsgolion { table-layout: fixed; width: 100%; } table.manylionYsgolion th, table.manylionYsgolion td { /*padding: 0.1em;*/ } table.manylionYsgolion .enwYsgol { width: 8em; } table.manylionYsgolion .cyfeiriadYsgol { width: 20em; } table.manylionYsgolion .mathYsgol { width: 3.5em; } table.manylionYsgolion .ebostYsgol { /*font-size: 0.8em*/ } table.manylionYsgolion .cyswlltMap { margin-top: 1em; } @media (min-width: 778px) and (max-width: 979px) { table.manylionYsgolion { font-size: 0.85em; } table.manylionYsgolion th, table.manylionYsgolion td { padding: 0.3em; } } @media only screen and (max-width: 778px) { table.manylionYsgolion td { width: 22em; } table.manylionYsgolion .enwYsgol { /*width: 22em;*/ } table.manylionYsgolion .cyfeiriadYsgol { /*height: 12em; width: 22em;*/ white-space: normal; } table.manylionYsgolion .mathYsgol { height: 5em; /*width: 22em;*/ } table.manylionYsgolion .dalgylchYsgol { /*width: 22em;*/ width: 8em; } } #chwilioYsgolionCynradd, #chwilioYsgolionUwchradd { padding-left: 45px; background-image: url("/SiteElements/Images/search.png"); background-repeat: no-repeat; background-position: left; } /*==================== NEGES CWCIS ====================*/ #cookie-message-fixed { display:block; left:auto; right: 10px; bottom: 10px; position: fixed; width: 25%; z-index: 9999; background:white; border: solid 1px #404040; border-radius: 4px; box-shadow: 3px 3px 5px #D3D3D3; } #cookie-message-fixed p { padding: 10px; color: #404040; font-size: 0.7em; line-height: 1.5em; } .cookie-message-title { color: white; background: #404040; padding: 5px; font-size: 0.8em; } .cookie-message-title h4{ padding-bottom: 0; text-align: left; display: inline; } .cookie-message-title i { float:left; font-size: 1.5em; padding: 2px 5px 2px 2px; } .cookie-message-body { text-align: center; } #cookie-message-fixed a { color:#404040; text-decoration: underline; } .cookie-message-body button { background: none repeat scroll 0 0 #404040; border: medium none; border-radius: 3px; color: white; padding: 5px; width: 40%; margin-bottom: 10px; cursor: pointer; } #cauNegesCwcisCroes { color:white; font-size: 1.5em; float: right; cursor: pointer; } @media (max-width: 780px){ #cookie-message-fixed { width:96%; } #cookie-message-fixed button { width:96%; padding: 20px; } } /*==================== PWYLLGORAU ====================*/ .amserlenniBws tr { white-space: normal; } @media (min-width: 979px) { div.LleDwinBywChwilio { width: 100%; float:right; } .LleDwinBywChwilio .sys_textBoxWithRedirect input { width: 10em; } } /*.alert a[class*="sys_"] { padding-left: 25px; }*/ .alert a.sys_21 { padding-left: 20px; } /*==================== HOLIADUR ====================*/ .holiadur_blwch { position: fixed; top: 0; left: 0; width: 100%; height: 100%; text-align: center; z-index: 9999; background: none repeat scroll 0 0 rgba(0, 0, 0, 0.6); } .holiadur_blwch img { border: none; } .holiadur_cynnwys { background-color: #FFF; margin-left: auto; margin-right: auto; margin-top: 10%; width: 20em; padding-top: 0px; padding: 0.5em; border: 1px solid #333; border-radius: 10px; } @media (max-width: 400px){ .holiadur_cynnwys { background-color: #FFF; margin-left: auto; margin-right: auto; margin-top: 10%; width: 15em !important; padding-top: 0px; padding: 0.5em; border: 1px solid #333; border-radius: 10px; } } .holiadur_cynnwys h2 { font-size: 1.25em; } #teitl_bach { font-size: 1em; } .holiadur_eicon_cau { position: relative; padding:0; top: 0px; border: 0; text-align: right; } ul.holiadur_opsiynau li { list-style-position: outside; list-style-type: none; margin: 1em 0 0 0; text-align:left; padding-left: 0.5em; } ul.holiadur_opsiynau { padding-left: 0em; } .holiadur_width_wide { width: 30em; } /*==================== NEGES DIGWYDDIADAU ARGYFWNG ====================*/ #negesDigwyddiadauArgyfwng div a { font-weight: bold; margin-left: 5px; } /*==================== BOTWM HOLIADUR BODLONRWYDD ====================*/ .button-holiadurBodlonrwydd, .button-holiadurBodlonrwydd a:hover { border-bottom: none; } .button-holiadurBodlonrwydd { } a.button-holiadurBodlonrwydd, a.button-holiadurBodlonrwydd:visited { display: block; margin-top: 5em; margin-top: 5rem; margin-bottom: 2.5em; margin-bottom: 2.5rem; text-align: center; background: #ccc; border-radius: 6px; height: 2.5em; height: 2.5rem; line-height: 2.5em; line-height: 2.5rem; padding: 0 10px; text-decoration: none !important; font-weight: 700; color: #fff!important; border-bottom: none; } a.button-holiadurBodlonrwydd, a.button-holiadurBodlonrwydd:visited { background-color: #7862a2; } a.button-holiadurBodlonrwydd:hover { background-color: #666; } @media (min-width: 768px) { a.button-holiadurBodlonrwydd, a.button-holiadurBodlonrwydd:visited { display: inline-block; } } /*==================== BOTYMAU CYFRYNGAU CYMDEITHASOL - RHAI LLIW YN GANOL Y TUDALEN E.E. CANOLFANNAU HAMDDEN ====================*/ .botymau_cyfryngau_cymdeithasol img { margin-right: 1em; border-bottom: none; } .botymau_cyfryngau_cymdeithasol a { border-bottom: none; } /*==================== CYNLLUNIWR TAITH ====================*/ #cynlluniwr-taith { background-color: #408627; border: 5px solid #408627; color: white; position: relative; padding: 20px 50px 20px 50px; -webkit-font-smoothing: antialiased; } #journey-plan-date { max-width: 100%; } #cynlluniwr-taith button[type="submit"] { color: white; border-radius: 5px; height: 2em; width: 100%; border: none; margin-top: 1em; cursor: pointer; background-color: #333; margin-bottom: 1em; font-size: 1em; font-weight: bold; } #cynlluniwr-taith form { clear: both; } #cynlluniwr-taith button[type="submit"]:hover { background-color: #666; } #cynlluniwr-teitl { font-size: 1.5em; } /*#cynlluniwr-taith::before { content: "\e6b2"; font-family: 'gwynedd'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; position: absolute; top: 20px; left: 20px; font-size: 2em; font-size: 3rem; line-height: 1em; }*/ #journey-plan-date { background-color: white !important; } #journey-plan-timeMode { width: 100%; } #journey-plan-time-hours, #journey-plan-time-mins { width: calc(50% - 1px); } #cynlluniwr-taith select { border-radius: 5px; height: 40px; color: #999; font-size: 1em; font-weight: bold; } #journey-plan-time-hours { margin-right: 2px; } #cynlluniwr-taith .field_wrap:nth-of-type(4) { margin-bottom: 1em; width: 50%; } #cynlluniwr-taith .tt-dropdown-menu { color: #999; } #traveline-logo { max-width: 40%; width: auto; height: auto; float: right; } #cynlluniwr-taith .field_wrap:nth-of-type(2) { float: left; } #cynlluniwr-taith .field_wrap:nth-of-type(3) { float: right; } #cynlluniwr-taith .field_wrap:nth-of-type(4) { float: left; } #cynlluniwr-taith .field_wrap:nth-of-type(5) { float: right; } @media (max-width: 980px) { #cynlluniwr-taith .field_wrap { max-width: 49%; } #cynlluniwr-taith .field_wrap:nth-of-type(6) { max-width: 100%; } } @media (max-width: 485px) { #traveline-logo { max-width: 100%; margin-top: 1em; margin-bottom: 1em; } } @media (max-width: 565px) { #cynlluniwr-teitl { font-size: 1.2em; } } /*==================== BOTYMAU apGwynedd ====================*/ .botwm-apGwynedd { display: inline; } .botwm-apGwynedd:last-of-type img { /*position: relative; top: 0.6em;*/ } .botwm-apGwynedd a { color: white !important; } .botwm-apGwynedd img { width: 155px; margin-left: -0.6em; height: auto; } .daliwrBotymauApGwynedd { display: flex; flex-direction: row; flex-wrap: wrap; } .botwm-wrapper { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; margin-right: 0.5em; } /*==================== EICON TROEDYN apGwynedd ====================*/ .social-icons-bottom.apGwynedd img { width: 3.7em; } @media (max-width: 385px) { footer ul { clear: both; padding-top: 1em; } } /*==================== BANNERI ====================*/ .daliwr-banner .llun a { padding-left: 0px; } .daliwr-banner.h100 { height: 100%; margin-top: 0em; } .daliwr-banner .du { background-color: black; } .daliwr-banner .llun { background-color: white; height: 100%; width: 60%; overflow: hidden; position: relative; background-color: #333; } .daliwr-banner.llun-yn-unig { position: relative; } .daliwr-banner.llun-yn-unig .llun { width: 100%; position: relative; } .daliwr-banner .llun div { position: absolute; top: 0; left: 0; } .daliwr-banner .llun img { /*min-width: 100%; height: 100%;*/ width: 100%; height: auto; min-height: 100%; min-width: 30em; } .daliwr-banner { height: 10em; display: flex; margin-top: 1em; border: 1px solid black; } @media (min-width: 768px) and (max-width: 979px) { .daliwr-banner { /*width: 558px; */ } } @media (min-width: 979px) { .daliwr-banner { /*idth: 720px;*/ } } .daliwr-testun { width: 40%; padding-top: 0.5em; padding-bottom: 0.5em; padding-right: 0.5em; line-height: 1.2rem; overflow-wrap: break-word; margin-left: -1.75em; padding-left: 0.1em; list-style-position: inside; position: relative; overflow: auto; } div.tudalen-banner1 { display: inline; } .daliwr-testun div[class^="tudalen-banner"] { margin-right: -50px; padding-right: 50px; overflow-y: auto; height: 93%; } .daliwr-banner .botymau { position: absolute; bottom: 0.1em; right: 0.25em; font-size: 2em; -webkit-user-select: none; /* Safari */ -moz-user-select: none; /* Firefox */ -ms-user-select: none; /* IE10+/Edge */ user-select: none; /* Standard */ cursor: default; } .sys_nine-column.gen-content .daliwr-banner .botymau { right: 0.8em; } .daliwr-banner .botymau > span { border: 1px solid lightgray; border-radius: 2em; width: 0.5rem; height: 0.5rem; background-color: white; padding: 0; margin: 0; display: inline-block; margin-left: 0.1em; } .daliwr-banner .botymau .active { border-color: lightgray; background-color: gray; } @media (max-width: 767px) { .daliwr-banner .daliwr-banner { margin-left: -20px; width: calc(100% + 40px); } .daliwr-banner .daliwr-testun { padding-right: 0.5em; } } @media (max-width: 560px) { .daliwr-banner .daliwr-testun { font-size: 0.8rem; } } @media (max-width: 400px) { .daliwr-banner .daliwr-testun { line-height: 1rem; } } .daliwr-banner .daliwr-testun a { text-decoration: underline; } .daliwr-banner .daliwr-testun * { color: inherit !important; } .daliwr-banner .triongl { width: 0; height: 0; border-left: 2.5em solid transparent; z-index: 1000; position: relative; background: transparent; left: calc(-2.5em + 0.004em); /*stopio llinell vertical gwag ddangos wrth zoomio*/ } /*==================== TOOLTIP ====================*/ .tooltip-content { display: none; border: 1px solid #408627; background-color: white; color: black; border-radius: 0.25em; padding: 0.25em; z-index: 999; position: absolute; right: 100%; } .tooltip.apple { padding-left: 0.5em; } .tooltip.apple, .tooltip.google { /*position: relative; bottom: 1em;*/ } .tooltip-visible { display: inline-block; } /*==================== BLYCHAU NEGESEUON LLIW SOLID ====================*/ .message-purple-solid .low-priority-alert-color a:link, .message-purple-solid .low-priority-alert-color a:visited { color: #ffffff; text-decoration: underline; border-bottom: none; } .message-purple-solid .low-priority-alert-color a:hover, .message-purple-solid .low-priority-alert-color a:active { color: #cccccc; text-decoration: underline; border-bottom: none; } .message-purple-solid .low-priority-alert-color { background-color: #3D3154; border: 5px solid #3D3154; color: #ffffff; } .message-purple-solid .amberAlert::before, .message-purple-solid .mini-amberAlert::before { color: #ffffff; } .message-purple-solid .closeAlert::before, .message-purple-solid .mini-closeAlert::before { color: #ffffff; } .message-brown-solid .low-priority-alert-color a:link, .message-brown-solid .low-priority-alert-color a:visited { color: #ffffff; text-decoration: underline; border-bottom: none; } .message-brown-solid .low-priority-alert-color a:hover, .message-brown-solid .low-priority-alert-color a:active { color: #cccccc; text-decoration: underline; border-bottom: none; } .message-brown-solid .low-priority-alert-color { background-color: #A06013; border: 5px solid #A06013; color: #ffffff; } .message-brown-solid .amberAlert::before, .message-brown-solid .mini-amberAlert::before { color: #ffffff; } .message-brown-solid .closeAlert::before, .message-brown-solid .mini-closeAlert::before { color: #ffffff; } .message-red-solid .low-priority-alert-color a:link, .message-red-solid .low-priority-alert-color a:visited { color: #ffffff; text-decoration: underline; border-bottom: none; } .message-red-solid .low-priority-alert-color a:hover, .message-red-solid .low-priority-alert-color a:active { color: #cccccc; text-decoration: underline; border-bottom: none; } .message-red-solid .low-priority-alert-color { background-color: #BB0534; border: 5px solid #BB0534; color: #ffffff; } .message-red-solid .amberAlert::before, .message-red-solid .mini-amberAlert::before { color: #ffffff; } .message-red-solid .closeAlert::before, .message-red-solid .mini-closeAlert::before { color: #ffffff; } .message-blue-solid .low-priority-alert-color a:link, .message-blue-solid .low-priority-alert-color a:visited { color: #ffffff; text-decoration: underline; border-bottom: none; } .message-blue-solid .low-priority-alert-color a:hover, .message-blue-solid .low-priority-alert-color a:active { color: #cccccc; text-decoration: underline; border-bottom: none; } .message-blue-solid .low-priority-alert-color { background-color: #2E72B2; border: 5px solid #2E72B2; color: #ffffff; } .message-blue-solid .amberAlert::before, .message-blue-solid .mini-amberAlert::before { color: #ffffff; } .message-blue-solid .closeAlert::before, .message-blue-solid .mini-closeAlert::before { color: #ffffff; } .message-green-solid .low-priority-alert-color a:link, .message-green-solid .low-priority-alert-color a:visited { color: #ffffff; text-decoration: underline; border-bottom: none; } .message-green-solid .low-priority-alert-color a:hover, .message-green-solid .low-priority-alert-color a:active { color: #cccccc; text-decoration: underline; border-bottom: none; } .message-green-solid .low-priority-alert-color { background-color: #408627; border: 5px solid #408627; color: #ffffff; } .message-green-solid .amberAlert::before, .message-green-solid .mini-amberAlert::before { color: #ffffff; } .message-green-solid .closeAlert::before, .message-green-solid .mini-closeAlert::before { color: #ffffff; } .message-mustard-solid .low-priority-alert-color a:link, .message-mustard-solid .low-priority-alert-color a:visited { color: #ffffff; text-decoration: underline; border-bottom: none; } .message-mustard-solid .low-priority-alert-color a:hover, .message-mustard-solid .low-priority-alert-color a:active { color: #cccccc; text-decoration: underline; border-bottom: none; } .message-mustard-solid .low-priority-alert-color { background-color: #8A6700; border: 5px solid #8A6700; color: #ffffff; } .message-mustard-solid .amberAlert::before, .message-mustard-solid .mini-amberAlert::before { color: #ffffff; } .message-mustard-solid .closeAlert::before, .message-mustard-solid .mini-closeAlert::before { color: #ffffff; } .message-pink-solid .low-priority-alert-color a:link, .message-pink-solid .low-priority-alert-color a:visited { color: #ffffff; text-decoration: underline; border-bottom: none; } .message-pink-solid .low-priority-alert-color a:hover, .message-pink-solid .low-priority-alert-color a:active { color: #cccccc; text-decoration: underline; border-bottom: none; } .message-pink-solid .low-priority-alert-color { background-color: #D21982; border: 5px solid #D21982; color: #ffffff; } .message-pink-solid .amberAlert::before, .message-pink-solid .mini-amberAlert::before { color: #ffffff; } .message-pink-solid .closeAlert::before, .message-pink-solid .mini-closeAlert::before { color: #ffffff; } .message-purple-light-solid .low-priority-alert-color a:link, .message-purple-light-solid .low-priority-alert-color a:visited { color: #ffffff; text-decoration: underline; border-bottom: none; } .message-purple-light-solid .low-priority-alert-color a:hover, .message-purple-light-solid .low-priority-alert-color a:active { color: #cccccc; text-decoration: underline; border-bottom: none; } .message-purple-light-solid .low-priority-alert-color { background-color: #943FE9; border: 5px solid #943FE9; color: #ffffff; } .message-purple-light-solid .amberAlert::before, .message-purple-light-solid .mini-amberAlert::before { color: #ffffff; } .message-purple-light-solid .closeAlert::before, .message-purple-light-solid .mini-closeAlert::before { color: #ffffff; } /*==================== LOGO FEL CEFNDIR, OHERWYDD HYGYRCHEDD ====================*/ .logo_pen { display: inline-block; width: 50px; height: 50px; background-image: url(/SiteElements/Images/Header-logo-colourPNG-50pxx50px.png); background-repeat: no-repeat; vertical-align: -50%; /* wedi cuddio line-height: 50px yn y steil .logowrap a, .logowrap a:visited, .logowrap a:hover */ } /*==================== Bwledi ar templed contentAndSection - dangos inline heb hwn ====================*/ ul.bwledi { margin-left: 36px; } ul.bwledi li { display: list-item; list-style-type: disc; padding-bottom: 10px; } ul.bwledi li::after { content: ""; } /*============================ EICONAU TROEDYN / CYNLLUN TROEDYN NEWYDD 22/01/2019 =============================*/ .eicon-troedyn.google > a > img { width: 150px; height: auto; } .eiconau-troedyn { display: flex; justify-content: center; align-items: center; } .eicon-troedyn * { padding: 0 !important; margin: 0 !important; } footer { height: auto !important; padding-bottom: 1em; } .eicon-troedyn.facebook { margin-left: 0.5em; } .eicon-troedyn.twitter { margin-left: 1em; } footer ul, footer .sys_copyright { text-align: center; } .eicon-troedyn a, .eicon-troedyn a:hover, .eicon-troedyn a:visited, .eicon-troedyn a:link, .eicon-troedyn a:active { text-decoration: none !important; border-bottom: none !important; } @media(max-width: 440px) { .eiconau-troedyn { flex-direction: column; } .eicon-troedyn.twitter { margin-top: 0.5em; } } /* CANLYNIADAU CHWILIO YCHWANEGOL */ .canlyniad-chwilio { margin-top: 3em; margin-bottom: 1em; } .canlyniad-chwilio h3 { font-size: 1.75em; } .canlyniad-chwilio a { font-weight: 700; font-size: 1.5em; } .canlyniad-chwilio li > a { margin-left: 20px; } .canlyniad-chwilio > p { margin-top: 1em; } .canlyniad-chwilio li p { margin-left: 40px; } .canlyniad-chwilio > p > span { display: inline-block; width: 100%; } .canlyniad-chwilio ul { list-style-type: none; } .canlyniad-chwilio li { margin-top: 1em; } /* Ar gyfer hygyrchedd */ .mini-priorityAlert a { text-decoration: underline; } /* Ar gyfer hygyrchedd mapiau */ .leaflet-container:focus { outline: #FF0000 dotted medium !important; } /* Skip to content */ #skiptocontent a { padding:6px; position:absolute; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden; color: #ffffff; border-right:1px solid #ffffff; border-bottom:1px solid #ffffff; border-bottom-right-radius:8px; background-color: #BF1722; z-index: 100; } #skiptocontent a:focus { position:absolute; left: 0px; width:auto; height:auto; outline-color:transparent; } .text-red { color: red; } .text-green { color: green; } .text-orange { color: #ec5900; } .text-red-bold { color: red; font-weight: bold; } .text-green-bold { color: green; font-weight: bold; } .text-orange-bold { color: #ec5900; font-weight: bold; } .accord-block:hover > [class^="text-"] { color: white; } .message-purple-solid li { margin-bottom: 0.25em; } /** LLinell amser */ /* The actual timeline (the vertical ruler) */ .timeline { position: relative; max-width: 1200px; margin: 0 auto; background: #eee; } /* The actual timeline (the vertical ruler) */ .timeline::after { content: ''; position: absolute; width: 6px; background-color: black; top: 0; bottom: 0; left: 10%; margin-left: -3px; } /* Container around content */ .timelinecontainer { padding: 10px 40px; position: relative; background-color: inherit; width: 75%; } /* The circles on the timeline */ .timelinecontainer::after { content: ''; position: absolute; width: 25px; height: 25px; right: -17px; background-color: white; border: 4px solid #408627; top: 15px; border-radius: 50%; z-index: 1; } /* Place the container to the right */ .timelineright { left: 10%; } /* Add arrows to the right container (pointing left) */ .timelineright::before { content: " "; height: 0; position: absolute; top: 22px; width: 0; z-index: 1; left: 30px; border: medium solid white; border-width: 10px 10px 10px 0; border-color: transparent white transparent transparent; } /* Fix the circle for containers on the right side */ .timelineright::after { left: -16px; } /* The actual content */ .timelinecontent { padding: 20px 30px; background-color: white; position: relative; border-radius: 6px; } /* Banner Pob Tudalen Header */ #bannerPobTudalenHeader { padding-bottom: 1em; background: #757575; color: white; } #bannerPobTudalenHeader-testun { padding-top: 1.2em; max-width: 905px; margin: 0 auto; padding-left: 1em; padding-right: 1em; } #bannerPobTudalenHeader-testun > span { font-weight: bold; font-size: 1.2em; } #bannerPobTudalenHeader-testun a { color: black; text-decoration: underline; text-underline-offset: .2em; font-weight: bold; font-size: 1rem; } #bannerPobTudalenHeader-testun a:hover, .alert p a:hover, .sys_accordion-content a:hover, #maincontent a:hover { text-decoration-thickness: 3px; } /* Media queries - Responsive timeline on screens less than 600px wide */ @media screen and (max-width: 600px) { /* Place the timelime to the left */ .timeline::after { left: 31px; } /* Full-width containers */ .timelinecontainer { width: 100%; padding-left: 70px; padding-right: 25px; } /* Make sure that all arrows are pointing leftwards */ .timelinecontainer::before { left: 60px; border: medium solid white; border-width: 10px 10px 10px 0; border-color: transparent white transparent transparent; } /* Make sure all circles are at the same spot */ .timelineright::after { left: 15px; } /* Make all right containers behave like the left ones */ .timelineright { left: 0%; } } .timeline-date { position: relative; left: 10%; padding: 20px 70px 0; width: 50%; font-weight: bold; font-size: 18px; } /* trwsio padding content and section */ section a.sys_16{ padding-left: 0px; } /* Cuddio label Cod post ar y tudalen gartref ac yn y mini-template LleDwinBywChwilio ar gyfer hygyrchedd */ #TextboxWithRedirect_redirectLabel, #TextboxWithRedirectTrethCyngor_redirectLabel, #TextboxWithRedirectCouncilTax_redirectLabel, #LleDwinBywChwilioTextboxWithRedirect_redirectLabel, #TextboxWithRedirectCllr_redirectLabel, #TextboxWithRedirectcynghorwyr_redirectLabel, #TextboxWithRedirectBusnes_redirectLabel, #TextboxWithRedirectBusiness_redirectLabel { position: absolute; left: -999em; width: 1em; overflow: hidden; } .border-1px-black { border: 1px solid black; } /* Css ar gyfer Emojis */ #light-bulb-Emoji::after{ content: "\01F4A1"; } #banana-Emoji::after{ content: "\01F34C"; } /* Css ar gyfer Baner cwcis */ #cwcis-manage-title{ color: #d6d6d6; } #cwcis-intro-paragraph{ font-size: 1.1em !important; } #cwcis-intro-paragraph2{ font-size: 1.1em !important; } #cwcis-manage-paragraph{ font-size: 1.1em !important; } #cwcis-tracking-paragraph{ font-size: 1.1em !important; } /* The switch - the box around the slider */ .switch { position: relative; display: inline-block; width: 44px; height: 45px; } /* Hide default HTML checkbox */ .switch input { position: absolute; left: -3000px; } #cwcis_toggle:focus{ border: 2px solid orange!important; } /* The slider */ .slider { position: absolute; cursor: pointer; left: 0; right: 0; bottom: 12px; background-color: #b0283c; -webkit-transition: .4s; transition: .4s; border-radius: 8px; height: 14px; } .slider:before { position: absolute; content: ""; height: 26px; width: 26px; left: -5px; bottom: -7px; background-color: #d6d6d6; -webkit-transition: .4s; transition: .4s; border-radius: 50%; border: 1px solid #aaa; } .slider:hover:before { background-color: #aaa; } /* input:checked + .slider:before{ background-color: #52cf71; } */ input:checked + .slider { background-color: #408627; } input:focus + .slider { box-shadow: 0 0 1px #015b66; border: 1px solid orange!important; } input:checked + .slider:before { -webkit-transform: translateX(33px); -ms-transform: translateX(33px); transform: translateX(33px); } .report_switch { border-radius: 5px; text-align:center; margin-left:auto; margin-right:auto; } .switch_text { float: left; margin-left: 5px; position: relative; left: 45px; height: 45px; width: 95px; text-align: center; padding-top: 10px; color: #d6d6d6; border-radius: 7px; cursor:pointer; color: #393939; } .cwcis_panel h2 { border: 0px!important; margin-top:20px!important; } .cwcis_panel h3 { color: #d6d6d6 !important; } .cwcis_panel img{ height: 100px; } .cwcis_panel{ margin: 0; font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans; } .cwcis_panel { background: #444444; position: fixed; left: -400px; top: 0px; bottom: 0px; width: 360px; float: left; z-index: 1007; text-align: center; padding: 20px; padding-top:30px; -webkit-box-shadow: 6px 0px 18px -10px rgba(0,0,0,0.61); -moz-box-shadow: 6px 0px 18px -10px rgba(0,0,0,0.61); box-shadow: 6px 0px 18px -10px rgba(0,0,0,0.61); animation-name: cookie_panel_animation; animation-duration: 2s; animation-fill-mode: forwards; display: none; font-size:0.85em; overflow:auto; } .cwcis_panel button { width: 100%; float: left; font-weight: 700; background: #408627; padding: 16px; margin-left: 0px!important; border: 0px solid #408627 !important; font-size: 1em!important; font-weight: 700!important; color: white; margin-top: 10px; border-radius: 6px; } .cwcis_panel h2 { border: 0px!important; margin-top:20px!important; } .cwcis_panel button:hover, .cwcis_panel button:focus { background: #2b5d1a; border: 1px solid orange!important; } .switch_cwcis .switch_text { width: 210px!important; padding-top: 14px; text-align: left; margin-left: 20px; color: #d6d6d6; } .switch_cwcis { height: 50px!important; } .cwcis_panel .slider { bottom: 17px; } .cwcis_preferences { background: #55714b!important; color: white!important; float: left; width: 100%; margin-top: 15px!important; width: 100%; float: left; background: rgb(7,120,134); padding: 16px; margin-left: 0px!important; border: 0px solid #60bb3f!important; font-size: 1em!important; font-weight: normal!important; color: #d6d6d6; margin-top: 10px; border-radius: 4px; } .cwcis_preferences:hover, .cwcis_preferences:focus { background: #2b5d1a!important; } .cwcis_panel h1 { margin-bottom:20px; text-align:left; margin-top: 30px; font-size: 1.6em !important; color: #d6d6d6 !important; padding-bottom: 0px !important; } .cwcis_panel p { text-align:left; color: #DEDEDE; } .cwcis_panel ul { margin-left: 15px; margin-top: 5px; float: left; } #cwcis_manage { text-align: left; float:left; display:none; } .cwcis_box { float: left; background: #323232; width: 96%; border: 1px solid #585858; padding-left: 15px; border-radius: 24px; margin-bottom:10px; } .cwcis_policy { width: 100%; float: left; left: 0px; padding: 15px 0px; margin-top: 15px; bottom: 0px; color: white !important; text-align: center; border-radius: 6px; font-weight: 700; text-decoration: none; } .cwcis_policy:hover{ color:#aaa; text-decoration: underline; } @media only screen and (max-height: 925px) and (max-width: 500px){ .cwcis_panel { width: 65% !important; overflow:auto; padding-bottom:70px !important; overflow-x: hidden !important; } .cwcis_box{ margin-top: 0px; } .cwcis_panel h2{ margin-top: 0px !important; } #cwcis-intro-paragraph{ font-size: 1.1em!important; } #cwcis-intro-paragraph2{ font-size: 1.1em!important; } #cwcis-manage-paragraph{ font-size: 1.1em!important; } #cwcis-tracking-paragraph{ font-size: 1.1em!important; } } @media only screen and (max-height: 750px) and (max-width: 500px){ .cwcis_panel { width: 65% !important; overflow:auto; padding-bottom:70px !important; overflow-x: hidden !important; } .cwcis_box{ margin-top: 0px; } .cwcis_panel h2{ margin-top: 0px !important; } #cwcis-intro-paragraph{ font-size: 1em!important; } #cwcis-intro-paragraph2{ font-size: 1em!important; } #cwcis-manage-paragraph{ font-size: 1em!important; padding-bottom: 0px!important; } #cwcis-tracking-paragraph{ font-size: 1em!important; padding-bottom: 0px!important; } } @media only screen and (max-height: 700px) and (max-width: 500px){ .cwcis_panel { width: 65% !important; overflow:auto; padding-bottom:70px !important; overflow-x: hidden !important; } .cwcis_panel{ line-height: 1.2em; } .cwcis_box{ margin-top: 0px; } .cwcis_panel h2{ margin-top: 0px !important; } #cwcis-intro-paragraph{ font-size: 1em!important; } #cwcis-intro-paragraph2{ font-size: 1em!important; } #cwcis-manage-paragraph{ font-size: 1em!important; padding-bottom: 0px!important; } #cwcis-tracking-paragraph{ font-size: 1em!important; padding-bottom: 0px!important; } .switch_text{ top: 3px; } } @media only screen and (max-height: 640px) and (max-width: 500px){ .cwcis_panel { width: 75% !important; overflow:auto; padding-bottom:70px !important; overflow-x: hidden !important; } .cwcis_panel{ line-height: 1.2em; } .cwcis_box{ margin-top: 0px; } .cwcis_panel h2{ margin-top: 0px !important; } #cwcis-intro-paragraph{ font-size: 1em!important; } #cwcis-intro-paragraph2{ font-size: 1em!important; } #cwcis-manage-paragraph{ font-size: 1em!important; padding-bottom: 0px!important; } #cwcis-tracking-paragraph{ font-size: 1em!important; padding-bottom: 0px!important; } .cwcis_panel img{ height: 90px!important; } .cwcis_policy{ margin-top:0px!important; } .cwcis_box{ margin-bottom:0px !important; } .switch_text{ top: 3px; } } @keyframes cookie_panel_animation { from {left: -350px;} to {left: 0px;} } .cwcis_policy:hover { color: #d6d6d6; } /* Diwedd Css Baner Cwcis */ /* Banner pob tudalen header alert */ #bannerPobTudalenHeaderAlert { background-color: #EB0000; color: white; padding: 0.5em; margin-top: 0.25em; display: flex; } #bannerPobTudalenHeaderAlert > span.icon-circle-exclamation { font-size: 2em; padding-right: 0.5em; align-self: center; } #bannerPobTudalenHeaderAlert .alert-teitl span { font-weight: bold; } /* Screen Readers yn unig */ .sr-only { position:absolute; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden; } /* Gosod focus ar gyfer hygyrchedd - Firefox yn penodol. */ /*a:focus, div:focus, span:focus, li:focus { border: 2px solid black !important; }*/ /* Steil amserlenniBws newid o table i list */ .bus-tableheader { text-align: left; background: #666 !important; color: #fff; font-weight: 700; margin: 0; padding: 10px; vertical-align: top; background: #fff; } .bus-tablebody { margin: 0; padding: 10px; vertical-align: top; border: 1px solid #babcbf; background: #fff; font-weight: normal; } .amserlenniBws{ list-style:none; padding: 0!important; } .BannerTopCartref { background-color: black; } .BannerTopCartref a { color: white; text-decoration: underline; } .BannerTopCartref div.cynnwys { color: white; max-width: 905px; margin: 0 auto; padding: 1em; } .BannerTopCartref.melyn { background-color: #F0F000; } .BannerTopCartref.melyn a { color: black; padding-left: 0em; } .BannerTopCartref.melyn div.cynnwys { color: black; } footer .neges-dwyieithog { text-align: center; color: white; font-weight: bold; } @media only screen and (max-width: 580px) { .holiadur_width_wide { max-width: 90%; } } /* html[lang="en-GB"] a[target="_blank"]:after { content: "(Opens in new tab)"; } html[lang="en-GB"] a.sys_21[target="_blank"]:after { content: "(pdf) (Opens in new tab)"; } */ /* Dweud eich dweud. */ .bigimg { height: 400px; overflow: hidden; } .bigimg.h500 { height: 500px; } .bigimg > img { position: relative; width: 1903px; height: 476px; left: 0px; top: -38px; } .bocs-lluniau-daliwr { margin: 0 auto; width: 90%; } .bocs-lluniau-bocs { box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px; border-radius: 6px; margin-bottom: 2em; display: flex; margin-top: 1em; } .bocs-lluniau-bocs:hover { box-shadow: 3px 2px 30px -10px rgba(0,0,0,0.50); } .bocs-lluniau-bocs .llun { /* width: 23em; */ display: flex; justify-content: center; align-items: center; /* overflow: hidden; */ } .bocs-lluniau-bocs .llun img { /* border-radius: 6px 0px 0px 6px; max-height: 100%; max-width: 100%; height: auto; */ flex-shrink: 0; min-width: 100%; min-height: 100%; } .bocs-lluniau-bocs .cynnwys { width: auto; padding: 1em; display: flex; flex-direction: column; justify-content: space-between; padding-bottom: 0em; } .bocs-lluniau-bocs .testun { order: initial; padding-right: 1em; } .bocs-lluniau-bocs a.button-green, .bocs-lluniau-bocs a.button-yellow { align-self: flex-start; } @media only screen and (max-width: 500px) { /* .bocs-lluniau-bocs > .llun { display: none; } */ .bocs-lluniau-bocs .llun img { min-width: unset; min-height: unset; width: 50%; height: auto; } } @media only screen and (max-width: 700px) { .bocs-lluniau-bocs { flex-direction: column; } .bocs-lluniau-bocs .testun { margin-bottom: 1em; } .bocs-lluniau-bocs .llun img { min-width: auto; padding-top: 1em; } } .bocs-lluniau-daliwr.grid { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 10px; } .bocs-lluniau-daliwr.grid .bocs-lluniau-bocs .cynnwys { height: 100%; } .bocs-lluniau-daliwr.grid .bocs-lluniau-bocs { flex-direction: column; flex-basis: 32.33%; } @media only screen and (max-width: 980px) { .bocs-lluniau-daliwr.grid { justify-content: center; } } @media only screen and (max-width: 630px) { .bocs-lluniau-daliwr.grid .bocs-lluniau-bocs { flex-basis: 100%; } .bocs-lluniau-bocs:hover { box-shadow: rgba(0, 0, 0, 0.6) 0px 10px 10px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px; } .bocs-lluniau-bocs { box-shadow: rgba(0, 0, 0, 0.6) 0px 10px 10px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px; } } .bocs-lluniau-bocs .button-green, .bocs-lluniau-bocs .button-yellow { height: unset; min-height: 2.5em; } .banner-llun img { max-width: 100%; height: auto; } .bocs-lluniau-bocs .bocs-lluniau-daliwr-testun { flex-grow: 1; display: flex; flex-direction: column; } .bocs-lluniau-bocs .bocs-lluniau-daliwr-testun h3 { flex-basis: 3em; } .holiadur_logo img { max-width: 5em; } /* Straight to row */ #maincontent .straight-to-row .sys_flex { padding: 10px; } #maincontent .straight-to-row .sys_straight-to { padding: 20px; } /* Banner llun H1 */ #daliwr-banner-h1 { position: relative; border-bottom: 0.5em solid #1a1a1a; } #daliwr-banner-h1 .llun img { max-width: 100%; object-fit: cover; display: block; } #daliwr-banner-h1 .daliwr-teitl { position: relative; max-width: 960px; margin: auto; } #daliwr-banner-h1 h1 { display: inline; background-color: #1a1a1a; color: white; padding: 0.6em 0.8em 0.35em 0.8em; position: absolute; bottom: 0em; } #daliwr-banner-h1 .llun { min-height: 6em; } .nodyn { border-left: 10px solid #b1b4b6; padding: 1em 0 1em 1em; margin: 1em 0; } .ochr-wrth-ochr { display: flex; flex-direction: row; } .ochr-wrth-ochr .chwith, .ochr-wrth-ochr .dde { flex-basis: 50%; } .ochr-wrth-ochr img { max-width: 100%; height: auto; } .ochr-wrth-ochr .dde { padding-left: 1em; } .ochr-wrth-ochr .dde img { margin-left: -1em; }