@font-face {
    font-family: 'bebeonline';
    src: url('../fonts/care_bears_font-webfont.eot');
    src: url('../fonts/care_bears_font-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/care_bears_font-webfont.woff') format('woff'),
         url('../fonts/care_bears_font-webfont.ttf') format('truetype'),
         url('../fonts/care_bears_font-webfont.svg#care_bear_familyregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

body 
{
	background-color: #333333;
}

h1, h2, h3
{
	color:#473644;
}

h1
{
	font-size:9em;
	font-family: bebeonline;
}

h2
{
	font-size:4em;
	text-align:center;
	margin-bottom:30px;
	margin-top:0px;
	padding-top:0px;
	font-family: bebeonline;
}

#header h3
{
	font-weight: normal;
	margin-left: 10px;
}

h3
{
	font-size:2em;
	font-weight:bold;
}

h2.alt
{
	color:#e7e5d9;
}

@media screen and (max-width: 767px) 
{
	h1
	{
		text-align:center;
	}
	
	#header h3
	{
		text-align: center;
	}

    #demo-button-header-wrapper
    {
        text-align:center;
    }
	
	#logo
	{
		text-align:center;
	}
	
	#demo .left-column
	{
		text-align:center;
	}
	
	.video-preview
	{
		margin-bottom:30px;
	}
}

@media screen and (min-width: 768px) 
{
	#logo
	{
		text-align:right;
	}
}

#header
{
	background-color: #e7e5d9;
}

#videos
{
	background-color: #84ceee;
	text-align:center;
	position:relative;
}

#temoignages
{
	background-color: #e7e5d9;
}

#presse
{
	background-color: #84ceee;
}

#demo
{
	background-color: #e7e5d9;
	color:#473644;
}

#demo.alt
{
	background-color:#84ceee;
}

.left-column
{
	text-align:right;
}

#footer
{
	background-color: #333333;
	color:#e7e5d9;
}

#navbar
{
	background-color: #4289c8;
	width: 54px;
	/*float: right;*/
	position:absolute;
	right:100%;
	top:0px;
	left:0px;
	bottom:0px;
	margin-top:auto;
	margin-bottom:auto;
	height:60px;
	display:inline-block;
	vertical-align:middle;
}

#navbar ul, #navbar li
{
	width:100%;
	padding:0;
	margin:0;
}

#navbar li
{
	height:60px;
	list-style: none;
	border-bottom:1px solid #82bfdb;
}

.navbar-icon
{
	height:60px;
	width:60px;
	background-image:url('../img/social_icons.png');
	background-repeat:none;
	display:block;
}

.twitter
{
	background-position:-3px 0px;
}

.facebook
{
	background-position:-3px -60px;
}

.gplus
{
	background-position:-3px -120px;
}

.rss
{
	background-position:-3px -180px;
}

.arrow
{
	background-image:url('../img/arrow.png');
	margin-left:auto;
	margin-right:auto;
	width:60px;
	height:26px;
}

.arrow.alt
{
	background-image:url('../img/arrow-alt.png');
}

.arrow.footer
{
	background-image:url('../img/arrow-footer.png');
}

.container
{
	padding-top:20px;
	padding-bottom:40px;
}

.shadowed
{
	box-shadow: 1px 1px 12px #333;
}

.responsive-image
{
	max-width:100%;
	height:auto;
	width:auto;
}

.press-box
{
	padding:10px;
	background-color:#FFF;
}

.tem-img-left
{
	float:left;
	margin-right:10px;
	margin-left:20px;
}

.tem-img-right
{
	float:right;
	margin-left:10px;
	margin-right:20px;
}

.tem-box-right
{
	text-align:right;
}

.tem-box-left
{
	text-align:left;
}

.tem-box
{
	
}

.logo-press-helper
{
	text-align:center;
	margin-bottom:10px;
	/*height:100px;*/
}

.logo-press
{
	width:auto;
	height:auto;
	max-width:100%;
}

.big-text
{
	font-size:2em;
}

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

#demo-button
{
	width:100%;
}

#demo-button-header
{
    margin-top:1em;
    margin-left: 10px;
}

.glyphicon
{
		margin-right:10px;
		vertical-align:middle;
}

/*.modal-header
{
	border:0px;
}*/

.video-container 
{
	width:348px;
	height:217px;
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; 
	height: 0; 
	overflow: hidden;
}
 
.video-container iframe,
.video-container object,
.video-container embed 
{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.video-preview-container
{
	max-width:348px;
	margin-left:auto;
	margin-right:auto;
	position:relative;
	margin-bottom:20px;
}

.preview-button
{
	position:absolute;
	left:40%;
	color:#FFF;
	top:40%;
	background-color:#333;
	border-radius:5px;
	width:20%;
	height:20%;
}

.preview-button:hover
{
	background-color:#D00000;
}

.big-icon
{
	font-size:3em;
}

.video-preview
{
    display:inline-block;
    position:relative;
}