/* CSS Document */
@charset "UTF-8";

/******************* IF I WANT ANIMATED BG ********************

				@keyframes animatedBackground {
					from { background-position: 0 0; }
					to { background-position: 100% 0; }
				}
				@-webkit-keyframes animatedBackground {
					from { background-position: 0 0; }
					to { background-position: 100% 0; }
				}
				@-ms-keyframes animatedBackground {
					from { background-position: 0 0; }
					to { background-position: 100% 0; }
				}
				@-moz-keyframes animatedBackground {
					from { background-position: 0 0; }
					to { background-position: 100% 0; }
				}
				
	AND THEN I USE
	
	#div{
		background-image:url(../bg-clouds.png);
		background-position: 0px 0px;
		background-repeat: repeat;
		animation:animatedBackground 40s linear infinite;
		-ms-animation:animatedBackground 40s linear infinite;
		-moz-animation:animatedBackground 40s linear infinite;
		-webkit-animation:animatedBackground 40s linear infinite;
	}
	
	FINISHED!
*****************************************************************/	

/*  General  */

ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, fieldset, input, abbr, article, aside, command, details, figcaption, figure, footer, header, hgroup, mark, meter, nav, output, progress, section, summary, time { margin: 0; padding: 0; }
h1, h2, h3, h4, h5, h6, pre, code, address, caption, cite, code, em, strong, th, figcaption {
	font-weight: normal; font-style: normal; 
}

strong, b { 
	font-weight: bold;
}
/*
html{		
	background: url(../img/roda_me_grammes.png) 50% 50% no-repeat, url(../img/fonto_no_lines.jpg) 0% 100% no-repeat;
	background-size: cover, cover;		
	background-attachment: fixed, fixed;		
}
*/
html{		
	background: url(../img/babycomb_website_vs3_1920X1080.jpg) 0% 100% no-repeat;
	background-size: cover;		
	background-attachment: scroll;
	background-attachment: fixed;	
	height: 100%;
}

@keyframes animatedBackground {
	from { background-position: 50% 0; }
	to { background-position: 100% 0; }
}
@-webkit-keyframes animatedBackground {
	from { background-position: 50% 0; }
	to { background-position: 100% 0; }
}
@-ms-keyframes animatedBackground {
	from { background-position: 50% 0; }
	to { background-position: 100% 0; }
}
@-moz-keyframes animatedBackground {
	from { background-position: 50% 0; }
	to { background-position: 100% 0; }
}


#div_body{ 
	font-family: 'Conv_PFBulletinSansPro-Light', Arial, Helvetica, sans-serif;
	font-size: 20px;
	font-style: normal; 
	font-weight: normal;
	/*
	height: 100%;
	overflow: hidden;
	*/
	/*
	background-image:url(../img/babycomb_ballon_stoixeia.png);
	background-position: 0px 0px;
	background-repeat: no-repeat;
	animation:animatedBackground 30s linear infinite;
	-ms-animation:animatedBackground 30s linear infinite;
	-moz-animation:animatedBackground 30s linear infinite;
	-webkit-animation:animatedBackground 30s linear infinite;
	*/
}

.left { float: left; }
.right { float: right; }
.clear { clear: both; }
.hide { display: none;}
img { border: 0px;}
a { text-decoration: none; border:0px;}

/* Loader */
#loader_div{

}

/* Wrapper */
#wrapper_div{ 
	width: 100%;
	min-width:270px;
	min-width:800px;
	height: 100%;
	height: 400px;
	margin: 0px auto 0px auto;
	background-color: #222222;
	background-color: transparent;
/*	background: url(../img/roda_me_grammes.png) 50% 50% no-repeat;
	background-size: cover;
	background-attachment: fixed;
	z-index: 9999;
	*/
}

#topleftinfo{
	position: absolute;
	width: 225px;
	height: 75px;
	margin: 0px 0px 0px 0px;
	left: 0px;
	top: 0px;
	background: url(../img/baycomb_top_left.png) 0% 0% no-repeat;
	background-size: contain;
	/*
	z-index: 99999999;
	*/
}

#left_top_menu_div{
	position: absolute;
	width: 180px;
	background-color: #222222;
	background-color: transparent;
	text-align: left;
	margin: 80px 0px 0px 0px;
	margin: 65px 0px 0px 0px;
}

#balloon_info{
	position: absolute;
	width: 450px;
	height: 290px;
	margin: 5% 6%;
	background: url(../img/babycomb_ballon_stoixeia2.png) 0% 0% no-repeat;
	display: none;
	z-index: 99999999999;
}

#logo_div{
	position: absolute;
	top: 8%;
	right: 10%;
	width: 30%;
	min-width: 200px;
	animation:mymove 5s infinite;
	-webkit-animation:mymove 5s infinite; /* Safari and Chrome */
	-moz-animation:mymove 5s infinite; /* Safari and Chrome */
}

#logo_div img{
	width: 70%;
	margin: 0px 0px 0px 35px;
}

@keyframes mymove
{
0%  {top:8%;}
50%  {top:0%;}
100%  {top:8%;}
}

@-webkit-keyframes mymove /* Safari and Chrome */
{
0%  {top:8%;}
50%  {top:0%;}
100%  {top:8%;}
}

@-moz-keyframes mymove /* Safari and Chrome */
{
0%  {top:8%;}
50%  {top:0%;}
100%  {top:8%;}
}

#logo_no2_div{
	position: absolute;
	top: 0%;
	left: 8%;
	width: 30%;
	min-width: 200px;
	animation:mymove2 10s infinite;
	-webkit-animation:mymove2 10s infinite; /* Safari and Chrome */
	-moz-animation:mymove2 10s infinite; /* Safari and Chrome */
}

#logo_no2_div img{
	width: 100%;
	margin: 0px 0px 0px -5px;
}

@keyframes mymove2
{
0%  {top:20%;}
50%  {top:4%;}
100%  {top:20%;}
}

@-webkit-keyframes mymove2 /* Safari and Chrome */
{
0%  {top:20%;}
50%  {top:4%;}
100%  {top:20%;}
}

@-moz-keyframes mymove2 /* Safari and Chrome */
{
0%  {top:20%;}
50%  {top:4%;}
100%  {top:20%;}
}

#profile_div{
	position: absolute;
	left: -155px;
	width: 100px;
	height: 25px;
	margin: 0px 0px 0px 0px;
	padding: 35px 100px 20px 30px;
	background-color: #8ac253;
	color: #ffffff;
	text-align: left;
	font-size: 25px;
	border-radius: 0px 10px 10px 0px;
   -webkit-transition: all .3s ease-out; 
   -moz-transition: all .3s ease-out; 
   -o-transition: all .3s ease-out; 
   transition: all .3s ease-out;
}

#profile_div:hover{
	background-color: #1a2b56;
	color: #fff100;
	left: -5px;
}

#profile_div:after{
	content: url(../img/title_side_60px-new.png);
	position: absolute;
	margin: -50px 0px 0px 165px;
}

#pricelist_div{
	position: absolute;
	left: -155px;
	width: 100px;
	height: 25px;
	margin: 85px 0px 0px 0px;
	padding: 35px 75px 20px 55px;
	background-color: #00adef;
	color: #ffffff;
	text-align: left;
	font-size: 25px;
	border-radius: 0px 10px 10px 0px;
   -webkit-transition: all .3s ease-out; 
   -moz-transition: all .3s ease-out; 
   -o-transition: all .3s ease-out; 
   transition: all .3s ease-out;
}

#pricelist_div:hover{
	background-color: #1a2b56;
	left: -5px;
	color: #E6379E;
}

#pricelist_div:after{
	content: url(../img/button_60px_times.png);
	position: absolute;
	margin: -25px 0px 0px 52px;
}

#gallery_pointer{
	position: absolute;
	left: -155px;
	width: 100px;
	height: 25px;
	margin: 170px 0px 0px 0px;
	padding: 35px 70px 20px 60px;
	background-color: #eb1c24;
	color: #ffffff;
	text-align: left;
	font-size: 25px;
	border-radius: 0px 10px 10px 0px;
   -webkit-transition: all .3s ease-out; 
   -moz-transition: all .3s ease-out; 
   -o-transition: all .3s ease-out; 
   transition: all .3s ease-out;
}

#gallery_pointer:hover{
	background-color: #1a2b56;
	color: #00adef;
	left: -5px;
}

#gallery_pointer:after{
	content: url(../img/button_60px_photo.png);
	position: absolute;
	margin: -25px 0px 0px 57px;
}

#map{
	position: absolute;
	left: -155px;
	width: 100px;
	height: 25px;
	margin: 255px 0px 0px 0px;
	padding: 35px 80px 20px 50px;
	background-color: #1f698c;
	color: #ffffff;
	text-align: left;
	font-size: 25px;
	border-radius: 0px 10px 10px 0px;
   -webkit-transition: all .3s ease-out; 
   -moz-transition: all .3s ease-out; 
   -o-transition: all .3s ease-out; 
   transition: all .3s ease-out;
}

#map:hover{
	background-color: #1a2b56;
	color: #8ac253;
	left: -5px;
}

#map:after{
	content: url(../img/button_60px_map.png);
	position: absolute;
	margin: -25px 0px 0px 54px;
}

#fb_div{
	position: absolute;
	width:50px;
	height: 25px;
	margin: 0px 0px 0px 0px;
	padding: 20px 15px 65px 15px;
	top: -50px;
	left: 230px;
	background-color: rgba(224,5,133,0.2);
	color: #ffffff;
	font-size: 25px;
	text-align: center;
	border-radius: 0px 0px 10px 10px;
   -webkit-transition: all .3s ease-out; 
   -moz-transition: all .3s ease-out; 
   -o-transition: all .3s ease-out; 
   transition: all .3s ease-out;
}

#fb_div:hover{
	top: 0px;
	background-color: rgba(224,5,133,1);
}

#after_fb_div{
	position: absolute;
	width:50px;
	height:45px;
	margin:13px 0px 0px 0px;
	background: url(../img/fb.png) 0% 0% no-repeat;
	opacity: 0.5;
}

#tw_div{
	position: absolute;
	width:50px;
	height: 25px;
	margin: 0px 0px 0px 85px;
	padding: 20px 15px 65px 15px;
	top: -50px;
	left: 230px;
	background-color: rgba(255,241,0,0.2);
	color: #1a2b56;
	font-size: 25px;
	text-align: center;
	border-radius: 0px 0px 10px 10px;
   -webkit-transition: all .3s ease-out; 
   -moz-transition: all .3s ease-out; 
   -o-transition: all .3s ease-out; 
   transition: all .3s ease-out;
}

#tw_div:hover{
	top: 0px;
	background-color: rgba(255,241,0,1);
}

#after_tw_div{
	position: absolute;
	width:50px;
	height:45px;
	margin:20px 0px 0px 3px;
	background: url(../img/twitter.png) 0% 0% no-repeat;
	opacity: 0.5;
}

#fs_div{
	position: absolute;
	width:50px;
	height: 25px;
	margin: 0px 0px 0px 170px;
	padding: 20px 23px 65px 7px;
	top: -50px;
	left: 230px;
	background-color: rgba(133,57,148,0.2);
	color: #ffffff;
	font-size: 25px;
	text-align: center;
	border-radius: 0px 0px 10px 10px;
   -webkit-transition: all .3s ease-out; 
   -moz-transition: all .3s ease-out; 
   -o-transition: all .3s ease-out; 
   transition: all .3s ease-out;
}

#fs_div:hover{
	top: 0px;
	background-color: rgba(133,57,148,1);
}

#after_fs_div{
	position: absolute;
	width:50px;
	height:45px;
	margin:12px 0px 0px 9px;
	background: url(../img/foursquare.png) 0% 0% no-repeat;
	opacity: 0.5;
}

#mail_div{
	position: absolute;
	width:50px;
	height: 25px;
	margin: 0px 0px 0px 255px;
	padding: 20px 15px 65px 15px;
	top: -50px;
	left: 230px;
	background-color: rgba(0,139,68,0.2);
	color: #ffffff;
	font-size: 25px;
	text-align: center;
	border-radius: 0px 0px 10px 10px;
   -webkit-transition: all .3s ease-out; 
   -moz-transition: all .3s ease-out; 
   -o-transition: all .3s ease-out; 
   transition: all .3s ease-out;
}

#mail_div:hover{
	top: 0px;
	background-color: rgba(0,139,68,1);
}

#after_mail_div{
	position: absolute;
	width:50px;
	height:45px;
	margin:12px 0px 0px 0px;
	background: url(../img/email.png) 0% 0% no-repeat;
	opacity: 0.5;
}

#ougia_by_creativeb{
	position: absolute;
	margin: 490px 0px 0px 0px;
	width: 170px;
	height: 50px;
	background: url(../img/ougia_creativelab_to_site_Katastas1A.png) 0% 0% no-repeat;
   -webkit-transition: all .3s ease-out; 
   -moz-transition: all .3s ease-out; 
   -o-transition: all .3s ease-out; 
   transition: all .3s ease-out;
}

#ougia_by_creativeb:hover{
	background: url(../img/ougia_creativelab_to_site_Katastasi2.png) 0% 0% no-repeat;
}

/***************************************
	Styles for screen 550px and lower	
***************************************/

@media screen and (max-width: 549px) {

html{
	background: url(../img/babycomb_website_vs3_1920X1080.jpg) 55% 0% no-repeat;
	background-attachment: fixed;
	background-size: cover;
	height: 100%;
}

#div_body{ 
	font-family: 'Conv_PFBulletinSansPro-Light', Arial, Helvetica, sans-serif;
	font-size: 20px;
	font-style: normal; 
	font-weight: normal;
	/*
	height: 100%;
	overflow: hidden;
	*/
	background-image:none;
}

#div_body{
	overflow: hidden;
}

#wrapper_div{ 
	margin: -55px 0px 0px 0px;
	min-width:250px;
}



#topleftinfo{
	display:none;
}

#logo_no2_div{
	margin: 90px 0px -90px 115px;
}

#logo_div{
	position: relative;
	margin: 90px 0px -90px 100px;
	display:none;
}

#logo_div img{
	width: 70%;
}

#left_top_menu_div{
	margin: 60px 0px 0px 0px;
}

#profile_div{
	position: absolute;
	left: -170px;
	width: 100px;
	height: 25px;
	margin: 0px 0px 0px 0px;
	padding: 20px 100px 10px 30px;
	color: #ffffff;
	text-align: left;
	font-size: 25px;
	border-radius: 0px 10px 10px 0px;
   -webkit-transition: all .3s ease-out; 
   -moz-transition: all .3s ease-out; 
   -o-transition: all .3s ease-out; 
   transition: all .3s ease-out;
   opacity: 0.3;
}

#pricelist_div{
	position: absolute;
	left: -170px;
	width: 100px;
	height: 25px;
	margin: 60px 0px 0px 0px;
	padding: 20px 55px 10px 75px;
	color: #ffffff;
	text-align: left;
	font-size: 25px;
	border-radius: 0px 10px 10px 0px;
   -webkit-transition: all .3s ease-out; 
   -moz-transition: all .3s ease-out; 
   -o-transition: all .3s ease-out; 
   transition: all .3s ease-out;
   opacity: 0.3;
}

#gallery_pointer{
	position: absolute;
	left: -170px;
	width: 100px;
	height: 25px;
	margin: 120px 0px 0px 0px;
	padding: 20px 70px 10px 60px;
	color: #ffffff;
	text-align: left;
	font-size: 25px;
	border-radius: 0px 10px 10px 0px;
   -webkit-transition: all .3s ease-out; 
   -moz-transition: all .3s ease-out; 
   -o-transition: all .3s ease-out; 
   transition: all .3s ease-out;
   opacity: 0.1;
}

#map{
	position: absolute;
	left: -170px;
	width: 100px;
	height: 25px;
	margin: 180px 0px 0px 0px;
	padding: 20px 80px 10px 50px;
	color: #ffffff;
	text-align: left;
	font-size: 25px;
	border-radius: 0px 10px 10px 0px;
   -webkit-transition: all .3s ease-out; 
   -moz-transition: all .3s ease-out; 
   -o-transition: all .3s ease-out; 
   transition: all .3s ease-out;
   opacity: 0.3;
}

#profile_div{ left: -170px; }

#profile_div:hover{ left: -170px; opacity: 1; }
#profile_div:after{ -webkit-transform: scale(0.7); -ms-transform: scale(0.7); transform: scale(0.7); }

#pricelist_div{ left: -170px; }

#pricelist_div:hover{ left: -170px; opacity: 1; }
#pricelist_div:after{ -webkit-transform: scale(0.7); -ms-transform: scale(0.7); transform: scale(0.7); margin: -25px 0px 0px 32px; }

#gallery_pointer{ left: -170px; }

#gallery_pointer:hover{ left: -170px; opacity: 1; }
#gallery_pointer:after{ -webkit-transform: scale(0.7); -ms-transform: scale(0.7); transform: scale(0.7); }

#map{ left: -170px; }

#map:hover{ left: -170px; opacity: 1; }
#map:after{ -webkit-transform: scale(0.7); -ms-transform: scale(0.7); transform: scale(0.7); }

#fb_div{
	position: fixed;
	width:30px;
	height: 25px;
	margin: 0px 0px 0px 55px;
	padding: 20px 10px 65px 10px;
	top: -50px;
	left: 10px;
	font-size: 15px;
}

#fb_div:hover,#tw_div:hover,#fs_div:hover,#mail_div:hover{
	top:-50px;
}

#tw_div{
	position: fixed;
	width:30px;
	height: 25px;
	margin: 0px 0px 0px 50px;
	padding: 20px 10px 65px 10px;
	top: -50px;
	left: 70px;
	font-size: 15px;
}

#fs_div{
	position: fixed;
	width:30px;
	height: 25px;
	margin: 0px 0px 0px 45px;
	padding: 20px 15px 65px 5px;
	top: -50px;
	left: 130px;
	font-size: 15px;
}

#mail_div{
	position: fixed;
	width:30px;
	height: 25px;
	margin: 0px 0px 0px 40px;
	padding: 20px 10px 65px 10px;
	top: -50px;
	left: 190px;
	font-size: 15px;
}

/*
#after_fb_div,#after_tw_div,#after_fs_div,#after_mail_div{ display:none; }
*/
#after_fb_div,#after_tw_div,#after_fs_div,#after_mail_div{ -webkit-transform: scale(0.7); margin:25px 0px 0px -11px; }
#after_tw_div{ margin:30px 0px 0px -11px; }
#after_fs_div{ margin:26px 0px 0px -4px; }

#ougia_by_creativeb{
	margin: 350px 0px 0px 0px;
}

}
/***************************************
				END
***************************************/


/************************************
			FANCYBOX
************************************/

.fancybox img{
	margin: 0px 0px 0px 5px;
	border: 0px solid #000;
/*	box-shadow: 0px 0px 10px 0px #000;
	-webkit-box-shadow: 0px 0px 10px 0px #000;
	*/
}


/************************************
			FONTS
************************************/

@font-face
{
font-family: 'Conv_PFBevel-Regular';
src: url('../fonts/PFBevel-Regular.woff');
}

@font-face
{
font-family: 'Conv_PFBulletinSansPro-Light';
src: url('../fonts/PFBulletinSansPro-Light.woff');
}


/************************************
		WUFOO ELEMENTS STYLES
************************************/

#titleonform, #onommo, #Field9, .instruct,  #telcontact, #Field10, #mailinsert, #Field11, #dropdownforcustomer, #Field12, #commentsonform, #Field13, #saveForm{
	font-family: 'Conv_PFBulletinSansPro-Light';
} 

#form1{
	font-family: 'Conv_PFBulletinSansPro-Light'!important;
}

.wufoo{
	font-family: 'Conv_PFBulletinSansPro-Light'!important;
}