mobile text size and alignment fix
This commit is contained in:
Arvind Tiwari
parent
3eebed6245
commit
1d3307043e
7 changed files with 69 additions and 101 deletions
|
|
@ -964,29 +964,6 @@ section h3.section-comment {
|
|||
color: #494949;
|
||||
}
|
||||
|
||||
small-comment {
|
||||
font-family: "Open Sans", "Droid Serif", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
margin-bottom: none;
|
||||
font-transform: none;
|
||||
font-size:10px;
|
||||
font-weight:400;
|
||||
color: #777
|
||||
}
|
||||
|
||||
logo-image {
|
||||
z-index: 100;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
margin-left: 0;
|
||||
border: 7px solid #f1f1f1;
|
||||
border-radius: 100%;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
background-color: #a1cfd7;
|
||||
}
|
||||
|
||||
.intro-small {
|
||||
font-family: 'Montserrat' ,'Raleway', "Open Sans Bold", Helvetica, Arial, "Arial Bold", sans-serif;
|
||||
font-size: 20px;
|
||||
|
|
|
|||
|
|
@ -960,29 +960,6 @@ section h3.section-comment {
|
|||
color: #494949;
|
||||
}
|
||||
|
||||
small-comment {
|
||||
font-family: "Open Sans", "Droid Serif", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
margin-bottom: none;
|
||||
font-transform: none;
|
||||
font-size:10px;
|
||||
font-weight:400;
|
||||
color: #777
|
||||
}
|
||||
|
||||
logo-image {
|
||||
z-index: 100;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
margin-left: 0;
|
||||
border: 7px solid #f1f1f1;
|
||||
border-radius: 100%;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
background-color: #a1cfd7;
|
||||
}
|
||||
|
||||
.intro-small {
|
||||
font-family: 'Montserrat' ,'Raleway', "Open Sans Bold", Helvetica, Arial, "Arial Bold", sans-serif;
|
||||
font-size: 20px;
|
||||
|
|
|
|||
|
|
@ -345,15 +345,15 @@ section {
|
|||
section h2.section-heading {
|
||||
margin-top: 0;
|
||||
margin-bottom: 15px;
|
||||
font-size: 24px;
|
||||
font-size: 18px;
|
||||
color: #494949;
|
||||
}
|
||||
|
||||
section h3.section-subheading {
|
||||
margin-bottom: 75px;
|
||||
margin-bottom: 50px;
|
||||
text-transform: none;
|
||||
font-family: 'Raleway', "Helvetica Neue", "Open Sans", "Droid Serif", Helvetica, Arial, sans-serif;
|
||||
font-size: 18px;
|
||||
font-size: 16px;
|
||||
font-weight: 400;
|
||||
color: #494949;
|
||||
line-height: 1.4;
|
||||
|
|
@ -366,6 +366,10 @@ section h3.section-subheading {
|
|||
section h2.section-heading {
|
||||
font-size: 40px;
|
||||
}
|
||||
section h3.section-subheading {
|
||||
font-size: 18px;
|
||||
margin-bottom: 75px;
|
||||
}
|
||||
}
|
||||
|
||||
.service-heading {
|
||||
|
|
@ -431,7 +435,7 @@ section h3.section-subheading {
|
|||
}
|
||||
|
||||
#portfolio .portfolio-item .portfolio-caption h4 {
|
||||
margin: 0 0 20px;
|
||||
margin: 0 0 17px;
|
||||
text-transform: none;
|
||||
color: #494949;
|
||||
}
|
||||
|
|
@ -450,7 +454,7 @@ section h3.section-subheading {
|
|||
display: inline-block
|
||||
}
|
||||
|
||||
@media(min-width:767px) {
|
||||
@media(min-width:768px) {
|
||||
#portfolio .portfolio-item {
|
||||
margin: 0 0 30px;
|
||||
}
|
||||
|
|
@ -560,6 +564,10 @@ section h3.section-subheading {
|
|||
color: inherit;
|
||||
}
|
||||
|
||||
.timeline .timeline-heading h4 {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.timeline .timeline-heading h4.subheading {
|
||||
text-transform: none;
|
||||
}
|
||||
|
|
@ -657,7 +665,7 @@ section h3.section-subheading {
|
|||
}
|
||||
|
||||
.team-member {
|
||||
margin-bottom: 50px;
|
||||
margin-bottom: 25px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
|
@ -667,11 +675,27 @@ section h3.section-subheading {
|
|||
}
|
||||
|
||||
.team-member h4 {
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
@media(max-width:767px) {
|
||||
.team-member .team-member-caption p {
|
||||
line-height: 1.5;
|
||||
}
|
||||
}
|
||||
|
||||
@media(min-width:768px) {
|
||||
.team-member {
|
||||
margin-bottom: 50px;
|
||||
}
|
||||
.team-member h4 {
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.team-member p {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
|
@ -692,6 +716,15 @@ section#contact .section-heading {
|
|||
font-size: 32px;
|
||||
}
|
||||
|
||||
@media(max-width:767px) {
|
||||
section#contact .section-heading {
|
||||
font-size: 20px;
|
||||
}
|
||||
section#contact .intro-smallcap {
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
|
||||
section#contact .form-group {
|
||||
color:white;
|
||||
margin-bottom: 25px;
|
||||
|
|
@ -903,36 +936,15 @@ section h3.section-comment {
|
|||
color: #494949;
|
||||
}
|
||||
|
||||
small-comment {
|
||||
font-family: "Open Sans", "Droid Serif", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
margin-bottom: none;
|
||||
font-transform: none;
|
||||
font-size:10px;
|
||||
font-weight:400;
|
||||
color: #777
|
||||
}
|
||||
|
||||
logo-image {
|
||||
z-index: 100;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
margin-left: 0;
|
||||
border: 7px solid #f1f1f1;
|
||||
border-radius: 100%;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
background-color: #fed136;
|
||||
}
|
||||
|
||||
.carousel-indicators li.active, .text-carousel .carousel-indicators li.active {
|
||||
border: 0;
|
||||
background-color: #fed136;
|
||||
}
|
||||
@media (min-width: 740px)
|
||||
.carousel-inner, .text-carousel .carousel-inner {
|
||||
min-height: 225px;
|
||||
|
||||
@media (min-width: 740px) {
|
||||
.carousel-inner, .text-carousel .carousel-inner {
|
||||
min-height: 225px;
|
||||
}
|
||||
}
|
||||
|
||||
.carousel-text {
|
||||
|
|
@ -943,4 +955,4 @@ logo-image {
|
|||
lign-heignt: 2px;
|
||||
color : #666;
|
||||
text-align : center;
|
||||
}
|
||||
}
|
||||
|
|
@ -120,15 +120,11 @@
|
|||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.portfolio-item .portfolio-caption p,
|
||||
section h2.section-heading,
|
||||
section h3.section-subheading,
|
||||
#portfolio .portfolio-item .portfolio-caption h4 {
|
||||
text-align: left;
|
||||
}
|
||||
section h2.section-heading,
|
||||
section h3.section-subheading {
|
||||
.intro-smallcap.sm_left,
|
||||
.section-heading.sm_left,
|
||||
.section-subheading.sm_left {
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -251,6 +247,12 @@
|
|||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.sm_left {
|
||||
text-align: left !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@media (min-width: 768px) and (max-width: 991px) {
|
||||
.timeline>li .timeline-panel {
|
||||
|
|
|
|||
|
|
@ -12,16 +12,16 @@
|
|||
<strong>{{ message }}</strong>
|
||||
</div>
|
||||
{% endfor %}
|
||||
<h2 class="section-heading">{% trans "Contact Us" %}</h2>
|
||||
<h3 class="intro-smallcap" style="line-height: 1.2;">
|
||||
<h2 class="section-heading sm_left">{% trans "Contact Us" %}</h2>
|
||||
<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 "You can contact us at" %}
|
||||
</h3>
|
||||
<h3 class="intro-smallcap">
|
||||
<h3 class="intro-smallcap sm_left">
|
||||
<a href="mailto:info@ungleich.ch"><i class="fa fa-envelope"></i> <strong>info@ungleich.ch</strong></a>
|
||||
</h3>
|
||||
|
||||
<h3 class="intro-smallcap"><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>
|
||||
<!-- <h3 class="intro-smallcap">{% trans "or" %}</h3> -->
|
||||
|
||||
<!-- <h3 class="intro-smallcap">{% trans "Contact Us" %}</h3> -->
|
||||
|
|
|
|||
|
|
@ -4,27 +4,27 @@
|
|||
<section id="portfolio" class="bg-light-gray">
|
||||
<div class="container">
|
||||
<div class="text-center wow fadeInUp">
|
||||
<h2 class="section-heading">{% trans "Our Products" %}</h2>
|
||||
<h3 class="section-subheading text-muted" 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>
|
||||
<h2 class="section-heading sm_left">{% 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>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-4 col-sm-6 portfolio-item wow fadeInUp" data-wow-delay="0.25s">
|
||||
<a href="{% url 'datacenterlight:index' %}"><img src="{% static 'ungleich_page/img/portfolio/datacenterlight.png' %}" class="img-responsive inline-block" alt=""></a>
|
||||
<div class="portfolio-caption inline-block">
|
||||
<div class="portfolio-caption inline-block sm_left">
|
||||
<h4>{% trans "Data Center Light" %}</h4>
|
||||
<p class="text-muted">{% trans "We offer the most affordable hosting in Switzerland. Data Center Light has full FOSS stack, 100% IPv6 and 100% SSD. Choose any configuration among CentOS, Debian, Ubuntu, Devuan, and FreeBSD." %} </p>
|
||||
<p class="text-muted">{% trans "We offer the most affordable hosting in Switzerland. Data Center Light has full FOSS stack, 100% IPv6 and 100% SSD. Choose any configuration among CentOS, Debian, Ubuntu, Devuan, and FreeBSD." %}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4 col-sm-6 portfolio-item wow fadeInUp" data-wow-delay="0.5s">
|
||||
<a href="{% url 'rails.hosting' %}"><img src="{% static 'ungleich_page/img/portfolio/startup-framework.png' %}" class="img-responsive inline-block" alt=""></a>
|
||||
<div class="portfolio-caption inline-block">
|
||||
<div class="portfolio-caption inline-block sm_left">
|
||||
<h4>{% trans "Rails Hosting" %} </h4>
|
||||
<p class="text-muted">{% trans "Ready to go live with your Ruby on Rails application? We offer you ready-to-deploy virtual machines or configure your existing infrastructure for Ruby on Rails." %}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4 col-sm-6 portfolio-item wow fadeInUp" data-wow-delay="0.75s">
|
||||
<a href="{% url 'datacenterlight:glasfaser' %}"><img src="{% static 'ungleich_page/img/portfolio/glasfaser.png' %}" class="img-responsive inline-block" alt=""></a>
|
||||
<div class="portfolio-caption inline-block">
|
||||
<div class="portfolio-caption inline-block sm_left">
|
||||
<h4>{% trans "High Speed Internet" %}</h4>
|
||||
<p class="text-muted">{% trans "We offer high speed fiber internet in Glarus Süd, Glarus and Glarus Nord. Experience 100 Mbit/s and see how speed can change everything." %}</p>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -4,8 +4,8 @@
|
|||
<section id="services">
|
||||
<div class="container">
|
||||
<div class="text-center wow fadeInDown">
|
||||
<h2 class="section-heading">{% trans "our services" %}</h2>
|
||||
<h3 class="section-subheading text-muted">
|
||||
<h2 class="section-heading sm_left">{% trans "our services" %}</h2>
|
||||
<h3 class="section-subheading text-muted sm_left">
|
||||
{% trans "We support our clients in all areas of Unix infrastructure." %}<br/>
|
||||
{% trans "Our top notch configuration management is refreshingly simple and reliable." %}
|
||||
</h3>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue