/* Theme Name: Nónius Lótenyésztő Országos Egyesület Theme URI: http://www.noniuszlo.hu/ Description: Nónius Lótenyésztő Országos Egyesület alapértelmezett sablonja Author: digitalform Author URI: http://www.digitalform.hu/ */ *{ margin: 0; padding: 0; border: 0; } *, *:after, *::before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } body { font-family: 'PT Sans', sans-serif; font-size: 16px; color: #666; background: #1d3d27; } body.rwd_menu__opened { overflow: hidden; } ul { list-style-type: none; } h1, h2, h3, h4, h5, h6 { font-weight: normal; } input, textarea { outline: none; } img.alignleft { margin: 0 20px 10px 0; float: left; } img.alignright { margin: 0 0 10px 20px; float: right; } .inner { max-width: 1000px; margin: auto; position: relative; } .left { float: left; } .right { float: right; } .clear { clear: both; } .shadow { height: 30px; background: url(images/bgr_shadow.png) no-repeat center top; } .t_a_c, .center { text-align: center; } .hide { display: none !important; } .uppercase { text-transform: uppercase; } .vertical_middle { top: 50%; position: relative; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .b_r_3 { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .b_r_50p { -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } .sec_font { font-family: 'Barlow Condensed', sans-serif; } /* Buttons */ .button { height: 50px; padding: 0 20px !important; font-size: 15px; font-weight: 700; text-transform: uppercase; text-decoration: none !important; color: white !important; line-height: 50px; background-color: #1f3d27; display: inline-block; position: relative; cursor: pointer; -webkit-transition: all 0.1s ease-out; -moz-transition: all 0.1s ease-out; -o-transition: all 0.1s ease-out; transition: all 0.1s ease-out; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .button:hover { background-color: #000; } .button.button_small { height: 40px; line-height: 40px; } /* Animation */ .anim { -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; transition: all 0.2s ease-out; } .anim_cubic { -webkit-transition: all 1s cubic-bezier(0.19, 1, 0.22, 1); -moz-transition: all 1s cubic-bezier(0.19, 1, 0.22, 1); -o-transition: all 1s cubic-bezier(0.19, 1, 0.22, 1); transition: all 1s cubic-bezier(0.19, 1, 0.22, 1); } /* ID */ #website { background-color: #efefef; } /* ------------------- NAVIGATION ------------------- */ #rwd_menu { width: 100%; left: 0; top: 100px; bottom: 0; padding: 50px; font-size: 18px; background: rgba(245 242 232 / 80%); position: fixed; z-index: 100; visibility: hidden; opacity: 0; overflow: hidden; } #rwd_menu .rwd_menu_wrap { width: 400px; height: 100%; right: -100%; top: 0; padding-bottom: 30px; background: #1e4029; position: absolute; overflow-y: auto; } /* Primary menu */ #rwd_menu ul.primary_menu { margin-bottom: 30px; border-top: 1px solid rgba(255 255 255 / 10%); list-style: none; } #rwd_menu ul.primary_menu li { border-bottom: 1px solid rgba(255 255 255 / 10%); } #rwd_menu ul.primary_menu li a { padding: 15px 10px 15px 25px; font-size: 24px; font-weight: 700; text-decoration: none; color: white; line-height: 1; display: block; position: relative; } #rwd_menu ul.primary_menu li a:hover { text-decoration: underline; text-decoration-thickness: 1px; } #rwd_menu ul.primary_menu li.menu-item-has-children > a:after { width: 20px; height: 20px; right: 20px; top: 16px; background: url(images/icon_arrow_down_white.svg) no-repeat center; background-size: auto 12px; position: absolute; content: ''; } #rwd_menu ul.primary_menu li.menu-item-has-children.open > a:after { ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg); } #rwd_menu ul.primary_menu li ul { background: white; display: none; } #rwd_menu ul.primary_menu li ul li { border-bottom-color: #eee; } #rwd_menu ul.primary_menu li ul li:last-child { border-bottom: none; } #rwd_menu ul.primary_menu li ul li a { left: auto !important; padding: 15px 0 15px 25px; font-size: 17px; color: #333 !important; line-height: 20px; opacity: 100% !important; } #rwd_menu ul.primary_menu li ul li.open > a:before { display: none; } /* Secondary menu */ #rwd_menu ul.secondary_menu { margin-bottom: 30px; list-style: none; } #rwd_menu ul.secondary_menu li { margin-bottom: 15px; padding: 0 25px; } #rwd_menu ul.secondary_menu li a { font-size: 18px; font-weight: 700; color: white; line-height: 1; display: block; } #rwd_menu ul.secondary_menu li a:hover { text-decoration: underline; text-decoration-thickness: 1px; } /* LI animation */ #rwd_menu ul li a { left: 10px; position: relative; opacity: 0%; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; transition: all 0.2s ease-out; } #rwd_menu ul > li.fly-in-out > a { left: 0; opacity: 100%; } /* Button */ #rwd_menu .button_wrapper { padding: 0 25px; position: relative; z-index: 0; opacity: 0; } #rwd_menu .button { width: auto !important; padding: 0 !important; text-align: center; background: #2e2e2e; display: block; } #rwd_menu .button:before { background: #2e2e2e; } body.rwd_menu__opened #rwd_menu { opacity: 1; visibility: visible; } body.rwd_menu__opened #rwd_menu .rwd_menu_wrap { right: 0; } body.rwd_menu__opened #rwd_menu .button_wrapper { opacity: 1; } /* --------------- HEADER --------------- */ #header { height: 100px; background-color: #1e4029; background-image: url(images/bgr_header.webp); background-image: -webkit-image-set(url(images/bgr_header.webp) 1x); background-image: image-set(url(images/bgr_header.png) 1x); background-position: center bottom; background-repeat: repeat-x; z-index: 101; } #header .inner { height: 100%; } /* Logo */ #header .logo { left: 0; display: inline-block; position: absolute; } #header .logo img { width: auto; height: 60px; display: block; } /* Search and social media */ #header .search__social_media { right: 0; display: flex; flex-wrap: wrap; position: absolute; } #header .search__social_media form.search { width: 300px; height: 50px; padding: 2px; background: rgba(255 255 255 / 20%); display: flex; justify-content: space-between; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; overflow: hidden; } #header .search__social_media form.search.active { background: white; } #header .search__social_media form.search input[type=text] { width: calc(100% - 44px); height: 100%; padding-left: 10px; font-size: 15px; background: transparent; } #header .search__social_media form.search input[type=text]:focus { background: white; } #header .search__social_media form.search input[type=submit] { width: 46px; height: 46px; background: #222 url(images/icon_search_white.svg) no-repeat center; background-size: auto 20px; cursor: pointer; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 5px; } #header .search__social_media form.search ::placeholder { color: white; opacity: 50%; } #header .search__social_media form.search :-ms-input-placeholder { color: white; opacity: 50%; } #header .search__social_media form.search ::-ms-input-placeholder { color: white; opacity: 50%; } #header .search__social_media form.search.active ::placeholder { color: #000; } #header .search__social_media form.search.active :-ms-input-placeholder { color: #000; } #header .search__social_media form.search.active ::-ms-input-placeholder { color: #000; } #header .search__social_media .social_media { width: 50px; height: 50px; margin-left: 10px; background-color: white; background-repeat: no-repeat; background-position: center; background-size: auto 20px; display: block; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } #header .search__social_media .social_media:first-of-type { margin-left: 10px; } #header .search__social_media .social_media:hover { opacity: 90%; } #header .search__social_media .social_media.facebook { background-color: #3b5998; background-image: url(images/icon_facebook_white.svg); } #header section #search #searchbox { margin-right: 3px; float: left; display: inline-block; } #header section #search #searchbox input[type=text] { width: 190px; height: 32px; padding: 0 5px; color: #86978c; line-height: 32px; background: #163520; border-left: 1px solid #152f1d; border-top: 1px solid #152f1d; border-right: 1px solid #36533e; border-bottom: 1px solid #36533e; } #header section #search #searchbox input[type=text]:focus { color: #333; background: white; } #header section #search a#icon_search { margin-top: 6px; float: right; } /* Social */ #header section #social { height: 99px; padding-right: 50px; background: url(images/bgr_social.png) no-repeat right center; } #header section #social ul { padding-top: 32px; } #header section #social ul li { margin-left: 7px; float: left; list-style-type: none; } #header section #social ul li a { width: 32px; height: 32px; background: url(images/icon_social.png) no-repeat left top; display: inline-block; } #header section #social ul li a#facebook { background-position: 0 0; } #header section #social ul li a#youtube { background-position: 0 -32px; } /* RWD button */ #header .rwd_button { width: 70px; height: 50px; right: 20px; background: white; position: absolute; cursor: pointer; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } #header .rwd_button .burg { width: 30px; height: 2px; left: 20px; top: 50%; background: #1e4029; display: block; position: absolute; -moz-transition: 0.2s; -o-transition: 0.2s; -webkit-transition: 0.2s; transition: 0.2s; } #header .rwd_button .burg:before, #header .rwd_button .burg:after { width: 30px; height: 2px; background: #1e4029; position: absolute; content: ''; -moz-transition: 0.2s; -o-transition: 0.2s; -webkit-transition: 0.2s; transition: 0.2s; } #header .rwd_button .burg:before { top: -8px; left: 0; } #header .rwd_button .burg:after { top: 8px; right: 0; } body.rwd_menu__opened #header .rwd_button .burg { background: transparent; } body.rwd_menu__opened #header .rwd_button .burg:before { top: 0; -webkit-transform: rotate(45deg); } body.rwd_menu__opened #header .rwd_button .burg:after { top: 0; -webkit-transform: rotate(-45deg); } /* ------------ MENU ------------ */ #menu { width: 100%; height: 60px; background-image: url(images/bgr_menu.webp); background-image: -webkit-image-set(url(images/bgr_menu.webp) 1x); background-image: image-set(url(images/bgr_menu.png) 1x); background-position: center top; background-repeat: repeat-x; border-bottom: 1px solid #989898; position: relative; z-index: 100; -moz-box-shadow: 0 2px 5px rgba(0,0,0,0.2); -webkit-box-shadow: 0 2px 5px rgba(0,0,0,0.2); box-shadow: 0 2px 5px rgba(0,0,0,0.2); } #menu ul { display: flex; flex-wrap: wrap; justify-content: space-between; } #menu ul li { position: relative; list-style-type: none; } #menu ul li:last-child { background: none; } #menu ul li a { padding: 0 10px; font-size: 19px; font-weight: 500; color: #444; text-decoration: none; text-transform: uppercase; line-height: 60px; display: block; } #menu ul li.menu-item-has-children a { padding-right: 25px; background: url(images/icon_arrow_down.svg) no-repeat calc(100% - 10px) center; background-size: 8px auto; } #menu ul li ul { width: max-content; min-width: 150px; top: 100%; background: #1f442a; display: block; z-index: 1000; visibility: hidden; opacity: 0; position: absolute; } #menu ul li ul li { margin: 0; border-bottom: 1px dotted rgba(255,255,255,0.2); background: none; float: none !important; } #menu ul li ul li a { height: auto; padding: 10px !important; font-family: inherit; font-size: 18px; font-weight: 400; color: #c3cdc6 !important; text-transform: none; text-decoration: none; background-image: none !important; line-height: 20px; } #menu ul li ul li a:hover { color: white !important; } #menu ul li ul li:last-child { border: none !important; } #menu ul li.menu-item-has-children:hover { background: #1f442a; } #menu ul li.menu-item-has-children:hover a { color: white; background-image: url(images/icon_arrow_down_white.svg); } #menu ul li.menu-item-has-children:hover ul { visibility: visible; opacity: 100%; } /* Fixed header */ body.fixed_header #menu { left: 0; top: 0; position: fixed; } /* -------------- SLIDER -------------- */ #slider { margin-bottom: 50px; background-image: url(images/bgr_shadow_big.webp); background-image: -webkit-image-set(url(images/bgr_shadow_big.webp) 1x); background-image: image-set(url(images/bgr_shadow_big.png) 1x); background-position: center top; background-repeat: no-repeat; position: relative; } #slider .slides { padding: 10px; background: white; -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.2); -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.2); box-shadow: 0 1px 3px rgba(0,0,0,0.2); } #slider .slides .item img { width: 100%; height: auto; display: block; } #slider ul.slick-dots { width: 100%; left: 0; bottom: -28px; background-image: url(images/bgr_slider_dots.webp); background-image: -webkit-image-set(url(images/bgr_slider_dots.webp) 1x); background-image: image-set(url(images/bgr_slider_dots.png) 1x); background-position: center top; background-repeat: no-repeat; display: flex; justify-content: center; position: absolute; } #slider ul.slick-dots li button { width: 30px; height: 28px; padding: 0 !important; text-indent: -9999px; background: url(images/bgr_controlnav.png) no-repeat center top; display: block; position: relative; cursor: pointer; } #slider ul.slick-dots li.slick-active button { width: 40px; background-image: url(images/bgr_controlnav_active.png); } /* ------------ NEWS ------------ */ #news { position: relative; } #news .news_wrap { padding: 20px; background: #f0eada; display: flex; flex-wrap: wrap; position: relative; -webkit-box-shadow: 0 8px 6px -6px rgba(0 0 0 / 50%); -moz-box-shadow: 0 8px 6px -6px rgba(0 0 0 / 50%); box-shadow: 0 8px 6px -6px rgba(0 0 0 / 50%); } #news .news_wrap:before { width: 100%; height: 60px; left: 0; top: 0; background: #1f432a; position: absolute; content: ''; } #news .news_wrap .title { font-size: 22px; font-weight: 500; color: #000; line-height: 100%; } #news .news_wrap .wrap_left { width: calc(100% - 350px); padding: 30px; background: white; position: relative; } #news .news_wrap .wrap_left ul { margin-bottom: 20px; } #news .news_wrap .wrap_left ul li { padding: 20px 0; border-bottom: 1px solid #dcd3b4; display: flex; flex-wrap: wrap; justify-content: space-between; list-style-type: none; } #news .news_wrap .wrap_left ul li .thumbnail { width: 80px; } #news .news_wrap .wrap_left ul li .thumbnail img { width: 100%; height: auto; padding: 5px; background: white; -moz-box-shadow: 0 1px 2px rgba(0 0 0 /20%); -webkit-box-shadow: 0 1px 2px rgba(0 0 0 /20%); box-shadow: 0 1px 2px rgba(0 0 0 /20%); display: block; } #news .news_wrap .wrap_left ul li .entry { width: calc(100% - 110px); display: flex; flex-direction: column; justify-content: center; } #news .news_wrap .wrap_left ul li .entry h3 { margin-bottom: 5px; } #news .news_wrap .wrap_left ul li .entry h3 a { font-size: 17px; font-weight: 700; text-decoration: none; color: #000; line-height: 20px; display: inline-block; } #news .news_wrap .wrap_left ul li .entry h3 a:hover { text-decoration: underline; } #news .news_wrap .wrap_left ul li .entry .datetime { font-size: 14px; color: #999; line-height: 16px; } #news .news_wrap .wrap_right { width: 350px; padding: 0 20px; position: relative; } #news .news_wrap .wrap_right .title { margin-bottom: 20px; color: white; } #news .news_wrap .wrap_right ul { margin-bottom: 20px; } #news .news_wrap .wrap_right ul li { padding: 15px 20px 15px 0; border-bottom: 1px solid white; } #news .news_wrap .wrap_right ul li h3 { margin-bottom: 5px; } #news .news_wrap .wrap_right ul li h3 a { font-size: 16px; font-weight: 700; color: #693724; display: inline-block; } #news .news_wrap .wrap_right ul li h3 a:hover { color: #000; } #news .news_wrap .wrap_right ul li .datetime { font-size: 14px; color: #8f7839; line-height: 16px; } /* ------------------ CONTAINER ------------------ */ #container { padding-top: 20px; padding-bottom: 50px; background-color: #f5f2e8; background-image: url(images/bgr_container_dot.png), url(images/bgr_container_stock.jpg); background-position: left top, center top; background-repeat: repeat, no-repeat; } body.fixed_header #container { padding-top: 80px; } #main { line-height: 25px; background: white; display: flex; flex-wrap: wrap; -webkit-box-shadow: 0 8px 6px -6px rgba(0 0 0 / 50%); -moz-box-shadow: 0 8px 6px -6px rgba(0 0 0 / 50%); box-shadow: 0 8px 6px -6px rgba(0 0 0 / 50%); } /* Content */ #content { width: calc(100% - 300px); padding: 30px; } #content.fullwidth { width: 100%; } #content h1 { margin-bottom: 30px; font-size: 40px; font-weight: 500; color: #000; line-height: 100%; } #content h1.subtitle { margin-bottom: 30px; padding-bottom: 30px; font-size: 30px; font-weight: normal; color: #333; border-bottom: 1px solid #ccc; } #content h1.subtitle:first-child { margin-top: 0 !important; } #content h2 { margin-bottom: 20px; padding-bottom: 10px; font-size: 20px; background-repeat: no-repeat; background-position: 0 5px; border-bottom: 2px solid #dcd3b4; } #content h3 { margin-bottom: 10px; font-size: 25px; font-weight: 700; color: #1f3d27; } #content.page-79 h2 { padding-left: 25px; background-image: url(images/icon_gallery.png); } #content p { margin-bottom: 20px; } #content a { font-weight: 700; color: #666; text-decoration: underline; } #content a:hover { color: #000; } #content strong { color: #000; } #content ul { margin-left: 20px; margin-bottom: 20px; list-style-type: disc; } #content ol { margin-left: 20px; margin-bottom: 20px; list-style-type: decimal; } #content ul.archive { margin-left: 0 !important; margin-bottom: 20px; list-style: none; } #content ul.archive li { padding: 20px 0; border-bottom: 1px solid #dcd3b4; display: flex; flex-wrap: wrap; justify-content: space-between; list-style-type: none; } #content ul.archive li .thumbnail { width: 80px; } #content ul.archive li .thumbnail img { width: 100%; height: auto; padding: 5px; background: white; -moz-box-shadow: 0 1px 2px rgba(0 0 0 /20%); -webkit-box-shadow: 0 1px 2px rgba(0 0 0 /20%); box-shadow: 0 1px 2px rgba(0 0 0 /20%); display: block; } #content ul.archive li .entry { width: calc(100% - 110px); display: flex; flex-direction: column; justify-content: center; } #content ul.archive li .entry h3 { margin-bottom: 5px; } #content ul.archive li .entry h3 a { font-size: 17px; font-weight: 700; text-decoration: none; color: #000; line-height: 20px; display: inline-block; } #content ul.archive li .entry h3 a:hover { text-decoration: underline; } #content ul.archive li .entry .datetime { font-size: 14px; color: #999; line-height: 16px; } /* Table */ #content table { width: 100%; margin-bottom: 30px; border-spacing: 0; } #content table.custom_1 { min-width: 700px; } #content table.custom_1 thead th { padding: 10px; font-size: 14px; color: white; line-height: 16px; background: #1f3d27; } #content table.custom_1 tbody td { padding: 10px; font-size: 14px; line-height: 16px; border: 1px solid #ddd; } #content .table_wrap { margin-bottom: 30px; overflow-y: auto; } #content .table_wrap table.table.custom_1 { margin-bottom: 0; } #content #meta { margin-bottom: 20px; margin-top: -20px; font-size: 10px; color: #999; text-transform: uppercase; } /* Facebook gallery */ #content .fb_gallery_wrap { margin-left: -10px; margin-right: -10px; display: flex; flex-wrap: wrap; } #content .fb_gallery_wrap .item { width: calc(33.3333333333% - 20px); margin: 50px 10px 0; } #content .fb_gallery_wrap .item:nth-child(-n+3) { margin-top: 0; } #content .fb_gallery_wrap .item .header { margin-bottom: 20px; padding-bottom: 10px; padding-left: 40px; font-size: 16px; font-weight: 700; line-height: 30px; border-bottom: 2px solid #dcd3b4; position: relative; } #content .fb_gallery_wrap .item .header:before { width: 30px; height: 30px; left: 0; top: 0; background: #3b5998 url(images/icon_facebook_white.svg) no-repeat center; background-size: auto 17px; position: absolute; content: ''; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } #content .fb_gallery_wrap .item .thumbnail { display: block; overflow: hidden; } #content .fb_gallery_wrap .item .thumbnail img { width: 100%; height: auto; display: block; position: relative; transform: scale(1) translateZ(0); transition: all 1s cubic-bezier(0.19, 1, 0.22, 1); } #content .fb_gallery_wrap .item .thumbnail:hover img { -ms-transform: scale(1.05) translateZ(0); -webkit-transform: scale(1.05) translateZ(0); transform: scale(1.05) translateZ(0); } #content .fb_gallery_wrap .item .entry { padding-top: 20px; } #content .fb_gallery_wrap .item .entry a { font-size: 18px; font-weight: 700; text-decoration: none !important; color: #000; line-height: 20px !important; display: inline-block; } #content .fb_gallery_wrap .item .entry a:hover { text-decoration: underline !important; } #content .fb_gallery_wrap .item .entry small { font-size: 14px; color: #8f7839; line-height: 16px; } /* Search stallion */ #content .main_search_stallion { margin-bottom: 20px; padding: 20px; background: #fcfbf8; border: 1px solid #dcd3b4; display: flex; flex-wrap: wrap; -moz-box-shadow: 0 2px 5px rgba(0 0 0 / 10%); -webkit-box-shadow: 0 2px 5px rgba(0 0 0 / 10%); box-shadow: 0 2px 5px rgba(0 0 0 / 10%); } #content .main_search_stallion h3 { width: 100%; font-weight: 500; color: #000; } #content .main_search_stallion input[type=text] { width: calc(100% - 50px); height: 50px; padding-left: 10px; font-size: 16px; background: white; border: 1px solid #dcd3b4; } #content .main_search_stallion input[type=submit] { width: 50px; height: 50px; background: #1e4029 url(images/icon_search_white.svg) no-repeat center; background-size: auto 18px; cursor: pointer; } #content .main_search_stallion input[type=submit]:hover { background-color: #000; } /* ------------------ PAGINATION ------------------ */ .pagination { height: 70px; margin-left: -30px; margin-right: -30px; margin-bottom: -30px; padding: 0 30px; background: #e7dec7; display: flex; justify-content: space-between; align-items: center; } .pagination .prev, .pagination .next { width: 50px; height: 50px; font-size: 25px; text-align: center; text-decoration: none !important; color: white !important; line-height: 46px; display: block; position: relative; z-index: 0; } .pagination .prev:before, .pagination .next:before { width: 40px; height: 40px; left: 5px; top: 5px; background: #1e4029; position: absolute; content: ''; z-index: -1; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; transition: all 0.2s ease-out; } .pagination .prev:hover:before, .pagination .next:hover:before { width: 50px; height: 50px; left: 0; top: 0; } .pagination .prev.inactive:before, .pagination .next.inactive:before { background: rgba(0 0 0 / 20%); } .pagination .prev.inactive:hover:before, .pagination .next.inactive:hover:before { width: 40px; height: 40px; left: 5px; top: 5px; } .pagination .links { display: flex; align-items: center; } .pagination .links a { width: 50px; height: 50px; text-align: center; text-decoration: none !important; color: #1e4029; line-height: 50px; position: relative; z-index: 0; } .pagination .links a:before { width: 0; height: 0; left: 25px; top: 25px; background: white; position: absolute; content: ''; z-index: -1; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; transition: all 0.2s ease-out; } .pagination .links a:hover:before { width: 40px; height: 40px; left: 5px; top: 5px; background: white; } .pagination .links span { width: 50px; height: 50px; font-weight: 700; text-align: center; color: #1e4029; line-height: 50px; position: relative; z-index: 0; } .pagination .links span:before { width: 50px; height: 50px; left: 0; top: 0; background: white; position: absolute; content: ''; z-index: -1; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } /* ----------------- SIDEBAR ----------------- */ #sidebar { width: 300px; padding: 20px; background: #fcfbf8; border-left: 1px solid #dcd3b4; } #sidebar .widget { margin-bottom: 20px;} #sidebar .widget-title, #sidebar .widget_title { margin-bottom: 10px; font-size: 18px; font-weight: 700; color: #000; line-height: 20px; } /* News */ #sidebar .widget.latest_news ul li { padding: 10px; border-bottom: 1px solid #dcd3b4; display: flex; flex-wrap: wrap; list-style-type: none; } #sidebar .widget.latest_news ul li .thumbnail { width: 60px; } #sidebar .widget.latest_news ul li .thumbnail img { width: 54px; height: auto; padding: 3px; background: white; -moz-box-shadow: 0 1px 2px rgba(0 0 0 /20%); -webkit-box-shadow: 0 1px 2px rgba(0 0 0 /20%); box-shadow: 0 1px 2px rgba(0 0 0 /20%); display: block; } #sidebar .widget.latest_news ul li .entry { width: calc(100% - 60px); padding-left: 10px; } #sidebar .widget.latest_news ul li .entry h3 a { font-size: 15px; font-weight: 700; text-decoration: none; color: #000; line-height: 20px; display: inline-block; } #sidebar .widget.latest_news ul li .entry h3 a:hover { text-decoration: underline; } #sidebar .widget.latest_news ul li .entry .datetime { font-size: 12px; color: #a89048; } /* Search stallion */ #sidebar form.search_stallion { margin-bottom: 20px; display: flex; flex-wrap: wrap; } #sidebar form.search_stallion input[type=text] { width: calc(100% - 40px); height: 40px; padding-left: 10px; background: white; border: 1px solid #dcd3b4; } #sidebar form.search_stallion input[type=submit] { width: 40px; height: 40px; background: #1e4029 url(images/icon_search_white.svg) no-repeat center; background-size: auto 18px; cursor: pointer; } #sidebar form.search_stallion input[type=submit]:hover { background-color: #000; } /* Stallion */ #sidebar ul.stallion li { padding: 10px 0; border-bottom: 1px solid #dcd3b4; list-style-type: none; } #sidebar ul.stallion li:first-child { border-top: 1px solid #dcd3b4; } #sidebar ul.stallion li a { font-size: 14px; color: #000; line-height: 20px; } #sidebar ul.stallion li a:hover { text-decoration: underline; } /* ----------------- STALLIONS ----------------- */ .stallion { margin-bottom: 10px; padding-bottom: 20px; border-bottom: 1px dotted #ccc; display: flex; flex-wrap: wrap; position: relative; } .stallion h4 { width: 100%; margin-bottom: 10px; padding: 5px 10px; font-size: 15px; font-weight: bold; color: #000; } .stallion h4.red, .stallion h4.yellow, .stallion h4.green, .stallion h4.torteneti { color: white !important; } .stallion h4.red { background: #9b171a; } .stallion h4.blue { color: white; background: #002467; } .stallion h4.lightblue { color: white; background: #2B94F7; } .stallion h4.yellow { background: #bf851e; } .stallion h4.green { background: #207c33; } .stallion h4.torteneti { background: #938f0f; } .stallion h4.korlatozott { background: #002467; } .stallion .thumbnail { width: 200px; } .stallion .thumbnail img { width: 170px; height: auto; display: block; } .stallion .datas { width: calc(100% - 200px); } .stallion .datas table td { padding: 5px 0; font-size: 14px; line-height: 16px; border-bottom: 1px dotted #dcd3b4; } .stallion .datas table td:first-child { font-weight: bold; } #categories { margin-bottom: 20px; } #categories div { margin-bottom: 10px; padding: 8px 10px; font-size: 15px; font-weight: 700; color: white; text-align: center; line-height: 20px; } #categories div:last-child { margin-bottom: 0; } #categories div.kiemelten_ajanlott { background: #9b171a; } #categories div.ajanlott { background: #bf851e; } #categories div.engedelyezett { background: #207c33; } #categories div.fedeztetesre_korlatozott { background: #002467; } #categories div.harom_evre_korlatozott_menek { background: #2B94F7; } /* ---------------- STALLION ---------------- */ .stallion_data h1 { padding-left: 50px; position: relative; } .stallion_data h1:before { width: 40px; height: 40px; left: 0; top: -5px; position: absolute; content: ''; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } .stallion_data h1.red:before { background: #9b171a; } .stallion_data h1.yellow:before { background: #bf851e; } .stallion_data h1.green:before { background: #207c33; } .stallion_data h1.torteneti:before { background: #938f0f; } .stallion_data h1.korlatozott:before { background: #002467; } .stallion_data h1.lightblue:before { background: #2B94F7; } .stallion_data .overview { border-bottom: 3px solid #1d3d27; } .stallion_data .overview a.main_image { margin-bottom: 30px; display: block; } .stallion_data .overview a.main_image img { width: 100%; height: auto; display: block; } .stallion_data h3 { border-bottom: 3px solid #1d3d27; } .stallion_data h3 span { height: 40px; padding: 0 20px; font-weight: bold; font-size: 15px; color: white; line-height: 40px; background: #1d3d27; display: inline-block; } .stallion_data #thumbnail { margin: 20px auto; display: inline-block; } .stallion_data table { margin-bottom: 30px; } .stallion_data table td { padding: 10px; font-size: 14px; line-height: 16px; border-bottom: 1px solid #dcd3b4; } .stallion_data table td:first-child { width: 150px; font-weight: bold; } .stallion_data table tr:nth-child(even) { background: #fcfbf8; } .stallion_data table tr:nth-child(odd) { background: transparent; } #pedigree { overflow-y: auto; } #pedigree .pedigree_wrap { min-width: 700px; } #pedigree .rows_wrap { height: 240px; font-size: 13px; line-height: 14px; border-bottom: 1px solid #dcd3b4; display: flex; flex-wrap: wrap; } #pedigree .rows_wrap .row { width: 25%; height: 100%; display: flex; flex-wrap: wrap; align-items: center; } #pedigree .rows_wrap .row div { width: 100%; display: flex; flex-wrap: wrap; align-items: center; border-bottom: 1px solid #dcd3b4; } #pedigree .rows_wrap .row div:last-child { border-bottom: none; } #pedigree .rows_wrap .row.row_2 div { height: 50%; } #pedigree .rows_wrap .row.row_3 div { height: 25%; } #pedigree .rows_wrap .row.row_4 div { height: 12.5%; } #pedigree .row .row_1 { height: 240px; line-height: 15px; } #pedigree .row .row_1 span { padding-top: 110px; display: inline-block; } #pedigree .row .row_2 { height: 120px; line-height: 120px; } #pedigree .row .row_3 { height: 60px; line-height: 60px; } #pedigree .row .row_4 { height: 30px; line-height: 30px; } /* --------------- FOOTER --------------- */ #footer { font-size: 17px; color: #c3cdc6; background-image: url(images/bgr_footer.webp); background-image: -webkit-image-set(url(images/bgr_footer.webp) 1x); background-image: image-set(url(images/bgr_footer.png) 1x); background-repeat: repeat-x; background-position: center top; } #footer a { text-decoration: none; color: white; } #footer a:hover { text-decoration: underline; } #footer ul { width: 100%; display: flex; flex-wrap: wrap; justify-content: center; } #footer ul.menu { margin-top: 30px; } #footer ul li { margin: 0 10px; } #footer ul li a { font-size: 15px; font-weight: 700; } /* Footer top */ #footer .footer_top { padding: 30px 0; text-align: center; } #footer .footer_top .footer_top_wrap { display: flex; flex-wrap: wrap; justify-content: center; } #footer .footer_top a.logo img { width: auto; height: 100px; display: block; } #footer .footer_top .footer_text { width: 100%; margin-top: 30px; } #footer .footer_top .footer_text p { margin-bottom: 10px; } #footer .footer_top .footer_text p:last-child { margin-bottom: 0; } #footer .footer_top .footer_text p strong { color: white; } /* Footer bottom */ #footer .footer_bottom { padding: 20px; font-size: 16px; background: rgba(0 0 0 / 10%); } /* ----------- RWD ----------- */ @media only screen and (max-width: 1000px) { /* DEFAULT */ .p_l_20 { padding-left: 20px; } .p_r_20 { padding-right: 20px; } /* HEADER: Logo */ #header .logo { left: 20px; } /* HEADER: Search and social media */ #header .search__social_media { right: 20px; } /* MENU */ #menu ul li a { font-size: 18px; } /* SLIDER */ #slider { background-image: none; } } @media only screen and (max-width: 960px) { /* DISPLAY: None */ .hide_in_960 { display: none !important; } /* DISPLAY: block */ .show_in_960 { display: block !important; } /* HEADER: Search and social media */ #header .search__social_media { right: 100px; } /* NEWS */ #news .news_wrap .wrap_left { width: calc(100% - 300px); padding: 20px; } #news .news_wrap .wrap_right { width: 300px; } /* CONTAINER: Content */ #content { width: 100%; padding: 20px; } #content h1 { margin-bottom: 20px; font-size: 30px; } /* PAGINATION */ .pagination { padding: 0 10px; } } @media only screen and (max-width: 768px) { /* NEWS */ #news .news_wrap .wrap_left { width: 100%; } #news .news_wrap .wrap_right { width: 100%; padding: 20px 0; } #news .news_wrap .wrap_right .title { color: #000; } } @media only screen and (max-width: 640px) { /* CONTENT: Facebook gallery */ #content .fb_gallery_wrap .item { width: calc(50% - 20px); } #content .fb_gallery_wrap .item:nth-child(3) { margin-top: 50px; } /* STALLIONS */ .stallion .thumbnail { width: 100%; margin-bottom: 20px; } .stallion .thumbnail img { width: 100%; } .stallion .datas { width: 100%; } /* FOOTER */ #footer ul { display: block; } #footer ul li { margin: 10px 0; } } @media only screen and (max-width: 480px) { /* DISPLAY: None */ .hide_in_480 { display: none !important; } /* DISPLAY: Block */ .show_in_480 { display: block !important; } /* DEFAULT */ .button { width: 100%; height: auto; padding: 15px 10px !important; text-align: center; line-height: 20px; display: block; } .button.button_small { padding: 10px !important; line-height: 20px; } /* NAVIGATION */ #rwd_menu .rwd_menu_wrap { width: calc(100% - 20px); } /* NAVIGATION: Primary menu */ #rwd_menu ul.primary_menu li a { font-size: 22px; } /* HEADER: Logo */ #header .logo img { height: 50px; } /* NEWS */ #news .news_wrap .wrap_left ul li .entry { width: calc(100% - 100px); } #news .news_wrap .wrap_left ul li .entry h3 a { font-size: 16px; } /* CONTENT */ #content ul.archive li .entry { width: calc(100% - 100px); } #content ul.archive li .entry h3 a { font-size: 16px; } /* CONTENT: Facebook gallery */ #content .fb_gallery_wrap .item .header { font-size: 14px; } } @media only screen and (max-width: 375px) { /* DISPLAY: None */ .hide_in_375 { display: none !important; } /* CONTENT: Facebook gallery */ #content .fb_gallery_wrap .item .entry a { font-size: 16px; } } @media only screen and (max-width: 320px) { }