/*==================================================================================*/
/*==================================================================================*/
/* Template Name: Attraction Coming Soon											*/
/* Description: Attraction Coming Soon is a template purely div based, that can  	*/
/* 			meet any demands and variations in order to acheive your expectations.	*/
/* Author: MenteCriativa 															*/
/* Author URI: http://themeforest.net/user/MenteCriativa							*/
/* Version: 1.0 																	*/
/*==================================================================================*/
/* Detailed index for all css elements 												*/
/*==================================================================================*/
/*				==========															*/
/* 1. 	Body	 &    Random														*/
/* 1.1		body and misc settings													*/
/* 1.2		removing borders from all images										*/
/*				==========															*/
/* 2.	Counter																		*/
/* 2.1 		top right counter wrap div definitions									*/
/* 2.2 		top right counter div definitions 										*/
/*				==========															*/
/* 3. 	Social Icons 																*/
/* 3.1		defining positions for social icons wrap 								*/
/* 3.2		styling the list for social icons		 								*/
/* 3.3		styling links for social icons			 								*/
/* 3.3		styling the display effect onMouseOver 								 	*/
/*				==========															*/
/* 4 	Content 																	*/
/* 4.1 		starting positions for middle content									*/
/* 4.2 		big title for coming soon												*/
/* 4.3 		small intro to message that follows										*/
/* 4.4 		main message for the visitor											*/
/*				==========															*/
/* 5 	Subscribe 																	*/
/* 5.1 		subscribe positioning													*/
/* 5.2 		style for e-mail text box												*/
/* 5.3 		style for e-mail button													*/
/*				==========															*/
/* 6 	Middle Scripts																*/
/* 6.1 		positioning the div to receive scripts									*/
/*				==========															*/
/* 7 	Contact Form																*/
/* 7.1 		contact form general positioning										*/
/* 7.2 		position for message icon												*/
/* 7.3 		style for NAME text box of contact form									*/
/* 7.4 		style for E-MAIL text box of contact form								*/
/* 7.5 		style for MESSAGE text box of contact form								*/
/* 7.6 		style for SEND BUTTON text box of contact form							*/
/* 7.7 		style and position for success or error message							*/
/*				==========															*/
/* 8 	Twitter Feed																*/
/* 8.1 		positioning the div to receive script									*/
/* 8.2 		styling feed content													*/
/* 8.3 		styling links on feed													*/
/* 8.4 		styling links 'hover'													*/
/* 8.5 		defining avatar positioning to text										*/
/* 8.6 		styling the list, removing bullets, etc									*/
/* 8.7 		styling twit in order to show another bg color on pair					*/
/*				==========															*/
/* 9 	Company Logo and/or Name													*/
/* 9.1 		positioning the div to receive content									*/
/* 9.2 		defining logo position													*/
/*				==========															*/
/* 10 	Copyright & Text on Bottom													*/
/* 10.1 	positioning the div fixed on bottom										*/
/* 10.2 	aligning copyright text													*/ 
/*				==========															*/
/* 11. Background Slider CSS - Check description for Author Info					*/
/* 12. Menu Top																		*/
/* 13. Page - ABout Us																*/
/*==================================================================================*/



/*==================================================================================*/
/* 1. 	Body	 &    Random													 	*/
/*==================================================================================*/

/* 1.1	misc settings like if it was needed										 	*/
textarea { overflow: auto; }

p {
	margin:0;
	padding:0;
}

body, html {
	background-color:#333;
	margin:0;
	padding:0;
	background-size: 100%;
}

/* 1.2	removing borders from all images										 	*/
img {
	border-style: none;
	margin:0px;
}


/* 1.4	line effect on the top, centered by %									 	*/
#top {
	position:fixed;
	top:0px;
	width: 90%;
	left: 50%;
	margin-left: -45%;
	height:5px;
	z-index: 1000;
}


/*==================================================================================*/
/* 2.	Counter																		*/
/*==================================================================================*/

/* 2.1 	top right counter wrap div definitions										*/
#counterwrap {
	position: fixed !important;
	top: 115px;
	right: -115px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
	-o-transform: rotate(45deg);
	width: 500px;
	padding: 10px 10px 10px 10px;
	
}
/* 2.2 top right counter div definitions 											*/
#counter {
	position: relative;
	left: 50%;
	margin-left: -200px;
	width: 400px;
	font: 18px 'Doppio One', sans-serif;
	color: #FFFFFF;
}


/*==================================================================================*/
/* 3. 	Social Icons 																*/
/*==================================================================================*/

/* 3.1	defining positions for social icons wrap 									*/
#social {
	position:fixed;
	padding: 5px 5px 0px 5px;
	border-radius: 0px 0px 3px 3px;
	top:5px;
	width: auto;
	right: 6%;
	height:20px;
	z-index: 999;
}

/* 3.2	styling the list for social icons		 									*/
#social ul {
	list-style-type: none;
	margin: 0px;
	padding: 0px; 
}
#social li {
	position: relative;
	list-style: none;
	top:0px;
	margin: 0 3px;
	float: left;

}

/* 3.3	styling links for social icons			 									*/
#social a {
	display: block;
	color: #000000;
	width: 16px;
	text-decoration: none;
}

/* 3.3	styling the display effect onMouseOver 									 	*/
#social li em {
	position: absolute;
	width: 50px;
	height: 20px;
	top: 55px;
	display: none;
	left: -20px;
	background:url(../imgs/social/bg_over.png) no-repeat;
	padding-top: 3px;
	text-align: center;
	font: 10px 'Doppio One', sans-serif;
	color: #FFFFFF;
}

/*==================================================================================*/
/* 4 Content 																		*/
/*==================================================================================*/

/* 4.1 starting positions for middle content										*/
#desc {
	position:absolute;
	top: 40px;
	left:110px;
	width:520px;
}

#desc a {
	text-decoration:none;
}


/* 4.2 big title for coming soon													*/
.title {
	font: 35px 'Doppio One', sans-serif;

}

/* 4.3 small intro to message that follows											*/
/* 4.4 main message for the visitor													*/
.descri, .descri2 {
	font: 18px 'Doppio One', sans-serif;
}





/*==================================================================================*/
/* 5 Subscribe 																		*/
/*==================================================================================*/

/* 5.1 subscribe positioning														*/
#subs {
	position:absolute;
	top: 260px;
	left:110px;
	width:495px;
	
	height:35px;
	
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	-khtml-border-radius: 2px;	
	border-radius: 2px;
	
	border:none;
	
	box-shadow: inset 1px 1px 5px 2px rgba(0,0,0,0.6);
	-moz-box-shadow: inset 1px 1px 5px 2px rgba(0,0,0,0.6);
	-webkit-box-shadow: inset 1px 1px 5px 2px rgba(0,0,0,0.6);
	
	padding-left: 5px;
	padding-bottom: 2px;
	
}

/* 5.2 style for e-mail text box													*/
#subsbox {
	height:35px;	
	border:none;
	font: 13px 'Doppio One', sans-serif;
}

/* 5.3 style for e-mail button														*/
#buttonadd {
	position:absolute;	
	right:3px;
	width:90px;
	height:30px;
	box-shadow: inset 1px 1px 1px rgba(0,0,0,0.6);
	-moz-box-shadow: inset 1px 1px 1px rgba(0,0,0,0.6);
	-webkit-box-shadow: inset 1px 1px 1px rgba(0,0,0,0.6);
	padding-bottom:2px;	
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	-khtml-border-radius: 2px;	
	border-radius: 2px;
	border:none;
	border: 1px 0px 1px 0px solid #fff;
	font: 13px 'Doppio One', sans-serif;
	margin-top: 4px;
}
.dotline1 { 
	border-bottom: 1px dashed #ffffff; 
	width: 500px; 
	position:absolute;
	top: 335px;
	left: 110px;
} 


/*==================================================================================*/
/* 6 Middle Scripts																	*/
/*==================================================================================*/

/* 6.1 positioning the div to receive scripts										*/


/*==================================================================================*/
/* 7 Contact Form																	*/
/*==================================================================================*/

/* 7.1 contact form general positioning												*/

#contit{
	position:absolute;
	top: 0px;
	left: 0px;
	height: 25px;
	width: 493px;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	-khtml-border-radius: 2px;	
	border-radius: 2px;
	color:#FFFFFF;
	font: 11px 'Doppio One', sans-serif;
	line-height: 25px;
	padding-left: 5px;
	border: 1px solid rgba(255, 255, 255, 1);
	vertical-align:middle;
	z-index: 100;
}
#contact {
	position:absolute;
	top: 375px;
	left: 110px;
	height: 180px;
	width: 510px;
	font-size: 6px;
	font: 7px 'Doppio One', sans-serif;
}
.hide {
	float:left;
	font-size: 6px;
	font: 7px 'Doppio One', sans-serif;
	position:absolute;
	top: 2px;
	left: 475px;
	z-index: 101;
}
.show {
	position:absolute;
	top: 385px;
	left: 110px;
	font-size: 6px;
	font: 7px 'Doppio One', sans-serif;
	z-index:99;
}
.comment-required {
	position:absolute;
	top: 68px;
	left: 398px;
	z-index: 102;
}
.name-required {
	position:absolute;
	top: 23px;
	left: 212px;
	z-index: 102;
}
.email-required {
	position:absolute;
	top: 23px;
	left: 467px;
	z-index: 102;
}


/* 7.2 position for message icon													*/
#msgimg {
	position:absolute;
	right:465px;
	top: -30px;
	z-index: -1;
	
}

/* 7.3 style for NAME text box of contact form										*/
#name, #mail {
	width:240px;
	height:35px;	
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	-khtml-border-radius: 2px;	
	border-radius: 2px;
	border:none;
	box-shadow: inset 1px 1px 5px 2px rgba(0,0,0,0.6);
	-moz-box-shadow: inset 1px 1px 5px 2px rgba(0,0,0,0.6);
	-webkit-box-shadow: inset 1px 1px 5px 2px rgba(0,0,0,0.6);
	padding-left: 5px;
	padding-bottom: 2px;
	font: 13px 'Doppio One', sans-serif;

}
/* 7.4 style for E-MAIL text box of contact form									*/
#mail {
	position:absolute;
	width:240px;
	top: 35px;
	left: 255px;
}
#name {
	position:absolute;
	width:240px;
	top: 35px;
	left: 0px;
}

/* 7.5 style for MESSAGE text box of contact form									*/
#message {
	position:absolute;
	width:425px;
	height:80px;	
	top: 80px;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	-khtml-border-radius: 2px;	
	border-radius: 2px;
	border:none;
	box-shadow: inset 1px 1px 5px 2px rgba(0,0,0,0.6);
	-moz-box-shadow: inset 1px 1px 5px 2px rgba(0,0,0,0.6);
	-webkit-box-shadow: inset 1px 1px 5px 2px rgba(0,0,0,0.6);
	padding-left: 5px;
	padding-bottom: 2px;
	font: 13px 'Doppio One', sans-serif;
}

/* 7.6 style for SEND BUTTON text box of contact form								*/
#submit-form {
	top: 78px;
	left: 440px;
	width: 60px;
	height:40px;
}

#reseting {
	top: 129px;
	left: 440px;
	width: 60px;
	height:30px;
}

#submit-form, #reseting {
	position:absolute;
	box-shadow: inset 1px 1px 1px rgba(0,0,0,0.6);
	-moz-box-shadow: inset 1px 1px 1px rgba(0,0,0,0.6);
	-webkit-box-shadow: inset 1px 1px 1px rgba(0,0,0,0.6);
	padding-bottom:2px;	
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	-khtml-border-radius: 2px;	
	border-radius: 2px;
	border:none;
	border: 1px 0px 1px 0px solid #fff;
	font: 13px 'Doppio One', sans-serif;
	margin-top: 4px;
}
/* 7.7 style and position for success or error message								*/
#success {
	position:relative;
	top: -10px;
	font: 10px 'Doppio One', sans-serif;
}

/*==================================================================================*/
/* 8 Twitter Feed																	*/
/*==================================================================================*/

/* 8.1 positioning the div to receive script										*/
#tweetwrap {
	position:absolute;
	top: 375px;
	left: 180px;
	width:430px;
	height:70px;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	-khtml-border-radius: 2px;	
	border-radius: 2px;
	border:none;
	box-shadow: inset 1px 1px 5px 2px rgba(0,0,0,0.6);
	-moz-box-shadow: inset 1px 1px 5px 2px rgba(0,0,0,0.6);
	-webkit-box-shadow: inset 1px 1px 5px 2px rgba(0,0,0,0.6);
}

#tweetimg {
	position:relative;
	top: -14px;
	left: -70px;
}

#tweetbox {
	position:absolute;
	height:70px;
	position:absolute;
}

#ticker {
	position:absolute;
	top: 10px;
	left: -30px;
	font: 10px 'Doppio One', sans-serif;
	text-decoration:none;
}

#ticker ul.tweet_list {
	width: 415px;
	height:40px;
	overflow-y:hidden;
	font: 10px 'Doppio One', sans-serif;
	text-decoration:none;
}

#ticker .tweet_list li {
	height: 50px;
}

#cof {
	position:absolute;
	left:40px; 
}

/* 8.3 styling links on feed														*/
#ticker a {
	text-decoration: none;
	font: 10px 'Doppio One', sans-serif;
}

/* 8.4 styling links 'hover'														*/
#ticker a:hover {
	font: 10px 'Doppio One', sans-serif;
}

/* 8.6 styling the list, removing bullets, etc										*/
.tweet_list{
    float: left;
	list-style:none;
	left: -10px;
	overflow-y: hidden;
	p
}
.tweet_avatar {
    float: left;
	list-style:none;
	left: 0px;
	overflow-y: hidden;
	padding-right: 5px;
}


/*==================================================================================*/
/* 9 Company Logo and/or Name														*/
/*==================================================================================*/

/* 9.1 positioning the div to receive content										*/
#logopos {
	left: -10px;
}

/* 9.2 defining logo position														*/
#logo {
	height: 180px;
	position: absolute;
	bottom: 50px;
	right: 27%;
	font: 26px 'Doppio One', sans-serif;
	padding: 3px 3px 3px 3px;
}


/*==================================================================================*/
/* 10 Copyright & Text on Bottom													*/
/*==================================================================================*/

/* 10.1 positioning the div fixed on bottom											*/
#bottom {
	position:fixed;
	bottom:0px;
	width: 90%;
	left: 50%;
	margin-left: -45%;
	border-radius: 2px 2px 0px 0px;
	height:20px;
}

/* 10.2 aligning copyright text														*/
#copy {
	position:relative;
	top:3px;
	right: 10px;
	text-align:right;
	font: 10px 'Doppio One', sans-serif;
}



/*==================================================================================*/
/* 11. Background Slider CSS - check description									*/
/*==================================================================================*/
/* Following info is from script author:											*/
/* 																					*/
/* Easy fullscreen background slideshow in jQuery 									*/
/* By: Jasper Rooswinkel - www.jasperrooswinkel.com									*/
/* Feel free to use and distribute but this notice must stay intact					*/
/*==================================================================================*/
img#bg {
	/* Stretch background */
	position:fixed;
	top:0;
	left:0;
	width:100%;
	z-index:-15;
}
	
#bg_grid {
	position:fixed; /* This is very important! */
	top:0;
	left:0;
	height:100%;
	width:100%;
    background: url(../imgs/over.png) repeat;
	/* Display on top of background */
	z-index:-10;
}

#image_description {
	font: 9px 'Doppio One', sans-serif;
	position:fixed; /* This is very important! */
	right:-150px;
	bottom:50px;
	width:140px;
	height:30px;
	z-index:2;
	padding:5px;
	line-height:12px;
	border-radius: 2px 0px 0px 2px;
	background-color: rgba(0, 0, 0, 0.80);
}

/*==================================================================================*/
/* 12. Menu Top																		*/
/*==================================================================================*/

#menu {
	z-index: 1990;
	position:fixed;
	top:5px;
	left: 112px;
	padding: 7px 7px 7px 7px;
	font: 12px 'Doppio One', sans-serif;
	text-transform:uppercase;
	-moz-border-radius: 0px 0px 2px 2px;
	-webkit-border-radius: 0px 0px 2px 2px;
	-khtml-border-radius: 0px 0px 2px 2px;
	border-radius: 0px 0px 2px 2px;
}

#menu ul {
	
	list-style-type: none;
	margin: 0px;
	padding: 0px; 
}

#menu li {
	display: inline;
	left:-10px;
	list-style:none;
	padding: 5px 5px 7px 5px;
}

#menu li a{
	padding: 4px 4px 4px 4px;
	display: inline;
	left:-10px;
	list-style:none;
	font: 12px 'Doppio One', sans-serif;
	text-decoration:none;
}

#menu li a:hover {
	padding: 4px 4px 4px 4px;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	-khtml-border-radius: 2px;	
	border-radius: 2px;
}

/*==================================================================================*/
/* 13. Page - ABout Us																*/
/*==================================================================================*/


#aboutwrap {
	overflow : auto;
	z-index:1999;
	position:fixed;
	top: 5px;
	left:100px;
	height:100%;
	width:530px;
}



#textabout {
	font: 12px 'Oxygen', sans-serif;
	text-decoration:none;
	position:absolute;
	top:25px;
	left: 10px;
	text-align:justify;
	margin-right: 10px;
}
#miscabout {
	font: 12px 'Oxygen', sans-serif;
	text-decoration:none;
	position:absolute;
	top:225px;
	left: 10px;
	text-align:left;
}

.dotabout { 
	border-bottom: 1px dashed #ffffff; 
	width: 500px; 
	position:absolute;
	top: 200px;
	left: 10px;
} 

.hideabout {
	float:left;
	position:absolute;
	top: 10px;
	left: 490px;
	z-index: 101;
}

#container {
	width: 500px;
	display: table;
}

#row  {
	display: table-row;
}

#left {
	width:180px;
}
#left, #right, #middle {
	display: table-cell;
}


/* CSS For content of your new item */
/* New menu item requested by: aporias // this is only needed if your menu has a content window like the 'about us' menu */
#newitem {
	overflow : auto;
	z-index:1999;
	position:fixed;
	top: 5px;
	left:100px;
	height:100%;
	width:530px;
	background-color: rgba(0, 0, 0, 0.95);
}



#schemes {
	position:fixed;
	top: 200px;
	width: 50px;
	background-color: rgba(0, 0, 0, 0.5);
	padding: 6px 3px 3px 3px;
	text-align:center;
	font-family:Verdana, Geneva, sans-serif;
	font-size:9px;
	color:#FFF;
	border-radius: 0px 3px 3px 0px; 
}