/************************************
 	
	TYPING MONKEYS STYLES
	Apr 2013 - Mat Guerra
	To be used with Foundation Framework
	 
************************************/
@font-face {
    font-family: 'Arimo';
    src: url('../fonts/Arimo-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'Unkempt';
    src: url('../fonts/Unkempt-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}

html, body {
	z-index: 0;
	}

#header {
	text-align: center;
	margin: 0px;
	background-color: #11a7c7;
}

#header img {
	position:relative;
	margin-bottom:-4px;
	}
.headerimg {
	background: url('../img/tymo3.png') repeat-x center bottom;
	text-align: center;
	min-height: 177px;
	
}
.headerimg h1, .headerimg h2, .headerimg p{
	visibility: hidden;
}
.wyniwyg h2 {
	font-family: 'Unkempt', Georgia, Times,serif; 
	color: #11A7C7;
	padding-top: 20px;
	/*text-shadow:1px 1px #3b7a9b;*/
	}
	
.wyniwyg h3 {
	font-family: 'Unkempt', Georgia, Times,serif; 
	color: #11A7C7;
	font-style: italic;
	text-shadow:none;
	}
	
.wyniwyg img {
	display: block;
	float:right;
	padding:12px 8px 8px 20px;
	
}

.work h2 {
	font-family: 'Unkempt', Georgia, Times,serif; 
	color: #11A7C7;
	text-shadow:1px 1px #FFFFFF;
	}

.work h3 {
	font-family: 'Unkempt', Georgia, Times,serif; 
	color: #11A7C7;
	text-shadow:1px 1px #FFFFFF;
	}
	
.work img {
	display: block;
	float:left;
	padding:12px 20px 8px 8px;
	
}

.work h5 {
	color: white;
}

.work ul{
	list-style:circle;
	list-style-position: outside;
}
.work ul, li {
	font-size: 95%;
}
.who p {
	font-size: 90%;
}

.who h3 {
	font-family: 'Unkempt', Georgia, Times,serif; 
	color: #FFFFFF;
	text-shadow:1px 1px #2284A1;
	}
.who li {
	font-size: 80%;
}
.partners {
	background-color: #EEEEEE;
}

.partners h3 {
	font-family: 'Unkempt', Georgia, Times,serif; 
	color: #333333;
	text-shadow:1px 1px #FFFFFF;
	}

.partners li {
	font-size: 80%;
	list-style-type: none;
	border: 1px grey dotted;
	padding:6px;
	background-color: white;

}
.partners img {
	float: left;
	padding: 2px 20px 2px 2px;
}

.partners h6 {
	font-size: 120%;
}

.consultancy {
	
}

.copyright{
	font-size:0.8em;
	color: #CCCCCC;
}

.copyright p {
	padding-top: 30px;
}
.pre-footer{
	padding-top: 20px;
}
.pre-footer a:link, .pre-footer a:visited{
	color:#999999;
}
.pre-footer a:hover, .pre-footer a:active{
	color:#248DAC;
}


.endnote {
	padding-top: 40px;
	font-family: Georgia, Times,serif; 
	font-size:1.1em;
	font-style: italic;
	color: #EEEEEE;
	text-shadow:1px 1px #666666;
}

footer {
	 min-height:300px;
}

.pfolio img{
	float:right;
	padding:2px 0px 4px 8px;
}
.pfolio-schede{
	font-size: 85%;	
}
.clienti {
	background-color: #ECF8FF;
	padding:12px;
}
.clienti h3 {
	font-size: 1em;
}
.clienti p {
	font-size: 80%;
}
.clienti img {
	padding: 2px 2px 8px 0px;
}
.clienti-list {
	color: #999999;
	border-top:1px dotted #999999;
	font-size: 80%;
	padding: 8px;
}
.clienti-list h3 {
	font-size: 1em;
	font-weight: bold;
}
.star {
	padding: 10px 0 10px 0;
	font-size: 80%;
	border-top:1px dotted #11A7C7;

}
.star img {
	padding: 0px 0 10px 10px;
	float:right;
}

/* 
MATS RIBBONS	
************/

.ribbon3{
    position:relative;
    color:#fff;
    background:#2284a1;
    float:left;
    clear:both;
    padding:8px;
    margin-left:-30px;
    margin-bottom:20px;
    text-shadow:0 -1px #277d97, 0 1px #22a5cd;
    -moz-box-shadow:2px 2px 0 rgba(0,0,0,0.1);
    -webkit-box-shadow:2px 2px 0 rgba(0,0,0,0.1);
    -o-box-shadow:2px 2px 0 rgba(0,0,0,0.1);
    box-shadow:2px 2px 0 rgba(0,0,0,0.1);
}
.ribbon3:before{
    content:" ";
    background:url(../img/ribbon3.png);
    display:block;
    width:10px;
    height:10px;
    position:absolute;
    bottom:0;
    left:0;
    margin-bottom:-10px;
    z-index:0;
}

.ribbon2{
    position:relative;
    color:#fff;
    background:#ff9900;
    float:left;
    clear:both;
    padding:8px;
    margin-left:-30px;
    margin-bottom:20px;
    text-shadow:0 -1px #e19522, 0 1px #f7ca88;
    -moz-box-shadow:2px 2px 0 rgba(0,0,0,0.1);
    -webkit-box-shadow:2px 2px 0 rgba(0,0,0,0.1);
    -o-box-shadow:2px 2px 0 rgba(0,0,0,0.1);
    box-shadow:2px 2px 0 rgba(0,0,0,0.1);
}
.ribbon2:before{
    content:" ";
    background:url(../img/ribbon2.png);
    display:block;
    width:10px;
    height:10px;
    position:absolute;
    bottom:0;
    left:0;
    margin-bottom:-10px;
    z-index:0;
}
.ribbon1{
    position:relative;
    color:#fff;
    background:#E12919;
    float:left;
    clear:both;
    padding:8px;
    margin-left:-30px;
    margin-bottom:20px;
    text-shadow:0 -1px #d0284b, 0 1px #f96080;
    -moz-box-shadow:2px 2px 0 rgba(0,0,0,0.1);
    -webkit-box-shadow:2px 2px 0 rgba(0,0,0,0.1);
    -o-box-shadow:2px 2px 0 rgba(0,0,0,0.1);
    box-shadow:2px 2px 0 rgba(0,0,0,0.1);
}
.ribbon1:before{
    content:" ";
    background:url(../img/ribbon1.png);
    display:block;
    width:10px;
    height:10px;
    position:absolute;
    bottom:0;
    left:0;
    margin-bottom:-10px;
    z-index:0;
}

.ribbon {
   width: 300px;
   position: absolute;
   text-align: center;
   font-size: 20px!important;
   background: #d64b4b;
   background: -webkit-gradient(linear, left top, left bottom, from(#d64b4b), to(#ab2c2c));
   background: -webkit-linear-gradient(top, #d64b4b, #ab2c2c);
   background: -moz-linear-gradient(top, #d64b4b, #ab2c2c);
   background: -ms-linear-gradient(top, #d64b4b, #ab2c2c);
   background: -o-linear-gradient(top, #d64b4b, #ab2c2c);
   background-image: -ms-linear-gradient(top, #d64b4b 0%, #ab2c2c 100%);
   -webkit-box-shadow: rgba(000,000,000,0.3) 0 1px 1px;
   -moz-box-shadow: rgba(000,000,000,0.3) 0 1px 1px;
   box-shadow: rgba(000,000,000,0.3) 0 1px 1px;
   font-family: 'Helvetica Neue',Helvetica, sans-serif;
   }
.ribbon h1 {
   font-size: 25px!important;
   color: #801111;
   text-shadow: #d65c5c 0 1px 0;
   margin:0px;
   padding: 15px 10px;
   }
.ribbon:before, .ribbon:after {
   content: '';
   position: absolute;
   display: block;
   bottom: -1em;
   border: 1.5em solid #c23a3a;
   z-index: -1;
   }
.ribbon:before {
   left: -2em;
   border-right-width: 1.5em;
   border-left-color: transparent;
   -webkit-box-shadow: rgba(000,000,000,0.4) 1px 1px 1px;
   -moz-box-shadow: rgba(000,000,000,0.4) 1px 1px 1px;
   box-shadow: rgba(000,000,000,0.4) 1px 1px 1px;
   }
.ribbon:after {
   right: -2em;
   border-left-width: 1.5em;
   border-right-color: transparent;
   -webkit-box-shadow: rgba(000,000,000,0.4) -1px 1px 1px;
   -moz-box-shadow: rgba(000,000,000,0.4) -1px 1px 1px;
   box-shadow: rgba(000,000,000,0.4) -1px 1px 1px;
   }
.ribbon .ribbon-content:before, .ribbon .ribbon-content:after {
   border-color: #871616 transparent transparent transparent;
   position: absolute;
   display: block;
   border-style: solid;
   bottom: -1em;
   content: '';
   }
.ribbon .ribbon-content:before {
   left: 0;
   border-width: 1em 0 0 1em;
   }
.ribbon .ribbon-content:after {
   right: 0;
   border-width: 1em 1em 0 0;
   }
.ribbon-stitches-top {
   margin-top:2px;
   border-top: 1px dashed rgba(0, 0, 0, 0.2);
   -moz-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.5);
   -webkit-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.5);
   box-shadow: 0px 0px 2px rgba(255, 255, 255, 0.5);
   }
.ribbon-stitches-bottom {
   margin-bottom:2px;
   border-top: 1px dashed rgba(0, 0, 0, 0.2);
   -moz-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.3);
   -webkit-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.3);
   box-shadow: 0px 0px 2px rgba(255, 255, 255, 0.3);
   }