/* Stylesheet for the 'Plone THEME AjSolsona' Plone theme */ /* --------------------------------------------------------- TOC 1 - HEADER 1.1 - Search 1.2 - Policia 1.3 - Main Menu 1.4 - Language selection 1.5 - Personal tools 2 - HOME 2.1 - Slider 2.2 - Announcements 2.3 - News 2.4 - Events 2.5 - A un click 3 - BANNERS 4 - FOOTER 4.1 - Social Links 4.2 - Menu 5 - INTERIOR 5.1 - Header 5.2 - Aside Navigation 5.3 - Page 5.4 - Summary 5.5 - Document Actions 6 - EVENTS 7 - GALLERY 8 - ELECTRONIC SITE 9 - SEARCH RESULTS 10 - BOOKING 11 - MAP */ .m-0 { margin: 0 !important; } /* ---------------------------- */ /* 1 - HEADER */ #portal-logo { display: block; width: 15.625rem; } #portal-logo svg { width: 15.625rem; height: 5.3125rem; } /* 1.1 - Search */ .showSearchButton { position: absolute; top: 1rem;right: 1rem;} @media all and ( min-width: 64em ){ /* 640px */ .showSearchButton { position: static; top:auto; right: auto; margin-left: 2rem; } } /* 1.2 - Policia */ .contactPolicia { width: 100%;} .contactPolicia img { height: 62px; -webkit-box-flex: 0; -ms-flex: 0 0 51px; flex: 0 0 51px; } /* 1.3 - Main Menu */ #portal-globalnav.menu {} #portal-globalnav.menu li a { padding-right: 0;} #portal-globalnav.menu li.selected a { color: #7d2b27 !important;} @media all and ( min-width: 64em ){ /* 1024px */ #portal-globalnav.menu { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-align: baseline;-ms-flex-align: baseline;align-items: baseline; } #portal-globalnav.menu li a { padding-left: 0;} #portal-globalnav.menu .icon-puntets { } } /* 1.4 - Language selection */ .searchLanguageBox { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } #portalLanguageGoogle { overflow: hidden; position: relative; max-width: 11rem; margin: 0 auto; z-index: 1; } #portalLanguageGoogle select { padding: 0 .5rem; border: none; border-radius: 0; font-family: 'Roboto', sans-serif; background: none transparent; cursor: pointer; font-weight: bolder; line-height: 1em; } #portalLanguageGoogle .icon-arrow { color: #7d2b27; position: absolute; right: .5rem; top:.75rem; pointer-events: none; } #portalLanguageGoogle:hover .icon-arrow { color: #eb6060; } @media all and (min-width: 40em) { /* 640px*/ .searchLanguageBox { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } #portalLanguageGoogle { margin: 0; } } @media all and (min-width: 64em) { /* 1024px*/ .searchLanguageBox { -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } #portalLanguageGoogle select { font-size: 1em; } } @media all and (min-width: 75em) { /* 1200px*/ #portalLanguageGoogle select { font-size: 1.25em; } } dl.actionMenu.activated dd { z-index: 2000; } /* per evitar que el menu d'usuari surti per sota del desplegable de Google */ /* 1.5 - Personal tools */ #portal-personaltools ul { margin-left: 0; margin-bottom: 0; list-style-type: none;} #portal-personaltools li { font-size: 1rem; } /* ---------------------------- */ /* 2 - HOME */ /* 2.1 - Slider */ .slide-portada { position: relative; overflow: hidden; } .slide-portada .slide-portada-item > * { padding-bottom: 4rem; height: 100%; } .slide-portada .slide-portada-item-text { margin-bottom: 10rem; } .slide-portada .bx-controls { position: absolute; left: 1rem; right: 1rem; bottom: 4rem; } .slide-portada .bx-controls .icon-arrow:before { margin-right: 0;} .slide-portada .bx-controls button { color: #FFFFFF; } .slide-portada .bx-controls button:hover { color: #9c9e9f; } .slide-portada .bx-controls-direction { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center;} .slide-portada .icon-arrow { text-shadow: 2px 2px 0 rgba(0,0,0,0.75); font-size: 3.5rem; } .slide-portada .icon-arrow.flip-h { text-shadow: -2px -2px 0 rgba(0,0,0,0.77); position: relative; top: -0.4rem; z-index: 100; } .slide-portada .bx-wrapper .bx-next { right: 3.5rem !important;} .slide-portada .separator .icon-arrow:before { display: block; margin: 0;} .slide-portada .bxslider { display: flex;} .slide-portada-item { height: 100%;} @media all and (min-width: 75em) { /* 1200px*/ .slide-portada .bx-controls { width: 75rem; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); right: auto; } } /* 2.2 - Announcements */ #homeAnnouncements {} #homeAnnouncements .flex-container { -webkit-box-align: center; -ms-flex-align: center; align-items: center;} #homeAnnouncements .info-icona{} #homeAnnouncements .info-icona:before{ margin-right: .5rem; } #homeAnnouncements button { -webkit-appearance: none; -moz-appearance: none; appearance: none; } #homeAnnouncements button span { -webkit-transition: color .25s ease; -o-transition: color .25s ease; transition: color .25s ease; } #homeAnnouncements button span:hover { color: #FFFFFF; } #homeAnnouncements .bx-prev { position: relative; top: -3px; } #homeAnnouncements .bx-prev.disabled, #homeAnnouncements .bx-next.disabled { opacity: .33; cursor: default; } #homeAnnouncements .icon-arrow:before { font-size: 2rem; margin: 0; } .aviso_modal p { font-size: 0.875rem; } @media all and (min-width: 40em) { /* 640px*/ #homeAnnouncements h2 { margin-bottom: 0; } } @media all and ( min-width: 64em ){ /* 1024px */ #homeAnnouncements .icon-arrow:before { font-size: 3rem;} } /* 2.3 - News */ .newsItem { } .newsItem:nth-child(odd) > * { border-top: 5px solid #7d2b27; border-bottom: 5px solid #9c9e9f; } .newsItem:nth-child(even) > * { border-bottom: 5px solid #7d2b27; border-top: 5px solid #9c9e9f; } .newsItem.flex-container:nth-child(even) > *:first-child { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; } .newsItem__text { position: relative; } .newsItem__date::before { content:'>'; display: inline; } .newsItem__date::after { content:'<'; display: inline; } .newsItem__link { height: 100%; } .newsItem__image { height: 100%; } .newsItem__more { position: absolute; bottom: 0.5rem; right: 0.5rem; } .newsImageContainer { max-width:25rem; } .newsImageContainer.responsiveImageContainer { float: none !important; width: 100%; margin: 1rem auto !important; max-width: 25rem} .newsImageContainer .bx-controls { width: 100%; height: 2.5rem; padding: 0 .5rem; background-color: #dadadc; position: relative; } .newsImageContainer .bx-controls-direction { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .newsImageContainer .bx-wrapper .bx-controls-direction a { margin-top: -12px; } .newsImageContainer .bx-controls-direction button:hover span { color: #7d2b27; } .newsImageContainer .bx-controls-direction span[class^="icon-"]:before, .newsImageContainer .bx-controls-direction span[class*=" icon-"]:before { margin-right: 0;} .RSSLink { position: absolute; right: 2rem; top:0; display: block; display: block; text-align: center; color: #7d2b27; } .RSSLink span.icon-rss:before { margin-right: 0; } .RSSLink:hover { color: #eb6060;} @media all and (min-width: 40em) { /* 640px*/ .newsImageContainer.responsiveImageContainer { float: right !important; max-width: 25rem; margin: 0 0 0.5em 1em !important; } } /* 2.4 - Events */ #homeEvents { } #homeEvents { background: url(++resource++plonetheme.ajsolsona2017.images/esdeveniments-fons.png) no-repeat 1.5rem 1.5rem #7d2b27; } .eventItem { height: 100%; } .eventItem__image { border: 1px solid #7d2b27; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; } .eventItem__readmore { position: absolute; bottom: 5px; right: 5px;} /* 2.5 - A un click */ #homeClick {} #homeClick .flex-container { -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } #homeClick .flex-container > * { -webkit-box-flex: 1; -ms-flex: 1 0 12.0rem; flex: 1 0 12.0rem; } /* ---------------------------- */ /* ---------------------------- */ /* 3 - BANNERS */ #footerBanners {} #footerBanners .bx-prev { position: relative; top: -1px; } #footerBanners img { width: 170px; height: 170px; } #footerBanners [class^="icon-"]:before, #footerBanners [class*=" icon-"]:before { margin-right: 0; } /* ---------------------------- */ /* ---------------------------- */ /* 4 - FOOTER */ .logoFooter { width: 150px;max-width: none; display: block; -webkit-box-flex: 0; -ms-flex: none; flex: none; margin-bottom: 0;} @media screen and (min-width: 30em) { .logoFooter { width: 205px;} .logoFooter svg { width: 205px; height: 68px; } } /* 4.1 - Social Links */ .xxssLink { display: inline-block; vertical-align: top;} .xxssLink + .xxssLink { margin-left: .125rem; } .xxssLink a { display: block; } .xxssLink [class^="icon-"]:before, .xxssLink [class*=" icon-"]:before { margin: 0; } .xxssLink--contact a { background-color: #7d2b27; border-radius: 50%; color: #FFFFFF;} .xxssLink--contact .icon-mail:before { font-size: 1.25rem; width: 38px; height: 38px; line-height: 38px; display: block; text-align: center; } .xxssLink--facebook a { color: #3b5894; } .xxssLink--twitter a { color: #5ea9dd; } .xxssLink--facebook .icon-facebook-with-circle:before , .xxssLink--instagram .icon-instagram-with-circle:before , .xxssLink--twitter .icon-twitter-with-circle:before { font-size: 2.5rem; } .xxssLink--instagram a {color: #e93c5d; } .xxssLink--twitter a:hover, .xxssLink--facebook a:hover, .xxssLink--instagram a:hover { color: #7d2b27; } /* 4.2 - Menu */ .menu-bordered {} .menu-bordered li { border-left: 1px solid #7d2b27; } @media all and (min-width: 40em) { .menu-bordered li:first-child { border-left: none; } .menu-bordered li:first-child a { padding-left: 0; } } /* ---------------------------- */ /* ---------------------------- */ /* 5 - INTERIOR */ .flex-2col, .flex-3col { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse;} .flex-3col .flex-last { -webkit-box-ordinal-group: 1; -ms-flex-order: 1; order: 1; } @media all and (min-width: 64em) { /* 1024px*/ .flex-2col, .flex-3col { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } } .newsImageContainer /* 5.1 - Header */ .title-seccio { color: rgba(255,255,255,.5); text-transform: uppercase; font-family: 'Roboto Condensed', sans-serif; font-weight: 300; } /* 5.2 - Aside Navigation */ dl.portlet { font-size: 1.125rem; margin-bottom: 5rem; } .portlet .navTree { font-family: 'Roboto Condensed', sans-serif; font-size: 1.25rem; color: #9c9e9f; font-weight: 400; } .portlet ul.navTree { list-style-type: none; margin-left: 0; } .portlet .navTree a { color: #9c9e9f;} dl.portlet ul.navTreeLevel0.navTree > .navTreeItem { border-bottom: 3px dotted #9c9e9f; } dl.portlet ul.navTreeLevel0.navTree .navTreeItem { padding: .25em .25em .25em 0; line-height: 1.25em; } dl.portlet ul.navTreeLevel0.navTree .navTreeItem > a { line-height: 1.25em !important;} dl.portlet ul.navTreeLevel0.navTree > .navTreeItem.navTreeCurrentNode { border-color: #7d2b27; border-left: none; margin-left: 0; margin-right: 0; } dl.portlet ul.navTree a.navTreeCurrentItem { background-color: transparent; color: #7d2b27; font-weight: 700; margin: 0; border-left: none; } dl.portlet ul.navTree .navTree { padding-left: 1em; font-size: .8em; } dl.portlet ul.navTree .navTree .navTreeItem { margin-bottom: 0; } /* 5.3 - Page */ .documentFirstHeading { font-weight: 700; color: #7d2b27; text-transform: uppercase; font-size: 1.4rem; text-align: left; margin-bottom: 2em;} #content-core { } #content-core a { font-weight: 700;} .relatedItems {} .relatedItems dt { color: #808080; } .relatedItems dd:after { content: "\e902"; vertical-align: middle; display: inline-block; margin-left: .125em; font: normal normal 1em / 1em 'icomoon' !important; speak: none; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; color: #7d2b27; } /* 5.4 - Summary */ .bgimage--summary { min-height: 8rem; height: 100%; } /* 5.5 - Document Actions */ .actionButtons__list { display: block; } .actionButtons__list li + li { margin-left: 1.25rem; margin-top: 1rem; } .actionButtons__item { display: inline-block !important;} @media only all and (min-width: 40em) { /* 640px*/ .actionButtons__list li + li { margin: 0 0 0 .5rem; } } #document-action-print a, #document-action-sendto a { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center;} #document-action-print a:after, #document-action-sendto a:after { content: '\e954'; color: #DADADC; background-color: #9c9c9c; speak: none; margin-left: .5em; font: normal normal 1.5rem/1em 'icomoon' !important; border-radius: 50%; padding: .33em; display: inline-block; } #document-action-sendto a:after { content: '\e903'; } #document-action-print a:hover:after, #document-action-sendto a:hover:after { background-color: #7d2b27; } .shareButtons { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: center; -ms-flex-align: center; align-items: center;} .shareButtons__list { margin-bottom: 0; margin-right: 0.5rem; } .shareButtons li { display: inline !important; } .shareButtons__icon:before { margin-right: 0;} @media only all and (min-width: 64em) { /* 1024px*/ .actionButtons__list li + li { margin-top: 0;} } /* ---------------------------- */ /* ----------------------------- */ /* 6 - EVENTS */ .eventDetails.responsiveEventDetails { margin: 2rem auto; float: none; width: 100%; } .eventDetails.responsiveEventDetails table, .eventDetails.responsiveEventDetails tbody, .eventDetails.responsiveEventDetails thead, .eventDetails.responsiveEventDetails tr, .eventDetails.responsiveEventDetails td, .eventDetails.responsiveEventDetails th { display: block; } .eventDetails.responsiveEventDetails th { text-align: left; font-size: 0.875rem; padding: 0.25rem .625rem 0 .625rem; } .eventDetails.responsiveEventDetails tbody td { padding-top: 0; } .formid-fes-la-teva-reserva { max-width: 640px; } /* ----------------------------- */ /* 7 - GALLERY */ .folderEntry { position: relative; display: block; } .folderEntry:after { content: "\e90e"; display: block; position: absolute; right: .5rem; top: .5rem; color: #FFFFFF; text-shadow: 0 0 2px rgba(0,0,0,0.75); font: normal normal 1.5rem/1em 'icomoon' !important; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } figure.photoAlbum { margin-bottom: 2em; } figcaption.photoAlbumEntryTitle { font-size: 1rem; font-weight: bolder; width: 100%; line-height: 1.25em; } /* ----------------------------- */ /* 8 - ELECTRONIC SITE */ .electroLink { border-bottom: 1px solid #dadadc; font-family: 'Roboto Condensed', sans-serif; font-weight: 300 !important; display: block; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 1em;} .electroLink:after { content: "\e904"; font: normal normal .8em/1em 'icomoon' !important; speak: none; -webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale; color: #9c9e9f; display: block; float:right;} .electroLink:hover:after { color: #eb6060; } .accordion--solsona {} .accordion--solsona .accordion-item { margin-bottom: 0 !important;} .accordion--solsona .accordion-title{ font-size: 1.25rem; color: #7d2b27;} /* ----------------------------- */ /* ----------------------------- */ /* 9 - SEARCH RESULTS */ dl.actionMenu.activated dd.actionMenuContent { width: 250%; } #search-filter .field { text-align: left; } dl.searchResults dd { margin-bottom: 2em;} /* ----------------------------- */ /* ----------------------------- */ /* 10 - BOOKING */ body.portaltype-bookingcenter .dropdown.menu > li.is-dropdown-submenu-parent > a.button:after { border-color: #FFFFFF transparent transparent; right: 12px; } body.portaltype-bookingcenter .dropdown.menu .is-active > a.button { background-color: #EB6060; color: #FFFFFF; } body.portaltype-bookingcenter #content-core ul.is-dropdown-submenu { margin-left: 0; } body.portaltype-bookingcenter #content-core .is-dropdown-submenu a { font-weight: normal; } body.portaltype-bookingcenter .dropdown .is-dropdown-submenu { padding: .25rem 0.7rem; font-size: 0.88rem; } .icon-right { position: absolute; right: 12px; top: .88em;} #content ul.menu { list-style-type: none; } body.portaltype-bookingcenter:not(.userrole-manager) #edit-bar{ display: none;} /* ----------------------------- */ /* ----------------------------- */ /* 11 - MAP */ #TTMapWrap, #TTMapWrap.medium-9, #TTMapCollapsiblePanels, #TTMapCollapsiblePanels.medium-3 { width: 100%; float: none; max-width: 100%; } .gm-style-iw div div > b { display: block; font-size: 2em;} .TTMapSubcategoriesInner { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start;} .TTMapCategory { margin-right: 1em;} /* ----------------------------- */ .parent-fieldname-description, #parent-fieldname-description {color:#9c9e9f;} .parent-fieldname-title, #parent-fieldname-title {color:#7d2b27;} .portaltype-booking #edit-bar {display:none;} #archetypes-fieldname-title input {font-size:1.3rem} #content ul.accordion { list-style-type: none; margin-left: 0; } #plonebrowser .thumbnail { border: none; overflow: visible; display: block; line-height: 1.5; box-shadow: none; } /* ----------------------------- */