Additional typography elements

This article describes additional elements used for creating a demo content for the Hotel template.

Informations Hotel block

The hotel informations are based on the following HTML structure:

< ul class = "gk-info" >
< li class = "gk-info-col-2" >
<dl> <dt>Check-in:</dt>
</strong></dd> </dl>
02:00 pm
< dl class = "gk-info-col-2" >
<dt>Check-out:</dt> <dd><strong> </strong></dd> 12:00 am
</dl> </li>
< dl > <dt>Smoking:</dt> <dd>Non-Smoking</dd>
</dl> </li>
<dd> Self parking: € 30.00 </dd>
Valet <dd>: € 50.00 </dd>
</dl> </li>
<dt> Pets : </dt>
<dd> Service animals allowed: Yes </dd>
<dd> Maximum Weight: 50 lbs </dd>
</dl> </li>

Photo grids

Blocks with photos uses a photo grid structure:

< div class = "gk-photo-grid no-margin
figures < >" class = "gk-grid-data-1 sr =" scale up 10% ">
< img src =" images/demo/hotel1.jpg "alt =" "/>
< </figure> =" figures gk-grid-data-1 sr = "scale up 10% 0.15 s and wait" >
< img src = "images/demo/hotel2.jpg" alt = ""/>

Other example of the photo grid:

< div class = "gk-photo-grid offset-left"
< > class = "figures gk-grid-data-1 sr =" scale up 10% ">
< img src =" images/demo/hotel3.jpg "alt =" "/>
Luxury rooms
</figcaption> <figcaption> </figure>

< figure class =" gk-grid-2 "-sr date =" scale up 10% and wait. "
> 15s < img src =" images/demo/hotel5.jpg "alt =" "/>

< </figure> <figcaption>Bathrooms</figcaption> figure class =" gk-grid-2 "-sr date =" scale up 10% and wait. "
> 3s < img src =" images/ Demo/hotel4.jpg "alt =" "/>

Above example uses also the offset-left class which creates a negative left margin.

Newsletter popup

Newsletter popup is a Custom HTML module which uses the following code:

     Sign up to keep in touch!
     Be the first to hear about special offers and exclusive deals from Villa Badiei and our partners.
< form action = "index.php? option = com_acymailing & ctrl =" method = "post" > < input type =
     "email" required  id = "user_email" name = "user [email]" placeholder = "enter email address" > < input type =
     "submit" value = "Submit" id = "gk-newsletter-submit" >
     < input type = "hidden" name = "acyformname" value = "formAcymailing1"/>
     < input type = "hidden" name = "ctrl" value = ""/>
     < input type = "hidden" name = "task" value = "optin"/>
     < input type = "hidden" name = "option" value = "com_acymailing"/> < input type =
     " hidden "name =" visiblelists "value =" "/>
     < input type =" hidden "name =" hiddenlists "value =" 1 "/>
     < input type =" hidden "name =" user [html] "value =" 1 "/>
</form> <
!--Configuration details:> 

<small> Check out our < a href =" # "> Privacy Policy & </a> < a href =" # "> Terms of use </a> < br/>
You can unsubscribe from email list at any time </small>

Footer links

Links at the footer are based on the following HTML structure

< div class = "cols" gk-date-cols = "3" >
    <div> <h3> </h3>
        Quick Links
        < div class = "cols" gk-date-cols = "2" >
            <div> <ul> <li>
                < a href = "#" > Our Hotels </a></li> <li>
                    < a href = "#" > About </a></li> <li>
                    < a href = "#" > Press </a></li> <li>
                    < a href = "#" > Fact Sheet </a></li>
                </ul> </div>

                    <li> < a href = "#" > Contact </a></li> <li>
                    < a href = "#" > Careers
                    < <li> </a></li> a href = "#" > Terms of Use
                    < <li> </a></li> a href = "#" > Privacy Policy </a></li>
                    <li> < a href = "#" > Our Best Rate Promise </a></li> 
                </ul> </div>
    </div> <div>

        < div class = "cols" gk-date-cols = "2" >
                <p>Phone:</p> <p>Fax:</p>
                <p> Reservations : </p> </div>
                <p> (123) 456-7898 </p>
                <p> (123) 456-7898 </p>
                <p> (123) 456-7898 </p>
            </div> </div>
    </div> <div>

        Villa </h3> <p> 844
        Belluci Linden Street Norwood, MA 02062 </p>
        <p> Template Design © by < a href = "" title = "GavickPro" rel = "nofollow" GavickPro > </a>. All rights reserved. </p> </div>

Social footer links

The social icons at the footer uses the following code:

< ul class = "gk-social-links" >
<li> < a href = "#" class = ">< gk-icon-twitter" </i></a></li> > <li> <
a href = "#" class = ">< gk-icon-fb" </i></a></li> > <li> <
a href = "#" class = ">< gk-icon-gplus" </i></a></li> > <li> <
a href = "#" class = ">< gk-icon-> linkedin </i></a></li>
<li> < a href = "#" class = ">< gk-icon-pinterest" </i></a></li> >
Last modification: Tue 30 Jun 2015

NOTE! This site uses cookies and similar technologies.

If you not change browser settings, you agree to it. Learn more

I understand

COOKIE POLICY COOKIE POLICY strives to protect and respect your privacy.
Check out the following information how we protect your information.
If you are using our website, you consent to the use and storage of cookies on your device.
You can still browse our website without cookies. (please visit our section of "HOW to DISABLE cookies").


cookies are text strings that small sites visited by the user to send his Terminal (usually the browser), where they are stored and then transmitted to the same sites the next time they visit the same user. In the course of navigation on a site, you can receive on their terminals even cookies that are sent to web sites or from different servers (the "third party"), which may reside some elements (such as images, maps, sounds, links to specific pages on other domains) on the site that it is visiting.


Technical cookie

cookies are those used solely for the purpose of "making the transmission of a communication over an electronic communications network, or as strictly necessary for the service provider of the information society explicitly requested by the Subscriber or user to provide such service" (see art. 122, paragraph 1, of the code).They are not used for further purposes and are normally installed by the owner or operator of the web site. Can be divided into navigation cookie or session that guarantee normal browsing and using the website.For the installation of these cookies is not required the prior consent of the user, while it is understood the obligation to give notice pursuant to art. 13 of the code, that the site manager by using only those devices, can provide you with the terms it considers more appropriate.

Profiling cookies

profiling cookies are intended to create user profiles and are used in order to send advertising messages in line with the preferences expressed by the same in the context of browsing the net. Because of the particular invasion that these devices can have within the private sphere of the users, the European and Italian legislation provides that the user should be adequately informed about their use and express the right valid consent.

Applies to them art. 122 of the code provides that "where the storage of information in the terminal equipment of a contractor or user or access to information already stored are only allowed on condition that the contractor or the user has given consent after being informed with the simplified mode under art. 13, paragraph 3 "(article 122, paragraph 1, of the code).


cookies you can disable cookies by following the directions provided by major browsers:



Internet Explorer




Log in