/*Theme Name: Barbones Art 27 Scotland Artist English Theme URI: http://lunaria.co.uk/barebones/ Description: Barebones Child Theme Author: Lunaria Ltd. Author URI: http://example.com Template: barebones Version: 1.0.0 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Tags: simple, boilerplate, responsive-layout, accessibility-ready Text Domain: barebonesart27scotland */ /* #Basic Layout and structure ======================================================================================== */ /* Body ----------------------------------*/ body {color: var(--text); font-family: var(--primary-font); background-color:white;} .clear {width: 100%; clear: both;} #content_wrapper {padding-top:100px; padding-bottom:50px;} .home #content_wrapper {padding-top:150px;} p { font-size: 1.1rem; line-height: 1.5; margin-bottom: 1em;font-weight:400;} .home h1.entry-title {display:none;} /* Wrappers and containers ---------------*/ /* Header */ .header-nav-block.alt.mobile {position: fixed; background-color:var(--primary); z-index:999; width:100%; margin-top:0; padding-top:20px; padding-bottom:10px;} .header-nav-block.alt.mobile .main-navigation {width:100%;} #header-wrapper{ background-color:white; border-bottom: 1px solid #999; display:flex;} header#masthead { display: flex; flex-direction: row; width: 100%; flex-wrap:nowrap; align-items: center;} .site-branding{order:1; flex-basis: 60%; padding: 20px 20px 10px 20px; } .header-functional {order:2; flex-basis: 40%; padding: 10px 10px 0 0; display:flex; flex-direction: column;} .header_widgets_block {flex-basis: 100%; order :2;} .header-nav-block{flex-basis: 60%; order :1;} #site-branding__logo { margin-right:15%} .header-functional .widget_google_translate_widget { margin: 0 0 10px 0; text-align: right;} .header-functional ul {margin:0;} .goog-te-combo, .goog-te-banner *, .goog-te-ftab *, .goog-te-menu *, .goog-te-menu2 *, .goog-te-balloon {font-size: 10pt !important;font-family: var(--secondary-font) !important;padding: 3px 5px 3px 5px;} #google_translate_element{margin: 0;} /* Footer*/ #logo-fest {padding-left: 5%; padding-right: 5%; padding-bottom:50px;} #logo-fest .sponsors_logos p img { width: 140px;padding: 10px; } #logo-fest .sponsors_logos p { width: 100%; margin: 0; display: flex; flex-direction: row;flex-wrap: wrap;justify-content: center;align-items: flex-start; padding-bottom:20px;} #footer-wrapper { background-color:var(--primary); min-height: 500px; } #footer-wrapper .front-page__wrapper__left .widget-container {padding: 10px 0 0 0 ;} #footer-wrapper .front-page__wrapper__right img.footer-logo {max-width: 200px} #menu-art27-external-links{margin:0} .site-info { padding-top: 0; } /* content*/ .home main#primary{ padding-left: 5%; padding-right: 5%;} .home .entry-content { padding: 0 ;} .home #primary { padding-bottom: 10px; } .navigation.post-navigation {display:none;} img.wordcloud {padding:20px 10px 30px 10px;} /* Superslider*/ .front-page_image-slider .n2-ss-slide, .front-page_image-slider .n2-ss-slide--focus{z-index:990!important;} /* List on about us page*/ #art27scotland .category-list.about-us_list .category-list__thumb { flex-basis:20% ; order: 1;} #art27scotland .category-list.about-us_list .category-list__thumb img { outline: solid 1px var(--text);} #art27scotland .category-list.about-us_list .category-list__content {flex-basis:78% ; order: 2;} #art27scotland .category-list.about-us_list .category-list__item {margin-bottom:20px; border-top: solid 1px var(--text);padding-top:20px;} #art27scotland .category-list.about-us_list .category-list__item .category-list-item__title h3 {padding-top:0; margin-top:0;} /* Search--------------------------------*/ #footer__search .search-form input[type="search"]:hover {outline: solid 1px var(--text); color:var(--text); } #footer__search .search-form input[type="search"]:focus { color:var(--text);} /* Social links--------------------------------*/ .wp-block-social-link-anchor svg:hover {color:white; fill:white !important;} .wp-block-social-links .wp-social-link.wp-social-link.wp-social-link { margin: 0 !important;} .wp-block-social-links.is-style-logos-only .wp-social-link { padding: 0 !important;} .wp-block-social-link-anchor svg:hover { fill: var(--tertiary) !important;} .wp-block-social-links.alignleft { margin: 20px auto 0 auto !important; width:300px !important; float:left!important; padding: 20px 0 0 0 !important; text-align:center;} /* Main menu ----------------------------------*/ .main-navigation ul { display: none; list-style: none; margin: 0; padding-left: 0;} .main-navigation ul ul { box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2); float: left;position: absolute;top: 100%;left: -999em; z-index: 99999;} .main-navigation ul ul ul { left: -999em; top: 0;} .main-navigation { font-family: var(--secondary-font); font-weight: 800; font-size: 12pt; float:right;} /* Nav on the page */ #on_page__widgets ul.menu {margin:0; padding:10px 0 0 0;} #on_page__widgets ul.menu li {transition: background-color 500ms ease;font-size: 12pt; text-decoration:none; background-color:var(--primary); list-style: none; padding: 5px 10px 5px 10px ; color:var(--primary); display:inline-block; margin: 0 3px 10px 0;} #on_page__widgets ul.menu li:hover {background-color:var(--tertiary);} #on_page__widgets ul.menu li a {color:white; font-weight: 400;} #on_page__widgets ul.menu li a:hover {color:white; } /* Nav in the footer */ #footer-wrapper .widget_nav_menu li {font-size: 1rem; font-family: var(--secondary-font); font-weight: 800; margin: 0; padding: 0; list-style: none; } #footer-wrapper .widget_nav_menu li a {color: var(--text); transition: color 500ms ease;} #footer-wrapper .widget_nav_menu li a:hover {color: white;} /* Logo fest*/ #logo-fest .sponsors_logos p { margin:20px 0 0 0; padding:0;display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: flex-start; } /*++++++++++++++++++++++++++++++++++++++++++++++ MEDIA QUERIES ++++++++++++++++++++++++++++++++++++++++++++++*/ .desktop {display:none;} .mobile {display:block;} @media screen and (min-width:768px){ .desktop {display:block;} .mobile {display:none;} #header-wrapper{position: fixed; min-height:150px; top:0; background-color:white; z-index:999; border-bottom: 1px solid #999; display:flex;} header#masthead { display: flex;flex-direction: row; justify-content: space-between; width: 100%; max-width: 100%;} .site-branding{order:1; flex-basis: 20%; padding: 20px 20px 10px 20px;} .header-functional {order:2; flex-basis: 80%; padding: 20px 20px 10px 0; display:flex; flex-direction: column; } .main-navigation ul { display:block;} .header_widgets_block {flex-basis: 100%; order :1;} .header-nav-block{flex-basis: 100%; order :2;} #site-branding__logo {width:300px;} button.menu-toggle { display: none; } .main-navigation ul {display:block; list-style: none; margin: 0;padding-left: 0;} #footer-wrapper .widget_nav_menu ul {list-style: none; padding-left:0} .wp-block-social-links.alignleft { width:100% !important; float:left!important; text-align:left;} .home main#primary{ padding-left: 20%; padding-right: 20%;} button.menu-toggle { display: none; } .main-navigation { font-family: var(--secondary-font); font-weight: 800; font-size: 12pt; float:right; } .main-navigation ul { margin: 0 0 10px 10px; display: flex; flex-wrap: nowrap; flex-direction: row; text-align: right; } .main-navigation ul li {background-color: transparent; padding: 0; border-radius: 0; list-style: none; line-height: 1.2; float:left; text-decoration: none; margin: 10px 0 10px 10px; } .main-navigation ul li:hover {padding: 0; margin: 10px 0 10px 20px; } .main-navigation ul li a {color: var(--primary); transition: color 500ms ease; } .main-navigation ul li a:hover { color: var(--tertiary); } .main-navigation ul ul, .main-navigation ul ul ul {display: none; } .header_widgets_block {order: 1; display:flex; flex-direction: column; flex-wrap: wrap; padding: 0 10px 10px 10px;} } @media screen and (max-width:767px) { #header-wrapper {padding-top: 70px;} #content_wrapper {padding-top: 0px;} .main-navigation { display: block; width: 100%; padding-left: 10px;padding-right: 10px;} .header-nav-block {text-align:center; order: 1; margin-top:10px; } .header_widgets_block { order: 2; display:flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-end;} .header-functional #block-6 {display:none;} .main-navigation { display: block; width: 80%; padding-left: 10px; padding-right: 10px; text-align:center; background-color:var(--primary); border-radius: 5px;} .home .site-branding { order: 2; width: 40%; margin-left:auto; margin-right:auto; padding:0; } #site-branding__logo {margin:0;} #google_translate_element { margin: 0 ;} .header_widgets_block .widget_block {flex-basis:49%;} .wp-container-1 { justify-content: flex-start !important; margin: 10px 0 0 10px;} .main-navigation ul {display: none;list-style: none;margin: 0;padding-left: 0;} .main-navigation ul ul {box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);float: left;position: absolute;top: 100%;left: -999em;z-index: 99999;} .main-navigation ul ul ul {left: -999em; top: 0;} .main-navigation ul ul li:hover>ul,.main-navigation ul ul li.focus>ul { display: block; left: auto;} .main-navigation ul ul a { width: 200px;} .main-navigation ul li:hover>ul, .main-navigation ul li.focus>ul {left: auto;} .main-navigation li { position: relative; } .main-navigation a { display: block; } button.menu-toggle { cursor: pointer; border-radius: 5px; padding: 10px 10px 10px 30px; background-image: url('images/decoration/menu.svg'); background-position: left center; background-repeat: no-repeat; background-size: 24px 24px; text-align: center; border: none; min-width:20px; margin-left:auto; margin-right:auto; background-color: var(--primary); font-weight: 300; font-family: var(--secondary-font); font-size: 1.2rem; color: white; } .menu-toggle, .main-navigation.toggled ul { display: block; text-align:center; } /*mobile menu - decorative elements */ .main-navigation a { text-decoration: none; } .main-navigation ul {margin-left: 10px; text-align:center; } .menu-art27-main-menu-container {text-align:center;} .main-navigation ul li { padding: 0 10px 5px 10px;background-color: var(--primary); margin: 0 0; border-radius: 5px;transition: background-color 500ms ease; } .main-navigation ul li:hover { background-color: var(--orange); color: var(--white); } .main-navigation ul li a { color: white; padding-left: 0; background-image: none; } .main-navigation ul li a:hover { color: var(--white);} .main-navigation ul li a:visited:hover { color: var(--white); } } @media screen and (min-width:992px){ .main-navigation {font-size:14pt;} .main-navigation ul li { margin: 10px 0 10px 20px;} .category-list.campaigns-page__list .category-list__item{padding-bottom:20px;} .category-list.campaigns-page__list .category-list__thumb {flex-basis: 20%; padding-top:25px;} .category-list.campaigns-page__list .category-list__content {flex-basis: 80%;} #logo-fest{ padding-left: 20%; padding-right: 20%;} #footer-wrapper .front-page__wrapper__left .widget-container { text-align: center;} #footer-wrapper .widget_nav_menu li {text-align:left;} #footer-wrapper .wp-block-social-links {max-width:210px;} } #footer__search .search-form input[type="search"] { color: #ffffff ; opacity:1; } #footer__search .search-form { color: #ffffff ; } #footer__search .search-form ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */ color: var(--text); opacity: 1; /* Firefox */ } #footer__search .search-form :-ms-input-placeholder { /* Internet Explorer 10-11 */ color: var(--text); } #footer__search .search-form ::-ms-input-placeholder { /* Microsoft Edge */ color: var(--text);} /*=================================================================================*/ /*=============================Artists pages only=================================*/ /*===============================================================================*/ .site-description__block {padding-bottom:10px;} p.site-description {font-family: var(--secondary-font); display:block; color: var(--text); font-weight:800; margin:0 0 20px 20px ; font-size:0.8rem; flex-basis:100%; order: 3;} h1.site-title {display:block; display:block; color: var(--primary); font-weight:800; margin: 0 ; font-size:3rem; padding:50px 0 0 0; line-height:1;} h1.site-title.translated {line-height:1.2; padding:0 ; margin-bottom:0 } .home .entry-content { padding: 0 0 50px 0;} #site-branding__title.artist {padding:180px 0 0 20px;} @media screen and (min-width:992px){ h1.site-title { font-size:2rem; } h1.site-title .site-description {font-weight:300;} } @media screen and (min-width:1200px){ h1.site-title {font-size:2.5rem; } h1.site-title .site-description {font-weight:300;} } @media screen and (min-width:1400px){ h1.site-title {font-size:3rem; } h1.site-title .site-description {font-weight:300; } } h1.site-title a {color:var(--primary); transition: color 500ms ease 1s} h1.site-title a:hover{color:var(--secondary);} h1.entry-title.alt_entry-title{display:block;} h1.site-title .site-description { font-weight:300; } li.event-link-icon {margin-bottom: 1.5rem; font-size:1.2rem;} .additional-event-info ul.event-links {margin-left:0; list-style-type: none; padding-left:0; margin-left:0;} li.event-link-icon a {padding: 5px 0 5px 36px; margin:0; background-size: 30px 30px; background-position: left center; background-repeat: no-repeat; transition: background-image 0.5s ease;} li.event-link-icon.twitter a {background-image: url(images/decoration/twitter__icon.svg); } li.event-link-icon.facebook a{background-image: url(images/decoration/facebook__icon.svg); } li.event-link-icon.instagram a{background-image: url(images/decoration/instagram__icon.svg);} li.event-link-icon.website a{background-image: url(images/decoration/website__icon.svg); } li.event-link-icon.youtube a{background-image: url(images/decoration/youtube__icon.svg); } aside#secondary { flex-basis: 100%; padding: 0 ; order: 2; margin: 0; border: 0;} .artist__logos p { width: 52%; margin: 20px 24% 0 24%; padding: 20px 0 20px 0; display: flex; flex-direction: row; flex-wrap: wrap;justify-content: center; align-items: flex-start;} .artist__logos p img { width: 240px; height: auto; padding: 10px; opacity: 0.9;} .artist__logos p img:hover { opacity: 1;} /*arabic*/ .alternative_language__block.arabic__language { line-height: 2rem; font-size:1.6rem;text-align:right;} .alternative_language__block.arabic__language p {font-size:1.6rem; line-height: 2.2rem; } .alternative_language__block.arabic__language h1 {font-size:4rem;} .alternative_language__block.arabic__language h2 {font-size:3.2rem;} .alternative_language__block.arabic__language h3{font-size:2.8rem; } .alternative_language__block.arabic__language h4{font-size:2.4rem; } .alternative_language__block.arabic__language h5{ font-size:2rem; } .alternative_language__block.arabic__language h6{ font-size:1.6rem; } .local-menu_block {margin:0; padding:0 0 0 20px;} .local-menu ul.menu {padding:0; } .local-menu ul.menu li {font-size: 1.2rem; display: block; float:left; width:auto; margin: 0 10px 10px 0; line-height:1; height: 40px;} .local-menu ul.menu li a, #header__widgets .widget_nav_menu ul.menu li a:visited {color:var(--text); } .local-menu ul.menu li a:hover{color:var(--primary);} .local-menu ul.menu li.no__link {list-style: none; font-weight:300;} .local-menu ul.menu li.no__link a, .local-menu ul.menu li.no__link a:hover, .local-menu ul.menu li.no__link a:visited {font-weight:300; cursor:default; color:var(--text); color:var(--background-fade-to-grey);} .local-menu li.no__link a, .local-menu li.no__link a:hover, .local-menuli.no__link a:visited {display: list-item; font-weight:300; cursor:default; color:var(--background-fade-to-grey);} /* Nav in the footer */ #footer-wrapper .widget_nav_menu li {font-size: 1rem; font-family: var(--secondary-font); font-weight: 800; margin: 0; padding: 0; list-style: none; } #footer-wrapper .widget_nav_menu li a {color: var(--text); transition: color 500ms ease;} #footer-wrapper .widget_nav_menu li a:hover {color: white;}