VISIT AND LIKE OUR PAGE ON FACEBOOK
TAKE A LOOK AT OUR TWEETS ON TWITTER
SUBSCRIBE TO THE JOOMFREAK RSS FEED
VISIT OUR CHANNEL ON YOUTUBE

Account Details

Change your name, email, password or permanently delete your account. Change settings

We offer several ways you can get support from our experts: Support ForumKnowledgebaseNewsletter

Your Forum Posts

No posts to display.

Welcome, Guest
Username Password: Remember me
  • Page:
  • 1

TOPIC: responsive design

responsive design 14 Mar 2014 08:19 #4259

Is this template responsive

  • Posts:24
  • raunhar
  • Junior Boarder
  • OFFLINE
  • Karma: 0

Re: responsive design 14 Dec 2015 04:16 #7866

Sorry, this template isn't responsive.

joomfreak

  • Posts:2940
  • isupport
  • Moderator
  • OFFLINE
  • Karma: 0

Re: responsive design 11 Feb 2016 10:28 #8067

Try that one. Don't forget to save the old one as backup! It isn't perfect, but the content gets smaller, so the right menu doesn't drop down to the bottom and the font sizes are in em, not px.

Code for template.css

/*------------------------------------------------------------------------
# JF TEXTURIA - JOOMFREAK.COM JOOMLA 1.7.0 TEMPLATE 12-2011
# ------------------------------------------------------------------------
# COPYRIGHT: (C) 2011 JOOMFREAK.COM / KREATIF MULTIMEDIA GMBH
# LICENSE: Creative Commons Attribution
# AUTHOR: JOOMFREAK.COM
# WEBSITE: www.joomfreak.com - www.kreatif-multimedia.com
# EMAIL: This e-mail address is being protected from spambots. You need JavaScript enabled to view it
-------------------------------------------------------------------------*/

html {
height: 100%;
}

form {
margin: 0;
padding: 0;
}

body {
font-family: Tahoma,Verdana,sans-serif;
line-height: 1.8em;
margin: 0px 0px 0px 0px;
font-size: .75em;
color: #303030;
}

iframe{
border: 1px solid #c8c8c8;
padding:3px;
}

a:link, a:visited {
color:#fc930a;
text-decoration: none;
outline:none;
}

a:hover {
text-decoration: none;
}

input.button { cursor: pointer; }

p { margin-top: 0; margin-bottom: 20px; }

img { border: 0 none; }

/*****************************************/
/*** Template specific layout elements ***/
/*****************************************/

.decimallist{
list-style-type:"(";
}

.romanlist{
list-style-type: upper-roman;
}

.lowerromanlist{
list-style-type: lower-roman;
}

.lowerlatinlist{
list-style-type: lower-latin;
}

.clr{
clear:both;
margin:0px;
padding:0px;
}
#jf-body {
padding: 0px;
margin: 0px;
background:url(../images/jf_body.png) repeat-x top left #f6f6f6;
}
#jf-wrap{
background:url(../images/jf_footer.png) repeat-x bottom left;
position:relative;

}
#jf-bottom-bg{
/*width:1045px;
margin:0 auto;*/
background:url(../images/jf_bottom.png) no-repeat bottom center;
padding-bottom:465px;
}
#jf-wrapper{
margin:0 auto;
max-width:1034px;
width:100%;
}
#jf-topleft{
float:left;
width:30%;
margin-left:4%;
height:22px;
line-height:22px;
color:#f8ce98;
margin-bottom:1%;
}
#jf-topleft p{
margin:0px;
padding:0px;
}
#jf-topright{
float:right;
width:500px;
margin-right:3%;
height:22px;
line-height:22px;
color:#cb780d;
margin-bottom:1%;
text-align:right;
}
#jf-topright p{
padding:0px;
margin:0px;
}
#jf-topright ul{
padding:0px;
margin:0px;
}
#jf-topright ul li{
display:inline-block;
}
#jf-topright a,#jf-topright a:visited{
color:#f6f6f6;
text-transform:uppercase;
display:block;
padding:0px 10px;
font-weight:normal;
font-size:10px;
}
#jf-topright a:hover{
color:#323232;
}


#jf-header{
height:9%;
overflow:hidden;
margin-top:15px;
clear:both;
}
#jf-logo{
float:left;
width:131px;
margin-left:3%;
}
/*main menu */
#jf-mainmenu{
white-space: nowrap;
float:right;
height:4em;
margin-right:120px;
margin-top:1.25em;
max-width: 800px;
width:72%;
}
#jf-mainmenu ul{
padding:0px;
margin:0px;
}
#jf-mainmenu ul li{
list-style:none;
float:left;
padding:0 0.5%;
background:url(../images/jf_menu_div.png) no-repeat top right;
height:1.2em;
}
#jf-mainmenu ul li a,#jf-mainmenu ul li a:visited{
display:block;
font-size:1.2em;
color:#3d3d3d;
font-family:"ArchitectsDaughterRegular";
text-decoration:none;
font-weight:normal;
line-height:1.25em;
height:1.25em;
}
#jf-mainmenu ul li.last{
padding-right:0px !important;
background:none !important;
}
#jf-mainmenu ul li a span{
display:block;
font-family:"ArchitectsDaughterRegular";
font-size:1em;
line-height:1.25em;
height:1.25em;
font-weight:normal;
color:#3d3d3d;
padding-top:.1em;
padding-left:1em;
padding-right: 1em;
}
#jf-mainmenu ul li a:hover,#jf-mainmenu ul li.active a{
color:#fff;
background:url(../images/jf_menu_item_left.jpg) no-repeat;
text-decoration:none;
height: 20px;
}
#jf-mainmenu ul li a:hover span,#jf-mainmenu ul li.active a span{
color:#fff;
background:url(../images/jf_menu_item_right.jpg) no-repeat top right;
height: 20px;
}

#jf-mainmenu ul li ul{
display:none;
}

#jf-submenu {
white-space: nowrap;
float:left;
margin-top: 0;
}

#jf-submenu ul li{
margin-top:-5px !important;
padding:0px 3px !important;
background:none !important;
margin-right:-1em;
}
#jf-submenu ul li a span{
font-size:.8em;
}
/*slideshow*/
#jf-slideshow{
margin-bottom:10px;
padding-left:45px;
margin-top: 15px;
}

#jf-topmodule{
margin-bottom:1%;
padding-bottom:4%;
background:url(../images/jf_div.png) repeat-x bottom left;
}

#jf-main-page{
max-width:91%;
margin:0 auto;
}
#jf-right{
float:left;
max-width:240px;
width:28%;
}
#jf-right .jfmod{
margin-bottom:5px;
color:#fff;
}
.jfmod-top{
background:url(../images/jf_gray_top.png) no-repeat top left;
height:15px;
max-width:240px;
width:100%;
}
.jfmod-mid{
background-color:#323232;
padding:15px 10px;
}
.jfmod-bot{
background:url(../images/jf_gray_bottom.png) no-repeat top left;
height:11px;
max-width:240px;
width:100%;
}
.module_orange .jfmod-top{
background:url(../images/jf_orange_top.png) no-repeat top left;
}
.module_orange .jfmod-mid{
background-color:#fc930a;
}
.module_orange .jfmod-bot{
background:url(../images/jf_orange_botttom.png) no-repeat top left;
}
/* orange bold style */
.module_orangebold .jfmod-top{
background:url(../images/jf_orange_bold_top.png) no-repeat top left;
}
.module_orangebold .jfmod-mid{
background-color:#e27408;
}
.module_orangebold .jfmod-bot{
background:url(../images/jf_orange_bold_bottom.png) no-repeat top left;
}
/*blue style */
.module_blue .jfmod-top{
background:url(../images/jf_blue_top.png) no-repeat top left;
}
.module_blue .jfmod-mid{
background-color:#5c9fcf;
}
.module_blue .jfmod-bot{
background:url(../images/jf_blue_bottom.png) no-repeat top left;
}
#jf-right .jfmod h3{
font-family:ArchitectsDaughterRegular;
font-size:1em;
color:#ffffff;
margin-bottom:10px;
}

#jf-right .jfmod{
padding:0px;
}
#jf-right .jfmod a.readon{
color:#79bda8;
}
#jf-right .jfmod ul{
padding:0px;
margin:0px;
}
#jf-right .jfmod ul li{
list-style:none;
}
#jf-right .jfmod ul li a{
display:block;
color:#fff;
height:1.9em;
line-height:1.9em;
background:url(../images/jf_div2.png) repeat-x bottom left;
font-weight:normal;
text-decoration:none;
}
#jf-right .jfmod ul.menu li a,#jf-right .jfmod ul.menu li a:visited{
font-size:.75em;
padding:0px 20px;
}
#jf-right .jfmod ul.menu li a span{
display:block;
background:url(../images/jf_arrow.png) no-repeat 0px 9px;
padding-left:30px;
}
#jf-right .jfmod ul.menu li a:hover,#jf-right .jfmod ul.menu li#current a{
color:#fc930a;
}
#jf-right .jfmod ul.menu li a:hover span,#jf-right .jfmod ul.menu li#current a span{
background:url(../images/jf_arrow_hover.png) no-repeat 0px 9px;
}
#jf-right .jfmod ul.menu li#current a{
}
#jf-right .jfmod ul.menu li ul li a,#jf-right .jfmod ul.menu li ul li a:visited{
padding-left:60px;
color:#fff !important;
}
#jf-right .jfmod ul.menu li ul li a span,#jf-right .jfmod ul.menu li ul li a:visited span{
background:url(../images/jf_arrow.png) no-repeat 0px 9px !important;
}
#jf-right .jfmod ul.menu li ul li a:hover,#jf-right .jfmod ul.menu li ul li#current a{
color:#fc930a !important;
}
#jf-right .jfmod ul.menu li ul li a:hover span,#jf-right .jfmod ul.menu li ul li#current a span{
background:url(../images/jf_arrow_hover.png) no-repeat 0px 9px !important;
}
/* module popular articles */
.mostread li {
margin-bottom: 15px;
}
.ve-thumb{
float:left;
background:url(../images/background.png) no-repeat;
margin-right:5px;
width:79px;
height:52px;
overflow:hidden;
padding-left:4px;
padding-top:3px;
}
.ve-thumb a{
display:block !important;
width:75px;
height:48px !important;
overflow:hidden;
}
.ve-thumb img{
width:75px;
border:0px;
}
.mostread li a{
font-weight:bold !important;
background:none !important;
display:inline !important;
height:auto !important;
line-height:120% !important;
}
/* module social */
#jf-right .module_social .jfmod-top,#jf-right .module_social .jfmod-bot {
display:none;
}
#jf-right .module_social .jfmod-mid{
background:none;
}
#jf-right .module_social .jfmod-mid h3{
color:#fc930a;
}
#jf-right .module_social .jfmod-mid img{
margin-left:15px;
}
#jf-right #login-form .controls {
margin-bottom: 5px;
}
#jf-right #modlgn-username,#jf-right #modlgn-passwd {
height:1.9em;
line-height:1.9em;
width:40%;
padding-left:10px;
border:0px;
background:url(../images/jf_input.png) no-repeat;
font-size:.75em;
color:#737373;
margin-top:3px;
}
#jf-right .jfmod #login-form ul li a{
background: none;
color: #FFFFFF;
font-size: .75em;
font-weight: bold;
height: auto;
line-height: 1.8em;
text-decoration: none;
}
#jf-right a.re-link:hover{
text-decoration:none;
}
#jf-right #form-login-submit {
text-align: right;
}
#jf-right #form-login-submit button, #jf-right .logout-button input.btn {
background:url(../images/jf_btn_login.png) no-repeat right center;
font-size:.9em;
font-family:"ArchitectsDaughterRegular";
color:#fff;
border:0px;
cursor:pointer;
text-transform:lowercase;
padding-right:60px;
margin-right:7px;
}
#jf-right #login-form{
font-weight:bold;
}
#jf-right .fp-link{
color:#fff;
display:block;
font-size:.75em;
text-decoration:none;
font-weight:bold;
}
#jf-right .module_login{
background-color:#9dbdc8;
}
#jf-right .module_login .re-link,#jf-right .module_login .buttonLogin,
#jf-right .module_login h3 span{
color:#607495 !important;
}
#jf-right span.article_separator{
display:block;
background:url(../images/jf_div2.png) repeat-x;
margin-top:10px;
margin-bottom:10px;
height:3px;
}
#jf-right .module_latestnew{
background-color:#cce5d7;
color:#77ae8f;
}
#jf-right .module_latestnew h3 span{
color:#79bda8 !important;
}
#jf-right .module_latestnew a.readmore{
color:#79bda8 !important;
}
#jf-main{
text-align:justify;
float:left;
width:69%;
max-width: 640 px;
margin-right:20px;
margin-bottom: 40px;
}
#jf-content img{
border: 1px solid #c8c8c8;
padding:3px;
margin: 6px;
max-width: 69%;
}

.noframe{
border: 0px;
padding: 0px;
}

.jf-div{background:url(../images/jf_div.png) repeat-x;height:5px;margin-bottom:20px;}
#jf-user4{
margin-bottom:15px;
}
#jf-user1{float:left;width:430px;}
#jf-user1 h3,#jf-user5 h3{font-size:18px;color:#3b3f3b;font-weight:bold;line-height:100%;margin-bottom:15px;}
#jf-user1 ul{margin:0px;padding:0px;}
#jf-user1 ul li{padding:0px;list-style:none;margin-bottom:5px;}
#jf-user1 ul li a{
color:#3b3f3b;
font-size:.75em;
font-family:"ArchitectsDaughterRegular";
}
#jf-user1 ul li .jf-date{
display:inline-block;width:25px;height:23px;line-height:1.4em;background:url(../images/jf_date.png) no-repeat;color:#fff;font-size:1em;text-align:center;margin-right:10px;
}

#jf-user5{float:right;width:430px;}
#jf-user5 .contactInput{
display:block;
background:url(../images/jf_input2.png) no-repeat;
width:155px;
height:30px;
border:0px;
padding-left:4px;
color:#737373;
font-size:.75em;
margin-bottom:10px;
font-family:Tahoma;
}
#jf-user5 .contactTextarea{
width:245px;
height:65px;
background:url(../images/jf_textarea.png) no-repeat;
border:0px;
padding-top:5px;
padding-left:4px;
color:#737373;
font-size:.75em;
font-family:Tahoma;
}
#jf-user5 .contact-left{
float:left;
width:159px;
}
#jf-user5 .contact-right{
float:left;
width:249px;
margin-left:15px;
}
#jf-user5 .contactButton{
float:right;
background:url(../images/jf_arrow2.png) no-repeat center right;
border:0px;
padding-right:56px;
color:#3b3f3b;
font-size:.9em;
font-family:"ArchitectsDaughterRegular";
font-weight:bold;
cursor:pointer;
}

#jf-footer{max-width:1000px;width:100%;position:absolute;bottom:0px;height:465px;overflow:hidden;}
#jf-bottom{margin-left:34px;max-width:952px;width:92%;height:177px;background:url(../images/jf-bottom.png) no-repeat;padding-top:10px;}
#jf-bottom h3{font-size:1em;padding-left:20px;}
#jf-breadcrumbs{margin-top:5px;margin-bottom:15px;}
#jf-breadcrumbs ul {list-style: none;}
#jf-breadcrumbs ul li {display: inline;}
#jf-breadcrumbs ul li span, #jf-breadcrumbs ul li a {
font-size: .7em;
height: 1em;
line-height: 1em;
margin: 0;
overflow: hidden;
text-transform: lowercase;
}
#jf-footermodule{background:url(../images/jf_footermodule.png) no-repeat;width:853px;margin:0 auto;margin-bottom:40px;height:79px;overflow:hidden;}
#jf-footermodule p{margin:0px;text-align:center;font-family:ArchitectsDaughterRegular;color:#fff;font-size:1.1em;line-height:79px;}
#jf-copyright{width:450px;float:left;text-align:left;color:#303030;padding-left:40px;font-size:.7em;}
#jf-copyright a,#jf-copyright a:visited,#jf-copyright span{font-weight:bold;color:#fc930a;text-decoration:none;}
#jf-copyright a:hover{text-decoration:underline;}
/*footmenu*/
#jf-footermenu{width:450px;float:right;text-align:left;padding-right:10px;}
#jf-footermenu ul{padding:0px;margin:0px;text-align:right;}
#jf-footermenu ul li{list-style:none;display:inline-block;}
#jf-footermenu ul li a,#jf-footermenu ul li a:visited{display:block;margin-left:20px;font-weight:bold;color:#303030;text-decoration:none;font-size:.7em}
#jf-footermenu ul li a:hover,#jf-footermenu ul li#current a{text-decoration:none;color:#fc930a}
#jf-joomfreak{text-align:center;margin-top:40px;}
#pathway {
padding: 0px 10px 8px;
width: auto;
margin-top: -2px;
margin-right: 250px;
text-align: left;
}

#jf-right .search {
max-width:238px;
width: 100%;
height: 1.8em;
overflow: hidden;
background:url(../images/jf_search_input.png) no-repeat;
}
#jf-right .search #mod-search-searchword {
margin-left:10px;
width:23%;
height:1.8em;
line-height:1.8em;
color:#030303;
border:0px;
background:none;
font-size:.7em;
}
#jf-right .search .button{
border:0px;
width:25px;
height:1.4em;
background:url(../images/jf_search_btn.png) no-repeat;
text-indent:-9999px;
}
form#searchForm input {
vertical-align: middle;
}

form#searchForm table {
border-collapse: collapse;
}

form#searchForm td {
padding:0;
}
#area {
padding: 0;
}

/* Joomgallery */
.joomcat ul{
list-style:none;
padding:0px;
margin:0px;
}
.joomcat ul li{
line-height:100%;
}
.joomcat .cat_img img{
width:212px;
height: 116px;
border: 1px solid #c8c8c8;
padding:3px;
}

.joomcat a{
color:#2f2f2f !important;
font-size:.6em;
font-weight:bold !important;
}

.joomcat a:hover{
text-decoration:none;
}
.glast{margin-right:0px !important;}

.joomimg_row a{
display:block;
background:url(../images/bg.png) no-repeat;
height:60px;
width:60px;
padding-left:3px;
padding-top:2px;
overflow:hidden;
}

img.jg_photo, .jg_minis a img {
background-color: #FFFFFF;
background-image: none;
border: 1px solid #C8C8C8;
}

img.jg_photo {
margin: 0 10px 4px 0;
}

.jg_imgtitle {
color: #303030;
font-size: 2.4em;
font-weight: normal;
margin: 25px 0 0;
padding: 0;
line-height: normal;
text-align: left;
}

div.jg_details {
border: none;
margin: 20px 0;
}

#jg_photo_description_label {
font-weight: bold;
padding-top: 20px;
}

div.jg_photo_right, div.jg_photo_left, div.jg_bbcode_right, div.jg_bbcode_left, div.jg_exif_left, div.jg_exif_right, div.jg_cmtr {
margin: 0;
padding: 0;
}

div.jg_photo_left, div.jg_photo_right {
font-size: .7em;
}

div.jg_photo_right {
font-weight: bold;
}

.jg_infos {
float: left;
width: 60%;
}

.jg_iconbar {
float: right;
text-align: right !important;
}

div.jg_iconbar a:link, div.jg_iconbar a:visited {
color: #FC930A;
display: block;
font-weight: bold;
font-size: .7em;
margin-right: 60px;
}

img.jg_icon {
height: auto;
width: auto;
}

div.jg_my_favourites {
font-size: .7em;
}

.jg_back {
padding: 0 0 10px 0;
}

.jg_back a:link, .jg_back a:visited {
background: url("../images/jg_back_detail.png") no-repeat scroll left center transparent;
color: #FC930A;
font-size: .9em;
font-weight: bold;
padding: 3px 0 3px 50px;
}

#jg_back_category {
background: none repeat scroll 0 0 #FC930A;
float: left;
height: 80px;
width: 160px;
}

#jg_back_category a:link, #jg_back_category a:visited {
background: url("../images/back-galllery.png") no-repeat scroll left center transparent;
color: #FFFFFF;
display: block;
font-size: .9em;
margin: 0 auto;
padding: 38px 0 38px 52px;
width: 40px;
}

.jg_element_cat {
margin-right: 13px;
text-align: center !important;
width: 160px !important;
}


.jg_element_cat img.jg_photo {
height: 82px;
width: 152px;
}

.glast {
margin-right: 0 !important;
}

.jg_catelem_txt {
font-size: .7em;
line-height: 120%;
margin: 0;
text-align: center !important;
}

.jg_catelem_txt ul, .jg_subcatelem_txt ul {
margin: 0;
padding: 0;
}

.jg_element_gal, .jg_element_gal_r {
float: left !important;
margin-right: 10px;
width: 220px !important;
}

.jg_element_gal img.jg_photo {
height: 116px;
width: 212px;
}

.jg_element_txt {
font-size: .6em;
line-height: 120%;
text-align: center;
width: 100%;
}

.jg_element_txt a:link, .jg_element_txt a:visited {
color: #303030;
}

.jg_txtrow, .jg_toplist, .jg_gallerystats {
color: #818181;
font-size: .7em;
}

.jg_detailnavi {
display: none;
}

/*****************************************/
/*** Joomla! specific content elements ***/
/*****************************************/

div.offline {
background: #fffebb;
width: 100%;
position: absolute;
top: 0;
left: 0;
font-size: 1.2em;
padding: 5px;
}

span.pathway {
display: block;
margin: 0 40px;
height: 1em;
line-height: 16px;
overflow: hidden;
font-size:.7em;
text-transform: lowercase;
}

/* headers */
div.componentheading {
padding-left: 0px;
color:#818181;
font-size:1.75em;
background: url("../images/jf_div.png") repeat-x scroll left bottom transparent;
padding-bottom:15px;
}

h1,h2 {
padding-left: 0px;
color:#818181;
font-size:1.75em;
background: url("../images/jf_div.png") repeat-x scroll left bottom transparent;
padding-bottom:15px;
margin: 0;
font-weight: normal;
font-family: ArchitectsDaughterRegular,Helvetica,Arial,sans-serif;
padding-left: 0px;
margin-bottom: 8px;
text-align: left;
line-height:2.3em;
}

h2.item-title {
background: none;
}

.item-title {
padding: 0;
font-family: "ArchitectsDaughterRegular",Arial, Helvetica,sans-serif;
font-size: 1.5em;
font-weight: normal;
vertical-align: bottom;
color: #fc930a;
text-align: left;
width: 100%;
line-height:2em;
padding-bottom:10px;
}
.item-title a, .item-title a:visited{
color: #fc930a;
text-decoration:none;
font-weight:normal;
}
.item-title a:hover{
color:#d3263a;
}
.item-title a span, .item-title a:visited span, .item-title span{
font-family: "ArchitectsDaughterRegular";
}
table.contentpaneopen h3 {
margin-top: 25px;
}

h4 {
font-family: ArchitectsDaughterRegular,Arial, Helvetica, sans-serif;
color: #5c9fcf;
font-size:1.4em;
}

h3, .componentheading, table.moduletable th, legend {
margin: 0;
font-weight: normal;
font-family: ArchitectsDaughterRegular,Helvetica,Arial,sans-serif;
font-size: 2em;
padding-left: 0px;
margin-bottom: 8px;
text-align: left;
color:#fc930a;
line-height:2.3em;
}

/* small text */
.small {
font-size: .7em;
font-weight: normal;
text-align: left;
color:#818181;
}

.modifydate {
height: 1.25em;
vertical-align: bottom;
font-size: .7em;
font-weight: normal;
text-align: left;
color:#818181;
}

.createdate {
height: 1.25em;
vertical-align: top;
font-size: .7em;
font-weight: normal;
vertical-align: top;
padding-top: 0px;
display:inline-block;
color:#818181;
padding-left:15px;

}

.readmore a, .readmore a:visited {
background:url(../images/jf_readmore.png) right 8px no-repeat;
padding-right:55px;
font-size:.9em;
color:#fc930a;
font-family:ArchitectsDaughterRegular;
text-decoration:none;
text-transform:lowercase;
}
.readmore a:hover{
background:url(../images/jf_readmore_hover.png) right 8px no-repeat;
color:#d3263a;
text-decoration:none;
}

/* form validation */
.invalid { border-color: #ff0000; }
label.invalid { color: #ff0000; }


/** overlib **/

.ol-foreground {
background-color: #f6f6f6;
}

.ol-background {
background-color: #666;
}

.ol-textfont {
font-family: Arial, Helvetica, sans-serif;
font-size: .7em;
}

.ol-captionfont {
font-family: Arial, Helvetica, sans-serif;
font-size: .75em;
color: #f6f6f6;
font-weight: bold;
}
.ol-captionfont a {
color: #0B55C4;
text-decoration: none;
font-size: .75em;
}

.ol-closefont {}

/* menu links */
a.mainlevel:link, a.mainlevel:visited {
padding-left: 5px;
}

a.mainlevel:hover {

}

/* spacers */
span.article_separator {
display: block;
height: 1.25em;
}

.article_column {
padding-right:0px;
padding-left:45px;
}

.column_separator {
padding-left: 25px;
}

td.buttonheading {

}

td.buttonheading img {
border:none;
}

.clr {
clear: both;
}

/* edit button */
.contentpaneopen_edit{
float: left;
}

/* table of contents */
table.contenttoc {
margin: 5px;
border: 1px solid #ccc;
padding: 5px;
float: right;
}

table.contenttoc td {
padding: 0 5px;
}


/* content tables */
td.sectiontableheader {
background: #efefef;
color: #333;
font-weight: bold;
padding: 4px;
border-right: 1px solid #fff;
}

tr.sectiontableentry0 td,
tr.sectiontableentry1 td,
tr.sectiontableentry2 td {
padding: 4px;
}

td.sectiontableentry0,
td.sectiontableentry1,
td.sectiontableentry2 {
padding: 3px;
}


/* content styles */
table.contentpaneopen, table.contentpane {
margin: 0;
padding: 0;
width: 100%;
}

table.contentpaneopen li {
margin-bottom: 5px;
}

table.contentpaneopen fieldset {
border: 0;
border-top: 1px solid #ddd;
}

table.contentpaneopen h3 {
margin-top: 25px;
}

table.contentpaneopen h4 {
font-family: Arial, Helvetica, sans-serif;
color: #333;
}

.highlight {
background-color: #fffebb;
}
/* forms */
table.adminform textarea {
width: 540px;
height: 400px;
font-size: 1em;
color: #000099;
}



form#form-login fieldset { border: 0 none; margin: 0em; padding: 0.2em;}
form#form-login ul { padding-left: 20px; }

form#com-form-login fieldset { border: 0 none; margin: 0em; padding: 0.2em;}
form#com-form-login ul { padding-left: 20px; }

/* thumbnails */
div.mosimage { margin: 5px; }
div.mosimage_caption { font-size: .90em; color: #666; }

div.caption { padding: 0 10px 0 10px; }
div.caption img { border: 1px solid #CCC; }
div.caption p { font-size: .90em; color: #666; text-align: center; }

div.img_caption { padding: 0 10px 0 10px; }
div.img_caption img { border: 1px solid #CCC; }
div.img_caption p { font-size: .90em; color: #666; text-align: center; }

/* Parameter Table */
table.paramlist {
margin-top: 5px;
}

table.paramlist td.paramlist_key {
width: 128px;
text-align: left;
height: 1.9em;
}

table.paramlist td.paramlist_value {
}

div.message {
font-family : "Trebuchet MS", Arial, Helvetica, sans-serif;
font-weight: bold;
font-size : .9em;
color : #c30;
text-align: center;
width: auto;
background-color: #f9f9f9;
border: solid 1px #d5d5d5;
margin: 3px 0px 10px;
padding: 3px 20px;
}

/* Banners module */

/* Default skyscraper style */
.bannergroup {
}

.banneritem img {
display: block;
margin-left: auto;
margin-right: auto;
}

/* Text advert style */

.banneritem_text {
padding: 4px;
font-size: .7em;
}

.bannerfooter_text {
padding: 4px;
font-size: .7em;
text-align: right;
}

/* System Messages */
/* see system general.css */

.pagination span,.pagination a {display:inline-block;width:28px;height:1.7em;line-height:1.7em;text-align:center;background:url(../images/jf_pagination.png) no-repeat;margin-left:2px;}
.pagination span.p_prev span,.pagination span.p_prev a,.pagination span.p_next span,.pagination span.p_next a{
margin:0px !important;
}
.pagination span.p_prev span,.pagination span.p_prev a{
background:url(../images/jf_prev.png) no-repeat 10px 10px;
text-indent:-9999px;
}
.pagination strong span{
background:url(../images/jf_pagination_active.png) no-repeat !important;
color:#f2f2f2;
width:24px !important;
}
.pagination span.p_next span,.pagination span.p_next a{
background:url(../images/jf_next.png) no-repeat 10px 10px;
text-indent:-9999px;
}
.pagination a {text-decoration:none !important;}

/* Polls */
.pollname{
font-weight: bold;padding-bottom:5px;
}
.pollstableborder td {
text-align: left;
color:#fff;
}
.pollbtn input{
border:0px;
background:none;
text-transform:uppercase;
font-family:ArchitectsDaughterRegular;
color:#fff;
font-size:.75em;
}
/* WebLinks */
span.description {
display:block;
padding-left: 30px;
}

/* Frontend Editing*/
fieldset, .btn-toolbar {
border: 1px solid #ccc;
margin-top: 15px;
padding: 15px;
}

legend {
margin: 0;
padding: 0 10px;
}

td.key {
border-bottom:1px solid #eee;
color: #666;
}

/* Tooltips */

.tool-tip {
float: left;
background: #ffc;
border: 1px solid #D4D5AA;
padding: 5px;
max-width: 200px;
}

.tool-title {
padding: 0;
margin: 0;
font-size: 100%;
font-weight: bold;
margin-top: -15px;
padding-top: 15px;
padding-bottom: 5px;
background: url(../../system/images/selector-arrow.png) no-repeat;
}

.tool-text {
font-size: 100%;
margin: 0;
}

/* System Standard Messages */
#system-message { margin-bottom: 20px; }

#system-message dd.message ul { background: #C3D2E5 url(../../system/images/notice-info.png) 4px center no-repeat;border-top: 3px solid #DE7A7B; border-bottom: 3px solid #DE7A7B; margin:0px; padding-left: 40px; text-indent:0px;}

/* System Error Messages */
#system-message dd.error ul { color: #c00; background: #E6C0C0 url(../../system/images/notice-alert.png) 4px center no-repeat; border-top: 3px solid #DE7A7B; border-bottom: 3px solid #DE7A7B; margin:0px; padding-left: 40px; text-indent:0px;}

/* System Notice Messages */
#system-message dd.notice ul { color: #c00; background: #EFE7B8 url(../../system/images/notice-note.png) 4px center no-repeat; border-top: 3px solid #F0DC7E; border-bottom: 3px solid #F0DC7E; margin:0px; padding-left: 40px; text-indent:0px;}

#syndicate{
float:left;
padding-left: 25px;
}

/* Component Specific Fixes */
.item-leading, .blog .items-leading, .blog .items-row .item {
padding-bottom:15px;
margin-bottom:15px;
background:url(../images/jf_div.png) repeat-x bottom left;
}

.item-body {
padding-left: 65px;
}

.readmore {
text-align: right;
}

.item-page .page-header h2 {
background: none;
margin: 0;
}

.pull-right {
float: right;
}

.article-info {
overflow: hidden;
margin: 0;
padding: 0;
}

.article-info dd {
color: #818181;
display: inline-block;
font-size: .7em;
font-weight: normal;
height: 1.25em;
margin: 0;
padding-left: 15px;
padding-top: 0;
vertical-align: top;
}

.article-info dd.createdby {
padding-left: 0;
}

ul.actions {
margin: 0;
padding: 0;
list-style: none;
}

ul.actions li {
display: inline;
}
.item-image img {
border: 2px solid #C8C8C8;
clear: both;
display: block;
margin: 0 auto 15px;
padding: 3px;
width: 599px;
}

.item-page .item-image img {
width: 672px;
}

.blog .items-row .item-image img {
clear: both;
margin-bottom: 15px;
margin-left: 0 !important;
margin-right: 0 !important;
width: 278px;
}

.items-leading h2 {
background: none;
font-size: 1.5em;
}

.items-row h2 {
background: none repeat scroll 0 0 transparent;
font-size: 1em;
font-weight: normal !important;
line-height: 2em;
}

.items-row h2 a:link, .items-row h2 a:visited {
font-weight: normal;
}

.jf-date-content {
background: url("../images/jf_date2.png") no-repeat scroll 0 0 transparent;
color: #FFFFFF;
display: block;
float: left;
font-family: tahoma !important;
font-size: 2.5em;
height: 3.3em;
line-height: 1.9em;
margin-right: 8px;
padding-top: 5px;
text-align: center;
width: 64px;
}

.jf-date-content span {
display: block;
font-family: tahoma !important;
font-size: .7em;
font-weight: bold;
margin-top: -5px;
}

/* ++++++++++++++ blog ++++++++++++++ */

.cols-1
{
display: block;
float: none !important;
margin: 0 !important;
}

.cols-2 .column-1
{
width:46%;
float:left;
}

.cols-2 .column-2
{
width:46%;
float:right;
margin:0
}

.cols-3 .column-1
{
float:left;
width:29%;
padding:0px 5px;
margin-right:4%

}
.cols-3 .column-2
{
float:left;
width:29%;
margin-left:0;
padding:0px 5px
}
.cols-3 .column-3
{
float:right;
width:29%;
padding:0px 5px
}

.items-row
{
overflow:hidden;
margin-bottom:10px !important;
}

.column-1,
.column-2,
.column-3
{
padding:10px 5px
}

.column-2
{
width:55%;
margin-left:40%;
}

.column-3
{
width:30%
}

.blog-more
{
padding:10px 5px
}
/* ++++++++++++++ login ++++++++++++++ */

#login-form
{
padding-top:5px
}

#login-form fieldset
{
padding:0px;

}

#login-form .inputbox
{
padding:2px
}

#login-form fieldset.input
{
padding:10px 0 0 0;
margin:0px 0 10px 5px
}

#login-form label
{
margin-right:10px;
width:8.4em;
display:block;
float:left
}

#form-login-remember label
{
float:none;
width:auto;
display:inline
}

.logout-button
{
margin-top:10px
}

input.button,
button.button,
button.validate
{
cursor:pointer;
padding:3px 5px 3px 7px ;
font-weight:bold;
line-height:1.2em;
font-family:arial;
}

#modlgn-username,
#modlgn-passwd
{
width:9em
}

.module_content #form-login-username label,
.module_content #form-login-password label
{
float:left;
width:5.2em
}

.login-fields
{
margin:10px 0
}

.login-fields label
{
float:left;
width:9em
}

.login-description img,
.logout-description img
{
float:left;
margin-right:20px
}

.login-description,
.logout-description
{
overflow:hidden;
padding-left:5px;
margin:20px 0 10px 0
}

.logout-description
{
margin-bottom:20px
}
/* ########################### contacts ########################### */

.contact
{
padding:0 5px
}

.contact-category
{
padding:0 10px
}

.contact-category #adminForm fieldset.filters
{
border:0;
padding:0
}

.contact-image
{
margin:10px 0;
overflow:hidden;
}

.contact-image img
{
/* as you like
float:right;
float:left */
}
address
{
font-style:normal;
margin:10px 0;

}

address span
{
display:block
}
.contact-address

{
margin:20px 0 10px 0;

}


.contact-email div
{
padding:2px 0;
margin:0 0 10px 0;
}

.contact-email label
{
width:17em;
float:left;

}
span.contact-image
{
margin-bottom:10px;
overflow:hidden;
display:block
}
#contact-textmsg
{padding: 2px 0 10px 0}

#contact-email-copy
{
float:left;
margin-right:10px;

}

.contact .button
{
float:none !important;
clear:left;
display:block;
margin:20px 0 0 0
}

div.search button {
background: url("../images/jf_search_btn.png") no-repeat scroll 0 0 transparent;
border: 0 none;
height: 1.4em;
text-indent: -9999px;
width: 25px;
cursor: pointer;
}

dl.tabs {
float: left;
margin: 50px 0 0 0;
z-index: 50;
clear:both;


}

dl.tabs dt {
float: left;
padding: 4px 10px;
border-left: 1px solid #ccc;
border-right: 1px solid #ccc;
border-top: 1px solid #ccc;
margin-right: 3px;
background: #f0f0f0;
color: #666;
}

dl.tabs dt.open {
background: #F9F9F9;
border-bottom: 1px solid #F9F9F9;
z-index: 100;
color: #000;

}

div.current {
clear: both;
border: 1px solid #ccc;
padding: 10px 10px;
}


div.current dd {
padding: 0;
margin: 0;
}

dl#content-pane.tabs {
margin: 1px 0 0 0;
}


/* ########################## user profile ########################### */

#users-profile-core,
#users-profile-custom
{
margin:10px 0 15px 0;
padding:15px;
}

#users-profile-core dt,
#users-profile-custom dt
{
float:left;
width:12em;
padding:3px 0;


}

#users-profile-core dd,
#users-profile-custom dd
{
padding:3px 0;



}

#member-profile fieldset,
.registration fieldset
{
margin:10px 0 15px 0;
padding:15px;

}

#users-profile-core legend,
#users-profile-custom legend,
.profile-edit legend,
.registration legend
{
font-weight:bold
}

.profile-edit form#member-profile fieldset dd,
.registration form#member-registration fieldset dd
{ float:none; padding:5px 0}

.profile-edit form#member-profile fieldset dd input,
.profile-edit form#member-profile fieldset dd select,
.registration form#member-registration fieldset dd input
{width:17em}
.profile-edit form#member-profile fieldset dt,
.registration form#member-registration fieldset dt
{padding:5px 5px 5px 0; width:13em}


span.optional
{font-size:0.9em}
form fieldset dt {
clear: left;
float: left;
padding: 3px 0;
width: 12em;
}
form fieldset dd {
float: left;
padding: 3px 0;
}
/* ########### Categories list ############ */
.categories-listalphabet ul
{
padding:0;
margin:20px 10px 10px 0;
list-style-type:none;
list-style-position:inside
}
.categories-listalphabet ul li
{
display :inline;
padding:5px;
border-right:solid 1px #ddd
}


.categories-list ul
{list-style-type:none;
margin:0}

.cat-children
{ padding-left:5px
}
.cat-children ul dl dt,
.cat-children ul dl dd
{ display:inline}

.cat-children ul
{list-style-type:none;
margin:0;
padding:0;
}
.cat-children ul
{margin:20px 20px 20px 0;}
.cat-children ul ul
{margin:20px}

.cat-children ul li
{margin:10px 0 10px 0}
#main .category-list
{
padding:0 5px;
display:block;
}

#main .category-list h1
{
margin-left:-5px;
margin-right:-5px;
}

.categories-list
{
padding:0 5px
}

.categories-list ul
{
margin:0px 0 0 20px;
padding:0
}

categories-list ul li
{
padding: 5px;
}

.categories-list ul ul
{
margin-left:15px
}

.categories-list dl dt,
.categories-list dl dd
{
display:inline
}

.category-desc
{
line-height:1.7em;
margin:10px 0;
padding-left:0px
}
/* mod stats */
.stats-module dl
{margin:10px 0 10px 0}
.stats-module dt
{float:left;
margin:0 10px 0 0;
font-weight: bold;
}
.stats-module dt, .stats-module dd
{padding:2px 0 2px 0 }
/* syndicate */
a.feed-link
{
margin-top:15px;
display:block;
text-decoration:none
}

.feed-link img
{border:0}
.reset fieldset,.remind fieldset{
margin-bottom:10px;
}

.form-horizontal .control-group:before, .form-horizontal .control-group:after {
content: "";
display: table;
line-height: 0;
}
.form-horizontal .control-group:after {
clear: both;
}
.form-horizontal .control-group:before, .form-horizontal .control-group:after {
content: "";
display: table;
line-height: 0;
}
.form-horizontal .control-group {
margin-bottom: 18px;
}

legend + .control-group {
margin-top: 18px;
}

.form-horizontal .controls {
margin-left: 180px;
}

.form-horizontal .control-label {
float: left;
text-align: right;
width: 160px;
}

.tooltip {
position: absolute;
z-index: 1030;
display: block;
visibility: visible;
font-size: .7em;
line-height: 1.4em;
opacity: 0;
filter: alpha(opacity=0);
}
.tooltip.in {
opacity: 0.8;
filter: alpha(opacity=80);
}
.tooltip.top {
margin-top: -3px;
padding: 5px 0;
}
.tooltip.right {
margin-left: 3px;
padding: 0 5px;
}
.tooltip.bottom {
margin-top: 3px;
padding: 5px 0;
}
.tooltip.left {
margin-left: -3px;
padding: 0 5px;
}
.tooltip-inner {
max-width: 200px;
padding: 8px;
color: #fff;
text-align: center;
text-decoration: none;
background-color: #000;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
.tooltip-arrow {
position: absolute;
width: 0;
height: 0;
border-color: transparent;
border-style: solid;
}
.tooltip.top .tooltip-arrow {
bottom: 0;
left: 50%;
margin-left: -5px;
border-width: 5px 5px 0;
border-top-color: #000;
}
.tooltip.right .tooltip-arrow {
top: 50%;
left: 0;
margin-top: -5px;
border-width: 5px 5px 5px 0;
border-right-color: #000;
}
.tooltip.left .tooltip-arrow {
top: 50%;
right: 0;
margin-top: -5px;
border-width: 5px 0 5px 5px;
border-left-color: #000;
}
.tooltip.bottom .tooltip-arrow {
top: 0;
left: 50%;
margin-left: -5px;
border-width: 0 5px 5px;
border-bottom-color: #000;
}

@media only screen and (max-device-width: 480px) {
#wrapper {
width: 400px;
}
#jf-slideshow{
display:none;
}
}
Last Edit: 11 Feb 2016 10:29 by .
  • Franziska
  • Page:
  • 1
Time to create page: 0.97 seconds
Thursday 18 April 2024

joomfreak is not affiliated with or endorsed by the Joomla Project or Open Source Matters.
The Joomla logo is used under a limited license granted by Open Source Matters the trademark holder in the United States and other countries.