@charset "utf-8";
@import url("styles-flags.css");
@import url("styles-forms.css");

/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
/* Styles */
}

/* Smartphones (landscape) ----------- */
@media only screen 
and (min-width : 321px) {
/* Styles */
}

/* Smartphones (portrait) ----------- */
@media only screen 
and (max-width : 320px) {
/* Styles */
}

/* iPads (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
/* Styles */
}

/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
/* Styles */
}

/* iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
/* Styles */
}

/* Desktops and laptops ----------- */
@media only screen 
and (min-width : 1224px) {
/* Styles */
}

/* Large screens ----------- */
@media only screen 
and (min-width : 1824px) {
/* Styles */
}

/* iPhone 4 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {
/* Styles */
}

body {
	font-family:'Roboto', 'Geneva', 'sans-serif';
	font-size:12px;
	color:#000;
	background: url('/images/ayumi_bg_v3.gif');
	 /*background-size: contain;*/
        background-repeat:no-repeat;
	background-position:50% 0;
	background-attachment:scroll;
	margin:0;
	padding: 0;
	/*min-width:800px;*/
}


/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {...}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {...}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {...}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {...} 

body {
    src:url('/fonts/roboto-v20-latin-regular.ttf') format('truetype'),
	font-family:'Roboto', 'Geneva', 'sans-serif';
	font-size:12px;
	color:#000;
	background: url('/images/ayumi_bg_v3.gif');
	 /*background-size: contain;*/

        background-repeat:no-repeat;
	background-position:50% 0;
	background-attachment:scroll;
	margin:0;
	padding: 0;
	/*min-width:800px;*/
}

/* roboto-regular - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('/fonts/roboto-v20-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Roboto'), local('Roboto-Regular'),
       url('/fonts/roboto-v20-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/roboto-v20-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('/fonts/roboto-v20-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('/fonts/roboto-v20-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/fonts/roboto-v20-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */
}

#advertinfo {
text-align:center;
width:75%;
}
p.center {
	text-align: center !important;
}
p.swirl {
	font-family:roboto;
}
h1{font-size:22px;line-height:30px;text-align:center;} 	
h2{font-size:14px;line-height:40px;}
h3{font-size:13px;line-height:40px;}
h4{font-size:12px;line-height:20px;}
h5{font-size:11px;line-height:20px;}
h6{font-size:10px;line-height:20px;}
h1 small{font-size:22px;}
h2 small{font-size:18px;}
h3 small{font-size:14px;}
h4 small{font-size:14px;}
h1.swirl{font-size:24px;font-family:roboto;color:#3e779d;text-shadow:1px 1px 1px #000;}

a.index:link {text-decoration: none; color: #000;}
a.index:visited, a.index:active {text-decoration: none;}
a.index:hover {color: #ff0084; font-weight:900;}

a { text-decoration: none ; color: #000 ; }
a:hover {text-decoration: none; color: #ff0084 ; font-weight:800; }
a.sp { padding-right: 40px ; }

#menubar {
	position: fixed;
	top: 0px;
	width: 100%;
	height: 25px;
	left: 0px;
	background: #000000;
	z-index: 1;
}

#pagewrapperindex {
	padding-left:20px; 	
}

#logo {
	width:760px;
        height:224px;
        margin:0 auto;
	/**background: url(/images/ayumi_banner_v3.gif) center top no-repeat;**/
	color: #000;
}

#innerwrapperindex {
        padding: 200px 0px 0px 0px;
        height:231px;
	/*width:760px;*/
	margin:0 auto;
	border:0px solid #000;
	background-color:transparent;
        border-bottom-right-radius: 20px 10px;
        -moz-border-radius-bottomright: 20px 10px;
	border-bottom-left-radius: 20px 10px;	
	-moz-border-radius-bottomleft: 20px 10px;
}

#comingsoon {
	width:100%;
	margin:0 auto;
  	background: #000000;
}

#pagewrapper {
	width:100%;
	margin:0 auto;
	border:0px solid #000;
	background-color:transparent;
	overflow:hidden; 
}

#container2 {
	border:0px solid #000;
	margin:0 auto;
	clear:left;
	float:left;
	width:95%;
	overflow:hidden;
	background:transparent; /* column 2 background colour */
}

#container1 {
	float:left;
	width:560px;
	position:relative;
	right:570px;
	background:transparent; /* column 1 background colour */
}

img {
	border: none ;
	background-color:#FFF;
}

/* Page Main */
#symbols {
	margin-top: 50px ;
}

.symbol {
	width: 48% ;
	float: left ;
}

.symbol h2 {
	text-align: center ;
}

/* Page Who Am I ? */
#whoami-img {
	width: 400px ;
	margin: 0 auto ;
}

#whoami-txt p {
	font-size: 20px ;
	margin-top: 1em ;
}

#whoami-txt p a {
	color: pink ;
	background: transparent ;
	font-weight: 700 ;
}

#whoami-txt p a:hover {
	color: #000000 ;
	background: pink ;
	font-weight: 700 ;
}

#bonga {
	border-top: 5px solid black;
	border-right: 5px solid black;
	border-bottom: 5px solid black;
	border-left: 5px solid black; 
	width: 950px;
	height: 250px;
	margin: 0 auto;
}

/* Buttons on front page */

#featuredwrap {
	float:right;
	margin-right:10%;
}

.featuredButton {
	width: 210px;
	margin: 0 auto;
	border-top: 3px solid #96d1f8;
	background: #65a9d7;
	background: -webkit-gradient(linear, left top, left bottom, from(#3e779d), to(#65a9d7));
	background: -webkit-linear-gradient(top, #3e779d, #65a9d7);
	background: -moz-linear-gradient(top, #3e779d, #65a9d7);
	background: -ms-linear-gradient(top, #3e779d, #65a9d7);
	background: -o-linear-gradient(top, #3e779d, #65a9d7);
	padding: 9px 15px;
	-webkit-border-radius: 18px;
	-moz-border-radius: 18px;
	border-radius: 18px;
	-webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
	-moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
	box-shadow: rgba(0,0,0,1) 0 2px 0;
	text-shadow: rgba(0,0,0,.4) 0 1px 0;
	color: #ffffff;
	font-size: 18px;
	font-family:Roboto, Geneva, sans-serif;
	text-decoration: none;
	vertical-align: middle;
	text-align: center ;	
}

.featuredButton:hover {
  	border-top-color: #28597a;
  	background: #28597a;
  	color: #ccc;
  	font-weight: 700;
}

.featuredButton:active {
   border-top-color: #1b435e;
   background: #1b435e;
}

.featuredButton a {
	background: transparent;
	color: #ffffff;
}

.featuredButton a:hover {
	background: transparent;
	color: #ffffff;
}

.featuredButton a:active {
	background: transparent;
	color: #cccccc;
}

/*Banner advertising*/
#adbanner {
        visibility:visible;
        height:60px;
	width:468px;
	margin:0 auto;
	border:5px solid #000;
	text-align: justify;
	background-color:#FFF;
	-moz-box-shadow: 0 0 10px 10px #888;
	-webkit-box-shadow: 0 0 10px 10px#888;
	box-shadow: 0 0 10px 10px #888;
}

/* Front Page */
#buttonwrapper {
	margin: 0 auto; /* DO NOT CHANGE */
	text-align: center;
	width: 300px;
	height: 50px;
	margin-top:-40px;
}

.buttons {
	width:150px;
	height:30px;
	float:left; /* DO NOT CHANGE */
	line-height:30px;
	text-align:center;
	font-size:28px;
}

/* Very Top Menu */
#topmenuwrapper {
	margin: 0px;
	padding: 0px;
	width:100%;
	height:18px;
	vertical-align: middle;	
	z-index:10;
	position:fixed;
	top: 0px;
	border-top:3px solid #000;
	border-left:0px;
	border-right:0px;
	border-bottom:3px solid #000;
	text-align:center;
	font-family:Roboto, Geneva, sans-serif;
	font-size:14px;
	text-decoration: none;
	background-color:#e6f5f7;
        min-width:900px;
}
	
/* Top Horizontal Menu */
nav, header, footer {
	display:block;
}

#mainnav {
	width:80%;
	height:30px ;
	border:5px solid #000;
	background-color:#FFF;
	margin:auto;
}

#mainnav ul {
	list-style: none; /* DO NOT CHANGE */
	padding: 0; /* DO NOT CHANGE */
	margin: 0 auto; /* DO NOT CHANGE */
	background-color:#FFF;
	width:100%;
} 

#mainnav li {
	float: left; /* DO NOT CHANGE */
	margin: 0;
	background-color:#FFF;
	width: 25%;
} 

#mainnav li a {
	background: #ffffff;
	padding:5px 0;
	width: 100%;
	height:20px;
	float: left; /* DO NOT CHANGE */
	display: block; /* DO NOT CHANGE */
	color: #000;
	text-decoration: none;
	text-align: center;
	background-color:#fff;
	font-weight:700;
}

#mainnav li a:hover {
	background-color:#107d9c;
}

/* Left Menu */
#leftmenu {
	width:20%;
	float:left;
}

#leftmenu ul {
	list-style: none; /* DO NOT CHANGE */
	padding: 0;
	margin: 0;
	background-color:#fff;
} 

#leftmenu li {
	float: left; /* DO NOT CHANGE */
	margin: 0px 0px 5px 0px;
	background-color:#fff;
	width:100%;
	overflow: hidden;
	-o-text-overflow: ellipsis; /* pour Opera 9 */
	text-overflow: ellipsis;
} 

#leftmenu li a {
	width:100%;
	background: #fff;
	min-height: 20px;
	line-height: 20px;
	float: left; /* DO NOT CHANGE */
	display: block; /* DO NOT CHANGE */
	color: #000;
	text-decoration: none;
	text-align: center;
	font-size:14px;
	border-top:1px solid #000;
	border-bottom:1px solid #000;
	background-color:#e6f5f7;
} 

#leftmenu li a:hover {
	background-color:#ff0084;
}


/* Main Content Area */
#mainwrapper {
	margin:10px auto;
	float:left;
	width:95%;
	position:relative;
	padding-left:2.5%;
	display:block;
}

#maincontent {
	width:78%;
	float:right;
	margin:0 auto;
	padding:0;
	display:block;
	position:relative;
	
}

#maincontent p {
	
	text-decoration: none;
	background-color:transparent;
	text-align:center;
}
/* End Main Content Area */

/* Footer */
#footer {
	width:95%;
	margin:0 auto;
	padding:5px;
	height:30px;
	line-height:30px;
	text-align:left;
	text-decoration: none;
	background-color:#FFF;
}
/* End Footer */

#main {
	width:750px;
	min-height:200px;
	float:left; /* DO NOT CHANGE */
	padding:5px;
	border:5px solid #000;
	margin-left: -5px;
	background-color:#FFF;
	text-align: left ;
}

/* Main Content 2 Area */
#ayumibg {
	background: transparent url(/images/1260590.jpg);
	text-align:center;
	width:50%;
	height:987px;
	margin-left:25px;
	border:5px solid #000;
	float:right;
}

/* End Main Content 2 Area */

#getpicturehere {
	margin-left: -5px ;
}

#ayumilisting {
	width:100%;
	float: left;
}

/* Front featured advert*/
#listingboxcontainer {
	right: 0 ;
	width: 200px;
	margin: 0 auto ;
	padding: 0px 20px;
	background: transparent ;
	float: right;
	border:0px solid #000;
	position:absolute;
}

.listingboxf {
	width:200px;
	margin: 0 auto;
	overflow: hidden ;
	border:5px solid #000;
	background-color:transparent;
        border-radius: 15px;
        -moz-box-shadow: 0 0 10px 10px #fff;
	-webkit-box-shadow: 0 0 10px 10px #fff;
	box-shadow: 0 0 10px 10px #fff;
}

/*Search results thumbs and county advert here/advert thumbs*/
.listingbox {
	width:174px;
	position:relative;
	overflow: hidden ;
	float:left;
	margin: 5px 5px 5px 10px;
	padding: 0 ;
	border:3px solid #000;
	background-color:transparent;
	-moz-box-shadow: 0 0 2px 2px #888;
	-webkit-box-shadow: 0 0 2px 2px #888;
	box-shadow: 0 0 2px 2px #888;
	border-top-right-radius: 5px 5px;
    	-moz-border-radius-bottomright: 5px 5px;
	border-top-left-radius: 5px 5px;	
	-moz-border-radius-bottomleft: 5px 5px;
	border-bottom-right-radius: 5px 5px;
    	-moz-border-radius-bottomright: 5px 5px;
	border-bottom-left-radius: 5px 5px;	
	-moz-border-radius-bottomleft: 5px 5px;
}

.listingboximage {
	border:0px solid #000;
	height:233px;
	line-height:230px;
	background-color:transparent;
}
.listingboxtype {
        text-decoration: none;
	margin-top: 10px;
	border:0px solid #000;
	color: #000;
	text-align: center;
	font-size:14px;
	background-color:#FFF;
	position:relative;
	z-index:10;
}

.listingboximage img {
	vertical-align: middle;
	background-color:#FFF;
	width:100%;
}

/* Advert Details Page */

table {
margin: auto;
}

/*3 images thumbs*/
#advertdetails {
	width:390px;
	float:left; /* DO NOT CHANGE */
	margin-right:5px;
	background-color:#FFF;	
}

#advertthumbswrapper {
	float:right; /* DO NOT CHANGE */
	width:172px;	
	overflow:hidden;
	margin-left: 5px;
	margin-right:50px;
	/*height:800px;*/
}

.advertthumbs {
	width:160px;
	float:left; /* DO NOT CHANGE */
	border:5px solid #000;
	min-height:220px;
	line-height: 220px;
	overflow:hidden;
	text-align:center;
	margin-bottom:5px;
	background-color:transparent;
    	border-radius: 15px;
}

.corrigefloat {
	clear:both;
}