contact section background, logos width

This commit is contained in:
Arvind Tiwari 2017-11-29 02:56:31 +05:30
parent 1d3307043e
commit bb8195bc0a
7 changed files with 79 additions and 52 deletions

View file

@ -13,6 +13,14 @@ body {
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif; font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
} }
.row-eq-height {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
flex-wrap: wrap;
}
.text-muted { .text-muted {
color: #494949; color: #494949;
font-family: 'Raleway' , "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif; font-family: 'Raleway' , "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
@ -345,7 +353,7 @@ section {
section h2.section-heading { section h2.section-heading {
margin-top: 0; margin-top: 0;
margin-bottom: 15px; margin-bottom: 15px;
font-size: 18px; font-size: 22px;
color: #494949; color: #494949;
} }
@ -705,10 +713,16 @@ aside.clients img {
} }
section#contact { section#contact {
background-color: #222; position: relative;
background-image: url(../img/map-image.png); background: rgba(0,0,0,0.75);
background-position: center; }
background-repeat: no-repeat;
section#contact .bg_img {
filter: blur(1px);
}
section#contact a {
color: #79bcf7;
} }
section#contact .section-heading { section#contact .section-heading {
@ -717,8 +731,11 @@ section#contact .section-heading {
} }
@media(max-width:767px) { @media(max-width:767px) {
aside.clients img {
margin: 20px auto;
}
section#contact .section-heading { section#contact .section-heading {
font-size: 20px; font-size: 24px;
} }
section#contact .intro-smallcap { section#contact .intro-smallcap {
font-size: 18px; font-size: 18px;
@ -952,7 +969,16 @@ section h3.section-comment {
font-family:'Raleway' , Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif; font-family:'Raleway' , Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
font-size : 20px; font-size : 20px;
font-weight : 100; font-weight : 100;
lign-heignt: 2px;
color : #666; color : #666;
text-align : center; text-align : center;
} }
@media (max-width: 767px) {
.carousel-text {
height: 220px;
overflow: scroll;
}
.carousel-author {
height: 72px;
}
}

View file

@ -165,17 +165,6 @@
justify-content: flex-end; justify-content: flex-end;
} }
.header_slider > .carousel .bg_img {
position: absolute;
top: 0;
left: 0;
z-index: -1;
width: 100%;
height: 100%;
background-size: cover;
background-position: center;
}
.header_slider .intro-cap { .header_slider .intro-cap {
text-align: right; text-align: right;
line-height: 1.1; line-height: 1.1;
@ -226,6 +215,17 @@
} }
} }
.bg_img {
position: absolute;
top: 0;
left: 0;
z-index: -1;
width: 100%;
height: 100%;
background-size: cover;
background-position: center;
}
.timeline>li .timeline-panel { .timeline>li .timeline-panel {
display: flex; display: flex;
flex-direction: column; flex-direction: column;

View file

@ -2,6 +2,7 @@
{% load i18n %} {% load i18n %}
<section id="contact"> <section id="contact">
<div class="bg_img" style="background-image:url({% static 'digitalglarus/img/header_bg_2.png' %})"></div>
<div class="container"> <div class="container">
<div class="wow fadeInDown"> <div class="wow fadeInDown">
<div class="text-center wow fadeInDown"> <div class="text-center wow fadeInDown">
@ -12,13 +13,13 @@
<strong>{{ message }}</strong> <strong>{{ message }}</strong>
</div> </div>
{% endfor %} {% endfor %}
<h2 class="section-heading sm_left">{% trans "Contact Us" %}</h2> <h2 class="section-heading">{% trans "Contact Us" %}</h2>
<h3 class="intro-smallcap sm_left" style="line-height: 1.2;"> <h3 class="intro-smallcap sm_left" style="line-height: 1.2;">
{% trans "Join us at" %} <a href="{% url 'digitalglarus:landing' %}">{% trans "Digital Glarus" %}</a>, {% trans "a great co-working space in the middle of Alps!" %} <br> {% trans "Join us at" %} <a href="{% url 'digitalglarus:landing' %}">{% trans "Digital Glarus" %}</a>, {% trans "a great co-working space in the middle of Alps!" %} <br>
{% trans "You can contact us at" %} {% trans "You can contact us at" %}
</h3> </h3>
<h3 class="intro-smallcap sm_left"> <h3 class="intro-smallcap sm_left">
<a href="mailto:info@ungleich.ch"><i class="fa fa-envelope"></i> <strong>info@ungleich.ch</strong></a> <a href="mailto:info@ungleich.ch"><i class="fa fa-envelope"></i> info@ungleich.ch</a>
</h3> </h3>
<h3 class="intro-smallcap sm_left"><i class="fa fa-phone"></i> (044) 534-66-22</h3> <h3 class="intro-smallcap sm_left"><i class="fa fa-phone"></i> (044) 534-66-22</h3>

View file

@ -4,7 +4,7 @@
<section id="portfolio" class="bg-light-gray"> <section id="portfolio" class="bg-light-gray">
<div class="container"> <div class="container">
<div class="text-center wow fadeInUp"> <div class="text-center wow fadeInUp">
<h2 class="section-heading sm_left">{% trans "Our Products" %}</h2> <h2 class="section-heading">{% trans "Our Products" %}</h2>
<h3 class="section-subheading text-muted sm_left" style="line-height: 1.5;">{% blocktrans %}Our products include an innovative datacenter,<br>affordable VM hosting, and high speed fiber internet for canton Glarus.{% endblocktrans %}</h3> <h3 class="section-subheading text-muted sm_left" style="line-height: 1.5;">{% blocktrans %}Our products include an innovative datacenter,<br>affordable VM hosting, and high speed fiber internet for canton Glarus.{% endblocktrans %}</h3>
</div> </div>
<div class="row"> <div class="row">

View file

@ -4,7 +4,7 @@
<section id="services"> <section id="services">
<div class="container"> <div class="container">
<div class="text-center wow fadeInDown"> <div class="text-center wow fadeInDown">
<h2 class="section-heading sm_left">{% trans "our services" %}</h2> <h2 class="section-heading">{% trans "our services" %}</h2>
<h3 class="section-subheading text-muted sm_left"> <h3 class="section-subheading text-muted sm_left">
{% trans "We support our clients in all areas of Unix infrastructure." %}<br/> {% trans "We support our clients in all areas of Unix infrastructure." %}<br/>
{% trans "Our top notch configuration management is refreshingly simple and reliable." %} {% trans "Our top notch configuration management is refreshingly simple and reliable." %}

View file

@ -2,112 +2,112 @@
<aside class="clients"> <aside class="clients">
<div class="container"> <div class="container">
<div class="row"> <div class="row row-eq-height">
<div class="col-xs-3 col-md-3"> <div class="col-xs-6 col-md-3">
<a href="#"> <a href="#">
<img src="{% static 'ungleich_page/img/logos/envato.jpg' %}" class="img-responsive img-centered" alt=""> <img src="{% static 'ungleich_page/img/logos/envato.jpg' %}" class="img-responsive img-centered" alt="">
</a> </a>
</div> </div>
<div class="col-xs-3 col-md-3"> <div class="col-xs-6 col-md-3">
<a href="#"> <a href="#">
<img src="{% static 'ungleich_page/img/logos/designmodo.jpg' %}" alt="" class="img-responsive img-centered" height="51"> <img src="{% static 'ungleich_page/img/logos/designmodo.jpg' %}" alt="" class="img-responsive img-centered" height="51">
</a> </a>
</div> </div>
<div class="col-xs-3 col-md-3"> <div class="col-xs-6 col-md-3">
<a href="#"> <a href="#">
<img src="{% static 'ungleich_page/img/logos/themeforest.jpg' %}" class="img-responsive img-centered" alt=""> <img src="{% static 'ungleich_page/img/logos/themeforest.jpg' %}" class="img-responsive img-centered" alt="">
</a> </a>
</div> </div>
<div class="col-xs-3 col-md-3"> <div class="col-xs-6 col-md-3">
<a href="#"> <a href="#">
<img src="{% static 'ungleich_page/img/logos/creative-market.jpg' %}" class="img-responsive img-centered" alt=""> <img src="{% static 'ungleich_page/img/logos/creative-market.jpg' %}" class="img-responsive img-centered" alt="">
</a> </a>
</div> </div>
</div> </div>
<div class="row"> <div class="row row-eq-height">
<div class="col-xs-3 col-md-3"> <div class="col-xs-6 col-md-3">
<a href="#"> <a href="#">
<img src="{% static 'ungleich_page/img/logos/logobig.jpg' %}" alt="" class="img-responsive img-centered" height="61" width="196"> <img src="{% static 'ungleich_page/img/logos/logobig.jpg' %}" alt="" class="img-responsive img-centered" height="61" width="196">
</a> </a>
</div> </div>
<div class="col-xs-3 col-md-3"> <div class="col-xs-6 col-md-3">
<a href="#"> <a href="#">
<img src="{% static 'ungleich_page/img/logos/Gentoo-site_logo.png' %}" alt="" class="img-responsive img-centered" height="50"> <img src="{% static 'ungleich_page/img/logos/Gentoo-site_logo.png' %}" alt="" class="img-responsive img-centered" height="50">
</a> </a>
</div> </div>
<div class="col-xs-3 col-md-3"> <div class="col-xs-6 col-md-3">
<a href="#"> <a href="#">
<img src="{% static 'ungleich_page/img/logos/debian.jpg' %}" alt="" class="img-responsive img-centered" height="36" width="145"> <img src="{% static 'ungleich_page/img/logos/debian.jpg' %}" alt="" class="img-responsive img-centered" height="36" width="145">
</a> </a>
</div> </div>
<div class="col-xs-3 col-md-3"> <div class="col-xs-6 col-md-3">
<a href="#"> <a href="#">
<img src="{% static 'ungleich_page/img/logos/CentOS.jpg' %}" alt="" class="img-responsive img-centered" height="50" width="147"> <img src="{% static 'ungleich_page/img/logos/CentOS.jpg' %}" alt="" class="img-responsive img-centered" height="50" width="147">
</a> </a>
</div> </div>
</div> </div>
<div class="row"> <div class="row row-eq-height">
<div class="col-xs-3 col-md-3"> <div class="col-xs-6 col-md-3">
<a href="#"> <a href="#">
<img src="{% static 'ungleich_page/img/logos/cdistbyungleich.jpg' %}" alt="" class="img-responsive img-centered" height="50" width="101"> <img src="{% static 'ungleich_page/img/logos/cdistbyungleich.jpg' %}" alt="" class="img-responsive img-centered" height="50" width="101">
</a> </a>
</div> </div>
<div class="col-xs-3 col-md-3"> <div class="col-xs-6 col-md-3">
<a href="#"> <a href="#">
<img src="{% static 'ungleich_page/img/logos/Puppet.png' %}" alt="" class="img-responsive img-centered" height="50" width="161"> <img src="{% static 'ungleich_page/img/logos/Puppet.png' %}" alt="" class="img-responsive img-centered" height="50" width="161">
</a> </a>
</div> </div>
<div class="col-xs-3 col-md-3"> <div class="col-xs-6 col-md-3">
<a href="#"> <a href="#">
<img src="{% static 'ungleich_page/img/logos/freebsd.png' %}" alt="" class="img-responsive img-centered" height="58" width="175"> <img src="{% static 'ungleich_page/img/logos/freebsd.png' %}" alt="" class="img-responsive img-centered" height="58" width="175">
</a> </a>
</div> </div>
<div class="col-xs-3 col-md-3"> <div class="col-xs-6 col-md-3">
<a href="#"> <a href="#">
<img src="{% static 'ungleich_page/img/logos/NetBSD.png' %}" alt="" class="img-responsive img-centered" height="60" width="85"> <img src="{% static 'ungleich_page/img/logos/NetBSD.png' %}" alt="" class="img-responsive img-centered" height="60" width="85">
</a> </a>
</div> </div>
</div> </div>
<div class="row"> <div class="row row-eq-height">
<div class="col-xs-3 col-md-3"> <div class="col-xs-6 col-md-3">
<a href="#"> <a href="#">
<img src="{% static 'ungleich_page/img/logos/openbsd.png' %}" alt="" class="img-responsive img-centered" height="50" width="196"> <img src="{% static 'ungleich_page/img/logos/openbsd.png' %}" alt="" class="img-responsive img-centered" height="50" width="196">
</a> </a>
</div> </div>
<div class="col-xs-3 col-md-3"> <div class="col-xs-6 col-md-3">
<a href="#"> <a href="#">
<img src="{% static 'ungleich_page/img/logos/postsql.jpg' %}" alt="" class="img-responsive img-centered" height="72" width="197"> <img src="{% static 'ungleich_page/img/logos/postsql.jpg' %}" alt="" class="img-responsive img-centered" height="72" width="197">
</a> </a>
</div> </div>
<div class="col-xs-3 col-md-3"> <div class="col-xs-6 col-md-3">
<a href="#"> <a href="#">
<img src="{% static 'ungleich_page/img/logos/mysql.png' %}" alt="" class="img-responsive img-centered" height="59" width="130"> <img src="{% static 'ungleich_page/img/logos/mysql.png' %}" alt="" class="img-responsive img-centered" height="59" width="130">
</a> </a>
</div> </div>
<div class="col-xs-3 col-md-3"> <div class="col-xs-6 col-md-3">
<a href="#"> <a href="#">
<img src="{% static 'ungleich_page/img/logos/apache.png' %}" alt="" class="img-responsive img-centered" height="50" width="173"> <img src="{% static 'ungleich_page/img/logos/apache.png' %}" alt="" class="img-responsive img-centered" height="50" width="173">
</a> </a>
</div> </div>
</div> </div>
<div class="row"> <div class="row row-eq-height">
<div class="col-xs-3 col-md-3"> <div class="col-xs-6 col-md-3">
<a href="#"> <a href="#">
<img src="{% static 'ungleich_page/img/logos/opennebula.png' %}" alt="" class="img-responsive img-centered" height="50" width="196"> <img src="{% static 'ungleich_page/img/logos/opennebula.png' %}" alt="" class="img-responsive img-centered" height="50" width="196">
</a> </a>
</div> </div>
<div class="col-xs-3 col-md-3"> <div class="col-xs-6 col-md-3">
<a href="#"> <a href="#">
<img src="{% static 'ungleich_page/img/logos/gluster.png' %}" alt="" class="img-responsive img-centered" height="51" width="185"> <img src="{% static 'ungleich_page/img/logos/gluster.png' %}" alt="" class="img-responsive img-centered" height="51" width="185">
</a> </a>
</div> </div>
<div class="col-xs-3 col-md-3"> <div class="col-xs-6 col-md-3">
<a href="#"> <a href="#">
<img src="{% static 'ungleich_page/img/logos/ceph.jpg' %}" alt="" class="img-responsive img-centered" height="40" width="145"> <img src="{% static 'ungleich_page/img/logos/ceph.jpg' %}" alt="" class="img-responsive img-centered" height="40" width="145">
</a> </a>
</div> </div>
<div class="col-xs-3 col-md-3"> <div class="col-xs-6 col-md-3">
<a href="#"> <a href="#">
<img src="{% static 'ungleich_page/img/logos/qemu.png' %}" alt="" class="img-responsive img-centered" height="44" width="133"> <img src="{% static 'ungleich_page/img/logos/qemu.png' %}" alt="" class="img-responsive img-centered" height="44" width="133">
</a> </a>

View file

@ -11,7 +11,7 @@
<div class="row"> <div class="row">
<div class="col-sm-10 col-sm-offset-1 wow fadeInDown"> <div class="col-sm-10 col-sm-offset-1 wow fadeInDown">
<!-- start:recommendationSlider --> <!-- start:recommendationSlider -->
<div id="carousel-recommendation-ungleich" class="carousel slide ungleich ungleich-gallery ungleich-gallery-text-carousel" data-ride="carousel" data-interval="3000"> <div id="carousel-recommendation-ungleich" class="carousel slide ungleich ungleich-gallery ungleich-gallery-text-carousel" data-interval="3000">
<!-- Indicators --> <!-- Indicators -->
<ol class="carousel-indicators"> <ol class="carousel-indicators">
<li data-target="#carousel-recommendation-ungleich" data-slide-to="0" class="active"></li> <li data-target="#carousel-recommendation-ungleich" data-slide-to="0" class="active"></li>
@ -39,7 +39,7 @@
than before." than before."
{% endblocktrans %} {% endblocktrans %}
</p> </p>
<p class="text-center"> <p class="text-center carousel-author">
<strong>- Luciano Franceschina</strong>, CTO at Teralytics <strong>- Luciano Franceschina</strong>, CTO at Teralytics
</p> </p>
</div> </div>
@ -55,7 +55,7 @@
saving, which is crucial for IT companies like ours." saving, which is crucial for IT companies like ours."
{% endblocktrans %} {% endblocktrans %}
</p> </p>
<p class="text-center"> <p class="text-center carousel-author">
<strong> - Beat Seeliger </strong>, CTO at Panter AG <strong> - Beat Seeliger </strong>, CTO at Panter AG
</p> </p>
</div> </div>
@ -76,7 +76,7 @@
solid infrastructures." solid infrastructures."
{% endblocktrans %} {% endblocktrans %}
</p> </p>
<p class="text-center"> <p class="text-center carousel-author">
{% blocktrans %} {% blocktrans %}
<strong>- Sebastian Plattner,</strong> <strong>- Sebastian Plattner,</strong>
Teamleader Development Cyber Security Products at RUAG Teamleader Development Cyber Security Products at RUAG