/*
URI: http://www.gruppopragma.com/
Author: Gruppo Pragma - Luca Larice
*/



/*--------------------------------------------------------------
# Normalize
--------------------------------------------------------------*/
@import url('normalize.css');


/*--------------------------------------------------------------
# WP GENERAL
--------------------------------------------------------------*/
@import url('general-rules.css');


/*--------------------------------------------------------------
# BOOTSTRAP GRID SETUP
--------------------------------------------------------------*/
.container{
	width: 100%;
	padding-left: 20px;
	padding-right: 20px;
}
/* gutter ovverride */
.gutter.row {
	margin-right: -10px;
	margin-left: -10px;
}
.gutter > [class^="col-"], .gutter > [class^=" col-"] {
	padding-right: 10px;
	padding-left: 10px;
}


/*--------------------------------------------------------------
# Spacer
--------------------------------------------------------------*/
.spaceT5{padding-top:5px;}
.spaceT10{padding-top:10px;}
.spaceT20{padding-top:20px;}
.spaceT30{padding-top:30px;}
.spaceT40{padding-top:40px;}
.spaceT50{padding-top:50px;}
.spaceB5{padding-bottom:5px;}
.spaceB10{padding-bottom:10px;}
.spaceB20{padding-bottom:20px;}
.spaceB30{padding-bottom:30px;}
.spaceT40{padding-bottom:40px;}
.spaceB50{padding-bottom:50px;}
.spaceTB5{padding-top:5px; padding-bottom:5px;}
.spaceTB10{padding-top:10px; padding-bottom:10px;}
.spaceTB20{padding-top:20px; padding-bottom:20px;}
.spaceTB30{padding-top:30px; padding-bottom:30px;}
.spaceTB40{padding-top:40px; padding-bottom:40px;}
.spaceTB50{padding-top:50px; padding-bottom:50px;}
.space10{padding:10px;}
.space15{padding:15px;}
.space20{padding:20px;}
.space30{padding:30px;}
.space40{padding:40px;}
.space50{padding:50px;}
.spaceL5{padding-left:5px;}
.spaceL10{padding-left:10px;}
.spaceL20{padding-left:20px;}
.spaceR5{padding-right:5px;}
.spaceR10{padding-right:10px;}
.spaceR20{padding-right:20px;}


/*--------------------------------------------------------------
# Utils
--------------------------------------------------------------*/
.bold{font-weight: bold;}
.italic{font-style: italic;}



/*--------------------------------------------------------------
# Colors
--------------------------------------------------------------*/
.bg-grey1{background: #eeeeee;}
.bg-grey2{background: #999;}

.bg-blue1{background: #154075;}

.white{color: #fff;}
.blue{color: #154075;}




/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
html{
	font-size: 55.5%; /* $rembase = 10px */
}
body {
	background: #fff; /* Fallback for when there is no custom background color defined. */
}
ul, ol {
	margin: 0 0 1.5rem 1rem;
	padding: 0;
}
ul {
	list-style: disc;
}
ol {
	list-style: decimal;
}
li > ul, li > ol {
	margin-bottom: 0;
	margin-left: 1.5em;
}
hr {
	background-color: #fff;
	border: 0;
	height: 1px;
	margin-bottom: 1.5em;
}
hr.no-margin{
	margin-bottom: 0;
}


/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
body, button, input, select, textarea {
	color: #37424a;
	font-family: 'Karla', sans-serif;
	font-size: 1.6rem; /* 13 ÷ $rembase */
	line-height: 1.6;
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
	font-family: 'Karla', sans-serif;
	letter-spacing: 0.12rem;
	text-transform: none;
	clear: both;
}

/* FIBONACCI font base
H1=32
H2=24
H3=19
H4=16
H5=14
H6=13
*/

h1, .h1{
    font-size: 2rem; 
    line-height: auto;
    text-transform: uppercase;
    font-weight: bold;
}
h2, .h2{
    font-size: 2rem; 
    line-height: auto;
    text-transform: uppercase;
    font-weight: bold;
}
h3, .h3{
    font-size: 1.6rem; 
    line-height: auto;
}
h4, .h4{
    font-size: 1.8rem; 
    line-height: auto;
}
h5, .h5{
    font-size: 1.4rem; 
    line-height: auto;
    text-transform: none;
}
h6, .h6{
    font-size: 1.3rem; 
    line-height: auto;
}


p {
	margin-bottom: 1.5em;
}


/*--------------------------------------------------------------
# Links
--------------------------------------------------------------*/
a { 
	color: #fff; 
	text-decoration: underline;
	font-weight: 500;
}
a:visited {
	color: #fff;
}
a:hover, a:focus, a:active {
	color: #fff;
	text-decoration: none;
}
a:focus {
	outline: thin dotted;
}
a:hover, a:active {
	outline: 0;
}




/*--------------------------------------------------------------
# Content
--------------------------------------------------------------*/
.full-height{
	height: 100vh;
}










/*==========  Non-Mobile First Method  ==========*/

/* Extra small devices (portrait phones, less than 576px) */
/* No media query since this is the default in Bootstrap */

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
	html{
		font-size: 57.5%; /* $rembase = 10px */
	}
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) { 
	html{
		font-size: 57.5%; /* $rembase = 10px */
	}


}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
	html{
		font-size: 63.5%; /* $rembase = 10px */
	}



}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
	html{
		font-size: 63.5%; /* $rembase = 10px */
	}



}