/*
Theme Name: 	Starkers
Theme URI: 		http://viewportindustries.com/products/starkers
Description: 	The totally nude Wordpress theme!
Version: 		4.0
Author: 		Elliot Jay Stocks & Keir Whitaker
Author URI: 	http://viewportindustries.com
Tags: 			starkers, naked, clean, basic
*/

/*
===========================
CONTENTS:

01 Sensible defaults
02 Typography
03 Media queries 
===========================
*/

/* ---------------------------------------------------------------------------------------------------------- 
01 Sensible defaults ----------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */

@import "css/reset.css";

div,
article,
section,
header,
footer,
nav,
li					{ position:relative; /* For absolutely positioning elements within containers (add more to the list if need be) */ }
.group:after 		{ display:block; height:0; clear:both; content:"."; visibility:hidden; /* For clearing */ }
body 				{ 
    background-attachment: fixed;
    background-color: #000000;
    background-image: none;
    background-position: center top;
    background-repeat: repeat-x;
    color: #000000;
    font-family: "Helvetica",Arial,sans-serif;
    font-size: 12px;
    margin: 0;
    padding: 0;
    text-align: justify;
}
::-moz-selection 	{ background:#ff0; color:#333; }
::selection 			{ background:#ff0; color:#333; }

/* ---------------------------------------------------------------------------------------------------------- 
02 Typography -----------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */
/*

14 / 16	= 		0.875em 		(14px equivalent)
16 / 16	= 		1em 			(16px equivalent)
18 / 16 = 		1.125em 		(18px equivalent)
21 / 16 = 		1.3125em 		(21px equivalent)
24 / 16 = 		1.5em 			(24px equivalent)
30 / 16 = 		1.875em 		(30px equivalent)

*/

body,
input,
textarea 			{ /* We strongly recommend you declare font-weight using numerical values, but check to see which weights you're exporting first */ }

h1, 
h2, 
h3, 
h4, 
h5, 
h6 					{color: #F17DB1;font-weight: 400;line-height: 100%;margin: 0;word-wrap: break-word;}

h1	 				{font-size: 225%;line-height: 1em;margin-bottom: 1em;text-align: left;}
h2 					{font-size: 200%;line-height: 1em;margin-bottom: 1em;text-align: left;}
	h2.grey			{color: #6D6E71;}
h3					{line-height: 162.5%;}	
a					{text-decoration: none;color: #FFFFF;}
a:hover, 
a:active,
.current-menu-item a {color: #F17DB1;}
.current_page_item a {color: #F17DB1 !important;}
.current-menu-ancestor a{color: #F17DB1;}
.current-menu-ancestor ul li a {color: #FFFFFF;}
a:focus  			{ outline: none; }

hr 					{border-top: 1px solid #F17DB1;float: left;width: 100%;clear: both;height: 1px;margin: 30px auto 35px;}

#bg {
  position: fixed; 
  top: -50%; 
  left: -50%; 
  width: 200%; 
  height: 200%;
	z-index: -1;  
}
#bg img {
  position: absolute; 
  top: 0; 
  left: 0; 
  right: 0; 
  bottom: 0; 
  margin: auto; 
  min-width: 50%;
  min-height: 50%;
}

div#contact img.wpcf7-form-control {margin:0 !important;}

div.socialnet {float:right;width:200px;margin-top:-4px;}
div.socialnet a {margin-left:9px;float:left;}
div.socialnet a img {width:20px;height:20px;border:none;}


/* ---------------------------------------------------------------------------------------------------------- 
03 Media queries (using a mobile-first approach) ------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */

@media screen and (max-width:768px) and (min-width:400px) {
	div#logo 							{float:left !important;padding:15px;clear:both;}
	h2								{margin-top:1em;}
	div#nav-primary 					{margin-left:15px !important;margin-top:25px;float:left;width:450px;}
	div.poeme 						{float: left;margin-left:-25px !important;width: 480px;}
	div.contact_homepage 				{float: left;margin-left:15px;margin-bottom: 20px;width: 450px;}	
}

/* 400 and down */
@media screen and (max-width:400px) {
	.page-content 					{background-color: #FFFFFF;color: #000000;font-size: 100%;line-height: 162.5%;margin: 0 auto;padding: 15px;}
	h2								{margin-top:1em;}

	div.rowheader 					{height: 100%;}
	div.contact_homepage 				{display:none;}
	div#logo 							{margin:0px;padding:15px;}
		div.logo						{width:100%;}
		div#logo div.logo img			{border: 0 none;max-width: 100%;vertical-align: middle;}
	div.page_quote 					{clear: both;float: right;margin-bottom: 15px;margin-top: 10px;}
	div.page_quote_text 				{color: #F17DB1;font-family: 'fferikrighthandcaps';font-size: 30px;letter-spacing: 2pt;text-align: right;width: 100%; line-height: 25px;}
	div.page_quote_name 				{font-family: "Helvetica";font-size: 1em;margin-top: 10px;text-align: right;width: 100%;}
	div.poeme 						{margin:15px auto;width:99%!important;}

	div.copyright 					{padding-top: 0px;}
	div.slogan 						{text-align: left; margin-bottom: 15px;float: left !important;font-size:8px !important;}
		span.different 				{color: #F17DB1;font-weight: 700;}
		span.tangible 				{color: #DDDBD8;font-weight: 700;}

	div#contact 						{clear: both;margin-top: 1em;}	
	.page-content a					{color: #F17DB1;}
	.page-content img 				{display: block;height: auto;margin: auto;max-width: 100%;}
	.page-content img.float_right	{float: right;}
	.page-content img.left			{margin:0px !important;}
	.footer_home					{background:transparent!important;padding-left:10px;padding-right:10px;margin-top:70px;}
	.homepage_content				{padding-top:0px;}
	span.christopherhandregular    	{color: #F17DB1;font-family: 'fferikrighthandcaps';font-size: 30px;}
	span.magenta 					{color: #F17DB1;line-height: 162.5%;}
	img.contact_img 					{float: right !important;padding-top: 20px !important;}		
	
	div#nav-primary 					{ margin-left:0px;margin-top:25px;float:left;width:450px;}
	div#nav-secondary 				{ margin-right:-28px;margin-top:30px;float:left;}

	ul.menu 							{-webkit-font-smoothing:antialiased;list-style-position: inside;list-style: none;margin: 0;padding: 0;}
	ul.menu a 						{font-family: "Helvetica",Arial,sans-serif;font-size: 13px;font-weight: 700;text-transform: lowercase;}
	ul.menu li 						{border-right:2px solid #FFFFFF;float: left;letter-spacing: 0.1px;list-style: none outside none;margin: 0 0 0 3px;padding: 0 5px 0 3px;position: relative}
	ul.menu li:first-child 			{margin: 0 0 0 0;padding: 0 7px 0 0;}
	ul.menu li:last-child 				{border:none !important;}
	ul.menu li.menu-item-has-submenu 	{margin: 0;}
	ul.menu li ul 						{width:250px;float: left;left: 0;opacity: 0;position: absolute;visibility: hidden;z-index: 1;top: 20px;}
	ul.menu li:hover ul.sub-menu		{opacity: 1;visibility: visible;}
	ul.menu li ul.sub-menu 				{	visibility: hidden;
										-moz-transition:opacity 0.2s 0.1s ease-out, visibility 0.1s 0.1s linear; 
										-webkit-transition:opacity 0.3s ease-out, visibility 0.1s 0.1s linear;
										-o-transition:opacity 0.3s ease-out, visibility 0.1s 0.1s linear;										
										transition:opacity 0.3s ease-out, visibility 0.1s 0.1s linear;
									}
	ul.menu li ul.sub-menu li				{	float: none;width: 100%;margin:0px;padding:0px;border:none;
										-moz-transition:opacity 0.1s 0.15s ease-out, margin 0.3s 0.1s ease-out;
										-webkit-transition:opacity 0.1s 0.15s ease-out, margin 0.3s 0.1s ease-out;
										-o-transition:opacity 0.15s 0.15s ease-out, margin 0.3s 0.1s ease-out;
										transition:opacity 0.15s 0.15s ease-out, margin 0.3s 0.1s ease-out;
									}
	ul.menu li ul.sub-menu li a 			{	display: block;font-weight: 700;padding: 3px 0;
										-moz-transition:color 0.1s ease-out;
										-webkit-transition:color 0.1s ease-out;
										-o-transition:color 0.1s ease-out;
										transition:color 0.1s ease-out;
									}
			
	.page-content ul 					{list-style-image: url("./images/bullet-50.gif");margin-left: 20px;list-style-position: outside;}	
	.page-content  ul li				{display: list-item;list-style-position: outside;list-style: inherit;  margin-bottom: 13px;}

}

/* 400 and up */
@media screen and (min-width:400px) {
	.page-content 					{background-color: #FFFFFF;color: #000000;font-size: 100%;line-height: 162.5%;margin: 0 auto;padding: 25px;}
	div.rowheader 					{height:285px;}
	div#logo 							{clear: both;margin-right:-28px; margin-top: -20px;float:right;}
		div.logo						{width:100%;}
	div.page_quote 					{clear: both;float: right;margin-bottom:15px;margin-top: 25px;}
	div.page_quote_text 				{color: #F17DB1;font-family: 'fferikrighthandcaps';font-size: 30px;letter-spacing: 2pt;text-align: right;width: 100%; line-height: 25px;}
	
	div.page_quote_name 				{font-family: "Helvetica";font-size: 1em;margin-top: 10px;text-align: right;width: 100%;}
	div.poeme 						{float: left;margin-left: -43px;width: 500px;}
	div.contact_homepage 				{float: left;margin-bottom: 20px;width: 450px;}
	div.copyright 					{padding-top: 0px;}	
	.footer_home div.copyright 		{margin-top: 3px;}	
	div.slogan 						{text-align: right; margin-bottom: 15px;float: right !important;}
		span.different 				{color: #F17DB1;font-size: 130%;font-weight: 700;}
		span.tangible 				{color: #DDDBD8;font-size: 130%;font-weight: 700;}
	div#contact 						{clear: both;margin-top: 1em;}	
	.page-content a					{color: #F17DB1;}
	.page-content img 				{display: block;height: auto;margin: auto;max-width: 100%;}
	.page-content img.float_right	{float: right;}
	.page-content img.left			{margin:0px !important;}
	.footer_home					{background:transparent!important;padding-left:0px;padding-right:0px;padding-top:50px;}
	.homepage_content				{padding-top:190px;}
	span.christopherhandregular    	{color: #F17DB1;font-family: 'fferikrighthandcaps';font-size: 30px;}
	span.magenta 					{color: #F17DB1;line-height: 162.5%;}
	img.contact_img 					{float: right !important;padding-top: 20px !important;}		
		
	div#nav-primary 					{ margin-left:0px;margin-top:25px;float:left;width:450px;}
	div#nav-secondary 				{ margin-right:-28px;margin-top:30px;float:left;}
	div.menu-top-left-menu-container	{ width:250px;}

	ul.menu 							{-webkit-font-smoothing:antialiased;list-style-position: inside;list-style: none;margin: 0;padding: 0;}
	ul.menu a 						{font-family: "Helvetica",Arial,sans-serif;font-size: 13px;font-weight: 700;text-transform: lowercase;}
	ul.menu li 						{border-right:2px solid #FFFFFF;float: left;letter-spacing: 0.1px;list-style: none outside none;margin: 0 0 0 3px;padding: 0 5px 0 3px;position: relative}
	ul.menu li:first-child 			{margin: 0 0 0 0;padding: 0 7px 0 0;}
	ul.menu li:last-child 				{border:none !important;}

	ul.menu li.menu-item-has-submenu 	{margin: 0;}
	ul.menu li ul 						{width:250px;float: left;left: 0;opacity: 0;position: absolute;visibility: hidden;z-index: 1;top: 20px;}
	ul.menu li:hover ul.sub-menu		{opacity: 1;visibility: visible;}
	ul.menu li ul.sub-menu 				{	visibility: hidden;
										-moz-transition:opacity 0.2s 0.1s ease-out, visibility 0.1s 0.1s linear; 
										-webkit-transition:opacity 0.3s ease-out, visibility 0.1s 0.1s linear;
										-o-transition:opacity 0.3s ease-out, visibility 0.1s 0.1s linear;										
										transition:opacity 0.3s ease-out, visibility 0.1s 0.1s linear;
									}
	ul.menu li ul.sub-menu li				{	float: none;width: 100%;margin:0px;padding:0px;border:none;
										-moz-transition:opacity 0.1s 0.15s ease-out, margin 0.3s 0.1s ease-out;
										-webkit-transition:opacity 0.1s 0.15s ease-out, margin 0.3s 0.1s ease-out;
										-o-transition:opacity 0.15s 0.15s ease-out, margin 0.3s 0.1s ease-out;
										transition:opacity 0.15s 0.15s ease-out, margin 0.3s 0.1s ease-out;
									}
	ul.menu li ul.sub-menu li a 			{	display: block;font-weight: 700;padding: 3px 0;
										-moz-transition:color 0.1s ease-out;
										-webkit-transition:color 0.1s ease-out;
										-o-transition:color 0.1s ease-out;
										transition:color 0.1s ease-out;
									}
	.page-content ul 					{list-style-image: url("./images/bullet-50.gif");margin-left: 20px;list-style-position: outside;}	
	.page-content  ul li				{display: list-item;list-style-position: outside;list-style: inherit;  margin-bottom: 13px;}

}

/* Clearfix */

.menu:after, .menu:before {
    content:"";
    display:table;
}
.menu:after {
    clear:both;
}
.menu {
    zoom:1;
}

.clearfix {clear:both;}
.h0 {height:0px !important;}

/* Formulaire  */
.ajax-loader{display:none!important;}
.wpcf7 input[type=submit][disabled=disabled],.wpcf7 input[type=reset][disabled=disabled],.wpcf7 button[disabled=disabled],.wpcf7 input[type=submit]:disabled,.wpcf7 input[type=reset]:disabled .wpcf7 button:disabled{color:#AAAAAA;}
.wpcf7-acceptance-message{margin-left:10px;}
.wpcf7-form .wpcf7-list-item{display:block;margin:0!important;}
.wpcf7-form .wpcf7-select,.wpcf7-form .wpcf7-textarea{font-family:Helvetica,Arial,sans-serif;}
.wpcf7-form input,.wpcf7-form textarea{-moz-box-sizing:border-box;background:none repeat scroll 0 0 transparent;border:1px solid #D9DCDD;font-family:Helvetica,Arial,sans-serif;margin:0;padding:7px;}
.wpcf7-form label > span[class*=acceptance]{float:left;}
.wpcf7-form label,.wpcf7-list-item-label{font-size:75%;font-weight:700;}
.wpcf7-form label[for*=acceptance]{clear:both;display:block;min-height:25px;}
.wpcf7-form p{display:block;font-weight:600;margin:0 0 10px;}
.wpcf7-form textarea{min-height:150px;}
.wpcf7-form textarea,.wpcf7-form input[type=text],.wpcf7-form input[type=file]{width:245px;}
.wpcf7-form-control-wrap{display:block;}
.wpcf7-not-valid{border:1px solid #F17DB1!important;}
.wpcf7-not-valid-tip{bottom:0;display:none;margin:auto;right:10px;top:0!important;}
.wpcf7-quiz-label{color:#AAAAAA;display:block;font-size:68.75%;margin-bottom:10px;}
.wpcf7-response-output{-moz-box-sizing:border-box;float:left;margin:0!important;padding:1% 2%!important;width:100%;}
.wpcf7-response-output.wpcf7-mail-sent-ok,.wpcf7-response-output.wpcf7-validation-errors{border:0 none!important;color:#F17DB1;font-size:100%;margin-bottom:3em!important;width:100%;}
input.wpcf7-submit{border:0 none!important;color:#F17DB1;float:left;font-size:200%;font-weight:400;line-height:100%;margin:0;word-wrap:break-word;}
input.wpcf7-submit:hover{color:#F17DB1;}

ul.menu li#menu-item-43.menu-item	{border:none !important;}
ul.menu li#menu-item-22.menu-item 	{border:none !important;}