body {margin-top:50px; background: #f7f7f7;font-family: "exo 2";}

a {color:#fc575e}

h1{border-bottom: 1px solid #ddd;padding: 20px 0;margin-bottom: 20px; font-weight: 300;}

h2{margin-bottom: 20px;font-weight: 300; font-size: 26px; line-height: 30px}

h3{font-weight: 300; font-size: 22px;margin-bottom: 40px}

.margin-top{margin-top: 20px;}


.navbar-header{float:none;text-align: center;}
	
	/* top bar */
	.navbar {text-transform: uppercase;background-color: #ee5523; border: none; height: 50px;}
	.navbar a  {color:#fff;font-weight: 300;text-decoration: none}
	.navbar-default .navbar-brand {color:#fff;font-weight: bold;margin:0;line-height: 50px;float:none; margin-left: auto; margin-right: auto; width: 60px; float: none; }

	.icon{margin-bottom: 8px;margin:0;padding: 15px 15px; float:right;}
    
	    .back{float:left;background-color: #feaf8d;}
	    .search{background: #fb7b74; float:left;}
	    
	    .tw{background: #3fc6f3}
	    .fb{background: #0d9be5}
    
    /*footer*/
		.footer { background-color: #ee5523;}
	
    /* toggle button */
    .navbar-toggle{border: none;color:#fff;margin:0;padding: 18px 15px; border-radius: 0px;float:left;}
    .navbar-default .navbar-toggle,
	.navbar-default .navbar-toggle:hover,
	.navbar-default .navbar-toggle:focus {background-color: #9a2500}
	.navbar-default .navbar-toggle .icon-bar {background-color: #fff;}
	
	
	/* Position where the element is fixed */
	.affix {top: 50px; width: 160px; }
	#affix {width: 160spx;}

	.nav li a {border-bottom: 1px solid #ddd; color:#9A2500; padding: 10px 5px;}
	.nav li a:hover {background-color: rgba(61, 163, 191, 0.34);}
	.nav li a i {margin-right:10px;}
    

    /* list */ 
    .ux-mood{font-size: 18px; font-weight: 300;margin-bottom: 40px}
    .ux-mood li{margin-bottom: 10px}
    .upper{text-transform: uppercase; font-weight: bold}




/* collapsed sidebar styles */
@media screen and (max-width: 992px) {

	
	.affix {position: static;}
	#affix{width: 100%;}
  
	.sidebar-offcanvas{-webkit-transition: all 0.3s ease-in-out;
		-moz-transition: all 0.3s ease-in-out;
		-ms-transition: all 0.3s ease-in-out;
		-o-transition: all 0.3s ease-in-out;
		transition: all 0.3s ease-in-out;
		
		/* width:70%; */
		background-color: #9a2500;
		z-index: 51;
		margin: 0; padding: 0;
		position: fixed;
		top:50px;
		left: -70%;
	}
	
	.sidebar-offcanvas ul li{margin:0}
	.sidebar-offcanvas ul li a{color:#fff;padding: 15px 20px;margin:0;font-size: 15px;border-bottom: 1px solid #FC784E}
	.sidebar-offcanvas ul li a:hover{background:#c3370b;border:none; border-radius:0}
	
	.nav{margin-top: 0px;}
	.nav > li > a:hover, 
	.nav > li > a:focus{background-color: #c3370b}
	
	.active {left: 0;}
    
	.utente{
		margin: 15px 0px 10px 20px;
		color: white;
	}
	
}

@media (min-width: 768px) and (max-width: 992px){
	.navbar-toggle {
		display: block;
	}	
}

.loader {
	border: 5px solid #f3f3f3;
	border-radius: 50%;
	border-top: 5px solid #ee5523;
	width: 50px;
	height: 50px;
	-webkit-animation: spin 2s linear infinite; /* Safari */
	animation: spin 2s linear infinite;
  }

  /* Safari */
@-webkit-keyframes spin {
	0% { -webkit-transform: rotate(0deg); }
	100% { -webkit-transform: rotate(360deg); }
  }
  
  @keyframes spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
  }