Hi there. I can see in your site that the #jf-slideshow div id is missing the height.
You can edit templates/jf_calla-exteriors/css/template.css

Try to find



Change to



bye

Thank you for having responded to me and especially for having spent all this time.
I followed your directions about the height to 1050px missing out on template.css but I have not solved the problem as you can see for yourself on www.enzocriscione.it.
Below you can find all the template.css to help me understand if you can not do anything and the screenshot of the form jf slideshow.

thank you very much
Enzo


/*------------------------------------------------------------------------
# JF_CALLA-EXTERIORS! - JOOMFREAK.COM JOOMLA 2.5 TEMPLATE
# June 2013
# ------------------------------------------------------------------------
# COPYRIGHT: (C) 2013 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
-------------------------------------------------------------------------*/

* {
margin: 0;
padding: 0;
}

body, html {
height: 100%;
}

body
{
background: #fff;
color: #262626;
font-family: misolight;
font-size: 24px;
padding: 0px;
line-height: 1.2em;
}

body.contentpane {
width:auto;
margin:10px;
text-align: left;
}

img {
border: 0 none;
height: auto;
max-width: 100%;
vertical-align: middle;
}

ul {
list-style: none;
}

h1,h2, h3, h4 {
font-weight: normal;
line-height: normal;
}

a {
color: #5c686d;
text-decoration: none;
}

a:hover {
color: #247D99;
text-decoration: none;
}

h4, p {
margin-bottom: 20px;
}

strong {
font-weight: normal;
font-family: misobold;
}

fieldset {
border: none;
margin-bottom: 10px;
}

label {
display: block;
}

input, textarea {
background-color: #fafafa;
border: 1px solid #eaeaea;
padding: 4px;
font-family: misolight;
font-size: 24px;
}

button, .button {
background: url(../images/read-more.png) no-repeat;
border: none;
color: #fff;
cursor: pointer;
display: inline-block;
font-family: misobold;
font-size: 18px;
line-height: 31px;
height: 31px;
width: 151px;
padding: 0;
margin: 30px 0;
text-transform: uppercase;
}

.componentheading, .contentheading {
color: #262626;
font-family: misobold;
font-size: 36px;
padding-bottom: 25px;
text-transform: uppercase;
}

#system-message, .reset {
margin: 10px;
}

html[xmlns] .clearfix {
display: block;
}

.clearfix:after {
clear: both;
content: ".";
display: block;
height: 0;
line-height: 0;
visibility: hidden;
}

.clearfix:before, .clearfix:after {
content: "";
display: table;
line-height: 0;
}

#jf-wrapper {
overflow: hidden;
position: relative;
}

.wrap {
clear: both;
width: 100%;
}

.main {
margin: 0 auto;
position: relative;
width: 960px;
}

/* HEADER */
#jf-header {
position: fixed;
top: 0;
z-index: 99;
height: 70px;
transition: background 0.2s linear 0s;
}

.home #jf-header.transparent {
background: none repeat scroll 0 0 rgba(0, 0, 0, 0.;
}

#jf-header {
background: url(../images/header-bg.png);
}

.home #jf-header {
background: none;
}

#jf-header .main {
padding: 12px 0 0;
position: relative;
}

#jf-header h1#logo {
float: left;
font-weight: normal;
}

#jf-header h1#logo a {
color: #fff;
display: block;
font-family: misoregular;
font-size: 40px;
line-height: normal;
}

#jf-header h1#logo a:hover {
text-decoration: none;
}

#jf-mainnav {
float: right;
border-bottom: 1px solid #fff;
position: relative;
padding: 3px 0 0;
}

#jf-mainnav ul:after {
clear: both;
content: " ";
display: block;
height: 0;
visibility: hidden;
}

#jf-mainnav ul.menu li {
cursor: pointer;
display: block;
float: left;
margin-right: 25px;
}

#jf-mainnav ul.menu li a {
color: #fff;
font-family: misobold;
font-size: 18px;
text-transform: uppercase;
}

#jf-mainnav .blob {
position: absolute;
height: 1px;
bottom: -1px;
z-index: 99;
}

/* SLIDESHOW */
#jf-slideshow {
background-clip: border-box;
background-color: #00446D;
background-image: url(../images/banner.jpg);
background-origin: padding-box;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
background-attachment: fixed;
position: relative;
z-index: 50;
height: 1050px;
}

#jf-slideshow .main {
color: #fff;
font-family: misoregular;
font-size: 36px;
font-weight: normal;
text-transform: uppercase;
margin-bottom: 40px;
line-height: normal;
text-align: center;
}

#jf-slideshow .main h1 {
background: url(../images/linestar.png) no-repeat top center;
font-size: 110px;
font-weight: normal;
font-family: misobold;
text-transform: uppercase;
padding-top: 40px;
line-height: normal;
}

#jf-slideshow .main a {
background: url(../images/read-more.png) no-repeat;
color: #fff;
display: inline-block;
font-family: misobold;
font-size: 24px;
height: 31px;
line-height: 31px;
text-align: left;
text-indent: 20px;
text-transform: uppercase;
width: 151px;
}

/* jf-home-c */
#jf-home-c {
background-color: #fff;
color: #404040;
font-family: misoregular;
font-size: 18px;
}

#home-c-l {
float: left;
}

#home-c-r {
float: right;
}

#jf-home-c h3, #jf-latest h3, .moduletable h3, h3.itemCommentsCounter, h3 {
color: #262626;
font-family: misobold;
font-size: 36px;
padding-bottom: 25px;
text-transform: uppercase;
}

#jf-home-c h4 {
font-family: misobold;
font-size: 24px;
}

#jf-home-c .main, #jf-latest .main {
padding: 70px 0;
}

#home-c-r li {
padding: 0 0 20px 85px;
}

#home-c-r li.phone {
background: url(../images/phone-icon.png) no-repeat;
}

#home-c-r li.connect {
background: url(../images/connect-icon.png) no-repeat;
}

#home-c-r li.book {
background: url(../images/book-icon.png) no-repeat;
}

#home-c-r li.mobile {
background: url(../images/mobile-icon.png) no-repeat 15px 0;
}

#home-c-r h4 {
margin-bottom: 0;
}

/* LATEST */

#jf-latest {
background-clip: border-box;
background-color: #000;
background-image: url(../images/latest.png);
background-origin: padding-box;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
background-attachment: fixed;
color: #fff;
}

#jf-latest h3 {
color: #fff;
}

#jf-latest li, #jf-news li {
float: left;
width: 280px;
margin-right: 60px;
}

li.lastItem {
margin-right: 0 !important;
}

div.k2ItemsBlock ul li .moduleItemImage {
display: block;
height: 140px;
overflow: hidden;
margin: 25px 0 50px;
position: relative;
}

div.k2ItemsBlock ul li .moduleItemImage img {
width: 100%;
}

#jf-latest div.k2ItemsBlock ul li .moduleItemTitle {
color: #fff;
}

/* NEWS */
#jf-news {
background-color: #fff;
color: #404040;
font-family: misoregular;
font-size: 18px;
}

#jf-news .main {
padding: 60px 0;
}

#jf-news div.k2ItemsBlock ul li .moduleItemTitle {
color: #404040;
}

/* CONTENT */
#jf-content, #jf-home-c, #jf-latest, #jf-news, #jf-map {
position: relative;
z-index: 50;
}

#jf-content {
background-color: #fff;
}

#jf-content .main {
padding: 120px 0 60px;
}

.home #jf-content .main {
padding: 0;
}

/* CONTACT */
#jf-contact {
background: #f0f0f0 url(../images/contact-bg.png) repeat-x;
position: relative;
z-index: 49;
}

#jf-contact .main {
color: #313131;
font-family: misobold;
font-size: 24px;
line-height: 1.3;
padding: 50px 0;
text-align: center;
}

#jf-contact h3 {
color: #313131;
font-family: misobold;
font-size: 110px;
text-transform: uppercase;
}

#jf-contact .custom a {
background: url(../images/contact-button.png) no-repeat;
color: #fff;
display: inline-block;
font-family: misobold;
font-size: 24px;
height: 31px;
width: 151px;
text-transform: uppercase;
}

/* FOOTER */
#jf-footer {
background-color: #313131;
color: #fff;
font-family: misoregular;
text-align: center;
min-height: 452px;
position: relative;
}

#jf-footer .main-inner1 {
background: url(../images/linestar-footer.png) no-repeat center 40px;
padding: 150px 0 0;
position: fixed;
bottom: 40px;
width: 960px;
z-index: 0;
}

#jf-footer h3 {
color: #fff;
font-family: misoregular;
font-size: 72px;
text-transform: none;
}

#jf-footer strong {
font-family: misobold;
}

#jf-footer li {
display: inline-block;
font-size: 36px;
}

#jf-footer li strong {
color: #247d99;
}

.moduletable-social {
margin-top: 60px;
}

.moduletable-social li {
margin: 0 15px;
}

#jf-social {
margin-top: 60px;
}

#jf-social li {
display: inline-block !important;
margin: 0 15px;
}

#jf-social li a {
display: block;
height: 33px;
width: 33px;
}

#jf-social li a.button-facebook {
background: url(../images/facebook.png) no-repeat;
}

#jf-social li a.button-flickr {
background: url(../images/flickr.png) no-repeat;
}

#jf-social li a.button-google {
background: url(../images/google.png) no-repeat;
}

#jf-social li a.button-skype {
background: url(../images/skype.png) no-repeat;
}

#jf-social li a.button-twitter {
background: url(../images/twitter.png) no-repeat;
}

#jf-social li a.button-pinterest {
background: url(../images/pinterest.png) no-repeat;
}

#jf-social li a.button-youtube {
background: url(../images/youtube.png) no-repeat;
}

#jf-footer .copyright {
position: fixed;
right: 0;
bottom: 200px;
font-size: 18px;
color: #fefefe;
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
-ms-transform:rotate(-90deg); /* IE 9 */
}

#jf-footer .copyright p {
display: inline;
}

#jf-footer .copyright a {
color: #fefefe;
font-family: misobold;
font-size: 18px;
}

/* K2 */
div.itemListPortfolio div.itemContainer {
margin-right: 60px;
width:280px !important;
}

div.itemListPortfolio span.catItemImage {height:140px;overflow:hidden;position:relative}

div.itemListPortfolio span.catItemImage a:hover span.catItemHover, div.itemListPortfolio span.catItemImage a:hover span.catItemHoverIcon {
background: url(../images/overlay.png);
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
}

div.itemListPortfolio span.catItemImage a:hover span.catItemHoverIcon {
background: url(../images/blog-hover.png) no-repeat center center;
}

div.itemListBlog div.catItemHeader h3.catItemTitle {
font-size: 36px;
padding: 0 0 10px;
text-transform: uppercase;
}

div.itemListBlog div#itemListPrimary span.catItemImage {height:220px;overflow:hidden;}

div.itemListBlog div.itemContainer {
margin-right: 80px;
width:440px !important;
}

div.itemListBlog div#itemListLeading div.itemContainer {
float: none;
margin: 0 !important;
width: 100% !important;
}

div.itemListBlog div.groupLeading {
border-bottom: 1px solid #E1E1E1;
}

div.itemListBlog div.groupPrimary {
background: url(../images/blog-spacer.png) repeat-x left bottom;
}

div.itemListBlog div.groupPrimary div.catItemHeader {
padding-top: 30px;
}

div#itemListLinks h4 {
font-family: misobold;
font-size: 36px;
text-transform: uppercase;
}

div.itemListBlog div.groupLinks h3.catItemTitle {
background: url(../images/arrow.png) no-repeat left 12px;
font-family: misobold;
font-size: 24px;
line-height: 1.3;
padding: 0 0 0 15px;
text-transform: none;
}

div.itemListBlog span.catItemImage a:hover span.catItemHover, div.k2ItemsBlock ul li .moduleItemImage:hover span.moduleItemImageHover {
background: url(../images/blog-hover.png) no-repeat center center;
display: block;
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
}

div.itemHeader div.itemHeaderRight {
float: right;
font-family: misolight;
font-size: 14px;
margin-top: 5px;
text-align: right;
text-transform: uppercase;
}

div.itemImageTitle {
background-color: #313131;
line-height: 30px;
padding: 0 10px;
}

span.itemImage a:hover span.itemImageHover, span.itemImage a:hover span.itemImageHoverIcon {
background: url(../images/overlay.png);
display: block;
position: absolute;
height: 100%;
width: 100%;
top: 0;
left: 0;
}

span.itemImage a:hover span.itemImageHoverIcon {
background: url(../images/blog-hover.png) no-repeat center center;
}

div.itemRelated ul li {
float: left;
width: 280px;
margin-right: 60px;
}

div.itemRelated ul li.last {
margin-right: 0 !important;
}

div.itemRelated span.itemRelImage {
display: block;
height: 140px;
overflow: hidden;
}

div.addthis_toolbox a {
display: inline-block;
background-color: #c5c5c5;
margin-right: 40px;
margin-bottom: 5px;
}

div.addthis_toolbox a:hover {
background-color: #004088;
}

.form-right {
float: right;
}

.form-left {
float: left;
}

/* COM_CONTENT */
.item-page h1, .item-page h2 {
font-family: misobold;
font-size: 36px;
margin-bottom: 20px;
text-transform: uppercase;
}

/* Bootstrap Css Map Fix*/
#googleMap img {
max-width: none;
}
/* Bootstrap Css Map Fix*/
#googleMap label {
width: auto; display:inline;
}

#contact-form label#jform_contact_name-lbl {
display: block;
margin: 30px 0 0;
}

#contact-form label#jform_contact_email-lbl{
display: block;
margin: 30px 0 0;
}

#contact-form label#jform_contact_email_copy-lbl {
display: inline-block;
margin: 30px 0 0;
}

#contact-form label#jform_contact_message-lbl {
display: block;
margin: 30px 0 0;
}

#contact-form input#jform_contact_name, #contact-form input#jform_contact_email {
display: block;
margin: 0;
width: 432px;
}

#contact-form textarea {
height: 120px;
width: 432px;
}

.contact-miscinfo p {
margin: 0;
}

input.invalid, textarea.invalid {
border: 1px solid #CF1919;
}

/* Testimonial */
#jf-testimonial {
background: url(../images/quote-open.png) no-repeat;
font-size: 36px;
line-height: normal;
margin-top: 60px;
text-align: center;
}

.testimonial-inner {
background: url(../images/quote-close.png) no-repeat right bottom;
padding: 0 140px;
}

#jf-testimonial strong {
font-family: misobold;
font-weight: normal;
font-size: 18px;
}

/* Mobile Menu */
#jf-menu, a.gotomenu {
display: none;
}

/* #Base 960 Grid
================================================== */
.main {
width: 960px;
}

.colspan2 {
width: 440px;
}

.colspan3 {
width: 280px;
}

/* #Tablet (Portrait)
================================================== */

/* Note: Design for a width of 768px */

@media (min-width: 768px) and (max-width: 959px) {
.main, #jf-footer .main-inner1 {
width: 748px;
}

.colspan2 {
margin: 0 10px !important;
width: 354px !important;
}

.colspan3 {
margin: 0 10px !important;
width: 354px !important;
}

#jf-latest li, #jf-news li, div.k2ItemsBlock ul li.lastItem {
margin: 0 10px !important;
}

.clearList2, .clr2 {
clear: both;
}

.clearList, .clr3 {
clear: none !important;
}

div.itemListPortfolio div.itemContainer, div.itemListBlog div.itemContainer {
margin: 0 10px !important;
width: 354px !important;
}

div.itemCommentsForm form input.inputbox, div.itemCommentsForm form textarea.inputbox, #contact-form textarea, #contact-form input#jform_contact_name, #contact-form input#jform_contact_email {
width: 346px;
}

#jf-contact h3 {
font-size: 90px;
}

#jf-footer{
font-size: 18px;
}

#jf-footer .main-inner1 {
padding: 135px 0 0;
bottom: 30px;
}

#jf-social {
margin-top: 20px;
}

#jf-footer .copyright {
margin-top: 20px;
position: static;
transform: none;
-webkit-transform: none;
-moz-transform: none;
-o-transform: none;
-ms-transform: none; /* IE 9 */
}

div.addthis_toolbox a {
margin-right: 30px;
}
}


/* #Mobile (Portrait)
================================================== */

/* Note: Design for a width of 320px */

@media (max-width: 767px) {
.main, #jf-footer .main-inner1 {
width: 300px;
}
.colspan2 {
width: 100% !important;
}

.colspan3 {
width: 100% !important;
}

#jf-header {
position: absolute;
left: 0;
top: 0;
}

#jf-mainnav {
display: none;
}

a.gotomenu {
display: block;
background: #247D99 url(../images/plus.png) no-repeat center center;
border-radius: 5px 5px 5px 5px;
height: 26px;
position: absolute;
right: 0;
top: 20px;
width: 26px;
z-index: 60;
}

#jf-menu {
display: block;
background-color: #fff;
position: relative;
z-index: 49;
}

#jf-menu .main {
padding: 50px 0;
}

#jf-menu ul.menu {
border-top: 1px solid #404040;
}

#jf-menu ul.menu li {
border-bottom: 1px solid #404040;
padding: 5px 0;
}

#jf-menu ul.menu li a {
color: #404040;
font-family: misobold;
font-size: 18px;
text-transform: uppercase;
}

#jf-menu ul.menu li a:hover {
color: #247D99;
}

#jf-slideshow .main {
font-size: 18px;
}

#jf-slideshow .main h1 {
font-size: 52px;
}

div.itemListPortfolio div.itemContainer, div.itemListBlog div.itemContainer {
width: 100% !important;
margin-right: 0;
}

.form-left, .form-right {
float: none;
}

div.itemCommentsForm form input.inputbox, div.itemCommentsForm form textarea.inputbox, #contact-form textarea, #contact-form input#jform_contact_name, #contact-form input#jform_contact_email {
width: 290px;
}

div.itemCommentsForm form textarea.inputbox {
float: none;
}

#jf-contact h3 {
font-size: 52px;
}

#jf-footer{
font-size: 18px;
}

#jf-footer .main-inner1 {
padding: 135px 0 0;
bottom: 30px;
}

#jf-footer li {
font-size: 18px;
}

#jf-footer h3 {
font-size: 36px;
}

#jf-social {
margin-top: 20px;
}

#jf-footer .copyright {
margin-top: 20px;
position: static;
font-size: 14px;
transform: none;
-webkit-transform: none;
-moz-transform: none;
-o-transform: none;
-ms-transform: none; /* IE 9 */
}

#jf-footer .copyright a {
font-size: 14px;
}

.testimonial-inner {
padding: 0 60px;
}

div.addthis_toolbox a {
margin-right: 5px;
}

}


/* #Mobile (Landscape)
================================================== */

/* Note: Design for a width of 480px */

@media (min-width: 480px) and (max-width: 767px) {
.main, #jf-footer .main-inner1 {
width: 420px;
}

.colspan2 {
width: 100% !important;
}

.colspan3 {
width: 100% !important;
}

div.itemListPortfolio div.itemContainer, div.itemListBlog div.itemContainer {
width: 100% !important;
margin-right: 0;
}

.form-left, .form-right {
float: none;
}

div.itemCommentsForm form input.inputbox, div.itemCommentsForm form textarea.inputbox, #contact-form textarea, #contact-form input#jform_contact_name, #contact-form input#jform_contact_email {
width: 410px;
}

div.itemCommentsForm form textarea.inputbox {
float: none;
}

#jf-footer .main-inner1 {
background-position: center 30px;
}

#jf-social li {
margin: 0 12px;
}

div.addthis_toolbox a {
margin-right: 20px;
}

}

@media (min-width: 481px) and (max-width: 599px) {
#jf-footer {
min-height: 320px;
}

#jf-footer .main-inner1 {
bottom: 10px;
padding: 105px 0 0;
}

#jf-footer p {
margin-bottom: 10px;
}

#jf-social, #jf-footer .copyright {
margin-top: 0;
}
}

Hi. I installed the template JF Calla Exteriors, but did no get far enough to enjoy it (www.europat.info). I cant manage to show the slideshow (already installed, position slideshow, added picture urls (images/img1.jpg and so on)) but it still doesnt work. I use Joomla 3.3.0.

Neither I get the Logo in the logo position. I addeda new module (empty module), and the jpg in it. but it doesnt show.

I also did the instruction regarding height of the image:

#jf-slideshow {
background-clip: border-box;
background-color: #00446D;
background-image: url(../images/banner.jpg);
background-origin: padding-box;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
background-attachment: fixed;
position: relative;
z-index: 50;
height: 1050px;
}

but it didnt solve my problem.


I have the page multilingual or I intend to have it. added the code


#jf-mainnav .mod-languages { float: right; display: inline; margin-left: 30px; }

#jf-mainnav ul.menu { float: left; display: inline; }

to /templates/jf_calla-exteriors/css/template.css and changed the module position of language module to mainmenu.

It shows them under each other, but it aint a good solution. Should I change something in module class suffix or somewhere else?

I hope to get helpful and step by step instruction how to solve these problems thanx alot in advance for your help.