/* Table of contents
-------------------------
- Base Styles
- Typography
- Links
- Buttons
- Forms
- Lists
- Code
- Tables
- Spacing
- Utilities
- Clearing
- Media Queries
*/

/* Base Styles
------------------------- */
/* NOTE */

html .PSOFOShop{
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
  
body .PSOFOShop{
  font-size: 14px; /* currently ems cause chrome bug misinterpreting rems on body element */
  line-height: 20px;
  font-weight: normal;
  font-family: Verdana, Helvetica, Arial, sans-serif;
  color: #333; }

/* Typography
------------------------- */
.PSOFOShop h1, .PSOFOShop h2, .PSOFOShop h3, .PSOFOShop h4, .PSOFOShop h5, .PSOFOShop h6 {
  margin-top: 0;
  margin-bottom: 10px;
  font-weight: 300; }
.PSOFOShop h1 { font-size: 24px; line-height: 28px; }
.PSOFOShop h2, .PSOFOShop #talentSendToAFriendFormLegend { font-size: 22px; line-height: 26px; }
.PSOFOShop h3 { font-size: 20px; line-height: 24px; }
.PSOFOShop h4 { font-size: 18px; line-height: 22px; }
.PSOFOShop h5 { font-size: 16px; line-height: 20px; }
.PSOFOShop h6 { font-size: 14px; line-height: 18px; }

.PSOFOShop p {
  margin-top: 0; }


/* Links
------------------------- */
.PSOFOShop a {
  color: #1EAEDB; }
.PSOFOShop a:hover {
  color: #0FA0CE; }


/* Buttons
------------------------- */
.PSOFOShop .button,
.PSOFOShop .btn,
.PSOFOShop button,
.PSOFOShop input[type="submit"],
.PSOFOShop input[type="reset"],
.PSOFOShop input[type="button"] {
  display: inline-block;
  height: 38px;
  padding: 0 30px;
  color: #333;
  text-align: center;
  font-size: 14px;
  font-weight: bold;
  line-height: 38px;
  text-decoration: none;
  white-space: nowrap;
  background-color: #BCBCBC;
  border-radius: 4px;
  border: 1px solid #BCBCBC;
  cursor: pointer;
  box-sizing: border-box; }
.PSOFOShop .button:hover,
.PSOFOShop .btn:hover,
.PSOFOShop button:hover,
.PSOFOShop input[type="submit"]:hover,
.PSOFOShop input[type="reset"]:hover,
.PSOFOShop input[type="button"]:hover,
.PSOFOShop .button:focus,
.PSOFOShop .btn:focus,
.PSOFOShop button:focus,
.PSOFOShop input[type="submit"]:focus,
.PSOFOShop input[type="reset"]:focus,
.PSOFOShop input[type="button"]:focus {
  color: #333;
  border-color: #EEEEEE;
  background-color: #EEEEEE;
  outline: 0; 
}

/* Forms
------------------------- */
.PSOFOShop input[type="email"],
.PSOFOShop input[type="number"],
.PSOFOShop input[type="search"],
.PSOFOShop input[type="text"],
.PSOFOShop input[type="tel"],
.PSOFOShop input[type="url"],
.PSOFOShop input[type="password"],
.PSOFOShop textarea,
.PSOFOShop select {
  min-height: 34px;
  padding: 6px 10px; /* The 6px vertically centers text on FF, ignored by Webkit */
  background-color: #fff;
  border: 1px solid #D1D1D1;
  border-radius: 4px;
  box-shadow: none;
  box-sizing: border-box; 
  width: 100%; 
  margin-bottom: 5px;
  }
/* Removes awkward default styles on some inputs for iOS */
.PSOFOShop input[type="email"],
.PSOFOShop input[type="number"],
.PSOFOShop input[type="search"],
.PSOFOShop input[type="text"],
.PSOFOShop input[type="tel"],
.PSOFOShop input[type="url"],
.PSOFOShop input[type="password"],
.PSOFOShop textarea {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none; }
.PSOFOShop textarea {
  min-height: 65px;
  padding-top: 6px;
  padding-bottom: 6px; }
.PSOFOShop input[type="email"]:focus,
.PSOFOShop input[type="number"]:focus,
.PSOFOShop input[type="search"]:focus,
.PSOFOShop input[type="text"]:focus,
.PSOFOShop input[type="tel"]:focus,
.PSOFOShop input[type="url"]:focus,
.PSOFOShop input[type="password"]:focus,
.PSOFOShop textarea:focus,
.PSOFOShop select:focus {
  border: 1px solid #33C3F0;
  outline: 0; }
.PSOFOShop label,
.PSOFOShop legend {
  display: inline-block;
  margin-bottom: 5px;
 }
.PSOFOShop fieldset {
  padding: 0;
  border-width: 0; }
.PSOFOShop input[type="checkbox"],
.PSOFOShop input[type="radio"] {
  display: inline; }
.PSOFOShop label > .label-body {
  display: inline-block;
  margin-left: .5rem;
  font-weight: normal; }
.PSOFOShop caption { text-align: left; }

/* Lists
------------------------- */
.PSOFOShop ul, .PSOFOShop dl {
  list-style: circle inside; }
.PSOFOShop ol {
  list-style: decimal inside; }
.PSOFOShop ol, .PSOFOShop ul, .PSOFOShop dl{
  padding-left: 0;
  margin-top: 0; }
.PSOFOShop dd { margin: 0; }
.PSOFOShop ul ul, 
.PSOFOShop dl dl,
.PSOFOShop ul ol,
.PSOFOShop ol ol,
.PSOFOShop ol ul {
  margin: 5px 0 0 15px;
  font-size: 14px; }
.PSOFOShop li, .PSOFOShop dd, .PSOFOShop dt {
  margin-bottom: 10px; }


/* Code
------------------------- */
code {
  padding: 10px;
  margin: 0;
  font-size: 12px;
  white-space: nowrap;
  background: #F1F1F1;
  border: 1px solid #E1E1E1;
  border-radius: 4px; }
pre > code {
  display: block;
  padding: 5px;
  white-space: pre; }


/* Tables
------------------------- */
.PSOFOShop th,
.PSOFOShop td {
  padding: 12px 15px;
  text-align: left;
  border-bottom: 1px solid #E1E1E1; }
.PSOFOShop th:first-child,
.PSOFOShop td:first-child {
  padding-left: 0; }
.PSOFOShop th:last-child,
.PSOFOShop td:last-child {
  padding-right: 0; }


/* Spacing
------------------------- */
.PSOFOShop button,
.PSOFOShop .button {
  margin-bottom: 5px; }
.PSOFOShop input,
.PSOFOShop textarea,
.PSOFOShop select,
.PSOFOShop fieldset {
  margin-bottom: 5; }
.PSOFOShop pre,
.PSOFOShop blockquote,
.PSOFOShop dl,
.PSOFOShop figure,
.PSOFOShop table,
.PSOFOShop p,
.PSOFOShop ul,
.PSOFOShop ol,
.PSOFOShop form {
  margin-bottom: 5; }


/* Utilities
------------------------- */
.PSOFOShop .u-full-width {
  width: 100%;
  box-sizing: border-box; }
.PSOFOShop .u-max-full-width {
  max-width: 100%;
  box-sizing: border-box; }
.PSOFOShop .u-pull-right {
  float: right; }
.PSOFOShop .u-pull-left {
  float: left; }


/* Misc
------------------------- */
.PSOFOShop hr {
  margin-top: 5px;
  margin-bottom: 5px;
  border-width: 0;
  border-top: 1px solid #E1E1E1; }


/* Clearing
------------------------- */

/* Self Clearing Goodness */
.PSOFOShop .container:after,
.PSOFOShop .row:after,
.PSOFOShop .u-cf {
  content: "";
  display: table;
  clear: both; }


/* Media Queries
------------------------- */

/* Larger than mobile */
@media (min-width: 400px) {}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {
	.PSOFOShop input[type="email"],
	.PSOFOShop input[type="number"],
	.PSOFOShop input[type="search"],
	.PSOFOShop input[type="text"],
	.PSOFOShop input[type="tel"],
	.PSOFOShop input[type="url"],
	.PSOFOShop input[type="password"],
	.PSOFOShop textarea,
	.PSOFOShop select {
		width: 30%;
		min-width: 100%;
	}	
	
}

/* Larger than tablet */
@media (min-width: 750px) {
	.PSOFOShop input[type="email"],
	.PSOFOShop input[type="number"],
	.PSOFOShop input[type="search"],
	.PSOFOShop input[type="text"],
	.PSOFOShop input[type="tel"],
	.PSOFOShop input[type="url"],
	.PSOFOShop input[type="password"],
	.PSOFOShop textarea,
	.PSOFOShop select {
		min-width: 200px;
	}
	
	.PSOFOShop .one-third input[type="email"],
	.PSOFOShop .one-third input[type="number"],
	.PSOFOShop .one-third input[type="search"],
	.PSOFOShop .one-third input[type="text"],
	.PSOFOShop .one-third input[type="tel"],
	.PSOFOShop .one-third input[type="url"],
	.PSOFOShop .one-third input[type="password"],
	.PSOFOShop .one-third textarea,
	.PSOFOShop .one-third select {
		width: 100%;
		min-width: 100%;
	}
}

/* Larger than desktop */
@media (min-width: 1000px) {}

/* Larger than Desktop HD */
@media (min-width: 1200px) {}
