/*

	01. Body and things that we don't change
	02. Navigation
	03. Setting the main's sections
	04. Home Section
	05. Works Section
	06. About Section
	07. Contact Section
	08. Twitter Module
	09. Social Module
			
*/


/* 01. BODY AND WRAPPER ================================================== */

@font-face {
  font-family: 'Soutern Aire';
  src: url('../fonts/SouthernAire_Personal_Use_Only.ttf') format('truetype');
}

html, body {
font-family: 'Source Sans Pro', sans-serif;    font-weight:400;
    margin:0px auto;
	width:100%;
	height: 100%;
	background-color:#FFF;
	position:absolute;
	top:0px;
	left:0px;
	bottom:0px;}

strong{
    font-weight: 700; 
    
}
.row {
	text-align: center;}

.row.left {
	text-align: left;}

.row.left .twelve.columns {
width: 40%;
}

.content{
	color: #444;
	font-size: 20px;
	font-weight: 400;
	line-height: 34px;
	padding: 40px 80px;
}
#Despre, #life{
background: #f8e8ff;
}
#training, #ursula{
background: #421255;
}
#training .subtittle, #training .content, #training h2,
#ursula .subtittle, #ursula .content, #ursula h2
{
	color:#FFF;
}
#contact a{
	color: #48185a;
	text-decoration: underline;
	
}
#contact a:hover{
	color: #9576a2;
}


.logo-main{
	margin-top: 12%;
}
.subtittle {
    font-family: 'Source Sans Pro', sans-serif;
    font-weight:400;
	color:#421255;
	margin-bottom:0px;
	padding: 25px 0 15px 0;
    line-height: 25px;
	font-size:22px;
	}

.subtittle a {
    font-family: 'Source Sans Pro', sans-serif;
    font-weight:400;
	color:#421255;
	text-decoration: underline;
	-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;}

.subtittle a:hover {
	text-decoration: underline;
}	

h2 {
	color:#48185a;
    font-family: 'Source Sans Pro', sans-serif;
    font-weight:300;
	font-size:52px;
	padding: 30px 0px 0px 0px;
	margin-top: 40px;
	}

.title_line {
    border-bottom: 2px solid #9576a2;
    display: block;
    height: 2px;
    margin: auto;
    margin-top:25px;
    width: 90px;}


/* 02. NAVIGATION ================================================== */



nav #logo {
	float:right;
	color:#212121;
	margin-left:10px;
	padding:15px;
    padding-top: 3px;
}
nav #logo img{
     width: 140px;
		margin-top: 8px;

}
	
nav {
	z-index: 42;
	width: 100%;
	background: #FFF;
	position: relative;
	height: 60px;}

nav ul {
	float:left;
	display:inline-block;
	margin-left:10px;
	list-style:none;
	padding-top:15px;
    padding-left: 20px;
}

nav ul li {
    display:inline-block;
    list-style: none;
    float:left;
    padding:5px 18px;}

nav ul li a {
  	color:#333;
	position:relative;
	display:inline-block;
	font-weight: 400;
	text-decoration: none;
	font-size: 18px;

	text-decoration:none;
	display:block;
	-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;}

nav li a:hover,
nav li a.selected {
	color:#4d1f5f;}

.sticky {
	position: fixed;
	top: 0px;}


/* Mobile Navigation Display none if no iDevice */

nav select {
      display: none;}

nav ul li.lessspace{
    padding-left: 5px;
    padding-right: 5px;
}

/* 03. SETTING OF MAIN SECTIONS  ================================================== */


#home {
	width:100%;
	height:100%;
	color:#FFF;
	background:url('../img/IVA_2573__.jpg') no-repeat 20% center fixed; 
    -webkit-background-size: auto 100%;
    background-size: auto 100%;
    background-attachment : fixed;  /* FIXED FOR IE */}



#contact {
	background-color:#f8e8ff;
	padding:70px 0px 50px;}
	

#twitter_module {
	background-color:#FFF;
	padding:40px 0px 40px;}
	
	
#social_module {
	background-color:#f8e8ff;
	padding:0px 0px 30px;}
	
	
footer {
	padding:20px 0;
	background-color:#421255;}
footer .footerinfo{
float: left; padding-top: 10px; color: #FFF;
}
footer .footerinfo a{
color: #FFF;
text-decoration:none;
}
footer .footerinfo a:hover{
text-decoration:underline;
}


/* 04 HOME SECTION  ================================================== */


#home h1 {
	position:relative;
	margin:20% auto 0px auto;
	z-index: 999;
    margin-bottom: 1.5em;
}

.quote-author {
  font-family: 'Soutern Aire';
  font-size: 40px;
}

.roles_additional {
    font-size: 20pt;
    font-weight: 300;
    display: inline-block;
    line-height: 40px;
    vertical-align: middle;
    overflow: hidden;
    color: #4d1f5f;
    z-index: 999;}

.roles {
    font-size: 30pt;  
    font-weight: 400;  
    display: inline-block;
    line-height: 30px;
    height: 40px;
    vertical-align: middle;
    overflow: hidden;
    color: #FFF;
    z-index: 999;}


.roles div {
    height:             70px;
    -webkit-transition: margin-top 2.0s ease-in-out;
    -moz-transition:    margin-top 2.0s ease-in-out;
    -o-transition:      margin-top 2.0s ease-in-out;
    transition:         margin-top 2.0s ease-in-out;}

#down_button a {
	position: absolute; 
	width: 80px; 
	height: 80px; 
	bottom: 5%; 
	left: 50%; 
	margin-left: -40px;
	background: url("../img/down.png") no-repeat; 
	background-position: 0px -80px;
	-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;}
	
#down_button a:hover {
	background-position: 0px 0px;}


/* -- Button back Contact -- */
	
#down_button_contact a {
	width:180px;
	padding: 0px;
	background-color: #4d1f5f;
    font-family: 'Source Sans Pro', sans-serif;
    font-weight:400;
	font-size:13px;
	color:#FFF;
	text-align:center;
	text-transform:uppercase;
	letter-spacing:1px;
	text-decoration:none;
	position: absolute;
	bottom: 0px; 
	left: 50%; 
	margin-left: -90px;
	-webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;}

#down_button_contact a:hover {
	color:#121212;
	background: #FFF;}


/* 05 WORKS SECTION  ================================================== */


.og-grid {
    list-style: none;
	padding: 10px 0;
	margin: 0px auto;
	text-align: center;
	width: 100%;}
	
.og-grid li {
	display: inline-block;
	margin: 0px 15px 20px 0px;
	vertical-align: top;
	height: 185px;}

/* SELECTED ILLUSTRATION */

.og-grid li.og-expanded > a::after {
	top: auto;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-bottom-color: #ddd;
	border-width: 15px;
	margin: 175px 0px 0px -140px;}

/* PREVIEW CLASS */

.og-expander {
	position: absolute;
	background: #ddd;
	top: auto;
	left: 0;
	width: 100%;
	margin-top: 10px;
	text-align: left;
	height: 0;
	overflow: hidden;}

.og-expander-inner {
	padding: 30px 30px;
	height: 100%;}

.og-close {
	position: absolute;
	width: 40px;
	height: 40px;
	top: 50px;
	right: 20px;
	cursor: pointer;
	opacity: 1;
	z-index: 20;
	background: url('../img/close.png');
	-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;}

.og-close:hover {
	opacity:0.5;}

.og-fullimg,
.og-details {
	width: 50%;
	float: left;
	height: 80%;
	overflow: hidden;
	position: relative;}

.og-details {
	padding: 10px 40px 0 20px;}

.og-fullimg {
	text-align: center;
	margin-top:10px;}

.og-fullimg img {
	display: inline-block;
	max-height: 100%;
	max-width: 100%;}

.og-details h3 {
	font-weight: 300;
	font-size: 52px;
	padding: 10px 0 10px;
	margin-bottom: 10px;
	color:#555;}

.og-details p {
	font-weight: 400;
	font-size: 16px;
	line-height: 22px;
	color: #999;}

.og-details a {
	font-size: 16px;
	color: #FFF;
    font-family: 'Source Sans Pro', sans-serif;
    font-weight:300;
    text-transform: uppercase;
	letter-spacing: 2px;
	padding: 10px 20px;
	background: #4d1f5f;
	border: 3px solid #4d1f5f;
	display: inline-block;
	margin: 30px 0 0;
	outline: none;
	-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;}

.og-details a::before {
	content: '\2192';
	display: inline-block;
	margin-right: 10px;}

.og-details a:hover {
	background: #555;
	border-color: #555;
	color: #FFF;}

.og-loading {
	width: 20px;
	height: 20px;
	border-radius: 50%;
	background: #ddd;
	box-shadow: 0 0 1px #ccc, 15px 30px 1px #ccc, -15px 30px 1px #ccc;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -25px 0 0 -25px;
	-webkit-animation: loader 0.5s infinite ease-in-out both;
	-moz-animation: loader 0.5s infinite ease-in-out both;
	animation: loader 0.5s infinite ease-in-out both;}


/* 06. ABOUT SECTION ================================================== */


.portraits {
	position: relative;
	list-style-type: none;
	display: inline-block;
	background: #eee;
	background: #FFF;
	margin-bottom: 10px;
	padding-bottom: 10px;
	width:100%;}

.portraits img {
	width:100%;
	-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;}
       

.portraits img:hover {
	filter:alpha(opacity=80);
    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=80);
    opacity: 0.8;}

.portraits .name {
	font-size: 18px;
	color: #2e2e2e;
	font-weight: normal;
	font-style: normal;
	margin: 10px 0 10px 0;
	display: inline-block;}

.portraits .poste {
	color: #4d1f5f;
    background-color: #fff;
	font-size:13px;
	text-transform: uppercase;
	padding: 2px 8px;
	margin-bottom: 10px;
	display: inline-block;}

.portraits .whathedo {
	color: #3b3b3b;
	font-size:12px;}


.portraits .whathedo a {
	padding: 0px 5px 0px 5px;}


/* 07 CONTACT SECTION ================================================== */


#contact form {
	margin-top:20px;}

#contact form input,
#contact form textarea{
	-moz-transition:all .3s ease-in-out;
	-ms-transition:all .3s ease-in-out;
	-o-transition:all .3s ease-in-out;
	-webkit-transition:all .3s ease-in-out;
    font-family: 'Source Sans Pro', sans-serif;
    font-weight:400;
    border:2px solid #FFF;
	box-shadow:none;
	color:#999;
	resize: vertical;
	font-size:12px;
	letter-spacing:1px;
	margin-bottom:25px;
	padding:5px 10px;
	transition:all .3s ease-in-out;
	width:100%;}

/* SET A HEIGHT TO THE INPUT*/

#contact form input{
	height:40px;
	resize: none;}

/* SET A HEIGHT TO THE TEXTAREA*/

#contact form textarea{
	min-height:120px;}
	
/* BUTTON SENDER */

#contact form .submit{
	-moz-transition:all .3s ease-in-out;
	-ms-transition:all .3s ease-in-out;
	-o-transition:all .3s ease-in-out;
	-webkit-transition:all .3s ease-in-out;
	background:#4d1f5f;
	border:2px solid #4d1f5f;
	color:#FFF;
	font-size:12px;
	height:40px;
	letter-spacing:1px;
	padding:5px 10px;
	text-transform:uppercase;
	transition:all .3s ease-in-out;
	width:100%;}

/* BUTTON SENDER HOVER */

#contact form .submit:hover{
	background:#555;
	border:2px solid #555;
	color:#FFF;
	cursor:pointer;}

/* INPUT AND TEXTAREA WHEN NOTHING  */

#contact form input:required,
#contact form textarea:required{
	background:#FFF url(../img/invalid.png);
	background-position:98% 5px;
	background-repeat:no-repeat;
	box-shadow:inherit;}

/* INPUT AND TEXTAREA WHEN VALID : GOOD */

#contact form input:required:valid,
#contact form textarea:required:valid{
	background:#FFF url(../img/valid.png);
	background-position:98% 5px;
	background-repeat:no-repeat;
	border-color:#4d1f5f;
	color:#4d1f5f;}

/* INPUT AND TEXTAREA WHEN INVALID : NOT GOOD GOES RED */

#contact form input:focus:invalid,
#contact form textarea:focus:invalid{
	background:#FFF url(../img/invalid-red.png) no-repeat 98% 5px;
	border-color:#ec7e7e;
	box-shadow:0 0 2px rgba(236,126,126,0.7);}

/* BLOCK CONTACT RIGHT */

#contact .info {
	width:auto;
	margin-left:5%;
	display:inline-block;
	text-align:left;
	line-height:25px;}
	
#contact .info p {
	color:#777;}
	
#contact .info h4:first-child {
	margin-top:15px;}

#contact .info h4 {
	color:#555;
    font-family: 'Source Sans Pro', sans-serif;
    font-weight:700;
    text-transform:uppercase;
	font-size:14px;
	letter-spacing:1px;
	margin-bottom:0px;
	margin-top:30px;}

#contact .info a {
	color:#4d1f5f;
	letter-spacing:1px;
	text-decoration:none;
	-webkit-transition:all .3s ease-in-out;
	-moz-transition:all .3s ease-in-out;
	-ms-transition:all .3s ease-in-out;
	-o-transition:all .3s ease-in-out;
	transition:all .3s ease-in-out;}

#contact .info a:hover {
	color:#777;
	text-decoration:none;
	-webkit-transition:all .3s ease-in-out;
	-moz-transition:all .3s ease-in-out;
	-ms-transition:all .3s ease-in-out;
	-o-transition:all .3s ease-in-out;
	transition:all .3s ease-in-out;}


/* 08. TWITTER MODULE ================================================== */


	.tweet_list {
		list-style: none;
		margin: 0;
		padding: 0;
		overflow-y: hidden;
		background-color: #FFF;}
	
		.tweet_list li {
			overflow-y: auto;
			overflow-x: hidden;
			list-style-type: none;}
		
			.tweet_list li a {
				color:#333;
				text-decoration: none;
				-webkit-transition:all .3s ease-in-out;
				-moz-transition:all .3s ease-in-out;
				-ms-transition:all .3s ease-in-out;
				-o-transition:all .3s ease-in-out;
				transition:all .3s ease-in-out;}
		
			.tweet_list li a:hover {
				color:#4d1f5f;}
		
		.tweet_list .tweet_even {
			background-color: #FFF;}
		
		.tweet_list .tweet_avatar {
			display: none;}
		
			.tweet_list .tweet_avatar img {
				display: none;}
	
	     .tweet_list .tweet_time a{
			color:#999;
			font-size:12px;
			margin-left: 10px;}
		
      #ticker {
        background-color:#FFF;
      	text-align:center;
      	text-align:center;
        overflow-y: hidden;
        position: relative;}
        
      #ticker ul.tweet_list {
        overflow: hidden;
        font-size:14px;
        height:22px;
        -webkit-border-radius: 0;
        -moz-border-radius: 0;
        border-radius: 0;}
        
      #ticker ul.tweet_list li {
        overflow: hidden;
        height:35px;
        font-size:14px;}
      
      .tweet_list li::before {
	    content: url(../img/littletweet.png);}

	  .tweet_list li img {
		margin-bottom:-2px;}
		

/* 09. SOCIAL MODULE ================================================== */


#social_module a {
	text-decoration: none;}

#social_module  ul li{
	list-style:none;
	display:inline-block; 
	padding: 0px 20px 0px 20px;}

.icon{
	font-family:"Socialico";
	font-weight:400;
	font-style:normal;
	font-size:30px;
	color:#9576a2;
	text-decoration: none;
	-webkit-transition:all .5s ease-in-out;
	-moz-transition:all .5s ease-in-out;
	-ms-transition:all .5s ease-in-out;
	-o-transition:all .5s ease-in-out;
	transition:all .5s ease-in-out;}
	
.icon:hover{
	color:#48185a;}


.row.home{
	vertical-align: top;
	width: 200px;
	float: right;
	margin-right: 16%;
	margin-top: 5%;
	}
}
/* 10. Custom ================================================== */