@import url('https://fonts.googleapis.com/css?family=Lora|Playfair+Display:400,700&subset=latin-ext');
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css');
@import url('https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css');
/*--------------------------------------------------------------
Default
--------------------------------------------------------------*/
*{
box-sizing: border-box;
}
html {
overflow-y: scroll;
overflow-x: auto;
-ms-overflow-style: scrollbar;
}
body {
background-color: #fff;
background-repeat: repeat-x;
font: 400 14px/1.8 "Lora", serif;
color: #666;
-webkit-font-smoothing: antialiased;
}
p{
color: #666 !important;
line-height: 24px !important;
font-size: 14px !important;
text-align: justify;
padding: 10px 0;
}
img {
max-width: 100%;
}
blockquote {
border-left: 7px solid #FF0099 !important;
background-color: #fff;
border: 1px solid #f8f8f8;
padding: 10px;
font-size: 16px !important;
font-style: italic;
}
ul{
list-style: none;
}
ul li{
line-height: 28px;
}
/* Szivecske ikon a listknl */
ul li::before{
content: '\f08a';
font-family: FontAwesome;
padding-right: 10px;
}
a{
color: #FF0099;
transition: all .3s ease-in-out;
}
a:hover{
color: #000;
text-decoration: none;
}
strong, b{
color: #FF0099;
}
.txtbold,
.txtnormal,
.txtmini{
font-weight: normal !important;
font-size: 12px !important;
}
div[style="border: solid; padding: 4px; width: 360px"]{
width: 100% !important;
padding: 10px !important;
}
input[style="background-color: red; font-weight: bold"]{
color: #fff !important;
}
/* Captcha image fix */
#chkimg{
max-width: none !important;
}
.btn-primary,
input[type="submit" i]{
background-color: #ff0099;
color: #fff !important;
transition: all .4s ease-in-out;
font-family: 'Playfair Display', serif;
border: 1px solid transparent;
}
input[type="radio"],
input[type="checkbox"]{
vertical-align: middle;
}
.btn-primary:hover{
background-color: #fff;
color: #ff0099;
border: 1px solid #ff0099;
}
input,
input.form-control,
select{
width: auto;
display: inline-block;
border-radius: 0!important;
border: 1px solid #eee!important;
color: #aaa;
margin: 5px 0!important;
padding: 5px 10px!important;
-webkit-box-shadow: inset 0 0 0px rgba(0,0,0,.0)!important;
box-shadow: inset 0 0px 0px rgba(0,0,0,.0)!important;
}
.form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control {
background-color: #fff;
opacity: 1;
}
input:focus{
border: 1px solid #ff0099;
}
table.table tr:hover{
background-color: #f8f8f8;
}
td.light{
padding: 10px !important;
border-top: 0 !important;
border-bottom: 1px solid #eee;
}
::selection{
background-color: #ff0099;
color: #fff;
}
.fa{
padding: 0 5px;
transition: all .3s ease-in-out;
}
.fa:hover{
color: #ff0099;
}
form[name="mainmoduleform"] td[class^="list"],
form[name="leftmoduleform"] td[class^="list"],
form[name="rightmoduleform"] td[class^="list"]{
padding: 0 5px;
width: auto !important;
font-size: 12px;
}
form[name="mainmoduleform"] td[class^="list"] input,
form[name="mainmoduleform"] td[class^="list"] select,
form[name="leftmoduleform"] td[class^="list"] input,
form[name="leftmoduleform"] td[class^="list"] select,
form[name="rightmoduleform"] td[class^="list"] input,
form[name="rightmoduleform"] td[class^="list"] select
{
max-width: 150px;
overflow: hidden;
font-size: 12px;
}
/*--------------------------------------------------------------
Site
--------------------------------------------------------------*/
.site{
width: 1180px !important;
margin: auto;
}
.main-content{
width: 70% !important;
}
/*--------------------------------------------------------------
Header
--------------------------------------------------------------*/
div.header{
text-align: center;
}
/*--------------------------------------------------------------
Oldalad cme
--------------------------------------------------------------*/
div.header h1{
font-family: 'Playfair Display', serif;
text-transform: uppercase;
font-weight: 700;
color: #ff0099;
display: inline-block;
padding: 20px 35px;
position: relative;
margin: 30px auto;
}
/*--------------------------------------------------------------
Oldal cme feletti kp
--------------------------------------------------------------*/
div.header h1::before{
position: absolute;
content: url('http://nikkiiworld.hu/demo/theme/felso.png');
width: 100%;
top: -25px;
left: 0px;
opacity: .10;
}
/*--------------------------------------------------------------
Oldal cme alatti kp
--------------------------------------------------------------*/
div.header h1::after{
position: absolute;
content: url('http://nikkiiworld.hu/demo/theme/also.png');
width: 100%;
bottom: -25px;
left: 0px;
opacity: .10;
}
/*--------------------------------------------------------------
Oldal lersa
--------------------------------------------------------------*/
div.header h3{
font-family: 'Lora', serif;
font-weight: 400 !important;
font-size: 16px;
line-height: 24px;
font-style: italic;
padding: 20px 20px;
position: relative;
display: inline-block;
margin: 30px auto;
}
/*--------------------------------------------------------------
Oldal lersa mellett balra a sarok
--------------------------------------------------------------*/
div.header h3::before{
position: absolute;
top: -10px;
left: -10px;
width: 20px;
height: 20px;
border-left: 1px solid #000;
border-top: 1px solid #000;
content: '';
}
/*--------------------------------------------------------------
Oldal lersa mellett jobbra a sarok
--------------------------------------------------------------*/
div.header h3::after{
position: absolute;
bottom: -10px;
right: -10px;
width: 20px;
height: 20px;
border-right: 1px solid #ff0099;
border-bottom: 1px solid #ff0099;
content: '';
}
/*--------------------------------------------------------------
Men elem
--------------------------------------------------------------*/
div.header .menu li{
display: inline-block;
padding: 5px 15px;
margin: 10px 15px;
}
/*--------------------------------------------------------------
Szivecske elrejtse a men elemek ell
--------------------------------------------------------------*/
div.header .menu li::before{
content: '' !important;
display: none;
}
/*--------------------------------------------------------------
Men link
--------------------------------------------------------------*/
div.header .menu li a{
position: relative;
}
/*--------------------------------------------------------------
Rzsaszn ngyzet a link utn
--------------------------------------------------------------*/
div.header .menu li a::after{
content: '';
width: 10px;
height: 10px;
position: absolute;
bottom: 15px;
right: -15px;
background: #ff0099;
z-index: -1;
}
/*--------------------------------------------------------------
Szrke ngyzet a link eltt
--------------------------------------------------------------*/
div.header .menu li a::before{
content: '';
width: 10px;
height: 10px;
position: absolute;
bottom: 0px;
left: -15px;
background: #eee;
z-index: -1;
}
/*--------------------------------------------------------------
Sidebar
--------------------------------------------------------------*/
.sidebar,
.left-sidebar,
.right-sidebar {
width: 30% !important;
}
.sidebar .column_side{
width: 100% !important;
}
.sidebar .column_side_td .module{
border: 1px solid #eee;
margin: 15px 0;
}
.sidebar .column_side_td .module > tbody > tr:first-of-type{
text-align: center;
}
/* Oldalmodul cme */
.sidebar .column_side_td .module .top_middle{
font-family: 'Playfair Display', serif;
font-size: 18px !important;
font-weight: 700;
text-align: center;
color: #000000;
padding-top: 15px;
position: relative;
display: inline-block;
z-index: 200;
}
/* Oldalmodul cme melleti rzsaszn ngyzet */
.sidebar .column_side_td .module .top_middle::after{
content: '';
width: 10px;
height: 10px;
position: absolute;
bottom: 15px;
right: -15px;
background: #ff0099;
z-index: -1;
}
/* Oldalmodul cme melleti szrke ngyzet */
.sidebar .column_side_td .module .top_middle::before{
content: '';
width: 10px;
height: 10px;
position: absolute;
bottom: 0px;
left: -15px;
background: #eee;
z-index: -1;
}
/* Oldalmodul tartalma */
.sidebar .column_side_td .module .modbody{
padding: 15px;
}
/* Legjabb bejegyzs blokk (egyenknt) */
.sidebar .latestposts .latestpost{
padding: 0 5px;
border: 1px solid #f8f8f8;
margin: 10px 0;
position: relative;
height: 85px;
overflow: hidden;
display: flex;
align-items: center;
justify-content: flex-start;
}
/* Legjabb bejegyzs blokk (egyenknt) ha rviszed az egeret */
.sidebar .latestposts .latestpost:hover{
background-color: #ff0099;
color: #fff !important;
transition: all .4s ease-in-out;
padding-left: 10px;
}
.sidebar .latestposts .latestpost:hover .txtmini,
.sidebar .latestposts .latestpost:hover a{
color: #fff;
}
/* Friss bejegyzsek cm */
.sidebar .latestposts .latestposts-title .listheader{
font-family: 'Playfair Display', serif;
font-size: 16px !important;
font-weight: 400;
text-align: left;
}
/* Friss bejegyzsek melletti ikon */
.sidebar .latestposts .latestposts-title .listheader .fa{
font-size: 14px !important;
padding: 7px;
}
/* Legjabb bejegyzs - Nincs kp -> szrke karika */
.sidebar .latestposts div.featimg{
width: 60px;
height: 60px;
border-radius: 50%;
padding: 5px;
background-color: #eee;
}
/* Legjabb bejegyzs - Kp a poszt eltt */
.sidebar .latestposts .featimg{
width: 60px;
height: 60px;
border-radius: 50%;
padding: 5px;
}
/* Legjabb bejegyzs - cmet s dtumot tartalmaz elem */
.sidebar .latestposts .post-meta{
padding: 0 5px;
}
/* Legjabb bejegyzs - cm */
.sidebar .latestposts .post-meta a{
font-family: 'Playfair Display', serif;
font-size: 14px !important;
font-weight: 400;
color: #000000;
}
.sidebar .latestposts .post-meta a:hover{
color: #fff;
}
/* Legjabb bejegyzs - dtum */
.sidebar .latestposts .post-meta .txtmini{
padding-top: 5px;
}
/* Legjabb bejegyzs - Ugrs a blogra */
.sidebar .latestposts .txtnormal a{
position: relative;
}
/* Legjabb bejegyzs - Ugrs a blogra eltti nyl */
.sidebar .latestposts .txtnormal a::before{
content: '\f177 ';
font-family: FontAwesome;
position: absolute;
left: -20px;
top: -3px;
}
/* Legjabb hozzszlsok - komment blokk */
.sidebar .lastcomments .txtnormal{
padding: 10px;
margin: 10px 0;
}
/* Legjabb hozzszlsok - nv */
.sidebar .lastcomments .txtnormal span{
text-transform: uppercase;
font-weight: 400 !important;
font-family: 'Playfair Display', serif;
}
/* Legjabb hozzszlsok - nv eltti ikon */
.sidebar .lastcomments .txtnormal span::before{
content: '\f1fa';
font-family: FontAwesome;
padding: 0 5px;
font-size: 11px;
font-weight: 400;
}
/* Legjabb hozzszlsok - pros blokk */
.sidebar .lastcomments .txtnormal:nth-child(odd){
background-color: #f8f8f8;
}
/* Legjabb hozzszlsok - pratlan blokk */
.sidebar .lastcomments .txtnormal:nth-child(even){
background-color: #fff;
}
/* Legjabb hozzszlsok - komment blokk ha rviszed az egeret */
.sidebar .lastcomments .txtnormal:hover{
background-color: #ff0099;
color: #fff !important;
transition: all .4s ease-in-out;
}
.sidebar .lastcomments .txtnormal:hover a{
color: #fff !important;
}
/* Teljes blogpluszban szerepl tagekre vonatkozik */
.sidebar .modbody .txtmini{
font-family: 'Lora', serif;
font-size: 12px !important;
font-weight: 400;
color: #666;
font-style: normal !important;
}
.sidebar .modbody .txtnormal{
font-family: 'Lora', serif;
font-size: 12px !important;
font-weight: 400;
color: #666;
font-style: normal !important;
}
.sidebar .modbody .txtbold a{
text-decoration: none;
color: #000000;
}
/* Oldal tetejre link (blog aljn is) */
.topofpage a{
position: relative;
}
/* Oldal tetejre link eltti nyl (blog aljn is) */
.topofpage a::before{
content: '\f176 ' !important;
font-family: FontAwesome;
position: absolute;
left: -10px;
top: -5px;
padding: 0 !important;
}
/* Archvum */
.sidebar .archive{
padding: 5px;
}
/* Archvum elem */
.sidebar .archive .txtnormal a{
position: relative;
}
/* Archvum elem eltti mappa */
.sidebar .archive .txtnormal a::before{
content: '\f115 ';
font-family: FontAwesome;
padding: 0 5px;
}
/*--------------------------------------------------------------
Blog modul
--------------------------------------------------------------*/
/* Blogmodul nevnek elrejtse */
table[module_id="37134940"] .top_middle{
display: none;
}
/* Blog poszt */
div[id^="post_"]{
position: relative;
}
/* Blog poszt fejrsze */
div[id^="post_"] .post-head{
text-align: center !important;
}
/* Blog poszt kiemelt kp */
div[id^="post_"] .featuredImage{
width: 100%;
height: 300px;
margin: 15px 0;
background-size: cover;
}
/* Blog poszt cm */
div[id^="post_"] .post-head > a{
text-decoration: none;
text-align: center !important;
display: block !important;
}
/* Blog poszt cm */
div[id^="post_"] .post-head > a > h2
{
display: inline-block;
position: relative;
}
/* Blog poszt cm eltti szrke ngyzet */
div[id^="post_"] .post-head > a > h2::after{
content: '';
width: 10px;
height: 10px;
position: absolute;
bottom: -2px;
right: -15px;
background: #eee;
z-index: -1;
}
/* Blog poszt cm eltti rzsaszn ngyzet */
div[id^="post_"] .post-head > a > h2::before{
content: '';
width: 10px;
height: 10px;
position: absolute;
bottom: 10px;
left: -15px;
background: #ff0099;
z-index: -1;
}
/* Blog poszt - Dtum, cmkk */
div[id^="post_"] .post-head .txtmini,
div[id^="post_"] .post-head .blogtags
{
font-family: 'Playfair Display', serif;
font-weight: 400;
font-size: 12px !important;
font-style: normal !important;
margin: 10px 0;
display: inline-block;
padding: 5px 0px;
width: calc(50% - 5px);
}
/* Blog poszt - Dtum */
div[id^="post_"] .post-head .txtmini{
text-align: right;
border-right: 1px solid #eee;
padding-right: 10px;
}
/* Blog poszt - Dtum eltti ra */
div[id^="post_"] .post-head .txtmini::before{
content: '\f017';
font-family: FontAwesome;
padding: 5px;
}
/* Blog poszt - cmkk */
div[id^="post_"] .post-head .blogtags{
text-align: left;
padding-left: 10px;
font-size: 0px !important;
}
/* Blog poszt - egy-egy cmke */
div[id^="post_"] .post-head .blogtags a{
background-color: #FF0099;
color: #fff;
text-transform: uppercase;
text-decoration: none;
padding: 5px;
font-size: 11px !important;
margin: 0 5px;
}
/* Blog poszt - cmke eltti ikon */
div[id^="post_"] .post-head .blogtags a::before{
content: '\f02b';
font-family: FontAwesome;
padding: 5px;
}
/* Blog poszt - Cm */
div[id^="post_"] .post-head h2{
font-family: 'Playfair Display', serif;
font-size: 18px !important;
font-weight: 700;
color: #000000;
text-align: center;
}
/* A poszt utols bekezdse (kzpreigaztja az utols sort) */
div[id^="post_"] .post-content p:last-of-type{
text-align-last: center;
}
/* Posztban szerepl kpek */
div[id^="post_"] .post-content img{
margin: 2px 10px 5px 10px;
border: 5px double #eee;
}
/* Blog poszt - Inicil */
div[id^="post_"] .post-content > p:first-of-type:first-letter{
font-size: 48px;
padding: 10px 15px 5px 15px;
margin-right: 10px;
float: left;
color: #FF0099;
font-style: italic;
font-family: 'Playfair Display', serif;
font-weight: 700;
}
/* Blog poszt - Tovbb olvas gomb trolja */
div[id^="post_"] .blogmorelink{
display: block;
text-align: center;
padding: 15px;
}
/* Blog poszt - Tovbb olvas gomb */
div[id^="post_"] .blogmorelink a{
background-color: #FF0099;
color: #fff;
text-transform: uppercase;
text-decoration: none;
padding: 10px 15px;
font-size: 11px !important;
}
/* Blog poszt - Als sv */
div[id^="post_"] .list1.blogcommentcount{
border: 1px solid #eee;
padding: 10px 15px;
display: flex;
justify-content: flex-end; /* Ha a megoszts gombok be vannak kapcsolva, flex-end helyett hasznlj space-between -t */
}
/* Als sv: felesleges ikon eltntetse */
div[id^="post_"] .list1.blogcommentcount > .fa{
display: none;
}
/* Blog poszt - Kzssgi megoszts */
div[id^="post_"] .pageshare{
text-align: left;
}
/* Blog poszt - Kzssgi megoszts ronda fb gomb */
div[id^="post_"] .pageshare iframe{
display: none !important;
}
/* Blog poszt - Kzssgi megoszts ikonok */
div[id^="post_"] .pageshare .fa{
padding: 0 10px;
}
/* Blog poszt - Mit szlsz hozz link trolja/ kzssgi linkek trolja */
div[id^="post_"] .list1.blogcommentcount > div
{
display: inline-block;
float: none !important;
}
/* Blog poszt - Als svban lv linkek */
div[id^="post_"] .list1.blogcommentcount div a{
font-family: 'Playfair Display', serif;
font-size: 14px !important;
font-weight: 400;
color: #000000;
text-decoration: none;
}
/* Blog poszt - Mit szlsz hozz link eltti ikon */
div[id^="post_"] .list1.blogcommentcount div[style="vertical-align:middle;float:right;margin-left:4px;"] a::before{
content: '\f0e5';
font-family: FontAwesome;
padding: 0 5px;
}
/* Blog poszt - Als sv kp ikon elrejtse */
div[id^="post_"] .list1.blogcommentcount img{
display: none;
}
/*--------------------------------------------------------------
Lapoz a blog aljn
--------------------------------------------------------------*/
.bloglistend{
text-align: center;
}
/* Lapoz elem */
#gp_pagenavi li{
margin: 0 5px;
display: inline-block !important;
}
/* Szivecske eltntetse, ami alapbl rkerl */
#gp_pagenavi li::before{
content: '';
display: none !important;
}
/* Oldalak kinzete */
#gp_pagenavi li a{
background: #fff;
border: 1px solid #eee;
color: #bbb;
}
/* Aktulis oldal, link ha rviszed a kezed */
#gp_pagenavi li.active a,
#gp_pagenavi li a:hover{
background: #ff0099;
color: #fff;
}
/*--------------------------------------------------------------
Komment rsz
--------------------------------------------------------------*/
#commentContainer{}
/* X hozzszls */
#commentContainer > table:first-of-type{
}
/* FontAwesome ikonok */
#commentContainer .fa{
padding: 0px 10px;
}
#commentContainer table:nth-of-type(2) {
padding: 5px;
}
/* Egyes hozzszlsok */
#commentContainer table:nth-of-type(2) tr{
margin: 20px 0;
display: block;
}
/* Egyes hozzszlsok - pros */
#commentContainer table:nth-of-type(2) .list1 {
background-color: #f8f8f8;
border: 1px solid #fff;
}
/* Egyes hozzszlsok - pratlan*/
#commentContainer table:nth-of-type(2) .list2 {
border: 1px solid #eee;
}
/* Hozzszls fejrsz */
#commentContainer .comment-meta{}
/* Hozzszls fejrsz - Avatar */
#commentContainer .comment-meta .gpavatarimg{
height: 40px;
width: auto;
padding: 5px;
}
/* Hozzszls - dtum */
#commentContainer .comment-meta div[style="float:right;font-style:italic;"]{
font-size: 12px;
font-family: 'Playfair Display', serif;
}
/* Hozzszls - nv */
#commentContainer .comment-meta .txtbold{
text-transform: uppercase;
}
/* Hozzszls */
#commentContainer .commenttext{}
/* Hozzszls - Vlasz elvlaszt vonal */
#commentContainer .commenttext hr {}
/* Vlasz hozzszls */
#commentContainer .commenttext > div {
width: auto;
margin-left: 20px;
}
/* Vlasz hozzszls - dtum */
#commentContainer .commenttext > div > div[style="float:right;"] {
font-size: 12px;
font-family: 'Playfair Display', serif;
}
/* Vlasz hozzszls - dtum eltti ikon */
#commentContainer .commenttext > div > div[style="float:right;"]::before{
content: '\f017';
font-family: FontAwesome;
padding: 0 5px;
}
/* Vlasz hozzszls - nv */
#commentContainer .commenttext > div > div[style="font-weight:bold;"] {
font-size: 12px;
text-transform: uppercase;
}
/* Vlasz hozzszls - nv eltti ikon */
#commentContainer .commenttext > div > div[style="font-weight:bold;"]::before{
content: '\f0e5';
font-family: FontAwesome;
padding: 0 5px;
}
/* Vlasz hozzszls - komment */
#commentContainer .commenttext > div > div[style="font-style:italic;"] p {
font-size: 11px !important;
}
/*--------------------------------------------------------------
Login form
--------------------------------------------------------------*/
form[name="loginform"] br{
display: none;
}
form[name="loginform"] input{
width: 100%;
}
/*--------------------------------------------------------------
Preloader
--------------------------------------------------------------*/
.page-loader {
position: fixed;
background: #fff; /* Oldal httere a preloader alatt */
bottom: 0;
right: 0;
left: 0;
top: 0;
z-index: 9998;
display: flex;
justify-content: center;
align-items: center;
}
.loader {
border-left: 2px solid #ff0099; /* Rzsazsn kis szelet */
border-top: 2px solid rgba(0, 0, 0, 0.1); /* Szrke rsz */
border-right: 2px solid rgba(0, 0, 0, 0.1); /* Szrke rsz */
border-bottom: 2px solid rgba(0, 0, 0, 0.1); /* Szrke rsz */
height: 46px; /* Karika magassga */
width: 46px; /* Karika szlessge */
font-size: 0px; /* felirat elrejtse */
z-index: 9999;
-webkit-animation: load 0.8s infinite linear;
-moz-animation: load 0.8s infinite linear;
ms-animation: load 0.8s infinite linear;
o-animation: load 0.8s infinite linear;
animation: load 0.8s infinite linear;
}
.loader,
.loader:after {
border-radius: 50%; /*kr alak*/
width: 46px;
height: 46px;
}
/* Prgs animci */
@-webkit-keyframes load {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes load {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@media screen and (max-width: 780px) {
.site{
width: 100% !important;
display: flex;
flex-basis: 1;
}
.main-content, .sidebar{
width: 100% !important;
display: block;
}
} |
|