﻿/*
Theme Name: Reloaded
Theme URI: http://www.reloaded.hu.hu
Author: Juhász Viktor
Author URI: http://www.reloaded.hu
Description: Reloaded web designer team theme
Version: 1.0
Tags: reloaded, responsive, Budapest, webdesign
Text Domain: reloaded
*/

html, body {height:100%; position: relative;}

html{overflow-x: hidden;}

body{
font: normal normal 100%/1.4 'Raleway', sans-serif;;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
background: #eee;
color: #222;
}

a{text-decoration: none;}

.headbar{
position: absolute;
position: fixed;
top: 0;
z-index: 10;
padding: 1.25em 0;
color: #fff;
}

.headbar, .logo, .logo .fa, .nav-puller, .nav-puller .fa, .headbar li a, footer .social li a{
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  -ms-transition: all 300ms ease-in-out;
  -o-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out;
}

.logo{
position: relative;
float: left;
}

.logo .fa{
font-size: 1.5em;
width: 1.5em;
height: 1.5em;
line-height: 1.5em;
text-align: center;
border: 3px solid #fff;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
}

.logo:hover .fa{
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-ms-transform: rotate(360deg);
-o-transform: rotate(360deg);
transform: rotate(360deg);
}

.logo span{
font-size: 1.5em;
line-height: 1.5em;
text-transform: uppercase;
font-weight: 700;
padding-left: 0.25em;
}

.nav-puller{
display: none;
position: relative;
float: right;
padding-left: 1em;
text-transform: uppercase;
font-weight: 700;
}

.nav-puller .fa{
font-size: 1.125em;
width: 1.85em;
height: 1.85em;
line-height: 1.85em;
border: 3px solid #fff;
text-align: center;
margin-left: 0.5em;
border-radius: 10px;
}

.logo,.nav-puller,.headbar li a{opacity: 0.5;}

.logo:hover,.nav-puller:hover,.headbar li a:hover{opacity: 1;}

.logo,
.logo .fa,
.nav-puller,
.nav-puller .fa{
color: #fff;
}

.headbar nav, .headbar nav ul{position: relative; float: right;}
.headbar li{float: left;}
.headbar li a{
font-weight: 700;
position: relative;
display: block;
padding: 0 1em;
margin: 0 0.25em;
color: #fff;
text-transform: uppercase;
line-height: 2.4375em;
border-radius: 2.5em;
}

.headbar.sticky{
padding: 1em 0;
background: #222;
}

.headbar.sticky li a,
.headbar.sticky .logo,
.headbar.sticky .nav-puller{
color: #ecf0f1;
opacity: 1;
}

.headbar.sticky li a:hover{
background: #34495e;
color: #fff;
}

.headbar.sticky .logo .fa,
.headbar.sticky .nav-puller .fa{border-color: #ecf0f1; color: #ecf0f1; opacity: 1;}

/*
.headbar.sticky{
padding: 1em 0;
background: #fff;
background: rgba(255,255,255,.95);
box-shadow: 0 0 5px #999;
}

.headbar.sticky:hover{
background: rgba(255,255,255,1);
}

.headbar.sticky li a,
.headbar.sticky .logo,
.headbar.sticky .nav-puller{
color: #0b85ae;
opacity: 1;
}

.headbar.sticky li a:hover{
background: #34495e;
color: #fff;
}

.headbar.sticky .logo .fa,
.headbar.sticky .nav-puller .fa{border-color: #0b85ae; color: #0b85ae; opacity: 1;}

*/

.main-title{
line-height: 1;
text-align: center;
padding: 0;
}

.main-title .grid{
margin-top: 4em;
margin-bottom: 4em;
}

.fullbox{

}

.main-title h1{
font-weight: 800;
font-size: 5em;
text-transform: uppercase;
}

.main-title span{
display: block;
font-size: 0.3875em;
}

.main-title p{
position: relative;
margin: 2em 0 0;
padding: 2em 0 0;
border-top: 1px solid rgba(255,255,255,1);
line-height: 1.4em;
}

.main-title p .icon{
font-size: 1.25em;
position: absolute;
display: block;
left: 50%;
top: -1em;
width: 2em;
height: 2em;
line-height: 2em;
text-align: center;
background: #0b85ae;
margin-left: -1em;
border: 1px solid #fff;
border-radius: 50%;
}

.center-ver2{
display: block;
width: 100%;
position: absolute;
top: 50%;
}

.big-icon,
.small-icon,
.large-icon{
display: block;
margin: 0 auto;
text-align: center;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
}

.large-icon{
font-size: 8em;
width: 1.125em;
height: 1.125em;
line-height: 1.125em;
margin-bottom: 0.125em;
}

.big-icon{
font-size: 10em;
width: 1.125em;
height: 1.125em;
line-height: 1.125em;
margin-bottom: 0.125em;
}

.small-icon{
font-size: 2.25em;
width: 2.75em;
height: 2.75em;
line-height: 2.75em;
margin-bottom: 0.75em;
}

/*************************

---------SECTIONS---------

*************************/



section{padding: 3em 0;}
section.bigpadding{padding: 5em 0;}
section.nopadding{padding: 0;}
section.has-sep-top{padding-top: 7em;}
section.has-sep-bottom{padding-bottom: 3.75em;}
section.has-sep-both{padding: 6em 0 3.75em 0;}

/* Separators */

section.has-sep-top:before,
section.has-sep-both:before,
section.has-sep-bottom:after,
section.has-sep-both:after{
content: '';
position: absolute;
display: block;
left: 50%;
-webkit-transform: translateX(-50%) rotate(45deg);
-moz-transform: translateX(-50%) rotate(45deg);
-ms-transform: translateX(-50%) rotate(45deg);
-o-transform: translateX(-50%) rotate(45deg);
transform: translateX(-50%) rotate(45deg);
}

section.has-sep-top:before,
section.has-sep-both:before{
width: 3em;
height: 3em;
top: -1.5em;
z-index: 3;
}

section.has-sep-bottom:after,
section.has-sep-both:after{
width: 5em;
height: 5em;
bottom: -2.5em;
z-index: 2;
}


/* Colorization */
section.blue{background: #0b85ae; color: #fff;}
section.blue.has-sep-top:before,
section.blue.has-sep-both:before{border-bottom: 1px solid #0b85ae;border-right: 1px solid #0b85ae;}
section.blue.has-sep-bottom:after,
section.blue.has-sep-both:after{background: #0b85ae;}
section.blue .big-icon,
section.blue .small-icon{background: #fff;color: #0b85ae;}

section.green{background: #27ae60; color: #fff;}
section.green.has-sep-top:before,
section.green.has-sep-both:before{border-bottom: 1px solid #27ae60;border-right: 1px solid #27ae60;}
section.green.has-sep-bottom:after,
section.green.has-sep-both:after{background: #27ae60;}
section.green .big-icon,
section.green .small-icon{background: #fff;color: #27ae60;}

section.white{background: #fff; color: #111;}
section.white.has-sep-top:before,
section.white.has-sep-both:before{border-bottom: 1px solid #fff;border-right: 1px solid #fff;}
section.white.has-sep-bottom:after,
section.white.has-sep-both:after{background: #fff;}
section.white .big-icon,
section.white .small-icon{background: #0b85ae; color: #fff;}
section.white .large-icon{color: #0b85ae;}

section.gray{background: #eee; color: #111;}
section.gray.has-sep-top:before,
section.gray.has-sep-both:before{border-bottom: 1px solid #eee;border-right: 1px solid #eee;}
section.gray.has-sep-bottom:after,
section.gray.has-sep-both:after{background: #eee;}
section.gray .big-icon,
section.gray .small-icon{background: #0b85ae; color: #fff;}

section.dark-gray{background: #222; color: #999;}
section.dark-gray.has-sep-top:before,
section.dark-gray.has-sep-both:before{border-bottom: 1px solid #eee;border-right: 1px solid #eee;}
section.dark-gray.has-sep-bottom:after,
section.dark-gray.has-sep-both:after{background: #eee;}
section.dark-gray .big-icon,
section.dark-gray .small-icon{background: #0b85ae; color: #fff;}

section.img-bg{
background-color: transparent;
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
color: #fff;
}


section.img-bg h2{
text-shadow:
1px 1px 1px #000,
2px 2px 1px #000;
}



section.img-bg h2:after{
display: none;
}

section.img-bg p{
font-size: 1.25em;
text-shadow:
1px 1px 1px #000,
2px 2px 1px #000;
padding: 1em 0 3em;
}
section.img-bg .has-sep-top:before,
section.img-bg .has-sep-both:before{border-bottom: 1px solid #000;border-right: 1px solid #000;}
section.img-bg .big-icon,
section.img-bg .small-icon{background: #fff;color: #111;}


h1, h2, h3{
font-weight: 800;
position: relative;
text-transform: uppercase;
line-height: 1.2;
}

h2{
display: block;
font-size: 2.25em;
text-align: center;
padding-bottom: 0.45em;
margin-bottom: 0.45em;
position: relative;
}

h3{
display: block;
font-size: 1.375em;
text-align: center;
padding-bottom: 0.75em;
margin-bottom: 0.75em;
}


h2:after, h3:after{
content: '';
position: absolute;
display: block;
width: 70px;
height: 3px;
background: #0b85ae;
left: 50%;
margin-left: -35px;
bottom: -1px;
}

p{
padding-bottom: 3em;
}

.short-info{
display: block;
margin: 0 auto 1em auto;
max-width: 600px;
font-style: italic;
font-size: 1.125em;
text-align: center;
color: #666;
}

.long-info{
display: block;
margin: 0 auto;
max-width: 600px;
font-size: 1.25em;
text-align: center;
color: #333;
}

footer h2{
font-size: 1.25em;
text-align: left !important:
}

footer .contact-data .fa{
padding-right: 0.5em;
color: #fff;
}


footer .contact-data , footer .social{margin: 2em 0;}

footer .social ul{float: right;}

footer .social li{float: left;}

footer .social li a{
font-size: 1.5em;
display: block;
width: 2em;
height: 2em;
line-height: 2em;
text-align: center;
margin-left: 0.5em;
border: 2px solid #999;
border-radius: 50%;
color: #999;
}

footer .social li a.facebook:hover{border-color: #2980b9; background: #2980b9; color: #fff;}
footer .social li a.google-plus:hover{border-color: #e74c3c; background: #e74c3c; color: #fff;}
footer .social li a.google-maps:hover{border-color: #fff; background: #fff; color: #e74c3c;}

footer .copyright{
font-size: 0.875em;
color: #666;
text-align: center;
border-top: 1px solid #444;
padding: 0.5em 0;
}

.button{
line-height: 1.2;
padding: 0.875em 1em;
text-transform: uppercase;
font-weight: 700;
-webkit-transition: all 300ms ease-in-out;
-moz-transition: all 300ms ease-in-out;
-ms-transition: all 300ms ease-in-out;
-o-transition: all 300ms ease-in-out;
transition: all 300ms ease-in-out;
border-radius: 2em;
}

.button.blue{border: 2px solid #0b85ae; color: #0b85ae;}
.button.blue:hover{background: #0b85ae; color: #fff;}

.button.black{border: 2px solid #000; color: #000;}
.button.black:hover{background: #000; color: #fff;}

.button.white{border: 2px solid #fff; color: #fff;}
.button.white:hover{background: #fff; color: #111;}

.nowrap{
white-space: nowrap;
}

/* centered dynamic width block element */
.centered-holder{text-align: center; position: relative;}
.centered-holder .centered {
display: inline-block;
position: relative;
z-index: 1;
}

/* IE7 Hack - http://www.brunildo.org/test/InlineBlockLayout.html */
.centered-holder .centered { *display: inline; zoom: 1; }